:root{--fondo:#f6f7f9;--tarjeta:#fff;--texto:#1b1f27;--suave:#5b6472;--borde:#dde1e7;--marca:#1f4fd8;--alerta:#b42318;--aviso:#b54708;--ok:#067647}@media (prefers-color-scheme:dark){:root{--fondo:#0f1218;--tarjeta:#181c24;--texto:#eef0f4;--suave:#9aa3b2;--borde:#2a303b;--marca:#7aa2ff;--alerta:#ff8a80;--aviso:#ffb86b;--ok:#6ee7a8}}*{box-sizing:border-box}body{background:var(--fondo);color:var(--texto);margin:0;font:16px/1.5 system-ui,sans-serif}main{max-width:960px;margin:0 auto;padding:16px}header.top{border-bottom:1px solid var(--borde);background:var(--tarjeta);justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;display:flex}header.top a{color:var(--texto);font-weight:600;text-decoration:none}h1{margin:.5rem 0 1rem;font-size:1.5rem}h2{margin:1.5rem 0 .5rem;font-size:1.1rem}.aviso-prueba{color:#5c4400;background:#fff4d6;border:1px solid #e8c766;border-radius:8px;margin-bottom:16px;padding:8px 12px;font-size:.9rem}.grilla{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;display:grid}.tarjeta{background:var(--tarjeta);border:1px solid var(--borde);border-radius:12px;padding:14px}.tarjeta .n{font-size:1.6rem;font-weight:700}.tarjeta .t{color:var(--suave);font-size:.85rem}a.tarjeta{color:inherit;text-decoration:none;display:block}a.tarjeta:hover{border-color:var(--marca)}.tabla{overflow-x:auto}table{border-collapse:collapse;background:var(--tarjeta);border:1px solid var(--borde);border-radius:12px;width:100%}th,td{text-align:left;border-bottom:1px solid var(--borde);white-space:nowrap;padding:8px 12px;font-size:.9rem}th{color:var(--suave);font-weight:600}.mora{color:var(--alerta)}.pronto{color:var(--aviso)}.ok{color:var(--ok)}form.login{gap:12px;max-width:340px;margin:15vh auto;display:grid}input,button{font:inherit;border:1px solid var(--borde);background:var(--tarjeta);color:var(--texto);border-radius:8px;padding:10px 12px}button{background:var(--marca);color:#fff;cursor:pointer;border:0;font-weight:600}button.link{color:var(--suave);background:0 0;padding:4px 8px}.error{color:var(--alerta)}.vacio{color:var(--suave)}