:root { --bg:#0b1220; --card:#111a2e; --muted:#9fb0d0; --text:#e9eefb; --ok:#24c08f; --err:#ff6b6b; --line:#233254; }
body { margin:0; font-family:Arial,sans-serif; background:var(--bg); color:var(--text); }
.wrap { max-width:1100px; margin:24px auto; padding:0 16px; }
.card { background:var(--card); border:1px solid var(--line); border-radius:10px; padding:16px; margin-bottom:12px; }
h1,h2,h3 { margin:0 0 10px; }
p { color:var(--muted); margin:4px 0 10px; }
input,select,textarea,button { width:100%; box-sizing:border-box; padding:10px; border-radius:8px; border:1px solid var(--line); background:#0d1630; color:var(--text); }
input[type="checkbox"] { width:auto; margin-right:8px; vertical-align:middle; }
textarea { min-height:90px; }
button { cursor:pointer; background:#1b2a4d; }
button:hover { background:#233867; }
.grid2 { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.grid3 { display:grid; grid-template-columns:1fr 1fr 1fr; gap:10px; }
.tabs { display:flex; gap:8px; margin-bottom:12px; }
.tab { width:auto; padding:8px 12px; }
.muted { color:var(--muted); font-size:12px; }
.ok { color:var(--ok); }
.err { color:var(--err); }
.hidden { display:none; }
pre { white-space:pre-wrap; background:#0a1227; border:1px solid var(--line); border-radius:8px; padding:10px; }
table { width:100%; border-collapse:collapse; }
th, td { border-bottom:1px solid var(--line); padding:8px; text-align:left; font-size:13px; }
@media (max-width: 900px) { .grid2, .grid3 { grid-template-columns:1fr; } }