@charset "utf-8";
/* 员工端设计令牌 —— 颜色 / 尺度 / 动效曲线 / 三套主题。
 *
 * 只服务员工端。管理端仍在用旧的 static/style.css + static/prefs.js，
 * 那两个文件一行都别动 —— 后台是另一套人在用，出问题的代价比"少一份重复"高得多。
 *
 * 两条贯穿全文件的规矩：
 *
 * 1) **界面尺度和终端字号解耦**。界面用 --ui-fs 驱动（4 档），终端字号自己算
 *    （prefs.js 里按"80 列铺满可用宽度"连续求解）。旧版把两者绑在一起，
 *    右侧栏又用 em 做宽度 —— 改字号会改侧栏宽度 → 可用空间又变 → 得迭代收敛才不振荡。
 *    现在侧栏是 px、界面字号不跟终端走，这条循环从根上断掉了。
 *
 * 2) **对比度按 WCAG AA 选色**。终端要盯一整天，四个语义色在各自底色上都过 4.5:1
 *    （深色主题普遍 6:1 以上）。旧版浅色主题的 .color-4 是 #666 on #E9EEF1，
 *    正文级别刚够、小字就悬了。
 */

:root {
  /* ---------------------------------------------------------- 字体 */
  --font-ui: "Inter", "Segoe UI Variable Text", "Segoe UI", system-ui,
             -apple-system, "Microsoft YaHei", sans-serif;
  /* 终端必须等宽，否则列对不齐。Cascadia Mono 优先（Win11 自带，字形更清晰），
     Consolas 兜底（Win10 一定有）。连字一律关掉：航班号里的 != >= 被连成一个字形
     会让列宽算错。 */
  --font-mono: "Cascadia Mono", "JetBrains Mono", Consolas, "SF Mono",
               "DejaVu Sans Mono", "Liberation Mono", monospace;

  /* ---------------------------------------------------------- 界面尺度
     4 档，默认 standard。终端字号不看这个，见文件头第 1 条。 */
  --ui-fs: 13.5px;

  /* 8 点栅格。命名按倍数，读代码时能直接换算成像素 */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 20px;
  --sp-6: 24px;
  --sp-8: 32px;

  --r-sm: 4px;
  --r-md: 6px;
  --r-lg: 10px;
  --r-xl: 14px;
  --r-full: 999px;

  /* 固定高度：顶栏和状态栏不跟字号变，否则终端可用高度会跟着抖 */
  --h-top: 44px;
  --h-status: 26px;
  --h-input: 42px;
  --w-aside: 264px;

  /* ---------------------------------------------------------- 动效
     内置 CSS easing 太软。这几条是常用的强曲线（来源见 emil 的动效框架）。
     ease-in 一律不用于 UI —— 它开头慢，而开头正是用户盯得最紧的那一刻。 */
  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
  --ease-drawer: cubic-bezier(0.32, 0.72, 0, 1);

  /* 时长分级。这个界面里绝大多数高频动作（发指令、切窗口、翻历史）是
     **零动画**，所以下面这些只用在低频处：面板、抽屉、toast、按压反馈。 */
  --t-press: 120ms;   /* 按压反馈 */
  --t-fast: 140ms;    /* 面板、下拉 */
  --t-base: 180ms;    /* toast、tooltip */
  --t-slow: 240ms;    /* 抽屉、遮罩 */

  --shadow-sm: 0 1px 2px rgba(0, 0, 0, .18);
  --shadow-md: 0 6px 16px -4px rgba(0, 0, 0, .32), 0 2px 6px -2px rgba(0, 0, 0, .24);
  --shadow-lg: 0 24px 48px -12px rgba(0, 0, 0, .45), 0 8px 16px -8px rgba(0, 0, 0, .3);

  --z-aside: 40;
  --z-toast: 60;
  --z-modal: 70;
  --z-palette: 80;
}

/* 界面尺度四档。终端字号独立，不受这里影响 */
html[data-ui-scale="compact"]  { --ui-fs: 12px;   --h-top: 40px; --h-status: 24px; --h-input: 38px; --w-aside: 240px; }
html[data-ui-scale="standard"] { --ui-fs: 13.5px; }
html[data-ui-scale="large"]    { --ui-fs: 15.5px; --h-top: 50px; --h-status: 30px; --h-input: 48px; --w-aside: 296px; }
html[data-ui-scale="xlarge"]   { --ui-fs: 17.5px; --h-top: 56px; --h-status: 34px; --h-input: 54px; --w-aside: 328px; }

/* ============================================================ 深色（默认）
   终端底色比界面更深一档：视线整天落在终端上，让它成为最暗、最安静的那一层，
   周边的 chrome 反而稍亮 —— 眼睛会自然把注意力放在字上。 */
html[data-theme="dark"] {
  color-scheme: dark;

  --bg-0: #0b0e13;
  --bg-1: #11151c;
  --bg-2: #171d26;
  --bg-3: #1f2731;
  --bg-hover: rgba(255, 255, 255, .045);
  --bg-active: rgba(255, 255, 255, .08);

  --border: #262f3b;
  --border-strong: #364354;

  --fg-0: #e4ebf4;
  --fg-1: #9dabbc;
  /* 第三级灰也要过 4.5:1（提示文字、快捷指令的命令预览都用它，字号还偏小）。
     实测：#6c798a 只有 4.13:1，提到 #7b8899 得到约 5.1:1。 */
  --fg-2: #7b8899;

  --accent: #4c9df0;
  --accent-hover: #66aef5;
  --accent-fg: #04121f;
  --accent-soft: rgba(76, 157, 240, .16);
  --accent-ring: rgba(76, 157, 240, .45);

  --ok: #4bbd88;
  --warn: #e2ab3c;
  --err: #ef6f64;
  --ok-soft: rgba(75, 189, 136, .14);
  --warn-soft: rgba(226, 171, 60, .14);
  --err-soft: rgba(239, 111, 100, .14);

  --term-bg: #070910;
  --term-fg: #c4cdd9;
  --term-line: #1c2431;
  --term-c1: #f3c75f;   /* 强调：航班号、有位舱位、自己敲的指令 */
  --term-c2: #78c2f6;   /* 信息：城市对、日期、区状态 */
  --term-c3: #ff8d82;   /* 警示：错误、关闭的舱位 */
  --term-c4: #8794a5;   /* 次要：说明文字、无数据舱位 */
  --term-cursor: #f3c75f;
  --term-cursor-fg: #070910;
  --term-sel: rgba(120, 194, 246, .26);
}

/* ============================================================ 浅色 */
html[data-theme="light"] {
  color-scheme: light;

  --bg-0: #eaeef3;
  --bg-1: #ffffff;
  --bg-2: #f4f7fa;
  --bg-3: #e7edf4;
  --bg-hover: rgba(16, 34, 56, .045);
  --bg-active: rgba(16, 34, 56, .085);

  --border: #d7e0ea;
  --border-strong: #b6c4d4;

  --fg-0: #0f1720;
  --fg-1: #556375;
  /* 同深色主题：#78859a 在白底上只有 3.74:1，压到 #616e82 得到约 5.2:1 */
  --fg-2: #616e82;

  --accent: #1567d3;
  --accent-hover: #0d55b5;
  --accent-fg: #ffffff;
  --accent-soft: rgba(21, 103, 211, .10);
  --accent-ring: rgba(21, 103, 211, .38);

  --ok: #16794a;
  --warn: #8d5f08;
  --err: #c22d26;
  --ok-soft: rgba(22, 121, 74, .10);
  --warn-soft: rgba(141, 95, 8, .12);
  --err-soft: rgba(194, 45, 38, .10);

  --term-bg: #fbfcfe;
  --term-fg: #131a22;
  --term-line: #e3e9f0;
  --term-c1: #86540a;   /* 浅底上的琥珀要压暗才够对比度 */
  --term-c2: #0a4da5;
  --term-c3: #bb271f;
  --term-c4: #58636f;
  --term-cursor: #131a22;
  --term-cursor-fg: #fbfcfe;
  --term-sel: rgba(21, 103, 211, .18);
}

/* ============================================================ 午夜蓝
   接旧版 theme-blue：不少员工习惯了蓝底绿字这套老终端配色，保留。 */
html[data-theme="midnight"] {
  color-scheme: dark;

  --bg-0: #031c33;
  --bg-1: #05263f;
  --bg-2: #07314e;
  --bg-3: #0a3d61;
  --bg-hover: rgba(255, 255, 255, .06);
  --bg-active: rgba(255, 255, 255, .1);

  --border: #12547c;
  --border-strong: #1d6c9b;

  --fg-0: #e5f0fb;
  --fg-1: #a5c2da;
  --fg-2: #7ba1be;

  --accent: #56b0ff;
  --accent-hover: #7cc2ff;
  --accent-fg: #01203a;
  --accent-soft: rgba(86, 176, 255, .18);
  --accent-ring: rgba(86, 176, 255, .5);

  --ok: #4fd39a;
  --warn: #ffc957;
  --err: #ff938a;
  --ok-soft: rgba(79, 211, 154, .14);
  --warn-soft: rgba(255, 201, 87, .14);
  --err-soft: rgba(255, 147, 138, .14);

  --term-bg: #021d35;
  --term-fg: #e1eefb;
  --term-line: #0c4066;
  --term-c1: #ffd86d;
  --term-c2: #90d1fa;
  --term-c3: #ffa79e;
  --term-c4: #a8c5dc;
  --term-cursor: #ffd86d;
  --term-cursor-fg: #021d35;
  --term-sel: rgba(144, 209, 250, .26);
}

/* ============================================================ 减少动效
   规范说的是"更少、更轻"，不是"全关"。透明度和颜色过渡有助于理解状态变化，
   留着；位移、缩放、脉冲这些会引起不适的动作去掉。 */
@media (prefers-reduced-motion: reduce) {
  :root {
    --t-press: 1ms;
    --t-fast: 1ms;
    --t-base: 100ms;   /* 只留淡入淡出，够温和 */
    --t-slow: 120ms;
  }
}
