/* MarksCalc.com — design tokens
   Palette per PRD §9. Accent is amber #F59E0B. No red-family colour anywhere. */

:root {
  color-scheme: light;

  /* surfaces */
  --bg-base: #FAFAF9;
  --bg-subtle: #F5F5F4;
  --surface-card: #FFFFFF;
  --surface-sunken: #F5F5F4;
  /* The page-top glow. Kept faint on purpose: it must read as light falling
     on the page, never as a colour band behind it. */
  --bg-glow: rgba(245, 158, 11, 0.06);

  /* borders */
  --border-subtle: #E7E5E4;
  --border-default: #D6D3D1;
  --border-strong: #A8A29E;

  /* text */
  --text-primary: #0C0C0D;
  --text-secondary: #57534E;
  --text-muted: #79716B;
  --text-on-accent: #1C1300;

  /* accent — amber */
  --accent: #F59E0B;
  --accent-hover: #D97D06;
  --accent-soft: rgba(245, 158, 11, 0.10);
  --accent-soft-border: rgba(245, 158, 11, 0.24);
  --accent-text: #B45309;

  /* type */
  --font-sans: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    "Helvetica Neue", Arial, sans-serif;
  --font-display: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    "Helvetica Neue", Arial, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas,
    "Liberation Mono", monospace;

  /* radius */
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-2xl: 20px;

  /* shadows */
  --shadow-sm: 0 1px 2px rgba(12, 12, 13, 0.05), 0 1px 3px rgba(12, 12, 13, 0.04);
  --shadow-lg: 0 12px 28px rgba(12, 12, 13, 0.10), 0 2px 6px rgba(12, 12, 13, 0.04);

  /* motion */
  --ease-standard: cubic-bezier(0.2, 0, 0, 1);
  /* Fast out, long settle. Used only where something travels a distance the
     eye can follow — bars, markers, reveals — so the motion reads as a value
     arriving rather than as an effect playing. */
  --ease-expo: cubic-bezier(0.16, 1, 0.3, 1);
  --transition-colors: color 160ms var(--ease-standard),
    background-color 160ms var(--ease-standard),
    border-color 160ms var(--ease-standard);
}

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

  --bg-base: #0B0F19;
  --bg-subtle: #1A2032;
  --surface-card: #121826;
  --surface-sunken: #0F1420;
  --bg-glow: rgba(251, 191, 36, 0.05);

  --border-subtle: #222A3B;
  --border-default: #2E3849;
  --border-strong: #414D63;

  --text-primary: #F2F4F8;
  --text-secondary: #A9B2C3;
  --text-muted: #78829A;
  --text-on-accent: #0B0F19;

  --accent: #FBBF24;
  --accent-hover: #F59E0B;
  --accent-soft: rgba(245, 158, 11, 0.14);
  --accent-soft-border: rgba(245, 158, 11, 0.30);
  --accent-text: #FBBF24;

  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.40);
  --shadow-lg: 0 12px 28px rgba(0, 0, 0, 0.45), 0 2px 6px rgba(0, 0, 0, 0.30);
}