@font-face{font-family:Assistant;src:url('assets/fonts/assistant-400.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:Assistant;src:url('assets/fonts/assistant-500.ttf') format('truetype');font-weight:500;font-display:swap}
@font-face{font-family:Assistant;src:url('assets/fonts/assistant-600.ttf') format('truetype');font-weight:600;font-display:swap}
@font-face{font-family:Assistant;src:url('assets/fonts/assistant-700.ttf') format('truetype');font-weight:700;font-display:swap}
@font-face{font-family:Assistant;src:url('assets/fonts/assistant-800.ttf') format('truetype');font-weight:800;font-display:swap}

:root{--p:#7050A8;--pd:#4B326F;--pl:#F2EEF7;--paper:#FAF9FC;--white:#fff;--ink:#211a2b;--muted:#5f5669;--line:#e0d8e8;--soft:#bda9d1;--night:#1b1128;--shadow:0 22px 60px rgba(75,50,111,.13)}
*{box-sizing:border-box}
html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#120b1b;color:var(--ink);font-family:Assistant,sans-serif}
button{font-family:Assistant,sans-serif}
h1,h2,h3,p,ul,ol{margin:0;padding:0}
svg text{font-family:Assistant,sans-serif}

/* Fixed 1600x900 stage scaled to any display */
.stage{position:absolute;left:50%;top:50%;width:1600px;height:900px;transform:translate(-50%,-50%);transform-origin:center;overflow:hidden;background:var(--paper)}
.deck{position:absolute;inset:0;background:radial-gradient(circle at 8% 10%,rgba(112,80,168,.11),transparent 30%),linear-gradient(180deg,#fff,var(--paper))}
.slide{position:absolute;inset:0;opacity:0;pointer-events:none;transition:opacity .28s ease;overflow:hidden;cursor:pointer}
.slide.is-active{opacity:1;pointer-events:auto}
.slide.dark{background:radial-gradient(circle at 18% 14%,rgba(150,103,214,.32),transparent 32%),linear-gradient(145deg,#241536,#110b18);color:#fff}
.s{position:absolute;inset:92px 76px 74px}

/* Progressive reveal */
[data-step]{opacity:0;transform:translateY(10px);transition:opacity .35s ease,transform .35s ease}
[data-step].on{opacity:1;transform:none}

/* Type scale: nothing instructional below 20px, labels at least 18px */
.kick{font-size:21px;font-weight:800;color:var(--p);margin-bottom:10px}
.dark .kick{color:#d6c0ee}
h1{font-size:60px;line-height:1.08;font-weight:800;letter-spacing:-.02em;color:var(--ink)}
.dark h1{color:#fff}
h1 em{font-style:normal;color:var(--p)}
.dark h1 em{color:#d3b8ef}
.lead{font-size:29px;line-height:1.42;color:var(--muted);font-weight:500}
.dark .lead{color:#ddd2e4}
.q{display:inline-flex;align-items:center;gap:14px;font-size:32px;line-height:1.25;font-weight:800;color:var(--pd);padding:16px 26px;background:var(--pl);border-radius:18px;border-inline-start:7px solid var(--p)}
.dark .q{background:rgba(255,255,255,.1);color:#fff;border-color:#c9a8ee}
.q::before{content:'?';flex:none;width:44px;height:44px;border-radius:50%;background:var(--p);color:#fff;display:grid;place-items:center;font-size:28px}
.takeaway{font-size:30px;line-height:1.3;font-weight:800;color:var(--pd)}
.dark .takeaway{color:#fff}
.arr{color:var(--p);font-weight:800;font-style:normal;font-size:28px}
.dark .arr{color:#c9a8ee}

/* Chrome */
.topbar{position:absolute;z-index:30;top:20px;left:28px;right:28px;display:flex;justify-content:space-between;align-items:center;pointer-events:none}
.college-brand{display:flex;align-items:center;gap:11px;color:var(--ink);pointer-events:auto}
.college-brand img{width:46px;height:46px}
.college-brand span{display:flex;flex-direction:column;line-height:1.15}
.college-brand b{font-size:18px}
.college-brand small{font-size:15px;color:var(--muted)}
.dark-slide .college-brand{color:#fff}
.dark-slide .college-brand small{color:#d2c7da}
.top-actions{display:flex;gap:8px;pointer-events:auto}
.top-actions button,.close{width:42px;height:42px;border-radius:50%;border:1px solid #ded5e8;background:rgba(255,255,255,.92);color:var(--pd);cursor:pointer;font-size:17px}
.controls{position:absolute;z-index:30;bottom:14px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:12px;padding:5px;border:1px solid #ded5e8;border-radius:999px;background:rgba(255,255,255,.95);box-shadow:0 10px 28px rgba(75,50,111,.14)}
.controls button{border:0;background:transparent;color:var(--muted);padding:7px 16px;border-radius:999px;font-size:16px;cursor:pointer}
.controls button.primary{background:var(--p);color:#fff;font-weight:800}
.controls button:disabled{opacity:.25;cursor:default}
.counter{min-width:64px;text-align:center;font-size:16px;font-variant-numeric:tabular-nums;color:var(--ink);direction:ltr;display:flex;flex-direction:row-reverse;justify-content:center;gap:4px}
.progress-track{position:absolute;z-index:31;bottom:0;left:0;right:0;height:4px;background:#ece6f1}
.progress-track div{height:100%;width:0;background:linear-gradient(270deg,#ad92cf,var(--p));margin-inline-start:0;transition:width .25s}

.notes-drawer{position:fixed;z-index:50;top:0;bottom:0;left:0;width:min(520px,94vw);background:#fff;color:var(--ink);box-shadow:var(--shadow);padding:60px 34px 34px;overflow:auto;transform:translateX(-103%);transition:.28s}
.notes-drawer.open{transform:none}
.notes-drawer .close{position:absolute;top:16px;left:16px}
.notes-drawer h2{font-size:30px;margin:6px 0 18px}
.notes-drawer h3{font-size:16px;color:var(--p);margin:20px 0 5px}
.notes-drawer p,.notes-drawer li{font-size:18px;line-height:1.6}
.notes-drawer ul{padding-inline-start:20px}
.notes-drawer .kicker{font-size:16px;font-weight:800;color:var(--p)}

/* 01 title */
.t-title{display:grid;grid-template-columns:1fr 560px;gap:50px;align-items:center}
.t-title h1{font-size:136px;line-height:.98}
.t-title .lead{margin-top:30px;font-size:33px;max-width:760px}
.t-title .meta{margin-top:26px;font-size:22px;font-weight:600;color:#cdbfe0}
.rings{position:relative;width:560px;height:560px}
.rings i{position:absolute;border-radius:50%;border:2px solid rgba(201,168,238,.5)}
.rings i:nth-of-type(1){inset:0;border-color:rgba(201,168,238,.3)}
.rings i:nth-of-type(2){inset:95px;border-color:rgba(201,168,238,.55)}
.rings i:nth-of-type(3){inset:190px;background:rgba(201,168,238,.14);border-color:#c9a8ee}
.rings img{position:absolute;inset:232px;width:96px;height:96px}
.rings span{position:absolute;left:50%;transform:translate(-50%,-50%);padding:6px 18px;border-radius:999px;background:#2c1c40;font-size:22px;font-weight:700;color:#eadff5;white-space:nowrap}
.rings .r1{top:0}.rings .r2{top:95px}.rings .r3{top:190px}

/* 02 chain */
.chain h1{max-width:1250px}
.wave{position:relative;height:440px;margin-top:22px}
.wave svg{position:absolute;inset:0;width:100%;height:100%}
.wave svg path{fill:none;stroke:var(--soft);stroke-width:4;stroke-dasharray:3 13;stroke-linecap:round}
.nodes{position:absolute;inset:0;display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.node{display:flex;flex-direction:column;align-items:center;text-align:center}
.node:nth-child(odd){padding-top:140px}
.node:nth-child(even){padding-top:0}
.node b{width:74px;height:74px;border-radius:50%;display:grid;place-items:center;font-size:32px;font-weight:800;background:linear-gradient(145deg,var(--p),var(--pd));color:#fff;box-shadow:0 0 0 12px rgba(112,80,168,.1);margin-bottom:22px}
.node strong{font-size:29px;line-height:1.15;color:var(--pd);font-weight:800}
.node span{font-size:22px;line-height:1.3;color:var(--muted);margin-top:8px}
.chain .takeaway{margin-top:0}

/* 03 story opening */
.split-roof{display:grid;grid-template-columns:1fr 720px;gap:60px;align-items:center}
.split-roof h1{font-size:64px;margin-bottom:22px}
.split-roof .q{margin-top:28px}
.roof-frame{border-radius:26px;overflow:hidden;box-shadow:var(--shadow);background:#fff;border:1px solid var(--line)}
.roof-frame svg{display:block;width:100%;height:auto}

/* 04 purpose */
.purpose{display:grid;grid-template-rows:auto 1fr auto;gap:26px}
.purpose-split{display:grid;grid-template-columns:.8fr 1.2fr;gap:0;border-radius:30px;overflow:hidden;box-shadow:var(--shadow);min-height:390px;position:relative;background:#fff}
.purpose-split::after{content:"?";position:absolute;left:30%;top:50%;transform:translate(-50%,-50%);font-size:200px;font-weight:800;color:var(--pl);z-index:0}
.purpose-split>.real{position:relative;z-index:1}
.purpose-split>div{padding:42px 46px;display:flex;flex-direction:column;justify-content:center}
.seen{background:var(--pl)}
.seen small,.real small{font-size:22px;font-weight:800}
.seen small{color:var(--p)}
.seen strong{font-size:68px;line-height:1.05;margin-top:14px;color:var(--pd)}
.real{background:linear-gradient(145deg,var(--p),var(--pd));color:#fff}
.real small{color:#e5d8f1}
.real-chain{display:flex;align-items:center;gap:16px;margin-top:22px;flex-wrap:nowrap}
.real-chain b{font-size:40px;line-height:1.12;font-weight:800;text-align:center;flex:1}
.real-chain i{font-style:normal;font-size:44px;color:#d9c3f0}
.purpose .takeaway{text-align:center;font-size:36px}

/* 05 bucket and cart */
.haul{display:grid;grid-template-rows:auto auto 1fr;gap:20px}
.haul-rows{display:grid;gap:18px}
.haul-row{display:grid;grid-template-columns:330px 1fr;align-items:center;gap:30px;padding:16px 30px;border-radius:24px;background:#fff;border:1px solid var(--line);min-height:206px}
.haul-row.new{background:var(--pl);border-color:var(--soft)}
.haul-row h2{font-size:38px;line-height:1.1;color:var(--pd)}
.haul-row p{font-size:24px;line-height:1.3;color:var(--muted);margin-top:8px}
.haul-row svg{width:100%;height:170px;display:block}

/* 06 expressive typography */
.bigtype{display:grid;grid-template-rows:auto 1fr auto;gap:18px}
.bigtype-lines{display:grid;gap:18px;align-content:center}
.bigtype-line{display:grid;grid-template-columns:1fr auto;align-items:baseline;gap:40px;padding-bottom:18px;border-bottom:2px solid var(--line)}
.bigtype-line .from{font-size:60px;font-weight:500;color:#8b8096}
.bigtype-line .to{font-size:96px;line-height:1;font-weight:800;color:var(--p)}
.bigtype-line p{grid-column:1/-1;font-size:27px;color:var(--muted);line-height:1.3;margin-top:-6px}

/* 07 roof plan */
.plan{display:grid;grid-template-columns:440px 1fr;gap:44px;align-items:center}
.plan h1{font-size:52px;margin:0 0 20px}
.plan .answer{margin-top:24px;font-size:30px;line-height:1.3;font-weight:700;color:var(--pd)}

/* 08 brush */
.brush{display:grid;grid-template-rows:auto 1fr auto;gap:12px}
.brush-stage{position:relative}
.brush-stage svg{position:absolute;inset:0;width:100%;height:100%}
.callout{position:absolute;width:300px;text-align:center}
.callout b{display:block;font-size:40px;color:var(--p);font-weight:800}
.callout span{font-size:24px;color:var(--muted);line-height:1.25}

/* 09 result */
.result{display:grid;grid-template-columns:1fr 520px;gap:50px;align-items:stretch}
.result-left{display:flex;flex-direction:column;justify-content:center;gap:22px}
.ribbon{display:flex;align-items:center;gap:10px}
.ribbon span{padding:10px 16px;border-radius:12px;background:var(--pl);color:var(--pd);font-size:23px;font-weight:700;white-space:nowrap}
.ribbon i{font-style:normal;color:var(--p);font-size:24px;font-weight:800}
.monument{border-radius:34px;background:linear-gradient(160deg,var(--p),var(--pd));color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:30px;box-shadow:0 30px 80px rgba(112,80,168,.28)}
.monument small{font-size:26px;font-weight:700;color:#e5d8f1}
.monument strong{font-size:170px;line-height:.95;font-weight:800}
.monument span{font-size:36px;font-weight:800}
.monument em{font-style:normal;font-size:25px;margin-top:10px;color:#e5d8f1}
.econ{font-size:31px;line-height:1.3;font-weight:700;color:var(--ink)}

/* 10 lessons */
.lessons{display:grid;grid-template-columns:420px 1fr;gap:60px;align-items:center}
.lessons h1{font-size:66px}
.lesson-list{display:grid}
.lesson-list article{display:grid;grid-template-columns:90px 1fr;gap:16px;padding:18px 0;border-bottom:2px solid var(--line);align-items:start}
.lesson-list article:last-child{border-bottom:0}
.lesson-list b{font-size:62px;line-height:.95;font-weight:800;color:var(--soft)}
.lesson-list h2{font-size:33px;line-height:1.15;color:var(--pd)}
.lesson-list p{font-size:24px;line-height:1.32;color:var(--muted);margin-top:5px}

/* 11 street */
.street{display:grid;grid-template-rows:auto auto 1fr;gap:18px}
.street svg{width:100%;height:270px;display:block}
.street-chain{display:grid;grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;gap:12px;align-items:center}
.street-chain div{text-align:center;padding:16px 12px;border-radius:18px;background:var(--pl);font-size:27px;line-height:1.2;font-weight:800;color:var(--pd)}
.street-chain div:last-child{background:var(--p);color:#fff}
.street-chain i{font-style:normal;font-size:32px;font-weight:800;color:var(--p)}

/* 12 two-sided lesson */
.balance{display:grid;grid-template-rows:auto 1fr auto;gap:22px}
.balance-split{display:grid;grid-template-columns:1fr 92px 1fr;align-items:center}
.balance-split>div{padding:38px 44px;align-self:stretch;display:flex;flex-direction:column;justify-content:center}
.balance-split h2{font-size:42px;line-height:1.12;margin-bottom:18px;color:var(--pd)}
.balance-split p{font-size:27px;line-height:1.35;color:var(--muted);margin-top:8px}
.plus{width:92px;height:92px;border-radius:50%;background:var(--p);color:#fff;display:grid;place-items:center;font-size:58px;font-weight:800;z-index:2}
.balance-a{background:var(--pl);border-radius:30px 0 0 30px}
.balance-b{border:2px solid var(--pl);border-radius:0 30px 30px 0;background:#fff}
[dir=rtl] .balance-a{border-radius:0 30px 30px 0}
[dir=rtl] .balance-b{border-radius:30px 0 0 30px}
.balance .takeaway{text-align:center;font-size:36px}

/* 13 lenses */
.lens{display:grid;grid-template-columns:1fr 640px;gap:40px;align-items:center}
.lens h1{font-size:62px;margin-bottom:18px}
.lens-rows{display:grid;gap:4px;margin-top:18px}
.lens-rows div{display:grid;grid-template-columns:140px 1fr;gap:14px;padding:9px 0;border-bottom:1px solid var(--line);align-items:baseline}
.lens-rows b{font-size:26px;color:var(--p);font-weight:800}
.lens-rows span{font-size:24px;color:var(--ink);line-height:1.25}
.lens .takeaway{font-size:25px;margin-top:16px}
.lens-rings{position:relative;width:640px;height:640px}
.lens-rings i{position:absolute;border-radius:50%;left:50%;bottom:0;transform:translateX(-50%)}
.lens-rings b{position:absolute;left:50%;transform:translateX(-50%);font-size:24px;font-weight:800;white-space:nowrap}

/* 14 prism */
.prism{display:grid;grid-template-rows:auto 1fr;gap:12px}
.prism-body{display:grid;grid-template-columns:400px 160px 1fr;align-items:center}
.complaint{padding:30px;border-radius:26px;background:var(--ink);color:#fff;font-size:42px;line-height:1.15;font-weight:800;text-align:center}
.complaint small{display:block;font-size:22px;font-weight:600;color:#d2c7da;margin-bottom:10px}
.prism-body svg{width:160px;height:560px}
.prism-body svg path{fill:none;stroke:var(--p);stroke-width:3}
.beams{display:grid;gap:14px}
.beams div{display:grid;grid-template-columns:130px 1fr;gap:16px;align-items:center;padding:13px 22px;border-radius:16px;background:var(--pl)}
.beams b{font-size:26px;font-weight:800;color:var(--p)}
.beams span{font-size:27px;line-height:1.2;font-weight:600;color:var(--ink)}

/* 15 depth */
.depth{display:grid;grid-template-columns:520px 1fr;gap:50px;align-items:center}
.depth h1{font-size:60px;margin-bottom:20px}
.depth .lead{font-size:27px}
.layers{border-radius:28px;overflow:hidden;box-shadow:var(--shadow)}
.layers div{padding:30px 40px}
.layers small{display:block;font-size:22px;font-weight:800;margin-bottom:4px}
.layers strong{font-size:40px;line-height:1.1;font-weight:800}
.layers p{font-size:24px;margin-top:6px;line-height:1.25}
.l1{background:#fff;color:var(--ink)}.l1 small{color:var(--p)}.l1 p{color:var(--muted)}
.l2{background:var(--pl);color:var(--pd)}.l2 small{color:var(--p)}.l2 p{color:var(--muted)}
.l3{background:#b39bd2;color:#20142f}.l3 small{color:#2e1d45}
.l4{background:linear-gradient(145deg,var(--p),var(--pd));color:#fff}.l4 small{color:#e5d8f1}

/* 16 loop */
.loop{display:grid;grid-template-columns:400px 1fr;gap:50px;align-items:center}
.loop h1{font-size:60px;margin-bottom:18px}
.loop-map{position:relative;height:720px}
.loop-map>svg{position:absolute;inset:0;width:100%;height:100%}
.loop-core{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:290px;text-align:center}
.loop-core strong{font-size:44px;font-weight:800;color:var(--pd);display:block}
.loop-core span{font-size:24px;line-height:1.25;color:var(--muted)}
.loop-node{position:absolute;width:290px;padding:14px 18px;border-radius:18px;background:#fff;border:1px solid var(--line);box-shadow:0 12px 34px rgba(75,50,111,.09)}
.loop-node b{display:block;font-size:27px;font-weight:800;color:var(--p)}
.loop-node span{font-size:22px;line-height:1.25;color:var(--ink)}

/* 17 complaint collage */
.collage{display:grid;grid-template-rows:1fr auto;gap:20px}
.collage-words{position:relative}
.collage-words span{position:absolute;font-weight:800;line-height:1;color:#fff}
.collage-foot{display:grid;grid-template-columns:1fr auto;gap:30px;align-items:center}
.collage-foot p{font-size:29px;color:#ddd2e4;line-height:1.3}

/* 18 system map */
.sysmap{display:grid;grid-template-rows:auto auto 1fr auto;gap:12px}
.sysmap h1{font-size:50px}
.stages{display:grid;grid-template-columns:150px repeat(5,1fr);gap:8px;align-items:stretch}
.stages div{position:relative;padding:12px 8px;text-align:center;font-size:24px;line-height:1.1;font-weight:800;background:var(--pd);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;clip-path:polygon(100% 0,14px 0,0 50%,14px 100%,100% 100%,calc(100% - 14px) 50%)}
.stages div small{font-size:19px;font-weight:500;color:#e5d8f1}
.stages .empty{background:none;clip-path:none}
.bars{display:grid;grid-template-columns:150px repeat(5,1fr);gap:9px 8px;align-items:center;align-content:start}
.bars b{grid-column:1;font-size:22px;font-weight:700;color:var(--ink);text-align:start}
.bars i{height:36px;border-radius:999px;background:linear-gradient(270deg,var(--p),#a58bcb);display:block}

/* 19 hypotheses */
.hypo{display:grid;grid-template-columns:400px 1fr;gap:44px;align-items:center}
.hypo h1{font-size:52px;margin-bottom:22px}
.reflex{margin-top:18px;font-size:32px;font-weight:800;color:#8b8096;line-height:1.3}
.reflex s{text-decoration-thickness:3px;text-decoration-color:var(--p)}
.hypo-tree{display:grid;grid-template-columns:1fr;gap:12px;border-inline-start:6px solid var(--p);padding-inline-start:26px}
.hypo-tree>small{font-size:23px;font-weight:800;color:var(--p)}
.hypo-tree article{display:grid;grid-template-columns:1fr 1fr;gap:24px;padding:14px 0;border-bottom:1px solid var(--line);align-items:start}
.hypo-tree h2{font-size:31px;line-height:1.2;color:var(--ink)}
.hypo-tree p{font-size:27px;line-height:1.25;color:var(--muted)}
.hypo-tree p b{color:var(--p)}

/* 20 stairs */
.stairs{display:grid;grid-template-rows:auto 1fr;gap:6px}
.stairs h1{font-size:54px}
.steps5{display:grid;grid-template-columns:repeat(5,1fr);gap:0;align-items:end}
.steps5 div{padding:18px 16px;display:flex;flex-direction:column;justify-content:flex-start;border-radius:18px 18px 0 0}
.steps5 strong{font-size:29px;line-height:1.13;font-weight:800}
.steps5 span{font-size:23px;line-height:1.25;margin-top:6px}
.steps5 div:nth-child(1){height:190px;background:#ece6f1;color:#5f5669}
.steps5 div:nth-child(2){height:270px;background:#ddd2ea;color:var(--pd)}
.steps5 div:nth-child(3){height:350px;background:#b39bd2;color:#20142f}
.steps5 div:nth-child(4){height:430px;background:var(--p);color:#fff}
.steps5 div:nth-child(5){height:510px;background:var(--pd);color:#fff}

/* 21 road */
.road{display:grid;grid-template-rows:auto 1fr auto;gap:8px}
.road h1{font-size:54px}
.road-map{position:relative}
.road-map svg{position:absolute;inset:0;width:100%;height:100%}
.road-map svg path{fill:none}
.stop{position:absolute;width:210px;text-align:center;transform:translate(50%,0)}
.stop b{display:grid;place-items:center;width:56px;height:56px;border-radius:50%;margin:0 auto 8px;background:var(--p);color:#fff;font-size:26px;font-weight:800;box-shadow:0 0 0 9px rgba(112,80,168,.12)}
.stop strong{display:block;font-size:26px;line-height:1.14;color:var(--pd);font-weight:800}
.stop span{font-size:21px;line-height:1.2;color:var(--muted)}

/* 22 inside and beyond */
.branch{display:grid;grid-template-columns:.82fr 1.18fr;gap:44px;align-items:stretch}
.branch h1{font-size:50px;margin-bottom:18px}
.branch-in{display:flex;flex-direction:column;justify-content:center;padding:34px;border-radius:28px;background:var(--pl)}
.branch-in h2,.branch-out h2{font-size:34px;margin-bottom:12px}
.branch-in h2{color:var(--pd)}
.branch-in p{font-size:30px;line-height:1.32;color:var(--muted)}
.branch-out{display:flex;flex-direction:column;justify-content:center;padding:34px 40px;border-radius:28px;background:linear-gradient(145deg,var(--p),var(--pd));color:#fff}
.branch-out ol{list-style:none;display:grid;gap:10px;margin-bottom:18px}
.branch-out li{font-size:33px;font-weight:700;line-height:1.2}
.branch-out li b{color:#d9c3f0;margin-inline-end:10px}
.example{padding:18px 22px;background:rgba(255,255,255,.14);border-radius:16px;font-size:30px;line-height:1.28}
.example b{display:block;font-size:21px;color:#e5d8f1}

/* 23 frontline */
.front{display:grid;grid-template-columns:1fr 600px;gap:46px;align-items:center}
.front h1{font-size:50px;margin-bottom:20px}
.front-shot{position:relative;height:640px;border-radius:24px;overflow:hidden;box-shadow:0 30px 80px rgba(75,50,111,.22);border:1px solid var(--line);transform:rotate(-1.2deg)}
.front-shot img{width:100%;display:block}
.front-steps{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;gap:10px;align-items:center;margin:22px 0}
.front-steps span{text-align:center;padding:14px 8px;border-radius:14px;background:var(--pl);font-size:24px;line-height:1.15;font-weight:800;color:var(--pd)}
.front-teams{font-size:25px;line-height:1.35;color:var(--muted)}
.front-teams b{color:var(--pd)}

/* 24 data */
.datas{display:grid;grid-template-columns:1fr 680px;gap:60px;align-items:center}
.datas h1{font-size:56px;margin-bottom:22px}
.bars2{display:grid;grid-template-columns:1fr 1fr;gap:40px;height:620px;align-items:end;border-bottom:3px solid rgba(255,255,255,.35);padding:0 20px}
.bar2{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%}
.bar2 strong{font-size:58px;font-weight:800;line-height:1;margin-bottom:6px;white-space:nowrap}
.bar2 small{font-size:24px;color:#d6c0ee;margin-bottom:12px;font-weight:600}
.bar2 i{display:block;width:100%;border-radius:18px 18px 0 0}
.bar2 span{font-size:26px;font-weight:700;margin:0}
.data-list{display:grid;gap:8px;margin:16px 0 20px}
.data-list p{font-size:27px;color:#fff;font-weight:700;line-height:1.25}
.data-caveat{font-size:24px;line-height:1.35;color:#d9cfdf;padding-inline-start:16px;border-inline-start:4px solid #c9a8ee}

/* 25 leak */
.leak{display:grid;grid-template-rows:auto 1fr auto;gap:10px}
.leak h1{font-size:54px}
.leak svg{width:100%;height:100%}
.leak .takeaway{text-align:center;font-size:32px}

/* 26 compare */
.authority{display:grid;grid-template-rows:auto 1fr auto;gap:14px}
.authority h1{font-size:52px}
.cmp{display:grid;grid-template-columns:330px 1fr 1fr;align-content:center;border-radius:24px;overflow:hidden;border:1px solid var(--line);background:#fff}
.cmp>div{padding:17px 24px;font-size:26px;line-height:1.24;border-bottom:1px solid var(--line);display:flex;align-items:center}
.cmp>div:nth-last-child(-n+3){border-bottom:0}
.cmp .h{font-size:28px;font-weight:800;background:var(--pd);color:#fff}
.cmp .h.warn{background:#6d6377}
.cmp .sit{font-weight:700;color:var(--ink);background:var(--paper)}
.cmp .own{background:var(--pl);color:var(--pd);font-weight:700}
.cmp .over{color:var(--muted)}
.rule{padding:18px 30px;border-radius:18px;background:var(--p);color:#fff;font-size:33px;font-weight:800;text-align:center;line-height:1.2}

/* 27 stakeholders */
.stake{display:grid;grid-template-columns:1fr 760px;gap:44px;align-items:center}
.stake h1{font-size:54px;margin-bottom:22px}
.stake ul{list-style:none;display:grid;gap:14px}
.stake li{font-size:27px;line-height:1.25;font-weight:600;color:var(--ink);padding-inline-start:22px;border-inline-start:5px solid var(--soft)}
.orbit{position:relative;height:680px}
.orbit>i{position:absolute;inset:60px 90px;border-radius:50%;border:2px dashed var(--soft)}
.orbit-core{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:200px;height:200px;border-radius:50%;display:grid;place-items:center;text-align:center;background:linear-gradient(145deg,var(--p),var(--pd));color:#fff;font-size:32px;font-weight:800;line-height:1.1}
.orb{position:absolute;width:320px;padding:16px 20px;border-radius:20px;background:#fff;border:1px solid var(--line);box-shadow:0 14px 36px rgba(75,50,111,.1)}
.orb b{display:block;font-size:28px;font-weight:800;color:var(--p)}
.orb span{font-size:23px;line-height:1.25;color:var(--muted)}

/* 28 ask document */
.ask{display:grid;grid-template-columns:430px 1fr;gap:50px;align-items:center}
.ask h1{font-size:54px;margin-bottom:20px}
.doc{background:#fff;border-radius:10px;padding:26px 36px;box-shadow:0 30px 80px rgba(75,50,111,.2);border:1px solid var(--line)}
.doc h2{font-size:30px;color:var(--pd);padding-bottom:12px;border-bottom:3px solid var(--p);margin-bottom:6px}
.doc-row{display:grid;grid-template-columns:190px 1fr;gap:16px;padding:10px 0;border-bottom:1px solid var(--line);align-items:baseline}
.doc-row:last-child{border-bottom:0}
.doc-row b{font-size:25px;font-weight:800;color:var(--p)}
.doc-row span{font-size:25px;line-height:1.25;color:var(--ink)}

/* 29 pilot fork */
.pilot{display:grid;grid-template-rows:auto 1fr auto;gap:14px}
.pilot h1{font-size:54px}
.fork{display:grid;grid-template-columns:600px 170px 1fr;align-items:center}
.box{padding:26px 30px;border:4px dashed var(--p);border-radius:26px;background:var(--pl)}
.box h2{font-size:34px;color:var(--pd);margin-bottom:10px}
.box div{display:grid;grid-template-columns:120px 1fr;gap:12px;padding:8px 0;align-items:baseline}
.box b{font-size:26px;font-weight:800;color:var(--p)}
.box span{font-size:25px;line-height:1.22}
.fork svg{width:170px;height:440px}
.fork svg path{fill:none;stroke:var(--p);stroke-width:4;stroke-linecap:round}
.ways{display:grid;gap:22px}
.ways article{padding:18px 26px;border-radius:20px;background:#fff;border:1px solid var(--line)}
.ways article:first-child{background:var(--p);color:#fff;border:0}
.ways h2{font-size:32px;line-height:1.1}
.ways p{font-size:24px;line-height:1.25;margin-top:4px;color:var(--muted)}
.ways article:first-child p{color:#eee8f7}

/* 30 close loop */
.closeloop{display:grid;grid-template-columns:1fr 640px;gap:50px;align-items:center}
.closeloop h1{font-size:58px;margin-bottom:20px}
.closeloop .lead{font-size:27px}
.closeloop .takeaway{margin-top:22px;font-size:28px}
.msg{background:#fff;border-radius:26px 26px 6px 26px;padding:28px 34px;box-shadow:var(--shadow);border:1px solid var(--line)}
.msg small{display:block;font-size:22px;font-weight:800;color:var(--p);margin-bottom:12px}
.msg p{font-size:27px;line-height:1.28;padding:10px 0;border-bottom:1px solid var(--line)}
.msg p:last-child{border-bottom:0}
.msg p b{color:var(--pd)}

/* 31 matrix */
.matrix-s{display:grid;grid-template-columns:480px 1fr;gap:44px;align-items:center}
.matrix-s h1{font-size:50px;margin-bottom:18px}
.matrix-s p{font-size:25px;line-height:1.32;color:var(--muted);margin-bottom:12px}
.matrix-s p b{color:var(--pd)}
.mx{display:grid;grid-template-columns:54px 1fr 1fr;grid-template-rows:1fr 1fr 44px;gap:10px;height:690px}
.mx .cell{padding:22px 26px;border-radius:20px;display:flex;flex-direction:column;justify-content:center}
.mx h2{font-size:32px;line-height:1.12}
.mx .cell p{font-size:24px;line-height:1.25;margin:6px 0 0;color:inherit}
.c1{background:var(--pd);color:#fff}.c2{background:var(--p);color:#fff}.c3{background:#e6ddf0;color:var(--pd)}.c4{background:var(--pl);color:var(--pd)}
.axis-y{grid-row:1/3;writing-mode:vertical-rl;text-align:center;font-size:24px;font-weight:800;color:var(--pd);display:flex;align-items:center;justify-content:center}
.axis-x{grid-column:2/4;text-align:center;font-size:24px;font-weight:800;color:var(--pd)}

/* 32 personal development */
.deal{display:grid;grid-template-columns:.8fr 1.2fr;grid-template-rows:1fr auto auto;gap:18px 60px;align-items:center}
.deal-builds strong{display:block;font-size:92px;line-height:1.06;font-weight:800;color:#fff}
.deal-builds strong:nth-of-type(2){color:#d9c3f0}
.deal-builds strong:nth-of-type(3){color:#b897e0}
.deal-not{display:grid;gap:14px}
.deal-not p{font-size:29px;line-height:1.28;color:#ddd2e4;padding-bottom:14px;border-bottom:1px solid rgba(255,255,255,.2)}
.deal-not p:last-child{border-bottom:0;padding-bottom:0}
.deal-not p b{color:#fff}
.deal-pipe{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:14px 22px;border-radius:16px;background:rgba(255,255,255,.1)}
.deal-pipe span{font-size:27px;font-weight:800;color:#fff;white-space:nowrap}
.deal-pipe i{font-style:normal;font-size:27px;font-weight:800;color:#c9a8ee}
.deal-note{grid-column:1/-1;font-size:21px;line-height:1.25;color:#cdbfe0;text-align:center}

/* 33 canvas */
.canvas{display:grid;grid-template-rows:auto 1fr auto;gap:14px}
.canvas h1{font-size:52px}
.cgrid{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:1fr 1fr;gap:14px}
.cgrid article{padding:22px 26px;background:#fff;border:2px solid var(--pl);border-radius:20px;display:flex;flex-direction:column;justify-content:center}
.cgrid b{font-size:30px;font-weight:800;color:var(--p)}
.cgrid h2{font-size:40px;line-height:1.12;color:var(--pd);margin:2px 0 6px}
.cgrid p{font-size:28px;line-height:1.25;color:var(--muted)}
.canvas-foot{display:flex;justify-content:space-between;gap:30px;font-size:27px;font-weight:700;color:var(--pd)}

/* 34 timer */
.work{display:grid;grid-template-columns:.95fr 1.05fr;gap:50px;align-items:center}
.clock{text-align:center}
.clock small{display:block;font-size:30px;font-weight:700;color:#d6c0ee}
.clock strong{display:block;font-size:220px;line-height:1.05;font-weight:800;font-variant-numeric:tabular-nums;direction:ltr}
.clock strong.done{color:#d9c3f0}
.clock button{font-size:26px;font-weight:800;padding:12px 40px;border-radius:999px;border:0;background:#fff;color:var(--pd);cursor:pointer}
.work-list{list-style:none;display:grid;gap:10px;counter-reset:w}
.work-list li{counter-increment:w;display:grid;grid-template-columns:58px 1fr auto;gap:14px;align-items:center;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.18);font-size:30px;font-weight:700;line-height:1.15}
.work-list li::before{content:counter(w);width:50px;height:50px;border-radius:50%;background:rgba(255,255,255,.14);display:grid;place-items:center;font-size:26px}
.work-list small{font-size:23px;color:#d6c0ee;font-weight:600}

/* 35 share */
.share{display:grid;grid-template-columns:520px 1fr;gap:60px;align-items:center}
.share-big{position:relative;text-align:center;padding:46px 20px;border-radius:30px;background:var(--pl)}
.share-big strong{display:block;font-size:220px;line-height:.92;font-weight:800;color:var(--p)}
.share-big span{font-size:36px;font-weight:800;color:var(--pd);line-height:1.15;display:block}
.share h1{font-size:54px;margin-bottom:24px}
.share ol{list-style:none;display:grid;gap:12px}
.share li{font-size:32px;font-weight:700;color:var(--ink);line-height:1.2;padding-bottom:12px;border-bottom:2px solid var(--line)}
.share .takeaway{margin-top:18px;font-size:27px}

/* 36 tomorrow */
.tomorrow{display:grid;grid-template-rows:auto 1fr auto;gap:18px}
.tomorrow h1{font-size:58px}
.tline{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:30px;align-items:center}
.tline::before{content:'';position:absolute;top:calc(50% - 150px);left:8%;right:8%;height:4px;background:var(--soft)}
.tline article{position:relative;text-align:center;padding:0 12px}
.tline b{display:grid;place-items:center;width:150px;height:96px;margin:0 auto 22px;border-radius:999px;background:var(--p);color:#fff;font-size:36px;font-weight:800;position:relative}
.tline h2{font-size:38px;line-height:1.13;color:var(--pd);margin-bottom:10px}
.tline p{font-size:26px;line-height:1.3;color:var(--muted)}
.tomorrow .takeaway{text-align:center}

/* 37 final */
.final{display:flex;flex-direction:column;justify-content:center;align-items:flex-start}
.final h1{font-size:128px;line-height:1.02}
.final .q{margin-top:44px;font-size:38px}
.final svg{position:absolute;left:0;bottom:0;width:560px;opacity:.5}

/* Presenter */
.presenter-body{overflow:auto;background:#15101d;color:#fff;min-height:100%}
.presenter-header{position:sticky;top:0;z-index:3;display:flex;justify-content:space-between;align-items:center;padding:14px 26px;background:rgba(21,16,29,.95);border-bottom:1px solid rgba(255,255,255,.1)}
.presenter-body .college-brand{color:#fff}
.presenter-body .college-brand small{color:#aaa}
.connection{font-size:15px;color:#aaa}
.connection i{display:inline-block;width:9px;height:9px;border-radius:50%;background:#777;margin-inline-end:8px}
.connection.connected{color:#c9b6e4}
.connection.connected i{background:#b897e0;box-shadow:0 0 14px #b897e0}
.presenter-shell{width:min(1050px,92vw);margin:30px auto 80px}
.presenter-meta{display:grid;grid-template-columns:120px 1fr 150px;gap:20px;align-items:center;margin-bottom:14px}
.presenter-meta>div{padding:14px;border:1px solid rgba(255,255,255,.12);border-radius:16px;text-align:center}
.presenter-meta span{font-size:24px;font-weight:800;display:block}
.presenter-meta small{color:#aaa;font-size:15px}
.presenter-meta h1{font-size:32px;margin:0;color:#fff}
.presenter-step{min-height:24px;font-size:18px;color:#c9b6e4;margin-bottom:10px;font-weight:700}
.script-card{background:#fff;color:var(--ink);border-radius:26px;padding:36px;box-shadow:0 30px 90px rgba(0,0,0,.28)}
.script-card .label{font-size:15px;font-weight:800;color:var(--p);margin-top:24px}
.script-card .label:first-child{margin-top:0}
.script-card .message{font-size:23px;font-weight:700}
.script-card .spoken{font-size:24px;line-height:1.65}
.script-card p,.script-card li{font-size:19px;line-height:1.6}
.script-card ul{padding-inline-start:22px}
.transition{border-inline-start:4px solid var(--p);padding:13px 16px;background:var(--pl);border-radius:12px}
