:root{--bg:#0b1d2e;--card:#12304a;--acc:#38bdf8;--txt:#e6f1fa;--mut:#8fa9bf;--bad:#f87171;--ok:#4ade80}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}body{margin:0;background:var(--bg);color:var(--txt);font-family:system-ui,sans-serif;overscroll-behavior:none}.app{max-width:480px;margin:0 auto;min-height:100vh;display:flex;flex-direction:column}.top{display:flex;gap:8px;padding:10px;background:var(--card);font-size:14px;justify-content:space-between}.main{flex:1;padding:12px}.nav{display:flex;background:var(--card);position:sticky;bottom:0}.nav button{flex:1;padding:14px 2px;font-size:13px;background:none;border:0;color:var(--mut);font-size:14px}.nav button.on{color:var(--acc);font-weight:700}.card{background:var(--card);border-radius:10px;padding:12px;margin-bottom:10px}.btn{background:var(--acc);color:#04283d;border:0;border-radius:8px;padding:12px 16px;font-weight:700;font-size:16px;width:100%}.btn:disabled{opacity:.45}.btn.sec{background:#1f4a6b;color:var(--txt)}.row{display:flex;justify-content:space-between;align-items:center;gap:8px}.err{color:var(--bad);margin:8px 0}.okc{color:var(--ok)}.mut{color:var(--mut);font-size:13px}.gauge{position:relative;height:34px;background:#0a2236;border-radius:8px;overflow:hidden;margin:10px 0}.gauge .zone{position:absolute;top:0;bottom:0;background:#4ade8059}.gauge .needle{position:absolute;top:0;bottom:0;width:4px;background:#fff}.scene{width:100%;height:180px;border-radius:10px;overflow:hidden;background:#0a2236}.r-common{color:#cbd5e1}.r-uncommon{color:#4ade80}.r-rare{color:#38bdf8}.r-epic{color:#c084fc}.r-legendary{color:#fbbf24}.r-mythic{color:#f472b6}