:root {
  --bg: #f5f7f6;
  --surface: #ffffff;
  --surface-2: #f0f4f2;
  --ink: #121a17;
  --muted: #60706b;
  --line: #d9e1de;
  --line-strong: #9eb0aa;
  --teal: #008f7a;
  --teal-soft: #dff7f0;
  --coral: #cf5f4d;
  --coral-soft: #fde9e5;
  --amber: #b97813;
  --amber-soft: #fff2d8;
  --blue: #376f9f;
  --blue-soft: #e3eef8;
  --purple: #635aa8;
  --purple-soft: #ece9f8;
  --stock-w: 238px;
  --score-w: 116px;
  --decision-w: 218px;
  --day-w: 78px;
  --row-h: 128px;
}
* { box-sizing: border-box; }
html, body { margin: 0; min-width: 320px; background: var(--bg); color: var(--ink); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans SC", "PingFang SC", "Microsoft YaHei", Arial, sans-serif; letter-spacing: 0; }
body { font-size: 13px; line-height: 1.42; }
button, input { font: inherit; color: inherit; }
button { cursor: pointer; }
a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: 2px; }
.app { min-height: 100vh; display: grid; grid-template-columns: 292px minmax(0, 1fr) 388px; }
.side, .detail { position: sticky; top: 0; height: 100vh; overflow: auto; background: var(--surface); border-color: var(--line); border-style: solid; }
.side { border-width: 0 1px 0 0; padding: 14px; display: grid; align-content: start; gap: 10px; }
.detail { border-width: 0 0 0 1px; padding: 14px; }
.brand { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 10px; align-items: center; padding-bottom: 12px; border-bottom: 2px solid var(--ink); }
.brand-mark { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 8px; background: var(--ink); color: #fff; font-weight: 860; }
.brand h1 { margin: 0; font-size: 20px; line-height: 1.05; }
.brand p, .freshness, .section-title p, .eyebrow { margin: 0; color: var(--muted); font-size: 11px; }
.freshness { border: 1px solid var(--line); border-radius: 8px; padding: 9px; background: var(--surface-2); }
.control, .queue-shell, .panel, .audit-cell, .source-card, .source-link, .queue-item { border: 1px solid var(--line); border-radius: 8px; background: var(--surface); }
.control { padding: 10px; display: grid; gap: 8px; }
.control label, .section-label, .mini-label { color: var(--muted); font-size: 10px; font-weight: 840; text-transform: uppercase; display: flex; justify-content: space-between; gap: 8px; }
.segmented { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 5px; }
.segmented.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.segmented.four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.segmented button, .icon-button, input { min-height: 34px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-2); padding: 6px 8px; }
.segmented button[data-active="1"] { background: var(--ink); color: #fff; border-color: var(--ink); }
input { width: 100%; background: #fff; }
.queue-shell { padding: 10px; display: grid; gap: 8px; }
.queue { display: grid; gap: 7px; }
.queue-item { width: 100%; text-align: left; padding: 8px; display: grid; gap: 5px; }
.queue-item[data-selected="1"] { border-color: var(--teal); background: var(--teal-soft); }
.queue-row { display: flex; justify-content: space-between; gap: 8px; align-items: baseline; }
.queue-row strong { font-size: 12px; min-width: 0; overflow-wrap: anywhere; }
.queue-time { font-weight: 820; color: var(--teal); white-space: nowrap; font-variant-numeric: tabular-nums; }
.queue-note { color: var(--muted); font-size: 11px; overflow-wrap: anywhere; }
.main { min-width: 0; }
.top { position: sticky; top: 0; z-index: 30; min-height: 88px; display: flex; justify-content: space-between; gap: 12px; align-items: center; padding: 14px 16px; background: rgba(245, 247, 246, .94); backdrop-filter: blur(10px); border-bottom: 1px solid var(--line); }
.top h2 { margin: 3px 0 0; max-width: 740px; font-size: 26px; line-height: 1.08; }
.top-actions { display: flex; gap: 7px; }
.icon-button { width: 36px; height: 36px; display: inline-grid; place-items: center; text-decoration: none; }
.answers, .kpis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; padding: 12px 16px 0; }
.kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); padding-top: 8px; }
.answer, .kpi { border: 1px solid var(--line); background: var(--surface); border-radius: 8px; padding: 10px; min-height: 76px; }
.answer span, .kpi span { display: block; color: var(--muted); font-size: 10px; text-transform: uppercase; font-weight: 840; }
.answer strong, .kpi strong { display: block; margin-top: 6px; font-size: 19px; line-height: 1.08; overflow-wrap: anywhere; }
.answer.safe { border-color: var(--teal); background: var(--teal-soft); }
.answer.tight { border-color: var(--amber); background: var(--amber-soft); }
.answer.missed { border-color: var(--coral); background: var(--coral-soft); }
.calendar-block, .source-book-shell, .evolution { padding: 12px 16px 0; }
.section-title { display: flex; align-items: end; justify-content: space-between; gap: 12px; padding: 10px 0; }
.section-title span { font-weight: 860; }
.legend { display: flex; flex-wrap: wrap; gap: 10px; color: var(--muted); font-size: 10px; font-weight: 800; }
.dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 4px; background: var(--line-strong); }
.dot.open { background: var(--blue); }
.dot.deadline { background: var(--coral); }
.dot.refund { background: var(--teal); }
.dot.listing { background: var(--purple); }
.calendar { border: 1px solid var(--line); border-radius: 8px; background: var(--surface); overflow: auto; }
.calendar-grid { min-width: calc(var(--stock-w) + var(--score-w) + 20 * var(--day-w) + var(--decision-w)); }
.calendar-head, .calendar-row { display: grid; grid-template-columns: var(--stock-w) var(--score-w) repeat(20, var(--day-w)) var(--decision-w); }
.calendar-head { position: sticky; top: 0; z-index: 12; background: var(--surface); border-bottom: 2px solid var(--ink); }
.head-cell { min-height: 58px; border-right: 1px solid var(--line); padding: 8px; color: var(--muted); font-size: 11px; }
.head-cell b { display: block; color: var(--ink); font-size: 12px; }
.density { height: 4px; margin-top: 5px; border-radius: 999px; background: var(--surface-2); overflow: hidden; }
.density span { display: block; height: 100%; background: var(--blue); }
.calendar-row { min-height: var(--row-h); border-bottom: 1px solid var(--line); position: relative; }
.calendar-row[data-selected="1"] .stock-cell, .calendar-row[data-selected="1"] .score-cell, .calendar-row[data-selected="1"] .decision-cell { background: var(--teal-soft); }
.stock-cell, .score-cell, .decision-cell { border: 0; border-right: 1px solid var(--line); background: #fff; text-align: left; padding: 10px; min-width: 0; }
.score-cell { display: grid; align-content: center; gap: 8px; }
.decision-cell { border-left: 1px solid var(--line); border-right: 0; }
.stock-code { display: flex; align-items: center; gap: 7px; font-weight: 850; }
.rank { width: 24px; height: 24px; display: grid; place-items: center; border-radius: 6px; background: var(--ink); color: #fff; font-size: 11px; }
.stock-name { margin-top: 4px; font-weight: 720; }
.stock-meta, .decision-note { margin-top: 6px; color: var(--muted); font-size: 11px; }
.score-number { font-size: 30px; line-height: 1; font-weight: 880; font-variant-numeric: tabular-nums; }
.score-meter, .part-meter { height: 7px; border-radius: 999px; overflow: hidden; background: var(--surface-2); }
.score-meter span, .part-meter span { display: block; height: 100%; background: var(--ink); }
.source-confidence { color: var(--muted); font-size: 10px; }
.day-cell { min-height: var(--row-h); border-right: 1px solid #eef2f0; background: #fbfcfb; }
.day-cell:nth-child(odd) { background: #f7faf8; }
.track { position: absolute; left: calc(var(--stock-w) + var(--score-w)); right: var(--decision-w); top: 0; bottom: 0; pointer-events: none; }
.today-line { position: absolute; top: 0; bottom: 0; width: 2px; background: var(--purple); z-index: 3; }
.lockbar { position: absolute; top: 50px; height: 28px; border-radius: 7px; padding: 5px 8px; background: var(--ink); color: #fff; border: 1px solid var(--ink); font-size: 10px; white-space: nowrap; overflow: hidden; font-variant-numeric: tabular-nums; }
.lockbar.pending { background: #fff; color: var(--ink); border-style: dashed; }
.node { position: absolute; top: 14px; width: 2px; height: 88px; background: var(--line-strong); }
.node i, .node span { position: absolute; left: 1px; transform: translateX(-50%); width: 70px; text-align: center; font-size: 9px; font-style: normal; }
.node i { top: -12px; color: var(--muted); font-weight: 820; }
.node span { top: 90px; padding: 1px 3px; border-radius: 6px; border: 1px solid var(--line); background: #fff; color: var(--muted); }
.node.open { background: var(--blue); }
.node.deadline { background: var(--coral); width: 3px; }
.node.refund { background: var(--teal); width: 3px; }
.node.listing { background: var(--purple); }
.node.deadline span { color: var(--coral); background: var(--coral-soft); border-color: var(--coral); }
.node.refund span { color: var(--teal); background: var(--teal-soft); border-color: var(--teal); font-weight: 850; }
.node.listing span { color: var(--purple); background: var(--purple-soft); border-color: var(--purple); }
.pill-row { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 8px; }
.pill { border: 1px solid var(--line); background: var(--surface-2); border-radius: 999px; padding: 3px 7px; color: var(--muted); font-size: 10px; font-weight: 780; }
.pill.safe { color: #006b5f; background: var(--teal-soft); border-color: var(--teal); }
.pill.tight { color: var(--amber); background: var(--amber-soft); border-color: var(--amber); }
.pill.missed { color: var(--coral); background: var(--coral-soft); border-color: var(--coral); }
.detail { display: grid; align-content: start; gap: 10px; }
.detail-title { display: flex; justify-content: space-between; gap: 12px; align-items: start; padding-bottom: 10px; border-bottom: 2px solid var(--ink); }
.detail-title h3 { margin: 0; font-size: 20px; line-height: 1.08; }
.score-badge { min-width: 58px; height: 58px; display: grid; place-items: center; border-radius: 8px; background: var(--ink); color: #fff; font-size: 24px; font-weight: 880; }
.panel { padding: 10px; display: grid; gap: 8px; }
.gate { border: 1px solid var(--line); border-radius: 8px; padding: 10px; display: grid; gap: 6px; }
.gate.safe { border-color: var(--teal); background: var(--teal-soft); }
.gate.tight { border-color: var(--amber); background: var(--amber-soft); }
.gate.missed { border-color: var(--coral); background: var(--coral-soft); }
.gate-head { display: flex; justify-content: space-between; gap: 8px; color: var(--muted); font-size: 10px; text-transform: uppercase; font-weight: 840; }
.gate b { font-size: 14px; }
.gate p { margin: 0; color: var(--muted); font-size: 12px; }
.parts { display: grid; gap: 7px; }
.part-row { display: grid; grid-template-columns: 112px minmax(0, 1fr) 34px; gap: 8px; align-items: center; font-size: 11px; color: var(--muted); }
.facts { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.fact { border-top: 1px solid var(--line); padding-top: 7px; min-width: 0; }
.fact span { display: block; color: var(--muted); font-size: 10px; }
.fact b { display: block; margin-top: 2px; overflow-wrap: anywhere; }
.source-list { display: grid; gap: 7px; }
.source-link { padding: 8px; text-decoration: none; display: grid; gap: 3px; }
.source-link b { font-size: 12px; }
.source-link span { color: var(--muted); font-size: 11px; overflow-wrap: anywhere; }
.source-book { display: grid; grid-template-columns: repeat(auto-fit, minmax(238px, 1fr)); gap: 8px; }
.source-card { padding: 9px; display: grid; gap: 5px; text-decoration: none; min-height: 98px; }
.source-card b { font-size: 12px; }
.source-card span, .source-card p { margin: 0; color: var(--muted); font-size: 11px; overflow-wrap: anywhere; }
.source-card[data-tier="official"] { border-color: var(--blue); }
.source-card[data-tier="broker"] { border-color: var(--teal); }
.source-card[data-tier="design"] { border-color: var(--purple); }
.evolution-list { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 4px; }
.evolution-chip { flex: 0 0 260px; border: 1px solid var(--line); background: var(--surface); border-radius: 8px; padding: 8px; color: var(--muted); font-size: 11px; }
.evolution-chip b { display: block; color: var(--ink); margin-bottom: 2px; }
.audit { padding: 12px 16px 16px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.audit-cell { padding: 10px; min-height: 72px; }
.audit-cell b { display: block; font-size: 19px; margin-bottom: 4px; }
.audit-cell span { color: var(--muted); font-size: 11px; }
body[data-lang="en"] .zh, body[data-lang="zh"] .en { display: none; }
@media (max-width: 1280px) {
  .app { grid-template-columns: 260px minmax(0, 1fr); }
  .detail { position: static; grid-column: 1 / -1; height: auto; border-width: 1px 0 0; }
}
@media (max-width: 820px) {
  :root { --stock-w: 178px; --score-w: 92px; --decision-w: 172px; --day-w: 68px; --row-h: 122px; }
  .app { display: block; }
  .side, .detail { position: static; height: auto; border-width: 0 0 1px; }
  .top { position: static; align-items: start; }
  .top h2 { font-size: 22px; }
  .answers, .kpis, .audit { grid-template-columns: 1fr; }
  .calendar-block, .source-book-shell, .evolution, .answers, .kpis, .audit { padding-left: 10px; padding-right: 10px; }
  .facts { grid-template-columns: 1fr; }
  .legend { max-width: 220px; justify-content: flex-end; }
}