/*
  Pryor shared design tokens. Keep this file free of layout and component rules.

  ── What this file is, and what it is not ──────────────────────────────────
  This is the token layer the SCANNER renders from (theater/index.html and
  theater/read.html link it; theater-tokens.css only re-exports it).

  The HOMEPAGE also links it — first, at home/index.html — and then overrides
  nearly all of it from home/claude-merged.css, which loads last and therefore
  wins. So the homepage's runtime identity lives in claude-merged.css, not here.

  Values below are therefore copied FROM the homepage's winning layer, so the
  scanner renders the same world the homepage actually paints: cool paper,
  near-black ink, olive accent on light and acid lime on dark. Editing a value
  here moves the scanner and leaves the homepage exactly where it is.

  Anything the homepage owns alone (--c-*, --pb-*, --plays-*, --codex-*) was
  removed from this file: every one of those was a stale duplicate of a
  homepage sheet that loads later and wins, and none was ever read by the
  scanner. Do not reintroduce them here.
*/

/* Source: home/amigo-cued-dispatch.css. The family is retained verbatim. */
@font-face {
  font-family: "Pryor Geist Ultra";
  src: url("/assets/fonts/geist-ultrablack.otf") format("opentype");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

/* Source: the canonical research-read chapter. Alias for the approved Pryor display asset. */
@font-face {
  font-family: "Pryor Ultra";
  src: url("/assets/fonts/geist-ultrablack.otf") format("opentype");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

/*
  The Outfit faces are declared but deliberately NOT referenced by --sans.

  The homepage declares `--sans: "Outfit", …` (home/claude-system.css) and no
  @font-face for a plain "Outfit" exists anywhere, so the homepage has always
  rendered its interface text in the system face. Measured: real Outfit sets
  ~10% wider than -apple-system at the same size, so pointing either page at it
  reflows every paragraph, nav and button that was tuned against the system
  metrics.

  Cohesion is the goal and the homepage is the reference, so the scanner now
  renders the same system stack the homepage does. To adopt real Outfit across
  both pages instead, change --sans below to lead with "Pryor Outfit" AND change
  the homepage's own --sans in claude-system.css to match — then re-tune both.
  Changing only one of the two is what made them diverge in the first place.
*/
@font-face {
  font-family: "Pryor Outfit";
  src: url("/assets/fonts/outfit-400.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Pryor Outfit";
  src: url("/assets/fonts/outfit-500.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Pryor Outfit";
  src: url("/assets/fonts/outfit-600.ttf") format("truetype");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Pryor Outfit";
  src: url("/assets/fonts/outfit-700.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Pryor Outfit";
  src: url("/assets/fonts/outfit-900.ttf") format("truetype");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

:root {
  color-scheme: light;

  /* ── Core palette ────────────────────────────────────────────────────────
     Source: home/claude-merged.css :root, the homepage's winning token layer.
     The warm-paper set this file used to carry (#f7f6f2 paper, #261923 ink)
     was retired with the rest of the warm world; it is not a fallback. */
  --paper: #eef1f4;
  --paper-rgb: 238, 241, 244;
  --surface-paper: #eef1f4;
  --raised: #fafbfc;
  --white: #ffffff;
  --white-rgb: 255, 255, 255;
  --ink: #14161c;
  --ink-rgb: 20, 22, 28;
  --muted: #4c5361;

  /* The lime rule, carried verbatim from the homepage: acid lime belongs on
     dark ground or as a low-alpha wash, and never as a solid mark on paper.
     On light surfaces the same accent steps down to olive, which is what
     --lime resolves to — matching claude-merged.css's own --lime. */
  --lime-on-dark: #e5f00b;
  --lime-on-light: #5d6a08;
  --lime-deep: #6d7c0c;
  --lime: var(--lime-on-light);
  --lime-rgb: 229, 240, 11;

  --accent: #5d6a08;
  --accent-rgb: 93, 106, 8;
  --accent-ink: #fdfeef;

  /* Dark command surfaces (the plan status bar) and the controls that ride
     them. Source: --c-poster-bg / --m-ink-chip / --c-btn-text. */
  --night-surface: #14171f;
  --night-surface-rgb: 20, 23, 31;
  --ink-chip: #14161c;
  --btn-text: #fafbfc;
  --glow-cta: 0 0 34px rgba(229, 240, 11, .16);

  /* ── Type ───────────────────────────────────────────────────────────────
     --sans is the homepage's stack, so both pages set text in the same face.
     See the @font-face note above before changing it. */
  --display: "Pryor Geist Ultra", "Arial Black", Arial, sans-serif;
  --sans: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", Arial, sans-serif;
  --mono: "SFMono-Regular", "Roboto Mono", Menlo, Consolas, monospace;

  /* ── Text weights on paper ──────────────────────────────────────────────
     Derived from --ink-rgb, so they followed the ink to the cool value. */
  --t1: var(--ink);
  --t2: rgba(var(--ink-rgb), .78);
  --t3: rgba(var(--ink-rgb), .68);
  --text-78: rgba(var(--ink-rgb), .78);
  --text-68: rgba(var(--ink-rgb), .68);
  --text-55: rgba(var(--ink-rgb), .55);
  --text-45: rgba(var(--ink-rgb), .45);
  --text-38: rgba(var(--ink-rgb), .38);

  /* ── Hairlines ──────────────────────────────────────────────────────────
     Source: --c-hairline / --c-hairline-strong, expressed against --ink-rgb. */
  --line: rgba(var(--ink-rgb), .12);
  --line-soft: rgba(var(--ink-rgb), .105);
  --line-strong: rgba(var(--ink-rgb), .22);
  --line-2: var(--line-strong);
  --topline: rgba(255, 255, 255, .9);

  /* ── Radii ──────────────────────────────────────────────────────────────
     Source: home/claude-system.css. The scanner's controls use --r-sm, which
     is the homepage button and input radius. */
  --r-sm: 8px;
  --r-md: 14px;
  --r-lg: 22px;
  --r-full: 999px;

  /* ── Elevation ──────────────────────────────────────────────────────────
     The cool navy shadow family, never a warm one. Source: claude-merged.css. */
  --shadow-rest: 0 2px 8px rgba(28, 38, 64, .08);
  --shadow-raised: 0 16px 40px rgba(28, 38, 64, .1);
  --shadow-float: 0 6px 18px rgba(28, 38, 64, .08), 0 34px 80px rgba(28, 38, 64, .14);
  --card-sh: inset 0 1px 0 rgba(255, 255, 255, .9), var(--shadow-raised);

  /* Source: home/claude-playbooks.css glass recipe, promoted for shared use. */
  --glass-face-bg: linear-gradient(180deg, rgba(255, 255, 255, .86), rgba(255, 255, 255, .66));
  --glass-face-border: rgba(255, 255, 255, .78);
  --glass-face-blur: blur(16px) saturate(140%);
  --glass-face-shadow: inset 0 1px 0 rgba(255, 255, 255, .85), inset 0 -1px 0 rgba(255, 255, 255, .25), 0 22px 44px -20px rgba(63, 111, 216, .5), 0 10px 24px -14px rgba(72, 82, 12, .5), 0 6px 16px -8px rgba(72, 82, 12, .22);
  --frost-face-bg: linear-gradient(180deg, rgba(255, 255, 255, .86), rgba(255, 255, 255, .42));
  --frost-border: rgba(255, 255, 255, .78);
  --frost-shadow: inset 0 1px 0 rgba(255, 255, 255, .85), inset 0 -1px 0 rgba(255, 255, 255, .25);
  --frost-mask: radial-gradient(farthest-side, transparent calc(100% - 22px), #000 calc(100% - 21px));

  /* Source: home/claude-polish.css section 6, the homepage panel system. */
  --panel-radius: 32px;
  --panel-inset: clamp(10px, 1.6vw, 24px);
  --panel-gap: clamp(14px, 2vw, 26px);
  --panel-shadow: 0 1px 0 rgba(255, 255, 255, .04), 0 24px 60px rgba(0, 0, 0, .3);

  /* Source: home/claude-merged.css nav paint, promoted for shared use. */
  --nav-glass-bg: rgba(250, 252, 254, .55);
  --nav-glass-blur: blur(26px) saturate(158%);
  --nav-glass-shadow: inset 0 -1px 0 rgba(var(--ink-rgb), .08);

  /* ── Motion ─────────────────────────────────────────────────────────────
     Source: --spring / --mo-ease, the one easing the whole system shares. */
  --ease: cubic-bezier(.16, 1, .3, 1);
  --spring: cubic-bezier(.16, 1, .3, 1);
  --flow-ease: cubic-bezier(.45, 0, .55, 1);
  --dur-micro: .22s;
  --dur-enter: .62s;
  --dur-morph: .8s;

  /* ── Category hues ──────────────────────────────────────────────────────
     The four shared research hues. They identify a category — a source group,
     a workstream lane — and are never a Pryor accent. Source: the homepage's
     --cat-* set in claude-playbooks.css. */
  /* The homepage's cool mesh tint, used at low alpha behind light surfaces.
     Source: --c-mesh-a in claude-merged.css. */
  --mesh-cool-rgb: 151, 183, 226;

  --azure: #3f6fd8;
  --azure-rgb: 63, 111, 216;
  --violet: #7b5cd6;
  --violet-rgb: 123, 92, 214;
  --teal: #1f9e8f;
  --teal-rgb: 31, 158, 143;
  --ember: #d2703c;
  --ember-rgb: 210, 112, 60;

  /* ── Scanner instrument ─────────────────────────────────────────────────
     Owned by the read chapter; no homepage counterpart. */
  --bezel-queued: rgba(var(--ink-rgb), .14);
  --bezel-partial: rgba(var(--ink-rgb), .34);
  --bezel-read: rgba(var(--ink-rgb), .72);
  --bezel-divider: rgba(var(--ink-rgb), .22);
  /* The band the drifting orbs are confined to: the outer 30px of the core,
     which covers the frost rim's own 22px face and a little of the capture
     edge beneath it. An orb crossing further in would stain the visitor's own
     page with colour instead of reading as light under the glass. */
  --gem-band-mask: radial-gradient(farthest-side, transparent calc(100% - 30px), #000 calc(100% - 29px));
  /* One turn of the light that runs the bezel. */
  --bezel-sweep: 9s;
  --capture-veil: linear-gradient(180deg, rgba(var(--paper-rgb), .34), rgba(var(--paper-rgb), .46));
  --progress-track: rgba(var(--ink-rgb), .1);
  --progress-fill: rgba(var(--ink-rgb), .55);
  --thinking-shimmer: linear-gradient(100deg, var(--ink) 0%, var(--ink) 38%, rgba(var(--ink-rgb), .34) 50%, var(--ink) 62%, var(--ink) 100%);
  --topbar-h: 64px;
  --core-size: 380px;
}

/* Source: home/claude-system.css global grain rule. The fallback matches the
   homepage's --c-grain-opacity, so both pages carry the same grain. */
body::after {
  position: fixed;
  z-index: 95;
  inset: 0;
  background-image: 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='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E");
  background-size: 160px 160px;
  mix-blend-mode: overlay;
  opacity: var(--c-grain-opacity, .06);
  pointer-events: none;
  content: "";
}