:root { --bg:#0f1115; --panel:#171a21; --line:#2a2f3a; --text:#e6e8ee; --muted:#9aa3b2; --ok:#2ecc71; --err:#ff5c5c; --warn:#f5b942; --accent:#6ea8fe; }
* { box-sizing: border-box; }
body { margin:0; font: 15px/1.5 system-ui, -apple-system, Segoe UI, Roboto, sans-serif; background:var(--bg); color:var(--text); }
header { display:flex; align-items:center; gap:1rem; padding:.6rem 1rem; border-bottom:1px solid var(--line); background:var(--panel); flex-wrap:wrap; }
.brand { font-weight:700; letter-spacing:.04em; color:var(--text); text-decoration:none; }
nav { display:flex; gap:.2rem; flex-wrap:wrap; align-items:center; }
nav a, nav button.link { color:var(--muted); text-decoration:none; padding:.3rem .6rem; border-radius:6px; background:none; border:0; font:inherit; cursor:pointer; }
nav a:hover, nav button.link:hover { color:var(--text); background:#1f2430; }
form.inline { display:inline; }
.banner { text-align:center; padding:.35rem; font-weight:600; letter-spacing:.03em; }
.banner.sim { background:#1f2430; color:var(--muted); }
.banner.paper { background:#1d3557; color:#cfe3ff; }
.banner.live { background:#7a1f1f; color:#fff; }
.flash { margin:1rem; padding:.7rem 1rem; border-radius:8px; border:1px solid var(--line); }
.flash.ok { border-color:var(--ok); } .flash.error { border-color:var(--err); } .flash.warn { border-color:var(--warn); }
main { max-width: 1100px; margin: 0 auto; padding: 1rem; }
h1 { font-size:1.4rem; margin:.5rem 0 1rem; } h2 { font-size:1.05rem; color:var(--muted); margin:1.2rem 0 .5rem; text-transform:uppercase; letter-spacing:.06em; }
.grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: .8rem; }
.card { background:var(--panel); border:1px solid var(--line); border-radius:10px; padding:.9rem 1rem; }
.card .label { color:var(--muted); font-size:.8rem; text-transform:uppercase; letter-spacing:.06em; }
.card .value { font-size:1.4rem; font-weight:600; margin-top:.2rem; }
.value.neg { color:var(--err); } .value.pos { color:var(--ok); }
table { width:100%; border-collapse:collapse; font-size:.92rem; }
th, td { text-align:left; padding:.45rem .5rem; border-bottom:1px solid var(--line); white-space:nowrap; }
th { color:var(--muted); font-weight:600; font-size:.8rem; text-transform:uppercase; letter-spacing:.05em; }
td.num, th.num { text-align:right; font-variant-numeric: tabular-nums; }
.table-wrap { overflow-x:auto; }
form.stack { display:grid; gap:.7rem; max-width:560px; }
label { display:grid; gap:.25rem; font-size:.9rem; color:var(--muted); }
label.check { grid-template-columns:auto 1fr; align-items:start; gap:.5rem; color:var(--text); }
input[type=text], input[type=number], input[type=datetime-local], input[type=password], select, textarea { width:100%; padding:.5rem .6rem; border-radius:6px; border:1px solid var(--line); background:#0f1115; color:var(--text); font:inherit; }
textarea { min-height:5rem; }
button, .btn { padding:.55rem .9rem; border-radius:6px; border:1px solid var(--line); background:#1f2430; color:var(--text); font:inherit; cursor:pointer; }
button.primary { background:var(--accent); color:#0b1220; border-color:var(--accent); font-weight:600; }
button.danger { background:#3a1b1b; border-color:#7a1f1f; }
.row { display:flex; gap:.6rem; flex-wrap:wrap; align-items:center; }
pre { background:#0b0d12; border:1px solid var(--line); border-radius:8px; padding:.8rem; overflow-x:auto; font-size:.85rem; }
.violation { border-left:3px solid var(--err); padding:.4rem .7rem; margin:.3rem 0; background:#1a1416; border-radius:0 6px 6px 0; }
.warning { border-left:3px solid var(--warn); padding:.4rem .7rem; margin:.3rem 0; background:#1a1810; border-radius:0 6px 6px 0; }
.approved { border-left:3px solid var(--ok); padding:.6rem .9rem; background:#10201a; border-radius:0 8px 8px 0; }
.muted { color:var(--muted); } .small { font-size:.85rem; }
code.codes { display:block; font-size:1.1rem; letter-spacing:.08em; line-height:1.9; }
@media (max-width:640px) { main { padding:.7rem; } .card .value { font-size:1.15rem; } }
