/* tokens.css v2 — Linear 风极简科技白 · 诺特兰德达人作战平台 */

:root {
  /* ============== Neutrals (cool gray, Linear 调) ============== */
  --gray-0:   #FFFFFF;
  --gray-25:  #FCFCFD;
  --gray-50:  #F9FAFB;
  --gray-75:  #F4F5F7;
  --gray-100: #EDEEF1;
  --gray-150: #E4E6EB;
  --gray-200: #D7D9E0;
  --gray-300: #BABDC7;
  --gray-400: #8E929F;
  --gray-500: #686B78;
  --gray-600: #4A4D58;
  --gray-700: #2E303A;
  --gray-800: #1A1C24;
  --gray-900: #0E1019;
  --gray-950: #07080F;

  /* ============== Accent: Tungsten (单一钨蓝, 0 渐变) ============== */
  --accent-50:  #EFF4FF;
  --accent-100: #DCE6FF;
  --accent-200: #B9CDFF;
  --accent-300: #8AAAFF;
  --accent-400: #5680FA;
  --accent-500: #2563EB;
  --accent-600: #1F52C7;
  --accent-700: #1A43A2;

  /* ============== Signal (仅用于数据信号) ============== */
  --positive-500: #16A34A;
  --positive-600: #15803D;
  --positive-50:  #F0FDF4;

  --warning-500:  #D97706;
  --warning-600:  #B45309;
  --warning-50:   #FFFBEB;

  --danger-500:   #DC2626;
  --danger-600:   #B91C1C;
  --danger-50:    #FEF2F2;

  /* ============== Semantic: Light (Linear 极简白) ============== */
  --bg-page:        var(--gray-0);
  --bg-soft:        var(--gray-50);
  --bg-muted:       var(--gray-75);
  --bg-surface:     var(--gray-0);
  --bg-elevated:    var(--gray-0);
  --bg-hover:       var(--gray-75);
  --bg-pressed:     var(--gray-100);

  --border-faint:   var(--gray-100);
  --border-subtle:  var(--gray-150);
  --border-default: var(--gray-200);
  --border-strong:  var(--gray-400);

  --text-primary:   var(--gray-900);
  --text-secondary: var(--gray-600);
  --text-tertiary:  var(--gray-500);
  --text-quaternary:var(--gray-400);
  --text-disabled:  var(--gray-300);
  --text-on-accent: var(--gray-0);
  --text-link:      var(--accent-600);

  --accent:         var(--accent-500);
  --accent-hover:   var(--accent-600);
  --accent-pressed: var(--accent-700);
  --accent-soft:    var(--accent-50);

  --positive:       var(--positive-500);
  --positive-soft:  var(--positive-50);
  --warning:        var(--warning-500);
  --warning-soft:   var(--warning-50);
  --danger:         var(--danger-500);
  --danger-soft:    var(--danger-50);

  --focus-ring:     var(--accent-400);

  /* ============== Type ============== */
  --font-sans:  "Inter", "HarmonyOS Sans SC", "PingFang SC", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, sans-serif;
  --font-mono:  "JetBrains Mono", "SF Mono", "Cascadia Code", "Source Han Mono SC", ui-monospace, monospace;

  --text-xs:    0.75rem;     /* 12 */
  --text-sm:    0.8125rem;   /* 13 */
  --text-base:  0.875rem;    /* 14 — body */
  --text-md:    0.9375rem;   /* 15 */
  --text-lg:    1.0625rem;   /* 17 — section title */
  --text-xl:    1.25rem;     /* 20 — card title */
  --text-2xl:   1.625rem;    /* 26 — page title */
  --text-3xl:   2rem;        /* 32 — KPI */
  --text-4xl:   2.625rem;    /* 42 — hero number */
  --text-5xl:   3.5rem;      /* 56 — landing display */

  --weight-regular:  400;
  --weight-medium:   500;
  --weight-semibold: 600;
  --weight-bold:     700;

  --leading-tight:  1.2;
  --leading-snug:   1.4;
  --leading-normal: 1.55;

  --tracking-tight: -0.02em;
  --tracking-snug:  -0.01em;
  --tracking-wide:  0.04em;
  --tracking-wider: 0.08em;

  /* ============== Space (4px grid, 留白舒展) ============== */
  --space-0:  0;
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  20px;
  --space-6:  24px;
  --space-7:  28px;
  --space-8:  32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;

  /* ============== Radii (Linear 偏好 6-8) ============== */
  --radius-xs:   3px;
  --radius-sm:   5px;
  --radius-md:   7px;
  --radius-lg:   10px;
  --radius-xl:   14px;
  --radius-pill: 999px;

  /* ============== Shadow (极淡, 仅 hover) ============== */
  --shadow-xs:   0 1px 2px rgba(14, 16, 25, 0.04);
  --shadow-sm:   0 1px 3px rgba(14, 16, 25, 0.06), 0 1px 2px rgba(14, 16, 25, 0.04);
  --shadow-md:   0 4px 12px rgba(14, 16, 25, 0.06), 0 2px 4px rgba(14, 16, 25, 0.04);
  --shadow-lg:   0 12px 32px rgba(14, 16, 25, 0.10), 0 4px 8px rgba(14, 16, 25, 0.04);
  --shadow-focus: 0 0 0 3px rgba(86, 128, 250, 0.32);

  /* ============== Motion ============== */
  --duration-instant: 80ms;
  --duration-fast:    140ms;
  --duration-normal:  200ms;
  --duration-slow:    320ms;
  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);

  /* ============== Layout ============== */
  --rail-width:    60px;
  --rail-expanded: 220px;
  --topbar-h:      52px;
  --content-max:   1440px;
}

[data-theme="dark"] {
  --bg-page:        var(--gray-950);
  --bg-soft:        var(--gray-900);
  --bg-muted:       #0B0C13;
  --bg-surface:     var(--gray-900);
  --bg-elevated:    var(--gray-800);
  --bg-hover:       var(--gray-800);
  --bg-pressed:     var(--gray-700);

  --border-faint:   #1A1C24;
  --border-subtle:  #23262F;
  --border-default: var(--gray-700);
  --border-strong:  var(--gray-500);

  --text-primary:   var(--gray-50);
  --text-secondary: var(--gray-300);
  --text-tertiary:  var(--gray-400);
  --text-quaternary:var(--gray-500);
  --text-disabled:  var(--gray-600);
  --text-link:      var(--accent-300);

  --accent:         var(--accent-400);
  --accent-hover:   var(--accent-300);
  --accent-soft:    rgba(86, 128, 250, 0.12);

  --positive:       #22C55E;
  --positive-soft:  rgba(34, 197, 94, 0.10);
  --warning:        #F59E0B;
  --warning-soft:   rgba(245, 158, 11, 0.10);
  --danger:         #EF4444;
  --danger-soft:    rgba(239, 68, 68, 0.10);

  --focus-ring:     var(--accent-300);

  --shadow-xs:   0 1px 2px rgba(0, 0, 0, 0.4);
  --shadow-sm:   0 1px 3px rgba(0, 0, 0, 0.5), 0 1px 2px rgba(0, 0, 0, 0.4);
  --shadow-md:   0 4px 12px rgba(0, 0, 0, 0.5), 0 2px 4px rgba(0, 0, 0, 0.4);
  --shadow-lg:   0 12px 32px rgba(0, 0, 0, 0.65), 0 4px 8px rgba(0, 0, 0, 0.4);
}

/* ============== Reset ============== */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; height: 100%; }
html { -webkit-text-size-adjust: 100%; }
body {
  font-family: var(--font-sans);
  font-size: var(--text-base);
  line-height: var(--leading-normal);
  color: var(--text-primary);
  background: var(--bg-page);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-feature-settings: "tnum" 1, "cv02" 1, "cv11" 1, "ss01" 1;
}
button, input, select, textarea {
  font-family: inherit;
  font-size: inherit;
  color: inherit;
}
button { background: none; border: none; cursor: pointer; padding: 0; }
a { color: inherit; text-decoration: none; }
:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
  border-radius: var(--radius-sm);
}

.num, .data { font-family: var(--font-sans); font-variant-numeric: tabular-nums; font-feature-settings: "tnum"; }
.mono { font-family: var(--font-mono); }

/* Scrollbar */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
  background: var(--border-default);
  border-radius: var(--radius-pill);
  border: 2px solid var(--bg-page);
}
::-webkit-scrollbar-thumb:hover { background: var(--gray-400); }