:root {
  /* Light Theme Colors (Default) */
  --bg: #FFFFFF;
  --bg-subtle: #F6F7FC;
  --bg-tint: #E6EBFF;
  --surface: #FFFFFF;
  --ink: #0B1020;
  --text-primary: #0B1020;
  --text-secondary: #495066;
  --text-muted: #6A7288;
  --border: #E3E6F0;
  --border-strong: #C9CFE4;
  --brand: #243B8F;
  --brand-hover: #1C2E72;
  --brand-active: #152456;
  --accent: #5B7CFA;
  --accent-button: #3D5CE0;
  --result-bg: #E6EBFF;
  --result-text: #243B8F;
  --success: #0E9F6E;
  --warning: #D97706;
  --danger: #DC2626;

  /* Radius Scale */
  --radius-sm: 4px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-full: 999px;

  /* Elevation */
  --shadow-card: 0 1px 2px rgba(11, 16, 32, 0.06), 0 8px 24px rgba(11, 16, 32, 0.06);

  /* Focus Ring */
  --focus-ring: 2px solid var(--accent);
  --focus-offset: 2px;
}

[data-theme="dark"] {
  --bg: #0B1020;
  --bg-subtle: #101733;
  --bg-tint: #16204A;
  --surface: #131A38;
  --ink: #E6EBFF;
  --text-primary: #E6EBFF;
  --text-secondary: #A9B3D4;
  --text-muted: #7F89AD;
  --border: #232C52;
  --border-strong: #384575;
  --brand: #5B7CFA;
  --brand-hover: #738BFA;
  --brand-active: #8AA0FF;
  --accent: #8AA0FF;
  --accent-button: #5B7CFA;
  --result-bg: #16204A;
  --result-text: #C7D2FF;
  --success: #31C48D;
  --warning: #F59E0B;
  --danger: #F87171;

  --shadow-card: 0 1px 2px rgba(0, 0, 0, 0.3), 0 8px 24px rgba(0, 0, 0, 0.4);
}