:root{--bg:#060a13;--bg2:#0a0f1f;--panel:#0b1324;--border:#18243d;--text:#e8eef9;--muted:#8ea3c0;--a:#7dd3fc;--b:#a78bfa}
*{box-sizing:border-box}html,body{height:100%}
body{margin:0;background:
radial-gradient(1000px 600px at 120% -10%, rgba(167,139,250,.08), transparent 60%),
radial-gradient(900px 500px at -10% 110%, rgba(125,211,252,.07), transparent 55%),
linear-gradient(180deg,var(--bg2),var(--bg));color:var(--text);font:14px/1.45 ui-sans-serif,system-ui,Segoe UI,Roboto}
.topbar{position:sticky;top:0;z-index:2;display:flex;align-items:center;gap:10px;padding:10px 12px;border-bottom:1px solid var(--border);background:linear-gradient(180deg,rgba(14,22,39,.9),rgba(11,17,30,.92))}
.badge{padding:4px 10px;border-radius:9999px;color:var(--muted);background:var(--panel);border:1px solid var(--border)}
.topbar-title{position:absolute;left:50%;transform:translateX(-50%);font-weight:800;background:linear-gradient(90deg,var(--a),var(--b));-webkit-background-clip:text;background-clip:text;color:transparent}
.content{padding:12px}.card{background:var(--panel);border:1px solid var(--border);border-radius:16px;padding:16px;margin-bottom:16px}
h2{margin:6px 0 4px 0}.muted{color:var(--muted)}
.controls{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0}
input,button,select{background:#0c1527;border:1px solid var(--border);color:#dbeafe;border-radius:10px;padding:8px 10px}
.btn-primary{background:linear-gradient(90deg,var(--a),var(--b));color:#071019;border:0}
.btn-ghost{background:#0c1527;border:1px dashed #27406b}
table{width:100%;border-collapse:collapse}th,td{padding:8px;border-bottom:1px solid #1b2947;font-size:14px}th{text-align:left;color:#9fb3d0}
.badge-soft{background:#141c31;border:1px solid #233353;border-radius:8px;padding:2px 8px;display:inline-block}
.heat{border-radius:8px;padding:2px 8px;display:inline-block;border:1px solid #233353}
.heat.sweet{background:#0f1f35;color:#a0e7a9;border-color:#1d3b2b}
.heat.thin{background:#2b1620;color:#ffb3c1;border-color:#4a2231}
.heat.ok{background:#1e2436;color:#cbe1ff;border-color:#2a3758}
.heat.over{background:#201a2b;color:#cbb8ff;border-color:#3b2a5a}
.green{color:#62d38a}.red{color:#ff6b6b}a{color:#8aa8ff}
.small{font-size:12px}
.status{margin-top:8px;font-size:12px;color:#9fb3d0}
.err{background:#2a1010;border:1px solid #6b1a1a;color:#ffb3b3;border-radius:10px;padding:10px;margin-top:8px}
.tag{border:1px solid #2c3d60;border-radius:8px;padding:2px 8px;display:inline-block;margin-right:6px}