/* ============================================================
   ui-craft tokens — 收U管理 · Settlement Desk
   三层:primitive → semantic → component
   纪律:组件/页面代码禁止出现本文件之外的色值、字号、间距、圆角。
   ============================================================ */

:root {
  /* ---------- primitive · 色板 ---------- */
  /* 炭灰阶(表面亮度层级,不是颜色变化) */
  --ink-950: #0d1215;
  --ink-900: #101619;   /* 页面底 */
  --ink-850: #151e22;   /* 侧栏 */
  --ink-800: #192226;   /* 面板 surface */
  --ink-750: #1e2a2f;   /* raised / hover */
  --ink-700: #26343b;   /* 强 hover / 选中底 */
  /* 玉绿(唯一强调色) */
  --jade-700: #2e8f6c;
  --jade-600: #4fbb94;
  --jade-500: #80d4b3;
  --jade-300: #b9e8d6;
  --jade-100: #d7f3e7;
  --jade-ink: #102b21;
  /* 状态色(只用于状态指示,不用于装饰) */
  --gold-500: #ebc480;
  --rose-500: #ff9a9e;
  --blue-400: #6c9eff;

  /* ---------- primitive · 间距(4px 网格) ---------- */
  --s1: 4px;
  --s2: 8px;
  --s3: 12px;
  --s4: 16px;
  --s6: 24px;
  --s8: 32px;
  --s12: 48px;

  /* ---------- primitive · 圆角(全站 ≤2 种 + 胶囊) ---------- */
  --r-control: 7px;   /* 按钮/输入/表格 */
  --r-surface: 12px;  /* 卡片/浮层 */
  --r-pill: 999px;    /* 徽章/胶囊 */

  /* ---------- primitive · 字体与字阶 ---------- */
  --font-ui: "Segoe UI", "Microsoft YaHei", "PingFang SC", sans-serif;
  --font-mono: ui-monospace, "Cascadia Mono", Consolas, monospace;
  --fs-caption: 11px;  /* 表头/辅助 */
  --fs-body: 13px;     /* 表格正文 */
  --fs-base: 14px;     /* 默认正文 */
  --fs-lg: 16px;       /* 区块标题 */
  --fs-xl: 20px;       /* 页面标题 */
  --fs-display: 25px;  /* 数字大指标 */
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-strong: 650;    /* 标题/关键金额 */

  /* ---------- primitive · 阴影(仅浮层) ---------- */
  --shadow-pop: 0 8px 24px rgba(0, 0, 0, 0.45);
  --shadow-modal: 0 16px 48px rgba(0, 0, 0, 0.55);

  /* ---------- primitive · 动效(100–300ms,传达变化) ---------- */
  --ease-1: 120ms ease;
  --ease-2: 200ms ease;

  /* ---------- semantic · 表面 ---------- */
  --bg-page: var(--ink-900);
  --bg-surface: var(--ink-800);
  --bg-sidebar: var(--ink-850);
  --bg-control: #111a1e;          /* 输入框凹面 */
  --bg-raised: var(--ink-750);
  --bg-selected: var(--ink-700);

  /* ---------- semantic · 线 ---------- */
  --line-default: #2e3b41;
  --line-subtle: rgba(237, 243, 243, 0.08);
  --line-faint: rgba(237, 243, 243, 0.04);

  /* ---------- semantic · 文字 ---------- */
  --text-primary: #edf3f3;
  --text-secondary: #acb9bf;
  --text-faint: #71808a;
  --text-on-accent: var(--jade-ink);
  --text-link: var(--jade-500);

  /* ---------- semantic · 状态 ---------- */
  --status-ok: var(--jade-500);     /* 正向/成功(永远伴随文字标签) */
  --status-warn: var(--gold-500);
  --status-danger: var(--rose-500);
  --status-info: var(--blue-400);
  --status-ok-soft: rgba(128, 212, 179, 0.12);
  --status-warn-soft: rgba(235, 196, 128, 0.12);
  --status-danger-soft: rgba(255, 154, 158, 0.12);
  --status-info-soft: rgba(108, 158, 255, 0.12);

  /* ---------- semantic · 强调(用量纪律:单页可见面积 ≤5%) ---------- */
  --accent: var(--jade-500);
  --accent-strong: var(--jade-300);
  --accent-ink: var(--jade-ink);
  --accent-soft: rgba(128, 212, 179, 0.12);
  --focus-ring: rgba(128, 212, 179, 0.35);

  /* ---------- semantic · 结构 ---------- */
  --sidebar-w: 216px;
  --header-h: 56px;
  --content-gutter: var(--s6);
  --mobile-gutter: var(--s4);

  /* ---------- component ---------- */
  --btn-primary-bg: var(--accent);
  --btn-primary-fg: var(--accent-ink);
  --btn-primary-hover: var(--jade-600);
  --btn-ghost-fg: var(--text-primary);
  --btn-ghost-bg: rgba(237, 243, 243, 0.05);
  --btn-ghost-border: var(--line-default);
  --btn-danger-fg: var(--status-danger);
  --btn-danger-bg: var(--status-danger-soft);
  --btn-disabled-fg: var(--text-faint);
  --btn-disabled-bg: rgba(237, 243, 243, 0.04);

  --input-bg: var(--bg-control);
  --input-border: var(--line-default);
  --input-border-focus: var(--accent);
  --input-fg: var(--text-primary);
  --input-placeholder: var(--text-faint);

  --table-head-fg: var(--text-secondary);
  --table-row-hover: rgba(237, 243, 243, 0.03);
  --table-border: var(--line-faint);

  --badge-neutral-bg: rgba(237, 243, 243, 0.07);
  --badge-neutral-fg: var(--text-secondary);

  --nav-item-fg: var(--text-secondary);
  --nav-item-hover-bg: rgba(237, 243, 243, 0.05);
  --nav-item-active-bg: var(--accent-soft);
  --nav-item-active-fg: var(--jade-100);

  --card-border: var(--line-faint);
  --card-padding: var(--s4);

  --modal-bg: var(--bg-surface);
  --overlay-bg: rgba(5, 8, 10, 0.6);
  /* Implementation structure; these are the only literal dimensions consumed by the new shell. */
  --stroke: 1px;
  --focus-stroke: 2px;
  --focus-offset: 3px;
  --zero: 0px;
  --full: 100%;
  --viewport: 100dvh;
  --control-h: 32px;
  --touch-h: 44px;
  --icon-size: 20px;
  --icon-stroke: 1.6;
  --dot-size: 6px;
  --content-max: 1440px;
  --login-max: 400px;
  --metric-min: 160px;
  --dialog-max: 560px;
  --dialog-height: 85dvh;
  --drawer-max: 80vw;
  --drawer-w: 300px;
  --table-min: 620px;
  --skeleton-h: 14px;
  --breakpoint-mobile: 760px;
  --breakpoint-wide: 1200px;
  --lh-body: 1.6;
  --layer-sidebar: 40;
  --layer-overlay: 30;
  --layer-toast: 100;
  --motion-none: 0s;
  --text-faint: #91a0a8; /* Accessible secondary detail on the approved surface. */
}
:root { --qr-size: 280px; }
:root { --layer-sticky: 20; }

:root { --customer-columns: 2fr 1fr; --one-column: 1fr; --remark-height: 160px; }
