:root{color-scheme:dark;--bg:#07090d;--panel:#0e141b;--panel2:#121a23;--line:#1c2a38;--text:#d7e3ef;--muted:#7d93a8;--hot:#3dff9a;--hot2:#19c46e;--cold:#3aa0ff;--warn:#ffc857;--bad:#ff5d73}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--text);font:16px/1.45 Inter,Segoe UI,system-ui,sans-serif}body{background:radial-gradient(1200px 500px at 10% -10%,#0b2a22 0,transparent 50%),radial-gradient(900px 400px at 100% 0,#0a1d33 0,transparent 45%),var(--bg)}
header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:20px 24px 12px;border-bottom:1px solid var(--line)}.back{display:inline-block;color:var(--muted);text-decoration:none;font-size:.78rem;margin-bottom:6px}.back:hover{color:var(--hot)}h1{margin:0;font-size:1.25rem;letter-spacing:.04em}h1 span{color:var(--hot)}.sub{color:var(--muted);font-size:.78rem;margin-top:4px}.badge{display:inline-block;border:1px solid var(--line);background:#0b1218;color:var(--warn);font-size:.68rem;padding:4px 8px;border-radius:999px;margin-top:8px}.controls{display:flex;gap:8px;flex-wrap:wrap}.sel,button{background:var(--panel2);color:var(--text);border:1px solid var(--line);border-radius:8px;padding:9px 12px;font-size:.82rem}button{cursor:pointer}button:hover{border-color:var(--hot2);color:var(--hot)}button:disabled{opacity:.5;cursor:wait}.wrap{padding:16px 24px 40px;display:grid;gap:16px}.status{color:#8fb5d8;font-size:.76rem;min-height:1.2em}.err{color:var(--bad)}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px}.card{background:linear-gradient(180deg,var(--panel),#0b1117);border:1px solid var(--line);border-radius:12px;padding:12px 14px}.k{font-size:.68rem;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}.v{font-size:1.3rem;font-weight:700;margin-top:4px}.s{font-size:.74rem;color:var(--muted);margin-top:2px}.guide-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:4px 18px;font-size:.76rem;color:#94abc0}.guide-grid p{margin:6px 0}.notice{font-size:.75rem;color:var(--muted);margin-top:8px}.legend{display:inline-block;width:11px;height:11px;border-radius:50%;margin-right:5px}.green{border:1px solid var(--hot2);background:#073a24}.yellow{border:1px solid #827600;background:#302d04}.blue{border:1px solid #216ba8;background:#09253d}
.balls{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:8px}.ball{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:8px;min-height:112px}.num{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;font-weight:700;border:1px solid var(--cold);color:var(--cold);background:#09243b}.ball.hot .num{border-color:var(--hot2);color:var(--hot);background:#073a24}.ball.warm .num{border-color:#827600;color:var(--warn);background:#302d04}.meta{font-size:.64rem;color:#94abc0;margin-top:7px}.spark{height:22px;display:flex;align-items:flex-end;gap:1px;margin-top:6px}.spark i{flex:1;min-width:1px;background:#1b3449}.spark i.on{background:var(--hot2)}
.three{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}table{width:100%;border-collapse:collapse;font-size:.75rem;margin-top:8px}th,td{padding:5px;border-bottom:1px solid #172330;text-align:left}th{color:var(--muted);font-weight:500}.chip{display:inline-grid;place-items:center;min-width:30px;height:30px;border-radius:50%;border:1px solid #266fa9;color:#73baff;background:#09243b;font-weight:700;margin:2px}.pill{border:1px solid #182735;border-radius:9px;padding:8px;margin-top:8px;font-size:.75rem}.ult{margin:5px 0}.barrow{display:flex;align-items:center;gap:8px;margin-top:8px}.bar{height:8px;flex:1;background:#15212c;border-radius:99px;overflow:hidden}.bar span{display:block;height:100%;background:linear-gradient(90deg,var(--cold),var(--hot2))}.section-title{margin-top:18px}footer{color:var(--muted);font-size:.72rem;border-top:1px solid var(--line);padding-top:16px}.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:760px){header{display:grid;padding:16px}.wrap{padding:14px}.controls{width:100%}.controls>*{flex:1}.three,.two{grid-template-columns:1fr}.balls{grid-template-columns:repeat(auto-fill,minmax(86px,1fr))}.v{font-size:1.1rem}}