/* Inertial Web Team - Quiet Utility / Liquid Landscape v2.1. Generated from design-system/tokens.json. */
:root {
  /* Colour primitives */
  --inertial-forest-950: #082b27;
  --inertial-forest-800: #143c35;
  --inertial-forest-700: #24483f;
  --inertial-forest-500: #527067;
  --inertial-sage-300: #b8c9ba;
  --inertial-mist-100: #e7eee8;
  --inertial-paper-50: #f5f7f3;
  --inertial-lime-400: #a9bc42;
  --inertial-focus-400: #e6c966;
  --inertial-white: #ffffff;

  /* Semantic colour */
  --surface-page: var(--inertial-paper-50);
  --surface-muted: var(--inertial-mist-100);
  --surface-raised: rgb(255 255 255 / 68%);
  --surface-overlay: rgb(245 247 243 / 86%);
  --surface-strong: var(--inertial-forest-800);
  --surface-deep: var(--inertial-forest-950);
  --text-primary: #10241f;
  --text-secondary: #4d625b;
  --text-tertiary: #72877f;
  --text-on-dark: var(--inertial-mist-100);
  --text-on-danger: var(--inertial-white);
  --action-primary: var(--inertial-forest-800);
  --action-accent: var(--inertial-lime-400);
  --border-subtle: rgb(20 60 53 / 16%);
  --border-strong: rgb(20 60 53 / 28%);
  --focus-ring: var(--inertial-focus-400);
  --surface-scrim: rgb(8 43 39 / 58%);

  /* Semantic status: Use foreground and surface tokens as a pair */
  --status-success-text: #3e6039;
  --status-success-surface: #d8e7c7;
  --status-warning-text: #72552e;
  --status-warning-surface: #f0dfba;
  --status-danger-text: #824f48;
  --status-danger-surface: #f2d8d3;
  --status-info-text: #3e5f56;
  --status-info-surface: #dce8e0;

  /* Typography */
  --font-display: "Fraunces", Georgia, serif;
  --font-body: "DM Sans", Arial, sans-serif;
  --font-utility: "DM Mono", Consolas, monospace;
  --text-display-xl: clamp(3.8rem, 8vw, 7.5rem);
  --text-display-l: clamp(3rem, 6vw, 6.5rem);
  --text-display-m: clamp(2.15rem, 3.3vw, 4rem);
  --text-body-l: 1.05rem;
  --text-body: .92rem;
  --text-label: .68rem;
  --line-height-tight: 1.02;
  --line-height-body: 1.55;

  /* Media and route signature: Use authentic media for Story mode and the route line only when it communicates progress, sequence, or selection */
  --media-aspect-story: 16 / 10;
  --media-aspect-product: 4 / 3;
  --media-aspect-detail: 1 / 1;
  --media-radius: var(--radius-card);
  --media-scrim-soft: linear-gradient(90deg, rgb(8 43 39 / 72%), rgb(8 43 39 / 20%) 62%, transparent);
  --media-scrim-strong: linear-gradient(0deg, rgb(8 43 39 / 78%), rgb(8 43 39 / 8%) 74%);
  --route-line: var(--action-accent);
  --route-track: rgb(20 60 53 / 18%);
  --route-line-on-dark: rgb(169 188 66 / 82%);
  --route-track-on-dark: rgb(231 238 232 / 30%);
  --route-line-width: 3px;
  --route-node-size: 1rem;

  /* Space and form */
  --space-1: .25rem;
  --space-2: .5rem;
  --space-3: .75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-8: 3rem;
  --space-10: 4rem;
  --space-12: 6rem;
  --space-16: 8rem;
  --radius-small: 10px;
  --radius-medium: 14px;
  --radius-card: 18px;
  --radius-control: 999px;
  --touch-target-min: 44px;
  --control-height: 48px;
  --control-height-compact: 38px;
  --content-max: 1240px;
  --content-max-reading: 760px;
  --page-gutter: clamp(22px, 8vw, 130px);
  --sidebar-width: 240px;

  /* Elevation and glass */
  --shadow-floating: 0 28px 68px rgb(2 24 19 / 24%);
  --shadow-soft: 0 20px 52px rgb(3 20 16 / 15%);
  --shadow-subtle: 0 12px 36px rgb(3 20 16 / 10%);
  --glass-light: rgb(245 247 243 / 86%);
  --glass-dark: linear-gradient(135deg, rgb(231 238 232 / 19%), rgb(231 238 232 / 6%));
  --glass-edge-light: rgb(255 255 255 / 45%);
  --glass-edge-dark: rgb(255 255 255 / 22%);
  --glass-blur: blur(20px) saturate(1.15);

  /* Motion and layers */
  --ease-quiet: cubic-bezier(.2, .7, .2, 1);
  --duration-micro: 160ms;
  --duration-ui: 240ms;
  --duration-story: 700ms;
  --z-base: 0;
  --z-sticky: 5;
  --z-navigation: 10;
  --z-dialog: 20;

  /* Compatibility aliases used by the Koru prototype */
  --forest: var(--inertial-forest-800);
  --deep: var(--inertial-forest-950);
  --mist: var(--inertial-mist-100);
  --sage: var(--inertial-sage-300);
  --paper: var(--inertial-paper-50);
  --lime: var(--inertial-lime-400);
  --ink: var(--text-primary);
  --line: var(--border-subtle);
  --radius: var(--radius-card);
}