:root{--pink:#ff83bf;--lime:#d6ff3f;--ink:#19201b;--paper:#f3f3ed;--pad:clamp(22px,4vw,64px);--head:clamp(44px,6.5vw,100px)}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}body{background:var(--pink);color:var(--ink);font:18px/1.45 Arial,Helvetica,sans-serif}a{color:inherit;text-decoration:none}button{font:inherit;border:0;cursor:pointer}a,button{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible{outline:4px solid currentColor;outline-offset:5px}header{position:fixed;z-index:5;top:0;left:0;width:100%;display:flex;align-items:center;justify-content:space-between;padding:20px var(--pad);pointer-events:none;color:var(--ink)}header a{font-size:30px;font-weight:900;letter-spacing:-.07em;pointer-events:auto}header>span{font-size:15px}#deck{display:flex;width:100%;height:100%;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain;scroll-behavior:smooth}#deck::-webkit-scrollbar{display:none}.slide{flex:0 0 100%;width:100%;height:100%;scroll-snap-align:start;scroll-snap-stop:always;padding:100px var(--pad) 100px;display:grid;grid-template-columns:.9fr 1.1fr;gap:5vw;align-items:center;position:relative;overflow:hidden}h1,h2,p{margin:0}h1,h2{font-weight:900;letter-spacing:-.065em;line-height:.95}h1{font-size:clamp(60px,9vw,145px)}h2{font-size:var(--head)}.copy p{font-size:clamp(20px,2vw,30px);line-height:1.32;max-width:440px;margin-top:32px}.copy .date{font-size:18px;margin-top:35px}.cover{background:var(--pink);grid-template-columns:1.3fr 1fr}.cover-copy{position:relative;z-index:1}.cover-copy p{font-size:clamp(25px,3vw,44px);margin-top:42px;line-height:1.2;letter-spacing:-.03em}.cover-three{font-size:min(47vw,74vh);font-weight:900;line-height:.75;color:var(--lime);letter-spacing:-.09em;transform:rotate(8deg);text-align:center;position:relative;animation:sway 6s ease-in-out infinite}.cover-three span{position:absolute;bottom:12%;left:22%;font-size:clamp(24px,5vw,70px);letter-spacing:-.05em;color:var(--ink);transform:rotate(-16deg)}.cover-names{position:absolute;left:var(--pad);bottom:115px;font-size:18px}.first{background:var(--lime)}.minutes{background:var(--pink);grid-template-columns:1.1fr 1fr}.humor{background:var(--paper);grid-template-columns:.8fr 1.2fr}.drama{background:var(--pink);grid-template-columns:.8fr 1.2fr}.late{background:var(--lime);grid-template-columns:.8fr 1.2fr}.evidence{display:block;max-height:calc(100dvh - 215px);min-width:0;justify-self:center;line-height:0;transition:transform .25s;cursor:zoom-in}.evidence img{display:block;width:100%;height:auto;max-height:calc(100dvh - 215px);object-fit:contain}.evidence:hover{transform:rotate(-1deg) scale(1.015)}.evidence-first{transform:rotate(2deg)}.evidence-small{width:100%;max-width:560px;transform:rotate(-5deg)}.evidence-small img{image-rendering:auto}.time-gap{display:flex;align-items:center;gap:30px;margin-top:50px;font-size:clamp(22px,3vw,44px);font-weight:700;letter-spacing:-.05em}.time-gap span:nth-child(2){animation:nudge 2s infinite}footer{position:fixed;bottom:0;left:0;z-index:5;width:100%;display:flex;align-items:center;justify-content:space-between;padding:16px var(--pad) 22px;gap:25px;background:transparent;pointer-events:none}#slide-count{font-size:16px;font-variant-numeric:tabular-nums;min-width:50px}.nav-hint{margin-right:auto;font-size:14px}.controls{display:flex;gap:8px;pointer-events:auto}.controls button{background:var(--ink);color:var(--paper);width:52px;height:48px;font-size:26px;line-height:1;transition:transform .15s,opacity .15s}.controls button:hover:not(:disabled){transform:translateY(-3px)}.controls button:disabled{opacity:.22;cursor:default}.progress{position:absolute;bottom:0;left:0;width:100%;height:5px;background:#19201b15}.progress span{display:block;height:100%;width:16.666%;background:var(--ink);transition:width .4s}dialog{border:0;padding:0;background:var(--ink);color:var(--paper);width:min(1400px,95vw);max-width:95vw;height:92dvh;max-height:92dvh}dialog::backdrop{background:#000d}dialog form{display:flex;justify-content:flex-end;padding:12px 16px;height:64px}dialog form button{padding:10px 16px;background:var(--paper);color:var(--ink)}.image-scroll{height:calc(100% - 64px);overflow:auto;display:flex;align-items:flex-start;justify-content:center;padding:0 16px 16px}.image-scroll img{display:block;width:auto;max-width:100%;height:auto;flex:none;cursor:zoom-in}.image-scroll.zoomed{display:block}.image-scroll.zoomed img{max-width:none;cursor:zoom-out}body:has(dialog[open]) #deck{pointer-events:none}@keyframes sway{50%{transform:rotate(3deg) translateY(-8px)}}@keyframes nudge{50%{transform:translateX(8px)}}.slide.arrived .copy,.slide.arrived .evidence{animation:arrive .55s ease-out both}@keyframes arrive{from{opacity:.5;translate:25px 0}to{opacity:1;translate:0 0}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}@media(max-width:900px){.slide{gap:30px;grid-template-columns:1fr 1.1fr}h2{font-size:clamp(40px,6.5vw,64px)}.copy p{font-size:22px}.cover{grid-template-columns:1.1fr 1fr}.cover-three{font-size:53vw}.time-gap{gap:20px}}@media(max-width:600px){header{padding:15px var(--pad)}header a{font-size:28px}header>span{font-size:13px}.slide{padding:85px var(--pad) 90px;grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr);gap:28px;align-content:start;overflow-y:auto}h2{font-size:clamp(40px,11.5vw,62px);max-width:100%}.copy p{font-size:20px;line-height:1.3;max-width:100%;margin-top:20px}.copy .date{font-size:15px;margin-top:18px}.evidence{align-self:center;max-height:100%;width:100%;transform:none}.evidence img{max-height:min(48dvh,420px);width:100%;object-fit:contain}.cover{grid-template-rows:auto 1fr;gap:0}.cover h1{font-size:15vw}.cover-copy p{font-size:25px;margin-top:25px}.cover-three{font-size:min(75vw,40dvh);align-self:center;justify-self:center;width:70%;line-height:.8}.cover-three span{font-size:38px;left:30%}.cover-names{font-size:15px;bottom:90px}.minutes{grid-template-rows:auto 1fr}.minutes .evidence{align-self:center;transform:rotate(-4deg)}.time-gap{font-size:28px;margin-top:26px;gap:25px}.humor,.drama,.late{gap:22px}.late .copy p{font-size:20px}footer{padding:12px var(--pad) 17px;gap:15px}.controls button{width:48px;height:44px}.nav-hint{font-size:13px}.image-scroll{padding:0 8px 8px}dialog{width:96vw;max-width:96vw}.progress{height:4px}}@media(max-height:620px) and (min-width:601px){.slide{padding-top:80px;padding-bottom:80px}.copy p{font-size:20px;margin-top:20px}h2{font-size:48px}.evidence,.evidence img{max-height:calc(100dvh - 170px)}.cover-three{font-size:65vh}.cover-names{bottom:95px}.time-gap{margin-top:25px}}@media(max-height:700px) and (max-width:600px){.slide{padding-top:75px;padding-bottom:80px;gap:18px}h2{font-size:40px}.copy p{font-size:18px;margin-top:16px}.cover-copy p{font-size:22px;margin-top:20px}.cover-three{font-size:35dvh}.evidence img{max-height:38dvh}.time-gap{margin-top:16px}}

/* Photo chapter and deliberately excessive video-editor transitions. */
.first-photo{background:var(--pink);grid-template-columns:1.1fr 1fr}.first-photo .copy p{max-width:540px}.first-photo .copy .date{font-size:15px}.portrait{height:100%;max-height:calc(100dvh - 200px);width:100%;display:flex;justify-content:center}.portrait img{width:auto;max-width:100%;height:100%;max-height:100%;object-fit:contain}.slide.arrived .copy,.slide.arrived .evidence{animation:none}#entry-explosion{position:fixed;inset:0;z-index:20;width:100%;height:100%;pointer-events:none}#entry-explosion[hidden]{display:none}.slide .copy,.slide .evidence{transform-origin:center;will-change:transform,opacity}#deck{scroll-behavior:auto}
@media(max-width:600px){.first-photo{grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr);gap:20px}.first-photo .copy p{font-size:20px}.first-photo .copy .date{font-size:13px;margin-top:14px}.portrait{height:100%;max-height:100%;min-height:0}.portrait img{height:100%;max-height:100%;width:auto;max-width:100%}}
@media(max-height:700px) and (max-width:600px){.first-photo .copy p{font-size:18px}.first-photo{gap:15px}}

.prank{background:var(--lime);grid-template-columns:1.15fr 1fr}.prank h2{font-size:clamp(40px,5.3vw,80px)}.prank-stage{height:100%;display:grid;place-items:center;min-height:0}#countdown{font-size:clamp(150px,28vw,400px);font-weight:900;line-height:.9;letter-spacing:-.07em}#prank-reveal{height:100%;max-height:520px;transform:rotate(9deg)}#prank-reveal svg{height:100%;max-width:100%;display:block}#prank-reveal[hidden],#countdown[hidden]{display:none}@media(max-width:600px){.prank{grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr)}.prank h2{font-size:10.5vw}#countdown{font-size:55vw}#prank-reveal{max-height:100%;height:100%;padding:10px 0}}

.drawing{background:var(--paper);grid-template-columns:1.1fr 1fr}.drawing h2{font-size:clamp(40px,5.5vw,84px)}.drawing .copy p{max-width:520px}.drawing .copy p+p{margin-top:24px}@media(max-width:600px){.drawing{grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr);gap:20px}.drawing h2{font-size:10.5vw}.drawing .copy p{font-size:19px;margin-top:18px}.drawing .copy p+p{margin-top:15px}}@media(max-height:700px) and (max-width:600px){.drawing .copy p{font-size:17px;margin-top:12px}.drawing{gap:15px}}

#prank-reveal{display:flex;align-items:center;justify-content:center;width:100%;transform:rotate(0deg)}#prank-reveal img{display:block;width:100%;height:auto;max-height:100%;object-fit:contain}#prank-reveal[hidden]{display:none}

.me-then{background:var(--pink);grid-template-columns:1.1fr 1fr}.me-then h2{font-size:clamp(40px,4.5vw,70px)}.me-then .copy p{max-width:500px}.me-then .copy .aside{font-size:14px;margin-top:28px}.me-then .evidence{max-width:604px}@media(max-width:600px){.me-then{grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr);gap:24px}.me-then h2{font-size:9.8vw}.me-then .copy p{font-size:19px;margin-top:18px}.me-then .copy .aside{font-size:13px;margin-top:20px}}

#entry-like{position:fixed;inset:0;z-index:20;pointer-events:none;display:grid;place-items:center;overflow:hidden}#entry-like[hidden]{display:none}.like-sticker{width:min(50vw,420px);position:relative;transform-origin:center;animation:like-disaster 3.6s linear both}.like-sticker svg{display:block;width:100%;height:auto}.like-sticker>span{display:block;background:var(--ink);color:var(--lime);padding:0 20px;font-size:clamp(40px,8vw,110px);font-weight:900;letter-spacing:-.07em;line-height:1.05;text-align:center;transform:rotate(-8deg)}.like-orbit{position:absolute;top:20%;left:50%;color:var(--ink);background:var(--lime);font-size:clamp(60px,12vw,170px);font-weight:900;line-height:1;padding:15px;animation:plus-disaster 3.6s linear both}.like-cursor{position:absolute;left:58%;top:58%;font-size:150px;line-height:1;animation:cursor-disaster 3.6s linear both;color:var(--ink)}@keyframes like-disaster{0%{transform:translate(-100vw,60vh) scale(.03) rotate(-900deg)}20%{transform:translate(0,0) scale(1.2) rotate(35deg)}30%{transform:scale(.7) rotate(-30deg)}40%{transform:scale(1.4, .6) rotate(20deg)}50%{transform:scale(.7,1.4) rotate(-20deg)}60%{transform:scale(1.2) rotate(380deg)}70%{transform:scale(.8) rotate(345deg)}82%{transform:scale(1.6) rotate(375deg)}90%{transform:translate(0,-10vh) scale(.9) rotate(350deg)}100%{transform:translate(130vw,70vh) scale(.02) rotate(1100deg)}}@keyframes plus-disaster{0%,25%{transform:scale(0) rotate(-50deg)}35%{transform:scale(1.2) rotate(20deg)}55%{transform:translate(-20vw,20vh) scale(.6) rotate(-60deg)}75%{transform:translate(20vw,-10vh) scale(1.5) rotate(30deg)}100%{transform:translate(100vw,-60vh) scale(0) rotate(360deg)}}@keyframes cursor-disaster{0%,20%{transform:translate(80vw,80vh)}35%{transform:translate(0,0) scale(1.5)}45%{transform:translate(-10vw,-12vh) scale(.6)}55%{transform:translate(0,0) scale(1.5)}75%{transform:rotate(45deg) scale(.5)}100%{transform:translate(80vw,80vh) rotate(720deg)}}@media(max-width:600px){.like-sticker{width:70vw}.like-cursor{font-size:95px}.like-orbit{top:23%;left:55%}}
