:root {
  /* 石板灰毛玻璃：底是石板灰到薰衣草的渐层，左下一团金光；卡片是半透明玻璃，长文放在深一点的「井」里才好读。
     强调色只有两个：淡黄（要你处理、关键价位）和淡蓝（有 edge、正面）。 */
  --page: #e4e4e8;
  --glass: rgba(255,255,255,.11); --glass-line: rgba(255,255,255,.22);
  --soft: rgba(255,255,255,.07); --soft-line: rgba(255,255,255,.13);
  --well: rgba(36,38,52,.5); --well-2: rgba(28,30,42,.5);
  --ink: #ffffff; --text-2: rgba(255,255,255,.88); --muted: rgba(255,255,255,.7); --dim: rgba(255,255,255,.5);
  --butter: #f6dd7d; --butter-ink: #2c2818; --sky: #c9d8f8; --sky-ink: #1d2943;
  --amber: #f2c46d; --coral: #f4b4a4; --coral-ink: #4a1f17; --green: #8fdcab;
  --dark: #2a2b36;
  --r-xl: 32px; --r-lg: 26px; --r-md: 20px; --r-sm: 14px;
  --sans: "Urbanist", "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  --serif: var(--sans); --serif-zh: var(--sans);
  /* 云端版的登录遮罩、退出按钮沿用这几个名字（dashboard/cloud/build.py） */
  --bg: #6a6d82; --panel: rgba(255,255,255,.12); --line: rgba(255,255,255,.22);
  --top-h: 0px; --tab-h: 64px;
  --sky-glow: radial-gradient(60vw 50vh at 100% 0%, rgba(196,202,236,.32), transparent 60%);
  --gold-glow: radial-gradient(70vw 62vh at 0% 100%, rgba(233,187,92,.82), rgba(233,187,92,0) 62%);
  --slate: linear-gradient(165deg, #5b5e73 0%, #727589 45%, #8d8fa2 100%);
}
* { box-sizing: border-box; }
html { background: var(--page); }
body { margin: 0; min-height: 100vh; color: var(--ink); font: 15px/1.6 var(--sans); background: var(--page);
  -webkit-font-smoothing: antialiased; }
a { color: var(--sky); } a:hover { color: #fff; }
button { font: inherit; color: inherit; cursor: pointer; }
.num { font-variant-numeric: tabular-nums lining-nums; }
.muted { color: var(--muted); }
[hidden] { display: none !important; }
::placeholder { color: var(--dim); }
::selection { background: rgba(246,221,125,.45); color: #fff; }
svg { fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

@keyframes rise { from { opacity: 0; transform: translateY(10px); } }
@keyframes spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { *, *::before { animation: none !important; transition: none !important; } }

/* ---------- 外框：圆角大玻璃板 + 左侧图标轨 ---------- */
.frame { margin: 20px; min-height: calc(100vh - 40px); border-radius: 38px; display: grid; grid-template-columns: 100px minmax(0, 1fr);
  background: var(--gold-glow), var(--sky-glow), var(--slate); background-attachment: fixed;
  box-shadow: 0 30px 80px rgba(46,48,66,.28), inset 0 1px 0 rgba(255,255,255,.25); }
.rail { position: sticky; top: 20px; height: calc(100vh - 40px); display: flex; flex-direction: column; align-items: center; gap: 34px;
  padding: 30px 0 30px 26px; }
.mark { width: 54px; height: 54px; border-radius: 50%; display: grid; place-items: center; color: #fff; text-decoration: none;
  font: 700 22px var(--sans); }
.mark svg { width: 44px; height: 44px; stroke-width: 2.4; }
.mark svg circle { fill: #fff; stroke: none; }
.rail-nav { display: flex; flex-direction: column; gap: 12px; padding: 9px; border-radius: 999px; background: var(--glass);
  border: 1px solid var(--glass-line); backdrop-filter: blur(14px); }
.rail-nav a { width: 50px; height: 50px; border-radius: 50%; display: grid; place-items: center; color: rgba(255,255,255,.82);
  transition: background .2s, color .2s, transform .2s; }
.rail-nav a:hover { background: rgba(255,255,255,.14); color: #fff; }
.rail-nav a.on { background: #fff; color: var(--dark); box-shadow: 0 8px 20px rgba(30,32,46,.25); }
.rail-nav svg { width: 21px; height: 21px; }
.frame-main { min-width: 0; padding: 0 30px 40px 22px; }

/* ---------- 顶栏：中间是行情胶囊，右边是电脑状态 ---------- */
.top { height: 92px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 12px; }
.brand { color: #fff; text-decoration: none; visibility: hidden; }
.name { font: 700 16px var(--sans); letter-spacing: .32em; }
.top .mini-market { justify-self: center; }
.top-right { justify-self: end; display: flex; align-items: center; gap: 10px; }
.icon-btn { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; background: var(--glass);
  border: 1px solid var(--glass-line); backdrop-filter: blur(14px); color: #fff; }
.icon-btn:hover { background: #fff; color: var(--dark); } .icon-btn svg { width: 19px; height: 19px; stroke-width: 2; }
.pill { display: inline-flex; align-items: center; gap: 8px; padding: 9px 16px; border-radius: 999px; background: var(--glass);
  border: 1px solid var(--glass-line); backdrop-filter: blur(14px); font-size: 13px; color: var(--text-2); white-space: nowrap;
  text-decoration: none; }
a.pill:hover { background: rgba(255,255,255,.18); color: #fff; }
.pill b { color: #fff; font-weight: 700; font-family: var(--sans); }
.dot { width: 8px; height: 8px; border-radius: 50%; background: var(--dim); flex: none; }
.dot.ok { background: var(--green); box-shadow: 0 0 0 4px rgba(143,220,171,.18); }
.dot.bad { background: var(--coral); } .dot.idle { background: rgba(255,255,255,.55); }

/* ---------- 问候 + 大数字 ---------- */
.hello { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: end; gap: 44px; padding: 4px 4px 34px; }
.hello > * { animation: rise .6s cubic-bezier(.2,.7,.2,1) both; }
.hello > :nth-child(2) { animation-delay: .08s; } .hello > :nth-child(3) { animation-delay: .16s; }
.hello h1 { margin: 0; font: 600 52px/1.12 var(--sans); letter-spacing: -.01em; }
.hello p { margin: 12px 0 0; font-size: 17px; color: var(--muted); }
.hello-stats { display: flex; gap: 46px; margin: 0; }
.hello-stats dt { font-size: 15px; color: var(--muted); }
.hello-stats dd { margin: 6px 0 0; font: 600 58px/1 var(--sans); letter-spacing: -.02em; }
.btn-add { height: 64px; padding: 0 30px; display: inline-flex; align-items: center; gap: 12px; border: 0; border-radius: 999px;
  background: #fff; color: var(--dark); font: 600 17px var(--sans); box-shadow: 0 14px 30px rgba(30,32,46,.22); transition: transform .2s, background .2s; }
.btn-add span { font-size: 26px; font-weight: 400; line-height: 1; }
.btn-add:hover { transform: translateY(-2px); background: var(--butter); }

/* ---------- 按钮、输入框 ---------- */
.btn-primary { min-height: 46px; padding: 0 22px; border: 0; border-radius: 999px; background: #fff; color: var(--dark);
  font-weight: 700; letter-spacing: .02em; transition: background .2s, transform .2s; }
.btn-primary:hover { background: var(--butter); } .btn-primary:disabled { opacity: .5; cursor: default; }
.btn-ghost { min-height: 46px; padding: 0 20px; border-radius: 999px; background: rgba(255,255,255,.1); color: #fff;
  border: 1px solid rgba(255,255,255,.3); font-weight: 600; transition: background .2s; }
.btn-ghost:hover { background: rgba(255,255,255,.2); } .btn-ghost:disabled { opacity: .5; cursor: default; }
input, textarea, select { font: 15px var(--sans); color: #fff; }
.newjob input, .doc-pane input[type="text"], .doc-pane textarea, .c-mine textarea, .curate select, .newjob input[type="search"] {
  padding: 12px 18px; border: 1px solid rgba(255,255,255,.16); background: var(--well-2); border-radius: 999px; color: #fff; }
.doc-pane textarea, .c-mine textarea { border-radius: var(--r-md); line-height: 1.7; resize: vertical; }
.newjob input:focus, .doc-pane input:focus, .doc-pane textarea:focus, .c-mine textarea:focus, .curate select:focus {
  outline: none; border-color: rgba(246,221,125,.7); box-shadow: 0 0 0 4px rgba(246,221,125,.16); }
.curate select option { color: #222; }
.hint { margin: 0; font-size: 13px; color: var(--muted); }
.err { margin: 0; font-size: 13px; color: var(--coral); }

/* ---------- 策略库：左列表 + 右档案 ---------- */
.split { display: flex; align-items: flex-start; gap: 24px; }
.list-pane { flex: 0 0 410px; position: sticky; top: 20px; max-height: calc(100vh - 40px); overflow-y: auto; padding: 0 8px 30px 0;
  display: flex; flex-direction: column; gap: 14px; scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.25) transparent; }
.detail-pane { flex: 1 1 auto; min-width: 0; padding: 0 0 40px; }

.newjob { padding: 18px; border-radius: var(--r-lg); background: var(--glass); border: 1px solid var(--glass-line);
  backdrop-filter: blur(16px); display: flex; flex-direction: column; gap: 10px; }
.newjob label, .src-label { font-size: 13px; letter-spacing: .12em; color: var(--muted); }
.newjob .row { display: flex; gap: 8px; }
.newjob .row input { flex: 1 1 auto; min-width: 0; }
.src-tabs { display: flex; align-items: center; gap: 4px; }
.src-label { margin-right: auto; }
.src-tabs button { min-height: 32px; padding: 2px 13px; border-radius: 999px; border: 1px solid rgba(255,255,255,.2);
  background: transparent; color: var(--text-2); font-size: 13px; }
.src-tabs button.on { background: #fff; border-color: #fff; color: var(--dark); font-weight: 700; }
.doc-pane { display: flex; flex-direction: column; gap: 8px; }
.doc-pane .btn-primary { align-self: flex-start; }
.file-pick { display: flex; align-items: center; min-height: 48px; padding: 0 18px; border: 1px dashed rgba(255,255,255,.4);
  border-radius: var(--r-md); cursor: pointer; letter-spacing: 0 !important; font-size: 14px !important; color: var(--sky) !important; }
.file-pick input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.file-pick:focus-within { border-color: var(--butter); }

.compare-link { position: relative; display: flex; flex-direction: column; gap: 2px; padding: 16px 70px 16px 20px; border-radius: var(--r-lg);
  background: var(--glass); border: 1px solid var(--glass-line); text-decoration: none; color: #fff; font-weight: 700; backdrop-filter: blur(16px); }
.compare-link span { font-size: 13px; font-weight: 400; color: var(--muted); }
.compare-link::after { content: "↗"; position: absolute; right: 14px; top: 50%; transform: translateY(-50%); width: 44px; height: 44px;
  border-radius: 50%; display: grid; place-items: center; background: rgba(255,255,255,.12); border: 1px solid var(--glass-line); font-weight: 400; }
.compare-link:hover { color: #fff; } .compare-link:hover::after { background: #fff; color: var(--dark); }

/* 要你做的：参考图的 To-do 卡片 */
.todo { padding: 18px; border-radius: var(--r-lg); background: var(--glass); border: 1px solid var(--glass-line); backdrop-filter: blur(16px);
  display: flex; flex-direction: column; gap: 12px; animation: rise .5s cubic-bezier(.2,.7,.2,1) both; }
.todo header { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.todo h2 { margin: 0; font: 700 19px var(--sans); }
.todo header p { margin: 2px 0 0; font-size: 13px; color: var(--muted); }
.todo ol { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.todo-item { display: flex; align-items: center; gap: 12px; padding: 12px 12px 12px 14px; border-radius: var(--r-md); background: var(--well);
  border: 1px solid var(--soft-line); }
.t-dot { width: 10px; height: 10px; flex: none; border-radius: 50%; background: var(--sky); }
.t-decide .t-dot, .t-concept .t-dot { background: var(--butter); } .t-fail .t-dot { background: var(--coral); } .t-loop .t-dot { background: var(--green); }
.t-decide { background: var(--butter); border-color: var(--butter); }
.t-decide .t-body b, .t-decide .t-body span { color: var(--butter-ink); } .t-decide .t-dot { background: var(--butter-ink); }
.t-body { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px; text-decoration: none; color: #fff; }
.t-body b { font-size: 14px; line-height: 1.35; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.t-body span { font-size: 12.5px; color: var(--muted); line-height: 1.45; }
.t-body:hover { color: #fff; } .t-body:hover b { text-decoration: underline; }
.t-btn { flex: none; min-height: 38px; padding: 0 16px; border: 0; border-radius: 999px; background: #fff; color: var(--dark);
  font: 700 13px var(--sans); display: inline-flex; align-items: center; text-decoration: none; white-space: nowrap; }
.t-btn:hover { background: var(--butter); color: var(--dark); } .t-btn:disabled { opacity: .6; cursor: default; }
.t-btn.ghost { background: rgba(255,255,255,.12); color: #fff; border: 1px solid rgba(255,255,255,.3); }
.t-btn.ghost:hover { background: #fff; color: var(--dark); }
.t-decide .t-btn.ghost { background: var(--dark); color: #fff; border: 0; }
.todo-empty { margin: 0; font-size: 13.5px; color: var(--muted); }
.todo-running { display: flex; flex-direction: column; gap: 6px; padding-top: 10px; border-top: 1px solid var(--soft-line); }
.todo-running h3 { margin: 0; font: 600 13px var(--sans); color: var(--muted); }
.todo-running a { display: flex; align-items: baseline; gap: 4px 8px; flex-wrap: wrap; color: #fff; text-decoration: none; font-size: 13px; }
.todo-running a b { font-weight: 600; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.todo-running a span { color: var(--muted); font-size: 12.5px; }
/* 频道追踪 */
.channels { padding: 18px; border-radius: var(--r-lg); background: var(--glass); border: 1px solid var(--glass-line); backdrop-filter: blur(16px);
  display: flex; flex-direction: column; gap: 10px; }
.channels header { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.channels h2 { margin: 0; font: 700 17px var(--sans); }
.channels header p { margin: 2px 0 0; font-size: 13px; color: var(--muted); }
.ch-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.ch-list li { display: flex; align-items: center; gap: 10px; padding: 9px 10px 9px 14px; border-radius: var(--r-sm); background: var(--well); border: 1px solid var(--soft-line); }
.ch-list li > div { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }
.ch-list b { font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ch-list span { font-size: 12px; color: var(--muted); } .ch-list em { font-style: normal; font-size: 12px; }
.ch-x { width: 32px; height: 32px; flex: none; display: grid; place-items: center; border-radius: 50%; border: 1px solid rgba(255,255,255,.22);
  background: transparent; color: var(--muted); }
.ch-x:hover { background: #fff; color: var(--dark); } .ch-x svg { width: 14px; height: 14px; stroke-width: 2.2; }
.ch-add { display: flex; gap: 8px; }
.ch-add input { flex: 1 1 auto; min-width: 0; padding: 11px 16px; border: 1px solid rgba(255,255,255,.16); border-radius: 999px; background: var(--well-2); color: #fff; }
.ch-add input:focus { outline: none; border-color: rgba(246,221,125,.7); box-shadow: 0 0 0 4px rgba(246,221,125,.16); }
.ch-add .btn-primary { min-height: 44px; }
.ch-sugg { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font-size: 12.5px; color: var(--muted); }
.ch-sugg button { padding: 4px 11px; border-radius: 999px; border: 1px dashed rgba(255,255,255,.4); background: transparent; color: #fff; font-size: 12.5px; font-weight: 600; }
.ch-sugg button:hover { background: #fff; color: var(--dark); border-style: solid; }
.ch-runs { display: flex; flex-direction: column; gap: 4px; font-size: 12.5px; color: var(--muted); }
.ch-runs a { color: #fff; text-decoration: none; display: flex; justify-content: space-between; gap: 8px; }
.ch-runs a small { color: var(--muted); white-space: nowrap; } .ch-runs a:hover { color: var(--butter); }
.ch-msg { margin: 0; padding: 7px 12px; border-radius: var(--r-sm); background: rgba(246,221,125,.13); color: var(--butter); font-size: 13px; }

.legend { margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font-size: 12px; color: var(--muted); }
.legend .chip { font-size: 11px; padding: 1px 8px; }

.cards { display: flex; flex-direction: column; gap: 20px; }
.group { display: flex; flex-direction: column; gap: 9px; animation: rise .55s cubic-bezier(.2,.7,.2,1) both; }
.group:nth-child(2) { animation-delay: .06s; } .group:nth-child(3) { animation-delay: .12s; } .group:nth-child(n+4) { animation-delay: .18s; }
.g-head, .group > summary { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.group > summary { cursor: pointer; list-style: none; padding: 10px 0 4px; border-top: 1px solid var(--soft-line); }
.group > summary::-webkit-details-marker { display: none; }
.group > summary::before { content: "▸"; color: var(--muted); font-size: 12px; }
.group[open] > summary::before { content: "▾"; }
.g-name { font: 700 17px var(--sans); color: #fff; }
.g-count { font: 600 13px var(--sans); color: var(--muted); }
.g-hint { margin: -4px 0 2px; font-size: 13px; color: var(--muted); flex-basis: 100%; }
.group > summary .g-hint { margin: 0; }
.g-you .g-name { color: var(--butter); }
.g-open { padding: 14px; margin: 0 -6px; border-radius: var(--r-lg); background: rgba(201,216,248,.14); border: 1px solid rgba(201,216,248,.4); }
.g-open .g-name { color: var(--sky); }
.group-empty { font-size: 14px; color: var(--text-2); padding: 4px 2px; }
.empty { padding: 40px 20px; text-align: center; color: var(--muted); }

.card { display: flex; gap: 12px; padding: 12px; border-radius: var(--r-md); background: var(--well); border: 1px solid var(--soft-line);
  text-decoration: none; color: #fff; transition: border-color .2s, transform .2s, background .2s; }
.card:hover { color: #fff; border-color: rgba(255,255,255,.32); transform: translateY(-1px); }
.card.sel { border-color: var(--butter); box-shadow: 0 0 0 3px rgba(246,221,125,.22); background: rgba(36,38,52,.62); }
.card.attn { border-color: rgba(246,221,125,.55); }
.thumb { width: 96px; height: 58px; flex: none; border-radius: var(--r-sm); background: rgba(255,255,255,.08); object-fit: cover;
  display: grid; place-items: center; font-size: 12px; color: var(--muted); }
.thumb.gold { background: var(--butter); color: var(--butter-ink); }
.card-body { min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.card-title { font-weight: 700; font-size: 15px; line-height: 1.38; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.card-meta, .card-note { font-size: 12.5px; color: var(--muted); }
.card-line { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; font-size: 12.5px; color: var(--muted); }

.chip { display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: 12px; font-weight: 600; line-height: 1.6; white-space: nowrap; }
.chip.no { background: rgba(255,255,255,.14); color: var(--text-2); }
.chip.yes { background: var(--sky); color: var(--sky-ink); }
.chip.thin { background: var(--amber); color: var(--butter-ink); }
.chip.attn { background: var(--butter); color: var(--butter-ink); }
.chip.run { background: transparent; color: #fff; border: 1px solid rgba(255,255,255,.4); }
.chip.fail { background: var(--coral); color: var(--coral-ink); }
.chip.note { background: rgba(255,255,255,.1); color: var(--muted); }
.chip.long { box-shadow: inset 0 0 0 1px rgba(255,255,255,.35); }
.spin { width: 11px; height: 11px; border: 2px solid rgba(255,255,255,.3); border-top-color: #fff; border-radius: 50%;
  display: inline-block; animation: spin .9s linear infinite; vertical-align: -1px; margin-right: 5px; }

/* ---------- 档案 ---------- */
.back { display: none; }
.dossier { padding: 30px 34px 34px; border-radius: var(--r-xl); background: var(--well); border: 1px solid var(--soft-line);
  backdrop-filter: blur(18px); display: flex; flex-direction: column; gap: 20px; animation: rise .45s cubic-bezier(.2,.7,.2,1) both; }
.d-head h1 { margin: 0; font: 700 28px/1.32 var(--sans); letter-spacing: -.005em; }
.d-head h1 .en { font-size: 18px; }
.d-meta { margin-top: 8px; display: flex; gap: 8px 16px; flex-wrap: wrap; font-size: 13.5px; color: var(--muted); }
.verdict { display: flex; gap: 26px; flex-wrap: wrap; align-items: flex-start; padding: 24px; border-radius: var(--r-lg);
  background: var(--soft); border: 1px solid var(--soft-line); }
.v-main { flex: 1 1 340px; min-width: 0; display: flex; flex-direction: column; gap: 9px; }
.v-label { font-size: 12.5px; letter-spacing: .16em; color: var(--muted); }
.v-head { font: 700 38px/1.15 var(--sans); color: #fff; letter-spacing: -.01em; }
.v-head.yes { color: var(--sky); } .v-head.thin { color: var(--amber); } .v-head.attn { color: var(--butter); } .v-head.fail { color: var(--coral); }
.v-sentence { margin: 0; font-size: 15.5px; line-height: 1.75; color: var(--text-2); }
/* 「等你决定」整块用淡黄，和参考图里的黄色行程卡一样醒目 */
.verdict.attn { background: var(--butter); border-color: var(--butter); color: var(--butter-ink); }
.verdict.attn .v-label, .verdict.attn .v-sentence, .verdict.attn .v-head.attn { color: var(--butter-ink); }
.verdict.attn .btn-primary { background: var(--dark); color: #fff; } .verdict.attn .btn-primary:hover { background: #000; }
.verdict.attn .btn-ghost { background: rgba(0,0,0,.06); color: var(--butter-ink); border-color: rgba(0,0,0,.25); }
.verdict.attn .warn { background: rgba(0,0,0,.07); color: var(--butter-ink); }
.warn { margin: 0; display: flex; gap: 8px; align-items: flex-start; font-size: 13.5px; color: var(--butter);
  background: rgba(246,221,125,.13); padding: 9px 12px; border-radius: var(--r-sm); }
.warn svg { flex: none; margin-top: 3px; width: 15px; height: 15px; stroke-width: 2; }
.stats { flex: 0 1 290px; display: flex; flex-direction: column; gap: 8px; }
.stat { padding: 10px 16px; border-radius: var(--r-md); background: var(--well-2); border: 1px solid var(--soft-line); }
.stat .k { font-size: 12.5px; color: var(--muted); }
.stat .v { font: 700 28px/1.25 var(--sans); }
.stat .v small { font: 500 12px var(--sans); color: var(--muted); }
.actions { display: flex; gap: 10px; flex-wrap: wrap; }
.steps { display: flex; list-style: none; padding: 0; margin: 6px 0 0; gap: 6px; }
.steps li { flex: 1; font-size: 12.5px; color: var(--muted); padding-top: 9px; border-top: 3px solid rgba(255,255,255,.15); border-radius: 2px; }
.steps li.done { border-color: var(--sky); } .steps li.now { border-color: var(--butter); color: #fff; font-weight: 700; }
.log { max-height: 200px; overflow: auto; font-size: 11.5px; white-space: pre-wrap; padding: 12px; margin: 0;
  border-radius: var(--r-sm); background: var(--well-2); color: var(--text-2); }

.longrun, .loop, .c-synth { padding: 20px 22px; border-radius: var(--r-lg); background: var(--soft); border: 1px solid var(--soft-line);
  display: flex; flex-direction: column; gap: 10px; }
.longrun .v-sentence b, .loop .v-sentence b { color: var(--butter); }
.loop { background: rgba(201,216,248,.1); border-color: rgba(201,216,248,.32); }
.tree { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 7px; }
.tree li { padding: 10px 14px; border-radius: var(--r-sm); background: var(--well-2); border: 1px solid var(--soft-line);
  display: flex; flex-wrap: wrap; gap: 4px 12px; align-items: baseline; }
.tree li.cur { border-color: var(--butter); }
.tree li a { color: #fff; text-decoration: none; flex: 1 1 260px; min-width: 0; }
.tree li a b { color: var(--sky); margin-right: 5px; }
.tree li > div { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; font-size: 12.5px; }
.props { display: grid; grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)); gap: 10px; }
.prop { padding: 14px 16px; border-radius: var(--r-md); background: var(--well-2); border: 1px solid var(--soft-line);
  display: flex; flex-direction: column; gap: 7px; }
.prop header { display: flex; justify-content: space-between; gap: 8px; align-items: baseline; }
.prop p { margin: 0; font-size: 13.5px; line-height: 1.65; color: var(--text-2); }
.prop .k { display: inline-block; min-width: 3.5em; color: var(--muted); font-size: 12px; }
.prop .btn-primary, .prop .as-btn { align-self: flex-start; margin-top: 4px; }
.as-btn { display: inline-flex; align-items: center; text-decoration: none; }
.exam { padding: 12px 16px; border-radius: var(--r-sm); background: var(--well-2); border: 1px solid var(--soft-line);
  display: flex; flex-wrap: wrap; gap: 10px; align-items: baseline; }
.exam.pass { border-color: var(--sky); } .exam.pass b { color: var(--sky); }
.table-scroll { overflow-x: auto; }
table.compare th small { display: block; font-size: 11px; color: var(--muted); font-weight: 400; }
table.compare td:first-child { color: var(--text-2); white-space: nowrap; }
table.compare td:last-child, table.compare th:last-child { background: rgba(246,221,125,.12); }

/* 关键画面：大图 + 缩略图条 */
.gallery { display: flex; flex-direction: column; gap: 10px; }
.g-stage { position: relative; border-radius: var(--r-lg); overflow: hidden; background: #15161d; border: 1px solid var(--soft-line); }
.g-main { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: contain; cursor: zoom-in; }
.g-nav, .g-zoom, .v-nav, .v-close { display: grid; place-items: center; border-radius: 50%; border: 1px solid rgba(255,255,255,.3);
  background: rgba(30,32,44,.6); backdrop-filter: blur(10px); color: #fff; transition: background .2s, color .2s, opacity .2s; }
.g-nav:hover, .g-zoom:hover, .v-nav:hover, .v-close:hover { background: #fff; color: var(--dark); }
.g-nav { position: absolute; top: 50%; transform: translateY(-50%); width: 46px; height: 46px; }
.g-nav.prev { left: 14px; } .g-nav.next { right: 14px; }
.g-nav svg, .v-nav svg { width: 22px; height: 22px; stroke-width: 2.2; }
.g-zoom { position: absolute; right: 14px; top: 14px; width: 40px; height: 40px; }
.g-zoom svg, .v-close svg { width: 18px; height: 18px; stroke-width: 2; }
.gal-count { position: absolute; left: 14px; top: 14px; padding: 4px 12px; border-radius: 999px; background: rgba(30,32,44,.6);
  backdrop-filter: blur(10px); font: 600 13px var(--sans); }
.g-cap { margin: 0; font-size: 15px; line-height: 1.7; color: var(--text-2); }
.g-cap b, #v-cap b { color: var(--butter); margin-right: 8px; font-weight: 700; }
.g-strip { display: flex; gap: 8px; overflow-x: auto; padding: 2px 2px 4px; scrollbar-width: none; scroll-behavior: smooth; }
.g-strip::-webkit-scrollbar { display: none; }
.g-thumb { position: relative; flex: 0 0 116px; padding: 0; border: 2px solid transparent; border-radius: 12px; overflow: hidden;
  background: #15161d; opacity: .55; transition: opacity .2s, border-color .2s; }
.g-thumb:hover { opacity: .9; }
.g-thumb.on { border-color: var(--butter); opacity: 1; }
.g-thumb img { display: block; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.g-thumb span { position: absolute; left: 5px; bottom: 4px; padding: 0 6px; border-radius: 999px; background: rgba(0,0,0,.6); font-size: 11px; font-weight: 600; }
.md img.shot, .c-src img.shot { cursor: zoom-in; }

/* 搜索面板 */
.search { position: fixed; inset: 0; z-index: 55; display: flex; justify-content: center; align-items: flex-start; padding: 70px 20px 20px;
  background: rgba(18,19,27,.72); backdrop-filter: blur(12px); animation: rise .2s ease both; }
.s-panel { width: min(760px, 100%); max-height: calc(100vh - 100px); display: flex; flex-direction: column; border-radius: var(--r-xl);
  background: rgba(58,60,78,.92); border: 1px solid var(--glass-line); box-shadow: 0 30px 70px rgba(0,0,0,.4); overflow: hidden; }
.s-bar { display: flex; align-items: center; gap: 12px; padding: 16px 18px; border-bottom: 1px solid var(--soft-line); }
.s-bar > svg { width: 20px; height: 20px; flex: none; color: var(--muted); stroke-width: 2; }
.s-bar input { flex: 1 1 auto; min-width: 0; border: 0; background: none; color: #fff; font: 500 18px var(--sans); }
.s-bar input:focus { outline: none; }
.s-bar input::-webkit-search-cancel-button { -webkit-appearance: none; display: none; }
.s-close { width: 36px; height: 36px; flex: none; display: grid; place-items: center; border-radius: 50%; border: 1px solid rgba(255,255,255,.25); background: none; color: #fff; }
.s-close:hover { background: #fff; color: var(--dark); } .s-close svg { width: 15px; height: 15px; stroke-width: 2.2; }
.s-results { overflow-y: auto; padding: 14px 18px 20px; display: flex; flex-direction: column; gap: 16px; }
.s-note { margin: 4px 0; color: var(--muted); font-size: 14px; }
.s-group { display: flex; flex-direction: column; gap: 8px; }
.s-group h3 { margin: 0; font: 600 13px var(--sans); color: var(--muted); letter-spacing: .08em; }
.s-concept { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; padding: 10px 14px; border-radius: var(--r-sm);
  background: var(--well); text-decoration: none; color: #fff; }
.s-concept span { color: var(--muted); font-size: 13px; } .s-concept small { flex-basis: 100%; color: var(--text-2); font-size: 12.5px; }
.s-doc { padding: 12px 14px; border-radius: var(--r-md); background: var(--well); border: 1px solid var(--soft-line); display: flex; flex-direction: column; gap: 8px; }
.s-title { color: #fff; text-decoration: none; font-weight: 700; display: flex; flex-direction: column; }
.s-title small { font-weight: 400; color: var(--muted); font-size: 12px; }
.s-hit { display: flex; flex-direction: column; gap: 4px; padding: 8px 10px; border-radius: 12px; background: rgba(255,255,255,.05);
  text-decoration: none; color: var(--text-2); font-size: 13px; line-height: 1.6; }
.s-hit .chip { align-self: flex-start; }
.s-hit:hover, .s-concept:hover, .s-title:hover { background: rgba(255,255,255,.12); color: #fff; }
.search mark, mark.hit { background: var(--butter); color: var(--butter-ink); border-radius: 3px; padding: 0 2px; }

/* 全屏看图 */
body.no-scroll { overflow: hidden; }
.viewer { position: fixed; inset: 0; z-index: 60; display: grid; grid-template-columns: 80px minmax(0, 1fr) 80px; align-items: center;
  padding: 28px 20px; background: rgba(18,19,27,.9); backdrop-filter: blur(16px); animation: rise .25s ease both; }
.viewer figure { margin: 0; min-width: 0; display: flex; flex-direction: column; align-items: center; gap: 14px; }
.viewer img { max-width: 100%; max-height: calc(100vh - 170px); border-radius: var(--r-md); box-shadow: 0 30px 70px rgba(0,0,0,.45); }
.viewer figcaption { max-width: 960px; text-align: center; font-size: 15.5px; line-height: 1.7; color: var(--text-2); }
.v-nav { width: 56px; height: 56px; justify-self: center; }
.v-close { position: absolute; right: 22px; top: 22px; width: 46px; height: 46px; }
.v-count { position: absolute; left: 24px; top: 30px; font: 600 14px var(--sans); color: var(--muted); }
.viewer.single .v-nav { visibility: hidden; }
.one-line h2, .c-tags h2, .concept section > h2 { margin: 0 0 8px; font: 700 17px var(--sans); color: #fff; display: flex; align-items: center; gap: 10px; }
.one-line h2::before, .c-tags h2::before, .concept section > h2::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--butter); }
.one-line p { margin: 0; font-size: 15.5px; line-height: 1.75; color: var(--text-2); }
.tabs { display: flex; gap: 4px; padding: 5px; border-radius: 999px; background: var(--well-2); overflow-x: auto; scrollbar-width: none; }
.tabs button { flex: none; min-height: 40px; padding: 0 18px; border: 0; border-radius: 999px; background: none; color: var(--muted); font-weight: 600; }
.tabs button:hover { color: #fff; }
.tabs button.on { background: #fff; color: var(--dark); }
.kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.equity { width: 100%; height: 240px; display: block; margin: 8px 0 14px; }
table.grid { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.grid th { text-align: left; font-weight: 600; color: var(--muted); padding: 9px 10px; border-bottom: 1px solid rgba(255,255,255,.2); }
.grid td { padding: 10px; border-bottom: 1px solid rgba(255,255,255,.08); }
.grid .r { text-align: right; }
details.raw { margin-top: 10px; border-radius: var(--r-md); background: var(--soft); border: 1px solid var(--soft-line); }
details.raw > summary { cursor: pointer; padding: 13px 16px; font-weight: 600; }
details.raw > .md { padding: 4px 18px 18px; }

/* markdown（笔记、规则、报告） */
.md { font-size: 15px; line-height: 1.8; overflow-wrap: anywhere; color: var(--text-2); }
.md h1 { font: 700 22px var(--sans); color: #fff; margin: 4px 0 14px; }
.md h2 { font: 700 18px var(--sans); color: var(--sky); margin: 26px 0 8px; }
.md h3 { font: 700 15.5px var(--sans); color: #fff; margin: 18px 0 6px; }
.md strong { color: #fff; }
.md ul, .md ol { padding-left: 22px; }
.md blockquote { margin: 12px 0; padding: 9px 14px; border-left: 3px solid var(--butter); border-radius: 0 var(--r-sm) var(--r-sm) 0;
  background: rgba(246,221,125,.1); color: var(--text-2); }
.md blockquote p { margin: 4px 0; }
.md table { border-collapse: collapse; width: 100%; font-size: 13.5px; margin: 12px 0; display: block; overflow-x: auto; }
.md th, .md td { border: 1px solid rgba(255,255,255,.13); padding: 7px 10px; text-align: left; vertical-align: top; }
.md th { background: rgba(255,255,255,.06); color: var(--muted); font-weight: 600; }
.md code { background: rgba(0,0,0,.25); padding: 1px 6px; border-radius: 6px; font-size: 12.5px; }
.md pre { background: rgba(0,0,0,.25); padding: 14px; overflow: auto; border-radius: var(--r-sm); }
.md img.shot { display: block; width: 100%; max-width: 820px; height: auto; margin: 14px 0 6px; border-radius: var(--r-md); border: 1px solid var(--soft-line); }

/* ---------- 总览比较表 ---------- */
.compare-view { padding: 0 0 40px; display: flex; flex-direction: column; gap: 14px; }
.cmp-head h1 { margin: 6px 0 6px; font: 700 28px var(--sans); }
.cmp-back { text-decoration: none; font-size: 14px; }
.cmp-scroll { overflow-x: auto; border-radius: var(--r-lg); background: var(--well); border: 1px solid var(--soft-line); backdrop-filter: blur(16px); }
table.cmp { min-width: 980px; }
table.cmp th { white-space: nowrap; }
table.cmp th.grp { text-align: center; border-bottom: 1px solid rgba(255,255,255,.13); color: #fff; font-weight: 700; }
table.cmp th.grp small { display: block; font-size: 11px; color: var(--muted); font-weight: 400; }
table.cmp th.sort { cursor: pointer; user-select: none; }
table.cmp th.sort:hover { color: #fff; }
table.cmp th.desc::after { content: " ▾"; } table.cmp th.asc::after { content: " ▴"; }
table.cmp .g7 { border-left: 1px solid rgba(255,255,255,.1); }
table.cmp .gu { background: rgba(246,221,125,.1); }
table.cmp th.gu, table.cmp td.gu.todo { border-left: 1px solid rgba(255,255,255,.1); }
table.cmp td.cname { min-width: 240px; max-width: 340px; }
table.cmp td.cname a { display: block; color: #fff; text-decoration: none; font-weight: 600; line-height: 1.4; margin-bottom: 5px; }
table.cmp td.cname a:hover { color: var(--butter); }
table.cmp td.todo { text-align: center; color: var(--muted); font-size: 12.5px; }
table.cmp tr.st-open td.cname, table.cmp tr.st-passed td.cname { box-shadow: inset 3px 0 0 var(--sky); }
.pass { color: var(--sky); font-weight: 800; }
.few { color: var(--amber); }

/* ---------- 概念库 ---------- */
.curate { padding: 14px 16px; border-radius: var(--r-md); background: rgba(246,221,125,.13); border: 1px solid rgba(246,221,125,.45);
  display: flex; flex-direction: column; gap: 9px; }
.curate p { margin: 0; font-size: 13.5px; }
.curate .actions { align-items: center; }
.curate select { min-height: 46px; padding: 0 16px; }
.en { font: 500 15px var(--sans); color: var(--muted); letter-spacing: .02em; }
.c-card .card-title .en { font-size: 13px; }
.c-tags > div { display: flex; flex-wrap: wrap; gap: 8px; }
.tag { display: inline-flex; align-items: baseline; gap: 6px; padding: 6px 14px; border-radius: 999px; background: var(--soft);
  border: 1px solid rgba(255,255,255,.22); color: #fff; text-decoration: none; font-size: 13.5px; font-weight: 600; }
.tag:hover { background: #fff; color: var(--dark); }
.tag small { font-size: 11px; color: var(--muted); font-weight: 400; } .tag:hover small { color: #555; }
.c-synth dl { margin: 0; display: grid; grid-template-columns: 96px 1fr; gap: 7px 14px; }
.c-synth dt { font-size: 12.5px; color: var(--muted); padding-top: 2px; } .c-synth dd { margin: 0; line-height: 1.75; color: var(--text-2); }
.c-srcs { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 12px; }
.c-src { padding: 14px 16px; border-radius: var(--r-md); background: var(--well-2); border: 1px solid var(--soft-line);
  display: flex; flex-direction: column; gap: 9px; min-width: 0; }
.c-src header { display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: baseline; }
.c-src header a { font-weight: 700; text-decoration: none; color: #fff; } .c-src header a:hover { color: var(--butter); }
.c-src header .muted { font-size: 12.5px; }
.c-src p { margin: 0; line-height: 1.75; color: var(--text-2); }
.c-src blockquote { margin: 0; padding: 7px 12px; border-left: 3px solid var(--butter); border-radius: 0 var(--r-sm) var(--r-sm) 0;
  background: rgba(246,221,125,.1); color: var(--text-2); font-size: 13.5px; }
.c-src blockquote b { color: var(--butter); font-weight: 700; }
.c-src img.shot { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; border-radius: var(--r-sm); border: 1px solid var(--soft-line); }
.c-mine textarea { width: 100%; }
.c-mine .actions { margin-top: 10px; align-items: center; }

/* ---------- 盘面 ---------- */
.market-view { padding: 0 0 40px; }
.sources { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 16px; }
.market-grid { display: grid; grid-template-columns: minmax(380px, 1.1fr) 2fr; gap: 18px; }
.chart-wrap { grid-column: 1 / -1; }
.panel { padding: 24px 26px; border-radius: var(--r-xl); background: var(--well); border: 1px solid var(--soft-line); backdrop-filter: blur(16px); }
.panel-title { font-size: 12.5px; letter-spacing: .2em; color: var(--muted); margin-bottom: 14px; }
.eyebrow { font-size: 12.5px; letter-spacing: .2em; color: var(--butter); }
.hero .price { font: 600 74px/1.02 var(--sans); letter-spacing: -.02em; margin: 14px 0 6px; color: #fff; }
.price-src { color: var(--muted); font-size: 12.5px; }
.va { display: inline-block; margin: 16px 0 18px; padding: 6px 16px; border-radius: 999px; background: var(--butter); color: var(--butter-ink);
  font: 700 14px var(--sans); }
.facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 0; padding-top: 16px; border-top: 1px solid var(--soft-line); }
.facts dt { font-size: 12px; color: var(--muted); } .facts dd { margin: 4px 0 0; font: 700 20px var(--sans); }
.note { margin: 18px 0 0; font-size: 12.5px; color: var(--muted); }
.ladder { display: flex; flex-direction: column; }
.rung { display: grid; grid-template-columns: 110px 1fr 100px 110px; align-items: center; gap: 12px; padding: 9px 0;
  border-bottom: 1px dashed rgba(255,255,255,.12); }
.rung .lbl { color: var(--muted); font-size: 13.5px; } .rung .val { font: 700 17px var(--sans); text-align: right; }
.rung .dist { text-align: right; font-size: 13px; }
.rung .bar { height: 2px; background: rgba(255,255,255,.12); position: relative; }
.rung .bar i { position: absolute; top: -2px; height: 6px; border-radius: 3px; background: rgba(255,255,255,.45); }
.rung.now { margin: 3px -12px; padding: 9px 12px; border-radius: var(--r-sm); border-bottom: 0; background: rgba(246,221,125,.16); }
.rung.now .lbl, .rung.now .val { color: var(--butter); }
.up { color: var(--sky); } .down { color: var(--butter); }
#chart { width: 100%; height: 340px; display: block; }

/* ---------- 手机 ---------- */
.tabbar { display: none; }
@media (max-width: 999px) {
  body { background: var(--slate); }
  .frame { margin: 0; border-radius: 0; min-height: 100vh; display: block; box-shadow: none; }
  .rail, .top .mini-market { display: none; }
  .frame-main { padding: 0; }
  .top { position: sticky; top: 0; z-index: 10; height: 58px; padding: 0 16px; grid-template-columns: 1fr auto;
    background: rgba(78,81,100,.6); backdrop-filter: blur(18px); border-bottom: 1px solid var(--soft-line); }
  .brand { visibility: visible; }
  .hello { display: none; }
  body.r-library .hello { display: grid; grid-template-columns: 1fr; gap: 16px; padding: 20px 18px 10px; }
  .hello h1 { font-size: 32px; } .hello p { font-size: 14px; margin-top: 6px; }
  .hello-stats { gap: 26px; } .hello-stats dt { font-size: 13px; } .hello-stats dd { font-size: 34px; }
  .btn-add { display: none; }
  .split { display: block; }
  .list-pane { position: static; max-height: none; overflow: visible; padding: 10px 14px calc(var(--tab-h) + 40px); }
  .detail-pane { padding: 0 0 calc(var(--tab-h) + 40px); }
  body.r-library .detail-pane { display: none; }
  body.r-dossier .list-pane { display: none; }
  .back { display: flex; align-items: center; gap: 2px; min-height: 48px; padding: 0 14px; text-decoration: none; color: #fff; font-size: 15px; font-weight: 600; }
  .back svg { width: 20px; height: 20px; stroke-width: 2; }
  .dossier { margin: 0 10px; padding: 22px 16px 24px; border-radius: var(--r-lg); gap: 18px; }
  .d-head h1 { font-size: 22px; }
  .verdict { padding: 18px 16px; gap: 14px; }
  .v-head { font-size: 30px; }
  .stats { flex: 1 1 100%; flex-direction: row; }
  .stat { flex: 1 1 0; padding: 8px 10px; } .stat .v { font-size: 22px; } .stat .v small { display: none; }
  .actions.sticky { position: sticky; bottom: calc(var(--tab-h) + 22px); z-index: 5; padding: 10px; border-radius: 999px;
    background: rgba(44,40,24,.85); backdrop-filter: blur(14px); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .verdict.attn .actions.sticky .btn-ghost { color: #fff; border-color: rgba(255,255,255,.35); }
  .verdict.attn .actions.sticky .btn-primary { background: var(--butter); color: var(--butter-ink); }
  .g-nav { width: 40px; height: 40px; } .g-nav.prev { left: 8px; } .g-nav.next { right: 8px; }
  .g-thumb { flex-basis: 92px; }
  .viewer { grid-template-columns: 1fr; padding: 70px 10px 100px; }
  .search { padding: 12px 10px; } .s-panel { max-height: calc(100vh - 24px); border-radius: var(--r-lg); }
  .icon-btn { width: 38px; height: 38px; }
  .viewer img { max-height: calc(100vh - 260px); border-radius: var(--r-sm); }
  .v-nav { position: fixed; bottom: 28px; } .v-nav.prev { left: 28px; } .v-nav.next { right: 28px; }
  .v-close { right: 14px; top: 14px; } .v-count { left: 18px; top: 26px; }
  .longrun, .loop, .c-synth { padding: 16px 14px; }
  table.compare { font-size: 12px; table-layout: fixed; }
  table.compare th, table.compare td { padding: 7px 4px; }
  table.compare th:first-child, table.compare td:first-child { width: 27%; white-space: normal; }
  table.compare .chip { padding: 1px 5px; font-size: 11px; white-space: normal; }
  .kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .c-srcs { grid-template-columns: 1fr; }
  .c-synth dl { grid-template-columns: 1fr; gap: 2px; } .c-synth dd { margin-bottom: 6px; }
  .tabbar { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; position: fixed; left: 14px; right: 14px;
    bottom: calc(12px + env(safe-area-inset-bottom)); z-index: 10; height: var(--tab-h); padding: 6px; border-radius: 999px;
    background: rgba(40,42,56,.72); backdrop-filter: blur(20px); border: 1px solid var(--glass-line); box-shadow: 0 14px 30px rgba(20,22,34,.3); }
  .tabbar a { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; border-radius: 999px;
    font-size: 11.5px; font-weight: 600; color: var(--muted); text-decoration: none; }
  .tabbar a.on { background: #fff; color: var(--dark); }
  .tabbar svg { width: 21px; height: 21px; }
  .market-view { padding: 12px 12px calc(var(--tab-h) + 40px); }
  .market-grid { grid-template-columns: 1fr; gap: 12px; }
  .panel { padding: 20px 18px; border-radius: var(--r-lg); }
  .hero .price { font-size: 52px; }
  .rung { grid-template-columns: 84px 1fr 86px 84px; gap: 8px; }
  #chart { height: 300px; }
  .compare-view { padding: 12px 0 calc(var(--tab-h) + 40px); }
  .cmp-head, .compare-view > .hint { padding: 0 16px; }
  .cmp-scroll { margin: 0 10px; border-radius: var(--r-md); }
  table.cmp { min-width: 760px; font-size: 12px; }
  table.cmp td.cname { position: sticky; left: 0; z-index: 1; background: #4a4c5f; min-width: 150px; max-width: 150px; }
  table.cmp th.cname { position: sticky; left: 0; z-index: 2; background: #4a4c5f; }
  table.cmp td.cname a { font-size: 12px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
}

/* ---------- 本机登录页 ---------- */
.login-page { display: grid; place-items: center; min-height: 100vh; padding: 16px; background: var(--gold-glow), var(--slate); }
.login { width: min(380px, 100%); display: flex; flex-direction: column; gap: 12px; padding: 30px; border-radius: var(--r-xl);
  background: var(--glass); border: 1px solid var(--glass-line); backdrop-filter: blur(18px); color: #fff; }
.login .brand { visibility: visible; display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.login .mark { background: rgba(255,255,255,.14); border: 1px solid var(--glass-line); }
.login label { font-size: 12.5px; color: var(--muted); letter-spacing: .12em; }
.login input { width: 100%; padding: 13px 18px; border: 1px solid rgba(255,255,255,.18); border-radius: 999px; background: var(--well-2); color: #fff; font: 15px var(--sans); }

/* ---------- 随手记 ---------- */
body.r-notes .hello { display: none !important; }
#view-notes { padding-top: 4px; }
.jot textarea { padding: 14px 18px; border: 1px solid rgba(255,255,255,.16); background: var(--well-2); border-radius: var(--r-md);
  color: #fff; line-height: 1.7; resize: vertical; min-height: 92px; }
.jot textarea:focus { outline: none; border-color: rgba(246,221,125,.7); box-shadow: 0 0 0 4px rgba(246,221,125,.16); }
.jot-row { display: flex; align-items: center; gap: 10px; }
.jot-row .hint { flex: 1 1 auto; min-width: 0; }
.jot-pick { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 16px; border-radius: 999px; cursor: pointer;
  border: 1px solid rgba(255,255,255,.3); color: #fff !important; font-size: 14px !important; letter-spacing: 0 !important; }
.jot-pick:hover, .jot-pick:focus-within { background: rgba(255,255,255,.14); }
.jot-pick input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.jot-pick svg { width: 18px; height: 18px; }
.jot-img { position: relative; align-self: flex-start; }
.jot-img img { display: block; max-width: 100%; max-height: 180px; border-radius: var(--r-sm); }
.jot-x { position: absolute; top: 6px; right: 6px; width: 30px; height: 30px; border: 0; border-radius: 50%;
  background: rgba(20,22,32,.75); color: #fff; font-size: 18px; line-height: 1; }
.jot-filter { gap: 12px; }
.jot-folders { display: flex; flex-wrap: wrap; gap: 6px; }
.jot-folders button { min-height: 34px; padding: 2px 14px; border-radius: 999px; border: 1px solid rgba(255,255,255,.2);
  background: transparent; color: var(--text-2); font-size: 13px; }
.jot-folders button.on { background: #fff; border-color: #fff; color: var(--dark); font-weight: 700; }
.jot-day { margin: 8px 4px 0; font-size: 13px; letter-spacing: .12em; color: var(--muted); }
.jot-card { cursor: pointer; }
div.jot-card { cursor: default; opacity: .85; }
.jot-raw { font-size: 14px; color: var(--text-2); line-height: 1.55; overflow-wrap: anywhere;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.jot-tag { font-size: 12.5px; color: var(--sky); }
.jot-detail h2 { margin: 0 0 10px; font-size: 13px; letter-spacing: .14em; color: var(--muted); font-weight: 600; }
.jot-said { margin: 0; padding: 14px 18px; border-left: 3px solid var(--butter); border-radius: 0 var(--r-sm) var(--r-sm) 0;
  background: var(--soft); font-size: 16px; line-height: 1.75; overflow-wrap: anywhere; }
.jot-photo { display: block; margin-top: 12px; max-width: 100%; max-height: 70vh; border-radius: var(--r-md); }
.jot-todo { margin: 0; padding: 12px 18px; border-radius: var(--r-md); background: var(--butter); color: var(--butter-ink); font-weight: 600; }
.jot-note .md { overflow-wrap: anywhere; }
.jot-note .md h3 { font-size: 16px; margin: 14px 0 6px; }
@media (max-width: 999px) {
  .tabbar { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  body.r-notes.r-library .detail-pane { display: none; }
  .jot-row .btn-primary { margin-left: auto; }
}
.jot-manage textarea, .jot-edit input, .jot-edit select { width: 100%; padding: 12px 16px; border: 1px solid rgba(255,255,255,.16);
  background: var(--well-2); border-radius: var(--r-sm); color: #fff; line-height: 1.6; }
.jot-manage textarea { resize: vertical; }
.jot-manage textarea:focus, .jot-edit input:focus, .jot-edit select:focus { outline: none; border-color: rgba(246,221,125,.7); }
.jot-edit select option { color: #222; }
.jot-manage .actions { margin-top: 10px; }
details.jot-manage { padding: 14px 18px; border-radius: var(--r-md); background: var(--soft); border: 1px solid var(--soft-line); }
details.jot-manage summary { cursor: pointer; font-weight: 600; color: var(--text-2); }
.jot-edit { display: flex; flex-direction: column; gap: 12px; margin-top: 14px; }
.jot-edit label { display: flex; flex-direction: column; gap: 6px; font-size: 13px; color: var(--muted); }
.jot-del { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding-top: 6px; border-top: 1px solid var(--soft-line); }
.btn-ghost.danger { border-color: rgba(244,180,164,.6); color: var(--coral); }
.btn-ghost.danger:hover { background: rgba(244,180,164,.15); }

/* 云端版：登录遮罩 + 退出 */
.gate { position: fixed; inset: 0; z-index: 50; display: grid; place-items: center; padding: 16px; background: var(--gold-glow), var(--slate); }
.gate[hidden] { display: none; }
.gate .login .btn-primary { margin-top: 8px; }
.gate .sub { font-size: 13px; color: var(--muted); }
.logout { position: fixed; right: 18px; bottom: 18px; z-index: 6; padding: 7px 14px; font-size: 12.5px; color: var(--text-2);
  background: var(--panel); border: 1px solid var(--line); border-radius: 999px; backdrop-filter: blur(12px); }
.logout:hover { background: #fff; color: var(--dark); }
@media (max-width: 999px) { .logout { right: 14px; bottom: calc(var(--tab-h) + 26px); } body.r-dossier .logout, body.r-market .logout { display: none; } }