/* ============================================================
   SHAPE ROTATOR DAY — design tokens
   Direction: glowing geometry in a warm heritage room.
   The screen is warm near-black space; color is light, not paint.
   Dark-only. Consumed by components.css and every srday site.
   ============================================================ */

:root {
  color-scheme: dark;

  /* ---- Surfaces (warm brown-black is the base everywhere) ---- */
  --srd-bg:        #070504;   /* page base — warm black */
  --srd-scene:     #0b0908;   /* deep scene backdrop, hero fields */
  --srd-panel:     #1b1714;   /* solid claimed/settled surfaces */
  --srd-panel-2:   #151210;   /* recessed panels, wells */

  /* ---- Ink (parchment) ---- */
  --srd-ink:       #f5eee5;
  --srd-ink-soft:  #cdbfb2;
  --srd-ink-mute:  #8d8074;

  /* ---- Lines (parchment light, not white) ---- */
  --srd-line:      rgba(245,238,229,0.20);
  --srd-line-soft: rgba(245,238,229,0.07);
  --srd-line-ghost:rgba(245,238,229,0.28); /* dashed = unclaimed/locked/absent */

  /* ---- Six-color event palette (one word each) ---- */
  --srd-violet: #c79ad8;   /* mystery    — the gauntlet */
  --srd-cyan:   #86a9d8;   /* trust      — agents + jars (muted slate in the warm room) */
  --srd-amber:  #d99a3c;   /* warmth     — the commons, doors */
  --srd-red:    #d3604f;   /* intensity  — the stage */
  --srd-oxide:  #c75a34;   /* achievement — THE accent (rust/terracotta); once per surface */
  --srd-oxide-bright: #e8703f;
  --srd-bone:   #eadfca;   /* institution — marble + paper */
  /* green is reserved: jars + sorting-complete only */
  --srd-jar:    #86b06c;

  /* ---- Temperature gradient, 0.0 -> 2.0 (cold -> hot, warm register) ---- */
  --srd-temp-0: #86a9d8;
  --srd-temp-1: #d99a3c;
  --srd-temp-2: #d3604f;
  --srd-temp-gradient: linear-gradient(90deg,
      var(--srd-temp-0) 0%, var(--srd-temp-1) 55%, var(--srd-temp-2) 100%);

  /* ---- Liquid glass recipe (warmed fills, same structure) ---- */
  --srd-glass-fill:   rgba(27,23,20,0.55);
  --srd-glass-fill-2: rgba(33,28,24,0.72);
  --srd-glass-border: rgba(245,238,229,0.11);
  --srd-glass-hi:     rgba(245,238,229,0.14); /* inset top highlight */
  --srd-glass-blur:   22px;
  --srd-glass-blur-strong: 26px;

  /* ---- Shadow (light pools, not drop shadows) ---- */
  --srd-shadow:      0 10px 34px rgba(10,6,3,0.55);
  --srd-shadow-soft: 0 6px 20px rgba(10,6,3,0.40);

  /* ---- Type ---- */
  --srd-font-mono:  'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace;
  --srd-font-ui:    'Neue Haas Grotesk Display Pro', 'Neue Haas Grotesk',
                    'Helvetica Neue', 'Inter', system-ui, -apple-system, sans-serif;
  --srd-font-serif: 'Fraunces', 'Big Caslon', 'Iowan Old Style',
                    'Palatino Linotype', Palatino, Georgia, serif;

  /* scale — weight 500 is the ceiling, never bold */
  --srd-text-micro: 0.625rem;   /* 10px mono micro-labels */
  --srd-text-label: 0.6875rem;  /* 11px mono labels */
  --srd-text-body:  0.9375rem;  /* 15px */
  --srd-text-lead:  1.0625rem;  /* 17px */
  --srd-text-h3:    1.25rem;
  --srd-text-h2:    clamp(1.375rem, 3.4vw, 2rem);
  --srd-text-h1:    clamp(1.625rem, 5vw, 3.375rem); /* 26 -> 54px */
  --srd-track-micro: 0.18em;
  --srd-track-label: 0.14em;
  --srd-track-tight: -0.015em;
  --srd-leading-body: 1.6;
  --srd-leading-head: 1.14;

  /* ---- Spacing ---- */
  --srd-s1: 4px;  --srd-s2: 8px;   --srd-s3: 12px; --srd-s4: 16px;
  --srd-s5: 24px; --srd-s6: 32px;  --srd-s7: 48px; --srd-s8: 72px;
  --srd-maxw: 1080px;

  /* ---- Radii ---- */
  --srd-radius:      14px;
  --srd-radius-sm:   9px;
  --srd-radius-pill: 999px;

  /* ---- Motion: one verb set — decompose, rotate, recompose ---- */
  --srd-ease:     cubic-bezier(.2,.7,.2,1);
  --srd-dur:      .4s;
  --srd-dur-fast: .18s;
  --srd-dur-slow: .8s;
}

/* ---- Base register ---- */
* { box-sizing: border-box; }

body {
  margin: 0;
  background: var(--srd-bg);
  color: var(--srd-ink-soft);
  font-family: var(--srd-font-ui);
  font-size: var(--srd-text-body);
  line-height: var(--srd-leading-body);
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
}

/* Headings carry the serif display voice (Fraunces-class). */
h1, h2, h3, h4 {
  color: var(--srd-ink);
  font-family: var(--srd-font-serif);
  font-weight: 500; /* never bold */
  line-height: var(--srd-leading-head);
  letter-spacing: var(--srd-track-tight);
  margin: 0;
}

b, strong { font-weight: 500; }

a { color: var(--srd-ink); text-decoration-color: var(--srd-line); }

::selection { background: var(--srd-oxide); color: #0b0908; }

:focus-visible {
  outline: 2px solid var(--srd-oxide);
  outline-offset: 2px;
  border-radius: 2px;
}

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