/* ================= Haven 量化终端 · iOS 玻璃设计令牌 =================
   设计语言：毛玻璃透明卡片 / 圆角分层阴影 / 克制动效 / 深浅色适配
   用法：<html data-theme="dark|light">，缺省跟随系统 prefers-color-scheme
   ================================================================== */

/* ---------- 暗色（默认） ---------- */
:root,
:root[data-theme="dark"]{
  /* 底层 */
  --bg:#0a0e17;
  --bg-tint-a:rgba(88,120,255,.10);   /* 环境光晕（左上） */
  --bg-tint-b:rgba(255,90,60,.06);    /* 环境光晕（右下） */
  --bg-elev:#121826;
  --bg-2:#0e1420;
  --bg-3:#161d2c;
  --bg-4:#1d2536;

  /* 玻璃 */
  --glass-bg:rgba(22,28,40,.72);
  --glass-bg-strong:rgba(26,33,48,.88);
  --glass-brd:rgba(255,255,255,.10);
  --glass-brd-strong:rgba(255,255,255,.16);
  --glass-blur:blur(24px) saturate(180%);
  --glass-blur-sm:blur(12px) saturate(150%);
  --glass-hi:rgba(255,255,255,.07);   /* 内描边高光 */
  --glass-shadow:0 1px 0 var(--glass-hi) inset, 0 12px 32px rgba(0,0,0,.45);
  --glass-shadow-lg:0 1px 0 var(--glass-hi) inset, 0 24px 64px rgba(0,0,0,.55);

  /* 文字 */
  --ink:#e8ecf3;
  --ink-2:#c7cedb;
  --muted:#8a93a6;
  --muted-2:#5b6273;
  --line:rgba(255,255,255,.08);
  --line-2:rgba(255,255,255,.05);

  /* 语义色（涨红跌绿） */
  --red:#f6465d; --red-soft:rgba(246,70,93,.16); --red-deep:rgba(246,70,93,.30);
  --green:#16c784; --green-soft:rgba(22,199,132,.16); --green-deep:rgba(22,199,132,.28);
  --amber:#f0b90b; --amber-soft:rgba(240,185,11,.14); --amber-deep:rgba(240,185,11,.28);
  --blue:#3b82f6; --blue-soft:rgba(59,130,246,.16); --blue-deep:rgba(59,130,246,.30);
  --purple:#9b7bff; --purple-soft:rgba(155,123,255,.16);
  --gold:#f0b90b;

  --shadow:0 6px 24px rgba(0,0,0,.45);
  --r-card:20px; --r-ctl:14px; --r-sheet:28px; --r-chip:999px;
}

/* ---------- 浅色 ---------- */
:root[data-theme="light"]{
  --bg:#eef1f7;
  --bg-tint-a:rgba(59,130,246,.20);
  --bg-tint-b:rgba(236,120,60,.14);
  --bg-tint-c:rgba(124,58,237,.12);
  --bg-elev:#ffffff;
  --bg-2:#f7f9fc;
  --bg-3:#eef2f8;
  --bg-4:#e4eaf3;

  --glass-bg:rgba(255,255,255,.62);
  --glass-bg-strong:rgba(255,255,255,.86);
  --glass-brd:rgba(10,20,40,.08);
  --glass-brd-strong:rgba(10,20,40,.14);
  --glass-blur:blur(24px) saturate(180%);
  --glass-blur-sm:blur(12px) saturate(150%);
  --glass-hi:rgba(255,255,255,.9);
  --glass-shadow:0 1px 0 var(--glass-hi) inset, 0 10px 28px rgba(16,24,40,.10);
  --glass-shadow-lg:0 1px 0 var(--glass-hi) inset, 0 24px 56px rgba(16,24,40,.16);

  --ink:#101828;
  --ink-2:#344054;
  --muted:#667085;
  --muted-2:#98A2B3;
  --line:rgba(16,24,40,.10);
  --line-2:rgba(16,24,40,.06);

  --red:#e11d48; --red-soft:rgba(225,29,72,.10); --red-deep:rgba(225,29,72,.20);
  --green:#12b76a; --green-soft:rgba(18,183,106,.10); --green-deep:rgba(18,183,106,.20);
  --amber:#dc9200; --amber-soft:rgba(220,146,0,.12); --amber-deep:rgba(220,146,0,.22);
  --blue:#2563eb; --blue-soft:rgba(37,99,235,.10); --blue-deep:rgba(37,99,235,.20);
  --purple:#7c3aed; --purple-soft:rgba(124,58,237,.10);
  --gold:#dc9200;

  --shadow:0 6px 20px rgba(16,24,40,.10);
  --r-card:20px; --r-ctl:14px; --r-sheet:28px; --r-chip:999px;
}

/* ---------- 间距体系 ---------- */
:root{
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:24px; --sp-6:32px;
  /* ---------- 动效（iOS 曲线） ---------- */
  --ease-ios:cubic-bezier(.32,.72,0,1);
  --ease-out:cubic-bezier(.25,.46,.45,.94);
  --dur-1:.18s; --dur-2:.32s; --dur-3:.5s;
  --sheet-h:86vh;
}

/* ================= 布局防溢出（关键） =================
   flex 子项默认 min-width:auto，内容过宽会撑大父容器 → 整页横向溢出
   必须显式 min-width:0 + overflow:hidden */
#app{width:100%;max-width:520px;min-width:0;overflow:hidden;height:100vh;height:100dvh;position:relative}
#topbar{flex:0 0 auto;min-width:0;overflow:hidden}
/* ★ min-height:0 必设：flex 子项默认 min-height:auto，内容超高会把 tabbar 顶出视口 */
#view{flex:1 1 0;min-height:0;min-width:0;overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch;
  padding:14px 14px calc(20px + env(safe-area-inset-bottom))}
#tabbar{flex:0 0 auto;min-width:0;overflow:hidden;position:relative;z-index:20}
.brand{flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.brand .sub{white-space:nowrap}
.clock{flex:0 0 auto}
.acct{flex:0 0 auto}
.theme-toggle{flex:0 0 auto}
.card{max-width:100%;overflow-wrap:anywhere;min-width:0}
/* 行式布局：左右两侧都不撑破容器 */
.row{gap:10px;min-width:0}
.row>.k{flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.row>.v{flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:right}
/* 卡片内所有直接子元素不超宽 */
.card>*,.card .row>*{max-width:100%}
.tbl{table-layout:fixed;width:100%;max-width:100%}
.tbl td,.tbl th{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* 网格容器统一 min-width:0 */
.idxgrid,.idxgrid>*,.ex-cards,.ex-cards>*,.sh-grid,.sh-grid>*{min-width:0}
.idx{min-width:0;overflow:hidden}
.idx .n,.idx .p{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ================= 玻璃材质 ================= */
.glass{
  background:var(--glass-bg);
  -webkit-backdrop-filter:var(--glass-blur);
  backdrop-filter:var(--glass-blur);
  border:1px solid var(--glass-brd);
  box-shadow:var(--glass-shadow);
}
.glass-sm{
  background:var(--glass-bg);
  -webkit-backdrop-filter:var(--glass-blur-sm);
  backdrop-filter:var(--glass-blur-sm);
  border:1px solid var(--glass-brd);
}

/* 环境光晕背景（玻璃的"底"，没有它玻璃看不出质感） */
body::before{
  content:"";
  position:fixed; inset:0; z-index:-2; pointer-events:none;
  background:
    radial-gradient(120% 80% at 12% -8%, var(--bg-tint-a) 0%, transparent 55%),
    radial-gradient(100% 70% at 92% 4%, var(--bg-tint-b) 0%, transparent 52%),
    radial-gradient(90% 60% at 50% 108%, var(--bg-tint-c, transparent) 0%, transparent 58%),
    var(--bg);
}
body{background:transparent}

/* ================= 组件改造 ================= */
/* 卡片：玻璃 */
.card{
  background:var(--glass-bg);
  -webkit-backdrop-filter:var(--glass-blur);
  backdrop-filter:var(--glass-blur);
  border:1px solid var(--glass-brd);
  border-radius:var(--r-card);
  box-shadow:var(--glass-shadow);
  padding:16px; margin-bottom:14px;
  transition:transform var(--dur-2) var(--ease-ios), box-shadow var(--dur-2) var(--ease-ios);
}
.card h3{margin:0 0 12px;font-size:14px;color:var(--ink);display:flex;align-items:center;gap:8px;font-weight:700;letter-spacing:.2px}
.card h3 .tag{margin-left:auto;font-size:10px;color:var(--muted);font-weight:500}

/* 顶栏：悬浮玻璃 */
#topbar{
  background:color-mix(in srgb, var(--bg) 72%, transparent);
  -webkit-backdrop-filter:var(--glass-blur);
  backdrop-filter:var(--glass-blur);
  border-bottom:1px solid var(--line-2);
  transition:background var(--dur-2) var(--ease-ios);
}

/* 底部 tabbar：悬浮玻璃 */
#tabbar{
  background:color-mix(in srgb, var(--bg) 76%, transparent);
  -webkit-backdrop-filter:var(--glass-blur);
  backdrop-filter:var(--glass-blur);
  border-top:1px solid var(--line-2);
}

/* 索引格 */
.idx{
  padding:12px 14px;border-radius:var(--r-ctl);
  background:var(--glass-bg);
  -webkit-backdrop-filter:var(--glass-blur-sm);
  backdrop-filter:var(--glass-blur-sm);
  border:1px solid var(--glass-brd);
  box-shadow:var(--glass-shadow);
}

/* 按钮 */
.btn-primary{
  background:linear-gradient(180deg, var(--blue) 0%, color-mix(in srgb, var(--blue) 78%, #000) 100%);
  color:#fff;border:0;border-radius:var(--r-ctl);padding:12px 16px;font-size:15px;font-weight:700;
  width:100%;cursor:pointer;
  box-shadow:0 1px 0 rgba(255,255,255,.22) inset, 0 6px 16px rgba(37,99,235,.28);
  transition:transform var(--dur-1) var(--ease-ios), opacity var(--dur-1);
}
.btn-ghost{
  background:var(--glass-bg);color:var(--blue);
  -webkit-backdrop-filter:var(--glass-blur-sm);backdrop-filter:var(--glass-blur-sm);
  border:1px solid var(--glass-brd-strong);border-radius:var(--r-ctl);
  padding:10px 14px;font-weight:700;cursor:pointer;width:100%;
  transition:transform var(--dur-1) var(--ease-ios), background var(--dur-1);
}
button:active{transform:scale(.97)}
.btn-primary:active,.btn-ghost:active{opacity:.9}

/* 胶囊 chip */
.chip{
  background:var(--glass-bg);
  -webkit-backdrop-filter:var(--glass-blur-sm);backdrop-filter:var(--glass-blur-sm);
  border:1px solid var(--glass-brd);color:var(--ink-2);
  border-radius:var(--r-chip);padding:8px 14px;font-size:13px;font-weight:600;cursor:pointer;
  transition:all var(--dur-1) var(--ease-ios);
}
.chip.on{background:var(--blue);color:#fff;border-color:transparent;box-shadow:0 4px 12px rgba(37,99,235,.30)}

/* 表格 */
.tbl th{
  color:var(--muted);font-weight:600;text-align:right;padding:8px 6px;
  border-bottom:1px solid var(--line);position:sticky;top:0;
  background:color-mix(in srgb, var(--bg-elev) 88%, transparent);
  -webkit-backdrop-filter:var(--glass-blur-sm);backdrop-filter:var(--glass-blur-sm);
  z-index:2;
}
.tbl td{padding:9px 6px;border-bottom:1px solid var(--line-2);text-align:right;font-variant-numeric:tabular-nums}
.tbl tr:active{background:var(--bg-3)}

/* 条目 */
.entry{
  display:flex;align-items:center;gap:12px;padding:14px;
  background:var(--glass-bg);
  -webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);
  border:1px solid var(--glass-brd);border-radius:var(--r-card);margin-bottom:10px;
  cursor:pointer;box-shadow:var(--glass-shadow);
}

/* ================= 主题切换 ================= */
.theme-toggle{
  display:inline-flex;align-items:center;justify-content:center;
  width:30px;height:30px;border-radius:50%;
  background:var(--glass-bg);border:1px solid var(--glass-brd);
  -webkit-backdrop-filter:var(--glass-blur-sm);backdrop-filter:var(--glass-blur-sm);
  color:var(--ink-2);font-size:14px;cursor:pointer;flex:0 0 auto;
  transition:transform var(--dur-1) var(--ease-ios);
}
.theme-toggle:active{transform:scale(.9)}

/* ================= 减少动效偏好 ================= */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
    scroll-behavior:auto !important;
  }
}

/* ================= Bottom Sheet ================= */
.hs-root{position:fixed;inset:0;z-index:9000;pointer-events:none}
.hs-root.hs-in{pointer-events:auto}
.hs-overlay{
  position:absolute;inset:0;background:rgba(4,7,14,.52);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  opacity:0;transition:opacity var(--dur-2) var(--ease-ios);
}
.hs-root.hs-in .hs-overlay{opacity:1}
.hs-sheet{
  position:absolute;left:0;right:0;bottom:0;
  max-width:520px;margin:0 auto;
  height:var(--sheet-h);
  display:flex;flex-direction:column;
  background:var(--glass-bg-strong);
  -webkit-backdrop-filter:var(--glass-blur);
  backdrop-filter:var(--glass-blur);
  border:1px solid var(--glass-brd-strong);
  border-bottom:none;
  border-radius:var(--r-sheet) var(--r-sheet) 0 0;
  box-shadow:var(--glass-shadow-lg);
  transform:translateY(100%);
  transition:transform var(--dur-3) var(--ease-ios);
  will-change:transform;
  overscroll-behavior:contain;
}
.hs-root.hs-in .hs-sheet{transform:translateY(0)}
.hs-sheet.hs-full{height:calc(100vh - 44px);height:calc(100dvh - 44px);border-radius:var(--r-sheet) var(--r-sheet) 0 0}

.hs-grab{
  flex:0 0 auto;height:22px;display:flex;align-items:center;justify-content:center;
  cursor:grab;touch-action:none;
}
.hs-grab::before{
  content:"";width:38px;height:5px;border-radius:3px;
  background:var(--muted-2);opacity:.55;
}
.hs-head{
  flex:0 0 auto;display:flex;align-items:flex-start;gap:10px;
  padding:0 16px 10px;border-bottom:1px solid var(--line-2);
  touch-action:none;
}
.hs-titlebox{flex:1 1 auto;min-width:0}
.hs-title{font-size:16px;font-weight:800;color:var(--ink);line-height:1.35;letter-spacing:.2px}
.hs-sub{font-size:12px;color:var(--muted);margin-top:3px;line-height:1.5}
.hs-actions{display:flex;gap:6px;flex:0 0 auto}
.hs-icon-btn{
  width:30px;height:30px;border-radius:50%;border:1px solid var(--glass-brd);
  background:var(--glass-bg);color:var(--ink-2);font-size:14px;line-height:1;
  cursor:pointer;display:flex;align-items:center;justify-content:center;
  -webkit-backdrop-filter:var(--glass-blur-sm);backdrop-filter:var(--glass-blur-sm);
  transition:transform var(--dur-1) var(--ease-ios), background var(--dur-1);
}
.hs-icon-btn:active{transform:scale(.9)}
.hs-body{
  flex:1 1 auto;overflow-y:auto;-webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  padding:14px 16px calc(20px + env(safe-area-inset-bottom));
  touch-action:pan-y;
}
.hs-body::-webkit-scrollbar{width:0}

/* ================= 专家选股台 ================= */
.ex-card{border-color:var(--glass-brd-strong)}
.ex-head{display:flex;flex-direction:column;gap:9px}
.ex-pick{font-size:16px;font-weight:800;color:var(--ink);display:flex;align-items:center;gap:6px}
.ex-caret{color:var(--muted);font-size:12px}
.ex-desc{font-size:12px;color:var(--muted);line-height:1.6}
.ex-switch{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.ex-tab{
  font-size:12px;font-weight:700;padding:5px 11px;border-radius:var(--r-chip);
  background:var(--bg-3);border:1px solid var(--line);color:var(--ink-2);cursor:pointer;
  transition:all var(--dur-1) var(--ease-ios);
}
.ex-tab.on{background:var(--blue);color:#fff;border-color:transparent}
.ex-tab.add{background:transparent;border-style:dashed;color:var(--muted);font-size:14px;padding:4px 10px}
.ex-modes{display:flex;gap:6px;flex-wrap:wrap}
.ex-mode{
  font-size:12px;font-weight:600;padding:6px 10px;border-radius:10px;
  background:var(--bg-3);border:1px solid var(--line);color:var(--ink-2);cursor:pointer;
  display:inline-flex;align-items:center;gap:5px;
  transition:all var(--dur-1) var(--ease-ios);
}
.ex-mode i{font-style:normal;font-size:10px;color:var(--muted);padding:1px 5px;border-radius:4px;background:var(--bg-4)}
.ex-mode.on{background:var(--amber-soft);border-color:var(--amber);color:var(--ink)}
.ex-mode.on i{background:var(--amber-deep);color:var(--ink)}
.ex-scope{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin-top:2px}
.ex-scope-opt{
  font-size:12px;font-weight:600;padding:5px 12px;border-radius:var(--r-chip);
  background:transparent;border:1px solid var(--line);color:var(--muted);cursor:pointer;
}
.ex-scope-opt.on{background:var(--blue-soft);border-color:var(--blue);color:var(--blue)}
.ex-run{
  margin-left:auto;font-size:13px;font-weight:800;padding:8px 16px;border-radius:var(--r-ctl);
  background:linear-gradient(180deg,var(--blue) 0%,color-mix(in srgb,var(--blue) 76%,#000) 100%);
  color:#fff;cursor:pointer;box-shadow:0 4px 12px rgba(37,99,235,.28);
  transition:transform var(--dur-1) var(--ease-ios);
}
.ex-run:active{transform:scale(.96)}

.ex-out{margin-top:12px}
.ex-grp{margin-bottom:14px}
.ex-grp-h{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:800;color:var(--ink);margin-bottom:8px}
.ex-grp-dim{font-size:10px;font-weight:600;color:var(--blue);background:var(--blue-soft);padding:2px 7px;border-radius:5px}
.ex-grp-n{margin-left:auto;font-size:11px;font-weight:700;color:var(--muted)}
.ex-cards{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.ex-card{
  padding:11px;border-radius:var(--r-ctl);
  background:var(--glass-bg);
  -webkit-backdrop-filter:var(--glass-blur-sm);backdrop-filter:var(--glass-blur-sm);
  border:1px solid var(--glass-brd);cursor:pointer;
  transition:transform var(--dur-1) var(--ease-ios), border-color var(--dur-1);
}
.ex-card:active{transform:scale(.98);border-color:var(--blue)}
.ex-c-top{display:flex;align-items:baseline;gap:8px}
.ex-c-name{font-size:13px;font-weight:800;color:var(--ink);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ex-c-name i{font-style:normal;font-size:10px;color:var(--muted);margin-left:5px;font-weight:500}
.ex-c-pct{font-size:13px;font-weight:800;font-variant-numeric:tabular-nums}
.ex-c-sub{font-size:10px;color:var(--muted);margin-top:3px}
.ex-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;margin-top:8px}
.ex-m{text-align:center;background:var(--bg-3);border-radius:7px;padding:4px 2px}
.ex-m span{display:block;font-size:9px;color:var(--muted)}
.ex-m b{display:block;font-size:12px;font-weight:800;color:var(--ink);font-variant-numeric:tabular-nums;margin-top:1px}
.ex-sigs{display:flex;flex-wrap:wrap;gap:4px;margin-top:8px}
.ex-sig{font-size:10px;font-weight:600;padding:2px 6px;border-radius:5px;background:var(--amber-soft);color:var(--amber);white-space:nowrap}
.ex-reason{font-size:10px;color:var(--muted);line-height:1.6;margin-top:7px;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}

.ex-sum{
  margin-top:6px;padding:12px;border-radius:var(--r-ctl);
  background:linear-gradient(100deg,rgba(240,185,11,.10),rgba(59,130,246,.05));
  border:1px solid var(--glass-brd-strong);
}
.ex-sum-h{font-size:11px;font-weight:800;color:var(--amber);letter-spacing:1px;margin-bottom:6px}
.ex-sum-t{font-size:12px;line-height:1.75;color:var(--ink-2)}
.ex-sum-tags{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px}
.ex-sum-tag{font-size:10px;font-weight:700;padding:2px 7px;border-radius:5px;background:var(--bg-3);color:var(--ink-2)}
.ex-disc{font-size:10px;color:var(--muted-2);margin-top:9px;line-height:1.6}

/* ================= 专家管理 ================= */
.emg-list{display:flex;flex-direction:column;gap:8px}
.emg-item{display:flex;gap:10px;align-items:flex-start;padding:11px;border-radius:var(--r-ctl);background:var(--bg-3);border:1px solid var(--line)}
.emg-l{flex:1;min-width:0}
.emg-n{font-size:13px;font-weight:800;color:var(--ink);display:flex;align-items:center;gap:6px}
.emg-b{font-style:normal;font-size:9px;font-weight:700;padding:1px 5px;border-radius:4px;background:var(--blue-soft);color:var(--blue)}
.emg-d{font-size:11px;color:var(--muted);margin-top:3px;line-height:1.55}
.emg-m{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px}
.emg-chip{font-size:10px;padding:2px 6px;border-radius:5px;background:var(--bg-4);color:var(--ink-2)}
.emg-r{display:flex;flex-direction:column;gap:5px;flex:0 0 auto}
.emg-btn{font-size:11px;font-weight:700;padding:5px 9px;border-radius:8px;border:1px solid var(--line);background:var(--bg-2);color:var(--ink-2);cursor:pointer;white-space:nowrap}
.emg-btn.act{color:var(--blue);border-color:var(--blue)}
.emg-btn.del{color:var(--red);border-color:var(--red-deep)}
.emg-add{margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}
.emg-add-h{font-size:12px;font-weight:800;color:var(--ink-2);margin-bottom:9px}
.emg-tpl{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.emg-tpl-b{
  text-align:left;padding:9px;border-radius:10px;background:var(--bg-3);border:1px solid var(--line);
  color:var(--ink);font-size:12px;font-weight:700;cursor:pointer;
}
.emg-tpl-b i{display:block;font-style:normal;font-size:10px;font-weight:500;color:var(--muted);margin-top:3px;line-height:1.5}
.emg-custom{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.emg-in{flex:1 1 46%;min-width:0;background:var(--bg-2);border:1px solid var(--line);color:var(--ink);border-radius:9px;padding:8px 10px;font-size:12px}

/* ================= 个股详情 Sheet 内 ================= */
.sh-kwrap{min-height:180px}
.sh-loading{padding:40px 0;text-align:center;color:var(--muted);font-size:13px}
.sh-meta{margin-top:12px}
.sh-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}
.sh-cell{background:var(--bg-3);border-radius:10px;padding:9px 8px;text-align:center}
.sh-k{font-size:10px;color:var(--muted)}
.sh-v{font-size:14px;font-weight:800;color:var(--ink);font-variant-numeric:tabular-nums;margin-top:3px}

/* ================= 窄屏适配（≤420px）=================
   顶栏元素多（品牌+副标题+时钟+主题+徽章）时会被裁切 → 逐级降级 */
@media (max-width:420px){
  .brand{font-size:17px}
  .brand .sub{display:none}                       /* 副标题先让位 */
  .clock{font-size:12px}
  .acct{font-size:10px;padding:2px 7px;max-width:64px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .theme-toggle{width:27px;height:27px;font-size:13px}
  #topbar{padding-left:12px;padding-right:12px;gap:7px}
  #tabbar .tab{font-size:10px;padding:7px 0 8px}
  #tabbar .tab .ic{font-size:15px}
}
@media (max-width:360px){
  .clock{display:none}                            /* 极窄屏：时钟让位 */
  .brand{font-size:16px}
  #tabbar .tab{font-size:9.5px}
}