:root{--ink: #2b1b33;--ink-soft: #6b5873;--paper: #fffaf3;--pink: #ff8fb4;--pink-deep: #ff4d7a;--pink-pale: #ffe3ef;--cream: #fff6e6;--lav: #b8a3f0;--mint: #8de0b8;--yellow: #ffd36b;--px: 3px;--pixel-box: 0 calc(var(--px) * -1) 0 0 var(--ink), 0 var(--px) 0 0 var(--ink), calc(var(--px) * -1) 0 0 0 var(--ink), var(--px) 0 0 0 var(--ink);--pixel-box-lift: var(--pixel-box), 0 calc(var(--px) * 3) 0 0 rgba(43, 27, 51, .22);--head: "Press Start 2P", ui-monospace, monospace;--body: "Pixelify Sans", ui-rounded, system-ui, sans-serif;--ease: cubic-bezier(.2, .8, .2, 1);color-scheme:light}*{box-sizing:border-box}html,body{margin:0}html:not(.admin),html:not(.admin) body{height:100%;overflow:hidden}body{background:linear-gradient(180deg,var(--pink-pale) 0%,#fff0f0 55%,var(--cream) 100%);color:var(--ink);font-family:var(--body);font-size:18px;-webkit-tap-highlight-color:transparent;overscroll-behavior:none}canvas{image-rendering:pixelated;image-rendering:crisp-edges}.fx-back,.fx-front{position:fixed;top:0;right:0;bottom:0;left:0;width:100vw;height:100vh;pointer-events:none}.fx-back{z-index:0}.fx-front{z-index:60}#app{position:relative;z-index:1;height:100dvh;max-width:480px;margin:0 auto}.screen{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;gap:12px;padding:max(16px,env(safe-area-inset-top)) 16px calc(56px + env(safe-area-inset-bottom));opacity:0;transform:translateY(10px);transition:opacity .18s var(--ease),transform .18s var(--ease)}.screen.in{opacity:1;transform:none}.screen.leaving{opacity:0;transform:translateY(-10px);pointer-events:none}.stage{flex:1;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px}.bottom{display:flex;flex-direction:column;gap:12px}.dialog{position:relative;display:flex;align-items:flex-start;gap:12px;margin:var(--px);padding:14px 14px 16px;background:var(--paper);box-shadow:var(--pixel-box-lift);min-height:92px;animation:pop-in .16s var(--ease);cursor:pointer}.dialog.hidden{display:none}.portrait{flex:none;width:66px;height:60px;background:var(--pink-pale);box-shadow:var(--pixel-box)}.dialog-body{flex:1;min-width:0}.dialog-name{display:inline-block;font-family:var(--head);font-size:9px;color:var(--pink-deep);letter-spacing:1px;text-transform:uppercase;margin-bottom:6px}.dialog-text{margin:0;font-size:20px;line-height:1.25;overflow-wrap:anywhere}.dialog-next{position:absolute;right:12px;bottom:6px;font-size:12px;color:var(--pink-deep);opacity:0}.dialog-next.show{opacity:1;animation:nudge .6s steps(2) infinite}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;margin:var(--px);padding:14px 18px;font-family:var(--head);font-size:12px;line-height:1.4;color:var(--ink);background:#fff;box-shadow:var(--pixel-box-lift);cursor:pointer;text-align:center;text-decoration:none;transition:transform .12s var(--ease),box-shadow .12s var(--ease),background .12s;touch-action:manipulation}.btn:hover{background:#fff3f8}.btn.primary{background:var(--pink)}.btn.primary:hover{background:#ff9fc0}.btn.ghost{background:transparent;box-shadow:none;color:var(--ink-soft)}.btn:active:not(:disabled){transform:translateY(var(--px));box-shadow:var(--pixel-box)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn.big{font-size:15px;padding:18px 22px}.btn.small{font-size:10px;padding:10px 12px}:focus-visible{outline:3px dashed var(--pink-deep);outline-offset:5px}.actions>.btn:not(.big){width:calc(100% - var(--px) * 2)}.form{overflow-x:hidden}.choices{display:flex;flex-direction:column;gap:8px}.row{display:flex;gap:8px;justify-content:center;align-items:center;flex-wrap:wrap}.actions .row .btn.primary{flex:1}.ask{display:flex;gap:8px;align-items:center}.field{width:calc(100% - var(--px) * 2);margin:var(--px);padding:12px 14px;border:0;font-family:var(--body);font-size:20px;color:var(--ink);background:#fff;box-shadow:var(--pixel-box);border-radius:0}.field.small{font-size:17px;padding:9px 12px}.field::placeholder{color:#b9a9bf}.field:focus{outline:none;background:#fff8fb;box-shadow:var(--pixel-box),0 0 0 6px #ff8fb459}.chips{display:flex;flex-wrap:wrap;gap:6px}.chip{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;margin:var(--px);padding:8px 10px;font-family:var(--body);font-size:17px;color:var(--ink);background:#fff;box-shadow:var(--pixel-box);cursor:pointer;transition:background .12s,transform .12s var(--ease)}.chip[aria-pressed=true]{background:var(--pink);transform:translateY(-2px)}.form{width:100%;display:flex;flex-direction:column;gap:8px;overflow-y:auto;padding:4px}.label{margin:6px 0 0;font-family:var(--head);font-size:10px;color:var(--ink-soft);display:flex;flex-direction:column;gap:6px}.error{min-height:1.2em;margin:0;color:var(--pink-deep);font-size:16px}.mute{position:fixed;z-index:70;top:max(10px,env(safe-area-inset-top));right:10px;width:38px;height:38px;border:0;background:#ffffffb3;box-shadow:var(--pixel-box);font-size:16px;cursor:pointer}.char{height:min(160px,22dvh);width:auto}.bob{animation:bob 1.2s steps(2) infinite}.bob.delay{animation-delay:.6s}.solo .char{height:min(224px,32dvh)}.duo{display:flex;align-items:flex-end;justify-content:center;gap:6px}.duo-gap{width:36px}.duo-gap.q{align-self:center;font-family:var(--head);font-size:26px;text-align:center;color:var(--pink-deep);animation:bob .8s steps(2) infinite}.duo-heart{align-self:center;width:45px;height:auto}.mystery{display:grid;place-items:center;width:calc(min(160px,22dvh)*.69);font-family:var(--head);font-size:34px;color:var(--ink-soft);border:3px dashed rgba(43,27,51,.25);animation:bob 1.2s steps(2) infinite .6s}.beat{animation:beat .9s var(--ease) infinite}.title-card{text-align:center}.eyebrow{margin:0;font-family:var(--head);font-size:10px;letter-spacing:2px;color:var(--ink-soft);text-transform:uppercase}.logo{margin:14px 0 10px;font-family:var(--head);font-size:clamp(34px,11vw,48px);line-height:1;color:#fff;text-shadow:3px 0 var(--ink),-3px 0 var(--ink),0 3px var(--ink),0 -3px var(--ink),3px 3px var(--ink),-3px 3px var(--ink),3px -3px var(--ink),-3px -3px var(--ink),0 7px var(--pink-deep)}.logo span{color:var(--pink)}.sub{margin:0;font-size:18px;color:var(--ink-soft)}.blink-soft{animation:soft-blink 1.4s steps(2) infinite}.title .actions{display:flex;justify-content:center}.select-preview .char{height:min(192px,24dvh)}.select-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;width:100%}.pick{position:relative;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;margin:var(--px);padding:6px 0 4px;background:#fff;box-shadow:var(--pixel-box);cursor:pointer;transition:transform .12s var(--ease),background .12s}.pick canvas{display:block;margin:0 auto;height:min(64px,9dvh);width:auto}.pick.on{background:var(--pink);transform:translateY(-3px)}.guess-tag{position:absolute;top:-10px;right:-8px;font-size:18px}.level-card{text-align:center}.level-card h2{margin:12px 0 0;font-family:var(--head);font-size:clamp(20px,7vw,28px);line-height:1.3}.game{width:100%;display:flex;flex-direction:column;align-items:center;gap:8px}.hud{font-family:var(--head);font-size:11px;min-height:1.4em}.game-frame{position:relative;box-shadow:var(--pixel-box-lift);margin:var(--px);line-height:0}.game-canvas{display:block;height:min(calc(100dvh - 190px),600px);width:auto;max-width:calc(100vw - 40px);aspect-ratio:2 / 3;touch-action:none;cursor:grab}.level .bottom{min-height:0}.banner{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;font-family:var(--head);font-size:34px;line-height:1.2;color:#fff;text-shadow:3px 3px var(--ink),-3px -3px var(--ink),3px -3px var(--ink),-3px 3px var(--ink);pointer-events:none}.banner.pop{animation:pop-in .26s var(--ease)}.banner.good{color:var(--mint)}.banner.bad{color:var(--pink-deep)}.toasts{position:absolute;top:10px;left:0;right:0;display:flex;flex-direction:column;align-items:center;gap:4px;pointer-events:none;line-height:1.2}.toast{padding:6px 10px;font-size:16px;color:#fff;background:var(--pink-deep);box-shadow:var(--pixel-box);animation:toast 1.6s var(--ease) forwards}.toast.good{background:var(--lav);color:var(--ink)}.callout{position:absolute;left:8%;right:8%;top:34%;padding:12px 10px 14px;text-align:center;line-height:1.2;color:#fff;background:#ff3b4e;box-shadow:var(--pixel-box-lift);animation:slam 1.5s var(--ease) forwards;pointer-events:none;z-index:3}.callout.good{background:var(--lav);color:var(--ink)}.callout-title{margin:0 0 6px;font-family:var(--head);font-size:13px;letter-spacing:1px}.callout-text{margin:0;font-size:21px}.game-frame.shake{animation:shake .36s steps(6)}.game-frame:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;opacity:0}.game-frame.flash-bad:after{background:#ff3b4e;animation:flash .38s ease-out}.game-frame.flash-good:after{background:#ffe48a;animation:flash .38s ease-out}.quiz{width:100%;display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center}.meter{display:flex;gap:6px}.pip{width:30px;height:30px;display:grid;place-items:center;font-size:18px;color:#c9b8cf;background:#fff;box-shadow:var(--pixel-box);margin:var(--px);transition:background .16s,transform .16s var(--ease)}.pip.yes{color:#fff;background:var(--pink-deep);transform:translateY(-3px)}.pip.no{color:var(--ink-soft);background:#eee6f0}.quiz-q{margin:6px 0 0;min-height:2.6em;font-family:var(--head);font-size:clamp(13px,4vw,16px);line-height:1.5}.timebar{width:100%;height:10px;background:#fff;box-shadow:var(--pixel-box);margin:var(--px)}.timebar span{display:block;height:100%;width:100%;background:linear-gradient(90deg,var(--pink-deep),var(--pink))}.quiz-cards{width:100%;display:flex;align-items:center;gap:8px}.quiz-cards.shake{animation:shake .36s steps(6)}.quiz-or{font-family:var(--head);font-size:10px;color:var(--ink-soft)}.quiz-card{flex:1;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;margin:var(--px);min-height:min(170px,24dvh);padding:14px 8px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;font-family:var(--body);color:var(--ink);background:#fff;box-shadow:var(--pixel-box-lift);cursor:pointer;transition:transform .14s var(--ease),background .14s,opacity .2s}.quiz-card:hover:not(:disabled){transform:translateY(-4px) rotate(-1deg);background:#fff3f8}.quiz-card:active:not(:disabled){transform:translateY(2px)}.quiz-card:disabled{cursor:default;opacity:.55}.quiz-card.right{opacity:1;background:#c9f5dc;transform:translateY(-6px) scale(1.04)}.quiz-card.wrong{opacity:1;background:#ffd0d6}.quiz-card.right:after,.quiz-card.wrong:after{font-family:var(--head);font-size:22px;animation:pop-in .2s var(--ease)}.quiz-card.right:after{content:"✓";color:#2e9e64}.quiz-card.wrong:after{content:"✕";color:var(--pink-deep)}.enter-left{animation:from-left .26s var(--ease)}.enter-right{animation:from-right .26s var(--ease)}.quiz-emoji{font-size:46px;line-height:1}.quiz-label{font-size:19px}.compat{margin:8px 0 0;font-family:var(--head);font-size:54px;color:var(--pink-deep);text-shadow:4px 4px var(--ink)}.compat.pop{animation:pop-in .4s var(--ease)}.bonus{width:100%;display:flex;flex-direction:column;align-items:center;gap:8px;flex:1;min-height:0}.bonus-title{margin:0;font-family:var(--head);font-size:clamp(15px,5vw,20px);text-align:center}.arena{position:relative;width:100%;flex:1;min-height:260px;margin:var(--px);background:repeating-linear-gradient(45deg,#fff8fb 0,#fff8fb 12px,#fff 12px,#fff 24px);box-shadow:var(--pixel-box-lift);overflow:hidden;touch-action:none}.arena.over{filter:saturate(.6)}.btn.escape{position:absolute;left:0;top:0;margin:0;white-space:nowrap;transform-origin:center;transition:transform .14s var(--ease),background .12s}.reveal-wrap{position:relative}.reveal-pop{animation:reveal .6s var(--ease),bob 1.2s steps(2) infinite .6s}.reveal-wrap:before{content:"✨";position:absolute;top:-18px;right:-14px;font-size:22px;animation:soft-blink 1s steps(2) infinite}.aside{font-family:var(--body);font-size:14px;color:var(--ink-soft);text-transform:none}.status-title{margin:14px 0 0;font-family:var(--head);font-size:clamp(14px,4.4vw,18px);line-height:1.6}.status-emoji{margin:0 0 8px;font-size:56px}.preview-badge{position:fixed;z-index:70;top:max(10px,env(safe-area-inset-top));left:10px;padding:6px 8px;font-family:var(--head);font-size:8px;background:var(--yellow);box-shadow:var(--pixel-box)}.heart-canvas{width:240px;height:180px;margin-bottom:-40px}.token{margin:var(--px);padding:16px 18px;background:var(--paper);box-shadow:var(--pixel-box-lift);text-align:center;max-width:320px}.token.drop{animation:drop .52s var(--ease)}.token-coin{font-size:34px;animation:bob 1s steps(2) infinite}.token-caption{margin:8px 0 4px;font-family:var(--head);font-size:10px;line-height:1.6}.token-handle{margin:0 0 10px;font-size:22px;color:var(--pink-deep)}.the-end{text-align:center;display:flex;flex-direction:column;align-items:center;gap:8px}.end-title{margin:4px 0 0;font-family:var(--head);font-size:14px}.fine{margin:0;font-size:15px;color:var(--ink-soft)}.hint{margin:0;font-size:15px;color:var(--ink-soft);text-align:center;animation:pop-in .3s var(--ease)}.score{text-align:center}.stars{margin:0;font-family:var(--head);font-size:40px;letter-spacing:6px;color:var(--yellow);text-shadow:3px 3px var(--ink),-2px -2px var(--ink)}.secret-door{position:fixed;z-index:40;right:18px;bottom:calc(6px + env(safe-area-inset-bottom));padding:4px;border:0;background:none;cursor:pointer;opacity:0;pointer-events:none;transform-origin:bottom center;transition:opacity .2s var(--ease)}.secret-door.visible{opacity:1;pointer-events:auto;animation:wiggle 5s infinite}.secret-door canvas{display:block;filter:drop-shadow(0 0 6px rgba(255,211,107,.8))}.door-glow{padding:28px;background:radial-gradient(circle,rgba(255,236,160,.95) 0%,rgba(255,211,107,.4) 45%,transparent 70%);animation:glow 1.8s ease-in-out infinite alternate}.door-big{height:min(130px,18dvh);width:auto;display:block}@keyframes bob{50%{transform:translateY(-4px)}}@keyframes nudge{50%{transform:translateY(3px)}}@keyframes soft-blink{50%{opacity:.7}}@keyframes pop-in{0%{transform:scale(.92);opacity:0}}@keyframes drop{0%{transform:translateY(-60px);opacity:0}70%{transform:translateY(6px)}}@keyframes toast{0%{transform:translateY(6px);opacity:0}12%,80%{transform:none;opacity:1}to{transform:translateY(-8px);opacity:0}}@keyframes beat{0%,to{transform:scale(1)}15%{transform:scale(1.18)}30%{transform:scale(1)}45%{transform:scale(1.1)}}@keyframes wiggle{0%,86%,to{transform:rotate(0)}89%{transform:rotate(-8deg)}92%{transform:rotate(7deg)}95%{transform:rotate(-4deg)}}@keyframes slam{0%{transform:scale(1.7) rotate(-4deg);opacity:0}12%{transform:scale(.95) rotate(1deg);opacity:1}20%,82%{transform:none;opacity:1}to{transform:translateY(-10px);opacity:0}}@keyframes shake{0%,to{transform:none}20%{transform:translate(-6px,2px)}40%{transform:translate(5px,-2px)}60%{transform:translate(-4px,1px)}80%{transform:translate(3px)}}@keyframes flash{0%{opacity:.45}to{opacity:0}}@keyframes from-left{0%{transform:translate(-40px) rotate(-6deg);opacity:0}}@keyframes from-right{0%{transform:translate(40px) rotate(6deg);opacity:0}}@keyframes reveal{0%{transform:scale(0) rotate(-20deg);opacity:0}70%{transform:scale(1.15) rotate(3deg);opacity:1}}@keyframes glow{to{transform:scale(1.06)}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:1ms!important;animation-iteration-count:1!important;transition-duration:1ms!important}}@media (max-height: 640px){.dialog-text{font-size:18px}.dialog{min-height:76px;padding:10px 12px 12px}.portrait{width:44px;height:40px}}.field.note{resize:none;font-size:18px;line-height:1.25}html:not(.admin) body{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;touch-action:manipulation}html:not(.admin) input,html:not(.admin) textarea{-webkit-user-select:text;user-select:text}@media (max-height: 520px){.screen.contact .dialog,.screen.prefs .dialog{display:none}.screen{padding-bottom:12px}.secret-door{display:none}}@media (max-height: 700px){.screen{gap:8px;padding-top:max(10px,env(safe-area-inset-top))}.logo{margin:8px 0 6px}.btn{padding:12px 14px}.choices{gap:4px}.quiz-emoji{font-size:38px}.quiz-card{min-height:min(140px,22dvh)}.form{gap:4px}.field{padding:10px 12px}}@media (max-width: 360px){.dialog-text{font-size:18px}.quiz-label{font-size:17px}.select-grid{gap:4px}}.screen.prefs,.screen.contact,.screen.bonus-scene,.screen.level,.screen.select{padding-top:max(56px,calc(env(safe-area-inset-top) + 48px))}.bonus-title{font-size:clamp(12px,4.2vw,18px)}