/* Setadi deck theme. Shared by every slide. Do not edit from a slide session;
   put slide-specific styles in the slide's own <style> block. */
@import url("https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,500;12..96,700;12..96,800&family=Atkinson+Hyperlegible:ital,wght@0,400;0,700;1,400&family=JetBrains+Mono:wght@400;600&display=swap");

:root {
  --bg: #f6f8fc;
  --paper: #ffffff;
  --grid: #e3e9f3;
  --fg: #142033;
  --muted: #56637a;
  --ink: #1d4ccf;
  --ink-soft: #e4ecff;
  --hi: #ffd84d;
  --on-hi: #1b1b12;
  --line: #cfd8e6;
  --down: #c2402f;
  --good: #1f8a5b;
  --display: "Bricolage Grotesque", "Avenir Next", "Segoe UI", sans-serif;
  --body: "Atkinson Hyperlegible", "Segoe UI", system-ui, sans-serif;
  --mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #0e1520; --paper: #141d2b; --grid: #1a2433; --fg: #e5ebf5; --muted: #9aa8bf;
    --ink: #86abff; --ink-soft: #1b2a4a; --hi: #f2c94c; --on-hi: #1b1b12; --line: #2a3850;
    --down: #ff8a75; --good: #5fd39a;
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --bg: #0e1520; --paper: #141d2b; --grid: #1a2433; --fg: #e5ebf5; --muted: #9aa8bf;
  --ink: #86abff; --ink-soft: #1b2a4a; --hi: #f2c94c; --on-hi: #1b1b12; --line: #2a3850;
  --down: #ff8a75; --good: #5fd39a;
  color-scheme: dark;
}

* { box-sizing: border-box; }
/* Any rule that sets display (e.g. display: grid) would otherwise override the hidden attribute. */
[hidden] { display: none !important; }
html, body { height: 100%; margin: 0; }
body {
  background: var(--bg);
  color: var(--fg);
  font: 28px/1.4 var(--body);
  overflow: hidden;
  display: grid;
  /* Track must equal the viewport, or it grows to 1600px and the scaled stage drifts right. */
  grid-template: 100% / 100%;
  place-items: center;
}

/* Fixed 1600x900 design canvas, scaled to fit by stage.js. Design in these pixels. */
.stage {
  width: 1600px;
  height: 900px;
  position: relative;
  flex: none;
  transform-origin: center center;
  background-color: var(--bg);
  background-image:
    linear-gradient(var(--grid) 1px, transparent 1px),
    linear-gradient(90deg, var(--grid) 1px, transparent 1px);
  background-size: 40px 40px;
  overflow: hidden;
}

/* Shared slide furniture */
.kicker { position: absolute; left: 80px; top: 56px; font: 600 20px/1 var(--mono); letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink); }
.title { position: absolute; left: 80px; top: 92px; margin: 0; font: 800 64px/1.05 var(--display); letter-spacing: -0.02em; max-width: 1300px; text-wrap: balance; }
.label { font: 600 22px/1.2 var(--body); }
.tag { font: 600 16px/1 var(--mono); letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted); }
.hl { background: var(--hi); color: var(--on-hi); padding: 0 8px; border-radius: 6px; }
.brandmark { position: absolute; right: 80px; bottom: 48px; font: 800 26px/1 var(--display); color: var(--muted); }
.brandmark span { background: var(--hi); color: var(--on-hi); padding: 0 5px; border-radius: 4px; }

svg text { fill: var(--fg); font-family: var(--body); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.001s !important; transition-duration: 0.001s !important; }
}
