/* Desk Theory · canonical design tokens · single source of truth for the navy/gold identity.
   Linked from every root page + renderer template; the old per-page :root blocks were deleted in
   favour of this one sheet, so a single palette edit here now changes the whole site.

   Aliases keep both historical naming sets resolving (older pages named the same value differently):
     --muted        == --text-soft
     --muted-dim    == --text-dim
     --border-alpha == --border-soft
     --bg-deep      == --bg-soft
     --ink-soft     == --text-soft
   Canonical picks (per the 13.A audit): --card #16243A (retired #1A2A3F-as-card), gold hover #FFC854,
   #F5B849 retired in favour of #FFC854. */
:root {
  /* Surfaces */
  --bg: #0E1B2C;
  --bg-soft: #0A1422;
  --bg-deep: #0A1422;
  --card: #16243A;
  --card-soft: #1A2A3F;
  --card-hover: #20354F;
  --card-hi: #21344C;

  /* Text */
  --text: #F2E9D8;
  --text-soft: #D9CFB9;
  --muted: #D9CFB9;
  --text-dim: #8a8478;
  --muted-dim: #8a8478;
  --ink-soft: #D9CFB9;

  /* Gold accent */
  --accent: #EFB940;
  --accent-bright: #FFC854;
  --accent-warm: #C9892F;
  --accent-dim: rgba(239,185,64,0.18);
  --accent-tint: rgba(239,185,64,0.12);

  /* Borders + rules */
  --border: rgba(201,169,97,0.22);
  --border-strong: rgba(201,169,97,0.4);
  --border-soft: rgba(242,233,216,0.12);
  --border-alpha: rgba(242,233,216,0.12);
  --rule: rgba(242,233,216,0.08);

  /* Status */
  --red: #ef4444;
  --danger: #E07A5F;
  --success: #76C19A;

  /* Shape */
  --radius-sm: 0.375rem;
  --radius: 0.5rem;
  --radius-lg: 0.75rem;
  --pill: 9999px;

  /* Shadow recipes */
  --shadow-sm: 0 1px 2px rgba(0,0,0,0.25);
  --shadow-md: 0 8px 24px rgba(0,0,0,0.28);
  --shadow-lg: 0 24px 60px rgba(0,0,0,0.45);

  /* Type stacks */
  --serif: 'Iowan Old Style', 'Iowan Old Style BT', Georgia, 'Times New Roman', serif;
  --sans: -apple-system, BlinkMacSystemFont, 'Avenir Next', 'Segoe UI', system-ui, sans-serif;
  --mono: 'JetBrains Mono', 'SF Mono', 'Fira Code', ui-monospace, monospace;

  /* Type scale + rhythm */
  --leading: 1.65;
  --step--1: 0.833rem;
  --step-0: 1rem;
  --step-1: 1.2rem;
  --step-2: 1.44rem;
  --step-3: 1.728rem;
  --step-4: 2.074rem;
  --step-5: 2.488rem;
}

/* Content pills · clickable type + difficulty-level chips.
   Both route to a static /browse facet page (see scripts/_lib/pills.mjs).
   The type pill keeps the established gold solid-tint chip look; level pills
   use an outlined treatment with a semantic green -> gold -> red ramp so the
   two families never read as the same thing (gold type vs gold intermediate). */
.pill {
  display: inline-block;
  font-family: var(--mono);
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  padding: 0.18em 0.6em;
  border-radius: 3px;
  text-decoration: none;
  line-height: 1.4;
  white-space: nowrap;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
.pill-type { background: var(--accent-tint); color: var(--accent); }
.pill-type:hover { background: var(--accent-dim); color: var(--accent-bright); }

.pill-level { background: transparent; border: 1px solid currentColor; padding: calc(0.18em - 1px) calc(0.6em - 1px); }
.pill-level-beginner { color: var(--success); }
.pill-level-intermediate { color: var(--accent); }
.pill-level-advanced { color: var(--danger); }
.pill-level:hover { background: color-mix(in srgb, currentColor 14%, transparent); }
.pill + .pill { margin-left: 0.4rem; }