body.showcase{--ink:#2a2030;--cream:#fff8ee;--glass:#fff6ece6;background:#1a1420}.showcase #view{position:fixed;inset:0}.showcase #view .overlay{display:none}.shade{z-index:1;pointer-events:none;background:radial-gradient(120% 90% at 50% 45%,#0000 55%,#1e0e2280),linear-gradient(#0000 58%,#2410288c);transition:background-color .6s;position:fixed;inset:0}.ended .shade{background-color:#1e0e2259}.letterbox{display:none}@media (min-aspect-ratio:1){.letterbox{z-index:1;pointer-events:none;--bar:max(0px, calc((100svh - 100vw / 2.2) / 2));background:linear-gradient(#000 var(--bar), transparent var(--bar), transparent calc(100% - var(--bar)), #000 calc(100% - var(--bar)));display:block;position:fixed;inset:0}}#veil,#flash,#dim,#framing,#streak{z-index:2;pointer-events:none;position:fixed;inset:0}#veil{background:#000}#flash{opacity:0;background:#fff8ee}#dim{opacity:0;background:#0e08148c;transition:opacity .5s}.dim #dim{opacity:1}.still #dim{display:none}#framing{--close:0}#framing i{height:34svh;scale:1 var(--close);background:#000;position:absolute;left:0;right:0}#framing i:first-child{transform-origin:top;top:0}#framing i:last-child{transform-origin:bottom;bottom:0}#streak{opacity:0;background:linear-gradient(90deg,#0000 32%,#ffc4aa4d 44%,#fff8eed9 50%,#ffc4aa4d 56%,#0000 68%);inset:-10% -50%}#words{z-index:3;pointer-events:none;position:fixed;inset:0}.line{left:50%;bottom:calc(18svh + env(safe-area-inset-bottom));opacity:0;text-align:center;width:min(88vw,900px);color:var(--cream);text-wrap:balance;font:600 32px/1.1 var(--font-round);letter-spacing:-.005em;text-shadow:0 1px 2px #280f28b3,0 3px 22px #280f288c;margin:0;transition:opacity .35s cubic-bezier(.3,0,.2,1),translate .55s cubic-bezier(.2,.7,.2,1);position:absolute;translate:-50% 14px}@keyframes settle{0%{opacity:0;scale:1.14}to{opacity:1;scale:1}}@keyframes slam{0%{opacity:0;scale:1.7}40%{opacity:1}to{opacity:1;scale:1}}.line.on{opacity:1;animation:.45s cubic-bezier(.2,.8,.2,1) both settle;translate:-50%}.line.center{font-size:36px;top:50%;bottom:auto;translate:-50% calc(14px - 50%)}.line.center.on{translate:-50% -50%}.line.beat{letter-spacing:-.01em;font-size:72px;transition-duration:.12s,.25s}.line.beat.on{animation:.24s cubic-bezier(.2,.9,.25,1.1) both slam}.line.title{font-size:26px;top:calc(36svh + 20px);bottom:auto}.numbers{left:50%;bottom:calc(14svh + env(safe-area-inset-bottom));width:min(88vw,900px);position:absolute;translate:-50%}.line.number{width:auto;margin:0 0 12px;font-size:40px;position:relative;bottom:auto;left:auto;translate:0 14px}.line.number.on{translate:0}.line.number span{font:500 16px/1.3 var(--font-ui);opacity:.9;margin-top:2px;display:block}.brand{color:#fff3f6;font:600 84px/1 "Fredoka Sign", var(--font-round);letter-spacing:.04em;text-align:center;text-shadow:0 0 3px #ffd0dc,0 0 10px #ff6f8c,0 0 24px #e2405b,0 0 48px #e2405bcc;margin:0}#brand{z-index:3;pointer-events:none;opacity:0;transition:opacity .2s,scale .9s cubic-bezier(.2,.7,.2,1);position:fixed;top:22svh;left:0;right:0;scale:1.08}#brand.on{opacity:1;animation:.4s cubic-bezier(.15,.9,.25,1) both slam;scale:1}#play{z-index:6;text-align:center;flex-direction:column;align-items:center;gap:12px;display:none;position:fixed;top:63svh;left:50%;translate:-50% -50%}.dim #play{display:flex}.ended #play,.still #play{display:none}#play-sound{background:var(--cream);min-height:68px;color:var(--ink);font:600 22px/1 var(--font-round);cursor:pointer;border:0;border-radius:999px;align-items:center;gap:12px;padding:0 34px 0 28px;display:inline-flex;box-shadow:0 0 0 6px #fff8ee33,0 0 44px #ff6f8cb3,0 10px 30px #14081880}#play-sound:before{content:"";border-left:17px solid;border-block:10px solid #0000}#play p{color:var(--cream);font:600 15px/1.3 var(--font-round);letter-spacing:.02em;text-shadow:0 1px 2px #280f28b3,0 3px 18px #280f2899;margin:0}#end{z-index:4;text-align:center;color:var(--cream);opacity:0;visibility:hidden;flex-direction:column;justify-content:center;align-items:center;gap:14px;padding:24px;transition:opacity .6s,visibility 0s .6s;display:flex;position:fixed;inset:0}.ended #end{opacity:1;visibility:visible;transition:opacity .6s}#end h1{max-width:640px;font:600 26px/1.15 var(--font-round);text-wrap:balance;text-shadow:0 1px 2px #280f28b3,0 3px 22px #280f288c;margin:0}#end .actions{flex-wrap:wrap;justify-content:center;gap:12px;margin-top:12px;display:flex}.access,#again{min-height:52px;font:600 18px/1 var(--font-round);cursor:pointer;border:0;border-radius:999px;justify-content:center;align-items:center;padding:0 26px;text-decoration:none;display:inline-flex}.access{background:var(--cream);color:var(--ink);box-shadow:0 8px 24px #14081866}#again{color:var(--cream);background:#fff8ee29;box-shadow:inset 0 0 0 2px #fff8eeb3}.still #again,.still #sound,.still #skip{display:none}#sound,#skip{z-index:5;min-height:44px;color:var(--cream);cursor:pointer;font:600 15px/1 var(--font-round);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#fff8ee29;border:0;border-radius:999px;align-items:center;gap:8px;padding:0 16px;display:inline-flex;position:fixed;box-shadow:inset 0 0 0 1.5px #fff8ee80}#sound{top:calc(14px + env(safe-area-inset-top));right:14px}#sound:before{content:"";clip-path:polygon(0 30%,30% 30%,70% 0,70% 100%,30% 70%,0 70%);background:currentColor;width:16px;height:14px}#sound[aria-pressed=true]:before{clip-path:polygon(0 30%,30% 30%,70% 0,70% 100%,30% 70%,0 70%,0 30%,80% 20%,100% 20%,100% 80%,80% 80%)}#skip{bottom:calc(14px + env(safe-area-inset-bottom));right:14px}.ended #skip{display:none}:is(#sound,#skip,#again,.access,#play-sound):focus-visible{outline-offset:3px;outline:3px solid #b9a3ff}@media (min-width:900px){.line{font-size:46px}.line.beat{font-size:112px}.line.center{font-size:52px}.line.title{font-size:36px;top:calc(22svh + 150px)}.line.number{font-size:56px}.line.number span{font-size:19px}.brand{font-size:140px}#end h1{font-size:40px}}@media (prefers-reduced-motion:reduce){.line,#brand,#end{transition:opacity .2s;translate:-50%;scale:1}.line.on,.line.beat.on,#brand.on{animation:none}.line.number{translate:0}.line.center,.line.center.on{translate:-50% -50%}}#view.still img{object-fit:cover;width:100%;height:100%;display:block}