:root{--bg:#12002B;--surface:#1E1C3B;--accent:#B044F0;--water:#00E8C4;--lamp:#C6A540;--ink:#F4F4F6;--muted:#C3C5D3;--success:#6BDDA6;--error:#F542A7;--faint:color-mix(in srgb,var(--muted),var(--bg) 52%);--line:color-mix(in srgb,var(--surface),var(--ink) 8%);--scene:color-mix(in srgb,var(--bg),#000 38%);--font-prose:Georgia,'Iowan Old Style','Times New Roman',serif;--font-label:'IBM Plex Mono',ui-monospace,'SFMono-Regular',Menlo,monospace;--font-sans:'IBM Plex Sans',ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--bg);color:var(--ink);font-family:var(--font-prose);line-height:1.6;min-height:100vh;min-height:100svh;display:flex;flex-direction:column;align-items:center}main{width:min(700px,92vw);margin:0 auto;padding:clamp(2.5rem,7vh,5rem) 0 2rem;flex:1}.kicker{font-family:var(--font-label);font-size:.72rem;letter-spacing:.32em;text-transform:uppercase;color:var(--faint);margin:0 0 .9rem}h1{font-weight:400;font-size:clamp(1.7rem,5vw,2.45rem);line-height:1.25;margin:0 0 2.2rem;letter-spacing:.01em}h1 em{font-style:italic}.scene{margin:0 0 1.4em;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--scene)}.scene svg{display:block;width:100%;height:auto}.caption{min-height:2.2em;margin:0 0 .4rem;font-style:italic;color:var(--muted);font-size:1.04rem}.act{appearance:none;background:none;border:none;padding:.2rem 0;font:inherit;font-size:1.04rem;color:var(--lamp);cursor:pointer;text-decoration:underline;text-underline-offset:.35em;text-decoration-thickness:1px;text-decoration-color:rgba(198,165,64,.45);text-decoration-color:color-mix(in srgb,var(--lamp) 45%,transparent);transition:opacity .6s ease,text-decoration-color .25s ease,visibility 0s linear 0s}.act:hover{text-decoration-color:var(--lamp)}.act:disabled{opacity:.35;cursor:default}.act:focus-visible,a:focus-visible{outline:2px solid var(--lamp);outline-offset:4px;border-radius:2px}[data-stage="after"] .act{opacity:0;visibility:hidden;transition:opacity .6s ease,visibility 0s linear .6s}.after{opacity:0;transform:translateY(8px);visibility:hidden;transition:opacity 1.4s ease,transform 1.4s ease;margin-top:1.6rem;border-top:1px solid var(--line);padding-top:1.6rem}[data-stage="after"] .after{opacity:1;transform:none;visibility:visible}.after p{margin:0 0 1.1rem;max-width:56ch}.after .q{font-style:italic;color:var(--ink)}.after .a{color:var(--muted)}.after a{color:var(--lamp);text-decoration:underline;text-underline-offset:.35em;text-decoration-thickness:1px}footer{width:min(700px,92vw);padding:1.4rem 0 2rem;border-top:1px solid var(--line);font-family:var(--font-label);font-size:.74rem;letter-spacing:.06em;color:var(--faint)}.tw1,.tw2,.tw3{animation:tw 3.4s ease-in-out infinite}.tw2{animation-duration:4.3s;animation-delay:1.1s}.tw3{animation-duration:5.1s;animation-delay:2.2s}@keyframes tw{0%,100%{opacity:.35}50%{opacity:1}}#pose{transform-box:fill-box;transform-origin:50% 100%;transform:translate(14px,0) scale(1.06,.8);transition:transform 1.2s cubic-bezier(.34,1.3,.45,1)}[data-stage="water"] #pose,[data-stage="shade"] #pose,[data-stage="after"] #pose{transform:translate(0,0) scale(1,1)}#breath{transform-box:fill-box;transform-origin:50% 100%;animation:breathe 3.8s ease-in-out infinite}@keyframes breathe{50%{transform:scaleY(.985)}}#head{transform-box:fill-box;transform-origin:100% 15%}[data-stage="water"] #head{animation:drink 1.1s ease-in-out .9s 2}@keyframes drink{45%{transform:rotate(-9deg)}}#waterFill{opacity:0;transition:opacity .9s ease .45s}[data-stage="water"] #waterFill,[data-stage="shade"] #waterFill,[data-stage="after"] #waterFill{opacity:1}#shade{opacity:0;transform:translateY(-14px);transition:opacity 1.1s ease .1s,transform 1.1s ease .1s}[data-stage="shade"] #shade,[data-stage="after"] #shade{opacity:1;transform:none}#cast{opacity:0;transition:opacity 1.1s ease .15s}[data-stage="shade"] #cast,[data-stage="after"] #cast{opacity:1}#moonHog{transition:opacity 1.1s ease .15s}[data-stage="shade"] #moonHog,[data-stage="after"] #moonHog{opacity:.4}@media (prefers-reduced-motion:reduce){.tw1,.tw2,.tw3,#breath{animation:none}[data-stage="water"] #head{animation:none}#pose,#shade,#waterFill,#cast,#moonHog,.after,.act{transition-duration:.01s}}
