html,body{margin:0;height:100%;background:#1d2b23;overflow:hidden;overscroll-behavior:none;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}#app{display:flex;flex-direction:column;height:100dvh;box-sizing:border-box;padding-top:env(safe-area-inset-top)}#game{flex:1;min-height:0;position:relative}#game canvas{image-rendering:pixelated}#pad{display:none;height:190px;padding:0 18px env(safe-area-inset-bottom);align-items:center;justify-content:space-between;background:#fffaf0;border-top:4px solid #1b1b1f}@media(pointer:coarse){#pad{display:flex}}.cross{position:relative;width:150px;height:150px}.cross button,.cross-center{position:absolute;width:50px;height:50px;background:#1b1b1f;border:none;padding:0}.cross button:after{content:"";position:absolute;inset:0;margin:auto;width:0;height:0;border:8px solid transparent}.cross [data-dir=up]{left:50px;top:0;border-radius:6px 6px 0 0}.cross [data-dir=up]:after{border-bottom-color:#55555c;top:-8px}.cross [data-dir=down]{left:50px;top:100px;border-radius:0 0 6px 6px}.cross [data-dir=down]:after{border-top-color:#55555c;bottom:-8px}.cross [data-dir=left]{left:0;top:50px;border-radius:6px 0 0 6px}.cross [data-dir=left]:after{border-right-color:#55555c;left:-8px}.cross [data-dir=right]{left:100px;top:50px;border-radius:0 6px 6px 0}.cross [data-dir=right]:after{border-left-color:#55555c;right:-8px}.cross-center{left:50px;top:50px}.cross-center:after{content:"";position:absolute;inset:13px;border-radius:50%;background:#2c2c33}.cross button.pressed{filter:brightness(1.8)}.ab{position:relative;width:170px;height:150px;transform:rotate(-22deg)}.ab button{position:absolute;width:68px;height:68px;border-radius:50%;border:4px solid #1b1b1f;box-shadow:4px 4px #1b1b1f;font:26px PixelTitle,Pixel,monospace;color:#1b1b1f;padding:0}.ab button:active{transform:translate(3px,3px);box-shadow:1px 1px #1b1b1f}.btn-a{right:0;top:6px;background:#e85d0c;color:#fffaf0!important}.btn-b{left:0;top:54px;background:#f9dccb}.ab span{position:absolute;font:15px Pixel,monospace;letter-spacing:.12em;color:#1b1b1f}.label-a{right:16px;top:82px}.label-b{left:-4px;top:130px}@font-face{font-family:Pixel;src:url(/assets/ui/VT323.ttf) format("truetype");font-display:swap}@font-face{font-family:PixelTitle;src:url(/assets/ui/Jersey10.ttf) format("truetype");font-display:swap}:root{--ink: #2b1d14;--paper: #f6ead0;--paper-2: #ead8b2;--edge: #3b2a1a;--accent: #e8743b;--good: #3f9e4f;--bad: #c8443b;--fog: #7a7fa8}#ui{position:absolute;inset:0;pointer-events:none;font-family:Pixel,system-ui,sans-serif;color:var(--ink);font-size:21px;z-index:10}#ui>*{pointer-events:auto}.px{image-rendering:pixelated}.panel{background:var(--paper);border:4px solid var(--edge);border-radius:6px;box-shadow:0 4px 0 var(--edge),inset 0 0 0 3px var(--paper-2)}.btn{font:inherit;color:#fff8ea;background:var(--accent);border:3px solid var(--edge);border-radius:6px;box-shadow:0 4px 0 var(--edge);padding:8px 16px;margin:4px;cursor:pointer;touch-action:manipulation}.btn:active{transform:translateY(3px);box-shadow:0 1px 0 var(--edge)}.btn:disabled{filter:grayscale(1);opacity:.6}.btn-small{padding:4px 10px;font-size:15px}.btn-ghost{background:var(--paper-2);color:var(--ink)}.btn-icon{padding:4px 8px;background:var(--paper);color:var(--ink);min-width:40px}.layer{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#0a0e0c8c;padding:12px;box-sizing:border-box;z-index:20}.layer-bottom{align-items:flex-end;background:transparent;padding-bottom:10px}.layer-title{background:radial-gradient(circle at 50% 30%,#2f5a3f,#0c1612)}.layer-battle{background:#080a14d1;z-index:30}.hud{position:absolute;top:0;left:0;right:0;display:flex;align-items:flex-start;justify-content:space-between;gap:8px;padding:8px;pointer-events:none}.hud>*{pointer-events:auto}.hud-card{display:flex;gap:8px;padding:6px 10px 6px 6px;align-items:center}.hud-face{width:38px;height:38px}.hud-line{display:flex;gap:8px;align-items:baseline;font-size:15px}.hud-level{color:var(--accent)}.xp{width:110px;height:7px;background:#cdbb93;border:2px solid var(--edge);margin:3px 0}.xp-fill{height:100%;background:#6cc7ff}.hud-goal{flex:1;align-self:center;text-align:center;color:#fff8e0;text-shadow:0 2px 0 #000;font-size:16px}.hearts{display:flex;gap:2px}.heart{width:14px;height:12px;background:var(--bad);clip-path:polygon(50% 100%,0 40%,0 15%,25% 0,50% 18%,75% 0,100% 15%,100% 40%)}.heart-empty{background:#5c4a3a}.dialog{display:flex;gap:12px;width:min(680px,100%);padding:12px;cursor:pointer}.dialog-face{width:76px;height:76px;flex:none}.dialog-body{flex:1;position:relative}.dialog-name{color:var(--accent)}.dialog-text{margin:4px 0 0;min-height:3em;line-height:1.3}.dialog-more{position:absolute;right:0;bottom:-4px;animation:bob .8s infinite}@keyframes bob{50%{transform:translateY(3px)}}.toasts{position:absolute;right:8px;bottom:12px;display:flex;flex-direction:column;gap:6px;align-items:flex-end;pointer-events:none;z-index:40}.toast{display:flex;gap:6px;align-items:center;padding:4px 10px;font-size:15px;animation:slide-in .25s ease-out;transition:opacity .4s}.toast-out{opacity:0}.toast-icon{width:20px;height:20px;object-fit:contain}@keyframes slide-in{0%{transform:translate(40px);opacity:0}}.banner{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;z-index:50}.banner-inner{text-align:center;padding:16px 32px;animation:pop .4s cubic-bezier(.2,1.6,.4,1)}.banner-inner h2{margin:4px;font-size:34px;color:var(--accent)}.banner-icon{width:96px;height:96px}@keyframes pop{0%{transform:scale(.3)}}h1,h2,h3,.big-name,.btn,.tab{font-family:PixelTitle,Pixel,system-ui,sans-serif;letter-spacing:.5px}@media(max-width:600px){#ui{font-size:17px}.hud{padding:4px}.hud-card{padding:4px 6px 4px 4px}.hud-face{width:30px;height:30px}.hud-line{font-size:13px}.xp{width:80px}.hud-goal{font-size:13px}.battle-prompt{font-size:21px}.battle-monster{width:76px;height:76px}.keys{grid-template-columns:repeat(3,58px)}.key{height:46px}}#keys-hint{display:none;position:absolute;left:50%;bottom:8px;transform:translate(-50%);gap:18px;padding:4px 12px;background:#1b1b1fc7;color:#fffaf0;border-radius:6px;font:17px Pixel,monospace;white-space:nowrap;pointer-events:none;z-index:5}#keys-hint kbd{font:inherit;padding:0 5px;background:#fffaf0;color:#1b1b1f;border-radius:3px}@media(pointer:fine){#keys-hint{display:flex}}.update-banner{position:absolute;top:64px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:8px;padding:6px 10px;z-index:60;white-space:nowrap;animation:pop .3s}.title{width:min(560px,100%);max-height:100%;overflow:auto;padding:16px;text-align:center}.logo{margin:0 0 8px;font-size:40px;color:var(--accent);text-shadow:0 3px 0 var(--edge)}.title-step{display:flex;flex-direction:column;align-items:center;gap:6px}.title-lead{font-size:18px}.big-name{font-size:30px;color:var(--accent)}.field{font:inherit;width:min(320px,90%);padding:8px;border:3px solid var(--edge);border-radius:6px;background:#fffdf6}.link-code{font-size:28px;letter-spacing:3px;padding:6px 14px;background:#fffdf6;border:3px dashed var(--edge);border-radius:6px}.qr{width:180px;height:180px;image-rendering:pixelated}.muted{opacity:.6;font-size:14px}.choices{display:flex;flex-wrap:wrap;gap:6px;justify-content:center}.choice{min-width:110px;font-size:22px}.choice-on{outline:4px solid #ffe066}.cards,.heroes{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}.card{font:inherit;width:150px;padding:8px;background:#fffdf6;border:3px solid var(--edge);border-radius:6px;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:4px}.card p{font-size:13px;margin:0}.card.hero{width:92px}.card-face{width:76px;height:76px}.starter{width:min(560px,100%);padding:14px;text-align:center}.menu{width:min(720px,100%);height:min(620px,100%);max-height:100%;box-sizing:border-box;display:flex;flex-direction:column;padding:10px}.menu-head{display:flex;justify-content:space-between;align-items:center;gap:6px}.menu-head h2{margin:0}.menu-body{flex:1;min-height:0;overflow:auto;padding:6px 2px}.tabs{display:flex;flex-wrap:wrap;gap:4px}.tab{font:inherit;font-size:15px;padding:4px 10px;border:3px solid var(--edge);border-radius:6px 6px 0 0;background:var(--paper-2);cursor:pointer}.tab-on{background:var(--accent);color:#fff}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}.slot{display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px;background:#fffdf6;border:3px solid var(--paper-2);border-radius:6px;text-align:center}.slot small{font-size:12px}.slot-worn{border-color:var(--good)}.slot-icon{width:32px;height:32px;object-fit:contain}.slot-face{width:64px;height:64px}.tag{background:var(--good);color:#fff;padding:0 6px;border-radius:4px}.tag-fog{background:var(--fog)}.skill-row,.quest,.recipe,.need{display:flex;gap:8px;align-items:center;padding:4px 0;border-bottom:2px dotted var(--paper-2)}.stars{color:#e0a21b;min-width:56px}.quest-done{opacity:.55}.recipe-info{flex:1;display:flex;flex-direction:column}.recipe-missing{opacity:.7}.battle{width:min(560px,100%);max-height:100%;overflow:auto;padding:10px;display:flex;flex-direction:column;gap:6px}.battle-top{display:flex;justify-content:space-between;align-items:flex-end}.battle-foe{position:relative;display:flex;flex-direction:column;align-items:center;gap:2px}.battle-monster{width:114px;height:114px}.battle-team{display:flex;flex-direction:column;align-items:center;gap:2px}.battle-hero{width:57px;height:57px}.battle-companion{width:57px;height:57px;animation:bob 1.2s infinite}.hp{width:120px;height:10px;border:2px solid var(--edge);background:#5c4a3a}.hp-fill{height:100%;background:var(--bad);transition:width .3s}.battle-task{display:flex;align-items:center;gap:6px;background:#fffdf6;border:3px solid var(--paper-2);border-radius:6px;padding:6px 10px}.battle-prompt{flex:1;margin:0;font-size:24px;line-height:1.25}.battle-note{min-height:1.3em;margin:0;font-size:16px}.battle-note.good{color:var(--good)}.battle-note.hint{color:#8a5a00}.battle-note.reveal{color:var(--bad)}.battle-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:4px}.battle-actions .btn{margin:0}.battle>*,.raid-task>*{flex-shrink:0}.battle-end{text-align:center}.hit{animation:hit .35s}@keyframes hit{30%{filter:brightness(3);transform:translate(-6px) rotate(-4deg)}60%{transform:translate(6px) rotate(4deg)}}.shake{animation:shake .35s}@keyframes shake{25%{transform:translate(-8px)}75%{transform:translate(8px)}}.float-dmg{position:absolute;top:10px;font-size:28px;color:#fff;text-shadow:0 2px 0 var(--bad),0 0 6px var(--bad);animation:float-up .9s forwards}@keyframes float-up{to{transform:translateY(-40px);opacity:0}}.keypad{display:flex;flex-direction:column;align-items:center;gap:6px}.answer-display{font-size:30px;min-width:160px;text-align:center;padding:4px 12px;background:#fffdf6;border:3px solid var(--edge);border-radius:6px}.keys{display:grid;grid-template-columns:repeat(3,64px);gap:6px}.keys-roman{grid-template-columns:repeat(4,64px)}.key{margin:0;font-size:24px;height:52px;padding:0;background:var(--paper-2);color:var(--ink)}.key-ok{background:var(--good);color:#fff}.keys-fraction .key-ok{grid-column:span 1}@media(pointer:coarse),(max-height:700px){.battle{padding:6px 8px;gap:4px}.battle-monster{width:64px;height:64px}.battle-hero,.battle-companion{width:40px;height:40px}.hp{width:80px}.battle-prompt{font-size:19px}.battle-task{padding:4px 8px}.keys{grid-template-columns:repeat(3,56px);gap:5px}.keys-roman{grid-template-columns:repeat(4,56px)}.key{height:42px;font-size:21px}.answer-display{font-size:24px;padding:2px 10px}.choice{font-size:19px;min-width:100px}}.raid h2{margin:0;text-align:center}.raid-party{display:flex;gap:6px;flex-wrap:wrap;justify-content:center}.raid-member{display:flex;flex-direction:column;align-items:center;font-size:13px}.raid-out{opacity:.4;filter:grayscale(1)}.raid-face{width:40px;height:40px}.raid-log{font-size:15px;min-height:2.4em;color:#5b4630}@media(pointer:coarse),(max-height:700px){.raid h2{display:none}.raid-log{min-height:1.2em}.raid-log div:not(:last-child){display:none}.raid .battle-task .btn-hint{flex-shrink:0}}.hp-wide{width:140px}.emote{min-width:120px;font-size:18px}.layer-scratch{z-index:40}.scratch{width:min(560px,100%);height:100%;display:flex;flex-direction:column;gap:6px;padding:8px;box-sizing:border-box}.scratch-task{margin:0;font-size:20px}.scratch-canvas{flex:1;min-height:0;width:100%;touch-action:none;border:3px solid var(--edge);border-radius:6px;background-color:#fffdf6;background-image:linear-gradient(#cfe0f2 1px,transparent 1px),linear-gradient(90deg,#cfe0f2 1px,transparent 1px);background-size:20px 20px}.loot-list{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:6px 0}.loot-item{display:flex;flex-direction:column;align-items:center;padding:6px 8px;background:#fffdf6;border:3px solid var(--paper-2);border-radius:6px;min-width:64px;font-size:15px}.loot-item img{width:32px;height:32px;object-fit:contain;image-rendering:pixelated}.coins{font-size:20px;margin:4px 0}.hint-bubble{display:flex;gap:8px;align-items:flex-start;background:#fff7d6;border:3px solid #e0a21b;border-radius:8px;padding:6px 8px;color:var(--ink);font-size:15px}.hint-face{width:36px;height:36px;flex:none}.btn-hint{background:#e0a21b}.choice-out{opacity:.35;text-decoration:line-through}.magic{animation:magic .5s}@keyframes magic{40%{filter:brightness(2.5) drop-shadow(0 0 8px #b98cff);transform:scale(1.08)}}@media(pointer:coarse),(max-height:700px){.battle-actions .btn{padding:3px 8px;font-size:14px}.hint-bubble{font-size:13px;padding:4px 6px;gap:6px}.hint-face{width:28px;height:28px}}.arena{display:flex;flex-direction:column;gap:6px;min-height:0}.arena p{margin:0}.arena-list{display:flex;flex-direction:column;gap:6px;overflow-y:auto;min-height:0}.arena-boss{display:flex;align-items:center;gap:10px;padding:6px 10px;border:3px solid #3b2a1a;border-radius:8px;background:#f6e7c8;font:inherit;text-align:left;cursor:pointer}.arena-boss:disabled{opacity:.55;cursor:default}.arena-selected{border-color:#e8641b;box-shadow:0 0 0 2px #e8641b}.arena-face{width:48px;height:48px;flex-shrink:0}.arena-info{display:flex;flex-direction:column}.arena-ready{color:#2e7d32}.arena-rest{color:#9a3b1b}.rune-buttons{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}.rune-btn{font-size:14px;padding:2px 6px}.rune-legend{display:flex;flex-direction:column;gap:2px;opacity:.85}.aura-3{filter:drop-shadow(0 0 3px #ffd54a) drop-shadow(0 0 6px #ffb300);animation:aura-pulse 1.6s ease-in-out infinite}.aura-4{animation:aura-rainbow 3s linear infinite}@keyframes aura-pulse{50%{filter:drop-shadow(0 0 5px #ffe082) drop-shadow(0 0 10px #ffb300)}}@keyframes aura-rainbow{0%{filter:drop-shadow(0 0 5px #ff5ec4) hue-rotate(0deg)}to{filter:drop-shadow(0 0 5px #ff5ec4) hue-rotate(360deg)}}.item-stats{display:flex;flex-wrap:wrap;justify-content:center;gap:2px 6px;font-size:13px;color:#4a3622}.recipe-info .item-stats{justify-content:flex-start}.duel-top{align-items:center;justify-content:space-around}.duel-side{display:flex;flex-direction:column;align-items:center;gap:2px}.duel-fill{background:#e8641b}.duel-clock{text-align:center}.trade-row{align-items:center}.trade-count{min-width:2ch;text-align:center}