:root{--ink:#0b0b0d;--bg:#1b1c1e;--paper:#f4efe2;--text:#f4f1ea;--muted:#b9b3a7;--ipe:#f2c230;--red:#d62828;--pixo:#ff3d8b;--pink:#ff4fa3;--display:Bungee, "Arial Black", sans-serif;--body:"Barlow Semi Condensed", Arial, sans-serif}*{box-sizing:border-box}html,body{background:var(--bg);color:var(--text);font-family:var(--body);margin:0}body{min-height:100svh;overflow-x:hidden}body.in-comic{overflow:hidden}button,input{font:inherit}.sr{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}:focus-visible{outline:3px solid var(--ipe);outline-offset:3px}.lang{top:max(12px, env(safe-area-inset-top));z-index:20;min-width:44px;min-height:36px;color:var(--text);letter-spacing:.1em;cursor:pointer;background:#0b0b0d8c;border:2px solid #ffffff73;font-weight:800;position:fixed;right:14px}#load{min-height:100svh;position:relative}.cv-bg{opacity:0;background:#2a1c24 50%/cover no-repeat;transition:opacity 1.2s,transform 20s linear;position:fixed;inset:0;transform:scale(1.06)}.cv-bg.on{opacity:1;transform:scale(1)}.cv-bg:after{content:"";background:linear-gradient(#0a080e8c 0%,#0a080e0d 32%,#0a080e26 55%,#0a080ee0 100%);position:absolute;inset:0}.cv{text-align:center;flex-direction:column;justify-content:space-between;align-items:center;gap:18px;min-height:100svh;padding:clamp(18px,4vh,44px) 16px clamp(14px,3vh,28px);display:flex;position:relative}.l1{font:400 clamp(44px, 9vw, 110px)/.88 var(--display);color:var(--ipe);text-shadow:0 4px #111,0 10px 30px #00000080;margin:0}.l1 span{color:var(--text);display:block}.cv-tag{color:#fff3dc;max-width:46ch;font:600 clamp(15px, 2vw, 21px)/1.3 var(--body);letter-spacing:.04em;text-shadow:0 2px 10px #000000b3;margin:12px auto 0}.cv-low{flex-direction:column;align-items:center;gap:clamp(12px,2.4vh,22px);width:100%;display:flex}.cv-how{order:1;grid-template-columns:repeat(3,minmax(0,250px));justify-content:center;gap:12px;width:100%;display:grid}.cv-card{border:1px solid #ffffff24;border-top:3px solid var(--ipe);text-align:left;backdrop-filter:blur(6px);background:#121016b8;border-radius:6px;padding:12px 14px}.cv-card:nth-child(2){border-top-color:var(--pixo)}.cv-card:nth-child(3){border-top-color:#3bceac}.cv-card b{font:400 16px/1 var(--display);color:var(--text);margin-bottom:7px;display:block}.cv-card p{color:#d8d2c6;font:500 14px/1.4 var(--body);margin:0}.cv-go{flex-direction:column;order:2;align-items:center;gap:8px;width:100%;min-height:64px;display:flex}.cv-foot{color:#f4f1eaa6;font:600 12px var(--body);letter-spacing:.12em;text-transform:uppercase;order:3;margin:0}.cv-foot a,footer a{color:#f4f1ea;border-bottom:1px solid #f4f1ea73;text-decoration:none}.cv-foot a:hover,footer a:hover{color:var(--ipe);border-color:var(--ipe)}.bar{background:#ffffff24;border-radius:3px;width:min(260px,70vw);height:6px;overflow:hidden}.bar i{background:var(--ipe);width:0;height:100%;transition:width .2s;display:block}.cv-load{color:var(--muted);letter-spacing:.12em;text-transform:uppercase;font:600 13px var(--body);margin:0}.loaded .bar,.loaded .cv-load{display:none}#play{font:400 clamp(22px, 3vw, 30px)/1 var(--display);color:#1b1c1e;background:var(--ipe);cursor:pointer;border:0;border-radius:6px;align-items:center;gap:12px;padding:14px 40px 12px;animation:1.6s ease-in-out infinite cvPulse;display:inline-flex;box-shadow:0 5px #a8800f,0 12px 30px #00000073}#play:hover{filter:brightness(1.08)}#play:active{transform:translateY(3px);box-shadow:0 2px #a8800f}#play .pad{color:#1b1c1e;width:26px;height:30px;margin-top:-4px;display:none;overflow:visible}#play.locked .pad{display:block}#play .shackle{transform-origin:46px 32px;transition:transform .3s}#play.rattle{animation:.42s linear rattle}#play.rattle .shackle{transform:translateY(-4px)}@keyframes rattle{15%{transform:rotate(-4deg)}30%{transform:rotate(4deg)}45%{transform:rotate(-3deg)}60%{transform:rotate(3deg)}80%{transform:scale(.94)}to{opacity:.4;transform:scale(.9)}}@keyframes cvPulse{50%{transform:scale(1.04)}}.lockhint{color:#fff3dc;font:600 14px var(--body);letter-spacing:.04em;text-shadow:0 2px 8px #000c;margin:2px 0 0}.gate{opacity:0;transform-origin:top;width:min(460px,100%);transition:opacity .35s,transform .55s cubic-bezier(.2,1.3,.4,1);transform:perspective(900px)rotateX(-70deg)translateY(-10px)}.gate.in{opacity:1;transform:none}.card{background:var(--paper);color:#111;text-align:left;border:4px solid #111;padding:26px 22px 16px;position:relative;transform:rotate(-.6deg);box-shadow:8px 8px #111,0 30px 80px #0009}.card h2{font:400 clamp(24px, 6vw, 30px)/1.05 var(--display);color:var(--red);margin:0 0 6px}.card .pitch{color:#2b2622;margin:0 0 14px;font-size:17px;font-weight:600;line-height:1.35}.row{gap:8px;display:flex}.row input{color:#111;background:#fffdf6;border:3px solid #111;border-radius:0;flex:auto;min-width:0;min-height:50px;padding:0 14px;font-size:17px;font-weight:600}.row input:focus-visible{outline:3px solid var(--red);outline-offset:2px}.row button{background:var(--ipe);color:#111;min-height:50px;font:400 18px var(--display);cursor:pointer;border:3px solid #111;flex:none;padding:0 18px;transition:transform 80ms,box-shadow 80ms;box-shadow:4px 4px #111}.row button:hover{background:#ffe066}.row button:active{transform:translate(3px,3px);box-shadow:1px 1px #111}.row button:disabled{opacity:.7;cursor:progress}.card :focus-visible{outline-color:var(--red)}.fine{color:#6b6458;margin:8px 0 0;font-size:14px;font-weight:600}.err{color:var(--red);margin:8px 0 0;font-weight:700}.shake{animation:.35s shake}@keyframes shake{25%{transform:translate(-8px)rotate(-.6deg)}75%{transform:translate(8px)rotate(-.6deg)}}.pow{background:var(--ipe);font:400 clamp(28px, 8vw, 44px) var(--display);color:var(--red);-webkit-text-stroke:1px #111;white-space:nowrap;pointer-events:none;opacity:0;z-index:2;border:3px solid #111;padding:8px 18px 4px;position:absolute;top:40%;left:50%;transform:translate(-50%,-50%)rotate(-7deg)scale(0);box-shadow:5px 5px #111}.burst .pow{animation:1.2s cubic-bezier(.2,1.6,.4,1) both pow}@keyframes pow{0%{opacity:0;transform:translate(-50%,-50%)rotate(-7deg)scale(0)}25%{opacity:1;transform:translate(-50%,-50%)rotate(-7deg)scale(1.15)}40%,to{opacity:1;transform:translate(-50%,-50%)rotate(-7deg)scale(1)}}.burst{animation:.6s flash}@keyframes flash{0%{background:#fff6c2}to{background:var(--paper)}}.ig{color:#111;border-top:2px dashed #b9b2a3;align-items:center;gap:12px;margin-top:14px;padding:12px 4px 2px;text-decoration:none;display:flex}.ig svg{color:#fff;background:radial-gradient(circle at 30% 107%,#fdf497 0%,#fd5949 45%,#d6249f 60%,#285aeb 90%);border-radius:9px;flex:none;width:34px;height:34px;padding:4px}.ig b{font-size:18px;display:block}.ig small{color:#6b6458;font-size:14px;font-weight:600;display:block}.ig:hover b{text-decoration:underline}#comic{z-index:10;background:var(--ink);position:fixed;inset:0;overflow-y:auto}#comic[hidden]{display:none}.book{perspective:1700px;position:fixed;inset:0;overflow:hidden}.page{background:var(--paper);transform-origin:0;animation:flipin var(--d,.4s) cubic-bezier(.2,.7,.3,1) both;gap:10px;padding:10px;display:grid;position:absolute;inset:5vh 5vw;box-shadow:0 30px 80px #000000b3,inset 0 0 0 3px #111}@keyframes flipin{0%{transform:rotateY(-105deg) rotateZ(var(--rz,0deg));filter:brightness(.35)}to{transform:rotateY(0) rotateZ(var(--rz,0deg));filter:none}}.page>div{background:#222;border:4px solid #111;position:relative;overflow:hidden}.page img{object-fit:cover;width:100%;height:100%;display:block}.page i{font:700 clamp(11px, 1.4vw, 15px) var(--body);color:#111;letter-spacing:.05em;background:#fff8d8;border:2px solid #111;padding:3px 10px;font-style:normal;position:absolute;top:10px;left:10px}.page b{background:var(--ipe);font:400 clamp(18px, 3vw, 38px) var(--display);color:var(--red);-webkit-text-stroke:1px #111;border:3px solid #111;padding:4px 12px 2px;position:absolute;transform:rotate(-6deg);box-shadow:4px 4px #111}.scrim{pointer-events:none;opacity:0;background:radial-gradient(at 50% 45%,#0b0b0d59,#0b0b0dd1 75%);transition:opacity 1.2s;position:fixed;inset:0}.ready .scrim{opacity:1}.bk{z-index:3;background:var(--ink);place-items:center;transition:opacity .3s;display:grid;position:fixed;inset:0}.bk.go{opacity:0;pointer-events:none}.ld{letter-spacing:.4em;text-transform:uppercase;opacity:.75;text-align:center;margin:0;padding:0 16px;font-size:14px;font-weight:700;animation:1.2s ease-in-out infinite ldp}@keyframes ldp{50%{opacity:.25}}.front{z-index:2;pointer-events:none;flex-direction:column;justify-content:center;align-items:center;gap:clamp(18px,3vh,34px);min-height:100svh;padding:64px 16px 72px;display:flex;position:relative}.ready .front{pointer-events:auto}.logo{opacity:0;transition:opacity .25s,transform .5s cubic-bezier(.2,1.4,.4,1);transform:scale(1.25)}.logo-on .logo{opacity:1;transform:scale(1)}.logo .from{text-align:center;letter-spacing:.4em;text-transform:uppercase;opacity:0;margin:0 0 10px;font-size:clamp(11px,1.3vw,14px);font-weight:800;transition:opacity .8s .4s}.ready .logo .from{opacity:.85}.band{text-align:center;background:#111;padding:clamp(10px,2vw,22px) clamp(16px,3.4vw,44px) clamp(10px,1.6vw,18px);transition:transform .9s cubic-bezier(.2,.8,.2,1);box-shadow:0 0 0 4px #111,0 24px 60px #0009}.logo .h{font:400 clamp(48px, 11.5vw, 150px)/.95 var(--display);letter-spacing:.01em;white-space:nowrap;margin:0}.logo .w1{color:var(--ipe)}.logo .w2{color:var(--text)}.logo .h span{text-shadow:.035em .045em 0 var(--pink), .06em .075em 0 #000}.logo .h.flick{color:#0000;-webkit-text-stroke:2px #ffffffd9;background-position:50%;background-size:cover;-webkit-background-clip:text;background-clip:text}.logo .h.flick span{color:#0000;text-shadow:none}.logo .sub{color:var(--ipe);letter-spacing:.32em;text-transform:uppercase;opacity:0;margin:10px 0 0;font-size:clamp(11px,1.6vw,20px);font-weight:800;transition:opacity .6s .15s}.slam .logo .sub{opacity:1}.slam .band{animation:.45s cubic-bezier(.2,1.6,.4,1) slam}@keyframes slam{0%{transform:scale(1.12)rotate(-1.5deg)}to{transform:none}}.ready .band{transform:scale(.78)}.done{opacity:0;width:min(460px,100%);max-height:0;transition:max-height 1s cubic-bezier(.2,.8,.2,1),opacity .7s .25s,transform .9s cubic-bezier(.2,.8,.2,1) .2s;transform:translateY(40px)}.ready .done{opacity:1;max-height:900px;transform:none}.arrival .done{display:none}#comic.leaving{opacity:0;pointer-events:none;transition:opacity .6s}.soon{color:#6b6458;min-height:50px;font:400 18px var(--display);cursor:not-allowed;background:#ddd6c6;border:3px solid #111;justify-content:center;align-items:center;margin:4px 0 2px;text-decoration:none;display:flex}.soon.live{background:var(--ipe);color:#111;cursor:pointer;box-shadow:4px 4px #111}.links{justify-content:space-between;margin-top:10px;display:flex}.links button{color:#6b6458;cursor:pointer;background:0 0;border:0;padding:4px 0;font-size:14px;font-weight:600;text-decoration:underline}.skip{right:16px;bottom:max(14px, env(safe-area-inset-bottom));z-index:4;color:#bbb;cursor:pointer;background:0 0;border:0;padding:8px;font-size:14px;font-weight:600;position:fixed}.ready .skip{display:none}footer{z-index:2;text-align:center;color:#8f897c;padding:0 16px max(14px, env(safe-area-inset-bottom));opacity:0;margin-top:-56px;font-size:12px;transition:opacity 1s .6s;position:relative}.ready footer{opacity:1}@media (width<=760px){.cv-how{grid-template-columns:minmax(0,360px)}.cv-go{order:0}}@media (width<=560px){.page{gap:6px;padding:6px;inset:3vh 3vw}.row{flex-direction:column}.row button{width:100%}.card{padding:24px 16px 14px}.ready .band{transform:scale(.9)}}@media (prefers-reduced-motion:reduce){.page,.band,.burst,.burst .pow,.ld,#play,#play.rattle{animation:none!important}.cv-bg{transition:opacity .3s;transform:none}.gate,.done,.logo,.scrim{transition:none}}
