:root{--charcoal: #454851;--yellow: #e9de49;--red: #db2955;--white: #f4faff;--blue: #2ca6a4;--bg: #1b1c21;--bg-2: #25272d;--font-body: "Zilla Slab", Rockwell, "Roboto Slab", Georgia, serif;--font-h1: "Rye", "Bungee", Georgia, serif;--font-h2a: "Shrikhand", "Rye", Georgia, serif;--font-h2b: "Bungee", Impact, sans-serif;--font-ui: "Bungee", Impact, sans-serif;color-scheme:dark}*,*:before,*:after{box-sizing:border-box}html{background:var(--bg)}body{margin:0;background:var(--bg);color:var(--white);font-family:var(--font-body);font-weight:500;font-size:clamp(1.3rem,.95rem + 1.3vw,2.1rem);line-height:1.35;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}body.locked{overflow:hidden}main{overflow-x:clip}::selection{background:var(--yellow);color:var(--bg)}#progress{position:fixed;top:0;left:0;z-index:40;width:100%;height:5px;background:linear-gradient(90deg,var(--blue),var(--yellow),var(--red));transform:scaleX(0);transform-origin:0 50%}#lander{position:fixed;inset:0;z-index:60;display:grid;place-items:center;padding:1.5rem;background:radial-gradient(ellipse at 50% 40%,rgba(233,222,73,.1),transparent 60%),repeating-conic-gradient(from 0deg at 50% 120%,rgba(69,72,81,.35) 0deg 7.5deg,transparent 7.5deg 15deg),var(--bg);transition:opacity .7s ease,visibility .7s}#lander.gone{opacity:0;visibility:hidden}.lander-inner{text-align:center;max-width:40rem}.lander-kicker{margin:0 0 .4em;font-family:var(--font-ui);font-size:.7em;letter-spacing:.25em;text-transform:uppercase;color:var(--blue)}.lander-title{margin:0;font-family:var(--font-h1);font-weight:400;font-size:clamp(3rem,1rem + 11vw,9.5rem);line-height:1;color:var(--yellow);text-shadow:.04em .04em 0 var(--red),.08em .08em 0 var(--blue);animation:lander-bob 2.6s ease-in-out infinite}.lander-text{margin:.9em 0 1.4em;font-size:.95em}.lander-buttons{display:flex;flex-wrap:wrap;gap:.8rem;justify-content:center}.btn{font:inherit;font-family:var(--font-ui);font-size:clamp(.95rem,.8rem + .6vw,1.25rem);padding:.85em 1.4em;border-radius:999px;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease}.btn:hover{transform:translateY(-2px) rotate(-1deg)}.btn:active{transform:translateY(1px)}.btn:focus-visible{outline:3px solid var(--blue);outline-offset:4px}.btn-primary{background:var(--yellow);color:var(--bg);border:0;box-shadow:.25em .25em 0 var(--red)}.btn-ghost{background:transparent;color:var(--white);border:2px solid rgba(244,250,255,.5)}@keyframes lander-bob{0%,to{transform:rotate(-2deg) translateY(0)}50%{transform:rotate(2deg) translateY(-.06em)}}.mute{position:fixed;right:clamp(.8rem,2vw,1.5rem);bottom:clamp(.8rem,2vw,1.5rem);z-index:50;width:3.4rem;height:3.4rem;border-radius:50%;border:2px solid var(--yellow);background:var(--bg-2);color:var(--white);font-size:1.4rem;line-height:1;cursor:pointer;box-shadow:.2rem .2rem 0 var(--red)}.mute[aria-pressed=true]{border-color:var(--charcoal);box-shadow:.2rem .2rem 0 var(--charcoal)}.mute:focus-visible{outline:3px solid var(--blue);outline-offset:3px}.nudge{position:fixed;left:50%;bottom:1.4rem;z-index:45;padding:.55em 1.1em;border-radius:999px;background:var(--red);color:var(--white);font-family:var(--font-ui);font-size:clamp(.8rem,.7rem + .4vw,1rem);white-space:nowrap;opacity:0;transform:translate(-50%,1.5rem);transition:opacity .4s ease,transform .4s ease;pointer-events:none}.nudge.show{opacity:1;transform:translate(-50%);animation:nudge-bounce 1.2s ease-in-out .4s infinite}@keyframes nudge-bounce{0%,to{transform:translate(-50%)}50%{transform:translate(-50%,-.4rem)}}.scene{position:relative;height:calc(var(--len, 2.2) * 100vh)}.scene.chapter{--len: 2.6}.scene.short{--len: 1.8}.scene.joke{--len: 18}.scene.finale{--len: 2.3}.pin{--pin-pad: clamp(1.25rem, 6vw, 5.5rem);position:sticky;top:0;height:100vh;height:100svh;max-width:1240px;margin:0 auto;padding:var(--pin-pad);display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:clamp(1rem,3.5vh,2.6rem)}.scene[data-align=left] .pin{align-items:flex-start;text-align:left}.scene[data-align=right] .pin{align-items:flex-end;text-align:right}.fx{--c: var(--yellow);--s1: var(--red);--s2: var(--blue);margin:0;max-width:17ch;font-weight:400;line-height:1.08;color:var(--c);text-shadow:.045em .045em 0 var(--s1),.09em .09em 0 var(--s2);transform:rotate(var(--tilt, 0deg))}h1.fx{font-family:var(--font-h1);font-size:clamp(2.1rem,.8rem + 6vw,7.4rem)}h2.fx{font-family:var(--font-h2a);font-size:clamp(1.9rem,.9rem + 4.6vw,5.6rem)}h2.fx.alt{font-family:var(--font-h2b);line-height:1.12}.fx .w{display:inline-block;white-space:nowrap}.fx .ch{display:inline-block;opacity:0;will-change:transform,opacity}.fx.settled[data-idle=wobble]{animation:idle-wobble 2.8s ease-in-out infinite}.fx.settled[data-idle=bob]{animation:idle-bob 2.2s ease-in-out infinite}.fx.settled[data-idle=pulse]{animation:idle-pulse 1.6s ease-in-out infinite}.fx.settled[data-idle=jitter]{animation:idle-jitter .5s steps(2,end) infinite}@keyframes idle-wobble{0%,to{transform:rotate(var(--tilt, 0deg))}50%{transform:rotate(calc(var(--tilt, 0deg) * -1))}}@keyframes idle-bob{0%,to{transform:rotate(var(--tilt, 0deg)) translateY(0)}50%{transform:rotate(var(--tilt, 0deg)) translateY(-.08em)}}@keyframes idle-pulse{0%,to{transform:rotate(var(--tilt, 0deg)) scale(1)}50%{transform:rotate(var(--tilt, 0deg)) scale(1.035)}}@keyframes idle-jitter{0%{transform:rotate(var(--tilt, 0deg)) translate(0)}50%{transform:rotate(calc(var(--tilt, 0deg) + .6deg)) translate(.015em,-.015em)}to{transform:rotate(var(--tilt, 0deg)) translate(-.015em,.01em)}}.reveal{margin:0;max-width:30ch}.reveal .wd{display:inline-block;opacity:.12}.reveal em{font-style:italic;font-weight:700;color:var(--blue)}.reveal strong{font-weight:700;color:var(--yellow)}.reveal a{color:var(--red);font-weight:700;text-decoration:underline;text-decoration-color:var(--yellow);text-decoration-thickness:.08em;text-underline-offset:.15em}.reveal a:hover{color:var(--yellow)}.scroll-hint{position:absolute;left:50%;bottom:4vh;margin:0;transform:translate(-50%);font-family:var(--font-ui);font-size:.55em;letter-spacing:.3em;text-transform:uppercase;color:var(--white);opacity:0}.scroll-hint span{display:inline-block;animation:hint-bounce 1.1s ease-in-out infinite}@keyframes hint-bounce{0%,to{transform:translateY(0)}50%{transform:translateY(.35em)}}.joke .pin{display:grid;place-items:center;max-width:none}.joke .pin>*{grid-area:1 / 1}.joke-head{display:flex;flex-direction:column;align-items:center;gap:clamp(1rem,3vh,2rem);max-width:1240px;transform-origin:50% 0}.nags{position:relative;align-self:stretch;justify-self:stretch;pointer-events:none}.nag{position:absolute;left:50%;top:var(--nag-y, 55%);width:min(92vw,1100px);display:flex;justify-content:center;text-align:center;transform:translate(-50%,-50%);visibility:hidden}.scene[data-meter=right] .pin{padding-right:max(var(--pin-pad),5rem)}.scene[data-meter=left] .pin{padding-left:max(var(--pin-pad),5rem)}.meter{--p: 0;--meter-w: 1.4rem;--meter-h: min(46vh, 22rem);--meter-edge: clamp(.5rem, 2vw, 2rem);position:absolute;top:50%;z-index:1;display:flex;align-items:center;gap:.5em;transform:translateY(-50%);font-family:var(--font-ui);font-size:clamp(.65rem,.55rem + .35vw,.9rem);color:var(--white);pointer-events:none}.scene[data-meter=right] .meter{right:var(--meter-edge)}.scene[data-meter=left] .meter{left:var(--meter-edge);flex-direction:row-reverse}.meter-label{position:relative;width:1.2em;height:var(--meter-h);letter-spacing:.2em;text-transform:uppercase;white-space:nowrap}.meter-label>span{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) rotate(-90deg);transition:opacity .25s ease}.meter-nag{color:var(--red);opacity:0}.meter.draining .meter-text{opacity:0}.meter.draining .meter-nag{opacity:1;animation:meter-blink .6s steps(2,end) infinite}.meter-gauge{position:relative;width:var(--meter-w);height:var(--meter-h)}.meter.full .meter-gauge{animation:meter-done .5s ease-out}.meter-tube{position:absolute;inset:0;overflow:hidden}.meter-fill{position:absolute;left:0;right:0;bottom:0;height:calc(var(--p) * 100%);background:var(--red)}.meter-cells{position:absolute;inset:0;display:none;flex-direction:column-reverse}.meter-cells span{--lit: clamp(0, calc(var(--p) * var(--n) - var(--i)), 1);opacity:calc(.15 + .85 * var(--lit))}.meter-cap{position:absolute;display:none}.meter-pct{position:absolute;left:50%;bottom:calc(100% + .6em);transform:translate(-50%);font-variant-numeric:tabular-nums;white-space:nowrap;transition:color .25s ease}.meter.draining .meter-pct{color:var(--red)}.meter.full .meter-pct{color:var(--yellow)}.meter[data-look=striker]{--meter-w: 1.1rem}.meter[data-look=striker] .meter-tube{border-radius:.3rem;background:repeating-linear-gradient(to top,transparent 0 calc(10% - 2px),rgba(244,250,255,.3) calc(10% - 2px) 10%),var(--charcoal)}.meter[data-look=striker] .meter-fill{background:linear-gradient(to top,var(--blue),var(--yellow),var(--red)) bottom / 100% var(--meter-h) no-repeat;opacity:.75}.meter[data-look=striker] .meter-gauge:after{content:"";position:absolute;left:50%;bottom:calc(var(--p) * (100% - .9rem));width:2rem;height:.9rem;border-radius:50%;background:var(--yellow);box-shadow:.12rem .15rem 0 var(--red);transform:translate(-50%)}.meter[data-look=striker] .meter-cap{display:block;left:50%;bottom:calc(100% + .3rem);width:2.1rem;height:1.5rem;border-radius:1.05rem 1.05rem .3rem .3rem;background:var(--yellow);box-shadow:.15rem .15rem 0 var(--red);transform:translate(-50%);transform-origin:50% 0}.meter[data-look=striker].full .meter-cap{animation:bell-ring .3s ease-in-out 5}.meter[data-look=striker] .meter-pct{top:calc(100% + .6em);bottom:auto}.meter[data-look=thermo]{--meter-w: 1.1rem}.meter[data-look=thermo] .meter-tube{bottom:1.5rem;border:2px solid var(--white);border-bottom:0;border-radius:999px 999px 0 0;background:#f4faff14}.meter[data-look=thermo] .meter-cap{display:block;left:50%;bottom:0;width:2.2rem;height:2.2rem;border:2px solid var(--white);border-radius:50%;background:var(--red);transform:translate(-50%)}.meter[data-look=thermo].full .meter-cap{animation:thermo-glow .9s ease-in-out infinite}.meter[data-look=bulbs]{--meter-w: 1.7rem}.meter[data-look=bulbs] .meter-tube{border-radius:999px;background:var(--red);box-shadow:.15rem .15rem 0 var(--charcoal)}.meter[data-look=bulbs] .meter-fill{display:none}.meter[data-look=bulbs] .meter-cells{display:flex;justify-content:space-evenly;align-items:center}.meter[data-look=bulbs] .meter-cells span{width:1.05rem;height:1.05rem;border-radius:50%;background:color-mix(in srgb,var(--yellow) calc(var(--lit) * 100%),var(--bg));box-shadow:0 0 calc(var(--lit) * .9rem) var(--yellow);opacity:1}.meter[data-look=bulbs].full .meter-cells span{animation:bulb-chase .5s steps(2,end) infinite;animation-delay:calc(var(--i) * -.1s)}.meter[data-look=candy] .meter-tube{border:2px solid var(--white);border-radius:999px;background:#f4faff0f}.meter[data-look=candy] .meter-fill{border-radius:999px;background:repeating-linear-gradient(-45deg,var(--blue) 0 .5rem,var(--white) .5rem 1rem) 0 0 / 1.414rem 1.414rem;animation:candy-roll .7s linear infinite}.meter[data-look=candy].draining .meter-fill{animation-direction:reverse}.meter[data-look=battery]{--meter-w: 1.9rem}.meter[data-look=battery] .meter-tube{border:3px solid var(--white);border-radius:.4rem}.meter[data-look=battery] .meter-fill{display:none}.meter[data-look=battery] .meter-cells{display:flex;inset:3px;gap:3px}.meter[data-look=battery] .meter-cells span{flex:1;border-radius:2px;background:var(--yellow)}.meter[data-look=battery].full .meter-cells span{background:var(--blue)}.meter[data-look=battery] .meter-cap{display:block;left:50%;bottom:100%;width:.8rem;height:.35rem;border-radius:.2rem .2rem 0 0;background:var(--white);transform:translate(-50%)}.meter[data-look=ring]{--meter-w: 4rem;--meter-h: 4rem}.meter[data-look=ring] .meter-tube{border-radius:50%;background:conic-gradient(var(--yellow) calc(var(--p) * 360deg),rgba(244,250,255,.14) 0);-webkit-mask-image:radial-gradient(farthest-side,transparent calc(100% - .55rem),#000 calc(100% - .55rem));mask-image:radial-gradient(farthest-side,transparent calc(100% - .55rem),#000 calc(100% - .55rem))}.meter[data-look=ring] .meter-fill{display:none}.meter[data-look=ring] .meter-pct{inset:0;display:grid;place-items:center;transform:none}@media(max-width:640px){.meter{--meter-h: min(40vh, 16rem)}.meter[data-look=ring]{--meter-w: 3rem;--meter-h: 3rem}}@keyframes meter-blink{50%{opacity:.35}}@keyframes meter-done{0%{transform:scale(1)}40%{transform:scale(1.15) rotate(-3deg)}to{transform:scale(1)}}@keyframes bell-ring{0%,to{transform:translate(-50%) rotate(0)}25%{transform:translate(-50%) rotate(-18deg)}75%{transform:translate(-50%) rotate(18deg)}}@keyframes thermo-glow{0%,to{box-shadow:0 0 0 var(--red)}50%{box-shadow:0 0 1.2rem var(--red)}}@keyframes bulb-chase{50%{opacity:.3}}@keyframes candy-roll{to{background-position:0 -1.414rem}}.meter-mode main{position:relative;z-index:1}.meter-mode .fx .ch,.meter-mode .reveal .wd{--droop: clamp(0, calc((var(--wilt, 0) - var(--lag, 0)) * 2), 1)}.meter-mode .fx .ch{transform:translateY(calc(var(--droop) * var(--sag, 0) * .55em)) rotate(calc(var(--droop) * var(--lean, 0) * 28deg))}.meter-mode .reveal .wd{opacity:1;transform-origin:50% 100%;transform:translateY(calc(var(--droop) * var(--sag, 0) * .45em - var(--hop, 0) * .28em)) rotate(calc(var(--droop) * var(--lean, 0) * 9deg)) scale(calc(1 + var(--hop, 0) * .08));text-shadow:0 0 calc(var(--hop, 0) * .45em) rgba(233,222,73,.75)}.meter-mode .fx{color:color-mix(in srgb,var(--c),var(--bg) calc(var(--wilt, 0) * 55%));text-shadow:.045em .045em 0 color-mix(in srgb,var(--s1),var(--bg) calc(var(--wilt, 0) * 55%)),.09em .09em 0 color-mix(in srgb,var(--s2),var(--bg) calc(var(--wilt, 0) * 55%))}.meter-mode .reveal{color:color-mix(in srgb,var(--white),var(--charcoal) calc(var(--wilt, 0) * 75%))}#transition{position:fixed;inset:0;z-index:55;display:grid;place-items:center;padding:1.5rem;overflow:hidden;touch-action:none}#transition[hidden]{display:none}#transition .curtain{position:absolute;inset:0;background-color:var(--yellow);background-image:repeating-conic-gradient(from 0deg at 50% 115%,rgba(27,28,33,.14) 0deg 7.5deg,transparent 7.5deg 15deg);transform:translateY(100%);will-change:transform}.transition-message{position:relative;margin:0;max-width:14ch;font-family:var(--font-ui);font-size:clamp(2rem,1rem + 6vw,5.5rem);line-height:1.1;text-align:center;color:var(--bg);text-shadow:.05em .05em 0 var(--white);opacity:0;will-change:transform,opacity}.transition-message .w{display:inline-block;white-space:nowrap}.transition-message .ch{display:inline-block;animation:message-wave .7s ease-in-out infinite;animation-delay:calc(var(--i) * -.07s)}@keyframes message-wave{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-.12em) rotate(-4deg)}}.sparkle{position:absolute;width:1.2em;margin:-.5em 0 0 -.6em;font-size:var(--size);line-height:1;text-align:center;text-shadow:.06em .06em 0 rgba(27,28,33,.5);opacity:0;will-change:transform,opacity}#wash{position:fixed;left:0;right:0;bottom:0;height:100vh;height:100lvh;z-index:0;pointer-events:none;background-color:var(--yellow);-webkit-mask-image:linear-gradient(to top,#000,rgba(0,0,0,.45) 40%,transparent 85%);mask-image:linear-gradient(to top,#000,rgba(0,0,0,.45) 40%,transparent 85%);opacity:.2;transform:translateY(100%);transition:transform .35s ease-out,background-color .8s ease;will-change:transform}.again{font-family:var(--font-ui);font-size:.6em;color:var(--white);text-decoration:none;padding:.7em 1.3em;border:2px solid rgba(244,250,255,.4);border-radius:999px;opacity:0;pointer-events:none;transition:border-color .2s,color .2s}.again:hover{color:var(--yellow);border-color:var(--yellow)}.wasted{display:flex;flex-direction:column;align-items:center;gap:.35em;font-size:.75em;opacity:0}.wasted[hidden]{display:none}.wasted-title{margin:0;font-family:var(--font-ui);font-size:.6em;letter-spacing:.2em;text-transform:uppercase;color:var(--blue)}.wasted-stats{display:flex;flex-wrap:wrap;justify-content:center;gap:.3em 2em}.wasted-stat{margin:0;display:flex;flex-direction:column;align-items:center}.wasted-value{font-family:var(--font-ui);font-size:1.7em;line-height:1.1;font-variant-numeric:tabular-nums;color:var(--yellow);text-shadow:.05em .05em 0 var(--red)}.wasted-stat+.wasted-stat .wasted-value{color:var(--red);text-shadow:.05em .05em 0 var(--blue)}.wasted-label{font-size:.65em;opacity:.8}.wasted-note{margin:0;font-size:.65em;font-style:italic;opacity:.8}.calm .scene,.no-js .scene{height:auto}.calm .pin,.no-js .pin{position:static;height:auto;min-height:0;padding-block:12vh}.calm .joke .pin,.no-js .joke .pin{display:flex;flex-direction:column}.calm .nags,.no-js .nags{display:flex;flex-direction:column;gap:2rem;align-items:center}.calm .nag,.no-js .nag{position:static;transform:none;visibility:visible}.calm .again,.no-js .again{opacity:1;pointer-events:auto}.calm .scroll-hint,.no-js .scroll-hint{display:none}.calm .fx.settled{animation:none}.no-js #lander,.no-js .mute{display:none}.no-js body.locked{overflow:auto}
