/* ============================================================
   晓辉量化工作室 · 共享组件样式（依赖 tokens.css）
   六维徽标 / 卡片 / 按钮 / 顶栏 / 页脚 / 状态胶囊
   ============================================================ */

/* ---- 六维徽标 chip ---- */
.chip{display:inline-flex;align-items:center;gap:4px;font-size:var(--fs-xs);border-radius:var(--r-pill);padding:2px 9px;line-height:1.5;white-space:nowrap}
.chip.d1{background:var(--d1);color:var(--d1i)} .chip.d2{background:var(--d2);color:var(--d2i)}
.chip.d3{background:var(--d3);color:var(--d3i)} .chip.d4{background:var(--d4);color:var(--d4i)}
.chip.d5{background:var(--d5);color:var(--d5i)} .chip.d6{background:var(--d6);color:var(--d6i)}
.chip.ok{background:var(--ok-bg);color:var(--ok-fg)} .chip.warn{background:var(--warn-bg);color:var(--warn-fg)}
.chip.gray{background:var(--gray-bg);color:var(--gray-fg)} .chip.vip{background:var(--vip);color:#fff}

/* ---- 按钮 ---- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;font-size:var(--fs-body);
  border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:var(--r-pill);
  padding:8px 18px;cursor:pointer;transition:background .15s,border-color .15s}
.btn:hover{border-color:var(--blue)}
.btn.primary{background:var(--navy);color:#fff;border-color:var(--navy)}
.btn.primary:hover{filter:brightness(1.08)}
.btn.gold{background:var(--gold);color:#fff;border-color:var(--gold)}

/* ---- 卡片 ---- */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-card)}

/* ---- 顶栏（桌面） ---- */
.topbar{position:sticky;top:0;z-index:40;height:52px;display:flex;align-items:center;gap:26px;
  padding:0 clamp(16px,5vw,40px);background:color-mix(in srgb,var(--paper) 88%,transparent);
  backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.topbar .brand{display:flex;align-items:center;gap:9px;font-weight:700;font-size:16px}
.topbar .brand .mark{width:28px;height:28px;border-radius:7px;background:var(--navy);color:#fff;display:grid;place-items:center;font-size:14px}
.topbar nav{display:flex;align-items:center;gap:22px;font-size:var(--fs-body)}
.topbar nav a{color:var(--soft);transition:color .15s}
.topbar nav a:hover,.topbar nav a.on{color:var(--ink);font-weight:600}
.topbar .right{margin-left:auto;display:flex;align-items:center;gap:12px}
.topbar .login{border:1px solid var(--line);border-radius:var(--r-pill);padding:5px 14px;font-size:var(--fs-sm)}
.topbar .hamb{display:none;width:38px;height:38px;border:1px solid var(--line);border-radius:9px;background:var(--card);cursor:pointer;place-items:center;font-size:16px}
.theme-toggle{width:34px;height:34px;border:1px solid var(--line);border-radius:9px;background:var(--card);cursor:pointer;display:grid;place-items:center;font-size:14px}

/* ---- 页脚（全站） ---- */
.site-foot{border-top:1px solid var(--line);padding:26px clamp(16px,5vw,40px);color:var(--faint);font-size:var(--fs-sm);text-align:center;line-height:1.9}
.site-foot a{color:var(--faint)}
.site-foot .risk{color:var(--soft)}

/* ---- 左侧导航抽屉（手机） ---- */
.drawer-scrim{position:fixed;inset:0;background:rgba(6,12,20,.5);z-index:49;opacity:0;pointer-events:none;transition:opacity .25s}
.drawer-scrim.on{opacity:1;pointer-events:auto}
.drawer{position:fixed;top:0;bottom:0;left:0;width:78%;max-width:320px;z-index:50;background:var(--dk-bg);color:var(--dk-ink);
  transform:translateX(-102%);transition:transform .28s ease;box-shadow:12px 0 40px rgba(5,10,18,.5);border-radius:0 18px 18px 0;overflow-y:auto;padding:14px 0}
.drawer.on{transform:translateX(0)}
.drawer .it{display:flex;justify-content:space-between;align-items:center;padding:11px 20px;font-size:14px;color:var(--dk-soft)}
.drawer .it.on{background:#1a2a3d;color:#fff;border-left:2px solid var(--goldb)}
.drawer .it .sub{font-size:9.5px;color:var(--dk-faint)}

@media (max-width:820px){
  .topbar nav{display:none}
  .topbar .hamb{display:grid}
  .topbar .login{display:none}
}

/* ---- 通用容器 ---- */
.wrap{max-width:1280px;margin:0 auto;padding:0 clamp(16px,5vw,40px)}
.section{padding:clamp(28px,6vh,56px) 0}
.eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.18em;color:var(--faint);text-transform:uppercase}
h1,h2,h3{text-wrap:balance;margin:0}