*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;height:100%;background:#07070f;color:#eee;font-family:system-ui,sans-serif;overflow:hidden;touch-action:none;user-select:none}
#app{height:100dvh;max-width:480px;margin:auto;position:relative;background:radial-gradient(#1a1440,#07070f)}
.screen{display:none;height:100%;padding:16px;flex-direction:column;align-items:center;gap:12px;overflow:auto}
.screen.on{display:flex}#game.on{padding:0;gap:0}
h1{text-align:center;font-size:2.2rem;margin:8vh 0 2vh;text-shadow:0 0 20px #a6f}h2{margin:6px 0}
button{background:#2b2466;color:#fff;border:1px solid #7b6cff;border-radius:10px;padding:12px 18px;font-size:1rem;cursor:pointer;transition:.15s}
button:hover:not(:disabled){background:#4338a8;transform:scale(1.03)}button:disabled{opacity:.4}button.sel{background:#6d5cff;box-shadow:0 0 10px #a6f}
.danger{background:#6a1d1d;border-color:#f66}.col{display:flex;flex-direction:column;gap:10px;width:80%;max-width:320px}.col button{width:100%}
.row{display:flex;gap:10px}.grid{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;width:100%}.grid button{padding:8px 2px;font-size:.7rem}
.grid button span{display:block;font-size:1.5rem}.info{background:#0008;border-radius:10px;padding:10px;width:100%;font-size:.85rem;line-height:1.5;min-height:60px}
.scroll{overflow:auto;width:100%;max-width:none;align-items:stretch}.ach{background:#0008;padding:8px;border-radius:8px;opacity:.45;font-size:.85rem}.ach.got{opacity:1;border:1px solid gold}
label{display:flex;flex-direction:column;gap:4px;width:80%}
#cv{flex:1;min-height:0;width:100%;object-fit:contain;background:#000;touch-action:none}
#panel{background:#0b0b1c;padding:4px 6px calc(4px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:4px}
#bar{display:flex;gap:8px;align-items:center}#bar button{padding:4px 10px}#gold{min-width:70px;color:gold}
.mana{flex:1;height:10px;background:#123;border-radius:5px;overflow:hidden}.mana i{display:block;height:100%;background:#4af;width:50%}
#abil,#shop{display:flex;gap:4px;overflow-x:auto}#abil button{flex:1;padding:6px 2px;font-size:.7rem}
#shop button{flex:0 0 auto;padding:4px 7px;font-size:.7rem;line-height:1.1}
.ov{position:absolute;inset:0;background:#000c;display:none;flex-direction:column;align-items:center;justify-content:center;gap:12px;z-index:5}.ov.on{display:flex}
#rUp button{text-align:left}#toast{position:absolute;top:10px;left:50%;transform:translateX(-50%);background:gold;color:#000;padding:8px 14px;border-radius:20px;display:none;z-index:9;font-weight:700}