:root{box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);--page:#E4DAF1;--text:#2B1E3F;--soft:#6B5A85;--pad:#2B1E3F;--padText:#F3ECFB;--padActive:#4C3A6B;--g-bg:#B9A6D9;--g-ink:#2B1E3F;--g-inkL:#4C3A6B;--g-gold:#F2C14E;--g-goldL:#FBE3A4;--g-goldD:#B9862A;--g-oakL:#D2A57A;--g-mint:#7FE3B8;--g-coral:#FF6F61;--g-cream:#FFF7E6;--g-rare:#7FC4F2;--g-epic:#C08AF2;--u:2px}@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--page:#16101E;--text:#EDE4F8;--soft:#A897C2;--pad:#3A2B52;--padText:#F3ECFB;--padActive:#5A4678}}:root[data-theme=dark]{--page:#16101E;--text:#EDE4F8;--soft:#A897C2;--pad:#3A2B52;--padText:#F3ECFB;--padActive:#5A4678}html{height:100%;scroll-padding-top:env(safe-area-inset-top,0px)}*,*:before,*:after{box-sizing:inherit}body{margin:0;height:100%;background:var(--page);color:var(--text);font-family:Silkscreen,ui-monospace,Menlo,Consolas,monospace;overflow:hidden;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}#app{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px}.stage{position:relative;width:640px;height:360px;max-width:100%;background:var(--g-bg);overflow:hidden;box-shadow:0 0 0 calc(var(--u)*2) var(--g-ink)}canvas{position:absolute;inset:0;width:100%;height:100%;image-rendering:pixelated;image-rendering:crisp-edges;display:block}.fx{image-rendering:auto;pointer-events:none}.fx[hidden]{display:none}.hud{position:absolute;left:0;right:0;top:0;display:flex;align-items:center;justify-content:space-between;padding:calc(var(--u)*4) calc(var(--u)*5);font-size:calc(var(--u)*6.5);color:var(--g-cream);pointer-events:none}.hud[hidden]{display:none}.chip{background:var(--g-ink);padding:calc(var(--u)*2) calc(var(--u)*4);display:inline-flex;align-items:center;gap:calc(var(--u)*3);line-height:1}.hud .right{display:flex;align-items:center;gap:calc(var(--u)*3)}.ico{width:calc(var(--u)*7);height:calc(var(--u)*7);display:block;shape-rendering:crispEdges}.hud button{pointer-events:auto}.iconbtn{font:inherit;border:0;cursor:pointer;background:var(--g-ink);color:var(--g-cream);padding:calc(var(--u)*2) calc(var(--u)*3);display:inline-flex;align-items:center;line-height:1}.iconbtn:hover{background:var(--g-inkL)}.btn{font:inherit;color:var(--g-cream);background:var(--g-ink);border:0;cursor:pointer;padding:calc(var(--u)*3) calc(var(--u)*7);font-size:calc(var(--u)*7);line-height:1;box-shadow:0 calc(var(--u)*1.5) 0 var(--g-inkL)}.btn:hover{background:#3c2c57}.btn:active{transform:translateY(calc(var(--u)*1.5));box-shadow:none}.btn.ghost{background:transparent;color:var(--g-ink);box-shadow:inset 0 0 0 calc(var(--u)*1) var(--g-ink)}.btn.ghost:hover{background:var(--g-goldL)}.btn:focus-visible,.map-door:focus-visible,.padbtn:focus-visible,.iconbtn:focus-visible,.card:focus-visible,.tab:focus-visible,input:focus-visible{outline:calc(var(--u)*1.5) solid var(--g-gold);outline-offset:calc(var(--u)*1)}.screen{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--u)*6);text-align:center;color:var(--g-ink);background:#fff7e6b8;background:color-mix(in srgb,var(--g-cream) 72%,transparent);padding:calc(var(--u)*8)}.screen.clear{background:transparent}.screen[hidden]{display:none}.title{margin:0;font-weight:700;font-size:calc(var(--u)*30);line-height:1;letter-spacing:calc(var(--u)*1);color:var(--g-ink);text-shadow:calc(var(--u)*2) calc(var(--u)*2) 0 var(--g-gold)}.title.end{font-size:calc(var(--u)*18)}.h2{margin:0;font-weight:700;font-size:calc(var(--u)*14);line-height:1;text-shadow:calc(var(--u)*1.5) calc(var(--u)*1.5) 0 var(--g-gold)}.tagline{margin:0;font-size:calc(var(--u)*7);max-width:85%}.row{display:flex;gap:calc(var(--u)*4);flex-wrap:wrap;justify-content:center}.menu-col{display:flex;flex-direction:column;gap:calc(var(--u)*4);align-items:center}.big{font-size:calc(var(--u)*10);padding:calc(var(--u)*4) calc(var(--u)*14)}.small{font-size:calc(var(--u)*5.5);padding:calc(var(--u)*2.5) calc(var(--u)*5)}.map{justify-content:flex-start;gap:calc(var(--u)*3);padding:calc(var(--u)*5)}.map .h2{font-size:calc(var(--u)*10)}.mapbox{position:relative;width:calc(var(--u)*300);height:calc(var(--u)*120);overflow:hidden;box-shadow:0 0 0 calc(var(--u)*1) var(--g-ink)}.map-view{display:block;width:100%;height:100%;image-rendering:pixelated}.map-doors{position:absolute;inset:0}.map-door{position:absolute;width:calc(var(--u)*14);height:calc(var(--u)*22);padding:0;border:0;background:transparent;cursor:pointer}.map-door.locked{cursor:default}.mapbubble{position:absolute;transform:translate(-50%,-100%);background:var(--g-cream);color:var(--g-ink);font-size:calc(var(--u)*4);padding:calc(var(--u)*1.5) calc(var(--u)*2.5);white-space:nowrap;box-shadow:0 0 0 calc(var(--u)*1) var(--g-ink);pointer-events:none}.mapinfo{display:flex;flex-direction:column;align-items:center;gap:calc(var(--u)*1.5);min-height:calc(var(--u)*14)}.mapinfo b{font-size:calc(var(--u)*6)}.mapinfo .notes{display:flex;gap:calc(var(--u)*5);font-size:calc(var(--u)*4.5);opacity:.85}.mapinfo.nope{animation:nope .3s}.wardrobe{justify-content:flex-start;gap:calc(var(--u)*3);padding:calc(var(--u)*5)}.wardrobe .h2{font-size:calc(var(--u)*10)}.wbody{display:flex;gap:calc(var(--u)*6);align-items:flex-start;text-align:left}.wl{width:calc(var(--u)*120);display:flex;flex-direction:column;gap:calc(var(--u)*2)}.stagebox{position:relative;width:calc(var(--u)*120);height:calc(var(--u)*67.5);box-shadow:0 0 0 calc(var(--u)*1) var(--g-ink)}.stage-art,.icon-art{display:block;width:100%;height:100%;image-rendering:pixelated}.greet{position:absolute;left:calc(var(--u)*4);right:calc(var(--u)*4);top:calc(var(--u)*3);background:var(--g-goldL);color:var(--g-ink);font-size:calc(var(--u)*4.5);line-height:1.35;padding:calc(var(--u)*1.5) calc(var(--u)*2.5);box-shadow:0 0 0 calc(var(--u)*1) var(--g-ink);opacity:0;transition:opacity .2s;pointer-events:none}.greet.on{opacity:1}.who-name{font-size:calc(var(--u)*6)}.who-bio{margin:0;font-size:calc(var(--u)*4);line-height:1.35;min-height:calc(var(--u)*11);opacity:.85}.roster{display:flex;gap:calc(var(--u)*3)}.wr{width:calc(var(--u)*170);display:flex;flex-direction:column;gap:calc(var(--u)*2)}.tabs{display:flex;flex-wrap:wrap;gap:calc(var(--u)*1.5)}.tab{position:relative;font:inherit;font-size:calc(var(--u)*4.5);color:var(--g-ink);background:transparent;cursor:pointer;border:calc(var(--u)*1) solid var(--g-ink);padding:calc(var(--u)*1.5) calc(var(--u)*2.5)}.tab.on{background:var(--g-ink);color:var(--g-cream)}.grid{display:grid;grid-template-columns:repeat(6,calc(var(--u)*26));gap:calc(var(--u)*2.5);align-content:start;max-height:calc(var(--u)*86);overflow-y:auto;padding:calc(var(--u)*1.5)}.card{position:relative;width:calc(var(--u)*26);height:calc(var(--u)*26);padding:0;cursor:pointer;background:var(--g-ink);border:calc(var(--u)*1.5) solid var(--r,var(--g-inkL))}.card.r-rare{--r:var(--g-rare)}.card.r-epic{--r:var(--g-epic)}.card.r-legendary{--r:var(--g-gold)}.card.on{box-shadow:0 0 0 calc(var(--u)*1) var(--g-cream),0 0 0 calc(var(--u)*2.5) var(--g-coral)}.card.locked .icon-art{opacity:.35;filter:grayscale(1)}.card.locked{cursor:default}.card .lock{position:absolute;right:calc(var(--u)*1);bottom:calc(var(--u)*1);width:calc(var(--u)*5);height:calc(var(--u)*6);color:var(--g-cream)}.card .none{position:absolute;left:30%;right:30%;top:calc(50% - var(--u)*.75);height:calc(var(--u)*1.5);background:var(--g-inkL)}.has-dot{position:relative}.card .dot,.tab .dot,.has-dot .dot{position:absolute;top:calc(var(--u)*-2);right:calc(var(--u)*-2);width:calc(var(--u)*3.5);height:calc(var(--u)*3.5);background:var(--g-coral);box-shadow:0 0 0 calc(var(--u)*1) var(--g-cream)}.card.nope{animation:nope .3s}@keyframes nope{25%{transform:translate(calc(var(--u)*-1.5))}75%{transform:translate(calc(var(--u)*1.5))}}.detail{min-height:calc(var(--u)*14);display:flex;flex-direction:column;gap:calc(var(--u)*1)}.detail b{font-size:calc(var(--u)*5)}.detail small{font-size:calc(var(--u)*4);opacity:.8;line-height:1.3}.wactions{display:flex;gap:calc(var(--u)*3)}@media(prefers-reduced-motion:reduce){.card.nope,.mapinfo.nope{animation:none}.greet{transition:none}}.screen.solid{background:var(--g-cream)}.pages{display:grid;grid-template-columns:repeat(5,calc(var(--u)*57));gap:calc(var(--u)*3);font-size:calc(var(--u)*3.6);line-height:1.25;text-align:left;max-height:calc(var(--u)*118);overflow-y:auto;scrollbar-width:none;padding:calc(var(--u)*1)}.pages::-webkit-scrollbar{display:none}.page{border:calc(var(--u)*1) solid var(--g-ink);background:var(--g-cream);padding:calc(var(--u)*2);display:flex;flex-direction:column;gap:calc(var(--u)*1);color:var(--g-ink)}.page b{font-size:calc(var(--u)*4.5)}.page small{font-size:calc(var(--u)*3.4);color:var(--g-inkL)}.page .art{position:static;inset:auto;height:auto;width:100%;image-rendering:pixelated;border:calc(var(--u)*.6) solid var(--g-ink);background:var(--g-ink)}.page:focus-visible{outline:calc(var(--u)*.8) solid var(--g-gold)}.page.locked{border-style:dashed}.page.locked b{font-size:calc(var(--u)*7)}.stats{display:grid;grid-template-columns:auto auto;gap:calc(var(--u)*2.5) calc(var(--u)*12);font-size:calc(var(--u)*6);text-align:left}.stats dt{opacity:.7}.stats dd{margin:0;text-align:right}.profile{justify-content:flex-start;gap:calc(var(--u)*3.5);padding:calc(var(--u)*5)}.profile .h2{font-size:calc(var(--u)*10)}.profile-top{display:flex;gap:calc(var(--u)*6);align-items:center;max-width:100%}.avatar-art{position:static;inset:auto;width:calc(var(--u)*48);height:calc(var(--u)*48);image-rendering:pixelated;box-shadow:0 0 0 calc(var(--u)*1) var(--g-ink);flex:none}.profile .who{display:flex;flex-direction:column;gap:calc(var(--u)*2);align-items:flex-start;text-align:left;min-width:0}.name-box{font:inherit;font-size:calc(var(--u)*9);width:calc(var(--u)*150);max-width:100%;padding:calc(var(--u)*1.5) calc(var(--u)*3);color:var(--g-ink);background:var(--g-cream);border:calc(var(--u)*1) solid var(--g-ink);border-radius:0}.name-box::placeholder{color:var(--g-inkL);opacity:.55}.title-row{display:flex;align-items:center;gap:calc(var(--u)*3)}.title-name{font-size:calc(var(--u)*6);min-width:calc(var(--u)*62);text-align:center}.iconbtn.step{padding:calc(var(--u)*1.5) calc(var(--u)*2.5)}.iconbtn.step .ico{width:calc(var(--u)*4);height:calc(var(--u)*4)}.title-note{font-size:calc(var(--u)*4);opacity:.75;max-width:calc(var(--u)*170);line-height:1.35}.avatars{display:flex;gap:calc(var(--u)*3);align-items:center}.avatars .card{width:calc(var(--u)*22);height:calc(var(--u)*22)}.avatars .same.on{box-shadow:0 0 0 calc(var(--u)*1) var(--g-cream),0 0 0 calc(var(--u)*2.5) var(--g-coral)}.profile-stats{grid-template-columns:auto auto auto auto;gap:calc(var(--u)*1.5) calc(var(--u)*6);font-size:calc(var(--u)*4.5)}.hello{margin:0;font-size:calc(var(--u)*6)}.settings{display:grid;grid-template-columns:auto calc(var(--u)*90);gap:calc(var(--u)*4) calc(var(--u)*8);align-items:center;font-size:calc(var(--u)*6);text-align:left}.settings input[type=range]{width:100%;accent-color:var(--g-ink)}.banner{position:absolute;left:50%;top:calc(var(--u)*30);transform:translate(-50%);color:var(--g-cream);text-align:center;font-size:calc(var(--u)*10);white-space:nowrap;pointer-events:none;transition:opacity .35s,transform .35s;opacity:0;background:var(--g-ink);padding:calc(var(--u)*4) calc(var(--u)*8);box-shadow:calc(var(--u)*2) calc(var(--u)*2) 0 var(--g-gold)}.banner.on{opacity:1;transform:translate(-50%) translateY(calc(var(--u)*-2))}.banner small{display:block;font-size:calc(var(--u)*5.5);margin-top:calc(var(--u)*2);color:var(--g-goldL)}.banner em{display:block;font-style:normal;font-size:calc(var(--u)*5);margin-bottom:calc(var(--u)*2);color:var(--g-mint)}.toast{position:absolute;left:50%;top:calc(var(--u)*50);transform:translate(-50%) scale(.9);color:var(--g-cream);background:var(--g-ink);font-size:calc(var(--u)*8);line-height:1.2;padding:calc(var(--u)*3) calc(var(--u)*6);white-space:nowrap;pointer-events:none;opacity:0;transition:opacity .2s,transform .2s;box-shadow:calc(var(--u)*1.5) calc(var(--u)*1.5) 0 var(--g-coral)}.toast.on{opacity:1;transform:translate(-50%) scale(1)}.bubble{position:absolute;transform:translate(-50%,-100%);background:var(--g-cream);color:var(--g-ink);font-size:calc(var(--u)*5);padding:calc(var(--u)*2) calc(var(--u)*3);white-space:nowrap;pointer-events:none;opacity:0;transition:opacity .2s;box-shadow:0 0 0 calc(var(--u)*1) var(--g-ink)}.bubble:after{content:"";position:absolute;left:var(--tail,50%);bottom:calc(var(--u)*-3);width:calc(var(--u)*2);height:calc(var(--u)*2);background:var(--g-ink);transform:translate(-50%)}.bubble.on{opacity:1}.bubble.reply{background:var(--g-goldL)}.dialogue{--who:var(--g-gold);position:absolute;left:calc(var(--u)*7);right:calc(var(--u)*7);bottom:calc(var(--u)*7);display:none;gap:calc(var(--u)*5);align-items:center;color:var(--g-cream);padding:calc(var(--u)*6) calc(var(--u)*5) calc(var(--u)*4);border:calc(var(--u)*1) solid var(--g-inkL);background:linear-gradient(var(--g-goldD),var(--g-goldD)) left calc(var(--u)*1) top calc(var(--u)*1)/calc(var(--u)*2) calc(var(--u)*2) no-repeat,linear-gradient(var(--g-goldD),var(--g-goldD)) right calc(var(--u)*1) top calc(var(--u)*1)/calc(var(--u)*2) calc(var(--u)*2) no-repeat,linear-gradient(var(--g-goldD),var(--g-goldD)) left calc(var(--u)*1) bottom calc(var(--u)*1)/calc(var(--u)*2) calc(var(--u)*2) no-repeat,linear-gradient(var(--g-goldD),var(--g-goldD)) right calc(var(--u)*1) bottom calc(var(--u)*1)/calc(var(--u)*2) calc(var(--u)*2) no-repeat,var(--g-ink);box-shadow:0 0 0 calc(var(--u)*1) var(--g-cream),0 0 0 calc(var(--u)*2) var(--g-ink),calc(var(--u)*2) calc(var(--u)*2) 0 calc(var(--u)*2) var(--who);cursor:pointer;pointer-events:auto;user-select:none;-webkit-user-select:none;touch-action:none}.dialogue[data-who=cellar]{--who:var(--g-oakL)}.dialogue[data-who=pip]{--who:var(--g-mint)}.dialogue.on{display:flex;animation:dialogin .2s steps(4) both}.letterbox{position:absolute;inset:0;pointer-events:none}.letterbox .bar{position:absolute;left:0;right:0;height:11%;background:var(--g-ink);transition:transform .45s ease-out}.letterbox .bar.top{top:0;transform:translateY(-100%)}.letterbox .bar.bottom{bottom:0;transform:translateY(100%)}.letterbox.on .bar{transform:none}@media(prefers-reduced-motion:reduce){.letterbox .bar{transition:none}}.dialogue.top{top:calc(var(--u)*9);bottom:auto}.dialogue.top.on{animation-name:dialogdown}@keyframes dialogin{0%{transform:translateY(calc(var(--u)*14));opacity:0}}@keyframes dialogdown{0%{transform:translateY(calc(var(--u)*-14));opacity:0}}.dialogue .plate{position:absolute;left:calc(var(--u)*4);top:calc(var(--u)*-6);background:var(--who);color:var(--g-ink);font-size:calc(var(--u)*5);line-height:1;padding:calc(var(--u)*1.5) calc(var(--u)*3);box-shadow:0 0 0 calc(var(--u)*1) var(--g-ink)}.dialogue .frame{flex:none;padding:calc(var(--u)*1);background:var(--g-inkL);box-shadow:0 0 0 calc(var(--u)*1) var(--who),0 0 0 calc(var(--u)*2) var(--g-ink)}.dialogue .portrait{position:static;display:block;width:calc(var(--u)*32);height:calc(var(--u)*32);image-rendering:pixelated}.dialogue .dbody{flex:1;position:relative;min-height:calc(var(--u)*26)}.dialogue .line{font-size:calc(var(--u)*7);line-height:1.35}.dialogue .shake,.dialogue .wave{display:inline-block;white-space:pre}.dialogue .shake{color:var(--g-coral);animation:shake .24s steps(2) infinite;animation-delay:calc(var(--i)*-70ms)}.dialogue .wave{color:var(--g-goldL);animation:wave 1s ease-in-out infinite;animation-delay:calc(var(--i)*-.11s)}@keyframes shake{0%{transform:translate(calc(var(--u)*.5))}50%{transform:translate(calc(var(--u)*-.5),calc(var(--u)*.5))}}@keyframes wave{50%{transform:translateY(calc(var(--u)*-1.5))}}.dialogue .emote{position:static;display:block;width:calc(var(--u)*24);height:calc(var(--u)*18);image-rendering:pixelated;transform-origin:left bottom}.dialogue .emote.pop{animation:emotepop .32s cubic-bezier(.3,1.7,.6,1) both}@keyframes emotepop{0%{transform:scale(.2);opacity:0}}.dialogue .emote[hidden],.dialogue .line[hidden]{display:none}.dialogue .next{position:absolute;right:0;bottom:calc(var(--u)*-1);width:0;height:0;border-left:calc(var(--u)*2.5) solid transparent;border-right:calc(var(--u)*2.5) solid transparent;border-top:calc(var(--u)*3) solid var(--who);opacity:0}.dialogue .next.on{opacity:1;animation:nextbob .7s steps(2) infinite}@keyframes nextbob{50%{transform:translateY(calc(var(--u)*1.5))}}.dialogue .skip{align-self:flex-start;font:inherit;font-size:calc(var(--u)*4.5);color:var(--g-goldL);background:transparent;border:0;cursor:pointer;padding:calc(var(--u)*1) calc(var(--u)*2)}.dialogue .skip:hover{color:var(--g-cream)}.hintbox{position:absolute;left:calc(var(--u)*5);top:calc(var(--u)*18);font-size:calc(var(--u)*5);color:var(--g-ink);background:var(--g-gold);padding:calc(var(--u)*2) calc(var(--u)*3);pointer-events:none;max-width:60%}.hintbox[hidden]{display:none}.pad{display:none;width:100%;max-width:680px;justify-content:space-between;padding:0 12px;gap:12px}.pad.on{display:flex}.pad .grp{display:flex;gap:12px}.padbtn{width:76px;height:76px;border:0;background:var(--pad);color:var(--padText);font:inherit;font-size:16px;display:flex;align-items:center;justify-content:center;touch-action:none;cursor:pointer}.padbtn.down{background:var(--padActive)}.padbtn.jump{width:120px}.padbtn svg{width:30px;height:30px}.keys{margin:0;font-size:12px;color:var(--soft);text-align:center;padding:0 12px}.keys[hidden]{display:none}.chip.got .ico{color:var(--g-gold)}.chip.dim .ico{opacity:.35}body.landscape .pad{position:fixed;left:0;right:0;bottom:calc(env(safe-area-inset-bottom,0px) + 10px);max-width:none;padding:0 16px;pointer-events:none;z-index:5}body.landscape .padbtn{pointer-events:auto;opacity:.45;background:var(--g-ink);color:var(--g-cream)}body.landscape .padbtn.down{opacity:.8}@media(prefers-reduced-motion:reduce){.dialogue.on,.dialogue .next.on,.dialogue .shake,.dialogue .wave,.dialogue .emote.pop{animation:none}.banner,.toast,.bubble{transition:none}}