/* ============================================================================
 * DS-C · 工作台展示层样式
 * 文件：client/static/workspace-view.css
 *
 * 沿用 client/static/index.html 的 Organic 深色 tokens（暖黑底 + 赤陶强调色 +
 * 分级圆角 + 8px 网格），不重做品牌、不引入框架、不加载远程字体。
 * 所有变量都限定在 .dsv-root 作用域内，宿主页面已有同名 token 时取值一致。
 * ==========================================================================*/

.dsv-root{
  color-scheme:dark;
  --bg:#16130F; --surface:#1E1A15; --surface-2:#262119; --surface-3:#2E2820;
  --line:rgba(237,230,218,.09); --line-2:rgba(237,230,218,.16);
  --ink:#EDE6DA; --ink-2:#A89C8A; --ink-3:#7A7163;
  --accent:#D97742; --accent-dim:#B85F32; --accent-ink:#16130F;
  --ok:#7FA05A; --warn:#C08E3A; --bad:#C4614A;
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s6:24px; --s8:32px; --s12:48px;
  --r-card:18px; --r-btn:12px; --r-input:14px; --r-badge:999px;
  --t-fast:120ms; --t:240ms; --ease:cubic-bezier(.16,1,.3,1);
  --safe-b:env(safe-area-inset-bottom,0px);
  --font-display:Georgia,"Source Han Serif SC","Songti SC","SimSun",serif;
  --font-body:-apple-system,"PingFang SC","HarmonyOS Sans","Microsoft YaHei",system-ui,sans-serif;
  --font-num:ui-monospace,"SF Mono",Consolas,monospace;
  --nav-h:calc(var(--s12) + var(--s2) + var(--safe-b));

  position:relative; z-index:2;   /* 站到宿主页面的颗粒层之上 */
  box-sizing:border-box;
  margin:0 auto; max-width:1280px;
  padding:var(--s6) var(--s6) var(--s8);
  background:var(--bg); color:var(--ink);
  font:16px/1.62 var(--font-body);
  -webkit-font-smoothing:antialiased;
}
.dsv-root *{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
.dsv-root.dsv-evidence-component{position:static;z-index:auto;margin:0;max-width:none;padding:0;background:transparent;--ink-3:#A89C8A}
.dsv-root h1,.dsv-root h2,.dsv-root h3,.dsv-root h4,.dsv-root p,.dsv-root dl,.dsv-root dd,.dsv-root dt{margin:0}
.dsv-root ul{margin:0;padding-left:20px}
.dsv-root button,.dsv-root input,.dsv-root textarea,.dsv-root select{font:inherit;color:inherit}
.dsv-root :focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* ── 顶栏 ───────────────────────────────────────────────────────────── */
.dsv-top{display:flex;align-items:flex-start;gap:var(--s4);flex-wrap:wrap;
  justify-content:space-between;padding-bottom:var(--s3);border-bottom:1px solid var(--line)}
.dsv-brand{min-width:0}
.dsv-h1{font-family:var(--font-display);font-size:20px;font-weight:600;letter-spacing:.2px;line-height:1.3}
.dsv-brand .dsv-muted{margin-top:var(--s1)}
.dsv-who{display:flex;align-items:center;gap:var(--s3);flex-wrap:wrap;min-width:0}
.dsv-operator{font-weight:600;overflow-wrap:anywhere}
.dsv-muted{color:var(--ink-2);font-size:13.5px;line-height:1.7}
.dsv-num{font-family:var(--font-num);font-variant-numeric:tabular-nums;font-size:12.5px}
.dsv-meta{color:var(--ink-3);font-size:12.5px;overflow-wrap:anywhere}

/* ── 导航：桌面为分段按钮，手机为底部工具条 ─────────────────────────── */
.dsv-nav{display:flex;gap:var(--s2);flex-wrap:wrap;margin:var(--s4) 0}
.dsv-nav .dsv-btn{min-width:96px}

/* ── 按钮 ───────────────────────────────────────────────────────────── */
.dsv-btn{background:var(--surface-2);border:1px solid var(--line-2);color:var(--ink);
  border-radius:var(--r-btn);padding:var(--s2) var(--s4);min-height:44px;cursor:pointer;
  font-size:14px;line-height:1.3;transition:background var(--t-fast),color var(--t-fast),
  border-color var(--t-fast),transform var(--t-fast);overflow-wrap:anywhere;text-align:center}
.dsv-btn:active{background:var(--surface-3);transform:scale(.99)}
.dsv-btn:disabled{opacity:.45;cursor:not-allowed;transform:none}
.dsv-btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);font-weight:600}
.dsv-btn.primary:active{background:var(--accent-dim)}
.dsv-btn.ghost{background:var(--surface);color:var(--ink-2)}
.dsv-btn.ghost:active{color:var(--ink)}
.dsv-btn.on{background:var(--surface-3);border-color:var(--accent-dim);color:var(--accent);font-weight:600}
.dsv-btnrow{display:flex;gap:var(--s2);flex-wrap:wrap;margin-top:var(--s3)}

/* ── 状态条：失败 / 提示 / 忙碌 ────────────────────────────────────── */
.dsv-banner{margin:var(--s4) 0 0;padding:var(--s3) var(--s4);border-radius:var(--r-btn);
  border:1px solid var(--line-2);background:var(--surface);font-size:14px;line-height:1.7;
  white-space:pre-wrap;overflow-wrap:anywhere}
.dsv-banner.tone-error{border-color:var(--bad);color:#E8B5A8;background:var(--surface)}
.dsv-banner.tone-notice{border-color:var(--accent-dim);color:var(--ink)}
.dsv-banner.tone-busy{display:flex;align-items:center;gap:var(--s3);color:var(--ink-2)}
.dsv-spinner{flex:none;width:14px;height:14px;border-radius:50%;
  border:2px solid var(--line-2);border-top-color:var(--accent);animation:dsv-spin .75s linear infinite}
.dsv-elapsed{color:var(--ink-3);font-family:var(--font-num);font-size:12.5px}
@keyframes dsv-spin{to{transform:rotate(360deg)}}

/* ── 版面：两列 → 单列 ─────────────────────────────────────────────── */
.dsv-layout{display:grid;grid-template-columns:300px minmax(0,1fr);gap:var(--s6);margin-top:var(--s4)}
.dsv-side,.dsv-main{min-width:0}
.dsv-login{max-width:460px;margin:6vh auto 0}
.dsv-init{padding:2vh 0}
.dsv-panel,.dsv-subpanel{background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r-card);padding:var(--s6);margin-bottom:var(--s4);min-width:0}
.dsv-subpanel{background:transparent;border:0;border-top:1px solid var(--line);
  border-radius:0;padding:var(--s6) 0 0;margin:var(--s6) 0 0}
.dsv-h2{font-family:var(--font-display);font-size:18px;font-weight:600;line-height:1.35;overflow-wrap:anywhere}
.dsv-h3{font-size:15px;font-weight:600;color:var(--ink);margin-bottom:var(--s2)}
.dsv-case-head{display:flex;align-items:center;gap:var(--s3);flex-wrap:wrap;margin-bottom:var(--s3)}
.dsv-foot{margin-top:var(--s6);color:var(--ink-3);font-size:12.5px;line-height:1.7}
.dsv-panel>.dsv-muted,.dsv-subpanel>.dsv-muted{margin-bottom:var(--s3)}
.dsv-note{color:var(--ink-2);font-size:13.5px;line-height:1.7;border-left:2px solid var(--accent-dim);
  padding-left:var(--s3);margin-bottom:var(--s3)}

/* ── 表单：label 恒可见，触控 ≥44px ────────────────────────────────── */
.dsv-form-body{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s3)}
.dsv-field{display:flex;flex-direction:column;gap:var(--s1);grid-column:1 / -1;min-width:0}
.dsv-field.dsv-half{grid-column:span 1}
.dsv-field-label{display:block;font-size:13.5px;color:var(--ink-2)}
.dsv-field-hint{font-size:12.5px;color:var(--ink-3);line-height:1.6}
.dsv-input{width:100%;min-width:0;min-height:44px;padding:var(--s3) var(--s3);
  background:var(--bg);border:1px solid var(--line-2);border-radius:var(--r-input);
  color:var(--ink);font-size:15px;line-height:1.6;
  transition:border-color var(--t-fast),box-shadow var(--t-fast)}
.dsv-input::placeholder{color:var(--ink-3)}
textarea.dsv-input{min-height:88px;resize:vertical}
.dsv-input:focus{border-color:var(--accent-dim);box-shadow:0 0 0 3px rgba(217,119,66,.12);outline:none}
.dsv-input[type=number]{font-family:var(--font-num)}
.dsv-form-msg{min-height:0;margin-top:var(--s2);font-size:13.5px;line-height:1.6}
.dsv-form-msg.tone-bad{color:#E8B5A8}
.dsv-form-hint{margin-top:var(--s3)}
.dsv-row{display:flex;gap:var(--s3);flex-wrap:wrap;align-items:flex-end}

/* ── 卡片与列表 ────────────────────────────────────────────────────── */
.dsv-cards{display:grid;gap:var(--s3)}
.dsv-card{background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r-card);
  padding:var(--s4);min-width:0}
.dsv-card.is-current{border-color:var(--accent-dim)}
.dsv-card-head{display:flex;align-items:center;gap:var(--s2);flex-wrap:wrap;margin-bottom:var(--s2)}
.dsv-card-t{font-size:15px;font-weight:600;overflow-wrap:anywhere;min-width:0}
.dsv-card>.dsv-muted{margin-top:var(--s2)}
.dsv-card>.dsv-btn{margin-top:var(--s3)}
.dsv-chips{display:flex;gap:var(--s2);flex-wrap:wrap;margin:var(--s2) 0}
.dsv-chip{display:inline-flex;align-items:center;gap:var(--s1);font-size:12.5px;
  padding:2px var(--s2);border-radius:var(--r-badge);border:1px solid var(--line-2);
  background:transparent;color:var(--ink-2);max-width:100%;overflow-wrap:anywhere}
.dsv-chip.tone-ok{color:var(--ok);border-color:var(--ok)}
.dsv-chip.tone-bad{color:var(--bad);border-color:var(--bad)}
.dsv-chip.tone-warn{color:var(--warn);border-color:var(--warn)}
.dsv-chip.tone-info{color:var(--accent);border-color:var(--accent-dim)}
.dsv-chip.tone-muted{color:var(--ink-3)}

/* ── 键值渲染（覆盖情况、摘要、未知结构） ───────────────────────────── */
.dsv-kv{display:grid;gap:var(--s1);margin:var(--s2) 0}
.dsv-kv-row{display:grid;grid-template-columns:minmax(84px,140px) minmax(0,1fr);gap:var(--s3);
  padding:var(--s1) 0;border-bottom:1px solid var(--line);align-items:start}
.dsv-kv-row:last-child{border-bottom:0}
.dsv-kv-k{color:var(--ink-3);font-size:13px;overflow-wrap:anywhere}
.dsv-kv-k.is-gap{color:var(--warn);display:flex;gap:var(--s1);align-items:center;flex-wrap:wrap}
.dsv-kv-v{font-size:14px;color:var(--ink);overflow-wrap:anywhere;min-width:0}
.dsv-none{color:var(--ink-3)}
.dsv-bool{color:var(--ink-2)}
.dsv-list{font-size:14px;color:var(--ink-2);line-height:1.75}
.dsv-json{display:block;font-family:var(--font-num);font-size:12px;color:var(--ink-2);
  background:var(--bg);border:1px solid var(--line);border-radius:var(--r-btn);
  padding:var(--s2);max-height:180px;overflow:auto;overflow-wrap:anywhere;white-space:pre-wrap}

/* ── 折叠块 ─────────────────────────────────────────────────────────── */
.dsv-details{margin-top:var(--s3);border:1px solid var(--line);border-radius:var(--r-card);
  background:var(--bg);overflow:hidden}
.dsv-summary{cursor:pointer;padding:var(--s3) var(--s4);min-height:44px;display:flex;
  align-items:center;gap:var(--s2);color:var(--ink-2);font-size:13.5px;list-style:none;
  transition:background var(--t-fast)}
.dsv-summary::-webkit-details-marker{display:none}
.dsv-summary::before{content:"▸";color:var(--accent);font-size:11px;transition:transform var(--t-fast) var(--ease)}
.dsv-details[open]>.dsv-summary::before{transform:rotate(90deg)}
.dsv-summary:active{background:var(--surface-2)}
.dsv-details>*:not(summary){padding:0 var(--s4) var(--s4)}

/* ── 空状态：缺什么 + 为什么 + 怎么开始 ────────────────────────────── */
.dsv-empty{display:flex;flex-direction:column;align-items:flex-start;gap:var(--s2);
  padding:var(--s4);border:1px dashed var(--line-2);border-radius:var(--r-card);background:var(--bg)}
.dsv-empty-t{font-family:var(--font-display);font-size:16px;font-weight:600;color:var(--ink)}
.dsv-empty-p{color:var(--ink-2);font-size:13.5px;line-height:1.75;max-width:min(560px,100%)}

/* ── 提问与回答 ────────────────────────────────────────────────────── */
.dsv-messages{display:grid;gap:var(--s4);margin-bottom:var(--s4)}
.dsv-msg{padding:var(--s3) var(--s4);border:1px solid var(--line);background:var(--surface-2);
  border-radius:var(--r-card);min-width:0}
.dsv-msg.is-user{background:var(--surface-3);margin-left:auto;max-width:88%;
  border-radius:var(--r-card) var(--r-card) 6px var(--r-card)}
.dsv-msg-role{font-size:12.5px;color:var(--ink-3);margin-bottom:var(--s1)}
.dsv-prose{white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.78;font-size:15px;color:var(--ink)}
.dsv-clamp{max-height:260px;overflow-y:auto;padding-right:var(--s2);
  overscroll-behavior-y:contain;border-left:1px solid var(--line);padding-left:var(--s3)}
.dsv-inline-error{color:#E8B5A8;font-size:13.5px;line-height:1.7;white-space:pre-wrap;
  overflow-wrap:anywhere;margin-top:var(--s2)}
.dsv-gap{color:var(--warn);font-size:13px;line-height:1.7;margin-top:var(--s2);
  border-left:2px solid var(--warn);padding-left:var(--s3)}
.dsv-sources{display:grid;gap:var(--s3)}
.dsv-source{border-top:1px solid var(--line);padding-top:var(--s3)}
.dsv-source:first-child{border-top:0;padding-top:0}
.dsv-source-t{font-size:14px;font-weight:600;overflow-wrap:anywhere}

/* ── 事实 / 解释 / 方案 / 事件 ─────────────────────────────────────── */
.dsv-facts{display:grid;gap:var(--s2)}
.dsv-fact{background:var(--bg);border:1px solid var(--line);border-radius:var(--r-btn);
  padding:var(--s3) var(--s4);min-width:0}
.dsv-fact-text{font-size:15px}
.dsv-quote{margin:var(--s2) 0 0;padding:var(--s2) var(--s3);border-left:2px solid var(--accent-dim);
  background:var(--surface);border-radius:0 var(--r-btn) var(--r-btn) 0;color:var(--ink-2);
  font-size:13.5px;line-height:1.75;white-space:pre-wrap;overflow-wrap:anywhere}
.dsv-action{background:var(--bg);border:1px solid var(--line);border-left:3px solid var(--accent-dim);
  border-radius:var(--r-btn);padding:var(--s4);margin-top:var(--s3);min-width:0}
.dsv-action-head{display:flex;align-items:center;gap:var(--s2);flex-wrap:wrap;margin-bottom:var(--s2)}
.dsv-action-t{font-size:15px;font-weight:600;overflow-wrap:anywhere}
.dsv-events{display:grid;gap:var(--s3)}
.dsv-event{background:var(--bg);border:1px solid var(--line);border-radius:var(--r-btn);
  padding:var(--s3) var(--s4);min-width:0}
.dsv-event-head{display:flex;align-items:center;gap:var(--s2);flex-wrap:wrap;margin-bottom:var(--s2)}
.dsv-event>.dsv-muted{margin-top:var(--s2)}

/* ── 知识工作台 ────────────────────────────────────────────────────── */
.dsv-summary-box{padding-top:var(--s2)}
.dsv-points{display:grid;gap:var(--s3)}
.dsv-point{background:var(--bg);border:1px solid var(--line);border-radius:var(--r-btn);
  padding:var(--s3) var(--s4);min-width:0}
.dsv-knowledge>.dsv-panel>.dsv-form,.dsv-card>.dsv-form{margin-top:var(--s3)}

/* ── 手机：单列 + 底部工具条（不用汉堡菜单） ───────────────────────── */
@media (max-width:760px){
  .dsv-root{padding:var(--s4) var(--s3) calc(var(--nav-h) + var(--s8))}
  .dsv-layout{grid-template-columns:minmax(0,1fr);gap:var(--s4)}
  .dsv-form-body{grid-template-columns:minmax(0,1fr)}
  .dsv-field.dsv-half{grid-column:1 / -1}
  .dsv-panel{padding:var(--s4)}
  .dsv-kv-row{grid-template-columns:minmax(0,1fr);gap:var(--s1)}
  .dsv-input{font-size:16px}
  .dsv-btn{min-height:46px}
  .dsv-msg.is-user{max-width:94%}
  .dsv-clamp{max-height:200px}
  .dsv-nav{position:fixed;left:0;right:0;bottom:0;z-index:40;margin:0;
    background:var(--bg);border-top:1px solid var(--line);
    padding:var(--s1) var(--s2) calc(var(--s2) + var(--safe-b));
    display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s1);
    flex-wrap:nowrap}
  .dsv-nav .dsv-btn{min-width:0;width:100%;border:0;background:transparent;
    color:var(--ink-3);font-size:13px;min-height:52px;padding:var(--s2) var(--s1)}
  .dsv-nav .dsv-btn.on{color:var(--accent);background:transparent}
  .dsv-nav .dsv-btn.ghost{background:transparent}
  .dsv-action,.dsv-fact,.dsv-event{padding:var(--s3)}
}

@media (prefers-reduced-motion:reduce){
  .dsv-root *{animation-duration:.01ms!important;animation-iteration-count:1!important;
    transition-duration:.01ms!important}
}