:root{--bg:#f6f7f9;--card:#fff;--ink:#1c2430;--mut:#667085;--line:#e4e7ec;--azul:#1f4e8c;--ambar:#e0a100;--verde:#2e8b57;--rojo:#c0392b}
@media (prefers-color-scheme:dark){:root{--bg:#10151c;--card:#18202a;--ink:#e8ecf1;--mut:#9aa5b4;--line:#2a3441;--azul:#6ea8ff;--ambar:#f2b83b;--verde:#52c48a;--rojo:#ff7b6b}}
*{box-sizing:border-box}body{margin:0;font:14px/1.5 system-ui,Segoe UI,sans-serif;background:var(--bg);color:var(--ink)}
a{color:var(--azul)}h1{font-size:19px;margin:0}h2{font-size:15px;margin:0 0 10px}
header{display:flex;gap:16px;align-items:center;padding:12px 20px;background:var(--card);border-bottom:1px solid var(--line)}
header .sp{flex:1}main{max-width:1100px;margin:0 auto;padding:18px 20px 40px;display:grid;gap:18px}
.card{background:var(--card);border:1px solid var(--line);border-radius:8px;padding:16px}
table{border-collapse:collapse;width:100%}th,td{padding:7px 8px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle}
th{color:var(--mut);font-size:12px;font-weight:600}td.c,th.c{text-align:center}
input,select,button{font:inherit}input[type=text],input[type=email],input[type=password],select{padding:7px 9px;border:1px solid var(--line);border-radius:6px;background:var(--card);color:var(--ink)}
button,.btn{padding:7px 14px;border:1px solid var(--azul);background:var(--azul);color:#fff;border-radius:6px;cursor:pointer}
button.sec{background:transparent;color:var(--azul)}button.peligro{background:transparent;border-color:var(--rojo);color:var(--rojo)}
.aviso{padding:10px 14px;border-radius:6px;background:#e0a10022;border:1px solid var(--ambar)}.aviso.malo{background:#c0392b22;border-color:var(--rojo)}.aviso.bueno{background:#2e8b5722;border-color:var(--verde)}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:end}pre{white-space:pre-wrap;background:var(--bg);padding:10px;border-radius:6px;max-height:260px;overflow:auto;margin:10px 0 0}
.mut{color:var(--mut)}.pill{padding:1px 8px;border-radius:10px;font-size:12px;background:var(--line)}
.login{max-width:360px;margin:12vh auto;padding:0 16px}.login .card{display:grid;gap:12px}
@media(max-width:700px){main,header{padding-left:12px;padding-right:12px}}
