/* ==========================================================================
   加密判官 CryptoJudge · 统一设计系统（design-system.css）
   A 块地基：全站唯一的「设计令牌 + 基础组件」来源。
   加载顺序：本文件永远排在其他样式表之前；旧样式表可覆盖同名规则，
   因此接入本文件不会改变任何现有页面的观感。
   ========================================================================== */

/* --------------------------------------------------------------------------
   1) 设计令牌 tokens —— 改一处，全站变
   -------------------------------------------------------------------------- */
:root {
  /* 颜色：底色 / 面板 / 边框 / 主色 / 状态 / 文字三级 */
  --a-bg: #05070d;
  --a-bg-soft: #0b1220;
  --a-panel: rgba(15, 23, 42, 0.72);
  --a-panel-solid: #0c111a;
  --a-line: rgba(56, 189, 248, 0.18);
  --a-line-strong: rgba(34, 211, 238, 0.42);
  --a-accent: #22d3ee;
  --a-accent-2: #38bdf8;
  --a-ok: #34d399;
  --a-warn: #f59e0b;
  --a-danger: #f43f5e;
  --a-text: #e2e8f0;
  --a-text-dim: #93a4bd;
  --a-text-mute: #6b7a90;

  /* 字号：h1~h6 / 正文 / 小字 / 等宽 */
  --a-font: "Segoe UI", "Microsoft YaHei", sans-serif;
  --a-font-mono: ui-monospace, SFMono-Regular, Consolas, "Courier New", monospace;
  --a-fs-h1: 28px;
  --a-fs-h2: 21px;
  --a-fs-h3: 18px;
  --a-fs-h4: 16px;
  --a-fs-h5: 14px;
  --a-fs-h6: 13px;
  --a-fs-body: 14px;
  --a-fs-small: 12px;
  --a-lh: 1.65;

  /* 间距：4 / 8 / 12 / 16 / 24 / 32 / 48 */
  --a-s1: 4px;
  --a-s2: 8px;
  --a-s3: 12px;
  --a-s4: 16px;
  --a-s5: 24px;
  --a-s6: 32px;
  --a-s7: 48px;

  /* 圆角：小 / 中 / 大 / 全圆 */
  --a-r-sm: 6px;
  --a-r: 14px;
  --a-r-lg: 18px;
  --a-r-pill: 999px;

  /* 阴影：卡片 / 浮层 / 弹窗 */
  --a-shadow-card: 0 6px 24px rgba(2, 6, 16, 0.45);
  --a-shadow-pop: 0 12px 36px rgba(2, 6, 16, 0.55);
  --a-shadow-modal: 0 24px 64px rgba(2, 6, 16, 0.7);

  /* 断点（数值，供媒体查询与文档统一引用）：手机 / 平板 / 桌面 */
  --a-bp-phone: 640px;
  --a-bp-tablet: 991px;
  --a-bp-desktop: 1280px;

  /* 兼容别名：老样式表沿用旧变量名时，自动跟随上面的令牌 */
  --a-space: var(--a-s4);
  --a-radius: var(--a-r);
}

/* --------------------------------------------------------------------------
   2) 基础重置（只做最小必要，避免与老样式表冲突）
   -------------------------------------------------------------------------- */
.a-scope { font-family: var(--a-font); font-size: var(--a-fs-body); line-height: var(--a-lh); }

/* --------------------------------------------------------------------------
   3) 基础组件
   -------------------------------------------------------------------------- */

/* 3.1 按钮 */
.a-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--a-s2);
  min-height: 40px; padding: 9px 17px; font-size: var(--a-fs-h6); cursor: pointer;
  border: 1px solid var(--a-line); border-radius: var(--a-r-sm);
  background: transparent; color: var(--a-text);
  transition: background .15s ease, border-color .15s ease;
}
.a-btn:hover { border-color: var(--a-line-strong); }
.a-btn--primary { background: var(--a-accent); border-color: var(--a-accent); color: #041017; font-weight: 650; }
.a-btn--ghost { background: transparent; color: var(--a-text-dim); }
.a-btn--danger { border-color: var(--a-danger); color: var(--a-danger); }
.a-btn--small { min-height: 30px; padding: 5px 10px; font-size: var(--a-fs-small); }
.a-btn--block { width: 100%; }
.a-btn:disabled { opacity: .5; cursor: not-allowed; }

/* 3.2 卡片 / 面板 */
.a-card {
  background: var(--a-panel); border: 1px solid var(--a-line);
  border-radius: var(--a-r); padding: var(--a-s5); box-shadow: var(--a-shadow-card);
}
.a-card__title { font-size: var(--a-fs-h4); font-weight: 650; margin-bottom: var(--a-s3); }
.a-card__hint { color: var(--a-text-dim); font-size: var(--a-fs-small); }
.a-panel-grid { display: grid; gap: var(--a-s4); }

/* 3.3 表格 */
.a-table { width: 100%; border-collapse: collapse; font-size: var(--a-fs-h6); }
.a-table th, .a-table td { padding: 10px 12px; text-align: left; border-bottom: 1px solid var(--a-line); }
.a-table thead th { color: var(--a-text-dim); font-weight: 600; font-size: var(--a-fs-small); }
.a-table tbody tr:hover { background: rgba(56, 189, 248, 0.04); }
.a-table--compact th, .a-table--compact td { padding: 6px 10px; }

/* 3.4 表单 */
.a-field { display: flex; flex-direction: column; gap: var(--a-s2); margin-bottom: var(--a-s4); }
.a-field__label { font-size: var(--a-fs-small); color: var(--a-text-dim); }
.a-input, .a-select, .a-textarea {
  width: 100%; min-height: 40px; padding: 9px 12px; font: inherit; font-size: var(--a-fs-h6);
  color: var(--a-text); background: var(--a-bg-soft);
  border: 1px solid var(--a-line); border-radius: var(--a-r-sm);
}
.a-input:focus, .a-select:focus, .a-textarea:focus { outline: 2px solid var(--a-accent); outline-offset: 1px; }
.a-input--invalid { border-color: var(--a-danger); }
.a-check { display: inline-flex; align-items: center; gap: var(--a-s2); font-size: var(--a-fs-h6); }
.a-switch { position: relative; display: inline-flex; align-items: center; gap: var(--a-s2); cursor: pointer; }
.a-switch input { position: absolute; opacity: 0; width: 0; height: 0; }
.a-switch__track {
  width: 40px; height: 22px; border-radius: var(--a-r-pill);
  background: var(--a-bg-soft); border: 1px solid var(--a-line); transition: background .15s ease;
}
.a-switch__track::after {
  content: ""; display: block; width: 16px; height: 16px; margin: 2px; border-radius: 50%;
  background: var(--a-text-dim); transition: transform .15s ease;
}
.a-switch input:checked + .a-switch__track { background: var(--a-accent); border-color: var(--a-accent); }
.a-switch input:checked + .a-switch__track::after { transform: translateX(18px); background: #041017; }

/* 3.5 标签徽章 */
.a-badge {
  display: inline-flex; align-items: center; gap: 6px; padding: 3px 10px;
  font-size: var(--a-fs-small); border-radius: var(--a-r-pill);
  border: 1px solid var(--a-line); color: var(--a-text-dim);
}
.a-badge--ok { color: var(--a-ok); border-color: rgba(52, 211, 153, .45); }
.a-badge--warn { color: var(--a-warn); border-color: rgba(245, 158, 11, .45); }
.a-badge--danger { color: var(--a-danger); border-color: rgba(244, 63, 94, .45); }
.a-badge--accent { color: var(--a-accent); border-color: var(--a-line-strong); }

/* 3.6 弹窗 */
.a-modal { position: fixed; inset: 0; display: grid; place-items: center; z-index: 60; }
.a-modal[hidden] { display: none; }
.a-modal__mask { position: absolute; inset: 0; background: rgba(3, 6, 14, .72); }
.a-modal__box {
  position: relative; max-width: min(560px, calc(100vw - 32px)); width: 100%;
  background: var(--a-panel-solid); border: 1px solid var(--a-line);
  border-radius: var(--a-r-lg); padding: var(--a-s5); box-shadow: var(--a-shadow-modal);
}
.a-modal__title { font-size: var(--a-fs-h3); font-weight: 650; margin-bottom: var(--a-s3); }
.a-modal__actions { display: flex; justify-content: flex-end; gap: var(--a-s3); margin-top: var(--a-s5); }

/* 3.7 进度条 */
.a-progress { height: 8px; border-radius: var(--a-r-pill); background: var(--a-bg-soft); overflow: hidden; }
.a-progress__bar { height: 100%; background: var(--a-accent); border-radius: var(--a-r-pill); }

/* 3.8 空状态 */
.a-empty { text-align: center; padding: var(--a-s7) var(--a-s4); color: var(--a-text-dim); }
.a-empty__title { font-size: var(--a-fs-h4); color: var(--a-text); margin-bottom: var(--a-s2); }

/* 3.9 骨架屏 */
.a-skeleton {
  background: linear-gradient(90deg, rgba(148, 163, 184, .10), rgba(148, 163, 184, .22), rgba(148, 163, 184, .10));
  background-size: 200% 100%; border-radius: var(--a-r-sm); animation: a-skeleton 1.2s ease-in-out infinite;
}
@keyframes a-skeleton { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }

/* 3.10 提示条 */
.a-alert {
  display: flex; gap: var(--a-s3); align-items: flex-start; padding: var(--a-s3) var(--a-s4);
  border: 1px solid var(--a-line); border-left-width: 3px; border-radius: var(--a-r-sm);
  background: rgba(15, 23, 42, .5); font-size: var(--a-fs-h6);
}
.a-alert--ok { border-left-color: var(--a-ok); }
.a-alert--warn { border-left-color: var(--a-warn); }
.a-alert--danger { border-left-color: var(--a-danger); }

/* 3.11 面包屑 */
.a-crumbs { display: flex; flex-wrap: wrap; gap: var(--a-s2); font-size: var(--a-fs-small); color: var(--a-text-dim); }
.a-crumbs a { color: var(--a-accent-2); }
.a-crumbs__sep { color: var(--a-text-mute); }

/* 3.12 分页 */
.a-pager { display: flex; flex-wrap: wrap; gap: var(--a-s2); align-items: center; }
.a-pager__item {
  min-width: 34px; height: 32px; display: inline-flex; align-items: center; justify-content: center;
  padding: 0 10px; border: 1px solid var(--a-line); border-radius: var(--a-r-sm);
  font-size: var(--a-fs-small); color: var(--a-text-dim);
}
.a-pager__item[aria-current="page"] { color: #041017; background: var(--a-accent); border-color: var(--a-accent); }

/* 3.13 工具类（少量，够用即可） */
.a-code { font-family: var(--a-font-mono); font-size: var(--a-fs-small); }
.a-row { display: flex; align-items: center; gap: var(--a-s3); }
.a-row--between { justify-content: space-between; }
.a-stack { display: flex; flex-direction: column; gap: var(--a-s3); }
.a-dim { color: var(--a-text-dim); }
.a-ok { color: var(--a-ok); }
.a-warn { color: var(--a-warn); }
.a-danger { color: var(--a-danger); }

/* ==========================================================================
   A3：并入 dark.css（原后台主题）—— 仅 .app-body / .login-body；
   :root 与 * 保持全局；body 用 body:where(...) 保证优先级不抬高。
   ========================================================================== */
:root {color-scheme:dark;--bg:#05070B;--panel:#0C111A;--border:#1D2A3A;--cyan:#00E5FF;--green:#00E676;--amber:#FFCC00;--red:#FF3860;--text:#E9F0F8;--muted:#94A4B8;--radius:10px;font-family:"Segoe UI","Microsoft YaHei",sans-serif;font-size:14px}
* {box-sizing:border-box}
body:where(.app-body, .login-body) {margin:0;background:var(--bg);color:var(--text);line-height:1.65}
:where(.app-body, .login-body) a {color:inherit;text-decoration:none}
:where(.app-body, .login-body) button, :where(.app-body, .login-body) input, :where(.app-body, .login-body) select {font:inherit}
:where(.app-body, .login-body) button, :where(.app-body, .login-body) a, :where(.app-body, .login-body) input, :where(.app-body, .login-body) select {-webkit-tap-highlight-color:transparent}
:where(.app-body, .login-body) button:focus-visible, :where(.app-body, .login-body) a:focus-visible, :where(.app-body, .login-body) input:focus-visible, :where(.app-body, .login-body) select:focus-visible {outline:2px solid var(--cyan);outline-offset:3px}
:where(.app-body, .login-body) button:disabled {opacity:.5;cursor:not-allowed}
:where(.app-body, .login-body) h1, :where(.app-body, .login-body) h2, :where(.app-body, .login-body) h3, :where(.app-body, .login-body) p {margin:0}
:where(.app-body, .login-body) h1 {font-size:28px;line-height:1.35;letter-spacing:.3px;font-weight:650}
:where(.app-body, .login-body) h2 {font-size:16px;font-weight:650}
:where(.app-body, .login-body) small {font-size:12px}
:where(.app-body, .login-body) .muted {color:var(--muted)}
:where(.app-body, .login-body) .positive {color:var(--green)}
:where(.app-body, .login-body) .amber {color:var(--amber)}
:where(.app-body, .login-body) .cyan {color:var(--cyan)}
:where(.app-body, .login-body) .hidden {display:none!important}
:where(.app-body, .login-body) .dot {display:inline-block;width:6px;height:6px;border-radius:50%;vertical-align:middle;margin-right:8px}
:where(.app-body, .login-body) .green {background:var(--green);box-shadow:0 0 8px #00E67622}
:where(.app-body, .login-body) .sidebar {position:fixed;inset:0 auto 0 0;width:224px;background:#090D14;border-right:1px solid var(--border);padding:30px 20px;display:flex;flex-direction:column;z-index:3}
:where(.app-body, .login-body) .brand {display:flex;align-items:center;gap:12px;font-size:18px;font-weight:650;line-height:1.4;white-space:nowrap}
:where(.app-body, .login-body) .brand small {display:block;font-size:11px;color:var(--muted);font-weight:400;letter-spacing:1px;margin-top:5px}
:where(.app-body, .login-body) .brand-mark {display:grid;place-items:center;background:#00E5FF12;border:1px solid #00E5FF55;color:var(--cyan);width:38px;height:38px;border-radius:9px;font-size:24px;font-weight:600}
:where(.app-body, .login-body) .nav-list {display:flex;flex-direction:column;gap:8px;margin-top:44px}
:where(.app-body, .login-body) .nav-list a {padding:12px 16px;display:flex;align-items:center;gap:14px;color:var(--muted);border:1px solid transparent;border-radius:7px}
:where(.app-body, .login-body) .nav-list a span {width:20px;text-align:center;font-size:20px;line-height:1}
:where(.app-body, .login-body) .nav-list a:hover {background:#121B28;color:var(--text)}
:where(.app-body, .login-body) .nav-list a[aria-current=page] {color:var(--cyan);background:#00E5FF0B;border-color:#00E5FF28}
:where(.app-body, .login-body) .sidebar-bottom {margin-top:auto;padding-top:24px}
:where(.app-body, .login-body) .sidebar-bottom p {font-size:12px;color:var(--muted);margin-bottom:20px}
:where(.app-body, .login-body) .app-main {margin-left:224px}
:where(.app-body, .login-body) .topbar {height:82px;border-bottom:1px solid var(--border);padding:0 34px;display:flex;justify-content:space-between;align-items:center;gap:15px;background:#080B11}
:where(.app-body, .login-body) .status-strip {display:flex;gap:22px;align-items:center;font-size:12px;flex-wrap:wrap;color:var(--muted)}
:where(.app-body, .login-body) .mode {color:var(--cyan);font-size:12px;border-left:1px solid var(--border);padding-left:22px;font-weight:500}
:where(.app-body, .login-body) .account {display:flex;gap:10px;align-items:center;font-size:12px}
:where(.app-body, .login-body) .account #last-update {color:var(--muted);margin-right:8px}
:where(.app-body, .login-body) .avatar {width:28px;height:28px;border-radius:50%;border:1px solid var(--border);display:grid;place-items:center;color:var(--cyan);background:#13202B}
:where(.app-body, .login-body) .page-content {max-width:1680px;margin:auto;padding:34px}
:where(.app-body, .login-body) .page-heading {display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:26px}
:where(.app-body, .login-body) .page-heading p {color:var(--muted);margin-top:8px;font-size:13px}
:where(.app-body, .login-body) .button {border:1px solid var(--border);border-radius:6px;background:transparent;color:var(--text);padding:9px 17px;display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:40px;cursor:pointer;font-size:13px;transition:background .15s,border-color .15s}
:where(.app-body, .login-body) .button.primary {background:var(--cyan);color:#041017;border-color:var(--cyan);font-weight:650}
:where(.app-body, .login-body) .button.primary:hover {background:#55EDFF}
:where(.app-body, .login-body) .button.quiet:hover {border-color:#41576E;background:#13202B}
:where(.app-body, .login-body) .button.small {padding:5px 10px;min-height:30px;font-size:12px}
:where(.app-body, .login-body) .full {width:100%}
:where(.app-body, .login-body) .text-link {color:var(--cyan);font-size:12px}
:where(.app-body, .login-body) .text-link:hover {text-decoration:underline}
:where(.app-body, .login-body) .metrics {display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;margin-bottom:24px}
:where(.app-body, .login-body) .metric {background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:20px 18px;min-height:144px}
:where(.app-body, .login-body) .metric p {font-size:12px;color:var(--muted);margin-bottom:13px}
:where(.app-body, .login-body) .metric h2 {font-size:21px;line-height:1.4;margin-bottom:13px;overflow-wrap:anywhere}
:where(.app-body, .login-body) .metric small {font-size:11px;color:var(--muted)}
:where(.app-body, .login-body) .panel {background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:24px;margin-bottom:24px}
:where(.app-body, .login-body) .panel-heading {display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:20px}
:where(.app-body, .login-body) .panel-heading .muted {font-size:12px}
:where(.app-body, .login-body) .overview-columns {display:grid;grid-template-columns:1fr 1fr;gap:24px}
:where(.app-body, .login-body) .quick-links {display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
:where(.app-body, .login-body) .check-list {margin:0}
:where(.app-body, .login-body) .check-list div {display:flex;justify-content:space-between;padding:11px 0;border-bottom:1px solid #1D2A3A88;gap:16px;font-size:13px}
:where(.app-body, .login-body) .check-list div:last-child {border:0}
:where(.app-body, .login-body) .check-list dt {color:var(--muted)}
:where(.app-body, .login-body) .check-list dd {margin:0;text-align:right}
:where(.app-body, .login-body) .stage-panel p {margin-top:18px;font-size:13px;max-width:530px}
:where(.app-body, .login-body) .stage-panel h2 {margin-bottom:6px}
:where(.app-body, .login-body) .stage-panel .button {margin-top:22px}
:where(.app-body, .login-body) .safety-note {margin-top:24px;border-top:1px solid var(--border);padding-top:18px;color:var(--green);font-size:12px}
:where(.app-body, .login-body) .compact {font-size:12px;margin-top:-9px;margin-bottom:16px}
:where(.app-body, .login-body) .notice {border-left:3px solid var(--cyan);padding:12px 18px;background:#00E5FF08;margin-bottom:24px;color:var(--muted);font-size:13px}
:where(.app-body, .login-body) .table-scroll {overflow-x:auto}
:where(.app-body, .login-body) table {width:100%;border-collapse:collapse;text-align:left;white-space:nowrap;font-size:13px}
:where(.app-body, .login-body) th {color:var(--muted);font-size:11px;font-weight:400;padding:11px 13px;background:#0A0F17;border-bottom:1px solid var(--border)}
:where(.app-body, .login-body) td {padding:17px 13px;border-bottom:1px solid #1D2A3A88;vertical-align:middle}
:where(.app-body, .login-body) tr:last-child td {border-bottom:0}
:where(.app-body, .login-body) td small {display:block;color:var(--muted);font-size:11px}
:where(.app-body, .login-body) .table-actions {display:flex;gap:7px}
:where(.app-body, .login-body) .state {display:inline-block;font-size:11px;line-height:1.3}
:where(.app-body, .login-body) .state.off {color:var(--muted)}
:where(.app-body, .login-body) .state.pass {color:var(--green)}
:where(.app-body, .login-body) .state.fail {color:var(--amber)}
:where(.app-body, .login-body) .form-grid {display:grid;grid-template-columns:1fr 1fr;gap:22px 26px}
:where(.app-body, .login-body) label {display:block;font-size:13px;color:#C5D0DE;margin-bottom:8px}
:where(.app-body, .login-body) input, :where(.app-body, .login-body) select {width:100%;min-height:42px;background:#060B12;border:1px solid #26374A;border-radius:6px;color:var(--text);padding:9px 12px;font-size:13px}
:where(.app-body, .login-body) input::placeholder {color:#687E95}
:where(.app-body, .login-body) input:focus, :where(.app-body, .login-body) select:focus {border-color:var(--cyan);outline:0;box-shadow:0 0 0 2px #00E5FF15}
:where(.app-body, .login-body) .field-help {color:var(--muted);font-size:11px;margin-top:7px}
:where(.app-body, .login-body) .switches {padding-top:22px}
:where(.app-body, .login-body) .switches label {display:flex;align-items:center;gap:9px;font-size:12px;margin-bottom:13px}
:where(.app-body, .login-body) .switches input {width:16px;min-height:16px;accent-color:var(--cyan)}
:where(.app-body, .login-body) .form-actions {display:flex;gap:15px;align-items:center;border-top:1px solid var(--border);margin-top:28px;padding-top:24px;flex-wrap:wrap}
:where(.app-body, .login-body) .form-actions .muted {font-size:12px}
:where(.app-body, .login-body) .message {border:1px solid #00E5FF55;border-radius:7px;padding:12px 16px;font-size:13px;color:var(--cyan);background:#00E5FF0A;margin-bottom:20px;overflow-wrap:anywhere}
:where(.app-body, .login-body) .message.error {border-color:#FF386055;color:#FF91A5;background:#FF38600A}
:where(.app-body, .login-body) .message.warning {border-color:#FFCC0044;color:var(--amber);background:#FFCC0008}
:where(.app-body, .login-body) .spinner {display:inline-block;width:13px;height:13px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin .8s linear infinite}
:where(.app-body, .login-body) @keyframes spin {to{transform:rotate(360deg)}}
:where(.app-body, .login-body) .footer {border-top:1px solid var(--border);padding-top:20px;margin-top:30px;display:flex;justify-content:space-between;gap:16px;color:#70849B;font-size:11px}
:where(.app-body, .login-body) .audit-pager {display:flex;align-items:center;justify-content:center;gap:20px;margin-top:20px;font-size:12px}
:where(.app-body, .login-body) .status-empty {text-align:center;padding:75px 24px}
:where(.app-body, .login-body) .status-empty h2 {font-size:24px;margin-bottom:15px}
:where(.app-body, .login-body) .status-empty p {color:var(--muted);max-width:540px;margin:0 auto 28px}
:where(.app-body, .login-body) .empty-symbol {display:block;font-size:52px;color:var(--cyan);margin-bottom:15px}
:where(.app-body, .login-body) .login-layout {display:grid;grid-template-columns:1.1fr 1fr;gap:110px;max-width:1100px;width:100%;align-items:center}
:where(.app-body, .login-body) .login-intro h1 {font-size:42px;line-height:1.5;margin-top:60px;font-weight:600}
:where(.app-body, .login-body) .login-intro h1 span {color:var(--cyan)}
:where(.app-body, .login-body) .login-intro>p {color:var(--muted);font-size:14px;max-width:400px;margin-top:24px}
:where(.app-body, .login-body) .security-list {list-style:none;padding:0;margin:32px 0;color:#B9C8D8;font-size:13px}
:where(.app-body, .login-body) .security-list li {margin-bottom:13px}
:where(.app-body, .login-body) .intro-note {border-top:1px solid var(--border);padding-top:20px;color:#70849B;font-size:12px;max-width:410px}
:where(.app-body, .login-body) .login-panel {padding:36px;background:var(--panel);border:1px solid var(--border);border-radius:12px;width:100%;max-width:470px;box-shadow:0 0 60px #00E5FF04}
:where(.app-body, .login-body) .login-panel h2 {font-size:24px;margin-bottom:9px}
:where(.app-body, .login-body) .login-panel>.muted {font-size:13px;margin-bottom:28px}
:where(.app-body, .login-body) .login-panel form label {margin-top:18px}
:where(.app-body, .login-body) .login-panel form button {margin-top:26px}
:where(.app-body, .login-body) .login-footnote {font-size:11px;color:#70849B;text-align:center;margin-top:23px}
@media(min-width:1600px) {:where(.app-body, .login-body) .metric h2 {font-size:25px}
:where(.app-body, .login-body) .metric {min-height:158px}
:where(.app-body, .login-body) .page-content {padding:40px}}
@media(max-width:1250px) {:where(.app-body, .login-body) .metrics {grid-template-columns:repeat(3,minmax(0,1fr))}
:where(.app-body, .login-body) .status-strip {gap:12px}
:where(.app-body, .login-body) .mode {padding-left:12px}
:where(.app-body, .login-body) .account #last-update {display:none}
:where(.app-body, .login-body) .login-layout {gap:60px}
:where(.app-body, .login-body) .login-intro h1 {font-size:36px}}
@media(max-width:900px) {:where(.app-body, .login-body) .sidebar {width:190px;padding:25px 14px}
:where(.app-body, .login-body) .app-main {margin-left:190px}
:where(.app-body, .login-body) .topbar {padding:0 22px}
:where(.app-body, .login-body) .page-content {padding:24px}
:where(.app-body, .login-body) .overview-columns {grid-template-columns:1fr}
:where(.app-body, .login-body) .metrics {grid-template-columns:repeat(2,minmax(0,1fr))}
:where(.app-body, .login-body) .metrics .metric:last-child {grid-column:span 2}
:where(.app-body, .login-body) .form-grid {grid-template-columns:1fr}
:where(.app-body, .login-body) .login-layout {gap:40px}
:where(.app-body, .login-body) .login-intro h1 {font-size:30px}
:where(.app-body, .login-body) .login-panel {padding:28px}
:where(.app-body, .login-body) .footer {flex-direction:column}
:where(.app-body, .login-body) .account {display:none}}
@media(max-width:640px) {:where(.app-body, .login-body) .sidebar {position:relative;width:100%;padding:18px 20px 12px;border-right:0;border-bottom:1px solid var(--border)}
:where(.app-body, .login-body) .brand {font-size:16px}
:where(.app-body, .login-body) .brand small {font-size:10px}
:where(.app-body, .login-body) .brand-mark {width:32px;height:32px;font-size:20px}
:where(.app-body, .login-body) .nav-list {flex-direction:row;margin-top:18px;gap:4px;overflow-x:auto;padding-bottom:4px}
:where(.app-body, .login-body) .nav-list a {flex-shrink:0;padding:7px 10px;font-size:12px;gap:6px}
:where(.app-body, .login-body) .nav-list a span {font-size:16px;width:16px}
:where(.app-body, .login-body) .sidebar-bottom {padding:0;position:absolute;right:20px;top:18px}
:where(.app-body, .login-body) .sidebar-bottom p {display:none}
:where(.app-body, .login-body) .sidebar-bottom .button {width:auto;padding:5px 9px;min-height:30px;font-size:11px}
:where(.app-body, .login-body) .app-main {margin-left:0}
:where(.app-body, .login-body) .topbar {height:auto;min-height:56px;padding:12px 20px}
:where(.app-body, .login-body) .status-strip {font-size:10px;gap:10px}
:where(.app-body, .login-body) .mode {font-size:10px;padding-left:10px}
:where(.app-body, .login-body) .page-content {padding:22px 18px}
:where(.app-body, .login-body) .page-heading {gap:14px;align-items:flex-start}
:where(.app-body, .login-body) .page-heading h1 {font-size:24px}
:where(.app-body, .login-body) .page-heading p {font-size:12px}
:where(.app-body, .login-body) .page-heading .button {font-size:11px;padding:7px 10px;white-space:nowrap;min-height:34px}
:where(.app-body, .login-body) .metrics {gap:10px}
:where(.app-body, .login-body) .metric {padding:17px 14px;min-height:130px}
:where(.app-body, .login-body) .metric h2 {font-size:19px}
:where(.app-body, .login-body) .metric small {font-size:10px}
:where(.app-body, .login-body) .panel {padding:18px}
:where(.app-body, .login-body) .overview-columns {gap:0}
:where(.app-body, .login-body) .panel-heading {gap:10px;align-items:flex-start}
:where(.app-body, .login-body) .panel-heading .muted {font-size:10px}
:where(.app-body, .login-body) .login-layout {grid-template-columns:1fr;gap:28px;max-width:450px}
:where(.app-body, .login-body) .login-intro h1 {font-size:28px;margin-top:30px}
:where(.app-body, .login-body) .login-intro>p {font-size:12px;margin-top:15px}
:where(.app-body, .login-body) .security-list {display:flex;gap:12px;flex-wrap:wrap;margin:20px 0 0;font-size:11px}
:where(.app-body, .login-body) .security-list li {margin:0}
:where(.app-body, .login-body) .intro-note {display:none}
:where(.app-body, .login-body) .login-panel {padding:26px}
:where(.app-body, .login-body) .login-panel h2 {font-size:22px}
:where(.app-body, .login-body) .notice {font-size:12px}
:where(.app-body, .login-body) .table-actions {gap:5px}
:where(.app-body, .login-body) .form-actions {gap:10px}
:where(.app-body, .login-body) .footer {gap:8px}
:where(.app-body, .login-body) .status-empty {padding:50px 18px}}
@media(prefers-reduced-motion:reduce) {* {animation-duration:.01ms!important;transition:none!important}}
@media(min-width:901px) and (max-height:1000px) {:where(.app-body, .login-body) .topbar {height:72px}
:where(.app-body, .login-body) .page-content {padding-top:28px}
:where(.app-body, .login-body) .metric {min-height:134px}
:where(.app-body, .login-body) .check-list div {padding-top:9px;padding-bottom:9px}}
:where(.app-body, .login-body) .table-wrap {overflow-x:auto}
:where(.app-body, .login-body) .market-chart {min-height:220px;position:relative;border:1px solid #1D2A3A;border-radius:8px;background:linear-gradient(180deg,#07141D,#080D15);overflow:hidden}
:where(.app-body, .login-body) .market-chart svg {display:block;width:100%;height:220px}
:where(.app-body, .login-body) .market-chart p {position:absolute;inset:0;display:grid;place-items:center;padding:20px;text-align:center}
:where(.app-body, .login-body) .market-chart.hidden {display:none}
:where(.app-body, .login-body) .market-visuals {align-items:stretch}
:where(.app-body, .login-body) .market-visuals .panel {min-width:0}
:where(.app-body, .login-body) .market-actions {display:flex;align-items:center;flex-wrap:wrap;gap:10px}
:where(.app-body, .login-body) .market-selection {grid-template-columns:2fr 1fr 1fr}
:where(.app-body, .login-body) .connector-setup {border-top:1px solid var(--border);margin-top:20px;padding-top:18px}
:where(.app-body, .login-body) .connector-setup summary {cursor:pointer;color:var(--cyan)}
:where(.app-body, .login-body) .connector-setup>p {margin:14px 0}
:where(.app-body, .login-body) .connector-setup .field-help {display:block}
:where(.app-body, .login-body) .market-chart canvas {width:100%;height:290px;display:block}
:where(.app-body, .login-body) .quality-chart canvas {width:100%;height:250px;display:block}
:where(.app-body, .login-body) .quality-metrics {grid-template-columns:repeat(4,minmax(0,1fr))}
:where(.app-body, .login-body) .chart-legend {display:flex;flex-wrap:wrap;gap:14px;font-size:11px;color:var(--muted);margin-top:12px}
:where(.app-body, .login-body) .market-selection+dl {margin-top:14px}
:where(.app-body, .login-body) .table-wrap td {font-variant-numeric:tabular-nums}
:where(.app-body, .login-body) .connector-setup label {overflow-wrap:anywhere}
:where(.app-body, .login-body) .negative {color:var(--red)}
:where(.app-body, .login-body) .overview-columns>* {min-width:0}
@media(max-width:900px) {:where(.app-body, .login-body) .market-selection {grid-template-columns:1fr}
:where(.app-body, .login-body) .quality-metrics {grid-template-columns:repeat(2,minmax(0,1fr))}
:where(.app-body, .login-body) .quality-metrics .metric:last-child {grid-column:auto}
:where(.app-body, .login-body) .page-heading .market-actions {justify-content:flex-end}
:where(.app-body, .login-body) .check-list dd {overflow-wrap:anywhere;max-width:70%}}
:where(.app-body, .login-body) .risk-top-actions {display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end;max-width:680px}
:where(.app-body, .login-body) .risk-top-actions [hidden] {display:none!important}
:where(.app-body, .login-body) .kill-switch-danger {background:#a41431!important;color:#fff!important;border:2px solid #ff3860!important;font-weight:800;min-height:48px;box-shadow:0 0 18px #ff386040;white-space:normal;text-align:center}
:where(.app-body, .login-body) .kill-switch-danger:hover:not(:disabled):not([aria-pressed="true"]) {background:#d82046!important;box-shadow:0 0 22px #ff386080}
:where(.app-body, .login-body) .kill-switch-danger:focus-visible {outline:3px solid #fff;outline-offset:4px}
:where(.app-body, .login-body) .kill-switch-danger[aria-pressed="true"] {background:#721729!important}
:where(.app-body, .login-body) .kill-switch-danger:disabled {opacity:.72;cursor:wait}
:where(.app-body, .login-body) #kill-switch-status {font-size:13px;flex-basis:100%;text-align:right;color:#ffcc00}
:where(.app-body, .login-body) .risk-overview {margin-bottom:20px}
:where(.app-body, .login-body) .risk-summary-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:16px 0 0}
:where(.app-body, .login-body) .risk-summary-grid div {min-width:0;padding:12px;background:#05070b;border:1px solid #1d2a3a;border-radius:8px}
:where(.app-body, .login-body) .risk-summary-grid dt {color:#9aafc5;font-size:13px}
:where(.app-body, .login-body) .risk-summary-grid dd {margin:8px 0 0;overflow-wrap:anywhere;color:#00e5ff;font-weight:600}
@media(max-width:800px) {:where(.app-body, .login-body) .risk-top-actions {justify-content:flex-start;width:100%;max-width:100%}
:where(.app-body, .login-body) #kill-switch-status {text-align:left}
:where(.app-body, .login-body) .risk-summary-grid {grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:420px) {:where(.app-body, .login-body) .risk-summary-grid {grid-template-columns:1fr}
:where(.app-body, .login-body) .kill-switch-danger {width:100%}}
:root {
  --cj-ink:#05070D;
  --cj-accent:#22D3EE;
  --cj-accent-2:#38BDF8;
  --cj-gold:#F2C14E;
  --cj-line:rgba(56,189,248,.18);
  --cj-line-strong:rgba(34,211,238,.42);
}
body:where(.app-body, .login-body) {background:
  radial-gradient(1200px 600px at 12% -10%, rgba(34,211,238,.10), transparent 60%),
  radial-gradient(900px 500px at 100% 0%, rgba(242,193,78,.07), transparent 55%),
  var(--bg);}
:where(.app-body, .login-body) .sidebar {background:linear-gradient(180deg,#070B12 0%, #05070D 100%);border-right:1px solid var(--cj-line)}
:where(.app-body, .login-body) .brand {letter-spacing:.06em}
:where(.app-body, .login-body) .brand-mark {
  background:linear-gradient(140deg, rgba(34,211,238,.18), rgba(242,193,78,.14));
  border:1px solid var(--cj-line-strong);color:var(--cj-gold);
  border-radius:11px;font-weight:700;position:relative;
  animation:cj-mark-spin 9s linear infinite;
}
:where(.app-body, .login-body) @keyframes cj-mark-spin {
  0%{box-shadow:0 0 0 0 rgba(34,211,238,.35)}
  70%{box-shadow:0 0 0 10px rgba(34,211,238,0)}
  100%{box-shadow:0 0 0 0 rgba(34,211,238,0)}
}
:where(.app-body, .login-body) .brand small {color:var(--cj-accent);letter-spacing:.22em;font-size:10px}
:where(.app-body, .login-body) .nav-list a[aria-current=page] {color:var(--cj-accent);background:rgba(34,211,238,.10);border-color:var(--cj-line-strong)}
:where(.app-body, .login-body) .nav-list a:hover {background:rgba(34,211,238,.06)}
:where(.app-body, .login-body) .panel, :where(.app-body, .login-body) .metric, :where(.app-body, .login-body) .card {border-color:var(--cj-line);border-radius:14px}
:where(.app-body, .login-body) .button {border-radius:10px}
:where(.app-body, .login-body) .mode, :where(.app-body, .login-body) .status-strip {border-color:var(--cj-line)}
:where(.app-body, .login-body) h1 {letter-spacing:.01em}
@media (prefers-reduced-motion: reduce) {:where(.app-body, .login-body) .brand-mark {animation:none}}
:where(.app-body, .login-body) .topbar {
  background:linear-gradient(90deg, rgba(7,11,18,.96), rgba(5,7,13,.92))!important;
  backdrop-filter:blur(12px);
  border-bottom:1px solid var(--cj-line)!important;
}
:where(.app-body, .login-body) .status-strip {letter-spacing:.02em}
:where(.app-body, .login-body) .page-heading {gap:18px;padding-bottom:4px}
:where(.app-body, .login-body) .page-heading h1 {
  font-size:30px;letter-spacing:.005em;position:relative;padding-left:14px;
}
:where(.app-body, .login-body) .page-heading h1::before {
  content:"";position:absolute;left:0;top:.18em;bottom:.18em;width:3px;border-radius:2px;
  background:linear-gradient(180deg,var(--cj-accent),var(--cj-gold));
}
:where(.app-body, .login-body) .page-heading p {color:var(--muted);max-width:70ch}
:where(.app-body, .login-body) .metrics {gap:14px}
:where(.app-body, .login-body) .metric {
  background:linear-gradient(160deg, rgba(12,17,26,.95), rgba(8,12,19,.9));
  border:1px solid var(--cj-line);border-radius:14px;position:relative;overflow:hidden;
  transition:transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
:where(.app-body, .login-body) .metric::after {
  content:"";position:absolute;left:0;right:0;top:0;height:2px;
  background:linear-gradient(90deg,var(--cj-accent),rgba(242,193,78,.6),transparent);
  opacity:.75;
}
:where(.app-body, .login-body) .metric:hover {
  transform:translateY(-2px);border-color:var(--cj-line-strong);
  box-shadow:0 14px 32px rgba(0,0,0,.45);
}
:where(.app-body, .login-body) .metric h2 {font-variant-numeric:tabular-nums;letter-spacing:.01em}
:where(.app-body, .login-body) .metric small {letter-spacing:.04em;text-transform:none}
:where(.app-body, .login-body) .panel {
  background:linear-gradient(180deg, rgba(11,16,24,.92), rgba(7,10,16,.88));
  border:1px solid var(--cj-line);border-radius:14px;
}
:where(.app-body, .login-body) .panel-heading {
  padding-bottom:12px;margin-bottom:14px;border-bottom:1px solid var(--cj-line);
}
:where(.app-body, .login-body) .panel-heading h2 {letter-spacing:.02em}
:where(.app-body, .login-body) .panel-heading .muted {font-size:12px}
:where(.app-body, .login-body) .button {border-radius:10px;transition:transform .15s ease, filter .15s ease, border-color .15s ease}
:where(.app-body, .login-body) .button.primary {
  background:linear-gradient(120deg,var(--cj-accent),var(--cj-accent-2))!important;
  color:#04121A!important;border:0!important;font-weight:650;
}
:where(.app-body, .login-body) .button.primary:hover {filter:brightness(1.08);transform:translateY(-1px)}
:where(.app-body, .login-body) .button.quiet {border-color:var(--cj-line);color:var(--text)}
:where(.app-body, .login-body) .button.quiet:hover {border-color:var(--cj-line-strong);color:var(--cj-accent)}
:where(.app-body, .login-body) .table-wrap, :where(.app-body, .login-body) .table-scroll {border:1px solid var(--cj-line);border-radius:12px;overflow:auto}
:where(.app-body, .login-body) table {width:100%;border-collapse:collapse}
:where(.app-body, .login-body) thead th {
  position:sticky;top:0;z-index:1;
  background:#0A0F18;color:var(--cj-accent);font-weight:600;letter-spacing:.03em;
  border-bottom:1px solid var(--cj-line-strong);white-space:nowrap;
}
:where(.app-body, .login-body) tbody tr:nth-child(even) {background:rgba(34,211,238,.028)}
:where(.app-body, .login-body) tbody tr:hover {background:rgba(34,211,238,.075)}
:where(.app-body, .login-body) tbody td {border-bottom:1px solid rgba(29,42,58,.6);font-variant-numeric:tabular-nums}
:where(.app-body, .login-body) tbody tr:last-child td {border-bottom:0}
:where(.app-body, .login-body) .notice {
  border-left:3px solid var(--cj-accent);border-radius:10px;
  background:linear-gradient(90deg, rgba(34,211,238,.09), rgba(34,211,238,.02));
}
:where(.app-body, .login-body) .check-list div {border-bottom:1px solid rgba(29,42,58,.55);padding:10px 0}
:where(.app-body, .login-body) .check-list div:last-child {border-bottom:0}
:where(.app-body, .login-body) .safety-note {border-left:3px solid var(--cj-gold);padding-left:12px}
:where(.app-body, .login-body) .stage-panel {border-color:var(--cj-line)}
:where(.app-body, .login-body) .status-empty {border:1px dashed var(--cj-line);border-radius:12px;color:var(--muted)}
:where(.app-body, .login-body) input, :where(.app-body, .login-body) select, :where(.app-body, .login-body) textarea {
  background:rgba(4,8,14,.85)!important;border:1px solid var(--cj-line)!important;
  border-radius:9px!important;color:var(--text)!important;
}
:where(.app-body, .login-body) input:focus, :where(.app-body, .login-body) select:focus, :where(.app-body, .login-body) textarea:focus {
  border-color:var(--cj-accent)!important;box-shadow:0 0 0 3px rgba(34,211,238,.14);
}
:where(.app-body, .login-body) .field-help {color:var(--muted)}
:where(.app-body, .login-body) .market-chart, :where(.app-body, .login-body) .quality-chart {
  border:1px solid var(--cj-line);border-radius:12px;
  background:linear-gradient(180deg,#071420,#060B12);
}
:where(.app-body, .login-body) .chart-legend {color:var(--muted);letter-spacing:.03em}
:where(.app-body, .login-body) .table-wrap::-webkit-scrollbar, :where(.app-body, .login-body) .table-scroll::-webkit-scrollbar, :where(.app-body, .login-body) .nav-list::-webkit-scrollbar {height:8px;width:8px}
:where(.app-body, .login-body) .table-wrap::-webkit-scrollbar-thumb, :where(.app-body, .login-body) .table-scroll::-webkit-scrollbar-thumb, :where(.app-body, .login-body) .nav-list::-webkit-scrollbar-thumb {
  background:rgba(34,211,238,.28);border-radius:8px;
}
:where(.app-body, .login-body) .table-wrap::-webkit-scrollbar-track, :where(.app-body, .login-body) .table-scroll::-webkit-scrollbar-track, :where(.app-body, .login-body) .nav-list::-webkit-scrollbar-track {background:transparent}
@media (max-width:640px) {:where(.app-body, .login-body) .page-heading h1 {font-size:22px;padding-left:11px}
:where(.app-body, .login-body) .page-heading h1::before {width:2.5px}
:where(.app-body, .login-body) .metric {border-radius:12px}
:where(.app-body, .login-body) .panel {border-radius:12px;padding:16px}
:where(.app-body, .login-body) .metrics {gap:10px}
:where(.app-body, .login-body) thead th {position:static}
:where(.app-body, .login-body) .table-wrap, :where(.app-body, .login-body) .table-scroll {border-radius:10px}
:where(.app-body, .login-body) table {font-size:12.5px}
:where(.app-body, .login-body) thead th, :where(.app-body, .login-body) tbody td {padding:8px 7px;white-space:nowrap}
:where(.app-body, .login-body) .risk-top-actions {gap:8px}
:where(.app-body, .login-body) .risk-top-actions .button {font-size:12px}}
@media (max-width:640px) {:where(.app-body, .login-body) .nav-list {
    flex-direction:row;flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;
    row-gap:0;gap:8px;padding:2px 2px 8px;
    scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;
  }
:where(.app-body, .login-body) .nav-list a {
    flex:0 0 auto;scroll-snap-align:start;padding:9px 13px;border-radius:999px;
    border:1px solid var(--cj-line);background:rgba(15,23,42,.55);
    font-size:12.5px;line-height:1.2;
  }
:where(.app-body, .login-body) .nav-list a[aria-current=page] {border-color:var(--cj-line-strong);background:rgba(34,211,238,.12)}
:where(.app-body, .login-body) .nav-list a span {font-size:14px;width:16px}
:where(.app-body, .login-body) .nav-list::-webkit-scrollbar {height:5px}
:where(.app-body, .login-body) .nav-list::-webkit-scrollbar-thumb {background:rgba(34,211,238,.35);border-radius:5px}}
:where(.app-body, .login-body) .page-heading {align-items:flex-start}
:where(.app-body, .login-body) .page-eyebrow {
  display:inline-block;margin-bottom:10px;padding:4px 11px;border-radius:999px;
  font-size:11px;letter-spacing:.16em;color:var(--cj-accent);
  border:1px solid var(--cj-line-strong);background:rgba(34,211,238,.07);
}
:where(.app-body, .login-body) .page-heading h1 {font-size:30px;letter-spacing:.01em}
:where(.app-body, .login-body) .metric {position:relative;overflow:hidden}
:where(.app-body, .login-body) .metric .metric-icon {
  position:absolute;right:15px;top:15px;width:32px;height:32px;border-radius:10px;
  display:grid;place-items:center;font-size:15px;color:var(--cj-accent);
  background:rgba(34,211,238,.10);border:1px solid var(--cj-line);
}
:where(.app-body, .login-body) .metric p {color:var(--muted);font-size:12.5px;letter-spacing:.03em}
:where(.app-body, .login-body) .panel-heading {display:flex;align-items:center;gap:12px;flex-wrap:wrap}
:where(.app-body, .login-body) .panel-index {
  flex:0 0 auto;font-family:ui-monospace,Consolas,monospace;font-size:12px;
  letter-spacing:.14em;color:var(--cj-accent);border:1px solid var(--cj-line-strong);
  border-radius:8px;padding:4px 8px;
}
:where(.app-body, .login-body) .panel-heading h2 {flex:1 1 auto}
:where(.app-body, .login-body) .section-strip {
  display:flex;flex-wrap:wrap;gap:10px;margin:0 0 18px;
}
:where(.app-body, .login-body) .section-strip .strip-item {
  display:flex;align-items:center;gap:8px;padding:9px 14px;border-radius:999px;
  border:1px solid var(--cj-line);background:rgba(12,17,26,.72);font-size:13px;color:var(--muted);
}
:where(.app-body, .login-body) .section-strip .strip-item b {color:var(--text);font-weight:650}
:where(.app-body, .login-body) .risk-summary-grid {gap:12px}
:where(.app-body, .login-body) .risk-summary-grid>div {
  border:1px solid var(--cj-line);border-radius:12px;padding:14px 16px;
  background:linear-gradient(160deg,rgba(12,17,26,.92),rgba(8,12,19,.86));
}
:where(.app-body, .login-body) .risk-summary-grid dt {font-size:12.5px;color:var(--muted)}
:where(.app-body, .login-body) .risk-summary-grid dd {margin:6px 0 0;font-size:17px;font-weight:650;font-variant-numeric:tabular-nums}
:where(.app-body, .login-body) .quick-links {display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
:where(.app-body, .login-body) .quick-links .button {flex:0 0 auto}
:where(.app-body, .login-body) .status-empty {border:1px solid var(--cj-line);border-radius:16px;text-align:left}
:where(.app-body, .login-body) .status-empty .empty-symbol {
  display:grid;place-items:center;width:56px;height:56px;border-radius:16px;font-size:24px;
  color:var(--cj-accent);border:1px solid var(--cj-line-strong);background:rgba(34,211,238,.08);
  margin-bottom:14px;
}
@media (max-width:640px) {:where(.app-body, .login-body) .page-heading h1 {font-size:22px}
:where(.app-body, .login-body) .page-eyebrow {font-size:10px;padding:3px 9px}
:where(.app-body, .login-body) .section-strip {gap:7px}
:where(.app-body, .login-body) .section-strip .strip-item {font-size:12px;padding:7px 11px}
:where(.app-body, .login-body) .risk-summary-grid {gap:9px}
:where(.app-body, .login-body) .risk-summary-grid>div {padding:11px 12px}
:where(.app-body, .login-body) .risk-summary-grid dd {font-size:15px}
:where(.app-body, .login-body) .metric .metric-icon {width:27px;height:27px;right:11px;top:11px;font-size:13px}}

/* A3 补丁（路线1：保原样。B 块把 login/error 切到本文件前必须齐全）：
   dark.css 中作用于登录页/报错页 body 的样式，全部用 body.login-body 精确覆盖。
   优先级 0-1-1 高于 body 的 0-0-1，保证不被官网底色/字号盖掉。
   下列值逐项抄自"撤引用前"实测基线。 */
body.login-body {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 40px;
  background: radial-gradient(ellipse at 25% 50%, #00E5FF08, transparent 55%), var(--bg);
  color: var(--text);
  font-family: "Segoe UI", "Microsoft YaHei", sans-serif;
  font-size: 14px;
  line-height: 1.65;
}

/* ==========================================================================
   A3：并入 alpha_site.css（官网主题）—— 原样，与现状一致。
   ========================================================================== */
/* 阶段 6.1-ALPHA-FINAL 官网样式：冷酷理智科技风，Bootstrap 5 同款断点，纯本地无外链。 */
/* 设计令牌已统一到 design-system.css（A 块：统一设计系统）。本文件只保留组件样式。 */

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  max-width: 100%;
  /* 用 clip 而不是 hidden：hidden 会创建滚动容器，导致 position: sticky 失效。 */
  overflow-x: clip;
}

body {
  background: var(--a-bg);
  color: var(--a-text);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei", "PingFang SC", sans-serif;
  font-size: 16px;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}

/* 流动渐变光晕：只用 CSS 动画，不用 JS 逐帧改样式 */
.a-stage { position: relative; min-height: 100vh; isolation: isolate; }
.a-stage::before,
.a-stage::after {
  content: "";
  position: fixed;
  z-index: -1;
  width: 78vmax;
  height: 78vmax;
  border-radius: 50%;
  filter: blur(90px);
  opacity: 0.32;
  pointer-events: none;
}
.a-stage::before {
  background: radial-gradient(circle, var(--a-accent) 0%, transparent 68%);
  top: -34vmax; left: -22vmax;
  animation: a-drift-a 26s ease-in-out infinite alternate;
}
.a-stage::after {
  background: radial-gradient(circle, var(--a-accent-2) 0%, transparent 66%);
  bottom: -36vmax; right: -24vmax;
  animation: a-drift-b 32s ease-in-out infinite alternate;
}
@keyframes a-drift-a {
  from { transform: translate3d(0, 0, 0) scale(1); }
  to { transform: translate3d(9vw, 7vh, 0) scale(1.18); }
}
@keyframes a-drift-b {
  from { transform: translate3d(0, 0, 0) scale(1.1); }
  to { transform: translate3d(-8vw, -6vh, 0) scale(1); }
}

/* 栅格：与 Bootstrap 5 一致的 12 列 + 576 / 768 / 992 / 1200 断点 */
.a-container { width: 100%; max-width: 1180px; margin: 0 auto; padding: 0 16px; }
.a-row { display: flex; flex-wrap: wrap; margin: 0 -8px; }
.a-col { flex: 0 0 100%; max-width: 100%; padding: 0 8px; }
.a-gap { margin-bottom: var(--a-space); }

@media (min-width: 576px) {
  .a-col-sm-6 { flex: 0 0 50%; max-width: 50%; }
  .a-col-sm-12 { flex: 0 0 100%; max-width: 100%; }
}
@media (min-width: 768px) {
  .a-col-md-4 { flex: 0 0 33.333%; max-width: 33.333%; }
  .a-col-md-5 { flex: 0 0 41.666%; max-width: 41.666%; }
  .a-col-md-6 { flex: 0 0 50%; max-width: 50%; }
  .a-col-md-7 { flex: 0 0 58.333%; max-width: 58.333%; }
  .a-col-md-8 { flex: 0 0 66.666%; max-width: 66.666%; }
  .a-col-md-12 { flex: 0 0 100%; max-width: 100%; }
}
@media (min-width: 992px) {
  .a-col-lg-3 { flex: 0 0 25%; max-width: 25%; }
  .a-col-lg-4 { flex: 0 0 33.333%; max-width: 33.333%; }
  .a-col-lg-6 { flex: 0 0 50%; max-width: 50%; }
  .a-col-lg-8 { flex: 0 0 66.666%; max-width: 66.666%; }
}

/* 顶部导航 */
.a-nav {
  position: sticky; top: 0; z-index: 20;
  backdrop-filter: blur(12px);
  background: rgba(5, 7, 13, 0.82);
  border-bottom: 1px solid var(--a-line);
}
.a-nav-inner { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 60px; }
.a-nav-right { display: flex; align-items: center; gap: 8px; }
/* ★ D：桌面端藏起【手机抽屉专用】的东西。
   坑：以前写成 `.a-lang-row`（单类名），后面 `.a-lang-capsule` 也是单类名、
   优先级相同且后写 → 把“隐藏”顶掉了，结果抽屉里那个语言按钮跑到桌面顶栏，
   和顶栏那个同时显示 = 两个按钮。现在用父子类名（优先级更高）守护，不会再被盖。
   （本轮已把抽屉里那个语言按钮直接删掉，这条只是防再犯。） */
.a-burger, .a-nav-scrim, .a-nav-panel-head { display: none; }
.a-lang-capsule.a-lang-row { display: none; }
/* × I1：分组小标题只在手机抽屉里出现；桌面端一律藏起来（否则会挤坏顶栏）。 */
.a-nav-group { display: none; }
.a-brand { font-weight: 700; letter-spacing: 0.08em; color: var(--a-text); text-decoration: none; font-size: 15px; }
.a-brand span { color: var(--a-accent); }
.a-nav-links { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.a-nav-links a {
  color: var(--a-text-dim); text-decoration: none; font-size: 14px;
  padding: 8px 10px; border-radius: 8px;
}
.a-nav-links a:hover, .a-nav-links a[aria-current="page"] { color: var(--a-text); background: rgba(34, 211, 238, 0.1); }

/* 首屏 */
.a-hero { padding: 56px 0 32px; }
.a-eyebrow {
  display: inline-block; font-size: 12px; letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--a-accent); border: 1px solid var(--a-line-strong);
  border-radius: 999px; padding: 5px 14px; margin-bottom: 18px;
}
.a-slogan {
  font-size: clamp(24px, 6.4vw, 46px);
  line-height: 1.34;
  font-weight: 700;
  margin: 0 0 18px;
  letter-spacing: 0.01em;
}
.a-slogan .a-hl { color: var(--a-accent); }
.a-hero-note { color: var(--a-text-dim); font-size: 15px; max-width: 760px; margin: 0 0 22px; }
.a-actions { display: flex; flex-wrap: wrap; gap: 12px; }

/* 按钮 */
.a-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 44px; padding: 10px 20px; border-radius: 10px;
  border: 1px solid var(--a-line-strong); background: transparent; color: var(--a-text);
  font-size: 15px; cursor: pointer; text-decoration: none; font-family: inherit;
}
.a-btn:hover { border-color: var(--a-accent); color: var(--a-accent); }
.a-btn-primary {
  background: linear-gradient(120deg, var(--a-accent) 0%, var(--a-accent-2) 100%);
  color: #04121a; border: none; font-weight: 700;
}
.a-btn-primary:hover { color: #04121a; filter: brightness(1.08); }
.a-btn-ghost { border-color: var(--a-line); color: var(--a-text-dim); }
.a-btn:disabled { opacity: 0.55; cursor: not-allowed; }

/* 卡片 */
.a-card {
  background: var(--a-panel); border: 1px solid var(--a-line);
  border-radius: var(--a-radius); padding: 18px; height: auto;
  backdrop-filter: blur(6px);
}
/* 只有"同一行并排的卡片"才拉成等高，控制台里的独立卡片保持自适应高度。 */
.a-row > .a-col > .a-card { height: 100%; }
.a-card h3 { margin: 0 0 10px; font-size: 17px; }
.a-card p { margin: 0; color: var(--a-text-dim); font-size: 14px; }

/* 数据块 */
.a-stat { display: flex; flex-direction: column; gap: 4px; }
.a-stat .a-num { font-size: clamp(22px, 5vw, 30px); font-weight: 700; color: var(--a-text); word-break: break-all; }
.a-stat .a-lab { font-size: 13px; color: var(--a-text-dim); }
.a-num.is-danger { color: var(--a-danger); }
.a-num.is-ok { color: var(--a-ok); }
.a-num.is-warn { color: var(--a-warn); }

/* 提示条 */
.a-notice {
  border: 1px solid var(--a-line-strong); border-radius: var(--a-radius);
  padding: 14px 16px; background: rgba(34, 211, 238, 0.06); color: var(--a-text);
  font-size: 14px; margin: 0 0 18px;
}
.a-notice.is-warn { border-color: rgba(245, 158, 11, 0.5); background: rgba(245, 158, 11, 0.08); }
.a-notice.is-danger { border-color: rgba(244, 63, 94, 0.5); background: rgba(244, 63, 94, 0.08); }

/* 表单 */
.a-field { margin-bottom: 14px; }
.a-field label { display: block; font-size: 13px; color: var(--a-text-dim); margin-bottom: 6px; }
.a-input {
  width: 100%; min-height: 46px; padding: 10px 12px; border-radius: 10px;
  border: 1px solid var(--a-line); background: rgba(2, 6, 23, 0.72); color: var(--a-text);
  font-size: 15px; font-family: inherit;
}
.a-input:focus { outline: none; border-color: var(--a-accent); }
.a-hint { font-size: 12px; color: var(--a-text-dim); margin-top: 6px; }

/* 表格 / 列表 */
.a-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.a-table th, .a-table td { padding: 10px 8px; text-align: left; border-bottom: 1px solid var(--a-line); }
.a-table th { color: var(--a-text-dim); font-weight: 500; font-size: 13px; }
.a-table-wrap { overflow-x: auto; }

.a-list { list-style: none; margin: 0; padding: 0; }
.a-list li { padding: 12px 0; border-bottom: 1px solid var(--a-line); font-size: 14px; }
.a-list li:last-child { border-bottom: none; }

.a-tag {
  display: inline-block; font-size: 12px; padding: 2px 9px; border-radius: 999px;
  border: 1px solid var(--a-line); color: var(--a-text-dim);
}
.a-tag.is-ok { color: var(--a-ok); border-color: rgba(52, 211, 153, 0.45); }
.a-tag.is-me { color: var(--a-accent); border-color: var(--a-line-strong); }

/* 代码 / 底牌风格 */
.a-mono {
  font-family: ui-monospace, "Cascadia Mono", Consolas, monospace;
  font-size: 12px; word-break: break-all; color: var(--a-text-dim);
}
.a-reflect {
  border-left: 2px solid var(--a-line-strong); padding-left: 14px; margin: 0 0 16px;
  white-space: pre-wrap; word-break: break-word; font-size: 14px; color: var(--a-text);
}

/* 区块间距 */
.a-section { padding: 34px 0; }
.a-section h2 { font-size: clamp(19px, 4.4vw, 26px); margin: 0 0 8px; }
.a-section .a-sub { color: var(--a-text-dim); font-size: 14px; margin: 0 0 20px; }

/* 页脚 */
.a-footer {
  border-top: 1px solid var(--a-line); margin-top: 40px; padding: 24px 0 34px;
  color: var(--a-text-dim); font-size: 13px;
}
.a-footer p { margin: 4px 0; }

.a-toast {
  position: fixed; left: 50%; bottom: 22px; transform: translateX(-50%);
  max-width: calc(100% - 32px); padding: 12px 18px; border-radius: 10px;
  background: rgba(2, 6, 23, 0.94); border: 1px solid var(--a-line-strong);
  color: var(--a-text); font-size: 14px; z-index: 40;
}
.a-toast[hidden] { display: none; }
.a-toast.is-ok { border-color: rgba(52, 211, 153, 0.55); }
.a-toast.is-error { border-color: rgba(244, 63, 94, 0.55); }

.a-grid-2 { display: grid; gap: 14px; grid-template-columns: 1fr; }
@media (min-width: 768px) { .a-grid-2 { grid-template-columns: 1fr 1fr; } }

.a-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* 系统开启“减少动态效果”时，全部静态化 */
@media (prefers-reduced-motion: reduce) {
  .a-stage::before, .a-stage::after { animation: none; }
  * { transition: none !important; }
}
/* ---------------- 加密判官 CryptoJudge 品牌标识（纯 CSS 动效，无外链） ---------------- */
.a-brand { display: inline-flex; align-items: center; gap: 10px; }
.a-logo { position: relative; width: 26px; height: 26px; display: inline-block; }
.a-logo i {
  position: absolute; inset: 0; border-radius: 6px; display: block;
  border: 1px solid var(--a-accent);
  animation: a-logo-spin 9s linear infinite;
}
.a-logo i:nth-child(1) { transform: rotate(0deg) scale(1); opacity: .95; }
.a-logo i:nth-child(2) { transform: rotate(30deg) scale(.78); border-color: var(--a-accent-2);
  animation-direction: reverse; animation-duration: 7s; opacity: .8; }
.a-logo i:nth-child(3) { transform: rotate(60deg) scale(.56); border-color: var(--a-text-dim);
  animation-duration: 5s; opacity: .7; }
@keyframes a-logo-spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
.a-brand-text { display: inline-flex; flex-direction: column; line-height: 1.05; }
.a-brand-zh, .a-brand-main { font-size: 15px; letter-spacing: .18em; color: var(--a-text); font-weight: 700; }
.a-brand-en, .a-brand-sub { font-size: 10px; letter-spacing: .30em; color: var(--a-accent); font-style: normal; }
html[lang="en"] .a-brand-main { letter-spacing: .06em; font-size: 17px; }
html[lang="en"] .a-brand-sub { letter-spacing: .22em; }
.a-lang {
  border: 1px solid var(--a-line-strong); border-radius: 8px; padding: 7px 12px;
  font-size: 13px; color: var(--a-accent); text-decoration: none;
}
.a-lang:hover { background: rgba(34, 211, 238, .12); }

/* ★ 语言下拉：全站只有一个（顶栏右上角）。 */
.a-lang-dd { position: relative; display: inline-flex; align-items: center; }
.a-lang-btn {
  display: inline-flex; align-items: center; gap: 6px;
  border: 1px solid var(--a-line-strong); border-radius: 999px;
  padding: 7px 12px; font-size: 13px; line-height: 1;
  background: transparent; color: var(--a-text-dim);
  cursor: pointer; font-family: inherit;
}
.a-lang-btn:hover { background: rgba(34, 211, 238, .12); color: var(--a-text); }
.a-lang-btn[aria-expanded="true"] { color: var(--a-accent); border-color: var(--a-accent); }
/* ★ 国旗：中英两版尺寸完全一致（都是 3:2），圆角 + 极细描边，
   目的：在深色页头和浅色下拉菜单上都能看清边界，不糊成一坨。
   SVG 是内联的（见 _alpha_nav.html 的 flag_cn / flag_en 宏），不用外链图片。 */
.a-flag {
  width: 18px; height: 12px; display: block; flex: none;
  border-radius: 3px; overflow: hidden;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .16), 0 1px 2px rgba(0, 0, 0, .35);
}
.a-lang-caret { font-size: 10px; line-height: 1; opacity: .85; }
.a-lang-menu {
  position: absolute; right: 0; top: calc(100% + 8px); z-index: 60;
  min-width: 170px; margin: 0; padding: 6px; list-style: none;
  background: var(--a-panel); border: 1px solid var(--a-line-strong);
  border-radius: 12px; box-shadow: 0 12px 30px rgba(2, 4, 10, .45);
}
.a-lang-menu[hidden] { display: none; }
.a-lang-item {
  display: flex; align-items: center; gap: 8px; padding: 9px 10px;
  border-radius: 8px; color: var(--a-text-dim); text-decoration: none; font-size: 13px;
}
a.a-lang-item:hover { background: rgba(34, 211, 238, .12); color: var(--a-text); }
.a-lang-item.is-current { color: var(--a-accent); font-weight: 700; cursor: default; }
.a-lang-item .a-lang-flag { display: inline-flex; }
@media (max-width: 720px) {
  /* 手机端只留国旗 + 箭头；抽屉里不再放第二个语言按钮。 */
  .a-lang-btn .a-lang-name { display: none; }
  .a-lang-menu { right: auto; left: 0; }
}

/* ★ 国旗胶囊：中文页和英文页长得一模一样，当前语言高亮、另一语言可点。 */
.a-lang-capsule {
  display: inline-flex; align-items: center; gap: 6px;
  border: 1px solid var(--a-line-strong); border-radius: 999px; padding: 6px 12px;
  font-size: 13px; line-height: 1; text-decoration: none; white-space: nowrap;
}
.a-lang-capsule .a-lang-sep { color: var(--a-line-strong); }
.a-lang-capsule .a-lang-cur { color: var(--a-accent); font-weight: 700; }
.a-lang-capsule .a-lang-link { color: var(--a-text-dim); text-decoration: none; }
.a-lang-capsule .a-lang-link:hover { color: var(--a-text); }
@media (max-width: 767px) {
  .a-lang-capsule { padding: 5px 10px; font-size: 12px; }
}

/* ---------------- 会员控制台：左侧侧边栏 + 主区 ---------------- */
.a-console { display: grid; gap: 18px; padding: 22px 0 40px; grid-template-columns: 1fr;
  align-items: start; }
@media (min-width: 992px) { .a-console { grid-template-columns: 250px 1fr; } }
.a-side { border: 1px solid var(--a-line); border-radius: var(--a-radius); padding: 16px;
  background: var(--a-panel); height: fit-content; }
.a-side-title { margin: 0 0 4px; font-size: 13px; letter-spacing: .16em; color: var(--a-accent); }
.a-side-member { margin: 0 0 14px; font-size: 13px; color: var(--a-text-dim); word-break: break-all; }
.a-side-nav { display: flex; flex-direction: column; gap: 6px; }
.a-side-nav a { display: block; min-height: 44px; line-height: 44px; padding: 0 12px;
  border-radius: 10px; color: var(--a-text-dim); text-decoration: none; font-size: 15px; }
.a-side-nav a:hover, .a-side-nav a[aria-current="page"] {
  color: var(--a-text); background: rgba(34, 211, 238, .1); }
/* ---------------- 总控台侧边栏：可折叠分组 ---------------- */
.a-fold { border-top: 1px solid var(--a-line); margin-top: 12px; padding-top: 12px; }
.a-fold:first-of-type { border-top: 0; margin-top: 0; padding-top: 0; }
.a-fold > summary { cursor: pointer; list-style: none; display: flex;
  align-items: center; justify-content: space-between; gap: 8px;
  min-height: 32px; user-select: none; }
.a-fold > summary::-webkit-details-marker { display: none; }
.a-fold > summary::after { content: "▾"; font-size: 12px; color: var(--a-text-dim);
  transition: transform .15s ease; }
.a-fold:not([open]) > summary::after { transform: rotate(-90deg); }
.a-fold > .a-side-nav { margin-top: 8px; }

.a-side-foot { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.a-console-main { min-width: 0; }

/* ---------------- 到期阻断弹窗：全屏、不可点空白关闭、不可 ESC 关闭 ---------------- */
.a-modal { position: fixed; inset: 0; z-index: 90; display: flex; align-items: center;
  justify-content: center; background: rgba(2, 4, 10, .88); padding: 20px; }
.a-modal[hidden] { display: none; }
.a-modal-box { width: 100%; max-width: 460px; background: var(--a-bg-soft);
  border: 1px solid rgba(244, 63, 94, .55); border-radius: var(--a-radius); padding: 22px; }
.a-modal-box h3 { margin: 0 0 10px; color: var(--a-danger); font-size: 20px; }
.a-modal-box p { margin: 0 0 18px; color: var(--a-text); font-size: 15px; }
.a-modal-actions { display: flex; flex-wrap: wrap; gap: 10px; }

/* ---------------- 标签页 ---------------- */
.a-tabs { display: flex; flex-wrap: wrap; gap: 10px; margin: 18px 0; }

/* ---------------- 表单控件补充 ---------------- */
select.a-input { appearance: none; background-image: none; }
input[type="file"].a-input { padding: 8px 12px; }
/* 总控台侧边栏分组标题 */
.a-side-group {
  margin: 16px 0 6px; font-size: 12px; letter-spacing: .10em;
  color: var(--a-accent); text-transform: none;
}
.a-side-nav a { font-size: 14px; min-height: 40px; line-height: 40px; }
.a-nav-inner .a-tag { white-space: nowrap; }


/* ================================================================
   H5 / 移动端整体重构：顶部菜单固定不再换行挤压，控制台侧栏变横滑胶囊
   ================================================================ */
.a-chip {
  display: inline-flex; align-items: baseline; gap: 6px; padding: 7px 12px;
  border: 1px solid var(--a-line); border-radius: 999px; font-size: 13px;
  color: var(--a-text-dim); background: rgba(15, 23, 42, .55);
}
.a-chip b { color: var(--a-text); font-size: 15px; }
.a-stat-strip { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0 18px; }
.a-field-label { display: block; font-size: 13px; color: var(--a-text-dim); margin-bottom: 6px; }
.a-inline-btns { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.a-pager { margin-top: 14px; justify-content: flex-start; }
.a-filter-row { margin-bottom: 6px; }
.a-mini { min-height: 36px; padding: 6px 10px; font-size: 13px; border-radius: 8px; }
select.a-mini { min-width: 118px; }
.a-actions-cell { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; min-width: 320px; }

@media (max-width: 720px) {
  body { font-size: 15px; line-height: 1.68; }
  .a-container { padding: 0 12px; }
  .a-row { margin: 0 -6px; }
  .a-col { padding: 0 6px; }

  /* 顶部永远只有一行：品牌 + 语言 + 汉堡；菜单从右侧滑出 */
  /* 关键：backdrop-filter 会把 fixed 子元素的包含块锁在顶栏里，手机端必须关掉，
     否则抽屉只会弹出顶栏那么高。 */
  .a-nav { backdrop-filter: none; -webkit-backdrop-filter: none; background: rgba(5, 7, 13, .98); }
  .a-nav-inner { min-height: 56px; flex-wrap: nowrap; gap: 8px; }
  .a-brand-text .a-brand-main { font-size: 14px; letter-spacing: .10em; }
  .a-brand-text .a-brand-sub { font-size: 9px; letter-spacing: .18em; }

  .a-burger {
    display: inline-flex; align-items: center; justify-content: center;
    width: 42px; height: 42px; padding: 0; cursor: pointer;
    background: rgba(15, 23, 42, .6); border: 1px solid var(--a-line);
    border-radius: 11px;
  }
  .a-burger span { display: block; width: 18px; }
  .a-burger i {
    display: block; height: 2px; border-radius: 2px; background: var(--a-accent);
    margin: 3px 0;
  }
  .a-burger i:nth-child(2) { width: 72%; }
  .a-burger:active { border-color: var(--a-line-strong); }

  /* × I1：抽屉改从【左侧】滑出（老板要求；原来是右侧）。 */
  .a-nav-links {
    position: fixed; top: 0; left: 0; bottom: 0;
    width: min(84vw, 330px); margin: 0; padding: 16px 16px 26px;
    display: flex; flex-direction: column; align-items: stretch; gap: 2px;
    overflow-y: auto; z-index: 60;
    background: linear-gradient(180deg, #0B1220 0%, #05070D 100%);
    border-right: 1px solid var(--a-line-strong);
    box-shadow: 24px 0 48px rgba(0, 0, 0, .6);
    transform: translateX(-103%);
    transition: transform .26s cubic-bezier(.22, .61, .36, 1);
    visibility: hidden;
  }
  .a-nav-links.is-open { transform: translateX(0); visibility: visible; }
  /* × I1：抽屉里的分组小标题（电脑端是 display:none，见上面基础样式）。 */
  .a-nav-group {
    display: block; padding: 14px 12px 4px; font-size: 11px; font-weight: 700;
    letter-spacing: .18em; color: var(--a-accent); opacity: .92;
  }
  .a-nav-group + a { border-top: 0; }
  .a-nav-panel-head {
    display: flex; align-items: center; justify-content: space-between;
    padding-bottom: 12px; margin-bottom: 8px; border-bottom: 1px solid var(--a-line);
  }
  .a-panel-brand { font-size: 13px; letter-spacing: .18em; color: var(--a-accent); }
  .a-panel-close {
    width: 36px; height: 36px; font-size: 22px; line-height: 1; cursor: pointer;
    background: transparent; border: 1px solid var(--a-line); border-radius: 10px;
    color: var(--a-text-dim);
  }
  .a-nav-links a, .a-nav-links .a-btn {
    min-height: 48px; line-height: 48px; padding: 0 12px; font-size: 15px;
    text-align: left; justify-content: flex-start; white-space: nowrap;
    border: 0; border-bottom: 1px solid rgba(56, 189, 248, .10);
    border-radius: 8px; background: transparent;
  }
  .a-nav-links a[aria-current="page"] { color: var(--a-accent); background: rgba(34, 211, 238, .09); }
  .a-lang-row { display: flex; margin-top: 12px; justify-content: center; }

  .a-nav-scrim {
    display: block; position: fixed; inset: 0; z-index: 55;
    background: rgba(2, 4, 10, .62); backdrop-filter: blur(2px);
  }
  .a-nav-scrim[hidden] { display: none; }
  body.a-nav-locked { overflow: hidden; }

  /* 首屏与正文排版 */
  .a-hero { padding: 24px 0 12px; }
  .a-eyebrow { font-size: 11px; padding: 4px 12px; margin-bottom: 14px; }
  .a-slogan { font-size: clamp(20px, 7vw, 28px); line-height: 1.46; margin-bottom: 14px; }
  .a-hero-note { font-size: 14px; margin-bottom: 18px; }
  .a-section { padding: 20px 0; }
  .a-section h2 { font-size: 19px; }
  .a-section .a-sub { font-size: 13px; margin-bottom: 14px; }
  .a-card { padding: 14px; border-radius: 12px; }
  .a-card h3 { font-size: 16px; }
  .a-actions { gap: 10px; }
  .a-actions .a-btn { flex: 1 1 100%; }
  .a-stat .a-num { font-size: clamp(19px, 7.5vw, 25px); }
  .a-stat .a-lab { font-size: 12px; }
  .a-notice { font-size: 13px; padding: 12px 13px; }
  .a-reflect { font-size: 13.5px; padding-left: 11px; }

  /* 表格：横向滑动，不再挤成一团 */
  .a-table-wrap { -webkit-overflow-scrolling: touch; }
  .a-table { font-size: 13px; min-width: 640px; }
  .a-table th, .a-table td { padding: 8px 7px; white-space: nowrap; }
  .a-actions-cell { min-width: 300px; }

  /* 控制台：侧栏变横滑胶囊，主区占满 */
  .a-console { grid-template-columns: 1fr; gap: 12px; padding: 14px 0 28px; }
  .a-side { padding: 12px; }
  .a-side-member { margin-bottom: 10px; font-size: 12px; }
  /* 会员控制台只有 3 个入口：做成等宽分段，一眼看全，不用滑动 */
  .a-side-nav { flex-direction: row; overflow: visible; gap: 6px; padding-bottom: 0; }
  .a-side-nav a {
    flex: 1 1 0; min-width: 0; min-height: 40px; line-height: 40px; padding: 0 8px;
    border: 1px solid var(--a-line); white-space: nowrap; font-size: 13px;
    text-align: center; border-radius: 10px; background: rgba(15, 23, 42, .5);
  }
  .a-side-nav a[aria-current="page"] { border-color: var(--a-line-strong); }
  .a-side-group { margin: 12px 0 4px; }
  .a-side-foot { margin-top: 12px; }
  .a-side-foot .a-btn { min-height: 38px; }

  .a-tabs { gap: 8px; }
  .a-tabs .a-btn { flex: 1 1 auto; min-height: 40px; padding: 8px 12px; font-size: 13px; }
  .a-stat-strip { gap: 6px; margin: 12px 0 14px; }
  .a-chip { font-size: 12px; padding: 6px 10px; }
  .a-chip b { font-size: 14px; }
  .a-mini { min-height: 34px; font-size: 12px; }
  select.a-mini { min-width: 100px; }
  .a-modal-box { padding: 18px; }
  .a-lang { padding: 6px 10px; font-size: 12px; }
}

@media (max-width: 420px) {
  .a-brand-text .a-brand-sub { display: none; }
  .a-slogan { font-size: 19px; }
  .a-table { min-width: 560px; }
}

/* 手机端头部：隐藏长标签，按钮不换行，避免挤成两行 */
@media (max-width: 720px) {
  .a-nav-inner .a-tag { display: none; }
  .a-nav-inner .a-btn { white-space: nowrap; }
  .a-brand { min-width: 0; }
  .a-brand-text { min-width: 0; }
  .a-brand-text .a-brand-main { white-space: nowrap; }
}

/* 订阅方案卡与会员专属锁定卡 */
.a-plan { display: flex; flex-direction: column; gap: 10px; }
.a-plan h3 { margin: 0; }
.a-plan-price { display: flex; align-items: baseline; gap: 8px; margin: 0; }
.a-plan-price b { font-size: 32px; color: var(--a-accent); letter-spacing: .01em; }
.a-plan-price span { font-size: 14px; color: var(--a-text-dim); }
.a-plan .a-list { flex: 1 1 auto; }
.a-locked { border-style: dashed; border-color: var(--a-line-strong); text-align: left; }
.a-lock-icon { font-size: 24px; margin: 0 0 8px; }

@media (max-width: 720px) {
  .a-plan-price b { font-size: 26px; }
  .a-locked .a-inline-btns .a-btn { flex: 1 1 100%; }
}

/* ================================================================
   阶段 6.6-ALPHA：前端视觉升级层（加密判官 · 设计元素）
   只追加样式，不改动任何既有选择器的行为。
   ================================================================ */

/* —— 首屏：网格底纹 + 光晕 + 渐变标题 —— */
.a-hero-rich { position: relative; overflow: hidden; padding: 64px 0 40px; }
.a-hero-mesh {
  position: absolute; inset: 0; pointer-events: none; opacity: .5;
  background-image:
    linear-gradient(rgba(56,189,248,.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(56,189,248,.06) 1px, transparent 1px);
  background-size: 46px 46px;
  mask-image: radial-gradient(120% 80% at 50% 0%, #000 30%, transparent 78%);
  -webkit-mask-image: radial-gradient(120% 80% at 50% 0%, #000 30%, transparent 78%);
}
.a-hero-inner { position: relative; z-index: 1; }
.a-grad {
  background: linear-gradient(100deg, var(--a-accent), var(--a-accent-2) 55%, #f2c14e);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.a-hero-status {
  display: inline-flex; align-items: center; gap: 8px; margin: 0 0 20px;
  padding: 7px 14px; border: 1px solid var(--a-line); border-radius: 999px;
  font-size: 13px; color: var(--a-text-dim); background: rgba(2,6,23,.55);
}
.a-status-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--a-text-dim); }
.a-status-dot.is-live { background: var(--a-ok); box-shadow: 0 0 0 4px rgba(52,211,153,.16); }
.a-status-dot.is-warn { background: var(--a-warn); box-shadow: 0 0 0 4px rgba(245,158,11,.16); }

/* —— 区块标题：编号 + 竖线 —— */
.a-sec-head { display: flex; gap: 16px; align-items: flex-start; margin-bottom: 22px; }
.a-sec-index {
  font-family: ui-monospace, Consolas, monospace; font-size: 13px; letter-spacing: .16em;
  color: var(--a-accent); border: 1px solid var(--a-line-strong); border-radius: 8px;
  padding: 5px 9px; flex: 0 0 auto; margin-top: 3px;
}
.a-sec-head h2 { margin: 0 0 6px; }
.a-sec-head .a-sub { margin: 0; }

/* —— 指标卡：图标 + 顶部光条 —— */
.a-stat-card { position: relative; overflow: hidden; padding-top: 22px; }
.a-stat-card::before {
  content: ""; position: absolute; left: 0; right: 0; top: 0; height: 2px;
  background: linear-gradient(90deg, var(--a-accent), rgba(242,193,78,.55), transparent);
}
.a-stat-icon {
  position: absolute; right: 16px; top: 16px; width: 34px; height: 34px;
  display: grid; place-items: center; border-radius: 10px; font-size: 15px;
  color: var(--a-accent); background: rgba(34,211,238,.10);
  border: 1px solid var(--a-line);
}

/* —— 会员专属锁定卡 —— */
.a-locked-strong { display: flex; gap: 20px; align-items: center; border-style: dashed; }
.a-lock-badge { position: relative; flex: 0 0 auto; width: 64px; height: 64px; display: grid; place-items: center; }
.a-lock-ring {
  position: absolute; inset: 0; border-radius: 50%;
  border: 1px solid var(--a-line-strong); animation: a-pulse 2.6s ease-in-out infinite;
}
@keyframes a-pulse {
  0%, 100% { transform: scale(1); opacity: .9; }
  50% { transform: scale(1.08); opacity: .45; }
}
.a-lock-glyph { font-size: 26px; }
.a-lock-body { flex: 1 1 auto; }
.a-lock-body > p { margin: 0 0 14px; }

/* —— 四宫格卖点 —— */
.a-feature { display: flex; gap: 14px; align-items: flex-start; }
.a-feature-icon {
  flex: 0 0 auto; width: 40px; height: 40px; display: grid; place-items: center;
  border-radius: 12px; font-size: 17px; color: var(--a-accent);
  background: linear-gradient(140deg, rgba(34,211,238,.16), rgba(242,193,78,.10));
  border: 1px solid var(--a-line);
}
.a-feature h3 { margin: 0 0 6px; font-size: 16px; }
.a-feature p { margin: 0; }

/* —— 三步流程 —— */
.a-steps { display: grid; gap: 14px; grid-template-columns: 1fr; margin-bottom: 20px; }
@media (min-width: 768px) { .a-steps { grid-template-columns: repeat(3, 1fr); } }
.a-step {
  position: relative; padding: 20px 18px 18px; border-radius: var(--a-radius);
  border: 1px solid var(--a-line); background: var(--a-panel);
}
.a-step-no {
  display: inline-grid; place-items: center; width: 30px; height: 30px; border-radius: 50%;
  font-size: 13px; font-weight: 700; color: #04121a; margin-bottom: 12px;
  background: linear-gradient(140deg, var(--a-accent), var(--a-accent-2));
}
.a-step h3 { margin: 0 0 6px; font-size: 15px; }
.a-step p { margin: 0; font-size: 13px; color: var(--a-text-dim); }
.a-actions-center { justify-content: flex-start; margin-top: 4px; }

/* —— 反思引用卡 —— */
.a-quote { position: relative; padding-left: 34px; }
.a-quote-mark {
  position: absolute; left: 10px; top: 6px; font-size: 40px; line-height: 1;
  color: rgba(34,211,238,.28); font-family: Georgia, serif;
}

/* —— 页脚升级为多栏 —— */
.a-footer { margin-top: 48px; }
.a-footer-grid { display: grid; gap: 22px; grid-template-columns: 1fr; padding-bottom: 18px; }
@media (min-width: 768px) { .a-footer-grid { grid-template-columns: 1.4fr 1fr 1fr; } }
.a-footer h4 { margin: 0 0 10px; font-size: 13px; letter-spacing: .14em; color: var(--a-accent); }
.a-footer ul { list-style: none; margin: 0; padding: 0; }
.a-footer li { margin-bottom: 7px; font-size: 13px; }
.a-footer a { color: var(--a-text-dim); text-decoration: none; }
.a-footer a:hover { color: var(--a-accent); }
.a-footer-bottom {
  border-top: 1px solid var(--a-line); padding-top: 14px; font-size: 12px; color: var(--a-text-dim);
}

/* —— 订阅卡：推荐角标 + 勾选清单 —— */
.a-plan { position: relative; }
.a-plan.is-recommended { border-color: var(--a-line-strong); box-shadow: 0 18px 40px rgba(0,0,0,.4); }
.a-plan-flag {
  position: absolute; top: -11px; right: 16px; font-size: 11px; letter-spacing: .1em;
  padding: 4px 10px; border-radius: 999px; color: #04121a; font-weight: 700;
  background: linear-gradient(120deg, var(--a-accent), #f2c14e);
}
.a-plan .a-list li { padding-left: 24px; position: relative; }
.a-plan .a-list li::before {
  content: "✓"; position: absolute; left: 0; top: 11px; font-size: 12px; color: var(--a-ok);
}

/* —— 控制台顶部会员卡 —— */
.a-me-card {
  display: flex; flex-wrap: wrap; gap: 18px; align-items: center;
  padding: 18px; border-radius: var(--a-radius);
  border: 1px solid var(--a-line); margin-bottom: 18px;
  background: linear-gradient(140deg, rgba(34,211,238,.10), rgba(15,23,42,.75));
}
.a-me-avatar {
  width: 54px; height: 54px; border-radius: 16px; display: grid; place-items: center;
  font-size: 20px; font-weight: 700; color: #04121a;
  background: linear-gradient(140deg, var(--a-accent), #f2c14e);
}
.a-me-meta { flex: 1 1 220px; min-width: 0; }
.a-me-meta h3 { margin: 0 0 4px; font-size: 17px; }
.a-me-meta p { margin: 0; font-size: 13px; color: var(--a-text-dim); }
.a-badge {
  display: inline-block; font-size: 12px; padding: 3px 10px; border-radius: 999px;
  border: 1px solid var(--a-line); color: var(--a-text-dim);
}
.a-badge.is-ok { color: var(--a-ok); border-color: rgba(52,211,153,.45); background: rgba(52,211,153,.10); }
.a-badge.is-warn { color: var(--a-warn); border-color: rgba(245,158,11,.45); background: rgba(245,158,11,.10); }
.a-badge.is-danger { color: var(--a-danger); border-color: rgba(244,63,94,.45); background: rgba(244,63,94,.10); }
.a-me-bar { flex: 1 1 100%; height: 6px; border-radius: 6px; background: rgba(56,189,248,.14); overflow: hidden; }
.a-me-bar span { display: block; height: 100%; border-radius: 6px;
  background: linear-gradient(90deg, var(--a-accent), #f2c14e); }

/* —— 手机端适配 —— */
@media (max-width: 720px) {
  .a-hero-rich { padding: 30px 0 20px; }
  .a-hero-mesh { background-size: 34px 34px; }
  .a-sec-head { gap: 11px; margin-bottom: 16px; }
  .a-sec-index { font-size: 11px; padding: 4px 7px; }
  .a-locked-strong { flex-direction: column; align-items: flex-start; gap: 14px; }
  .a-lock-badge { width: 52px; height: 52px; }
  .a-feature { gap: 12px; }
  .a-feature-icon { width: 36px; height: 36px; }
  .a-step { padding: 16px 14px; }
  .a-quote { padding-left: 28px; }
  .a-me-card { padding: 14px; gap: 12px; }
  .a-me-avatar { width: 46px; height: 46px; border-radius: 14px; font-size: 17px; }
  .a-plan-flag { right: 12px; }
}
.a-brand-footer { margin-bottom: 10px; }
/* 会员进度条：用 class 控制宽度，避免内联样式被内容安全策略拦截 */
.a-me-bar span.is-0 { width: 0; }
.a-me-bar span.is-25 { width: 25%; }
.a-me-bar span.is-50 { width: 50%; }
.a-me-bar span.is-75 { width: 75%; }
.a-me-bar span.is-100 { width: 100%; }

/* —— 登录 / 注册：品牌侧栏 + 表单卡 —— */
.a-auth { display: grid; gap: 22px; grid-template-columns: 1fr; padding: 34px 0 40px; }
@media (min-width: 900px) { .a-auth { grid-template-columns: 1.05fr 1fr; gap: 40px; align-items: start; } }
.a-auth-aside { position: relative; }
.a-auth-aside h2 { font-size: clamp(22px, 4.2vw, 30px); margin: 14px 0 10px; }
.a-auth-aside .a-sub { margin-bottom: 18px; }
.a-trust { list-style: none; margin: 0; padding: 0; }
.a-trust li { padding: 9px 0 9px 26px; position: relative; font-size: 14px; color: var(--a-text-dim);
  border-bottom: 1px solid rgba(56,189,248,.10); }
.a-trust li:last-child { border-bottom: 0; }
.a-trust li::before { content: "✓"; position: absolute; left: 0; top: 9px; color: var(--a-ok); font-size: 13px; }
.a-auth-panel {
  padding: 22px; border-radius: var(--a-radius); border: 1px solid var(--a-line);
  background: var(--a-panel); backdrop-filter: blur(6px);
}
.a-auth-panel .a-field:last-of-type { margin-bottom: 18px; }
.a-form-row { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
@media (max-width: 720px) {
  .a-auth { padding: 18px 0 26px; gap: 18px; }
  .a-auth-panel { padding: 16px; border-radius: 14px; }
  .a-form-row .a-btn { flex: 1 1 100%; }
}

/* ---------------- 总控台侧边栏：图标 + 移动端抽屉 ---------------- */
.a-ico { display: inline-block; width: 20px; margin-right: 8px; text-align: center;
  color: var(--a-text-dim); font-size: 13px; }
.a-side-nav a:hover .a-ico, .a-side-nav a[aria-current="page"] .a-ico { color: var(--a-accent); }

.a-side-toggle { display: none; }

@media (max-width: 991px) {
  .a-side-toggle {
    display: inline-flex; align-items: center; justify-content: center;
    width: 100%; min-height: 44px; cursor: pointer;
    border: 1px solid var(--a-line-strong); border-radius: 10px;
    background: var(--a-panel); color: var(--a-text); font-size: 15px;
  }
  .a-side-body { display: none; margin-top: 12px; }
  .a-side.is-open .a-side-body { display: block; }
  .a-side-nav { flex-direction: column; overflow: visible; }
  .a-side-nav a { width: 100%; min-height: 44px; line-height: 44px; }
}

/* ---------------- 老后台外壳：与「唯一总控台」同款 ---------------- */
.a-admin-top { position: sticky; top: 0; z-index: 20; }
.a-admin-status { display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
  font-size: 12px; color: var(--a-text-dim); }
.a-admin-status .a-strip { display: inline-flex; align-items: center; gap: 6px; }
.a-admin-status .a-mode { color: var(--a-accent); font-weight: 500;
  border-left: 1px solid var(--a-line); padding-left: 14px; }
.a-admin-user { color: var(--a-text); }
.a-side-entry { display: flex; align-items: center; gap: 6px;
  min-height: 46px; padding: 0 12px; margin: 0 0 12px;
  border: 1px solid var(--a-line-strong); border-radius: 10px;
  background: rgba(34, 211, 238, .10); color: var(--a-accent);
  text-decoration: none; font-size: 15px; font-weight: 600; }
.a-side-entry:hover { background: rgba(34, 211, 238, .18); }

/* 仪表盘右上角的「进入唯一总控台」：显眼，但不做第二套导航。 */
.console-entry { box-shadow: 0 0 0 3px rgba(34, 211, 238, .16); font-weight: 700; }

/* 老外壳沿用 .sidebar / .nav-list 类名（页面脚本与回归测试依赖），
   但布局改由 alpha_site.css 接管：不再用 dark.css 的固定定位。 */
.a-side.sidebar { position: static; inset: auto; width: auto;
  border-right: 0; z-index: auto; display: block; }
.a-side-nav.nav-list { margin-top: 0; }

/* ---------------- 密码框「小眼睛」 ---------------- */
.a-input-eye { position: relative; display: block; }
.a-input-eye .a-input { padding-right: 46px; }
.a-eye { position: absolute; top: 50%; right: 6px; transform: translateY(-50%);
  width: 34px; height: 34px; display: grid; place-items: center; cursor: pointer;
  border: 1px solid transparent; border-radius: 8px; background: transparent;
  color: var(--a-text-dim); font-size: 15px; line-height: 1; }
.a-eye:hover { border-color: var(--a-line); color: var(--a-text); }
.a-eye.is-on { color: var(--a-accent); border-color: var(--a-line-strong); }
.a-nav-logout { margin-top: 6px; }

/* --------------------------------------------------------------------------
   6124 首页轮播：横向可滑动的卡片带（纯 CSS，无 JS；窄屏自动变成一列）
   -------------------------------------------------------------------------- */
.a-carousel {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(280px, 1fr);
  gap: 16px;
  overflow-x: auto;
  scroll-snap-type: x proximity;
  padding: 2px 2px 10px;
}
.a-carousel > * { scroll-snap-align: start; }
.a-carousel-card {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--radius);
}
.a-carousel-card img { display: block; width: 100%; height: 168px; object-fit: cover; }
.a-carousel-body { padding: 14px 16px; }
.a-carousel-body h3 { font-size: 16px; margin-bottom: 6px; }
.a-carousel-body p { color: var(--muted); font-size: 13px; }
@media (min-width: 901px) {
  .a-carousel { grid-auto-columns: minmax(340px, 1fr); }
}

/* --------------------------------------------------------------------------
   G7 访问统计：纯 CSS 柱状趋势（不引外部图表库、不用内联 style）
   -------------------------------------------------------------------------- */
.a-spark { display: flex; align-items: flex-end; gap: 4px; height: 72px; padding: 4px 2px;
           border-bottom: 1px solid var(--border); overflow-x: auto; }
.a-spark-col { display: flex; flex-direction: column; align-items: center; gap: 4px; min-width: 22px; }
.a-spark-bar { width: 12px; background: var(--cyan); border-radius: 3px 3px 0 0; }
.a-spark-lab { font-size: 10px; color: var(--muted); white-space: nowrap; }
.lvl-0 { height: 2px; }
.lvl-1 { height: 6px; }
.lvl-2 { height: 12px; }
.lvl-3 { height: 18px; }
.lvl-4 { height: 24px; }
.lvl-5 { height: 30px; }
.lvl-6 { height: 36px; }
.lvl-7 { height: 42px; }
.lvl-8 { height: 48px; }
.lvl-9 { height: 54px; }
.lvl-10 { height: 60px; }


/* ★ 任务 4：新闻配图样式（.a-thumb / .a-hero-img 原来根本没定义，封面图才会巨大）。 */
.a-thumb {
  display: block;
  width: 100%;
  height: 180px;
  object-fit: cover;
  border-radius: 10px;
  margin-bottom: var(--a-s3);
}
.a-hero-img {
  display: block;
  width: 100%;
  max-height: 320px;
  object-fit: cover;
  border-radius: 14px;
  margin: var(--a-s4) 0;
}
.a-article-body figure {
  margin: var(--a-s4) 0;
  text-align: center;
}
.a-article-body figure img {
  display: block;
  max-width: min(100%, 760px);
  height: auto;
  border-radius: 12px;
  margin: 0 auto;
}

/* ★ 任务 C：新闻大厅【列表卡片式】——
   原来卡片是单列全宽（.a-col 默认 100%），封面图被拉成一条宽幅，看着很大也很怪。
   现在改成：图在左、文字在右，图固定成一张自然比例的缩略图；窄屏自动堆叠。 */
.a-news-card {
  display: flex;
  flex-wrap: wrap;
  gap: var(--a-s4);
  align-items: flex-start;
}
.a-news-card .a-thumb {
  flex: 0 0 240px;
  width: 240px;
  height: 150px;
  margin: 0;
  border-radius: 12px;
}
.a-news-card .a-news-main { flex: 1 1 260px; min-width: 0; }
.a-news-card .a-news-main h2 { margin: var(--a-s2) 0; }
@media (max-width: 640px) {
  .a-news-card .a-thumb { flex: 1 1 100%; width: 100%; height: 190px; }
}
/* ══════════════════════════════════════════════════════════════════
   文档三 B 块：前台 5 个"活"模块（行情条 / 资金曲线 / 逐笔战报 / 持仓 / 今日状态）
   配色、圆角、间距一律走上面的设计系统变量，中英两版共用同一套。
   ══════════════════════════════════════════════════════════════════ */

/* 行情涨跌：涨绿跌红。和"敢晒回撤"的红不是一回事，这里纯粹是涨跌。 */
.is-up { color: var(--a-ok); }
.is-down { color: var(--a-danger); }
.is-flat { color: var(--a-text-mute); }

/* ── B1 顶部行情条（本轮升级：自动滚动 / 吸顶 / 更新时间）────────────────
   滚动用现代 CSS @keyframes + 内容复制一份做无缝衔接（不用已废弃的 <marquee>）。
   桌面：自动滚动 + 跟随菜单吸顶；手机：关掉动画、保留手动横滑。
   —— 自动滚动和手滑同时跑会互相打架，所以在手机端只留手滑。 */
:root { --a-nav-h: 61px; }   /* 菜单实际高度：60px 内容 + 1px 底边 */

.a-ticker { border-bottom: 1px solid var(--a-line); background: rgba(5, 7, 13, .72); }
.a-ticker-inner { display: flex; align-items: center; gap: 12px; }
.a-ticker-viewport { flex: 1 1 auto; min-width: 0; overflow: hidden; }
.a-ticker-track {
  display: flex; width: max-content; padding: 8px 0; white-space: nowrap;
  will-change: transform;
  animation: a-ticker-scroll 45s linear infinite;
}
/* 间距用 margin-right 而不是 flex gap：这样"复制一份"的宽度与原内容严格相等，
   translateX(-50%) 刚好走完一轮，接缝处不会跳一下。 */
.a-tick {
  display: inline-flex; align-items: baseline; gap: 6px; flex: none;
  font-size: 12px; margin-right: 18px;
}
.a-tick-code { color: var(--a-text); font-weight: 700; letter-spacing: .04em; }
.a-tick-price { color: var(--a-text-dim); font-family: var(--a-font-mono); }
.a-tick-chg { font-family: var(--a-font-mono); }
.a-ticker-clone { display: inline-flex; }
.a-ticker-updated {
  flex: none; font-size: 10px; color: var(--a-text-mute);
  font-family: var(--a-font-mono); white-space: nowrap;
}

/* D2 一轮 45 秒：慢到看得清，不是飞快掠过 */
@keyframes a-ticker-scroll {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

/* D3 鼠标悬停时暂停，方便访客看清某个币的价；移开继续 */
.a-ticker:hover .a-ticker-track,
.a-ticker:focus-within .a-ticker-track { animation-play-state: paused; }

/* D5 系统设置"减少动态效果"时【完全停止】滚动，并把手动横滑还回去 */
@media (prefers-reduced-motion: reduce) {
  .a-ticker-track { animation: none; }
  .a-ticker-viewport {
    overflow-x: auto; scrollbar-width: none; -ms-overflow-style: none;
  }
  .a-ticker-viewport::-webkit-scrollbar { display: none; }
}

/* 追加任务二：桌面端行情条跟菜单一起吸顶。
   top 对齐菜单实际高度；z-index 15【低于】菜单的 20，
   所以右上角语言下拉菜单（菜单内的层）永远盖得住行情条。 */
@media (min-width: 721px) {
  .a-ticker {
    position: sticky; top: var(--a-nav-h); z-index: 15;
    backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
  }
}

/* 追加任务二 + D4：手机端不吸顶（省高度），随页面滚走；关掉动画保留手动横滑 */
@media (max-width: 720px) {
  .a-ticker { position: static; }
  .a-ticker-track { animation: none; }
  .a-ticker-viewport {
    overflow-x: auto; -webkit-overflow-scrolling: touch;
    scrollbar-width: none; -ms-overflow-style: none;
  }
  .a-ticker-viewport::-webkit-scrollbar { display: none; }
  .a-tick { font-size: 11px; margin-right: 14px; }
  .a-ticker-updated { font-size: 10px; }
}

/* ── C 块：打码情报卡 ────────────────────────────────────────────── */
.a-intel-grid {
  display: grid; gap: var(--a-s3);
  grid-template-columns: repeat(auto-fill, minmax(232px, 1fr));
}
.a-intel-card {
  border: 1px solid var(--a-line); border-radius: var(--a-radius);
  background: var(--a-panel); padding: var(--a-s3);
  display: flex; flex-direction: column; gap: 8px;
}
.a-intel-head { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.a-intel-code { color: var(--a-text); font-size: var(--a-fs-h5); letter-spacing: .04em; }
.a-intel-dir { font-size: 12px; }
.a-intel-status {
  margin-left: auto; font-size: 11px; padding: 2px 8px;
  border: 1px solid var(--a-line-strong); border-radius: var(--a-r-pill);
  color: var(--a-text-dim); white-space: nowrap;
}
.a-intel-status.is-published { color: var(--a-ok); border-color: var(--a-ok); }
.a-intel-status.is-waiting { color: var(--a-warn); border-color: var(--a-warn); }
.a-intel-status.is-running { color: var(--a-accent); border-color: var(--a-accent); }
.a-intel-status.is-failed { color: var(--a-danger); border-color: var(--a-danger); }
.a-intel-time { margin: 0; }
.a-intel-conf { display: flex; align-items: center; gap: 8px; }
.a-conf {
  appearance: none; -webkit-appearance: none; flex: 1 1 auto; height: 6px;
  border: none; border-radius: 999px; overflow: hidden;
  background: rgba(34, 211, 238, .15);
}
.a-conf::-webkit-progress-bar { background: rgba(34, 211, 238, .15); }
.a-conf::-webkit-progress-value { background: var(--a-accent); }
.a-conf::-moz-progress-bar { background: var(--a-accent); }
.a-intel-locked { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.a-intel-locked li {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: 8px; font-size: 12px;
}
.a-intel-lock { color: var(--a-text-mute); font-size: 11px; white-space: nowrap; }
.a-intel-cta { margin-top: var(--a-s4); }

/* B2 资金曲线 */
.a-live-head h2 { margin: 0 0 6px; }
.a-live-equity { display: grid; gap: var(--a-s4); }
@media (min-width: 992px) {
  .a-live-equity { grid-template-columns: minmax(220px, 300px) 1fr; align-items: center; }
}
.a-live-stats { display: flex; gap: var(--a-s5); flex-wrap: wrap; }
.a-live-stat { display: flex; flex-direction: column; gap: 2px; }
.a-live-stat .a-num { font-size: clamp(20px, 4vw, 26px); }
.a-live-chart {
  border: 1px solid var(--a-line); border-radius: var(--a-radius);
  background: var(--a-panel); padding: var(--a-s3);
}
.a-spark { display: block; width: 100%; height: 120px; }
.a-spark-area { fill: rgba(34, 211, 238, .12); stroke: none; }
.a-spark-line { fill: none; stroke: var(--a-accent); stroke-width: 1.4; vector-effect: non-scaling-stroke; }

/* B3 逐笔脱敏战报 */
.a-table-wrap {
  overflow-x: auto; border: 1px solid var(--a-line);
  border-radius: var(--a-radius); background: var(--a-panel);
}
.a-live-table { min-width: 620px; }
.a-live-table th { color: var(--a-text-dim); font-weight: 600; font-size: 12px; white-space: nowrap; }
.a-live-table td { color: var(--a-text); }

/* B4 实时持仓 */
.a-live-positions { display: flex; flex-wrap: wrap; gap: var(--a-s3); }
.a-live-pos {
  display: inline-flex; align-items: baseline; gap: 8px;
  border: 1px solid var(--a-line-strong); border-radius: var(--a-r-pill);
  padding: 6px 14px; font-size: 13px;
}

/* B5 今日系统状态 */
.a-live-status {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 10px;
  font-size: var(--a-fs-h5); color: var(--a-text-dim);
}
.a-live-status b { color: var(--a-text); font-size: 1.15em; }
.a-dot { color: var(--a-line-strong); }

@media (max-width: 720px) {
  .a-spark { height: 96px; }
  .a-live-status { font-size: var(--a-fs-body); }
}

/* ── 文档三 D 块：会员权益对比页 ────────────────────────────────── */
.a-membership-table { min-width: 560px; }
.a-membership-table th {
  color: var(--a-text-dim); font-weight: 600; font-size: 12px; white-space: nowrap;
}
.a-membership-table td { color: var(--a-text); }
.a-membership-table .a-membership-cell {
  text-align: center; white-space: nowrap; font-size: 15px; width: 110px;
}
.a-compare-link { margin: 0 0 var(--a-s4); }

/* ── 文档三 E 块：信任模块 + 转化动线 ────────────────────────────── */

/* E2 模拟盘显著标识：凡是展示模拟数据的地方都挂这一条。
   左边一条强调色竖线 + 淡底色，读起来像"风险提示"，不抢正文。 */
.a-paper-note {
  margin: var(--a-s4) 0 0;
  padding: 10px 14px;
  border-left: 3px solid var(--a-warn);
  background: rgba(255, 255, 255, .03);
  color: var(--a-text-dim);
  font-size: var(--a-fs-small);
  line-height: var(--a-lh);
  border-radius: 0 var(--a-r-sm) var(--a-r-sm) 0;
}

/* E1 「我们承诺不做的事」：四条承诺卡，行首一个叉号，表示"这件事我们不干" */
.a-promise { display: flex; gap: var(--a-s3); align-items: flex-start; }
.a-promise-mark {
  flex: 0 0 auto; width: 26px; height: 26px; line-height: 26px; text-align: center;
  border-radius: 50%; font-size: 12px;
  color: var(--a-danger); border: 1px solid var(--a-danger);
  background: rgba(255, 90, 90, .08);
}
.a-promise h3 { margin: 0 0 6px; font-size: var(--a-fs-h4); color: var(--a-text); }
.a-promise p { margin: 0; color: var(--a-text-dim); font-size: var(--a-fs-body); line-height: var(--a-lh); }

/* E3 社证条：三个真数字；数字取不到时显示"取不到"，字号一样大 */
.a-proof {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--a-s3); margin: var(--a-s5) 0 var(--a-s2);
  padding: var(--a-s4); border: 1px solid var(--a-line);
  border-radius: var(--a-r); background: var(--a-panel);
}
.a-proof-item { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.a-proof-item .a-num { color: var(--a-text); font-size: 1.5em; line-height: 1.1; }
.a-proof-item .a-lab { color: var(--a-text-mute); font-size: var(--a-fs-small); }

/* E5 首页权益对比摘要（完整表在 /alpha/membership） */
.a-compare-card { height: 100%; }
.a-compare-card.is-recommended { border-color: var(--a-accent); }
.a-compare-card h3 { margin: 0 0 var(--a-s2); color: var(--a-text); }

/* E5 转化提示 */
.a-trial-hint { margin: var(--a-s3) 0 0; color: var(--a-accent); font-size: var(--a-fs-small); }

/* E4 页脚 Telegram 频道入口（后台没配 → 整块不渲染） */
.a-footer-cta { margin: var(--a-s5) 0 0; display: flex; justify-content: center; }
.a-telegram-btn { gap: 8px; }

@media (max-width: 720px) {
  .a-proof { grid-template-columns: 1fr; }
  .a-footer-cta { justify-content: flex-start; }
}

/* ── 文档三 G 块：免费体验 3 次（解锁后的价位） ───────────────────── */
.a-intel-value {
  color: var(--a-text);
  font-weight: 600;
  letter-spacing: .02em;
}
.a-intel-locked li[data-intel-field] { display: flex; justify-content: space-between; gap: var(--a-s2); }
#alpha-trial-badge { font-weight: 600; }

/* ── 文档三 G4：邮箱功能（注册两种方式 / 绑定 / 找回） ───────────── */

/* ★ 坑：.a-field / .a-card 之类都写了 display:flex，
   会把原生 [hidden] 的 display:none 顶掉，导致两个标签页的内容同时露出来。
   这一条必须放前面兜住。 */
[hidden] { display: none !important; }
.a-tabs {
  display: flex; gap: 6px; margin: 0 0 var(--a-s4);
  border-bottom: 1px solid var(--a-line); padding-bottom: 0;
}
.a-tab {
  appearance: none; border: 1px solid transparent; background: transparent;
  color: var(--a-text-dim); font: inherit; font-size: var(--a-fs-small);
  padding: 8px 14px; cursor: pointer; border-radius: var(--a-r-sm) var(--a-r-sm) 0 0;
  border-bottom: 2px solid transparent;
}
.a-tab:hover { color: var(--a-text); }
.a-tab.is-on {
  color: var(--a-accent); border-bottom-color: var(--a-accent);
  background: rgba(34, 211, 238, .06);
}
.a-input-row { display: flex; gap: 8px; align-items: center; }
.a-input-row .a-input { flex: 1 1 auto; min-width: 0; }
.a-input-row .a-btn { flex: 0 0 auto; white-space: nowrap; }
@media (max-width: 720px) {
  .a-input-row { flex-wrap: wrap; }
  .a-input-row .a-btn { width: 100%; }
}

/* ── 文档三 H 块：邀请海报 / 续费挽回 / 试用转化 ─────────────── */
.a-poster {
  display: block; width: min(100%, 360px); height: auto;
  margin: var(--a-s3) 0; border-radius: var(--a-r); border: 1px solid var(--a-line);
  background: var(--a-panel);
}
.a-expiry-keep { margin: var(--a-s2) 0 var(--a-s3); }
.a-renewal { border-color: var(--a-warn); }
.a-renewal h3 { display: flex; align-items: center; gap: var(--a-s2); flex-wrap: wrap; }
.a-gap-sm { margin-top: var(--a-s2); }