:root {
  --ink: #061018;
  --ink-2: #0a1822;
  --paper: #f3f5f4;
  --muted: #90a2ad;
  --line: rgba(190, 220, 230, .18);
  --cyan: #19c7d6;
  --magenta: #ed168c;
  --yellow: #ffc62e;
  --white: #f8faf8;
  --ease: cubic-bezier(.22,.8,.2,1);
}

* { box-sizing: border-box; }
html, body { margin: 0; width: 100%; height: 100%; overflow: hidden; background: #02070b; color: var(--white); }
body { font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif; }
button, input { font: inherit; }
button { color: inherit; }

.shell { width: 100vw; height: 100vh; display: grid; place-items: center; background: #02070b; }
.deck-frame { width: min(100vw, calc(100vh * 16 / 9)); height: min(100vh, calc(100vw * 9 / 16)); position: relative; overflow: hidden; box-shadow: 0 0 80px #000; }
.deck { position: absolute; inset: 0; container-type: size; background: var(--ink); }
.slide { position: absolute; inset: 0; padding: 5.2cqh 5.2cqw 8.6cqh; overflow: hidden; opacity: 0; visibility: hidden; transform: translateX(4cqw) scale(.99); transition: opacity .46s var(--ease), transform .62s var(--ease), visibility 0s .62s; background: var(--ink); }
.slide.is-active { opacity: 1; visibility: visible; transform: translateX(0) scale(1); transition-delay: 0s; z-index: 2; }
.slide.is-before { transform: translateX(-4cqw) scale(.99); }
.slide::before { content: ""; position: absolute; inset: 1.6cqh 1.2cqw; border: 1px solid rgba(181,215,228,.15); pointer-events: none; z-index: 0; }
.slide::after { content: ""; position: absolute; width: 34cqw; height: 34cqw; right: -17cqw; top: -20cqw; border: 8cqw solid rgba(237,22,140,.045); border-radius: 50%; pointer-events: none; }
.slide > *:not(.tech-grid) { position: relative; z-index: 1; }
.tech-grid { position: absolute; inset: 0; opacity: .62; pointer-events: none; background-image: linear-gradient(rgba(93,126,139,.11) 1px, transparent 1px), linear-gradient(90deg, rgba(93,126,139,.11) 1px, transparent 1px), radial-gradient(circle at 74% 30%, rgba(25,199,214,.065), transparent 28%); background-size: 8cqw 8cqw, 8cqw 8cqw, 100% 100%; }

.slide-heading { display: grid; grid-template-columns: 3.4cqw 1fr; gap: 1.1cqw; align-items: start; margin-bottom: 4.4cqh; }
.slide-heading.compact { margin-bottom: 2.3cqh; }
.slide-heading h2 { margin: 0; max-width: 84cqw; font-size: clamp(32px, 4.25cqw, 72px); line-height: .98; letter-spacing: -.045em; font-weight: 560; }
.slide-heading > p:not(.section-number) { grid-column: 2; margin: .7cqh 0 0; color: var(--muted); font-size: 1.16cqw; }
.section-number { margin: .55cqh 0 0; font: 700 1.05cqw/1 ui-monospace, SFMono-Regular, Menlo, monospace; color: var(--cyan); letter-spacing: .12em; }
h3, p, ul, blockquote { margin-top: 0; }
.brush-line { font-family: "Brush Script MT", "Segoe Print", cursive; color: var(--cyan); font-size: 4.1cqw; line-height: 1; transform: rotate(-1.4deg); text-shadow: 0 0 30px rgba(25,199,214,.3); }

.slide-cover { display: grid; grid-template-columns: 52% 48%; align-items: center; padding-bottom: 8cqh; }
.slide-cover::after { display: none; }
.cover-copy { padding-left: 2cqw; align-self: center; }
.cover-copy h1 { margin: 0; font-family: Impact, Haettenschweiler, "Arial Black", sans-serif; font-style: italic; font-size: 7.05cqw; line-height: .84; letter-spacing: -.055em; transform: skewX(-5deg); text-shadow: .18cqw .18cqw 0 rgba(25,199,214,.12); }
.cover-copy h1::after { content: ""; display: block; width: 21cqw; height: .7cqh; margin-top: 3cqh; background: linear-gradient(90deg, var(--cyan) 0 33%, var(--magenta) 33% 66%, var(--yellow) 66%); transform: skewX(5deg); }
.cover-copy p { margin: 2.4cqh 0 0; color: #d9e1e5; font-size: 1.44cqw; letter-spacing: .02em; }
.cover-copy em { color: var(--cyan); font-family: "Brush Script MT", "Segoe Print", cursive; font-size: 1.5em; }
.brain-hero { width: 50cqw; max-height: 87cqh; object-fit: contain; margin-left: -4.5cqw; filter: drop-shadow(0 2.5cqh 3cqw rgba(0,0,0,.55)); animation: float 6s ease-in-out infinite; }
.enter-cue { position: absolute !important; right: 3.7cqw; bottom: 5.5cqh; color: #dce3e5; font-size: .95cqw; letter-spacing: .05em; }
@keyframes float { 0%,100% { transform: translateY(0) rotate(.25deg); } 50% { transform: translateY(-1.1cqh) rotate(-.25deg); } }

.engine-composition { min-height: 43cqh; display: grid; grid-template-columns: 1fr .42fr 1fr; gap: 3cqw; align-items: center; }
.engine-copy { max-width: 30cqw; }
.engine-copy h3 { font-size: 2.1cqw; margin-bottom: 1.3cqh; text-transform: uppercase; letter-spacing: .09em; }
.engine-copy p { font-size: 1.52cqw; line-height: 1.45; color: #d6dfe2; }
.engine-copy.fiction h3 { color: var(--cyan); }
.engine-copy.format h3 { color: var(--magenta); }
.engine-mark { width: 15cqw; height: 15cqw; position: relative; display: grid; place-items: center; }
.ring { position: absolute; inset: 0; border: .14cqw solid var(--line); border-radius: 50%; }
.ring-one { border-color: var(--cyan) transparent var(--magenta) transparent; animation: spin 6s linear infinite; }
.ring-two { inset: 2cqw; border-color: transparent var(--yellow) transparent var(--cyan); animation: spin 4s linear infinite reverse; }
.spark { font-size: 6cqw; font-weight: 200; color: var(--white); }
@keyframes spin { to { transform: rotate(360deg); } }
.statement-strip { margin: 2cqh auto 0; max-width: 83cqw; padding: 1.5cqh 2cqw; background: var(--paper); color: #071018; font-size: 1.45cqw; line-height: 1.25; font-weight: 720; text-align: center; box-shadow: -.6cqw .65cqh 0 var(--magenta), .6cqw -.55cqh 0 var(--cyan); transform: rotate(-.2deg); }

.premise-layout { display: grid; grid-template-columns: 43% 1fr; gap: 4cqw; align-items: stretch; }
.profile-file { display: grid; grid-template-columns: 13cqw 1fr; gap: 1.5cqw; align-items: center; padding: 2cqh 1.6cqw; background: rgba(226,235,238,.95); color: #16242b; border-radius: .5cqw; box-shadow: 0 2cqh 5cqw rgba(0,0,0,.25); }
.file-bar { grid-column: 1 / -1; display: flex; justify-content: space-between; font: 700 .85cqw/1 ui-monospace, monospace; letter-spacing: .08em; padding-bottom: 1cqh; border-bottom: 1px solid #8799a1; }
.silhouette { height: 22cqh; display: grid; place-items: center; border: 1px solid #9fb0b7; background: repeating-linear-gradient(0deg, transparent 0 10px, rgba(89,110,119,.11) 10px 11px); }
.silhouette span { width: 6.5cqw; height: 13cqh; background: linear-gradient(#78909a 0 46%, #526873 47%); clip-path: polygon(30% 0,70% 0,83% 18%,82% 42%,70% 55%,86% 67%,94% 100%,6% 100%,14% 67%,30% 55%,18% 42%,17% 18%); opacity: .6; }
.profile-file h3 { font: 750 1.65cqw/1 ui-monospace, monospace; margin-bottom: 1.2cqh; }
.profile-file p { font: 500 1.18cqw/1.35 ui-monospace, monospace; }
.profile-file .critical { color: #94184e; font-weight: 800; }
.torn-copy { display: grid; gap: 2cqh; padding-top: 1cqh; }
.torn-copy article { background: var(--paper); color: #111b20; padding: 1.7cqh 2cqw; clip-path: polygon(0 4%, 4% 0, 10% 3%, 18% 0, 31% 3%, 47% 0, 58% 3%, 74% 0, 89% 2%, 100% 0, 98% 91%, 91% 100%, 77% 96%, 64% 100%, 49% 97%, 37% 100%, 22% 96%, 9% 100%, 0 96%); }
.torn-copy article:first-child { box-shadow: 1cqw 1cqh 0 var(--magenta); }
.torn-copy article:last-child { box-shadow: -1cqw 1cqh 0 var(--yellow); }
.torn-copy h3 { margin-bottom: .6cqh; font: 800 1.35cqw/1 ui-monospace, monospace; text-transform: uppercase; }
.torn-copy p { margin-bottom: 0; font: 500 1.13cqw/1.35 ui-monospace, monospace; }
.premise .brush-line { margin: 2.3cqh 0 0 1cqw; }

.world-columns { height: 59cqh; display: grid; grid-template-columns: 1fr .5cqw 1fr; align-items: stretch; gap: 2.3cqw; }
.world-seam { background: linear-gradient(var(--cyan), var(--magenta), var(--yellow)); transform: rotate(2deg); box-shadow: 0 0 3cqw rgba(237,22,140,.45); }
.world { padding: 2.2cqh 2cqw; position: relative; }
.world h3 { font-size: 2.5cqw; text-transform: uppercase; letter-spacing: .02em; }
.world ul { list-style: none; padding: 0; margin: 0; }
.world li { padding: 1.3cqh 0; border-bottom: 1px solid var(--line); font-size: 1.72cqw; }
.world p { position: absolute; bottom: 1cqh; left: 2cqw; margin: 0; font-family: "Brush Script MT", "Segoe Print", cursive; font-size: 2.35cqw; }
.waking { background: rgba(127,154,164,.08); border: 1px solid rgba(166,195,205,.22); }
.waking h3, .waking p { color: #d7e2e6; }
.dreaming { background: var(--paper); color: #10181d; box-shadow: 1.4cqw 1.4cqh 0 rgba(237,22,140,.78); transform: rotate(-.55deg); }
.dreaming h3 { font-family: "Brush Script MT", "Segoe Print", cursive; font-size: 3.2cqw; color: #0a151a; }
.dreaming li { border-color: rgba(0,0,0,.16); font-family: "Brush Script MT", "Segoe Print", cursive; font-size: 2.1cqw; }
.dreaming p { color: var(--magenta); }

.loop-viz { height: 62cqh; position: relative; }
.loop-arrows { position: absolute; inset: 2cqh 10cqw 4cqh; width: 72cqw; height: 48cqh; overflow: visible; }
.loop-arrows path { fill: none; stroke: #536875; stroke-width: 22; stroke-linecap: round; stroke-dasharray: 12 10; opacity: .7; }
.loop-node { position: absolute; left: var(--x); top: var(--y); transform: translate(-50%,-50%); width: 11cqw; height: 11cqw; border-radius: 50%; border: 1px solid #708591; background: #0c1a23; cursor: pointer; display: grid; place-items: center; align-content: center; gap: .5cqh; padding: 1cqw; transition: .25s var(--ease); box-shadow: 0 1cqh 2cqw rgba(0,0,0,.35); }
.loop-node:hover, .loop-node:focus-visible { border-color: var(--cyan); transform: translate(-50%,-50%) scale(1.04); }
.loop-node.active { border-color: transparent; box-shadow: 0 0 0 .35cqw #0b1921, 0 0 0 .7cqw var(--cyan), 0 0 4cqw rgba(25,199,214,.28); }
.loop-node b { color: var(--yellow); font: 800 1.1cqw/1 ui-monospace, monospace; }
.loop-node span { font-size: .95cqw; line-height: 1.05; text-align: center; }
.loop-detail { position: absolute; left: 50%; top: 47%; transform: translate(-50%,-50%); width: 27cqw; min-height: 12cqh; padding: 1.7cqh 1.5cqw; background: var(--paper); color: #111b20; text-align: center; clip-path: polygon(2% 0,98% 3%,100% 92%,94% 100%,2% 97%,0 8%); box-shadow: 0 0 5cqw rgba(0,0,0,.5); }
.loop-detail strong { display: block; color: #0a2029; font-size: 1.35cqw; margin-bottom: .8cqh; }
.loop-detail span { font-size: 1.02cqw; line-height: 1.35; }

.infinity { background: radial-gradient(circle at 25% 65%, rgba(25,199,214,.12), transparent 28%), var(--ink); }
.dream-machine { position: absolute !important; left: 6cqw; bottom: 10cqh; width: 52cqw; height: 56cqh; display: grid; place-items: center; }
.dream-orbit { position: absolute; inset: 0; }
.dream-orbit::before, .dream-orbit::after, .dream-orbit span { content: ""; position: absolute; border: 1px solid rgba(151,181,192,.22); border-radius: 50%; inset: 3cqw; animation: spin 16s linear infinite; }
.dream-orbit::after { inset: 7cqw; animation-direction: reverse; }
.dream-orbit span:nth-child(1) { width: 1.2cqw; height: 1.2cqw; inset: auto; left: 9%; top: 54%; background: var(--cyan); border: 0; box-shadow: 0 0 2cqw var(--cyan); }
.dream-orbit span:nth-child(2) { width: .9cqw; height: .9cqw; inset: auto; right: 14%; top: 21%; background: var(--magenta); border: 0; }
.dream-orbit span:nth-child(3) { width: .7cqw; height: .7cqw; inset: auto; right: 10%; bottom: 22%; background: var(--yellow); border: 0; }
.dream-card { width: 32cqw; min-height: 21cqh; padding: 2.4cqh 2.2cqw; background: var(--paper); color: #10191e; transform: rotate(-1deg); box-shadow: 1cqw 1cqh 0 var(--magenta), -1cqw -.8cqh 0 var(--cyan); transition: transform .32s var(--ease), opacity .2s; }
.dream-card.is-shuffling { transform: rotate(2deg) scale(.95); opacity: .35; }
.dream-label { font: 700 .9cqw/1 ui-monospace, monospace; letter-spacing: .08em; text-transform: uppercase; color: #4a5e67; }
.dream-card h3 { margin: 1.3cqh 0; font-family: "Brush Script MT", "Segoe Print", cursive; font-size: 3.15cqw; line-height: .92; color: #10191e; }
.dream-card > p:last-child { margin-bottom: 0; font-size: 1.05cqw; line-height: 1.35; }
.action-button { position: absolute; bottom: 1cqh; border: 0; background: var(--cyan); color: #061018; padding: 1.1cqh 1.4cqw; font-size: .95cqw; font-weight: 800; cursor: pointer; box-shadow: .45cqw .45cqh 0 var(--magenta); transition: transform .2s; }
.action-button:hover { transform: translateY(-.4cqh); }
.infinity-copy { position: absolute !important; right: 7cqw; top: 29cqh; width: 30cqw; }
.infinity-copy p { font-size: 1.45cqw; line-height: 1.45; color: #d5dfe2; }
.infinity-copy p:first-child { font-size: 1.8cqw; font-weight: 720; color: var(--white); }

.gauge-area { position: absolute !important; left: 7cqw; top: 24cqh; width: 43cqw; display: grid; place-items: center; }
.gauge { width: 25cqw; height: 25cqw; border-radius: 50%; padding: 1.2cqw; background: conic-gradient(from 220deg, #73848d 0 25%, var(--yellow) 25% 48%, var(--magenta) 48% 72%, transparent 72%); box-shadow: inset 0 0 0 .8cqw #c5ced1, 0 2cqh 4cqw rgba(0,0,0,.5); transform: rotate(-10deg); }
.gauge-face { width: 100%; height: 100%; border-radius: 50%; display: grid; place-items: center; position: relative; background: radial-gradient(circle, #eef2f2 0 55%, #b9c3c7 56% 65%, #263743 66%); }
.gauge-label { color: #263743; text-align: center; text-transform: uppercase; font-weight: 900; font-size: 1.7cqw; line-height: .9; }
.needle { position: absolute; width: 9cqw; height: .45cqh; left: 50%; top: 50%; transform-origin: 0 50%; transform: rotate(calc(-130deg + var(--level) * 2.35deg)); background: #a62328; clip-path: polygon(0 30%,100% 0,100% 100%,0 70%); transition: transform .25s ease-out; }
.needle::after { content: ""; position: absolute; left: -.65cqw; top: -.6cqw; width: 1.4cqw; height: 1.4cqw; border-radius: 50%; background: #2a3337; }
.gauge-control { width: 31cqw; margin-top: 2cqh; display: grid; gap: .8cqh; color: var(--muted); text-align: center; font-size: .9cqw; }
.gauge-control input { accent-color: var(--magenta); }
.jordan-copy { position: absolute !important; right: 6cqw; top: 23cqh; width: 39cqw; }
.jordan-copy > p { padding: 1.3cqh 0; margin: 0; border-bottom: 1px solid var(--line); color: #d5dee1; font-size: 1.24cqw; line-height: 1.35; }
.jordan-copy strong { display: inline-block; width: 8cqw; color: var(--cyan); font: 800 .93cqw/1 ui-monospace, monospace; text-transform: uppercase; letter-spacing: .06em; }
.jordan-copy blockquote { margin: 3cqh 0 0; padding: 1.5cqh 1.4cqw; background: var(--paper); color: #111b20; font-family: "Brush Script MT", "Segoe Print", cursive; font-size: 1.8cqw; line-height: 1.1; transform: rotate(-.7deg); box-shadow: .6cqw .6cqh 0 var(--yellow); }

.character-map { position: relative; width: 82cqw; height: 58cqh; margin: 0 auto; }
.character-map::before, .character-map::after { content: ""; position: absolute; left: 50%; top: 47%; width: 57cqw; height: .25cqh; transform: translate(-50%,-50%) rotate(25deg); background: linear-gradient(90deg, var(--cyan), var(--yellow), var(--magenta)); opacity: .7; }
.character-map::after { transform: translate(-50%,-50%) rotate(-25deg); }
.jordan-core { position: absolute; left: 50%; top: 42%; transform: translate(-50%,-50%); width: 12cqw; height: 12cqw; border-radius: 50%; display: grid; place-items: center; text-align: center; background: var(--paper); color: #14242b; font-size: 1.7cqw; line-height: 1; box-shadow: 0 0 0 .7cqw #344955, 0 0 4cqw rgba(25,199,214,.2); z-index: 2; }
.character-chip { position: absolute; width: 18cqw; min-height: 9cqh; border: 1px solid #536b77; background: rgba(9,23,31,.92); padding: 1cqh 1cqw; cursor: pointer; transition: .2s; z-index: 2; }
.character-chip:nth-of-type(1) { left: 5%; top: 4%; }
.character-chip:nth-of-type(2) { right: 5%; top: 4%; }
.character-chip:nth-of-type(3) { left: 5%; top: 57%; }
.character-chip:nth-of-type(4) { right: 5%; top: 57%; }
.character-chip span { display: block; font-size: 1.25cqw; font-weight: 720; }
.character-chip small { color: var(--muted); font: 700 .8cqw/1 ui-monospace, monospace; text-transform: uppercase; letter-spacing: .09em; }
.character-chip:hover, .character-chip.active { border-color: var(--cyan); transform: translateY(-.4cqh); box-shadow: .5cqw .5cqh 0 var(--magenta); }
.character-detail { position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); width: 46cqw; min-height: 11cqh; padding: 1.4cqh 1.5cqw; background: var(--paper); color: #111b20; z-index: 3; text-align: center; }
.character-detail strong { font-size: 1.2cqw; }
.character-detail p { margin: .6cqh 0 0; font-size: .96cqw; line-height: 1.3; }

.case-files { display: grid; grid-template-columns: 1fr 1fr; gap: 4cqw; margin-top: 3cqh; }
.case-file { min-height: 50cqh; padding: 2.4cqh 2cqw; border: 1px solid #415766; background: rgba(5,16,24,.82); position: relative; overflow: hidden; }
.case-file::after { content: ""; position: absolute; width: 13cqw; height: 13cqw; border-radius: 50%; right: -6cqw; bottom: -7cqw; filter: blur(1cqw); opacity: .55; }
.case-file.cyan { box-shadow: -.7cqw .8cqh 0 var(--cyan); }
.case-file.magenta { box-shadow: .7cqw .8cqh 0 var(--magenta); }
.case-file.cyan::after { background: var(--cyan); }
.case-file.magenta::after { background: var(--magenta); }
.case-file > p { color: var(--muted); font: 700 .8cqw/1 ui-monospace, monospace; letter-spacing: .1em; }
.case-file h3 { font: 500 2cqw/1 ui-monospace, monospace; }
.case-file ul { padding-left: 1.5cqw; color: #d9e1e4; font-size: 1.3cqw; line-height: 1.4; }
.case-file li { margin-bottom: 1.6cqh; }
.case-file blockquote { margin: 4cqh 0 0; font-family: "Brush Script MT", "Segoe Print", cursive; font-size: 2.25cqw; line-height: 1.05; }
.cyan blockquote { color: var(--cyan); }.magenta blockquote { color: var(--magenta); }

.pilot-chart { position: relative; height: 60cqh; margin-top: -1cqh; }
.pilot-chart svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.chart-grid { fill: none; stroke: rgba(160,187,198,.14); stroke-width: 1; }
.chart-line { fill: none; stroke: #879ba5; stroke-width: 15; stroke-linejoin: bevel; }
.pilot-point { position: absolute; left: var(--x); top: var(--y); transform: translate(-50%,-50%); width: 2.7cqw; height: 2.7cqw; border-radius: 50%; border: .25cqw solid #182935; background: #9cacb4; color: #071018; font-weight: 900; cursor: pointer; transition: .2s; }
.pilot-point.active { background: var(--yellow); box-shadow: 0 0 0 .35cqw rgba(255,198,46,.2), 0 0 2cqw rgba(255,198,46,.4); transform: translate(-50%,-50%) scale(1.16); }
.pilot-detail { position: absolute; right: 5cqw; top: 0; width: 32cqw; padding: 1.6cqh 1.5cqw; background: var(--paper); color: #111b20; box-shadow: .7cqw .8cqh 0 var(--magenta); }
.pilot-detail > p { margin-bottom: .7cqh; font: 800 .8cqw/1 ui-monospace, monospace; text-transform: uppercase; letter-spacing: .08em; color: #596971; }
.pilot-detail h3 { margin-bottom: .6cqh; font-size: 1.5cqw; }
.pilot-detail span { font-size: 1cqw; line-height: 1.3; }

.durable-layout { display: grid; grid-template-columns: 44% 1fr; gap: 4cqw; align-items: center; height: 59cqh; }
.fractured-face { position: relative; height: 47cqh; filter: drop-shadow(0 2cqh 3cqw rgba(0,0,0,.4)); }
.fractured-face::before, .fractured-face span { content: ""; position: absolute; border-radius: 48% 48% 44% 44%; background: var(--paper); }
.fractured-face::before { width: 18cqw; height: 38cqh; left: 12cqw; top: 3cqh; transform: rotate(-5deg); box-shadow: inset 2cqw -1cqw 0 rgba(23,45,55,.1), .8cqw .8cqh 0 var(--cyan); }
.fractured-face span:nth-child(1) { width: 12cqw; height: 28cqh; left: 1cqw; top: 11cqh; transform: rotate(-18deg); box-shadow: .8cqw .8cqh 0 var(--magenta); }
.fractured-face span:nth-child(2) { width: 12cqw; height: 28cqh; right: 1cqw; top: 11cqh; transform: rotate(18deg); box-shadow: -.8cqw .8cqh 0 var(--yellow); }
.fractured-face span:nth-child(3) { width: 12cqw; height: 12cqw; left: 14cqw; top: 14cqh; background: radial-gradient(circle, var(--magenta), var(--yellow) 38%, var(--cyan) 68%, #111 70%); clip-path: polygon(50% 0,62% 33%,100% 20%,72% 50%,100% 80%,62% 67%,50% 100%,38% 67%,0 80%,28% 50%,0 20%,38% 33%); }
.durable-copy article { padding: 1.3cqh 0; border-bottom: 1px solid var(--line); }
.durable-copy h3 { margin-bottom: .5cqh; color: var(--cyan); font-size: 1.45cqw; }
.durable-copy p { font-size: 1.16cqw; color: #cfdbdf; }
.durable-copy .big-proof { margin-top: 3cqh; padding: 1.4cqh 1.6cqw; background: var(--paper); color: #111b20; font-size: 1.55cqw; font-weight: 850; box-shadow: 1cqw 1cqh 0 var(--magenta); transform: rotate(-.8deg); }

.close { display: grid; grid-template-columns: 46% 1fr; align-items: center; }
.close::after { display: none; }
.brain-close { width: 48cqw; max-height: 84cqh; object-fit: contain; margin-left: -6cqw; filter: drop-shadow(0 2cqh 4cqw #000); }
.close-copy { padding-right: 3cqw; }
.close-copy h2 { margin: 0; font-size: 4.1cqw; line-height: .99; letter-spacing: -.045em; }
.close-copy > p { margin: 2.6cqh 0 5cqh; color: var(--muted); font-size: 1.5cqw; }
.closing-mark { border-top: 1px solid var(--line); padding-top: 2cqh; display: grid; gap: .8cqh; }
.closing-mark strong { font-family: Impact, "Arial Black", sans-serif; font-style: italic; font-size: 2cqw; letter-spacing: -.03em; }
.closing-mark span { color: #b7c4c9; font-size: .95cqw; }

.chrome { position: absolute; z-index: 20; left: 3.2cqw; right: 3.2cqw; bottom: 2.2cqh; display: grid; grid-template-columns: auto auto 1fr auto auto auto auto; gap: .75cqw; align-items: center; opacity: .8; transition: opacity .2s; }
.chrome:hover, .chrome:focus-within { opacity: 1; }
.icon-button { width: 2.45cqw; height: 2.45cqw; min-width: 30px; min-height: 30px; border: 1px solid rgba(180,208,218,.28); background: rgba(6,16,24,.72); display: grid; place-items: center; cursor: pointer; border-radius: 50%; backdrop-filter: blur(10px); }
.icon-button:hover, .icon-button:focus-visible { border-color: var(--cyan); }
.icon-button svg { width: 1.25cqw; height: 1.25cqw; min-width: 16px; min-height: 16px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.progress { height: 2.2cqw; min-height: 28px; display: flex; align-items: center; gap: .45cqw; padding: 0 .7cqw; }
.progress button { width: 2.2cqw; height: .32cqh; min-width: 16px; border: 0; padding: 0; background: #465b66; cursor: pointer; transition: .25s; }
.progress button.active { background: var(--cyan); width: 3.6cqw; box-shadow: 0 0 1cqw rgba(25,199,214,.5); }
.progress button.past { background: #8b9ca3; }
.slide-count { font: 700 .76cqw/1 ui-monospace, monospace; color: #aebcc2; min-width: 4.8cqw; text-align: center; }
.notes-panel { position: absolute; z-index: 19; left: 5cqw; right: 5cqw; bottom: 7.5cqh; padding: 1.4cqh 1.4cqw; background: rgba(3,10,15,.94); border: 1px solid #49606b; color: #d9e1e4; font-size: 1cqw; line-height: 1.4; transform: translateY(2cqh); opacity: 0; pointer-events: none; transition: .2s; }
.notes-panel.open { transform: translateY(0); opacity: 1; }
.speaker-notes { display: none; }

.overview { position: absolute; z-index: 40; inset: 0; display: grid; place-items: center; background: rgba(1,6,10,.84); backdrop-filter: blur(16px); opacity: 0; visibility: hidden; transition: .25s; }
.overview.open { opacity: 1; visibility: visible; }
.overview-panel { width: 84cqw; max-height: 78cqh; padding: 2.6cqh 2.2cqw; background: #0b1821; border: 1px solid #425863; overflow: auto; }
.overview-panel header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 2cqh; }
.overview-panel h2 { margin: 0; font-size: 2cqw; }
.overview-panel header button { border: 1px solid #5f737c; background: transparent; padding: .8cqh 1cqw; cursor: pointer; }
.overview-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 1cqw; }
.overview-grid button { min-height: 12cqh; padding: 1.2cqh 1cqw; border: 1px solid #344b57; background: #07131b; text-align: left; cursor: pointer; }
.overview-grid button:hover, .overview-grid button.active { border-color: var(--cyan); box-shadow: inset .35cqw 0 0 var(--magenta); }
.overview-grid span { display: block; color: var(--cyan); font: 700 .7cqw/1 ui-monospace, monospace; margin-bottom: .8cqh; }
.overview-grid strong { font-size: .95cqw; }

@media (max-aspect-ratio: 4/3) {
  .slide { padding-left: 4.4cqw; padding-right: 4.4cqw; }
}
@media (max-width: 900px) {
  .enter-cue, #notesButton { display: none; }
  .chrome { grid-template-columns: auto auto 1fr auto auto auto; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
}