:root{--ac:#6c8cff;--bg:#0a0c14;--pn:#141826d9;--mu:#8b92a8}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
[hidden]{display:none!important}
html,body{margin:0;height:100%;background:var(--bg);color:#e8eaf0;font:14px/1.35 system-ui,sans-serif;overflow:hidden}
#cv{position:fixed;inset:0;width:100%;height:100%;display:block;touch-action:none}
button,input{font:inherit;color:inherit;border:1px solid #343b50;border-radius:10px;padding:9px 6px}
button{background:#252a38}input{background:#0e1220;min-width:0;padding:9px}
button:active{filter:brightness(1.5)}button.on{background:var(--ac);border-color:var(--ac);color:#fff}
.row{display:flex;gap:6px;margin:6px 0}.row>*{flex:1}
.pn{background:var(--pn);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:12px;padding:8px;margin:6px 0}
#hud{position:fixed;inset:0;pointer-events:none;display:flex;flex-direction:column;justify-content:space-between;max-width:560px;margin:0 auto;padding:calc(4px + env(safe-area-inset-top,0px)) 8px calc(4px + env(safe-area-inset-bottom,0px))}
#hud>*{pointer-events:auto}
#st{font-weight:600;font-size:15px;display:flex;align-items:center;gap:8px}
.dot{width:14px;height:14px;border-radius:50%;border:2px solid #889;flex:none}
.cps{font-size:15px;color:var(--mu);white-space:nowrap;overflow:hidden;min-height:20px}
#inf{font-size:12.5px;min-height:44px;max-height:66px;overflow:auto}
#lg{height:40px;overflow:auto;font-size:12px;color:#aab}#lg b{color:#667;margin-left:5px}#lg span{margin-left:3px;color:#dde}
#dr{position:fixed;inset:0;overflow:auto;touch-action:pan-y;background:#0a0c14f0;padding:calc(8px + env(safe-area-inset-top,0px)) 8px 24px}
#dr>div{max-width:560px;margin:0 auto}
h1{margin:4px 0 0;font-size:28px;text-align:center}h1 b{color:var(--ac)}
.sub{text-align:center;color:var(--mu);margin:0 0 8px}
.pn h3{margin:0 0 6px;display:flex;justify-content:space-between;font-size:15px}
.sl{display:grid;grid-template-columns:repeat(8,1fr);gap:4px;margin-bottom:5px}.sl.q{grid-template-columns:repeat(7,1fr)}
.sl button{aspect-ratio:1;padding:0;font-weight:800;font-size:17px;display:flex;flex-direction:column;align-items:center;justify-content:center;border:0;line-height:1.1;color:#111}
.sl.q button{background:#2b3250;color:#dfe4ff;font-size:20px}.sl small{font-size:9px;opacity:.8;font-weight:600}
#leg{font-size:11.5px;display:flex;flex-wrap:wrap;gap:4px 10px;color:var(--mu)}
#leg b{display:inline-block;color:#111;border-radius:5px;padding:0 5px;margin-right:3px}
#onm{color:var(--mu);font-size:12px}
.ov{position:fixed;inset:0;background:#000b;display:flex;align-items:center;justify-content:center;z-index:9;padding:12px;touch-action:pan-y}
.ov>div{background:#1a1d27;border-radius:14px;padding:14px;max-height:88vh;overflow:auto;max-width:520px;width:100%}
.ov p{margin:0 0 9px}#lk{width:100%}
#pm>div{display:flex;gap:10px;justify-content:center;width:auto}
#pm button{font-size:42px;width:68px;height:68px;padding:0}