/* ==========================================================================
   Seilschaft design tokens · Direction C "Aare"
   One brand hue (198, the glacier-milk turquoise of the Aare) drives the file.
   Form archetype: Sheet. Colour is the surface; full-bleed bands divide the
   page; no cards, no shadows on content, pill controls on square sheets.
   ========================================================================== */
:root {
  color-scheme: light;
  --h: 198;          /* Aare */
  --n: 236;          /* night: the ink and the one dark band */

  /* ---- Neutrals: mist, tinted toward the Aare hue ---- */
  --bg:            oklch(0.972 0.012 198);
  --surface:       oklch(0.993 0.004 198);
  --surface-2:     oklch(0.947 0.018 198);
  --surface-3:     oklch(0.918 0.026 198);
  --ink:           oklch(0.23 0.05 236);
  --ink-2:         oklch(0.34 0.05 228);
  --muted:         oklch(0.47 0.04 222);
  --muted-2:       oklch(0.58 0.03 215);   /* decorative only: rules, disabled icons. Never text. */
  --line:          oklch(0.885 0.02 205);
  --line-strong:   oklch(0.78 0.03 210);

  /* ---- Brand ---- */
  --primary:        oklch(0.26 0.055 236);   /* night pill: the default action */
  --primary-strong: oklch(0.20 0.05 236);
  --primary-soft:   oklch(0.93 0.03 205);
  --primary-soft-2: oklch(0.87 0.05 200);
  --on-primary:     oklch(0.97 0.02 198);

  --aare:           oklch(0.80 0.085 198);  /* the drench band */
  --aare-deep:      oklch(0.70 0.10 198);
  --aare-soft:      oklch(0.90 0.05 198);
  --on-aare:        oklch(0.22 0.05 235);
  --on-aare-muted:  oklch(0.33 0.05 225);

  /* Sun: appears only where a person decides. Never decoration. */
  --accent:         oklch(0.87 0.15 92);
  --accent-strong:  oklch(0.80 0.16 88);
  --accent-soft:    oklch(0.96 0.05 95);
  --on-accent:      oklch(0.25 0.05 92);

  /* Night: one dark band per page, maximum. */
  --drench:          oklch(0.21 0.045 238);
  --drench-2:        oklch(0.27 0.05 238);
  --on-drench:       oklch(0.95 0.02 198);
  --on-drench-muted: oklch(0.78 0.04 198);
  --drench-line:     oklch(0.37 0.05 238);

  /* ---- Agents: five strands, one per voice ---- */
  --ag-sal: oklch(0.44 0.10 250);
  --ag-bkg: oklch(0.52 0.10 205);
  --ag-ops: oklch(0.50 0.09 165);
  --ag-mkt: oklch(0.50 0.10 290);
  --ag-mgt: oklch(0.30 0.05 235);
  /* same strands, lifted for use on night */
  --ag-sal-lt: oklch(0.78 0.09 250);
  --ag-bkg-lt: oklch(0.82 0.09 205);
  --ag-ops-lt: oklch(0.82 0.09 165);
  --ag-mkt-lt: oklch(0.80 0.08 290);
  --ag-mgt-lt: oklch(0.92 0.02 198);

  /* ---- Semantic: STATES ONLY ---- */
  --success: oklch(0.58 0.12 155); --success-soft: oklch(0.95 0.04 155); --success-ink: oklch(0.38 0.10 155);
  --warning: oklch(0.72 0.15 60);  --warning-soft: oklch(0.96 0.045 70); --warning-ink: oklch(0.44 0.12 55);
  --danger:  oklch(0.55 0.18 25);  --danger-soft:  oklch(0.955 0.035 25); --danger-ink:  oklch(0.44 0.16 25);
  --info:    oklch(0.52 0.10 240); --info-soft:    oklch(0.95 0.025 240); --info-ink:    oklch(0.40 0.10 240);

  /* Charts: a ramp of the Aare hue toward night. */
  --c-1: oklch(0.90 0.05 198); --c-2: oklch(0.78 0.09 198);
  --c-3: oklch(0.62 0.10 210);      --c-4: oklch(0.45 0.08 225); --c-5: oklch(0.28 0.055 236);

  /* ---- Typography ---- */
  --font-display: "Gloock", ui-serif, Georgia, serif;
  --font-body:    "Albert Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono:    ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  /* Brand register: fluid */
  --fs-display: clamp(3rem, 1.4rem + 5.4vw, 6rem);
  --fs-h1:      clamp(2.5rem, 1.5rem + 3.6vw, 4.5rem);
  --fs-h2:      clamp(2rem, 1.35rem + 2.4vw, 3.5rem);
  --fs-h3:      clamp(1.5rem, 1.2rem + 1vw, 2.125rem);
  --fs-lead:    clamp(1.125rem, 1.04rem + 0.4vw, 1.3125rem);
  --fs-body:    1.0625rem;
  --fs-small:   0.9375rem;
  --fs-xs:      0.8125rem;

  /* Product register: fixed */
  --t-40: 2.5rem; --t-32: 2rem; --t-28: 1.75rem; --t-22: 1.375rem; --t-18: 1.125rem; --t-16: 1rem;
  --t-15: 0.9375rem; --t-14: 0.875rem; --t-13: 0.8125rem; --t-12: 0.75rem; --t-11: 0.6875rem;

  --lh-tight: 0.98; --lh-snug: 1.18; --lh-body: 1.6; --lh-relaxed: 1.72;
  --tracking-display: -0.025em; --tracking-ui: 0;

  /* ---- Spacing ---- */
  --s-1: 0.25rem; --s-2: 0.5rem;  --s-3: 0.75rem; --s-4: 1rem;   --s-5: 1.5rem;
  --s-6: 2rem;    --s-7: 3rem;    --s-8: 4rem;    --s-9: 5rem;   --s-10: 6rem; --s-12: 8rem;
  --section:       clamp(4.5rem, 2.5rem + 6vw, 9rem);
  --section-tight: clamp(2.5rem, 1.5rem + 3vw, 4.5rem);
  --gutter:        clamp(1rem, 4vw, 3.5rem);
  --container: 1240px; --container-wide: 1440px; --container-narrow: 760px; --measure: 68ch;

  /* ==========================================================================
     FORM LAYER · archetype Sheet
     ========================================================================== */
  /* 1. Shape: pills on square sheets. Controls round, surfaces square. */
  --r-ctl: 999px; --r-card: 0px; --r-lg: 0px; --r-full: 999px;

  /* 2. Border weight: hairlines only; an input's underline thickens on focus. */
  --bw: 1px; --bw-strong: 1.5px;
  --rule: var(--bw) solid var(--line);
  --rule-strong: var(--bw-strong) solid var(--line-strong);

  /* 3. Elevation: none. Depth comes from colour bands. Only floating layers lift. */
  --elev-card: none;
  --elev-pop:  0 18px 40px -18px oklch(0.21 0.045 238 / 0.32);
  --elev-modal: 0 40px 80px -24px oklch(0.21 0.045 238 / 0.42);

  /* 4. Density: roomy. People read these screens at 06:40 with coffee. */
  --h-ctl: 44px; --h-ctl-sm: 36px; --h-row: 52px;
  --pad-card: var(--s-6); --gap-grid: var(--s-6);

  /* 5. Dividers: hairline between rows, bands between sections, no boxes. */
  --cell-rule: none;
  --row-rule: var(--rule);

  /* 6. Headings: Gloock, regular weight, sentence case. */
  --wt-head: 400; --wt-ui-head: 600; --wt-body: 400;
  --tracking-heading: -0.02em;
  --case-head: none;

  --e-1: none;
  --e-2: var(--elev-pop);
  --e-3: var(--elev-modal);

  /* ---- Motion: river-slow in, quick out ---- */
  --dur-1: 140ms; --dur-2: 220ms; --dur-3: 420ms; --dur-4: 800ms;
  --ease: cubic-bezier(0.2, 0, 0, 1);
  --ease-out: cubic-bezier(0.19, 1, 0.22, 1);

  /* ---- Chrome ---- */
  --nav-h: 64px;
  --pocbar-h: 44px;
  --z-sticky: 20; --z-layer: 60; --z-toast: 80; --z-pocbar: 90; --z-tour: 100;
}

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