:root{--bg:#0b1220;--card:#131c2e;--line:#24304a;--text:#e8edf6;--muted:#8b97ad;--accent:#19c37d;--ok:#19c37d;--warn:#f5b700;--bad:#ef4444;--na:#64748b;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);padding:env(safe-area-inset-top) 0 env(safe-area-inset-bottom);margin:0}header{padding:18px 16px 6px}h1{letter-spacing:.5px;margin:0;font-size:22px}h1 span{color:var(--accent)}.sub{color:var(--muted);margin:2px 0 0;font-size:14px}main{max-width:560px;margin:0 auto;padding:8px 16px 32px}section{flex-direction:column;gap:14px;display:flex}section[hidden],[hidden]{display:none!important}.tabs{background:var(--card);border-radius:12px;gap:6px;padding:4px;display:flex}.tabs button{flex:1}button{font:inherit;color:var(--text);cursor:pointer;background:0 0;border:0;border-radius:9px;padding:10px 12px}.tabs button.on,.seg button.on,.frameNav button.on{background:var(--accent);color:#062014;font-weight:600}.chips{flex-wrap:wrap;gap:8px;display:flex}.chips button{background:var(--card);border:1px solid var(--line);border-radius:999px;padding:9px 14px}.chips button.on{border-color:var(--accent);color:var(--accent)}.row{justify-content:space-between;align-items:center;display:flex}.seg{background:var(--card);border-radius:10px;padding:3px;display:flex}.tip{background:var(--card);border-left:3px solid var(--accent);color:#c9d3e4;border-radius:8px;padding:10px 12px;font-size:14px}.actions{gap:10px;display:flex}.btn{text-align:center;background:var(--card);border:1px solid var(--line);cursor:pointer;border-radius:12px;flex:1;padding:14px;font-weight:600}.btn.primary{background:var(--accent);border-color:var(--accent);color:#062014}.progress{background:var(--card);border-radius:99px;height:8px;overflow:hidden}#bar{background:var(--accent);width:0;height:100%;transition:width .2s}#status{color:var(--muted);margin:0}.scoreBox{align-items:center;gap:14px;display:flex}.score{border:4px solid var(--accent);border-radius:50%;place-items:center;width:74px;height:74px;font-size:26px;font-weight:700;display:grid}.gname{font-size:18px;font-weight:600}.muted{color:var(--muted);font-size:13px}canvas{background:#000;border-radius:12px;width:100%}.frameNav{background:var(--card);border-radius:12px;gap:6px;padding:4px;display:flex}.frameNav button{flex:1}ul{flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}.warnings li{color:var(--warn);background:#2a2310;border-radius:8px;padding:8px 10px;font-size:13px}.metrics li{background:var(--card);border-radius:12px;grid-template-columns:14px 1fr auto;align-items:center;gap:4px 10px;padding:12px;display:grid}.dot{border-radius:50%;width:12px;height:12px}.dot.ok{background:var(--ok)}.dot.warn{background:var(--warn)}.dot.bad{background:var(--bad)}.dot.unreliable{background:var(--na)}.mlabel{font-size:15px;font-weight:600}.mval{font-variant-numeric:tabular-nums;font-weight:600}.mrange,.mcue{color:var(--muted);grid-column:2/4;font-size:13px}.mcue{color:#dfe6f2}
