/*
  SKIN: linen — Linen — soft warm modern

  Warm neutrals, muted teal primary, generous radii and diffuse depth. The furthest from today: calmer, less industrial, easier on a long day of reading grids.

  Generated by tools/skins/make_skins.py. Ramps are built in OKLCH so lightness steps are
  perceptually even and every family carries matching weight at the same shade. Edit the recipe
  in that script rather than these values, or the next run overwrites your changes.

  Colours are space-separated RGB CHANNELS. Tailwind composes them as
  `rgb(var(--c-x) / <alpha-value>)`, which is what keeps opacity modifiers working.
*/

:root {
  /* harbor */
  --c-harbor-50: 242 248 248;
  --c-harbor-100: 228 239 239;
  --c-harbor-200: 199 223 222;
  --c-harbor-300: 165 200 200;
  --c-harbor-400: 127 172 171;
  --c-harbor-500: 98 150 150;
  --c-harbor-600: 78 128 127;
  --c-harbor-700: 61 104 104;
  --c-harbor-800: 47 82 82;
  --c-harbor-900: 36 64 63;
  --c-harbor-950: 17 36 36;

  /* signal */
  --c-signal-50: 255 244 240;
  --c-signal-100: 254 231 221;
  --c-signal-200: 251 206 186;
  --c-signal-300: 243 177 147;
  --c-signal-400: 227 144 106;
  --c-signal-500: 205 113 70;
  --c-signal-600: 173 85 42;
  --c-signal-700: 143 67 29;
  --c-signal-800: 114 53 22;
  --c-signal-900: 89 40 15;
  --c-signal-950: 53 20 5;

  /* sea */
  --c-sea-50: 241 249 243;
  --c-sea-100: 227 241 231;
  --c-sea-200: 196 226 205;
  --c-sea-300: 162 207 176;
  --c-sea-400: 124 184 145;
  --c-sea-500: 91 159 116;
  --c-sea-600: 63 130 89;
  --c-sea-700: 48 106 71;
  --c-sea-800: 38 84 56;
  --c-sea-900: 28 65 42;
  --c-sea-950: 12 37 22;

  /* fog */
  --c-fog-50: 247 247 245;
  --c-fog-100: 238 236 234;
  --c-fog-200: 218 215 211;
  --c-fog-300: 190 186 180;
  --c-fog-400: 151 145 138;
  --c-fog-500: 117 111 103;
  --c-fog-600: 98 93 85;
  --c-fog-700: 80 75 68;
  --c-fog-800: 62 58 53;
  --c-fog-900: 46 43 39;
  --c-fog-950: 27 25 22;

  /* brand */
  --c-brand-50: 255 244 240;
  --c-brand-100: 254 231 221;
  --c-brand-200: 251 206 186;
  --c-brand-300: 243 177 147;
  --c-brand-400: 227 144 106;
  --c-brand-500: 205 113 70;
  --c-brand-600: 173 85 42;
  --c-brand-700: 143 67 29;
  --c-brand-800: 114 53 22;
  --c-brand-900: 89 40 15;
  --c-brand-950: 53 20 5;

  /* ── type ──────────────────────────────────────────────────────────── */
  --font-display: "Fraunces", ui-serif, Georgia, serif;
  --font-sans: "DM Sans", ui-sans-serif, system-ui, sans-serif;
  --font-mono: "DM Mono", ui-monospace, monospace;
  --tracking-display: -0.025em;

  /* ── shape ─────────────────────────────────────────────────────────── */
  --radius-lg: 0.625rem;
  --radius-xl: 0.875rem;
  --radius-2xl: 1.25rem;

  /* ── depth ─────────────────────────────────────────────────────────── */
  --shadow-card: 0 1px 2px rgb(var(--c-harbor-950) / 0.06), 0 8px 24px -12px rgb(var(--c-harbor-950) / 0.2);
  --shadow-card-hover: 0 2px 4px rgb(var(--c-harbor-950) / 0.08), 0 16px 40px -16px rgb(var(--c-harbor-950) / 0.30);
  --shadow-rail: inset -1px 0 0 rgb(255 255 255 / 0.04);
  --shadow-signal: 0 6px 20px -8px rgb(var(--c-signal-600) / 0.6);

  /* ── motion ────────────────────────────────────────────────────────── */
  --motion-fast: 180ms;
  --motion-base: 340ms;
  --motion-slow: 560ms;
  --ease-out-expo: cubic-bezier(0.34, 1.2, 0.64, 1);

  /* ── texture ───────────────────────────────────────────────────────── */
  --grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
  --grain-opacity: 0.06;
  --bg-harbor-mesh: radial-gradient(110% 120% at 0% 0%, rgb(var(--c-harbor-800)) 0%, rgb(var(--c-harbor-900)) 45%, rgb(var(--c-harbor-950)) 100%);
  --bg-chart-grid: linear-gradient(rgb(255 255 255 / 0.035) 1px, transparent 1px), linear-gradient(90deg, rgb(255 255 255 / 0.035) 1px, transparent 1px);
}
