:root {
  --bg: #f4efe6;
  --surface: #fffaf1;
  --ink: #171411;
  --muted: #6f675f;
  --line: rgba(23, 20, 17, .16);
  --accent: #b65a35;
  --accent-2: #1e5d73;
  --font-display: Georgia, 'Noto Serif SC', 'Songti SC', serif;
  --font-body: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Noto Sans SC', sans-serif;
  --font-mono: 'IBM Plex Mono', 'SFMono-Regular', Consolas, monospace;
  --slide-w: 1600px;
  --slide-h: 900px;
}

* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; background: #111; color: var(--ink); font-family: var(--font-body); }
body { overflow: hidden; }
.deck-shell { min-height: 100vh; display: grid; place-items: center; padding: 44px 76px 104px; background: radial-gradient(circle at 20% 0%, rgba(182,90,53,.20), transparent 34%), #111; }
.deck { width: var(--slide-w); height: var(--slide-h); transform-origin: center; position: relative; background: var(--bg); box-shadow: 0 30px 90px rgba(0,0,0,.45); overflow: hidden; }
.slide { position: absolute; inset: 0; display: none; padding: 72px 84px; background: linear-gradient(135deg, var(--surface), var(--bg)); }
.slide.active { display: block; }
.slide::after { content: attr(data-kicker); position: absolute; left: 84px; bottom: 38px; font-family: var(--font-mono); font-size: 13px; letter-spacing: .12em; color: var(--muted); text-transform: uppercase; }
h1, h2, h3, p { margin: 0; }
h1 { font-family: var(--font-display); font-size: clamp(64px, 5.4vw, 88px); line-height: .98; letter-spacing: -.045em; max-width: 1180px; }
h2 { font-family: var(--font-display); font-size: clamp(44px, 4vw, 60px); line-height: 1.04; letter-spacing: -.035em; }
h3 { font-size: 25px; line-height: 1.2; letter-spacing: -.02em; }
p, li { font-size: 24px; line-height: 1.48; }
.lede { font-size: 34px; line-height: 1.28; color: var(--muted); max-width: 920px; }
.meta { font-family: var(--font-mono); font-size: 15px; letter-spacing: .08em; text-transform: uppercase; color: var(--accent); }
.notes { display: none; }
.deck-ui { position: fixed; left: 28px; right: 28px; bottom: 24px; display: flex; align-items: center; gap: 16px; color: rgba(255,255,255,.78); font-family: var(--font-mono); font-size: 13px; z-index: 10; pointer-events: none; }
.deck-ui button { pointer-events: auto; border: 1px solid rgba(255,255,255,.22); background: rgba(255,255,255,.08); color: white; border-radius: 999px; padding: 7px 12px; cursor: pointer; }
.progress { height: 2px; flex: 1; background: rgba(255,255,255,.16); }
.progress span { display: block; height: 100%; width: 0; background: var(--accent); transition: width .25s ease; }
@media print {
  html, body { height: auto; background: white; overflow: visible; }
  .deck-shell { display: block; min-height: auto; padding: 0; background: white; }
  .deck { width: 100%; height: auto; transform: none !important; box-shadow: none; overflow: visible; }
  .slide { position: relative; display: block !important; width: 100vw; height: 56.25vw; page-break-after: always; break-after: page; }
  .deck-ui { display: none; }
}
