/*
 * waylog 车本全局样式 — 设计变量与基础重置（双主题令牌真源）
 * 职责：:root 颜色/间距/字号/控件尺寸变量，以及通用元素重置（*、[hidden]、html、body、滚动条、表单元素、strong、button）。
 * 主题：默认亮色（:root）；`:root[data-theme="dark"]` 为 EV 车控暗色主题（深空底、极光氛围、玻璃拟态、电光青绿）。
 * 约定：所有组件配色只允许 var() 令牌或黑色/白色透明度字面量（投影、遮罩类），禁止其他裸色值。
 */
:root {
  /* 画布与表面（亮色 = 默认） */
  --canvas: oklch(0.94 0.014 174);
  --canvas-quiet: oklch(0.89 0.022 174);
  --surface: oklch(0.996 0.004 174);
  --surface-2: oklch(0.94 0.015 92);
  /* 墨色与线 */
  --ink: oklch(0.185 0.026 178);
  --muted: oklch(0.39 0.034 178);
  --line: oklch(0.68 0.03 174);
  /* 类目与语义色 */
  --green: oklch(0.49 0.105 160);
  --blue: oklch(0.52 0.105 235);
  --amber: oklch(0.66 0.13 78);
  --olive: oklch(0.54 0.075 118);
  --mint: oklch(0.68 0.083 183);
  --cyan: oklch(0.56 0.09 205);
  --red: oklch(0.56 0.16 28);
  --navy: oklch(0.45 0.067 246);
  --gray: oklch(0.5 0.018 210);
  /* 派生表面 */
  --surface-panel: color-mix(in oklch, var(--surface), var(--canvas) 2%);
  --surface-control: color-mix(in oklch, var(--surface), var(--canvas) 68%);
  /* 玻璃与发丝线（亮色：线更隐形，层次靠卡面与落影） */
  --glass: oklch(1 0 0 / 0.78);
  --glass-strong: oklch(1 0 0 / 0.9);
  --hairline: oklch(0.3 0.03 205 / 0.07);
  --hairline-strong: oklch(0.3 0.03 205 / 0.12);
  --veil-faint: oklch(1 0 174);
  --ring-strong: oklch(1 0 0 / 0.6);
  --blur-glass: blur(18px) saturate(140%);
  /* 强调与辉光 */
  --accent: oklch(0.53 0.11 168);
  --accent-2: oklch(0.53 0.1 218);
  --accent-gradient: linear-gradient(135deg, oklch(0.85 0.16 168), oklch(0.76 0.13 208));
  --accent-contrast: oklch(0.15 0.02 240);
  --accent-soft: oklch(0.53 0.11 168 / 0.12);
  --accent-glow: 0 8px 28px oklch(0.53 0.11 168 / 0.24);
  --text-gradient: linear-gradient(118deg, oklch(0.5 0.11 172), oklch(0.46 0.12 238));
  /* 表单控件箭头（下拉） */
  --select-arrow: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='16'%20height='16'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%232a4a44'%20stroke-opacity='0.9'%20stroke-width='2.5'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='m6%209%206%206%206-6'/%3E%3C/svg%3E");
  /* 边缘与投影（亮色：带品牌色温的双层柔影，替代可见边框） */
  --soft-edge: 0 0 0 1px var(--hairline);
  --shadow:
    0 1px 2px oklch(0.4 0.04 200 / 0.05),
    0 16px 40px -16px oklch(0.4 0.05 200 / 0.22);
  --shadow-raise:
    0 2px 6px oklch(0.4 0.04 200 / 0.07),
    0 18px 36px -14px oklch(0.4 0.05 200 / 0.3);
  /* 环境氛围背景 */
  --ambient-bg:
    radial-gradient(1100px 540px at 10% -10%, oklch(0.62 0.07 178 / 0.16), transparent 62%),
    radial-gradient(920px 500px at 92% -8%, oklch(0.6 0.06 255 / 0.12), transparent 58%),
    radial-gradient(720px 420px at 50% 118%, oklch(0.6 0.05 200 / 0.08), transparent 60%),
    var(--canvas);
  /* 间距 */
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 12px;
  --space-lg: 16px;
  --space-xl: 24px;
  --space-2xl: 32px;
  --space-3xl: 48px;
  /* 字号 */
  --type-control: 0.86rem;
  --type-control-sm: 0.78rem;
  --type-control-lg: 0.94rem;
  --type-control-number: 1.08rem;
  /* 控件尺寸 */
  --control-height-sm: 34px;
  --control-height: 44px;
  --control-height-lg: 52px;
  --control-field-height: 48px;
  --control-radius: 12px;
  --radius-card: 22px;
  --radius-sheet: 26px;
  --layout-max-width: 1320px;
  color-scheme: light;
  font-family: "Avenir Next", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
}

:root[data-theme="dark"] {
  /* 画布与表面（EV 暗色） */
  --canvas: oklch(0.155 0.018 240);
  --canvas-quiet: oklch(0.125 0.016 240);
  --surface: oklch(0.215 0.022 240);
  --surface-2: oklch(0.255 0.024 240);
  /* 墨色与线 */
  --ink: oklch(0.94 0.008 180);
  --muted: oklch(0.73 0.02 210);
  --line: oklch(0.55 0.03 215);
  /* 类目与语义色（暗底增亮版） */
  --green: oklch(0.83 0.17 165);
  --blue: oklch(0.73 0.12 235);
  --amber: oklch(0.81 0.14 80);
  --olive: oklch(0.74 0.11 125);
  --mint: oklch(0.83 0.12 180);
  --cyan: oklch(0.79 0.12 205);
  --red: oklch(0.7 0.19 25);
  --navy: oklch(0.64 0.1 250);
  --gray: oklch(0.7 0.014 220);
  /* 派生表面 */
  --surface-panel: color-mix(in oklch, var(--surface), var(--canvas) 6%);
  --surface-control: color-mix(in oklch, var(--surface), var(--canvas) 55%);
  /* 玻璃与发丝线 */
  --glass: oklch(1 0 0 / 0.05);
  --glass-strong: oklch(1 0 0 / 0.08);
  --hairline: oklch(1 0 0 / 0.08);
  --hairline-strong: oklch(1 0 0 / 0.12);
  --veil-faint: oklch(1 0 0 / 0.04);
  --ring-strong: oklch(1 0 0 / 0.35);
  /* 强调与辉光 */
  --accent: oklch(0.83 0.17 165);
  --accent-2: oklch(0.79 0.12 205);
  --accent-soft: oklch(0.83 0.17 165 / 0.14);
  --accent-glow: 0 8px 28px oklch(0.83 0.17 165 / 0.32);
  --text-gradient: linear-gradient(118deg, oklch(0.96 0.04 172), oklch(0.82 0.1 205));
  /* 表单控件箭头（下拉） */
  --select-arrow: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='16'%20height='16'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23ffffff'%20stroke-opacity='0.9'%20stroke-width='2.5'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='m6%209%206%206%206-6'/%3E%3C/svg%3E");
  /* 边缘与投影 */
  --shadow: 0 18px 44px oklch(0 0 0 / 0.42);
  --shadow-raise: 0 10px 26px oklch(0 0 0 / 0.5);
  /* 环境氛围背景 */
  --ambient-bg:
    radial-gradient(1100px 540px at 10% -10%, oklch(0.5 0.1 178 / 0.2), transparent 62%),
    radial-gradient(920px 500px at 92% -8%, oklch(0.45 0.09 255 / 0.16), transparent 58%),
    radial-gradient(720px 420px at 50% 118%, oklch(0.42 0.08 200 / 0.1), transparent 60%),
    var(--canvas);
  color-scheme: dark;
}

* {
  box-sizing: border-box;
}

[hidden] {
  display: none !important;
}

html {
  min-height: 100%;
  background: var(--canvas);
  overflow-x: hidden;
}

body {
  min-height: 100vh;
  margin: 0;
  color: var(--ink);
  background: var(--ambient-bg) fixed;
  overflow-x: hidden;
}

html,
body {
  scrollbar-width: none;
  -ms-overflow-style: none;
}

html::-webkit-scrollbar,
body::-webkit-scrollbar {
  width: 0;
  height: 0;
}

button,
input,
select,
textarea {
  font: inherit;
  font-size: var(--type-control);
  line-height: 1.2;
}

strong,
input,
select,
button,
.metric small,
.category-values small,
.record-stamp,
.record-main p {
  font-variant-numeric: tabular-nums;
}

