/* =============================================================================
   Aham UI — v6.1 (在 v6.0 页面布局体系上,新增第 9 节「媒体与对话」9 组件;取值全用 Aham)
   北极星：Claude desktop 气质——极简、克制、留白、内容优先。默认是"不加"。
   字体重设计：砍掉衬线混排，统一 Inter(西文)+雅黑/黑体(中文) 一套无衬线 + JetBrains Mono(数字)。
   纯 CSS 组件库——不依赖 React，任意 HTML 直接用 class 拼原型。
   ============================================================================= */

:root {
  /* Surfaces — three tiers only */
  --white:#FFFFFF; --panel:#F3F3F3; --line:#E7E7E7;
  /* Ink */
  --ink:#262626; --ink-2:#6E6E6E; --ink-3:#9B9B9B; --ink-4:#C4C4C4; --on-accent:#FFFFFF;
  /* Accent — blue, garnish only */
  --accent:#336EE8; --accent-hover:#5C8BED; --accent-press:#164EC3;
  --accent-tint:#EDF0F7; --accent-tint-border:#C8D3EA;
  /* Semantic — muted, genuine-risk only */
  --success:#5A7A60; --success-bg:#F0F2F0; --warning:#8A7333; --warning-bg:#F4F1E9;
  --danger:#9E3D31; --danger-bg:#F4ECEA;
  /* Aliases */
  --bg-app:var(--white); --bg-panel:var(--panel); --bg-hover:var(--panel);
  --bg-selected:var(--line); --border:var(--line); --border-faint:var(--line);
  --control-on:var(--ink); --focus-ring:rgba(51,110,232,0.20); --overlay:rgba(20,20,20,0.28);
  /* Type — one sans (Inter + YaHei/黑体), one mono (numbers). No serif. */
  --font-sans:'Inter','Microsoft YaHei','SimHei',system-ui,-apple-system,sans-serif;
  --font-sans-display:'Inter Display','Inter','Microsoft YaHei',system-ui,sans-serif;
  --font-mono:'JetBrains Mono',ui-monospace,'SF Mono',Menlo,monospace;
  --text-xs:12px; --text-sm:13px; --text-base:14px; --text-md:15px; --text-lg:17px;
  --text-xl:20px; --text-2xl:24px; --text-3xl:32px; --text-display:44px;
  --w-regular:400; --w-medium:500; --w-semibold:600; --w-bold:700;
  --lh-tight:1.2; --lh-snug:1.35; --lh-normal:1.55;
  /* Control sizes — 统一尺寸档,贯穿所有控件(Small/Medium默认/Large);裁掉 Apple mini */
  --ctrl-h-sm:28px; --ctrl-h-md:32px; --ctrl-h-lg:40px;
  --ctrl-px-sm:12px; --ctrl-px-md:16px; --ctrl-px-lg:20px;
  /* Spacing — 4-based */
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px; --s6:32px; --s7:48px; --s8:64px;
  /* Layout */
  --rail-w:60px; --sidebar-w:264px; --rightbar-w:340px; --topbar-h:52px;
  --control-h:36px; --btn-h:32px;
  /* Radius */
  --r-xs:4px; --r-sm:6px; --r-md:8px; --r-lg:12px; --r-xl:16px; --r-pill:999px;
  /* Shadows — FLAT: only floating layers */
  --sh-none:none; --sh-md:0 2px 8px rgba(20,20,20,.05);
  --sh-pop:0 3px 12px rgba(20,20,20,.06); --sh-modal:0 12px 36px rgba(20,20,20,.10);
  /* Z-index — 层叠顺序（浮层堆叠不再即兴） */
  --z-base:0; --z-sticky:100; --z-dropdown:200; --z-overlay:300; --z-modal:400; --z-toast:500;
  /* Motion — 克制：服务反馈，不表演。时长短、缓动统一 */
  --dur-fast:.12s; --dur-base:.18s; --dur-slow:.28s;
  --ease-standard:cubic-bezier(.2,0,0,1); --ease-out:cubic-bezier(0,0,.2,1);
  /* Border width */
  --bw-1:1px; --bw-2:1.5px;
  /* Focus ring（焦点环：色已在 --focus-ring，下面是宽度/偏移） */
  --focus-ring-w:3px; --focus-ring-offset:2px;
  /* Icon sizes（图标尺寸阶梯，线性单色） */
  --icon-sm:16px; --icon-md:20px; --icon-lg:24px;
  /* Interaction fills（中性交互底，hover/active；不带色相） */
  --fill-hover:rgba(20,20,20,.04); --fill-active:rgba(20,20,20,.08);
  /* Opacity */
  --opacity-disabled:.4;
  /* Breakpoints（v6.0:网页 rem 为单一事实源;@media 里用 px 同值。旧 bp-sm/md/lg 保留兼容但已弃用） */
  --bp-w-sm:40rem; --bp-w-md:48rem; --bp-w-lg:64rem; --bp-w-xl:80rem; --bp-w-2xl:96rem; --bp-h-short:30rem;
  --bp-sm:380px; --bp-md:860px; --bp-lg:1280px; /* @deprecated v6.0 */
  /* —— v6.0 页面布局体系 —— */
  /* Content widths（网页轨居中收口;正文阅读宽与页面宽分离） */
  --page-max:1440px; --content-max:1080px; --read-max:65ch; --form-max:560px; --auth-max:420px; --ultra-max:1536px;
  /* Grid（gutter 列间 / margin 页边,随断点放大） */
  --grid-cols:12; --gutter:24px; --margin-x:32px;
  /* Density（默认 standard;[data-density] 覆盖 --row-h / --density-scale） */
  --row-h:36px; --density-scale:1;
  /* Overlay widths（承接 2.7 浮层） */
  --dialog-w:380px; --modal-min:360px; --modal-w:480px; --modal-max:640px; --drawer-w:400px;
  --preview-max-w:1080px; --preview-max-h:90vh;
}

/* ---- Base ---- */
*,*::before,*::after{box-sizing:border-box;}
body{margin:0;background:var(--bg-app);color:var(--ink);
  font:var(--w-regular) var(--text-base)/1.4 var(--font-sans);
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;}
::selection{background:var(--line);color:var(--ink);}
.num,.mono{font-family:var(--font-mono);font-variant-numeric:tabular-nums;}

/* ---- Typography helpers (hierarchy from size+weight, not serif) ---- */
.t-2{color:var(--ink-2);} .t-3{color:var(--ink-3);}

/* ---- Buttons — uniform, one primary per group ---- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s2);height:var(--ctrl-h-md);
  padding:0 var(--ctrl-px-md);border:1px solid transparent;border-radius:var(--r-md);background:transparent;
  font:var(--w-medium) var(--text-base)/1 var(--font-sans);color:var(--ink);cursor:pointer;
  white-space:nowrap;transition:background .12s,border-color .12s,color .12s;}
.btn--primary{background:var(--accent);color:var(--on-accent);}
.btn--primary:hover{background:var(--accent-hover);}
.btn--primary:active{background:var(--accent-press);}
.btn--secondary{background:var(--white);border-color:var(--line);color:var(--ink);}
.btn--secondary:hover{background:var(--panel);}
.btn--ghost{background:transparent;color:var(--ink-2);}
.btn--ghost:hover{background:var(--panel);color:var(--ink);}
.btn--danger{background:var(--white);border-color:var(--line);color:var(--danger);}
.btn--danger:hover{background:var(--danger-bg);}
.btn--sm{height:var(--ctrl-h-sm);padding:0 var(--ctrl-px-sm);font-size:var(--text-sm);}
.btn--lg{height:var(--ctrl-h-lg);padding:0 var(--ctrl-px-lg);}
.btn:focus-visible{outline:none;box-shadow:0 0 0 3px var(--focus-ring);}
.btn:disabled{opacity:.45;cursor:not-allowed;}
.icon-btn{display:inline-flex;align-items:center;justify-content:center;width:var(--btn-h);height:var(--btn-h);
  border:none;border-radius:var(--r-md);background:transparent;color:var(--ink-2);cursor:pointer;transition:background .12s;}
.icon-btn:hover{background:var(--panel);color:var(--ink);}

/* ---- Icon glyph — 线性单色 SVG(currentColor 继承 ink);具体集 = Lucide(ISC)。用 <svg class="icon"><use href="…#i-name"/></svg> ---- */
.icon{display:inline-block;width:var(--icon-md);height:var(--icon-md);vertical-align:-.125em;color:inherit;flex:none;}
.icon--sm{width:var(--icon-sm);height:var(--icon-sm);}
.icon--lg{width:var(--icon-lg);height:var(--icon-lg);}
.icon--thin{stroke-width:1.5;}   /* Lucide 原生 2px@24;此档用于需更轻描边处(有效描边随尺寸变细:16px≈1.3) */

/* ---- Form controls — monochrome; checked = ink, never blue ---- */
.field{display:flex;flex-direction:column;gap:6px;}
.field > .label{font-size:var(--text-xs);color:var(--ink-2);}
.field > .hint{font-size:var(--text-xs);color:var(--ink-3);}
.input,.textarea,.select{border:1px solid var(--line);border-radius:var(--r-md);background:var(--white);
  color:var(--ink);font:var(--text-base)/1 var(--font-sans);transition:border-color .12s,box-shadow .12s;}
.input,.select{height:var(--ctrl-h-md);padding:0 var(--ctrl-px-md);}
.textarea{min-height:72px;padding:9px 12px;line-height:1.5;resize:vertical;}
.input:hover,.textarea:hover,.select:hover{border-color:var(--ink-3);}
.input:focus,.textarea:focus,.select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--focus-ring);}
.input::placeholder{color:var(--ink-3);}
.select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--ink-3) 50%),linear-gradient(135deg,var(--ink-3) 50%,transparent 50%);
  background-position:calc(100% - 16px) center,calc(100% - 11px) center;background-size:5px 5px,5px 5px;background-repeat:no-repeat;padding-right:32px;}
/* checkbox / radio / switch — ink */
.check,.radio{appearance:none;width:16px;height:16px;border:1.5px solid var(--ink-3);background:var(--white);cursor:pointer;position:relative;flex:none;transition:border-color .12s,background .12s;}
.check{border-radius:var(--r-xs);} .radio{border-radius:var(--r-pill);}
.check:checked,.radio:checked{background:var(--ink);border-color:var(--ink);}
.check:checked::after{content:"";position:absolute;left:4px;top:1px;width:4px;height:8px;border:solid var(--white);border-width:0 2px 2px 0;transform:rotate(45deg);}
.radio:checked::after{content:"";position:absolute;inset:3.5px;border-radius:var(--r-pill);background:var(--white);}
.switch{appearance:none;width:34px;height:20px;border-radius:var(--r-pill);background:var(--line);cursor:pointer;position:relative;flex:none;transition:background .15s;}
.switch:checked{background:var(--ink);}
.switch::after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:var(--r-pill);background:var(--white);transition:left .15s;}
.switch:checked::after{left:16px;}
.ctl-row{display:inline-flex;align-items:center;gap:var(--s2);font-size:var(--text-base);cursor:pointer;}

/* ---- Status — symbol/dot + text, never a block ---- */
.status{display:inline-flex;align-items:center;gap:var(--s2);font-size:var(--text-xs);font-weight:var(--w-medium);color:var(--ink);white-space:nowrap;line-height:1;}
.status::before{content:"";width:6px;height:6px;border-radius:var(--r-pill);background:var(--ink-3);flex:none;}
.status--active::before{background:var(--accent);}
.status--ok::before{background:var(--success);}
.status--warn::before{background:var(--warning);}
.status--risk::before{background:var(--danger);}
.status--muted{color:var(--ink-3);} .status--muted::before{background:var(--ink-3);}
/* recommendation mark — the one small blue text mark */
.rec{color:var(--accent);font-size:var(--text-xs);font-weight:var(--w-medium);}
/* file-type chip — short text in mono, not a colored icon */
.ftype{display:inline-block;font-family:var(--font-mono);font-size:11px;color:var(--ink-2);border:1px solid var(--line);border-radius:var(--r-xs);padding:1px 5px;}
/* removable filter tag (the ONLY chip; never on list rows) */
.tag{display:inline-flex;align-items:center;gap:6px;font-size:var(--text-xs);color:var(--ink-2);background:var(--panel);border-radius:var(--r-sm);padding:3px 8px;}
.tag button{border:none;background:none;color:var(--ink-3);cursor:pointer;font-size:13px;line-height:1;padding:0;}

/* ---- Cards — white on panel, no border/shadow, fixed specs, never grow ---- */
.card{background:var(--white);border-radius:var(--r-lg);padding:var(--s5);}
.card--sel{background:var(--line);}                 /* selected = flat gray block, not blue */
.card__head{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:var(--s3);}
.card__head .ttl{font-size:var(--text-lg);font-weight:var(--w-semibold);letter-spacing:-.01em;}
.card__head .kind{font-size:var(--text-xs);color:var(--ink-3);}    /* text type-label */
.card__foot{display:flex;align-items:center;justify-content:space-between;margin-top:var(--s4);font-size:var(--text-xs);color:var(--ink-2);}

/* ---- Metric (KPI) — big mono number, mono-caps label ---- */
.metric{display:flex;flex-direction:column;gap:var(--s2);}
.metric .k{font-size:var(--text-xs);color:var(--ink-3);}
.metric .v{font-family:var(--font-mono);font-size:var(--text-3xl);font-weight:var(--w-semibold);letter-spacing:-.02em;line-height:1;font-variant-numeric:tabular-nums;}
.metric .v .u{font-family:var(--font-sans);font-size:var(--text-md);color:var(--ink-3);font-weight:var(--w-medium);margin-left:3px;}
.metric .d{font-size:var(--text-xs);color:var(--ink-2);font-variant-numeric:tabular-nums;}

/* ---- Document table — horizontal hairlines only, no vertical, no fills ---- */
.doc-table{width:100%;border-collapse:collapse;font-size:var(--text-base);}
.doc-table thead th{text-align:left;font-size:var(--text-xs);font-weight:var(--w-semibold);color:var(--ink-2);padding:10px 16px;border-bottom:1px solid var(--line);white-space:nowrap;}
.doc-table tbody td{padding:12px 16px;border-bottom:1px solid var(--border-faint);color:var(--ink);}
.doc-table tbody tr:last-child td{border-bottom:none;}
.doc-table th.num,.doc-table td.num{text-align:right;font-family:var(--font-mono);font-variant-numeric:tabular-nums;}
.doc-table tr.total td{font-weight:var(--w-semibold);border-top:1px solid var(--line);}    /* total = weight, not color */
.doc-table tbody tr:hover{background:var(--panel);}
.doc-table td.cat{color:var(--ink-2);}        /* categorical = plain text, no chip */
.list-foot{display:flex;align-items:center;gap:var(--s3);padding:var(--s3) 0;font-size:var(--text-xs);color:var(--ink-3);}

/* ---- Tabs (underline; selected underline is blue) ---- */
.tabs{display:flex;gap:var(--s5);border-bottom:1px solid var(--line);}
.tab{padding:10px 0;font-size:var(--text-base);color:var(--ink-2);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px;transition:color .12s;}
.tab:hover{color:var(--ink);}
.tab--on{color:var(--ink);font-weight:var(--w-medium);border-bottom-color:var(--accent);}

/* ---- Breadcrumb ---- */
.crumb{display:flex;align-items:center;gap:var(--s2);font-size:var(--text-sm);color:var(--ink-3);}
.crumb a{color:var(--ink-2);text-decoration:none;} .crumb a:hover{color:var(--ink);}
.crumb .sep{color:var(--ink-3);}
.crumb .here{color:var(--ink);}

/* ---- Shell: sidebar / rail / nav ---- */
.sidebar{width:var(--sidebar-w);background:var(--panel);border-right:1px solid var(--line);padding:var(--s4) var(--s3);display:flex;flex-direction:column;}
.nav-item{display:flex;align-items:center;gap:var(--s3);height:36px;padding:0 12px;border-radius:var(--r-md);font-size:var(--text-base);color:var(--ink-2);cursor:pointer;font-weight:var(--w-medium);transition:background .12s,color .12s;}
.nav-item:hover{background:var(--line);color:var(--ink);}
.nav-item--on{background:var(--line);color:var(--ink);}   /* selected = flat gray, not blue */
.nav-grouptitle{font-size:var(--text-xs);color:var(--ink-3);padding:0 12px;margin:var(--s4) 0 var(--s2);}

/* ---- Overlays — the only place with shadow ---- */
.menu{background:var(--white);border-radius:var(--r-md);box-shadow:var(--sh-md);z-index:var(--z-dropdown);padding:6px;min-width:160px;}
.menu .mi{padding:8px 10px;border-radius:var(--r-sm);font-size:var(--text-base);color:var(--ink);cursor:pointer;}
.menu .mi:hover{background:var(--panel);}
.popover{background:var(--white);border-radius:var(--r-md);box-shadow:var(--sh-pop);z-index:var(--z-dropdown);padding:var(--s4);}
.modal{background:var(--white);border-radius:var(--r-xl);box-shadow:var(--sh-modal);z-index:var(--z-modal);padding:var(--s6);max-width:520px;}
.scrim{position:fixed;inset:0;background:var(--overlay);z-index:var(--z-overlay);}

/* ---- Misc: divider / empty / spinner / avatar ---- */
.divider{height:1px;background:var(--line);border:none;margin:var(--s4) 0;}
.empty{display:flex;flex-direction:column;align-items:center;gap:var(--s3);padding:var(--s8) var(--s5);text-align:center;color:var(--ink-3);}
.empty .et{font-size:var(--text-md);color:var(--ink-2);}
.spinner{width:18px;height:18px;border:2px solid var(--line);border-top-color:var(--ink-3);border-radius:var(--r-pill);animation:sp .7s linear infinite;}
@keyframes sp{to{transform:rotate(360deg);}}

/* ---- Deep-zone primitives: title-bar / review / field-section / checklist ---- */
.titlebar{display:flex;align-items:center;justify-content:space-between;height:var(--topbar-h);padding:0 var(--s5);background:var(--white);border-bottom:1px solid var(--line);}    /* region ① on #F3F3F3 */    /* symbol+text, left-aligned */   /* equal 3-col grid */                 /* read: value follows label, left */  /* edit cue = dashed underline only */  /* 待补录 = amber dashed */

/* ---- Layout helpers ---- */
.shell{display:flex;height:100vh;overflow:hidden;}
.col{display:flex;flex-direction:column;min-width:0;}
.fill{flex:1;min-height:0;overflow:auto;}
.rightbar{width:var(--rightbar-w);background:var(--panel);border-left:1px solid var(--line);}
.row{display:flex;align-items:center;gap:var(--s3);}

/* =============================================================================
   补全组件（按 9 组对齐市场基准；守 Aham 铁规：单色 / 选中扁平灰 / 仅浮层有阴影 / 蓝只点缀）
   ============================================================================= */

/* ---- 焦点环（可访问性，所有可聚焦元素） ---- */
.focusable:focus-visible,.btn:focus-visible,.input:focus-visible,.select:focus-visible,
.nav-item:focus-visible,.tab:focus-visible{outline:var(--focus-ring-w) solid var(--focus-ring);outline-offset:var(--focus-ring-offset);}

/* ---- 反馈：Alert / 行内通知 ---- */
.alert{display:flex;gap:var(--s3);padding:var(--s3) var(--s4);border-radius:var(--r-md);
  border-left:var(--bw-2) solid var(--ink-3);background:var(--panel);font-size:var(--text-sm);color:var(--ink);}
.alert--ok{border-left-color:var(--success);background:var(--success-bg);}
.alert--warn{border-left-color:var(--warning);background:var(--warning-bg);}
.alert--risk{border-left-color:var(--danger);background:var(--danger-bg);}
.alert--info{border-left-color:var(--accent);background:var(--accent-tint);}
.alert .at{font-weight:var(--w-semibold);}

/* ---- 反馈：Banner（通栏，更克制，仅上下细线） ---- */
.banner{display:flex;align-items:center;gap:var(--s3);padding:var(--s3) var(--s5);
  background:var(--panel);border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-size:var(--text-sm);}

/* ---- 反馈：Toast（浮层，有阴影） ---- */
.toast{display:flex;align-items:center;gap:var(--s3);background:var(--white);border-radius:var(--r-md);
  box-shadow:var(--sh-pop);z-index:var(--z-toast);padding:var(--s3) var(--s4);font-size:var(--text-sm);min-width:240px;}

/* ---- 反馈：Progress（中性，填充用 ink 不用蓝） ---- */
.progress{height:6px;background:var(--line);border-radius:var(--r-pill);overflow:hidden;}
.progress__bar{display:block;height:100%;background:var(--ink);border-radius:var(--r-pill);transition:width var(--dur-base) var(--ease-standard);}

/* ---- 反馈：Skeleton（骨架屏） ---- */
.skeleton{background:linear-gradient(90deg,var(--panel) 25%,var(--line) 37%,var(--panel) 63%);
  background-size:400% 100%;border-radius:var(--r-sm);animation:sk 1.4s ease infinite;height:14px;}
@keyframes sk{0%{background-position:100% 50%;}100%{background-position:0 50%;}}

/* ---- 反馈：Result / 状态页 ---- */
.result{display:flex;flex-direction:column;align-items:center;gap:var(--s3);padding:var(--s8) var(--s5);text-align:center;}
.result .rt{font-size:var(--text-xl);font-weight:var(--w-semibold);}
.result .rd{font-size:var(--text-sm);color:var(--ink-2);}

/* ---- 浮层：Tooltip（深底小提示，浮层有阴影） ---- */
.tooltip{background:var(--ink);color:var(--white);font-size:var(--text-xs);padding:5px 9px;border-radius:var(--r-sm);
  box-shadow:var(--sh-md);z-index:var(--z-toast);max-width:240px;}

/* ---- 浮层：Drawer / 侧面板（满高侧滑，有阴影） ---- */
.drawer{position:fixed;top:0;right:0;height:100vh;width:var(--rightbar-w);background:var(--white);
  box-shadow:var(--sh-modal);z-index:var(--z-modal);display:flex;flex-direction:column;}
.drawer__head{display:flex;align-items:center;justify-content:space-between;padding:var(--s4) var(--s5);border-bottom:1px solid var(--line);}
.drawer__body{flex:1;overflow:auto;padding:var(--s5);}

/* ---- 浮层：Popconfirm（气泡确认 = popover + 操作） ---- */
.popconfirm{background:var(--white);border-radius:var(--r-md);box-shadow:var(--sh-pop);z-index:var(--z-dropdown);
  padding:var(--s4);max-width:260px;font-size:var(--text-sm);}
.popconfirm .pc-actions{display:flex;justify-content:flex-end;gap:var(--s2);margin-top:var(--s3);}

/* ---- 导航：Pagination（当前页 = 扁平灰，不是蓝） ---- */
.pager{display:flex;align-items:center;gap:var(--s1);font-size:var(--text-sm);}
.pager button{min-width:32px;height:32px;border:none;background:transparent;border-radius:var(--r-md);color:var(--ink-2);cursor:pointer;font-family:inherit;}
.pager button:hover{background:var(--fill-hover);color:var(--ink);}
.pager button[aria-current]{background:var(--line);color:var(--ink);font-weight:var(--w-medium);}

/* ---- 导航：Segmented control（选中 = 白片浮起，不是蓝） ---- */
.seg{display:inline-flex;background:var(--panel);border-radius:var(--r-md);padding:3px;gap:2px;}
.seg button{border:none;background:transparent;border-radius:var(--r-sm);padding:5px 14px;font-size:var(--text-sm);color:var(--ink-2);cursor:pointer;font-family:inherit;}
.seg button[aria-selected="true"]{background:var(--white);color:var(--ink);box-shadow:var(--sh-md);font-weight:var(--w-medium);}

/* ---- 导航：Steps / 步骤（数字 + 细线连接） ---- */
.steps{display:flex;align-items:center;gap:var(--s2);font-size:var(--text-sm);}
.steps .step{display:flex;align-items:center;gap:var(--s2);color:var(--ink-3);}
.steps .step .sn{width:22px;height:22px;border-radius:var(--r-pill);border:1px solid var(--ink-3);display:grid;place-items:center;font-size:var(--text-xs);font-family:var(--font-mono);}
.steps .step--on{color:var(--ink);}
.steps .step--on .sn{border-color:var(--ink);color:var(--ink);}
.steps .step--done .sn{background:var(--ink);color:var(--white);border-color:var(--ink);}
.steps .bar{flex:1;height:1px;background:var(--line);min-width:24px;}

/* ---- 数据展示：Descriptions / 键值详情（细横线，无竖线） ---- */
.desc{display:grid;grid-template-columns:max-content 1fr;gap:0;font-size:var(--text-sm);}
.desc dt{padding:9px var(--s4) 9px 0;color:var(--ink-2);border-bottom:1px solid var(--line);}
.desc dd{padding:9px 0;margin:0;color:var(--ink);border-bottom:1px solid var(--line);}

/* ---- 数据展示：Accordion / Collapse（细横线分隔） ---- */
.accordion{border-top:1px solid var(--line);}
.accordion .ac-item{border-bottom:1px solid var(--line);}
.accordion .ac-head{display:flex;align-items:center;justify-content:space-between;padding:var(--s3) 0;font-size:var(--text-base);cursor:pointer;}
.accordion .ac-body{padding:0 0 var(--s3);font-size:var(--text-sm);color:var(--ink-2);}

/* ---- 数据展示：Code / 代码块（mono + 浅底） ---- */
.code{font-family:var(--font-mono);font-size:var(--text-sm);background:var(--panel);border-radius:var(--r-md);padding:var(--s3) var(--s4);color:var(--ink);overflow-x:auto;line-height:1.6;}

/* ---- 动作：Button group / 分段按钮组 ---- */
.btn-group{display:inline-flex;}
.btn-group .btn{border-radius:0;}
.btn-group .btn:first-child{border-radius:var(--r-md) 0 0 var(--r-md);}
.btn-group .btn:last-child{border-radius:0 var(--r-md) var(--r-md) 0;}
.btn-group .btn+.btn{margin-left:-1px;}

/* ---- 表单：Slider / 滑块（单色，填充 ink） ---- */
.slider{appearance:none;width:100%;height:4px;background:var(--line);border-radius:var(--r-pill);outline:none;}
.slider::-webkit-slider-thumb{appearance:none;width:16px;height:16px;border-radius:var(--r-pill);background:var(--white);border:1.5px solid var(--ink);cursor:pointer;}
.slider::-moz-range-thumb{width:16px;height:16px;border-radius:var(--r-pill);background:var(--white);border:1.5px solid var(--ink);cursor:pointer;}

/* =============================================================================
   补全剩余组件（📝 待实现 + ⚙️ 交互组件的静态外壳，交互行为见 aham-ui.js）
   ============================================================================= */

/* ---- 数据展示：Timeline / 时间线 ---- */
.timeline{position:relative;padding-left:var(--s5);}
.timeline::before{content:"";position:absolute;left:5px;top:4px;bottom:4px;width:1px;background:var(--line);}
.timeline .tl-item{position:relative;padding:0 0 var(--s4);}
.timeline .tl-item::before{content:"";position:absolute;left:-22px;top:5px;width:9px;height:9px;border-radius:var(--r-pill);background:var(--white);border:1.5px solid var(--ink-3);}
.timeline .tl-item--on::before{background:var(--ink);border-color:var(--ink);}
.timeline .tl-time{font-size:var(--text-xs);color:var(--ink-3);font-family:var(--font-mono);}
.timeline .tl-title{font-size:var(--text-sm);color:var(--ink);}

/* ---- 数据展示：Tree / 树（静态；展开折叠需 JS） ---- */
.tree{font-size:var(--text-sm);}
.tree .tree-item{display:flex;align-items:center;gap:var(--s2);height:30px;padding:0 var(--s2);border-radius:var(--r-sm);color:var(--ink-2);cursor:pointer;}
.tree .tree-item:hover{background:var(--fill-hover);color:var(--ink);}
.tree .tree-item--on{background:var(--line);color:var(--ink);}
.tree .tree-caret{width:14px;color:var(--ink-3);font-size:10px;flex:none;}
.tree .tree-children{padding-left:var(--s4);}

/* ---- 数据展示：Tree table / 树表（表格 + 缩进展开） ---- */
.doc-table .tt-toggle{display:inline-flex;width:14px;color:var(--ink-3);cursor:pointer;font-size:10px;margin-right:4px;}
.doc-table tr[data-depth="1"] td:first-child{padding-left:var(--s5);}
.doc-table tr[data-depth="2"] td:first-child{padding-left:var(--s7);}

/* ---- 数据展示：Data grid 交互态（排序/选中/展开；行为见 JS） ---- */
.doc-table th.sortable{cursor:pointer;user-select:none;}
.doc-table th.sortable .caret{color:var(--ink-3);font-size:10px;margin-left:4px;}
.doc-table tr[aria-selected="true"]{background:var(--panel);}
.doc-table td.sel-cell{width:36px;text-align:center;}
.doc-table tr.row-expand td{background:var(--panel);font-size:var(--text-sm);color:var(--ink-2);}

/* ---- 反馈：通知中心 ---- */
.notif-center{width:340px;background:var(--white);border-radius:var(--r-lg);box-shadow:var(--sh-modal);z-index:var(--z-modal);overflow:hidden;}
.notif-center .nc-head{display:flex;align-items:center;justify-content:space-between;padding:var(--s3) var(--s4);border-bottom:1px solid var(--line);font-weight:var(--w-semibold);font-size:var(--text-sm);}
.notif-center .nc-item{display:flex;gap:var(--s3);padding:var(--s3) var(--s4);border-bottom:1px solid var(--line);font-size:var(--text-sm);}
.notif-center .nc-item:last-child{border-bottom:none;}
.notif-center .nc-item .nc-dot{width:6px;height:6px;border-radius:var(--r-pill);background:var(--accent);margin-top:6px;flex:none;}
.notif-center .nc-item--read .nc-dot{background:transparent;}
.notif-center .nc-time{font-size:var(--text-xs);color:var(--ink-3);font-family:var(--font-mono);margin-left:auto;}

/* ---- 表单：文件上传 / 拖放区 ---- */
.upload{border:1.5px dashed var(--line);border-radius:var(--r-lg);padding:var(--s6) var(--s5);text-align:center;color:var(--ink-3);cursor:pointer;transition:border-color var(--dur-fast),background var(--dur-fast);}
.upload:hover,.upload.dragover{border-color:var(--ink-3);background:var(--panel);}
.upload .up-t{font-size:var(--text-sm);color:var(--ink-2);}
.upload .up-h{font-size:var(--text-xs);}

/* ---- 表单：日历 / Date picker 外壳（行为需 JS） ---- */
.calendar{width:280px;background:var(--white);border-radius:var(--r-lg);box-shadow:var(--sh-pop);z-index:var(--z-dropdown);padding:var(--s4);}
.calendar .cal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--s3);font-size:var(--text-sm);font-weight:var(--w-medium);}
.calendar .cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;}
.calendar .cal-dow{font-size:var(--text-xs);color:var(--ink-3);text-align:center;padding:4px 0;}
.calendar .cal-day{aspect-ratio:1;display:grid;place-items:center;font-size:var(--text-sm);border-radius:var(--r-sm);cursor:pointer;color:var(--ink);}
.calendar .cal-day:hover{background:var(--fill-hover);}
.calendar .cal-day--muted{color:var(--ink-3);}
.calendar .cal-day--today{position:relative;}
.calendar .cal-day--today::after{content:"";position:absolute;bottom:3px;width:4px;height:4px;border-radius:var(--r-pill);background:var(--accent);}
.calendar .cal-day--sel{background:var(--line);color:var(--ink);font-weight:var(--w-medium);}

/* ---- 表单：Combobox / 自动完成 外壳（行为需 JS） ---- */
.combobox{position:relative;}
.combobox .cb-list{position:absolute;left:0;right:0;top:calc(100% + 4px);background:var(--white);border-radius:var(--r-md);box-shadow:var(--sh-md);z-index:var(--z-dropdown);padding:6px;max-height:240px;overflow:auto;}
.combobox .cb-opt{padding:7px 10px;border-radius:var(--r-sm);font-size:var(--text-sm);cursor:pointer;color:var(--ink);}
.combobox .cb-opt:hover,.combobox .cb-opt[aria-selected="true"]{background:var(--panel);}

/* ---- 导航：Command palette / 命令面板 外壳（行为需 JS） ---- */
.cmdk{width:560px;max-width:92vw;background:var(--white);border-radius:var(--r-xl);box-shadow:var(--sh-modal);z-index:var(--z-modal);overflow:hidden;}
.cmdk .cmdk-input{width:100%;border:none;border-bottom:1px solid var(--line);padding:var(--s4) var(--s5);font-size:var(--text-md);font-family:inherit;outline:none;}
.cmdk .cmdk-group{padding:var(--s2);}
.cmdk .cmdk-label{font-size:var(--text-xs);color:var(--ink-3);padding:6px 10px;}
.cmdk .cmdk-item{display:flex;align-items:center;gap:var(--s3);padding:9px 10px;border-radius:var(--r-sm);font-size:var(--text-sm);cursor:pointer;color:var(--ink);}
.cmdk .cmdk-item[aria-selected="true"]{background:var(--panel);}

/* ---- 布局：Split / 分割面板 外壳（拖拽需 JS） ---- */
.split{display:flex;height:100%;}
.split .split-pane{overflow:auto;min-width:0;}
.split .split-handle{flex:none;width:1px;background:var(--line);cursor:col-resize;position:relative;}
.split .split-handle::after{content:"";position:absolute;inset:0 -3px;}
.split .split-handle:hover{background:var(--ink-3);}

/* =============================================================================
   文本样式体系（对应 tokens.textStyles;语义类,绑定 字号/行高/字重/字族;≥20px 用 Inter Display）
   ============================================================================= */
.text-display{font:600 var(--text-display)/1.15 var(--font-sans-display);letter-spacing:-.02em;}
.text-title{font:600 var(--text-3xl)/1.2 var(--font-sans-display);letter-spacing:-.02em;}
.text-heading{font:600 var(--text-2xl)/1.25 var(--font-sans-display);letter-spacing:-.01em;}
.text-subheading{font:600 var(--text-xl)/1.3 var(--font-sans-display);}
.text-body-l{font:400 var(--text-lg)/1.5 var(--font-sans);}
.text-body{font:400 var(--text-base)/1.55 var(--font-sans);}
.text-callout{font:400 var(--text-md)/1.45 var(--font-sans);}
.text-subhead{font:500 var(--text-sm)/1.4 var(--font-sans);}
.text-footnote{font:400 var(--text-sm)/1.45 var(--font-sans);}
.text-caption{font:400 var(--text-xs)/1.4 var(--font-sans);color:var(--ink-2);}
.text-mono{font-family:var(--font-mono);}

/* =============================================================================
   暗色模式（学 Apple 暗色模板:背景分层深灰非纯黑 / 文字接近白 / 蓝调亮;中性灰守"冷色的纸"）
   触发:系统 prefers-color-scheme:dark  或  显式 [data-theme="dark"]。
   【提案值,需在真实暗背景实测对比度后定稿;暗色按钮蓝底白字对比尤其要验】
   ============================================================================= */
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --white:#1C1C1C; --panel:#2A2A2A; --line:#3A3A3A;
    --ink:#F5F5F5; --ink-2:#A8A8A8; --ink-3:#767676; --ink-4:#4A4A4A;
    --accent:#5C8BED; --accent-hover:#7BA3F0; --accent-press:#336EE8;
    --accent-tint:#23304A; --accent-tint-border:#33486E;
    --success:#8FB096; --success-bg:#23291F; --warning:#C2A855; --warning-bg:#2A2616;
    --danger:#D08070; --danger-bg:#2A1E1A;
    --fill-hover:rgba(255,255,255,.05); --fill-active:rgba(255,255,255,.10);
    --overlay:rgba(0,0,0,.5);
  }
}
[data-theme="dark"]{
  --white:#1C1C1C; --panel:#2A2A2A; --line:#3A3A3A;
  --ink:#F5F5F5; --ink-2:#A8A8A8; --ink-3:#767676; --ink-4:#4A4A4A;
  --accent:#5C8BED; --accent-hover:#7BA3F0; --accent-press:#336EE8;
  --accent-tint:#23304A; --accent-tint-border:#33486E;
  --success:#8FB096; --success-bg:#23291F; --warning:#C2A855; --warning-bg:#2A2616;
  --danger:#D08070; --danger-bg:#2A1E1A;
  --fill-hover:rgba(255,255,255,.05); --fill-active:rgba(255,255,255,.10);
  --overlay:rgba(0,0,0,.5);
}

/* =============================================================================
   批1 · 录入类全状态/变体（error/disabled/readonly/前后缀/清除/字数/不确定/带标签/刻度/步进/验证码）
   ============================================================================= */
/* 输入三态:错误 / 禁用 / 只读 */
.input.is-error,.textarea.is-error,.select.is-error{border-color:var(--danger);}
.input.is-error:focus,.textarea.is-error:focus,.select.is-error:focus{border-color:var(--danger);box-shadow:0 0 0 3px var(--danger-bg);}
.input:disabled,.textarea:disabled,.select:disabled,.input[disabled],.select[disabled]{background:var(--panel);color:var(--ink-3);cursor:not-allowed;border-color:var(--line);}
.input[readonly],.textarea[readonly]{background:var(--panel);color:var(--ink-2);cursor:default;}
.field .err{font-size:var(--text-xs);color:var(--danger);margin-top:4px;}

/* 输入包装:前缀图标 / 后缀 / 清除按钮 / 字数 */
.input-wrap{position:relative;display:flex;align-items:center;width:100%;}
.input-wrap .input{width:100%;box-sizing:border-box;}
.input-wrap.has-prefix .input{padding-left:34px;}
.input-wrap.has-suffix .input{padding-right:34px;}
.input-wrap .affix{position:absolute;display:flex;align-items:center;color:var(--ink-3);font-size:var(--text-sm);pointer-events:none;}
.input-wrap .affix.pre{left:12px;} .input-wrap .affix.suf{right:12px;}
.input-wrap .clear{position:absolute;right:9px;width:16px;height:16px;border-radius:var(--r-pill);background:var(--ink-3);color:var(--white);border:none;cursor:pointer;display:grid;place-items:center;font-size:10px;line-height:1;}
.input-wrap .clear:hover{background:var(--ink-2);}
.input-count{font-size:var(--text-xs);color:var(--ink-3);text-align:right;margin-top:4px;font-family:var(--font-mono);}
.input-count.over{color:var(--danger);}

/* checkbox 不确定态 + 三者禁用态 */
.check:indeterminate{background:var(--ink);border-color:var(--ink);}
.check:indeterminate::after{content:"";position:absolute;left:3px;right:3px;top:6.5px;height:2px;background:var(--white);border:none;transform:none;}
.check:disabled,.radio:disabled,.switch:disabled{opacity:.45;cursor:not-allowed;}
.check:disabled:checked,.radio:disabled:checked{background:var(--ink-3);border-color:var(--ink-3);}

/* 开关带标签（行式 / 两端式） */
.switch-row{display:inline-flex;align-items:center;gap:8px;font-size:var(--text-base);color:var(--ink);cursor:pointer;}
.switch-row.between{display:flex;justify-content:space-between;width:100%;}

/* 滑块:禁用 + 带值 + 刻度 */
.slider:disabled{opacity:.45;cursor:not-allowed;}
.slider-row{display:flex;align-items:center;gap:12px;}
.slider-row .val{font-family:var(--font-mono);font-size:var(--text-sm);color:var(--ink-2);min-width:36px;text-align:right;}
.slider-ticks{display:flex;justify-content:space-between;font-size:var(--text-xs);color:var(--ink-3);font-family:var(--font-mono);margin-top:4px;}

/* 步进器 */
.stepper{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:var(--r-md);height:var(--ctrl-h-md);overflow:hidden;}
.stepper button{width:30px;height:100%;border:none;background:var(--white);color:var(--ink);cursor:pointer;font-size:16px;display:grid;place-items:center;}
.stepper button:hover{background:var(--panel);} .stepper button:disabled{color:var(--ink-4);cursor:not-allowed;}
.stepper input{width:48px;height:100%;border:none;border-left:1px solid var(--line);border-right:1px solid var(--line);text-align:center;font-family:var(--font-mono);font-size:var(--text-sm);color:var(--ink);background:var(--white);}

/* 分格验证码 */
.otp{display:inline-flex;gap:8px;}
.otp input{width:40px;height:48px;text-align:center;font-size:var(--text-xl);font-family:var(--font-mono);border:1px solid var(--line);border-radius:var(--r-md);background:var(--white);color:var(--ink);}
.otp input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--focus-ring);}

/* 选择器触发器（日期/时间/范围,复用日历浮层;触发是只读 input） */
.picker-trigger{position:relative;display:inline-flex;}
.picker-trigger .input{cursor:pointer;padding-right:32px;}
.picker-trigger .ico{position:absolute;right:10px;top:50%;transform:translateY(-50%);color:var(--ink-3);font-size:var(--text-sm);pointer-events:none;}

/* =============================================================================
   批2 · 动作全变体（按钮 loading/全宽/toggle/链接 + 菜单 分组/分隔/快捷键/勾选/危险/子菜单 + 工具栏溢出）
   ============================================================================= */
@keyframes ah-spin{to{transform:rotate(360deg);}}
/* 按钮:loading 态 */
.btn.is-loading{color:transparent !important;pointer-events:none;position:relative;}
.btn.is-loading::after{content:"";position:absolute;top:calc(50% - 7px);left:calc(50% - 7px);width:14px;height:14px;border:2px solid var(--ink-3);border-top-color:transparent;border-radius:50%;animation:ah-spin .6s linear infinite;}
.btn--primary.is-loading::after{border-color:var(--on-accent);border-top-color:transparent;}
/* 按钮:全宽 / toggle(按下保持) / 链接 */
.btn--block{width:100%;}
.btn--toggle[aria-pressed="true"]{background:var(--line);color:var(--ink);border-color:var(--line);}
.btn--link{height:auto;padding:0;background:none;border:none;color:var(--accent);font-weight:var(--w-regular);}
.btn--link:hover{background:none;text-decoration:underline;}
/* icon-btn 接尺寸档 + 选中态 */
.icon-btn[aria-pressed="true"]{background:var(--line);color:var(--ink);}

/* 菜单:flex 项 + 图标 + 快捷键 + 勾选 + 分组 + 分隔 + 危险 + 子菜单 */
.menu .mi{display:flex;align-items:center;gap:8px;}
.menu .mi .ico{width:16px;color:var(--ink-3);flex:none;text-align:center;}
.menu .mi .sc{margin-left:auto;font-size:var(--text-xs);color:var(--ink-3);font-family:var(--font-mono);}
.menu .mi.checked::before{content:"✓";color:var(--ink);width:14px;flex:none;font-size:12px;}
.menu .mi:not(.checked) .ico:first-child{}
.menu .mg{font-size:var(--text-xs);color:var(--ink-3);padding:6px 10px 4px;}
.menu .md{height:1px;background:var(--line);margin:6px -6px;border:none;}
.menu .mi.danger{color:var(--danger);}
.menu .mi.danger:hover{background:var(--danger-bg);}
.menu .mi.danger .ico{color:var(--danger);}
/* 子菜单 */
.menu .mi.has-sub{position:relative;}
.menu .mi.has-sub::after{content:"▸";margin-left:auto;color:var(--ink-3);font-size:10px;}
.menu .mi.has-sub > .submenu{display:none;position:absolute;left:calc(100% + 2px);top:-6px;}
.menu .mi.has-sub:hover > .submenu{display:block;}

/* 工具栏溢出菜单容器 */
.toolbar .overflow{position:relative;margin-left:auto;}

/* =============================================================================
   批3 · 导航补全（三段式导航栏 + 侧栏分组折叠/徽标/图标 + 搜索清除/建议 + 令牌字段）
   ============================================================================= */
/* 三段式导航栏:返回 · 标题 · 操作 */
.navbar{display:flex;align-items:center;gap:12px;height:var(--topbar-h);padding:0 16px;background:var(--white);border-bottom:1px solid var(--line);}
.navbar .back{display:inline-flex;align-items:center;gap:3px;color:var(--accent);cursor:pointer;font-size:var(--text-base);background:none;border:none;padding:0;}
.navbar .back:hover{text-decoration:underline;}
.navbar .nav-title{font-weight:var(--w-semibold);color:var(--ink);font-size:var(--text-md);}
.navbar .nav-actions{margin-left:auto;display:flex;align-items:center;gap:8px;}

/* 侧栏:分组可折叠 + 图标 + 徽标 */
.nav-group .nav-grouptitle{display:flex;align-items:center;cursor:pointer;user-select:none;}
.nav-group .nav-grouptitle .caret{font-size:9px;margin-right:5px;color:var(--ink-3);transition:transform .15s;display:inline-block;}
.nav-group.collapsed .nav-grouptitle .caret{transform:rotate(-90deg);}
.nav-group.collapsed .nav-item{display:none;}
.nav-item .ico{width:18px;flex:none;text-align:center;color:inherit;}
.nav-item .badge{margin-left:auto;font-size:var(--text-xs);color:var(--ink-2);background:var(--line);border-radius:var(--r-pill);padding:1px 7px;min-width:18px;text-align:center;font-family:var(--font-mono);line-height:1.5;}
.nav-item--on .badge{background:var(--white);color:var(--ink);}

/* 搜索:清除按钮 + 建议下拉 */
.search{position:relative;}
.search .clear{position:absolute;right:9px;top:50%;transform:translateY(-50%);width:16px;height:16px;border-radius:var(--r-pill);background:var(--ink-3);color:var(--white);border:none;cursor:pointer;display:grid;place-items:center;font-size:10px;line-height:1;}
.search .clear:hover{background:var(--ink-2);}
.search-suggest{position:absolute;top:calc(100% + 4px);left:0;right:0;background:var(--white);border-radius:var(--r-md);box-shadow:var(--sh-md);padding:6px;z-index:var(--z-dropdown);}
.search-suggest .si{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:var(--r-sm);font-size:var(--text-base);color:var(--ink);cursor:pointer;}
.search-suggest .si:hover,.search-suggest .si.on{background:var(--panel);}
.search-suggest .si .ico{color:var(--ink-3);width:16px;text-align:center;flex:none;}
.search-suggest .si .meta{margin-left:auto;font-size:var(--text-xs);color:var(--ink-3);}

/* 令牌字段（收件人式标签输入） */
.token-field{display:flex;flex-wrap:wrap;gap:6px;align-items:center;min-height:var(--ctrl-h-md);padding:5px 10px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--white);box-sizing:border-box;}
.token-field:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px var(--focus-ring);}
.token-field .token{display:inline-flex;align-items:center;gap:5px;background:var(--panel);border-radius:var(--r-sm);padding:2px 4px 2px 8px;font-size:var(--text-sm);color:var(--ink);}
.token-field .token .x{cursor:pointer;color:var(--ink-3);font-size:12px;line-height:1;}
.token-field .token .x:hover{color:var(--ink);}
.token-field input{border:none;outline:none;flex:1;min-width:90px;font-size:var(--text-base);background:none;color:var(--ink);height:24px;}
.token-field input::placeholder{color:var(--ink-3);}

/* =============================================================================
   批4 · 数据展示补全（可编辑行/行内操作/分组表头/固定列 + Lockup + 卡片集合 + 行内 disclosure）
   ============================================================================= */
/* 表格:可编辑单元格 */
.doc-table td.editing{padding:4px 8px;}
.doc-table td .cell-input{width:100%;height:28px;border:1px solid var(--accent);border-radius:var(--r-sm);padding:0 8px;font-size:var(--text-base);font-family:inherit;color:var(--ink);background:var(--white);box-sizing:border-box;}
.doc-table td .cell-input:focus{outline:none;box-shadow:0 0 0 2px var(--focus-ring);}
/* 表格:行内操作(hover 显示) */
.doc-table td.row-actions{text-align:right;white-space:nowrap;width:1%;}
.doc-table td.row-actions .act{opacity:0;display:inline-flex;width:24px;height:24px;align-items:center;justify-content:center;border-radius:var(--r-sm);color:var(--ink-3);cursor:pointer;border:none;background:none;transition:opacity .12s,background .12s;}
.doc-table tbody tr:hover td.row-actions .act{opacity:1;}
.doc-table td.row-actions .act:hover{background:var(--line);color:var(--ink);}
.doc-table td.row-actions .act.danger:hover{background:var(--danger-bg);color:var(--danger);}
/* 表格:分组表头行 */
.doc-table tr.group-row td{background:var(--panel);font-size:var(--text-xs);color:var(--ink-2);font-weight:var(--w-semibold);padding:6px 16px;letter-spacing:.03em;}
/* 表格:固定首列(需横向滚动容器) */
.doc-table.sticky-col th:first-child,.doc-table.sticky-col td:first-child{position:sticky;left:0;background:var(--white);z-index:1;}
.doc-table.sticky-col thead th:first-child{background:var(--white);}
.doc-table.sticky-col tbody tr:hover td:first-child{background:var(--panel);}

/* Lockup 图文组合块（图标 + 标题 + 副标题） */
.lockup{display:flex;align-items:center;gap:12px;}
.lockup .lk-icon{width:40px;height:40px;border-radius:var(--r-md);background:var(--panel);display:grid;place-items:center;color:var(--ink-2);font-size:18px;flex:none;}
.lockup .lk-body{display:flex;flex-direction:column;gap:1px;min-width:0;}
.lockup .lk-title{font-size:var(--text-base);font-weight:var(--w-medium);color:var(--ink);}
.lockup .lk-sub{font-size:var(--text-sm);color:var(--ink-3);}

/* 卡片集合（grid;靠 panel 底色层差区分,卡片不加边框守铁规） */
.card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px;}

/* 行内 disclosure（轻量展开,比 accordion 更轻） */
.disclosure .dt{display:flex;align-items:center;gap:6px;cursor:pointer;font-size:var(--text-base);color:var(--ink);padding:6px 0;user-select:none;}
.disclosure .dt .caret{font-size:9px;color:var(--ink-3);transition:transform .15s;display:inline-block;}
.disclosure.open .dt .caret{transform:rotate(90deg);}
.disclosure .dc{display:none;padding:2px 0 6px 18px;font-size:var(--text-sm);color:var(--ink-2);line-height:1.6;}
.disclosure.open .dc{display:block;}

/* =============================================================================
   批5 · 浮层补全（modal 结构/对话框式 alert + popover 箭头 + 窗口 chrome + 滚动吸顶）
   ============================================================================= */
/* modal 结构:标题 + 正文 + 按钮区 */
.modal__head{margin-bottom:var(--s3);}
.modal__title{font-size:var(--text-lg);font-weight:var(--w-semibold);color:var(--ink);}
.modal__body{font-size:var(--text-base);color:var(--ink-2);line-height:1.6;}
.modal__foot{display:flex;justify-content:flex-end;gap:8px;margin-top:var(--s5);}
/* 对话框式 alert（确认弹窗:标题+正文+按钮,比 modal 更窄） */
.dialog{background:var(--white);border-radius:var(--r-xl);box-shadow:var(--sh-modal);max-width:380px;padding:var(--s5);}
.dialog .dlg-title{font-size:var(--text-md);font-weight:var(--w-semibold);color:var(--ink);margin-bottom:6px;}
.dialog .dlg-body{font-size:var(--text-sm);color:var(--ink-2);line-height:1.6;}
.dialog .dlg-foot{display:flex;justify-content:flex-end;gap:8px;margin-top:var(--s5);}

/* popover 箭头指向(白色三角,暗色自动适配) */
.popover{position:relative;}
.popover.arrow-top::before{content:"";position:absolute;top:-6px;left:50%;transform:translateX(-50%);border:6px solid transparent;border-top:none;border-bottom-color:var(--white);}
.popover.arrow-bottom::before{content:"";position:absolute;bottom:-6px;left:50%;transform:translateX(-50%);border:6px solid transparent;border-bottom:none;border-top-color:var(--white);}
.popover.arrow-left::before{content:"";position:absolute;left:-6px;top:50%;transform:translateY(-50%);border:6px solid transparent;border-left:none;border-right-color:var(--white);}
.popover.arrow-right::before{content:"";position:absolute;right:-6px;top:50%;transform:translateY(-50%);border:6px solid transparent;border-right:none;border-left-color:var(--white);}

/* 窗口 chrome（桌面窗口/对话框;灯位用中性灰守克制,不上红黄绿） */
.window{background:var(--white);border-radius:var(--r-lg);box-shadow:var(--sh-modal);overflow:hidden;}
.window__bar{display:flex;align-items:center;gap:10px;height:38px;padding:0 12px;background:var(--panel);border-bottom:1px solid var(--line);}
.window__dots{display:flex;gap:7px;}
.window__dots i{width:11px;height:11px;border-radius:var(--r-pill);background:var(--line);display:block;}
.window__title{font-size:var(--text-sm);color:var(--ink-2);font-weight:var(--w-medium);}
.window__body{padding:var(--s5);}

/* 滚动吸顶 + 滚动阴影提示 */
.scroll-sticky{position:relative;max-height:240px;overflow-y:auto;}
.scroll-sticky .sticky-head{position:sticky;top:0;background:var(--white);z-index:2;border-bottom:1px solid var(--line);padding:10px 0;font-size:var(--text-xs);color:var(--ink-2);font-weight:var(--w-semibold);}
.scroll-shadow{background:
  linear-gradient(var(--white) 30%,transparent) top/100% 12px no-repeat,
  linear-gradient(transparent,var(--white) 70%) bottom/100% 12px no-repeat,
  radial-gradient(farthest-side at 50% 0,rgba(0,0,0,.08),transparent) top/100% 6px no-repeat,
  radial-gradient(farthest-side at 50% 100%,rgba(0,0,0,.08),transparent) bottom/100% 6px no-repeat;
  background-attachment:local,local,scroll,scroll;}

/* =============================================================================
   批6 · 状态/可视化补全（不确定进度/环形进度 + 图片容器 + 分享面板 + 编辑菜单;仪表与新图表见示范 SVG）
   ============================================================================= */
/* 不确定进度（来回滑动） */
.progress.is-indeterminate{position:relative;}
.progress.is-indeterminate .progress__bar{width:40%;animation:ah-prog 1.2s ease-in-out infinite;}
@keyframes ah-prog{0%{margin-left:-40%}100%{margin-left:100%}}

/* 环形进度（conic;用 --p 设百分比,如 style="--p:65%"） */
.ring{width:64px;height:64px;border-radius:var(--r-pill);background:conic-gradient(var(--ink) var(--p,0%),var(--line) 0);display:grid;place-items:center;flex:none;}
.ring::before{content:"";width:50px;height:50px;border-radius:var(--r-pill);background:var(--white);grid-area:1/1;}
.ring .val{grid-area:1/1;font-family:var(--font-mono);font-size:var(--text-sm);color:var(--ink);z-index:1;font-weight:var(--w-medium);}
.ring--sm{width:44px;height:44px;} .ring--sm::before{width:34px;height:34px;}

/* 图片容器（占位/比例/加载） */
.image-box{background:var(--panel);border-radius:var(--r-md);display:grid;place-items:center;color:var(--ink-3);overflow:hidden;position:relative;}
.image-box.r-16-9{aspect-ratio:16/9;} .image-box.r-1-1{aspect-ratio:1/1;} .image-box.r-4-3{aspect-ratio:4/3;}
.image-box .ph{font-size:22px;color:var(--ink-3);}
.image-box img{width:100%;height:100%;object-fit:cover;display:block;}
.image-box.loading{background:linear-gradient(90deg,var(--panel) 25%,var(--line) 37%,var(--panel) 63%);background-size:400% 100%;animation:sk 1.4s ease infinite;}

/* 分享/导出面板（选项网格） */
.share-panel{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;}
.share-panel .opt{display:flex;flex-direction:column;align-items:center;gap:6px;padding:12px 6px;border-radius:var(--r-md);cursor:pointer;color:var(--ink);font-size:var(--text-xs);background:none;border:none;}
.share-panel .opt:hover{background:var(--panel);}
.share-panel .opt .oi{width:40px;height:40px;border-radius:var(--r-md);background:var(--panel);display:grid;place-items:center;font-size:18px;color:var(--ink-2);}
.share-panel .opt:hover .oi{background:var(--line);}

/* 编辑菜单（文本选择浮起菜单,深底横向） */
.edit-menu{display:inline-flex;background:var(--ink);border-radius:var(--r-md);overflow:hidden;box-shadow:var(--sh-pop);}
.edit-menu button{padding:7px 14px;background:none;border:none;color:var(--white);font-size:var(--text-sm);cursor:pointer;border-right:1px solid rgba(255,255,255,.15);white-space:nowrap;}
.edit-menu button:last-child{border-right:none;}
.edit-menu button:hover{background:rgba(255,255,255,.12);}

/* 仪表容器（半环,SVG 填充见示范） */
.gauge{display:inline-flex;flex-direction:column;align-items:center;gap:4px;}
.gauge .g-val{font-family:var(--font-mono);font-size:var(--text-lg);font-weight:var(--w-semibold);color:var(--ink);}
.gauge .g-label{font-size:var(--text-xs);color:var(--ink-3);}

/* =============================================================================
   无障碍/国际化/新组件（对照 Apple HIG 审计补全）
   ============================================================================= */

/* —— 组合框 combobox（可输入下拉） —— */
.combobox{position:relative;}
.combobox .cb-list{position:absolute;top:calc(100% + 4px);left:0;right:0;background:var(--white);border-radius:var(--r-md);box-shadow:var(--sh-md);padding:6px;z-index:var(--z-dropdown);max-height:220px;overflow-y:auto;}
.combobox .cb-opt{padding:8px 10px;border-radius:var(--r-sm);font-size:var(--text-base);color:var(--ink);cursor:pointer;}
.combobox .cb-opt:hover,.combobox .cb-opt.on{background:var(--panel);}
.combobox .cb-opt .match{font-weight:var(--w-semibold);}

/* —— 路径栏 path（文件路径,各级可点） —— */
.path{display:inline-flex;align-items:center;gap:4px;font-size:var(--text-sm);flex-wrap:wrap;}
.path .seg{color:var(--ink-2);text-decoration:none;padding:2px 6px;border-radius:var(--r-sm);cursor:pointer;}
.path .seg:hover{background:var(--panel);color:var(--ink);}
.path .seg.here{color:var(--ink);font-weight:var(--w-medium);}
.path .sep{color:var(--ink-3);font-size:10px;}

/* —— 拖放区 drop-zone（Drag and drop 视觉反馈） —— */
.drop-zone{border:1.5px dashed var(--line);border-radius:var(--r-lg);padding:var(--s6);text-align:center;color:var(--ink-3);font-size:var(--text-base);transition:border-color .12s,background .12s,color .12s;}
.drop-zone.over{border-color:var(--accent);background:var(--accent-tint);color:var(--accent);}    /* 可接受 */
.drop-zone.invalid{border-color:var(--danger);background:var(--danger-bg);color:var(--danger);}    /* 不可接受 ⊘ */
.dragging{opacity:.5;}                                                                              /* 拖动中的源 */
.drop-insert{height:2px;background:var(--accent);border-radius:1px;margin:2px 0;}                   /* 插入点 */

/* —— 空状态组件 empty-state（图标 + 说明 + 下一步） —— */
.empty-state{display:flex;flex-direction:column;align-items:center;gap:12px;padding:var(--s7) var(--s5);text-align:center;}
.empty-state .es-icon{width:48px;height:48px;border-radius:var(--r-lg);background:var(--panel);display:grid;place-items:center;color:var(--ink-3);font-size:22px;}
.empty-state .es-title{font-size:var(--text-md);font-weight:var(--w-medium);color:var(--ink);}
.empty-state .es-desc{font-size:var(--text-sm);color:var(--ink-3);max-width:300px;line-height:1.55;}

/* —— 命中区(图标按钮围绕小目标加 padding,桌面 ≥32) —— */
.icon-btn{min-width:32px;min-height:32px;}

/* —— 国际化 RTL 基础支持 ——
   声明性支持;完整改 logical properties 逐组件在阶段6。此处:镜像方向图标 + 不翻转保护(↔Apple 不翻转清单)。 */
[dir="rtl"] .crumb .sep,[dir="rtl"] .path .sep{display:inline-block;transform:scaleX(-1);}
[dir="rtl"] .navbar .back{transform:scaleX(-1);}
/* 不翻转:播放控件/时间轴/图表/数字 mono/电话 始终 LTR */
[dir="rtl"] .slider,[dir="rtl"] svg,[dir="rtl"] .doc-table td.num,[dir="rtl"] .metric .v,[dir="rtl"] .text-mono,[dir="rtl"] .input-count{direction:ltr;}

/* —— Increase Contrast 响应(prefers-contrast:more:增强边框/分隔/焦点) —— */
@media (prefers-contrast:more){
  :root{--line:#A8A8A8; --ink-2:#454545; --ink-3:#5E5E5E;}
  .btn--secondary,.input,.textarea,.select,.stepper,.token-field{border-color:#8A8A8A;}
  *:focus-visible{outline:2px solid var(--ink) !important;outline-offset:2px;}
  .doc-table tbody td{border-bottom-color:#C0C0C0;}
}

/* —— Reduce Motion 响应(prefers-reduced-motion:reduce:无过渡/直接切换,禁循环与视差) —— */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important;}
}

/* =============================================================================
   8 页面布局体系 Page Layout (v6.0) — 多轨页面骨架 / 页型 / 页眉 / 搜索筛选 / 状态 / 预览 / 密度
   结构 ↔ 业内(Material/Carbon/Ant/Fluent/HIG…),取值全用 Aham。
   轨道:.track-web(居中收口) · .track-app(左对齐铺满) — 用 logical properties 支持 RTL。
   ============================================================================= */

/* —— 容器与居中(网页轨):页面壳 max-width + 居中;正文阅读宽独立 —— */
.container{width:100%;max-width:var(--page-max);margin-inline:auto;padding-inline:var(--margin-x);}
.container--content{max-width:var(--content-max);}
.container--read{max-width:var(--read-max);}   /* 正文阅读宽,与页面壳分离 */
.container--form{max-width:var(--form-max);}
.container--auth{max-width:var(--auth-max);}
.container--ultra{max-width:var(--ultra-max);}
.container--full{max-width:none;}
/* 应用轨:不居中,内容靠 leading 铺满(多余宽度交给 pane) */
.track-app .container,.container--fill{max-width:none;margin-inline:0;}

/* —— 12 列栅格(网页轨):gutter 与 margin 分离 —— */
.grid-12{display:grid;grid-template-columns:repeat(var(--grid-cols),1fr);gap:var(--gutter);}
.col-1{grid-column:span 1;} .col-2{grid-column:span 2;} .col-3{grid-column:span 3;}
.col-4{grid-column:span 4;} .col-6{grid-column:span 6;} .col-8{grid-column:span 8;}
.col-9{grid-column:span 9;} .col-12{grid-column:span 12;}
/* 机制提示:二维骨架/卡片墙用 grid;一维工具栏/按钮组用 flex(见 .toolbar/.btn-group) */

/* —— 容器查询:组件按父容器宽响应(供 AI 拼装,放主区/侧栏都正确) —— */
.cq{container-type:inline-size;}
@container (max-width:480px){ .cq-stack{flex-direction:column;align-items:stretch;} }

/* —— 页面三层结构:页眉 / 工具区 / 内容区 —— */
.page-shell{display:flex;flex-direction:column;min-height:0;}
.page-content{padding-block:var(--s5) var(--s6);}      /* 顶 24 / 底 32:底部不放关键控件(应用轨铁律) */

/* 页眉区:面包屑 → 标题(+副标题) → 页面级主操作(右);标题左上对齐 */
.page-header{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--s4);
  padding-block:var(--s5);}
.page-header__main{min-width:0;display:flex;flex-direction:column;gap:var(--s2);}
.page-header__crumb{display:flex;align-items:center;gap:6px;font-size:var(--text-xs);color:var(--ink-3);} /* ↔ .crumb;与 back 互斥 */
.page-header__title{font:var(--w-semibold) var(--text-2xl)/1.25 var(--font-sans-display);color:var(--ink);margin:0;}
.page-header__sub{font-size:var(--text-md);color:var(--ink-2);}    /* 副标题在标题下方,不与标题同行 */
.page-header__actions{display:flex;align-items:center;gap:var(--s2);flex:none;}  /* 全页仅一个 primary,置 trailing */
.page-header--divider{border-block-end:1px solid var(--line);}

/* —— 工具区:三段式 左(导航/视图) — 中(次要) — 右(搜索 + 唯一主操作) —— */
.page-toolbar{display:flex;align-items:center;gap:var(--s3);flex-wrap:wrap;padding-block:var(--s3);}
.page-toolbar__lead{display:flex;align-items:center;gap:var(--s2);}
.page-toolbar__center{display:flex;align-items:center;gap:var(--s2);flex-wrap:wrap;}
.page-toolbar__trail{display:flex;align-items:center;gap:var(--s2);margin-inline-start:auto;}  /* 搜索框 + 主操作常驻 */
.toolbar-search{min-width:200px;max-width:360px;flex:1 1 200px;}  /* 搜索框落 trailing,宽度护栏 */
.filter-chips{display:flex;align-items:center;gap:var(--s2);flex-wrap:wrap;}  /* 筛选 chips 用 .tag,含 × 移除 */
.result-count{font-size:var(--text-xs);color:var(--ink-2);}   /* 结果计数并入头部,绝不置底 */
.filter-clear{font-size:var(--text-xs);color:var(--ink-2);background:none;border:none;cursor:pointer;}
.filter-clear:hover{color:var(--ink);}

/* —— 内容密度:= 输入方式 × 宽度档;同页不混 —— */
[data-density="comfortable"]{--row-h:44px;--ctrl-h-md:40px;--density-scale:1.25;}
[data-density="standard"]{--row-h:36px;--ctrl-h-md:32px;--density-scale:1;}
[data-density="compact"]{--row-h:28px;--ctrl-h-md:28px;--density-scale:.75;}
.doc-table[data-density] tbody td{height:var(--row-h);}

/* —— 页面状态:空 / 加载骨架 / 错误(整页级居中;列表内嵌空态随容器左对齐) —— */
.page-state{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--s3);
  text-align:center;padding:var(--s8) var(--s5);color:var(--ink-2);}
.page-state__icon{width:48px;height:48px;color:var(--ink-3);}
.page-state__title{font:var(--w-semibold) var(--text-lg)/1.3 var(--font-sans);color:var(--ink);}
.page-state__desc{font-size:var(--text-base);color:var(--ink-2);max-width:42ch;}
.page-state__actions{display:flex;gap:var(--s2);margin-top:var(--s2);}  /* 空态必须给下一步 */
/* 页面内联通知/错误:置内容区顶部或就近,错误三重指示(框+图标+文字) */
.notice{display:flex;align-items:flex-start;gap:var(--s2);padding:var(--s3) var(--s4);border-radius:var(--r-md);
  font-size:var(--text-base);border:1px solid var(--line);background:var(--panel);color:var(--ink-2);}
.notice--error{border-color:#E3C9C5;background:var(--danger-bg);color:var(--danger);}
.notice--success{border-color:#CFE0D2;background:var(--success-bg);color:var(--success);}
.notice--warning{border-color:#E6DCC2;background:var(--warning-bg);color:var(--warning);}
/* 骨架白名单:容器/数据类才用(.skeleton 已定义);占位尺寸 = 最终尺寸,防 CLS */

/* —— 滚动 / 吸顶:sticky 页眉给主体内容偏移,避免遮挡 —— */
.sticky-top{position:sticky;top:0;z-index:var(--z-sticky);background:var(--bg-app);}
.scroll-area{overflow:auto;min-height:0;}     /* 虚拟列表/长表的滚动容器:固定高 + overflow */

/* —— 弹窗按钮顺序(↔Apple Alerts;桌面+网页统一按 macOS) ——
   取消在左 / 确认(默认,primary)在右下。DOM 顺序:取消在前、确认在后。
   .modal__foot / .dlg-foot 已 justify-content:flex-end,故 DOM 末项视觉在右。
   破坏性确认用 .btn--danger 且不设默认;未保存确认三按钮:取消 / 放弃(danger) / 保存(primary)。 */
.modal__foot,.dlg-foot{flex-direction:row;}  /* 窄屏可堆叠见下 @media */

/* —— 预览模式 Preview(Quick Look 式:空格预览 ≠ 双击打开) —— */
.preview{position:fixed;inset:0;z-index:var(--z-modal);display:flex;align-items:center;justify-content:center;
  background:var(--overlay);padding:var(--s6);}
.preview__stage{position:relative;max-width:min(90vw,var(--preview-max-w));max-height:var(--preview-max-h);
  background:var(--white);border-radius:var(--r-lg);box-shadow:var(--sh-modal);overflow:hidden;display:flex;flex-direction:column;}
.preview__bar{display:flex;align-items:center;justify-content:space-between;gap:var(--s3);
  padding:var(--s2) var(--s3);border-block-end:1px solid var(--line);}  /* 顶部:计数(中/左) + 分享/导出/删除(trailing) */
.preview__count{font:var(--text-sm)/1 var(--font-mono);color:var(--ink-2);}
.preview__body{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;background:var(--panel);overflow:auto;}
.preview__body img{max-width:100%;max-height:100%;object-fit:contain;}   /* 默认 fit;放大态 cursor:grab */
.preview__nav{position:absolute;top:50%;transform:translateY(-50%);width:36px;height:36px;border:none;border-radius:var(--r-pill);
  background:var(--white);box-shadow:var(--sh-pop);color:var(--ink);cursor:pointer;}
.preview__nav--prev{inset-inline-start:var(--s4);}    /* ← 上一张;键盘 ←/→ */
.preview__nav--next{inset-inline-end:var(--s4);}      /* → 下一张 */
.preview--full .preview__stage{max-width:none;max-height:none;width:100%;height:100%;border-radius:0;}
/* 关闭:Esc 或右上 ×;有未保存 markup 关闭前确认。深色 HUD 仅用于全屏媒体预览。 */

/* —— 媒体长宽比工具 —— */
.ar-square{aspect-ratio:1/1;} .ar-photo{aspect-ratio:4/3;} .ar-classic{aspect-ratio:3/2;}
.ar-wide{aspect-ratio:16/9;} .ar-ultrawide{aspect-ratio:2/1;}

/* —— 响应式:网页轨断点(rem 单一事实源)——gutter/margin 随断点收、栏折叠、按钮堆叠 —— */
@media (max-width:64rem){   /* < lg(1024):优先收第三栏 rightbar/inspector */
  :root{--gutter:16px;--margin-x:24px;}
  .page-shell .rightbar,.layout-rightbar{display:none;}
}
@media (max-width:48rem){   /* < md(768):侧栏折叠、三段工具栏换行、页眉操作降级 */
  :root{--gutter:12px;--margin-x:16px;}
  .grid-12{grid-template-columns:repeat(4,1fr);}      /* 8/12 列降为 4 概念列 */
  .page-header{flex-direction:column;align-items:stretch;}
  .modal__foot,.dlg-foot{flex-direction:column-reverse;align-items:stretch;}  /* 窄屏堆叠:确认在上、取消在下 */
  .preview{padding:var(--s3);}
}
@media (max-height:30rem){   /* 矮窗口:收顶栏纵向间距 */
  .page-header,.page-content{padding-block:var(--s3);}
}

/* =============================================================================
   9 媒体与对话 Media & Conversation (v6.1) — 音频/转写/正文/对话/附件/头像/壳/分组
   纳入自 AhamVoice 招牌自创件;守全部 Aham 铁律(单蓝点缀/状态非色/表格只横线/单一无衬线);
   说话人标记 .speaker-marker 用【形状】区分类别,不靠颜色(单蓝体系多类别范式,可复用)。
   ============================================================================= */
/* ① 媒体播放器 .player */
.player{display:flex;align-items:center;gap:var(--s3);width:100%;}
.player__wave{position:relative;flex:1;min-width:0;height:40px;cursor:pointer;display:block;border-radius:var(--r-sm);}
.player__wave:focus-visible{outline:none;box-shadow:0 0 0 3px var(--focus-ring);}
.player__wave svg{display:block;width:100%;height:100%;}
.player__wave .b{fill:var(--ink-4);} .player__wave .b--on{fill:var(--accent);}
.player__wave .ph{stroke:var(--accent);stroke-width:1.5;}
.player__time{font:var(--text-xs)/1 var(--font-mono);font-variant-numeric:tabular-nums;color:var(--ink-2);white-space:nowrap;flex:none;}
.player__time .sep{color:var(--ink-3);margin:0 2px;}
.player--mini{gap:var(--s2);}
.player--mini .player__wave{height:24px;}
.player--mini .player__time{font-size:11px;}

/* ② 逐句转写 .transcript + 说话人标记原子 .speaker-marker（形状区分,不靠色） */
.speaker-marker{display:inline-block;width:10px;height:10px;flex:none;background:var(--ink);vertical-align:-1px;}
.speaker-marker--s0{border-radius:var(--r-pill);}                                   /* 实心圆 */
.speaker-marker--s1{border-radius:1px;}                                             /* 实心方 */
.speaker-marker--s2{border-radius:1px;transform:rotate(45deg);}                     /* 菱形 */
.speaker-marker--s3{background:transparent;border-radius:var(--r-pill);box-shadow:inset 0 0 0 1.5px var(--ink);} /* 空心圆 */
.speaker-marker--s4{background:transparent;border-radius:1px;box-shadow:inset 0 0 0 1.5px var(--ink);}           /* 空心方 */
.speaker-marker--s5{width:12px;height:4px;border-radius:2px;}                       /* 短杠 */
.transcript{display:flex;flex-direction:column;}
.transcript__row{display:grid;grid-template-columns:60px 1fr;gap:2px var(--s4);padding:var(--s3);border-bottom:1px solid var(--line);border-radius:var(--r-sm);cursor:pointer;transition:background var(--dur-fast);}
.transcript__row:last-child{border-bottom:none;}
.transcript__row:hover{background:var(--fill-hover);}
.transcript__row.is-current{background:var(--fill-active);}
.transcript__time{font:var(--text-xs)/1.5 var(--font-mono);font-variant-numeric:tabular-nums;color:var(--ink-3);grid-row:1/3;}
.transcript__speaker{display:flex;align-items:center;gap:6px;font-size:var(--text-xs);font-weight:var(--w-medium);color:var(--ink-2);}
.transcript__text{font-size:var(--text-md);line-height:1.6;color:var(--ink);}

/* ③ 正文排版 .prose（继承 token;表格只横线;强调不衬线） */
.prose{font-size:var(--text-md);line-height:1.7;color:var(--ink);max-width:var(--read-max);}
.prose h1{font:var(--w-semibold) var(--text-3xl)/1.2 var(--font-sans-display);margin:1.3em 0 .5em;}
.prose h2{font:var(--w-semibold) var(--text-2xl)/1.25 var(--font-sans-display);margin:1.2em 0 .5em;}
.prose h3{font:var(--w-semibold) var(--text-xl)/1.3 var(--font-sans-display);margin:1.1em 0 .4em;}
.prose h4{font:var(--w-semibold) var(--text-lg)/1.3 var(--font-sans);margin:1em 0 .3em;}
.prose p{margin:.7em 0;}
.prose a{color:var(--accent);text-decoration:none;} .prose a:hover{text-decoration:underline;}
.prose strong{font-weight:var(--w-semibold);}
.prose ul,.prose ol{margin:.6em 0;padding-inline-start:1.4em;} .prose li{margin:.3em 0;}
.prose code{font:var(--text-sm)/1 var(--font-mono);background:var(--panel);padding:2px 5px;border-radius:var(--r-xs);}
.prose pre{background:var(--panel);padding:var(--s4);border-radius:var(--r-md);overflow:auto;} .prose pre code{background:none;padding:0;}
.prose blockquote{margin:.8em 0;padding-inline-start:var(--s4);border-inline-start:2px solid var(--line);color:var(--ink-2);}
.prose table{border-collapse:collapse;width:100%;font-size:var(--text-base);margin:.8em 0;}
.prose th,.prose td{text-align:start;padding:var(--s2) var(--s3);border-bottom:1px solid var(--line);}
.prose th{font-weight:var(--w-semibold);}
.prose td.num{text-align:end;font-family:var(--font-mono);font-variant-numeric:tabular-nums;}

/* ④ 对话式输入 .composer */
.composer{display:flex;flex-direction:column;gap:var(--s2);border:1px solid var(--line);border-radius:var(--r-lg);background:var(--white);padding:var(--s3);transition:border-color var(--dur-fast),box-shadow var(--dur-fast);}
.composer:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px var(--focus-ring);}
.composer__input{border:none;outline:none;resize:none;width:100%;min-height:44px;background:transparent;color:var(--ink);font:var(--text-md)/1.5 var(--font-sans);}
.composer__input::placeholder{color:var(--ink-3);}
.composer__bar{display:flex;align-items:center;gap:var(--s2);}
.composer__tools{display:flex;align-items:center;gap:2px;}
.composer__send{margin-inline-start:auto;}

/* ⑤ 附件/引用卡 .attachment */
.attachment{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:var(--s3) var(--s4);padding:var(--s3) var(--s4);background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);max-width:64ch;text-decoration:none;color:var(--ink);}
.attachment:hover{border-color:var(--ink-3);}
.attachment__type{font:var(--text-xs)/1 var(--font-mono);letter-spacing:.04em;text-transform:uppercase;color:var(--ink-3);background:var(--panel);padding:4px 6px;border-radius:var(--r-sm);white-space:nowrap;}
.attachment__body{min-width:0;}
.attachment__name{font-size:var(--text-sm);font-weight:var(--w-medium);color:var(--ink);margin:0;line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.attachment__meta{margin-top:2px;font-size:var(--text-xs);color:var(--ink-3);}
.attachment__actions{display:flex;gap:var(--s1);flex:none;}

/* ⑥ 头像 .avatar（不加品牌色,首字母 ink-2） */
.avatar{display:inline-flex;align-items:center;justify-content:center;flex:none;width:32px;height:32px;border-radius:var(--r-pill);background:var(--panel);color:var(--ink-2);font:var(--w-semibold) var(--text-sm)/1 var(--font-sans);overflow:hidden;}
.avatar img{width:100%;height:100%;object-fit:cover;}
.avatar--xs{width:20px;height:20px;font-size:11px;} .avatar--sm{width:24px;height:24px;font-size:var(--text-xs);}
.avatar--lg{width:40px;height:40px;font-size:var(--text-base);} .avatar--xl{width:56px;height:56px;font-size:var(--text-lg);}

/* ⑦ 侧栏三槽（只加子结构,不重定义 .sidebar） */
.sidebar__brand{display:flex;align-items:center;gap:var(--s2);padding:var(--s3) var(--s3) var(--s2);font:var(--w-semibold) var(--text-md)/1 var(--font-sans);color:var(--ink);}
.sidebar__nav{flex:1 1 auto;min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:2px;padding:var(--s2);}
.sidebar__foot{flex:none;border-top:1px solid var(--line);padding:var(--s2);}

/* ⑧ 认证/居中页壳 .auth-shell */
.auth-shell{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--s7) var(--s5);background:var(--bg-app);}
.auth-shell__brand{display:flex;align-items:center;gap:var(--s3);margin-bottom:var(--s7);font:var(--w-semibold) var(--text-md)/1 var(--font-sans);color:var(--ink);letter-spacing:-.01em;}
.auth-shell__card{width:100%;max-width:var(--auth-max);display:flex;flex-direction:column;gap:var(--s4);}
.brand-mark{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:var(--r-md);background:var(--accent);color:var(--on-accent);font:var(--w-bold) var(--text-md)/1 var(--font-sans);}

/* ⑨ 表单分组 .form-section */
.form-section{display:flex;flex-direction:column;gap:var(--s4);padding:var(--s5) 0;}
.form-section:first-of-type{padding-top:0;}
.form-section + .form-section{border-top:1px solid var(--line);}
.form-section__title{font:var(--w-semibold) var(--text-sm)/1.4 var(--font-sans);color:var(--ink);}
.form-section__hint{font-size:var(--text-xs);color:var(--ink-2);margin-top:-10px;}