:root {
  color-scheme: dark;

  --navy-950: #18191C;
  --navy-900: #1E2024;
  --navy-850: #212428;
  --navy-800: #26292E;
  --navy-750: #26292E;
  --navy-700: #31353B;
  --navy-600: #3B4047;
  --navy-500: #5A616B;
  --navy-400: #737A85;
  --navy-300: #8E949E;

  --gold-50: #2A2416;
  --gold-200: #A9C4EE;
  --gold-300: #8DB2EA;
  --gold-400: #4F82D2;
  --gold-500: #3F72C2;
  --gold-600: #3462A8;
  --gold-700: #284E88;

  --silver-50: #E9EAEC;
  --silver-100: #D7DADE;
  --silver-200: #C3C7CD;
  --silver-300: #9DA3AB;
  --silver-400: #5F6670;

  --red-400: #F07A72;
  --red-500: #E5484D;
  --red-700: #8E2A25;
  --amber-400: #E8B54A;
  --amber-500: #D29922;
  --amber-700: #7A5713;
  --green-400: #4FC26E;
  --green-500: #3AA55A;
  --green-700: #1F5C31;
  --blue-400: #79AEF0;
  --blue-500: #4A8FE0;
  --blue-700: #24528A;

  --bg-app: #18191C;
  --surface-1: #1E2024;
  --surface-2: #212428;
  --surface-3: #26292E;
  --surface-raised: #26292E;
  --surface-head: #212428;
  --surface-hover: #292C31;
  --surface-active: #2E3237;
  --surface-zebra: #23262A;
  --surface-overlay: rgba(0, 0, 0, .6);

  --border-subtle: #2A2D32;
  --border-default: #33373D;
  --border-strong: #454A52;
  --border-gold: #3F5F8F;

  --text-primary: #E9EAEC;
  --text-secondary: #C3C7CD;
  --text-muted: #9DA3AB;
  --text-disabled: #6B727C;
  --text-gold: var(--gold-300);
  --text-on-accent: #FFFFFF;

  --accent: #3F72C2;
  --accent-hover: #4F82D2;
  --accent-press: #3462A8;
  --accent-subtle: rgba(79, 130, 210, .16);

  --rank-gold: #E0B04A;
  --rank-gold-border: #F0C766;
  --rank-gold-fg: #1B1C1F;

  --danger: #E5484D;
  --danger-fg: #F07A72;
  --danger-subtle: rgba(229, 72, 77, .14);
  --warning: #D29922;
  --warning-fg: #E8B54A;
  --warning-subtle: rgba(210, 153, 34, .15);
  --success: #3AA55A;
  --success-fg: #4FC26E;
  --success-subtle: rgba(58, 165, 90, .14);
  --info: #4A8FE0;
  --info-fg: #79AEF0;
  --info-subtle: rgba(74, 143, 224, .15);
  --discord: #5865F2;
  --discord-hover: #6D78F5;

  --font-display: "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-sans: "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-mono: Consolas, "SFMono-Regular", "Liberation Mono", Menlo, monospace;
  --fs-2xs: 11px;
  --fs-xs: 12px;
  --fs-sm: 13px;
  --fs-md: 14px;
  --fs-lg: 15px;
  --fs-xl: 17px;
  --fs-2xl: 20px;
  --fs-3xl: 22px;
  --fs-4xl: 26px;
  --lh-tight: 1.2;
  --lh-snug: 1.3;
  --lh-body: 1.45;
  --ls-label: .04em;
  --ls-display: 0;
  --ls-tight: 0;
  --text-display: 600 var(--fs-4xl)/var(--lh-tight) var(--font-sans);
  --text-h1: 600 var(--fs-3xl)/var(--lh-tight) var(--font-sans);
  --text-h2: 600 var(--fs-2xl)/var(--lh-snug) var(--font-sans);
  --text-h3: 600 var(--fs-lg)/var(--lh-snug) var(--font-sans);
  --text-body: 400 var(--fs-md)/var(--lh-body) var(--font-sans);
  --text-small: 400 var(--fs-sm)/var(--lh-body) var(--font-sans);
  --text-label: 600 12px/1.3 var(--font-sans);
  --text-data: 400 13px/1.4 var(--font-sans);

  --radius-xs: 3px;
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 8px;
  --radius-pill: 999px;
  --control-h-sm: 28px;
  --control-h-md: 34px;
  --control-h-lg: 40px;
  --sidebar-w: 236px;
  --topbar-h: 56px;
  --content-max: none;

  --shadow-1: none;
  --shadow-2: 0 4px 14px rgba(0, 0, 0, .45);
  --shadow-3: 0 12px 34px rgba(0, 0, 0, .6);
  --glow-gold: 0 0 0 0 transparent;
  --glow-danger: 0 0 0 0 transparent;
  --focus-ring: 0 0 0 2px var(--bg-app), 0 0 0 4px #5B8BD0;
  --hairline-gold: none;
  --grid-pattern: none;
  --blur-overlay: none;
  --ease-out: ease-out;
  --ease-in-out: ease-in-out;
  --dur-fast: 100ms;
  --dur-base: 150ms;
  --dur-slow: 200ms;
}

[data-theme="light"] {
  color-scheme: light;

  --navy-950: #EDF0F4;
  --navy-900: #FFFFFF;
  --navy-850: #FFFFFF;
  --navy-800: #F5F6F8;
  --navy-750: #FFFFFF;
  --navy-700: #E3E6EA;
  --navy-600: #D6DAE0;
  --navy-500: #A7AFBA;
  --navy-400: #8A929E;
  --navy-300: #6B7380;

  --gold-50: #F7EFD9;
  --gold-200: #163E74;
  --gold-300: #1D4F91;
  --gold-400: #245CA6;
  --gold-500: #1D4F91;
  --gold-600: #173F75;
  --gold-700: #12325D;

  --silver-50: #1F2328;
  --silver-100: #2D333B;
  --silver-200: #3D444D;
  --silver-300: #59636E;
  --silver-400: #9AA3AD;

  --red-400: #B42323;
  --red-500: #C62F2F;
  --red-700: #8A1C1C;
  --amber-400: #8D5800;
  --amber-500: #C77D0A;
  --amber-700: #6E4500;
  --green-400: #1F7038;
  --green-500: #2C8A4A;
  --green-700: #17552B;
  --blue-400: #1D5AA6;
  --blue-500: #2A6BC0;
  --blue-700: #17457E;

  --bg-app: #EDF0F4;
  --surface-1: #FFFFFF;
  --surface-2: #FFFFFF;
  --surface-3: #F4F5F7;
  --surface-raised: #FFFFFF;
  --surface-head: #FFFFFF;
  --surface-hover: #F3F5F8;
  --surface-active: #E7EBF0;
  --surface-zebra: #FAFBFC;
  --surface-overlay: rgba(20, 24, 30, .45);

  --border-subtle: #E7EAEE;
  --border-default: #D9DEE5;
  --border-strong: #BAC2CC;
  --border-gold: #9DB4D6;

  --text-primary: #1F2328;
  --text-secondary: #424A53;
  --text-muted: #646D78;
  --text-disabled: #8F97A1;

  --accent: #1D4F91;
  --accent-hover: #183F76;
  --accent-press: #12325D;
  --accent-subtle: #E8EFF9;

  --rank-gold: #D9A93E;
  --rank-gold-border: #C2932B;
  --rank-gold-fg: #1F1A0B;

  --danger: #C62F2F;
  --danger-fg: #B42323;
  --danger-subtle: #FDEEEE;
  --warning: #C77D0A;
  --warning-fg: #8D5800;
  --warning-subtle: #FFF5E2;
  --success: #2C8A4A;
  --success-fg: #1F7038;
  --success-subtle: #E8F5EC;
  --info: #2A6BC0;
  --info-fg: #1D5AA6;
  --info-subtle: #E9F1FB;
  --discord-hover: #4752C4;

  --shadow-1: 0 1px 2px rgba(20, 30, 50, .06);
  --shadow-2: 0 4px 12px rgba(20, 24, 30, .14);
  --shadow-3: 0 10px 30px rgba(20, 24, 30, .28);
}