:root{--bg:#05080f;--card:#0b1422;--borde:#1c2e48;--fg:#eef2f7;--mudo:#6b8299;--acento:#ffd359;--verde:#22d68a;--rojo:#f87171}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;font-size:14px;line-height:1.5}
a{color:inherit}
.layout{display:flex;min-height:100vh}
.lateral{width:210px;background:#070d18;border-right:1px solid var(--borde);padding:24px 0;flex-shrink:0}
.marca{padding:0 22px 22px;font-weight:600;letter-spacing:-.02em}
.lateral nav a{display:block;padding:10px 22px;color:var(--mudo);text-decoration:none;font-size:13px}
.lateral nav a.activo,.lateral nav a:hover{color:var(--fg);background:rgba(255,211,89,.06);border-left:2px solid var(--acento)}
.contenido{flex:1;padding:32px 36px 80px;max-width:1180px}
h1{font-size:26px;margin:0 0 4px;letter-spacing:-.02em}
.sub{color:var(--mudo);font-size:13px;margin:0 0 22px}
.periodos{display:flex;gap:6px;margin-bottom:22px;flex-wrap:wrap}
.periodos button{background:var(--card);border:1px solid var(--borde);color:var(--mudo);padding:7px 14px;border-radius:5px;font:inherit;font-size:13px;cursor:pointer}
.periodos button.activo{color:#05080f;background:var(--acento);border-color:var(--acento);font-weight:600}
.tarjetas{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:26px}
.tarjeta{background:var(--card);border:1px solid var(--borde);border-radius:6px;padding:16px 20px;min-width:150px;flex:1}
.tarjeta .et{display:block;font-size:11px;color:var(--mudo);text-transform:uppercase;letter-spacing:.6px;margin-bottom:6px}
.tarjeta .num{font-size:24px;font-weight:600}
.verde{color:var(--verde)}.rojo{color:var(--rojo)}.mudo{color:var(--mudo)}
h2{font-size:15px;margin:30px 0 12px;font-weight:600;letter-spacing:-.01em}
table{width:100%;border-collapse:collapse;background:var(--card);border:1px solid var(--borde);border-radius:6px;overflow:hidden}
th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:var(--mudo);padding:11px 14px;border-bottom:1px solid var(--borde);font-weight:500}
td{padding:11px 14px;border-bottom:1px solid rgba(28,46,72,.5);font-variant-numeric:tabular-nums}
tr:last-child td{border-bottom:none}
tbody tr:hover{background:rgba(255,255,255,.02)}
.embudo{display:flex;align-items:stretch;gap:8px;flex-wrap:wrap}
.paso{background:var(--card);border:1px solid var(--borde);border-radius:6px;padding:14px 16px;min-width:118px;flex:1}
.paso .n{font-size:22px;font-weight:600;display:block}
.paso .t{font-size:11px;color:var(--mudo);text-transform:uppercase;letter-spacing:.5px}
.paso .p{font-size:12px;color:var(--acento);margin-top:5px;display:block}
.nota{color:var(--mudo);font-size:12px;margin-top:8px}
.login{display:flex;align-items:center;justify-content:center;height:100vh}
.login form{background:var(--card);border:1px solid var(--borde);border-radius:8px;padding:34px;width:320px}
.login input{width:100%;padding:11px 13px;margin-bottom:12px;background:#05080f;border:1px solid var(--borde);border-radius:5px;color:var(--fg);font:inherit}
.login button{width:100%;padding:11px;background:var(--acento);color:#05080f;border:none;border-radius:5px;font:inherit;font-weight:600;cursor:pointer}