/* ============================================================
   opglyph — the chalkboard. GENERATED by tools/gen-worlds.py; edit the spec
   there, not this file.

   Tokens for both themes, then the game's own --op-<role> tokens
   re-pointed at them. Shared scaffolding (card, board, cells, buttons,
   readouts) is in lib/gv-world.css and reads these same tokens.
   ============================================================ */

:root body.gv-world{
  --w-font: 'Kalam', 'Outfit', system-ui, sans-serif;
  --w-radius: 20px;
  --w-bg-0: #0f1f18;
  --w-bg-1: #16291f;
  --w-bg-2: #1e3428;
  --w-bg-3: #274233;
  --w-edge-hi: rgba(255,255,255,.08);
  --w-edge-lo: rgba(0,0,0,.55);
  --w-ink: #f4f1e6;
  --w-dim: #a9bfb0;
  --w-accent: #ffe066;
  --w-accent-hi: #fff3b0;
  --w-accent-lo: #b89a1a;
  --w-accent-ink: #1f1a00;
  --w-accent-text: #ffe680;
  --w-fill-tint: #ffffff;
  --w-good: #8be28f;
  --w-good-text: #8be28f;
  --w-bad: #ff7b7b;
  --w-bad-text: #ff9a9a;
  --w-warn: #ffe066;
  --w-warn-text: #ffe066;
  --w-blue: #8fc9ff;
  --w-violet: #c9a8ff;
  --w-line: rgba(244,241,230,.22);
  --w-line-soft: rgba(244,241,230,.10);
  --w-glow: rgba(255,224,102,.4);
  --w-glow-soft: rgba(255,224,102,.12);
  --w-drop: rgba(0,0,0,.55);
  --w-glow-scale: 1;
  --w-cell: #22392d;
  --w-cell-hi: #2e4a3b;
  --w-cell-lo: #152820;
  --w-cell-br: #4a6b58;
  --w-cell-ink: #f4f1e6;
  --w-hole: rgba(0,0,0,.4);
  --w-texture: radial-gradient(60% 40% at 30% 20%, rgba(255,255,255,.05), transparent 70%), radial-gradient(50% 35% at 75% 80%, rgba(255,255,255,.05), transparent 70%);
  --w-fill-a: #fff3b0;
  --w-fill-b: #ffe066;
}

:root[data-theme="light"] body.gv-world{
  --w-bg-0: #d8e6dc;
  --w-bg-1: #e6f0e9;
  --w-bg-2: #f0f6f2;
  --w-bg-3: #ffffff;
  --w-edge-hi: rgba(255,255,255,.9);
  --w-edge-lo: rgba(20,16,8,.14);
  --w-ink: #16291f;
  --w-dim: #4f6b58;
  --w-accent: #b89a1a;
  --w-accent-hi: #ffe680;
  --w-accent-lo: #7a6408;
  --w-accent-ink: #1f1a00;
  --w-accent-text: #6b5806;
  --w-fill-tint: #0b0f14;
  --w-good: #1a9d54;
  --w-good-text: #0f6b3a;
  --w-bad: #c8402e;
  --w-bad-text: #a3301f;
  --w-warn: #c98a10;
  --w-warn-text: #7a5008;
  --w-blue: #2a63d8;
  --w-violet: #7233c9;
  --w-line: rgba(22,41,31,.28);
  --w-line-soft: rgba(22,41,31,.12);
  --w-glow: rgba(184,154,26,.3);
  --w-glow-soft: rgba(184,154,26,.12);
  --w-drop: rgba(20,16,8,.16);
  --w-glow-scale: 0.5;
  --w-cell: #ffffff;
  --w-cell-hi: #ffffff;
  --w-cell-lo: #e4efe8;
  --w-cell-br: #a8c2b2;
  --w-cell-ink: #16291f;
  --w-hole: rgba(22,41,31,.07);
  --w-texture: radial-gradient(60% 40% at 30% 20%, rgba(22,41,31,.05), transparent 70%), radial-gradient(50% 35% at 75% 80%, rgba(22,41,31,.05), transparent 70%);
  --w-fill-a: #ffe680;
  --w-fill-b: #b89a1a;
}

/* ---- the game's own roles, in this world ---- */
:root body.gv-world{
  --og-green-bg: color-mix(in srgb, var(--w-good) 20%, transparent);
  --og-green-br: color-mix(in srgb, var(--w-good) 62%, transparent);
  --og-locked-bg: color-mix(in srgb, var(--w-ink) 5%, transparent);
  --og-locked-outline: color-mix(in srgb, var(--w-ink) 22%, transparent);
  --og-op-bg: color-mix(in srgb, var(--w-violet) 16%, transparent);
  --og-op-br: color-mix(in srgb, var(--w-violet) 55%, transparent);
  --og-sel-outline: var(--w-accent);
  --og-target-bg: color-mix(in srgb, var(--w-accent) 20%, transparent);
  --og-target-br: color-mix(in srgb, var(--w-accent) 62%, transparent);
  --ogHelpBg: color-mix(in srgb, var(--w-ink) 4%, transparent);
  --og-btn-bg: color-mix(in srgb, var(--w-ink) 6%, transparent);
  --og-btn-bg2: color-mix(in srgb, var(--w-accent) 12%, transparent);
}
:root[data-theme="light"] body.gv-world{
  --og-green-bg: color-mix(in srgb, var(--w-good) 18%, transparent);
  --og-green-br: color-mix(in srgb, var(--w-good) 62%, transparent);
  --og-locked-bg: color-mix(in srgb, var(--w-ink) 5%, transparent);
  --og-locked-outline: color-mix(in srgb, var(--w-ink) 22%, transparent);
  --og-op-bg: color-mix(in srgb, var(--w-violet) 14%, transparent);
  --og-op-br: color-mix(in srgb, var(--w-violet) 55%, transparent);
  --og-sel-outline: var(--w-accent);
  --og-target-bg: color-mix(in srgb, var(--w-accent) 18%, transparent);
  --og-target-br: color-mix(in srgb, var(--w-accent) 62%, transparent);
  --ogHelpBg: color-mix(in srgb, var(--w-ink) 4%, transparent);
  --og-btn-bg: color-mix(in srgb, var(--w-ink) 6%, transparent);
  --og-btn-bg2: color-mix(in srgb, var(--w-accent) 12%, transparent);
}

/* ---- the chalkboard ---- */
:root body.gv-world .gvArcCell{ border-radius: 10px; }
:root body.gv-world .seg{ text-transform: none; font-size: 14px; letter-spacing: .02em; }

/* ---- carried over from the game's earlier skin, re-pointed ---- */
/* The target is the whole objective — it should read as the scoreboard of the
   round, not as another label. */
:root body.gv-world .ogTargetBox{
  border: 1px solid color-mix(in srgb, var(--w-accent) 55%, transparent);
  box-shadow: 0 0 26px color-mix(in srgb, var(--w-accent) calc(28% * var(--w-glow-scale)), transparent);
}
:root body.gv-world .ogTargetVal{
  color: var(--w-accent-text);
  font-weight: 900;
  text-shadow: 0 0 16px color-mix(in srgb, var(--w-accent) calc(100% * var(--w-glow-scale)), transparent);
}
:root body.gv-world .opBtn{
  border: 1px solid var(--w-line);
  color: var(--w-ink);
  transition: transform .12s ease, box-shadow .2s ease, border-color .2s ease;
}
:root body.gv-world .opBtn:active{ transform: scale(.94); }
:root body.gv-world .opBtn.primary{
  background: linear-gradient(180deg, var(--w-fill-a), var(--w-fill-b));
  border-color: transparent;
  color: var(--w-accent-ink);
  font-weight: 900;
  box-shadow: 0 0 24px color-mix(in srgb, var(--w-accent) calc(42% * var(--w-glow-scale)), transparent);
}
:root body.gv-world .tok{ font-weight: 900; }