/* live presentation layer — loaded only by present.html (deck.html / PDF stay static) */
html,body{height:100%;overflow:hidden;background:#000}
body.present .slide{position:fixed;left:50%;top:50%;margin:0;transform:translate(-50%,-50%) scale(var(--k,1));transform-origin:50% 50%;display:none}
body.present .slide.on{display:block}

/* build-in: every marked element rises in, staggered */
body.present .a{opacity:0;transform:translateY(16px);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1);transition-delay:calc(var(--i,0) * 90ms + 120ms)}
body.present .slide.in .a{opacity:1;transform:none}
body.present .a.l{transform:translateX(-18px)}
body.present .a.up{transform:translateY(34px)}
body.present .slide.in .a.l,body.present .slide.in .a.up{transform:none}

/* slow camera move on photo backgrounds */
body.present .slide .bg{transform:scale(1.07);transition:transform 16s ease-out}
body.present .slide.in .bg{transform:scale(1)}
body.present .qimg{transform:scale(1.06);transition:transform 12s ease-out}
body.present .slide.in .qimg{transform:scale(1)}

/* ambient glow drifting on dark slides */
body.present .slide:not(.light)::before{content:"";position:absolute;inset:-20%;pointer-events:none;
  background:radial-gradient(520px 360px at 30% 70%,rgba(255,131,0,.07),transparent 70%);animation:drift 18s ease-in-out infinite alternate}
@keyframes drift{from{transform:translate(-4%,3%)}to{transform:translate(6%,-4%)}}

/* golden circle: rings breathe once on entry */
body.present .slide.in .gc > svg circle{transform-origin:165px 165px;animation:ring 1.1s cubic-bezier(.2,.7,.2,1) both}
body.present .slide.in .gc > svg circle:nth-of-type(2){animation-delay:.15s}
body.present .slide.in .gc > svg circle:nth-of-type(3){animation-delay:.3s}
@keyframes ring{from{transform:scale(.6);opacity:0}to{transform:scale(1);opacity:1}}

/* chip: soft pulse */
body.present .slide.in .chv .chimg{animation:pulse 3.2s ease-in-out 1.2s infinite alternate}
@keyframes pulse{from{box-shadow:0 0 0 rgba(255,131,0,0)}to{box-shadow:0 0 46px rgba(255,131,0,.35)}}

/* quiz: second click shows the answer by highlighting a column — no text appears */
.duel > div{transition:opacity .5s,filter .5s}
body.present .slide.reveal .duel > div.lose{opacity:.28;filter:grayscale(1)}
body.present .slide.reveal .duel > div.win .fig{color:var(--or2)}
body.present .slide.reveal .duel > div.win{box-shadow:inset 3px 0 0 var(--or)}

/* hover affordances */
body.present .sgrid .r,body.present .chr .r,body.present .lrows .r,body.present .ipr .r{transition:background .25s}
body.present .sgrid .r:hover,body.present .chr .r:hover,body.present .ipr .r:hover{background:rgba(255,255,255,.05)}
body.present .lrows .r:hover{background:rgba(6,37,65,.05)}

/* progress + notes */
#pbar{position:fixed;left:0;bottom:0;height:3px;background:#ff8300;width:0;transition:width .4s;z-index:9}
#pnotes{position:fixed;left:0;right:0;bottom:0;max-height:34vh;overflow:auto;background:rgba(4,18,31,.94);color:#e8eef4;
  font:16px/1.6 Prompt,sans-serif;padding:16px 28px 22px;white-space:pre-line;z-index:10;border-top:2px solid #ff8300}
#pnotes b{display:block;color:#f5a65b;font-size:12px;letter-spacing:.14em;text-transform:uppercase;margin-bottom:6px}
body.present{cursor:default}
@media (prefers-reduced-motion:reduce){body.present .a,body.present .slide .bg{transition:none!important;animation:none!important}}
body.present .slide::after{content:attr(data-n)}
body.present .slide.cover::after,body.present .slide.chap::after{content:none}

/* ---------- feeling layer (fx.js) ---------- */
.waterfx{position:absolute;left:0;top:0;width:1280px;height:720px;z-index:0}
body.present .slide.haswater > .bg{opacity:0}
.wdrop{position:absolute;left:calc(77% - 9px);top:-30px;width:18px;height:24px;border-radius:50% 50% 50% 50%/60% 60% 40% 40%;
  background:radial-gradient(circle at 40% 35%,#fff3d6 0,#ffc46b 25%,#ff8300 60%,#9a4300 100%);box-shadow:0 0 18px rgba(255,140,30,.8);opacity:0;z-index:1;pointer-events:none}
.wdrop.fall{animation:wfall 1.15s cubic-bezier(.55,0,.9,.6) forwards}
@keyframes wfall{0%{transform:translateY(0);opacity:0}12%{opacity:1}100%{transform:translateY(378px);opacity:1}}
.slide.haswater .scrim{z-index:1;pointer-events:none}
.slide.haswater .inner,.slide.haswater .closeL,.slide.haswater .qr,.slide.haswater .logo{z-index:2;position:absolute}
.motes{position:absolute;left:0;top:0;width:1280px;height:720px;pointer-events:none;z-index:0}
/* pointer parallax on photos (separate from the slow zoom) */
body.present .slide .bg,body.present .qimg,body.present .brand .ph,body.present .chimg{translate:calc(var(--mx,0) * -16px) calc(var(--my,0) * -10px);transition:transform 16s ease-out,translate .8s ease-out}
/* chapter photos open with an iris */
body.present .chap .bg{clip-path:circle(0% at 70% 50%)}
body.present .chap.in .bg{animation:iris 1.5s cubic-bezier(.6,0,.2,1) .1s forwards}
@keyframes iris{to{clip-path:circle(85% at 70% 50%)}}
/* cream: drop lands lower, cream mass sits right; keep the left dark for text */
.slide.haswater .scrim{background:linear-gradient(100deg,rgba(4,18,31,.92) 30%,rgba(4,18,31,.35) 55%,rgba(4,18,31,0) 75%)!important}
.slide.haswater .qr.qcover span{background:rgba(4,18,31,.75);padding:2px 8px;border-radius:3px}