:root { --bg:#0b0d12; --panel:#121722; --muted:#8a93a6; --text:#e8edf7; --ok:#2bb673; --warn:#f6c344; --bad:#ef5965; --border:#22304a; }
*{box-sizing:border-box} html,body{height:100%} body{margin:0;font:14px/1.4 system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial;color:var(--text);background:linear-gradient(180deg,#0b0d12,#0e121a)}
.container{max-width:1100px;margin:0 auto;padding:24px}
.header{display:flex;align-items:center;gap:12px;margin-bottom:16px}
.header .brand{display:flex;align-items:center;gap:10px}
.header .brand img{width:28px;height:28px}
.card{background:var(--panel);border:1px solid var(--border);border-radius:12px;padding:16px;margin-bottom:16px;box-shadow:0 0 0 1px rgba(0,0,0,.2), 0 10px 30px rgba(0,0,0,.2)}
.row{display:flex;gap:12px;flex-wrap:wrap}
.row > *{flex:1}
select,button,input{background:#0f1522;color:var(--text);border:1px solid var(--border);border-radius:10px;padding:8px 10px}
button{cursor:pointer}
.tabs{display:flex;gap:8px;margin-bottom:8px}
.tab{padding:8px 12px;border:1px solid var(--border);border-radius:10px;cursor:pointer;background:#0d1220}
.tab.active{background:#182136}
.badge{padding:2px 8px;border-radius:999px;border:1px solid var(--border);font-size:12px;color:var(--muted)}
.kv{display:grid;grid-template-columns:180px 1fr;gap:8px;margin:8px 0}
.kv div{padding:6px 8px;background:#0d1320;border:1px solid var(--border);border-radius:8px}
.note{font-size:13px;color:var(--muted)}
.alert{padding:10px 12px;border-radius:10px;margin:8px 0}
.alert.warn{background:#2a2414;border:1px solid #5a4a14;color:#ffe7a3}
.alert.ok{background:#14261c;border:1px solid #1f6d47;color:#bdf2d2}
.alert.bad{background:#2b171b;border:1px solid #6b1f2b;color:#ffd1d6}
.table{width:100%;border-collapse:collapse;margin-top:8px}
.table th,.table td{padding:8px;border-bottom:1px solid var(--border);text-align:left}
.small{font-size:12px;color:var(--muted)}
.right{display:flex;gap:8px;margin-left:auto}