/* ============================================================
   Cumulus — Design Tokens
   Research-grade "instrument" aesthetic.
   ============================================================ */

:root {
  /* --- Surfaces (warm paper) --- */
  --paper:        #F4F1E9;
  --paper-2:      #ECE7DB;
  --surface:      #FFFFFF;
  --surface-sunk: #FBF9F3;

  /* --- Ink --- */
  --ink:    #0E1B2B;
  --ink-2:  #2E3C4B;
  --muted:  #616E7B;
  --faint:  #939CA6;

  /* --- Hairlines --- */
  --line:   #E4DECF;
  --line-2: #EEE9DC;
  --line-strong: #D6CFBD;

  /* --- Accent: cyan signal --- */
  --accent:       #0FB2C2;
  --accent-deep:  #0A8693;
  --accent-press: #086d78;
  --accent-tint:  #E0F4F6;
  --accent-glow:  rgba(15, 178, 194, 0.30);

  /* --- Console (dark) surfaces for run + results --- */
  --navy:    #0B1623;
  --navy-1:  #0F1E30;
  --navy-2:  #16293F;
  --navy-3:  #21405c;
  --navy-line: rgba(120, 180, 210, 0.16);
  --navy-ink:  #E8F1F6;
  --navy-muted:#8AA3B5;

  /* --- Loss severity ramp (data viz only) --- */
  --loss-low:  #2FA277;
  --loss-mid:  #E2982F;
  --loss-high: #D24A3C;
  --loss-low-tint:  #E3F3EC;
  --loss-mid-tint:  #FAEFD8;
  --loss-high-tint: #F8E2DE;

  /* --- Typography --- */
  --font-display: "Fraunces", Georgia, "Times New Roman", serif;
  --font-ui: "Hanken Grotesk", -apple-system, BlinkMacSystemFont, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, monospace;

  /* Fluid type scale */
  --t-display: clamp(2.1rem, 1.5rem + 2.6vw, 3.3rem);
  --t-h1: clamp(1.55rem, 1.2rem + 1.4vw, 2.1rem);
  --t-h2: clamp(1.2rem, 1.05rem + 0.7vw, 1.5rem);
  --t-h3: 1.075rem;
  --t-body: 0.95rem;
  --t-sm: 0.84rem;
  --t-xs: 0.75rem;
  --t-2xs: 0.68rem;

  /* --- Radii --- */
  --r-xs: 5px;
  --r-sm: 8px;
  --r:    12px;
  --r-lg: 18px;
  --r-xl: 26px;
  --r-pill: 999px;

  /* --- Shadows --- */
  --shadow-1: 0 1px 2px rgba(20, 32, 46, 0.05), 0 1px 1px rgba(20, 32, 46, 0.04);
  --shadow-2: 0 4px 14px -6px rgba(20, 32, 46, 0.16), 0 2px 5px -3px rgba(20, 32, 46, 0.10);
  --shadow-card: 0 18px 50px -30px rgba(14, 27, 43, 0.45), 0 4px 14px -10px rgba(14, 27, 43, 0.18);
  --shadow-pop: 0 30px 70px -34px rgba(11, 22, 35, 0.55);
  --shadow-glow: 0 0 0 4px var(--accent-glow);

  /* --- Motion --- */
  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur: 0.28s;
  --dur-slow: 0.55s;

  /* --- Layout --- */
  --rail-w: 290px;
  --info-w: 340px;
  --topbar-h: 64px;
  --footer-h: 78px;
  --content-max: 1480px;
}

@media (prefers-reduced-motion: reduce) {
  * {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
}