/* ==========================================================================
   tokens.css — Design tokens
   aiengineer.hu — Engraving × Glitch / Glitched Antiquity
   Dark mode default, light mode via [data-theme="light"]
   ========================================================================== */

:root {
  /* ---- Brief-named tokens ---- */
  --color-background-charcoal: #0c0c0e;
  --color-background-paper: #ebe6dc;
  --color-text-light: #ebe6dc;
  --color-text-dark: #161412;
  --color-text-muted: #8f8880;
  --color-accent-rust: #a8543c;
  --color-accent-blue: #6b7f96;
  --color-border-dark: rgba(235, 230, 220, 0.12);
  --color-border-light: rgba(22, 20, 18, 0.14);
  --font-display-serif: "Cormorant Garamond", "EB Garamond", Georgia, "Times New Roman", serif;
  --font-interface-mono: "IBM Plex Mono", "Share Tech Mono", "Courier New", monospace;
  --font-body-sans: "DM Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --content-max-width: 1280px;
  --transition-fast: 150ms var(--easing-editorial);
  --transition-medium: 320ms var(--easing-editorial);
  --easing-editorial: cubic-bezier(0.16, 1, 0.3, 1);

  /* spacing-scale */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;
  --space-32: 8rem;

  /* border-radius-scale — sharp system */
  --radius-none: 0;
  --radius-sm: 1px;
  --radius-md: 2px;
  --radius-lg: 3px;
  --radius-xl: 4px;
  --radius-full: 9999px; /* reserved; avoid on CTAs in this system */

  /* ---- Mapped semantic tokens (site-wide compatibility) ---- */
  --background-dark: var(--color-background-charcoal);
  --background-light: var(--color-background-paper);
  --background-red: #3d1a16;
  --bg-primary: var(--color-background-charcoal);
  --bg-secondary: #121214;
  --bg-tertiary: #1a1a1e;
  --bg-elevated: #222226;
  --bg-red: var(--background-red);
  --bg-light: var(--color-background-paper);
  --bg-red-deep: #2a1210;
  --bg-brown: #141310;
  --bg-paper: var(--color-background-paper);

  --surface-border: var(--color-border-dark);
  --surface-border-hover: rgba(235, 230, 220, 0.22);
  --surface-glow: rgba(168, 84, 60, 0.1);
  --surface-ivory: var(--color-background-paper);

  --text-primary: var(--color-text-light);
  --text-secondary: #a8a29a;
  --text-tertiary: var(--color-text-muted);
  --text-inverse: var(--color-text-dark);
  --text-primary-dark: var(--color-text-light);
  --text-primary-light: var(--color-text-dark);
  --text-on-light: var(--color-text-dark);
  --text-muted-on-light: #5e5852;
  --text-muted: var(--color-text-muted);

  --accent-primary: var(--color-accent-rust);
  --accent-hover: #c46a4e;
  --accent-muted: rgba(168, 84, 60, 0.14);
  --accent-red: var(--color-accent-rust);
  --accent-blue: var(--color-accent-blue);
  --accent-terracotta: #b86a4a;
  --accent-beige: #b8ae9e;
  --accent-gold: #a8946a;
  --accent-gradient: linear-gradient(135deg, #5c2a1e 0%, #a8543c 55%, #b86a4a 100%);

  --border-subtle: var(--color-border-dark);

  --color-success: #7a8a72;
  --color-warning: #a8946a;
  --color-error: #b85a4a;
  --color-info: var(--color-accent-blue);

  /* Chapter accents — warm engraving spectrum + faded blue */
  --chapter-1: #a8543c;
  --chapter-2: #b86a4a;
  --chapter-3: #8a5a42;
  --chapter-4: #6b7f96;
  --chapter-5: #7a6b52;
  --chapter-6: #7a8a72;
  --chapter-7: #6f7a62;
  --chapter-8: #5c7a6a;
  --chapter-9: #9a8a62;
  --chapter-10: #a8946a;
  --chapter-11: #b86a4a;
  --chapter-12: #9a3c32;
  --chapter-13: #7a3a42;
  --chapter-14: #8a5a5a;
  --chapter-15: #a8543c;
  --chapter-16: #6b7f96;
  --chapter-17: #a8946a;
  --chapter-18: #7a756e;
  --chapter-19: #8a6a5a;

  --level-alapszint: #7a8a72;
  --level-piackepes: #b86a4a;
  --level-senior: #a8543c;
  --level-platform: #a8946a;

  /* Font aliases */
  --font-display-mono: var(--font-interface-mono);
  --font-editorial-serif: var(--font-display-serif);
  --font-body: var(--font-body-sans);
  --font-sans: var(--font-body-sans);
  --font-mono: var(--font-interface-mono);
  --font-serif: var(--font-display-serif);

  /* Fluid type scale */
  --text-xs: clamp(0.7rem, 0.65rem + 0.25vw, 0.75rem);
  --text-sm: clamp(0.8rem, 0.75rem + 0.25vw, 0.875rem);
  --text-base: clamp(0.9rem, 0.85rem + 0.25vw, 1rem);
  --text-lg: clamp(1rem, 0.95rem + 0.3vw, 1.125rem);
  --text-xl: clamp(1.15rem, 1.05rem + 0.5vw, 1.25rem);
  --text-2xl: clamp(1.35rem, 1.15rem + 1vw, 1.5rem);
  --text-3xl: clamp(1.75rem, 1.35rem + 1.8vw, 2.35rem);
  --text-4xl: clamp(2.25rem, 1.6rem + 2.8vw, 3.1rem);
  --text-5xl: clamp(2.75rem, 1.9rem + 4vw, 4.5rem);
  --text-display: clamp(3rem, 1.6rem + 5.5vw, 5.75rem);

  --leading-tight: 0.98;
  --leading-snug: 1.15;
  --leading-normal: 1.6;
  --leading-relaxed: 1.75;

  --font-normal: 400;
  --font-medium: 500;
  --font-semibold: 600;
  --font-bold: 700;

  --tracking-tight: -0.035em;
  --tracking-normal: 0;
  --tracking-wide: 0.06em;
  --tracking-wider: 0.14em;
  --tracking-mono: 0.1em;

  /* Shadows — warm, no neon */
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.35);
  --shadow-md: 0 8px 24px rgba(0, 0, 0, 0.4);
  --shadow-lg: 0 18px 50px rgba(0, 0, 0, 0.5);
  --shadow-glow: 0 0 0 transparent;

  --blur-sm: blur(6px);
  --blur-md: blur(12px);
  --blur-lg: blur(24px);

  --glass-bg: rgba(12, 12, 14, 0.94);
  --glass-border: rgba(235, 230, 220, 0.1);

  --container-sm: 640px;
  --container-md: 768px;
  --container-lg: 1024px;
  --container-xl: var(--content-max-width);
  --container-content: 680px;

  --sidebar-width: 280px;
  --nav-height: 60px;

  --z-base: 1;
  --z-overlay: 10;
  --z-progress: 200;
  --z-navbar: 100;
  --z-dropdown: 110;
  --z-grain: 90;
  --z-modal: 300;
  --z-toast: 400;

  --duration-fast: 150ms;
  --duration-base: 280ms;
  --duration-slow: 600ms;
  --duration-reveal: 750ms;
  --ease-out: var(--easing-editorial);
  --ease-in-out: cubic-bezier(0.45, 0, 0.55, 1);
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);

  --transition-base: var(--transition-medium);
  --transition-smooth: var(--transition-medium);

  color-scheme: dark;
}

/* ==========================================================================
   Light mode — paper archive
   ========================================================================== */

[data-theme="light"] {
  --bg-primary: var(--color-background-paper);
  --bg-secondary: #f4f0e8;
  --bg-tertiary: #e0dbd2;
  --bg-elevated: #faf7f2;
  --bg-light: var(--color-background-paper);

  --surface-border: var(--color-border-light);
  --surface-border-hover: rgba(22, 20, 18, 0.22);
  --surface-glow: rgba(168, 84, 60, 0.08);
  --border-subtle: var(--color-border-light);

  --text-primary: var(--color-text-dark);
  --text-secondary: #5e5852;
  --text-tertiary: #8a837a;
  --text-inverse: var(--color-text-light);
  --text-muted: #6b655e;
  --text-primary-dark: var(--color-text-light); /* still the warm ivory token value */
  --text-primary-light: var(--color-text-dark);
  --text-on-light: var(--color-text-dark);
  --text-muted-on-light: #5e5852;

  --accent-primary: #8f4430;
  --accent-hover: #a8543c;
  --accent-muted: rgba(143, 68, 48, 0.12);
  --accent-red: #8f4430;

  --glass-bg: rgba(235, 230, 220, 0.96);
  --glass-border: rgba(22, 20, 18, 0.1);

  --shadow-sm: 0 1px 2px rgba(22, 20, 18, 0.06);
  --shadow-md: 0 8px 24px rgba(22, 20, 18, 0.08);
  --shadow-lg: 0 18px 50px rgba(22, 20, 18, 0.12);
  --shadow-glow: 0 0 0 transparent;

  color-scheme: light;
}