/* 独立工作台布局；颜色全部来自 style.css 的八主题变量，不得写死白底 */
.wb-shell { max-width: 1480px; margin: 0 auto; padding: 0 22px 44px; }
.wb-disclaimer { margin-top: 18px; padding: 11px 14px; border: 1px solid var(--warn); background: var(--warnsoft); color: var(--ink2); font-size: 12px; }
.wb-disclaimer b { color: var(--ink); }

.wb-grid { display: grid; grid-template-columns: 280px minmax(0, 1fr); gap: 18px; align-items: start; }
.wb-sidebar { position: sticky; top: 78px; padding: 13px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); box-shadow: var(--shadow); }
.wb-sidebar h3 { margin: 0 0 10px; font-size: 14px; }
.wb-sidebar hr { border: 0; border-top: 1px solid var(--line); margin: 14px 0; }
.wb-main { min-width: 0; }

/* 多标签面板：键盘可达，窄屏横向滚动 */
.wb-tabs { display: flex; gap: 5px; overflow-x: auto; margin-bottom: 14px; padding-bottom: 2px; }
.wb-tabs button {
  border: 1px solid var(--line); background: var(--panel2); color: var(--ink2);
  border-radius: 8px; padding: 7px 11px; font: inherit; font-size: 12px; cursor: pointer; white-space: nowrap;
}
.wb-tabs button[aria-selected="true"] { background: var(--acsoft); border-color: var(--acline); color: var(--ac1); font-weight: 800; }
.wb-tabs button:focus-visible, .wb-panel button:focus-visible, .wb-panel input:focus-visible,
.wb-panel select:focus-visible, .wb-panel textarea:focus-visible { outline: 2px solid var(--ac1); outline-offset: 2px; }

.wb-panel { padding: 16px; margin-bottom: 16px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); box-shadow: var(--shadow); }
.wb-panel h3 { margin: 0 8px 0 0; flex: 1; min-width: 180px; font-size: 15px; }
.wb-panel h4 { margin: 0 0 8px; font-size: 12.5px; color: var(--ink); }
.wb-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; }

.wb-help { color: var(--ink3); font-size: 11.5px; line-height: 1.7; margin: 0 0 10px; }
.wb-status { min-height: 22px; margin: 6px 0 10px; font-size: 12px; color: var(--ink2); }
.wb-status[data-state="error"], .wb-status[data-state="conflict"], .wb-status[data-state="revoked"] { color: var(--err); }
.wb-status[data-state="connected"] { color: var(--ok); }
.wb-status[data-state="offline"], .wb-status[data-state="remote"], .wb-status[data-state="saving"] { color: var(--warn); }
.wb-account-state { font-size: 12px; color: var(--ink2); margin: 6px 0 10px; }

.wb-field { display: flex; flex-direction: column; gap: 5px; color: var(--ink2); font-size: 12px; font-weight: 700; margin-bottom: 10px; }
.wb-field input, .wb-field select, .wb-field textarea,
.wb-sidebar input, .wb-sidebar select, .wb-panel input, .wb-panel select, .wb-panel textarea {
  border: 1px solid var(--line); border-radius: 8px; background: var(--panel2); color: var(--ink); padding: 7px 9px; font: inherit; font-size: 12.5px;
}
.wb-field textarea { resize: vertical; min-height: 74px; }
.wb-side-form { display: flex; flex-direction: column; gap: 8px; }
.wb-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 14px; }

.wb-doc-list { display: flex; flex-direction: column; gap: 6px; margin-top: 12px; }
.wb-doc-item { display: flex; flex-direction: column; gap: 3px; align-items: flex-start; padding: 8px; border: 1px solid var(--line); border-radius: 8px; background: var(--panel2); color: var(--ink); text-align: left; cursor: pointer; }
.wb-doc-item:hover, .wb-doc-item[aria-current="true"] { border-color: var(--ac1); background: var(--acsoft); }
.wb-doc-item span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }
.wb-doc-item small { display: block; color: var(--ink3); font-size: 10.5px; }

.wb-role { font-size: 11px; color: var(--ink2); border: 1px solid var(--line); padding: 3px 8px; border-radius: 99px; }
.wb-role-owner { color: var(--ac1); border-color: var(--acline); }
.wb-role-viewer { color: var(--ink3); }

/* 编辑器：Monaco 或降级 textarea 共用同一容器高度 */
.wb-editor-host { min-height: 430px; border: 1px solid var(--line); border-radius: 9px; background: var(--panel2); overflow: hidden; }
.wb-editor-fallback { width: 100%; height: 430px; border: 0; outline: 0; resize: vertical; background: var(--panel2); color: var(--ink); padding: 14px; font: 12px/1.65 ui-monospace, SFMono-Regular, Consolas, monospace; }
.editor-status { padding: 5px 10px; color: var(--ink3); font-size: 11px; background: var(--panel2); border-bottom: 1px solid var(--line); margin: 0 0 8px; border-radius: 8px 8px 0 0; }
.editor-status-warn { color: var(--warn); background: var(--warnsoft); }

/* 冲突裁决三列 + 手动编辑 */
.wb-conflict { margin-top: 12px; }
.wb-conflict h4 { margin: 0 0 5px; color: var(--err); }
.wb-conflict p { margin: 0 0 10px; color: var(--ink2); font-size: 12px; }
.wb-conflict-columns { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.wb-conflict-columns label { display: flex; flex-direction: column; gap: 4px; font-size: 11px; color: var(--ink2); font-weight: 700; }
.wb-conflict-columns textarea { min-height: 180px; resize: vertical; font: 11px/1.5 ui-monospace, SFMono-Regular, Consolas, monospace; }

/* 版本 diff：Monaco 容器与纯文本 diff 共用输出区 */
.wb-version-controls { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.wb-version-controls select { min-width: 200px; max-width: 100%; flex: 1; }
.wb-diff-output { margin-top: 10px; }
.wb-diff-heading { font-size: 12px; color: var(--ink2); margin-bottom: 6px; font-weight: 700; }
.wb-monaco-diff { height: 480px; border: 1px solid var(--line); border-radius: 8px; overflow: hidden; }
.wb-diff-text { max-height: 560px; overflow: auto; margin: 0; padding: 10px; background: var(--panel2); font: 11px/1.6 ui-monospace, SFMono-Regular, Consolas, monospace; white-space: pre-wrap; }
.wb-diff-old { display: block; background: var(--errsoft); color: var(--err); }
.wb-diff-new { display: block; background: var(--oksoft); color: var(--ok); }
.wb-diff-text .context { display: block; color: var(--ink3); }

/* 多轮对话 */
.wb-chat { display: flex; flex-direction: column; gap: 10px; }
.wb-chat-round { border: 1px solid var(--line); border-radius: 9px; background: var(--panel2); padding: 10px; }
.wb-chat-round h4 { margin: 0 0 5px; font-size: 11.5px; color: var(--ink3); }
.wb-chat-round p { margin: 0; font-size: 12px; color: var(--ink2); }
.wb-chat-round pre { white-space: pre-wrap; word-break: break-word; margin: 4px 0 0; font: 12px/1.65 inherit; color: var(--ink); }
.wb-chat-round[data-status="failed"], .wb-chat-round[data-status="stopped"] { border-color: var(--err); }
.wb-chat-round[data-status="running"] { border-color: var(--ac1); }
.wb-chat-round button { margin-top: 8px; }
.wb-chat-input { min-height: 88px; resize: vertical; }

/* 隔离预览 */
.wb-preview-host { min-height: 260px; border: 1px solid var(--line); border-radius: 9px; background: var(--panel2); overflow: hidden; }
.wb-preview-host iframe { width: 100%; height: 360px; border: 0; background: var(--panel); }

.wb-member-list { display: grid; gap: 6px; margin-top: 10px; }
.wb-member { display: flex; align-items: center; gap: 8px; padding: 7px 9px; border: 1px solid var(--line); border-radius: 8px; font-size: 12px; }
.wb-member small { color: var(--ink3); }
.wb-empty { padding: 22px; text-align: center; color: var(--ink3); border: 1px dashed var(--line); border-radius: 9px; font-size: 12px; }
.wb-hidden { display: none !important; }

@media (max-width: 980px) {
  .wb-grid { grid-template-columns: 1fr; }
  .wb-sidebar { position: static; }
  .wb-split { grid-template-columns: 1fr; }
}
@media (max-width: 620px) {
  .wb-shell { padding: 0 12px 30px; }
  .wb-panel { padding: 12px; }
  .wb-conflict-columns { grid-template-columns: 1fr; }
  .wb-panel h3 { min-width: 130px; }
  .wb-editor-host { min-height: 350px; }
  .wb-editor-fallback { height: 350px; }
}
