:root{--bg: #0b0614;--bg2: #160b28;--ink: #f4ecff;--muted: #cbbbe3;--pink: #ff3d9a;--gold: #ffe27a;--teal: #7dffb3;--blue: #5b9cff;--panel: rgba(18, 10, 32, .86);--line: rgba(255, 226, 122, .28)}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--ink)}body{font-family:Atkinson Hyperlegible,Georgia,sans-serif;font-size:20px;line-height:1.45;background:radial-gradient(1000px 500px at 10% -10%,rgba(255,61,154,.18),transparent 50%),radial-gradient(800px 400px at 100% 0%,rgba(91,156,255,.16),transparent 45%),var(--bg)}button,input{font:inherit}a{color:var(--gold)}#app{min-height:100dvh}.scan{pointer-events:none;position:fixed;top:0;right:0;bottom:0;left:0;background:repeating-linear-gradient(to bottom,rgba(255,255,255,.025),rgba(255,255,255,.025) 1px,transparent 1px,transparent 4px);z-index:50}.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 18px;border-bottom:2px solid var(--line);background:#0b0614cc;position:sticky;top:0;z-index:10}.brand{font-family:"Press Start 2P",monospace;font-size:11px;letter-spacing:1px;color:var(--gold);text-decoration:none}.top-actions{display:flex;gap:8px;align-items:center}.ghost{background:transparent;color:var(--muted);border:2px solid rgba(255,255,255,.14);border-radius:999px;padding:8px 12px;cursor:pointer}.ghost:hover{color:var(--ink);border-color:var(--gold)}.wrap{width:min(1100px,calc(100% - 28px));margin:0 auto;padding:22px 0 80px}.hero{display:grid;grid-template-columns:160px 1fr;gap:22px;align-items:center;margin-bottom:28px}.hero img{width:160px;height:160px;object-fit:cover;border-radius:18px;border:3px solid var(--pink);box-shadow:0 0 0 4px #ff3d9a33,0 16px 40px #0006}.pix{font-family:"Press Start 2P",monospace}h1.pix{font-size:clamp(18px,3vw,28px);line-height:1.4;margin:0 0 8px;color:var(--gold)}.lede{margin:0;color:var(--muted);max-width:62ch}.progress-strip{margin-top:12px;color:var(--teal);font-weight:700}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px}.cab{display:flex;flex-direction:column;text-align:left;padding:0;border:3px solid rgba(255,255,255,.12);border-radius:16px;overflow:hidden;background:#140a22;color:inherit;text-decoration:none;cursor:pointer;box-shadow:0 10px #00000059;transition:transform .12s ease,box-shadow .12s ease}.cab:hover{transform:translateY(-3px);box-shadow:0 14px #00000059}.cab img{width:100%;height:120px;object-fit:cover;display:block}.cab .body{padding:12px 12px 14px}.cab .num{font-family:"Press Start 2P",monospace;font-size:8px;color:var(--gold)}.cab h2{margin:6px 0 4px;font-size:22px}.cab .retro{color:var(--muted);font-size:15px}.cab.done{border-color:var(--teal)}.cab .badge{margin-top:8px;color:var(--teal);font-weight:700;font-size:15px}.panel{background:var(--panel);border:2px solid var(--line);border-radius:18px;padding:18px 18px 20px;margin:14px 0}.lesson-art{width:100%;max-height:280px;object-fit:cover;border-radius:14px;border:2px solid rgba(255,255,255,.12);margin:8px 0 14px}.hub-banner{max-height:200px;margin-bottom:18px}.kicker{font-family:"Press Start 2P",monospace;font-size:9px;color:var(--gold);letter-spacing:1px}h2{margin:6px 0 10px;font-size:30px}.joke{color:var(--gold);font-style:italic}.split{display:grid;grid-template-columns:1fr 1fr;gap:12px}.do,.dont{border-radius:12px;padding:12px 14px}.do{background:#7dffb31a;border:2px solid rgba(125,255,179,.4)}.dont{background:#ff3d9a1a;border:2px solid rgba(255,61,154,.4)}.do h3{color:var(--teal);margin:0 0 6px}.dont h3{color:var(--pink);margin:0 0 6px}.row{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}.btn{font-family:"Press Start 2P",monospace;font-size:11px;line-height:1.4;padding:14px 16px;border-radius:10px;border:3px solid #000;cursor:pointer;background:var(--gold);color:#1a1020;box-shadow:0 5px #8a7420;text-decoration:none;display:inline-block}.btn:hover{filter:brightness(1.05)}.btn.pink{background:var(--pink);color:#fff;box-shadow:0 5px #8a1450}.btn.teal{background:var(--teal);box-shadow:0 5px #2e8a58}.btn:disabled{opacity:.45;cursor:not-allowed}.choice{display:block;width:100%;text-align:left;margin:10px 0;padding:14px 16px;border-radius:12px;border:2px solid rgba(255,255,255,.16);background:#12081e;color:var(--ink);cursor:pointer}.choice:hover{border-color:var(--gold)}.choice.good{border-color:var(--teal);background:#7dffb31f}.choice.bad{border-color:var(--pink);background:#ff3d9a1a}.why{margin:6px 0 0;color:var(--muted);font-size:17px}.choice-plain{display:block;margin-top:6px;color:var(--muted);font-size:16px}.plain-box{margin:10px 0 14px;padding:12px 14px;border-radius:12px;background:#5b9cff1f;border:2px solid rgba(91,156,255,.35);color:#dce8ff;font-size:18px}.plain-box strong{color:var(--blue)}.lock{padding:12px 14px;border-radius:12px;background:#ffe27a14;border:2px dashed rgba(255,226,122,.35)}.game-shell{display:grid;gap:10px}.game-stage{background:#000;border:4px solid var(--pink);border-radius:12px;overflow:hidden;box-shadow:0 0 0 4px #ff3d9a2e}.game-canvas{width:100%;height:auto;display:block;image-rendering:pixelated;background:#000}.hud-line{font-family:"Press Start 2P",monospace;font-size:10px;line-height:1.6;color:var(--gold)}.touch-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:8px 4px 0}.dpad{display:grid;grid-template-columns:56px 56px 56px;grid-template-rows:48px 48px 48px;gap:4px}.pad-up{grid-column:2;grid-row:1}.pad-left{grid-column:1;grid-row:2}.pad-right{grid-column:3;grid-row:2}.pad-down{grid-column:2;grid-row:3}.action-cluster{display:flex;gap:10px}.pad-btn{min-width:56px;min-height:48px;border-radius:12px;border:3px solid #000;background:#2a1848;color:#fff;font-family:"Press Start 2P",monospace;font-size:10px;cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:none}.pad-act{background:var(--gold);color:#1a1020;min-width:88px;min-height:64px;border-radius:999px}.pad-act2{background:var(--blue);min-width:76px}.gate{min-height:100dvh;display:grid;place-items:center;padding:24px}.gate-card{width:min(520px,100%);background:var(--panel);border:3px solid var(--pink);border-radius:20px;padding:22px;text-align:center}.gate-card img{width:140px;height:140px;object-fit:cover;border-radius:50%;border:3px solid var(--gold)}.gate-card input{width:100%;margin:12px 0;padding:12px;border-radius:10px;border:2px solid var(--line);background:#0b0614;color:#fff}.win-stars{font-size:36px;letter-spacing:6px;color:var(--gold)}.crumb{color:var(--muted);font-size:16px}table{width:100%;border-collapse:collapse}td{padding:8px 4px;border-bottom:1px solid rgba(255,255,255,.08)}@media(max-width:720px){body{font-size:18px}.hero,.split{grid-template-columns:1fr}h2{font-size:24px}}.pager-stage{position:relative;min-height:280px;margin:12px 0 8px}.pager-card{position:relative;background:var(--panel);border:3px solid var(--line);border-radius:20px;padding:22px 22px 26px;min-height:240px;transform-origin:50% 50%;box-shadow:0 14px #00000059,0 0 40px #ff3d9a1f}.pager-card.enter{animation:panel-in .42s cubic-bezier(.2,1.4,.3,1) both}@keyframes panel-in{0%{opacity:0;transform:translateY(28px) scale(.94);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}.pager-card .kicker{margin-bottom:8px}.pager-card h3{margin:0 0 10px;font-size:26px}.pager-card .line{font-size:24px;line-height:1.4;margin:0 0 12px}.pager-card .plain-box{margin-top:14px;padding:12px 14px;border-radius:12px;background:#5b9cff1f;border:2px solid rgba(91,156,255,.35);color:#dce8ff;font-size:18px}.pager-card .plain-box strong{color:var(--blue)}.pager-progress{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:4px 0 8px;font-family:"Press Start 2P",monospace;font-size:9px;color:var(--gold)}.pager-dots{display:flex;flex-wrap:wrap;gap:5px}.pager-dots i{width:8px;height:8px;border-radius:50%;background:#ffffff2e;display:block}.pager-dots i.on{background:var(--gold);box-shadow:0 0 8px var(--gold)}.pager-dots i.done{background:var(--teal)}.anim-tag{font-family:"Press Start 2P",monospace;font-size:8px;color:var(--pink);letter-spacing:1px}.next-panel{width:100%;margin-top:8px}.pager-card.busy,.fx-layer,.fx-bit,.fx-half{pointer-events:none}.exit-cartridge{animation:exit-cartridge .75s cubic-bezier(.2,.8,.2,1) forwards}@keyframes exit-cartridge{0%{transform:translateY(0) rotate(0)}18%{transform:translateY(10px) rotate(-2deg)}40%{transform:translateY(-18px) rotate(3deg)}to{transform:translateY(-140vh) rotate(-12deg);opacity:0;filter:brightness(1.4)}}.exit-crt{animation:exit-crt .7s ease-in forwards}@keyframes exit-crt{0%{transform:scaleY(1);filter:brightness(1)}35%{transform:scaleY(.06);filter:brightness(2.2)}55%{transform:scaleY(.06) scaleX(.08);filter:brightness(3)}to{transform:scaleY(.02) scaleX(.02);opacity:0}}.exit-smash{animation:exit-smash .72s cubic-bezier(.15,.9,.3,1) forwards}@keyframes exit-smash{0%{transform:scale(1)}12%{transform:scale(.92) rotate(-4deg);filter:contrast(1.4)}28%{transform:scale(1.12) rotate(6deg);filter:brightness(1.8)}to{transform:translate(40vw,-120vh) rotate(28deg) scale(.4);opacity:0}}.exit-tetris{animation:exit-tetris .7s steps(8,end) forwards}@keyframes exit-tetris{0%{filter:none;transform:none}20%{filter:brightness(4)}40%{transform:translate(-8px)}55%{transform:translate(120%);opacity:.6}to{transform:translate(160%);opacity:0}}.exit-chomp{animation:exit-chomp .68s ease-in forwards}@keyframes exit-chomp{0%{clip-path:circle(140% at 0% 50%)}to{clip-path:circle(0% at 0% 50%);opacity:0}}.exit-invader{animation:exit-invader .8s steps(6,end) forwards}@keyframes exit-invader{0%{transform:translate(0)}16%{transform:translate(18px,-16px)}32%{transform:translate(-18px,-40px)}48%{transform:translate(22px,-70px)}64%{transform:translate(-14px,-110px)}to{transform:translateY(-140vh);opacity:0}}.exit-coin{animation:exit-coin .7s cubic-bezier(.2,.8,.2,1) forwards}@keyframes exit-coin{0%{transform:rotateY(0) scale(1)}40%{transform:rotateY(540deg) scale(.35);filter:saturate(2) brightness(1.5)}to{transform:rotateY(900deg) scale(.08) translate(40vw,-40vh);opacity:0}}.exit-warp{animation:exit-warp .72s cubic-bezier(.7,0,.9,.2) forwards}@keyframes exit-warp{0%{transform:perspective(500px) translateZ(0) rotate(0);filter:hue-rotate(0deg)}to{transform:perspective(500px) translateZ(900px) rotate(18deg);opacity:0;filter:hue-rotate(160deg) blur(8px)}}.exit-glitch{animation:exit-glitch .65s linear forwards}@keyframes exit-glitch{0%{transform:none;filter:none}15%{transform:translate(-10px,2px);filter:drop-shadow(8px 0 #ff3d9a) drop-shadow(-8px 0 #5b9cff)}30%{transform:translate(14px,-4px) skew(-8deg)}50%{transform:translate(-18px,6px) skew(10deg);filter:contrast(2)}to{transform:translate(80vw,-10px) skew(20deg);opacity:0}}.exit-gravity{animation:exit-gravity .8s cubic-bezier(.6,.05,.9,.2) forwards}@keyframes exit-gravity{0%{transform:translateY(0)}18%{transform:translateY(-24px) rotate(-2deg)}32%{transform:translateY(8px)}48%{transform:translateY(-8px)}to{transform:translateY(120vh) rotate(8deg);opacity:0}}.exit-origami{animation:exit-origami .7s ease-in forwards}@keyframes exit-origami{0%{transform:rotateX(0) scaleX(1)}40%{transform:rotateX(88deg) scaleX(.7)}70%{transform:rotateX(88deg) rotateY(88deg) scale(.4)}to{transform:rotateX(88deg) rotateY(88deg) scale(.05);opacity:0}}.exit-helium{animation:exit-helium 1s ease-in forwards}@keyframes exit-helium{0%{transform:translate(0) rotate(0)}30%{transform:translate(-16px,-40px) rotate(-6deg)}60%{transform:translate(22px,-120px) rotate(8deg)}to{transform:translate(-10px,-140vh) rotate(-12deg);opacity:0;filter:blur(2px)}}.exit-shards{animation:exit-shards .2s linear forwards}@keyframes exit-shards{to{opacity:0}}.fx-bit{position:absolute;overflow:hidden;border-radius:4px;will-change:transform,opacity}.exit-magnet{animation:exit-magnet .65s cubic-bezier(.7,0,1,.2) forwards}@keyframes exit-magnet{0%{transform:scale(1) translate(0);filter:none}40%{transform:scaleX(1.25) scaleY(.7) translate(10%);filter:brightness(1.4)}to{transform:scale(.02) translate(30vw,-20vh);opacity:0}}.exit-flip{animation:exit-flip .7s ease-in forwards}@keyframes exit-flip{0%{transform:rotateY(0) translateZ(0)}to{transform:rotateY(-120deg) translateZ(-200px) translate(-40vw);opacity:0}}.exit-ink{animation:exit-ink .7s ease-in forwards}@keyframes exit-ink{0%{clip-path:circle(140% at 50% 50%);filter:none}40%{filter:contrast(1.4) brightness(.7)}to{clip-path:circle(0% at 50% 55%);opacity:0}}.exit-rocket{animation:exit-rocket .68s cubic-bezier(.2,.9,.3,1) forwards}@keyframes exit-rocket{0%{transform:translate(0) rotate(0)}20%{transform:translate(-8px,6px) rotate(-8deg)}to{transform:translate(90vw,-80vh) rotate(28deg);opacity:0;filter:blur(1px) brightness(1.5)}}.exit-quake{animation:exit-quake .8s ease-in forwards}@keyframes exit-quake{0%,8%,16%,24%{transform:translate(0)}4%{transform:translate(-10px,2px) rotate(-2deg)}12%{transform:translate(12px,-2px) rotate(2deg)}20%{transform:translate(-8px,3px)}40%{transform:scaleY(.85) translateY(10px)}to{transform:scaleY(1.4) translateY(120vh);opacity:0}}.exit-spiral{animation:exit-spiral .85s ease-in forwards}@keyframes exit-spiral{0%{transform:rotate(0) scale(1)}to{transform:rotate(720deg) scale(0);opacity:0}}.exit-ice{animation:exit-ice .25s linear forwards}@keyframes exit-ice{0%{filter:saturate(.2) brightness(1.6) hue-rotate(160deg)}to{opacity:0;filter:saturate(0) brightness(2)}}.exit-melt{animation:exit-melt .85s ease-in forwards}@keyframes exit-melt{0%{transform:scaleY(1);filter:none;border-radius:20px}40%{transform:scaleY(1.15) translateY(8px);filter:blur(.4px) saturate(1.6)}to{transform:scaleY(2.2) translateY(80vh);opacity:0;filter:blur(6px)}}.exit-shuffle{animation:exit-shuffle .6s cubic-bezier(.2,.8,.2,1) forwards}@keyframes exit-shuffle{0%{transform:translate(0) rotate(0)}30%{transform:translate(-8%,-6%) rotate(-8deg)}to{transform:translate(120%,8%) rotate(14deg);opacity:0}}.exit-portal{animation:exit-portal .7s cubic-bezier(.6,0,.8,.2) forwards}@keyframes exit-portal{0%{clip-path:ellipse(140% 140% at 50% 50%);transform:rotate(0)}to{clip-path:ellipse(0% 0% at 50% 50%);transform:rotate(25deg);opacity:0}}.exit-pinball{animation:exit-pinball .85s linear forwards}@keyframes exit-pinball{0%{transform:translate(0) rotate(0)}22%{transform:translate(28vw,-18vh) rotate(40deg)}44%{transform:translate(-22vw,10vh) rotate(-30deg)}66%{transform:translate(18vw,22vh) rotate(55deg)}to{transform:translate(80vw,-60vh) rotate(120deg);opacity:0}}.exit-hyper{animation:exit-hyper .55s cubic-bezier(.2,.1,.9,.2) forwards}@keyframes exit-hyper{0%{transform:scale(1);filter:none}to{transform:scale(6);opacity:0;filter:blur(10px) contrast(1.6)}}.exit-split{animation:exit-split .15s linear forwards}@keyframes exit-split{to{opacity:0}}.exit-untype{animation:exit-untype .15s linear forwards}@keyframes exit-untype{to{opacity:.15}}.exit-ko{animation:exit-ko .85s cubic-bezier(.4,.05,.8,.2) forwards}@keyframes exit-ko{0%{transform:rotate(0) scale(1);filter:none}15%{transform:scale(1.08);filter:brightness(3)}to{transform:rotate(240deg) translateY(110vh) scale(.6);opacity:0}}.exit-confetti{animation:exit-confetti .25s ease-out forwards}@keyframes exit-confetti{0%{transform:scale(1)}40%{transform:scale(1.08);filter:brightness(1.6)}to{transform:scale(.2);opacity:0}}.exit-vhs{animation:exit-vhs .9s ease-in forwards}@keyframes exit-vhs{0%{filter:none;transform:none}20%{filter:grayscale(.6) contrast(1.3)}35%{filter:grayscale(.6) contrast(1.3);transform:scaleY(.97)}55%{filter:grayscale(.2);transform:translate(-6px) skew(-4deg)}to{transform:translate(-130vw) skew(-12deg);opacity:0}}.fx-confetti{position:absolute;width:10px;height:14px;border-radius:2px;pointer-events:none}@media(prefers-reduced-motion:reduce){.pager-card.enter,.exit-cartridge,.exit-crt,.exit-smash,.exit-tetris,.exit-chomp,.exit-invader,.exit-coin,.exit-warp,.exit-glitch,.exit-gravity,.exit-origami,.exit-helium,.exit-shards,.exit-magnet,.exit-flip,.exit-ink,.exit-rocket,.exit-quake,.exit-spiral,.exit-ice,.exit-melt,.exit-shuffle,.exit-portal,.exit-pinball,.exit-hyper,.exit-split,.exit-untype,.exit-ko,.exit-confetti,.exit-vhs{animation:exit-fade .35s linear forwards}@keyframes exit-fade{to{opacity:0}}}