/* Hallmark tokens · route: custom (bespoke) · vibe: "klatka schodowa, malowane drzwi, mosiężna klamka, żółta karteczka"
 * axes: light / grotesk-display (Bricolage) / cool-blue door + brass
 */
:root {
  color-scheme: light;

  /* colour — wall, door, brass, note */
  --color-wall: oklch(94% 0.014 80);
  --color-wall-2: oklch(90% 0.018 78);
  --color-floor: oklch(83% 0.022 70);
  --color-floor-2: oklch(78% 0.025 68);
  --color-frame: oklch(97% 0.008 80);
  --color-frame-shade: oklch(86% 0.014 80);
  --color-ink: oklch(24% 0.02 250);
  --color-ink-2: oklch(40% 0.02 250);
  --color-muted: oklch(50% 0.018 250);
  --color-door: oklch(43% 0.085 245);
  --color-door-2: oklch(38% 0.08 245);
  --color-door-3: oklch(50% 0.08 245);
  --color-door-ink: oklch(94% 0.02 245);
  --color-brass: oklch(78% 0.12 82);
  --color-brass-2: oklch(64% 0.11 72);
  --color-brass-ink: oklch(28% 0.05 70);
  --color-note: oklch(93% 0.11 100);
  --color-note-2: oklch(88% 0.12 98);
  --color-note-ink: oklch(30% 0.04 90);
  --color-mat: oklch(58% 0.07 62);
  --color-mat-2: oklch(50% 0.07 58);
  --color-mat-ink: oklch(90% 0.03 70);
  --color-panel: oklch(30% 0.015 250);
  --color-panel-2: oklch(36% 0.015 250);
  --color-panel-ink: oklch(92% 0.01 250);
  --color-panel-muted: oklch(74% 0.015 250);
  --color-screen: oklch(84% 0.08 150);
  --color-screen-ink: oklch(28% 0.05 150);
  --color-lock: oklch(60% 0.17 30);
  --color-ok: oklch(66% 0.14 150);
  --color-danger: oklch(52% 0.17 28);
  --color-focus: oklch(36% 0.16 262);
  --color-focus-halo: oklch(98% 0.01 80);
  --color-shadow: oklch(25% 0.03 250 / 0.22);
  --color-shadow-soft: oklch(25% 0.03 250 / 0.12);

  /* type */
  --font-display: "Bricolage Grotesque", "Segoe UI", system-ui, sans-serif;
  --font-body: "Instrument Sans", "Segoe UI", system-ui, sans-serif;

  --text-xs: 0.8125rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-lg: 1.25rem;
  --text-xl: 1.75rem;
  --text-2xl: clamp(2rem, 6vw, 3.25rem);

  /* space — 4pt scale */
  --space-3xs: 0.25rem;
  --space-2xs: 0.5rem;
  --space-xs: 0.75rem;
  --space-sm: 1rem;
  --space-md: 1.5rem;
  --space-lg: 2rem;
  --space-xl: 3rem;

  /* shape */
  --radius-sm: 0.375rem;
  --radius-md: 0.75rem;
  --radius-pill: 999px;

  /* motion */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in: cubic-bezier(0.55, 0, 1, 0.45);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast: 120ms;
  --dur-base: 220ms;
  --dur-door: 900ms;
}