:root { --fondo:#f6f7f9; --texto:#1c2430; --tenue:#667085; --borde:#d9dee6; --marca:#14532d; --marca2:#166534; --card:#fff;
  --ok:#e7f6ec; --ok-b:#9ad3b0; --err:#fdecec; --err-b:#f0a8a8; --aviso:#fff6df; --aviso-b:#ecd08a; }
@media (prefers-color-scheme: dark) {
  :root { --fondo:#12161c; --texto:#e6eaf0; --tenue:#98a2b3; --borde:#2b3441; --marca:#4ade80; --marca2:#22c55e; --card:#1a2029;
    --ok:#14301f; --ok-b:#2c6b46; --err:#3a1717; --err-b:#7d3333; --aviso:#352b10; --aviso-b:#7d672a; } }
* { box-sizing: border-box; }
body { margin:0; background:var(--fondo); color:var(--texto); font:15px/1.5 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; }
a { color:var(--marca2); } a:hover { text-decoration:underline; }
.barra { display:flex; flex-wrap:wrap; gap:.5rem 1.25rem; align-items:center; padding:.6rem 16px; background:var(--card); border-bottom:1px solid var(--borde); }
.marca { font-weight:700; text-decoration:none; color:var(--marca); }
.barra nav { display:flex; flex-wrap:wrap; gap:.25rem .9rem; flex:1; }
.barra nav a { text-decoration:none; } .sesion { display:flex; gap:.75rem; align-items:center; margin:0; font-size:.9rem; color:var(--tenue); }
.contenido { max-width:1200px; margin:0 auto; padding:16px; }
h1 { font-size:1.5rem; margin:.5rem 0 1rem; } h2 { font-size:1.15rem; margin:1.75rem 0 .6rem; } h3 { font-size:1rem; }
.tenue { color:var(--tenue); font-size:.9rem; }
.caja { background:var(--card); border:1px solid var(--borde); border-radius:8px; padding:16px; margin:1rem 0; }
.caja.chica { max-width:380px; margin:12vh auto; }
.tarjetas { display:grid; grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); gap:12px; margin:1rem 0; }
.tarjeta { background:var(--card); border:1px solid var(--borde); border-radius:8px; padding:12px 14px; text-decoration:none; color:inherit; display:flex; flex-direction:column; }
.tarjeta b { font-size:1.6rem; } .tarjeta span { color:var(--tenue); font-size:.85rem; }
a.tarjeta:hover { border-color:var(--marca2); text-decoration:none; }
table { width:100%; border-collapse:collapse; background:var(--card); border:1px solid var(--borde); border-radius:8px; display:block; overflow-x:auto; }
table.chica { width:auto; max-width:100%; }
th, td { text-align:left; padding:7px 10px; border-bottom:1px solid var(--borde); vertical-align:top; }
th { font-size:.8rem; color:var(--tenue); text-transform:uppercase; letter-spacing:.03em; }
td.num { text-align:right; font-variant-numeric:tabular-nums; }
code { font:.85em ui-monospace,Menlo,Consolas,monospace; background:rgba(127,127,127,.15); padding:1px 5px; border-radius:4px; }
code.corto { max-width:16ch; overflow:hidden; text-overflow:ellipsis; display:inline-block; white-space:nowrap; vertical-align:bottom; }
form label { display:flex; flex-direction:column; gap:3px; font-size:.85rem; color:var(--tenue); margin-bottom:.6rem; }
form label.check { flex-direction:row; align-items:center; gap:8px; color:var(--texto); }
.fila { display:flex; flex-wrap:wrap; gap:.6rem 1rem; align-items:flex-end; margin:.4rem 0; }
.fila label { margin-bottom:0; }
.rejilla { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:.4rem 1rem; align-items:end; }
fieldset { border:1px solid var(--borde); border-radius:6px; margin:0 0 .6rem; } legend { font-size:.85rem; color:var(--tenue); }
input, select, button { font:inherit; padding:8px 10px; border:1px solid var(--borde); border-radius:6px; background:var(--card); color:var(--texto); min-height:40px; }
input[type=checkbox] { min-height:auto; width:auto; }
button { background:var(--marca2); color:#fff; border-color:var(--marca2); cursor:pointer; font-weight:600; }
button.secundario { background:transparent; color:var(--texto); border-color:var(--borde); }
button.peligro { background:transparent; color:#b42318; border-color:#b42318; }
button.enlace { background:none; border:none; color:var(--marca2); padding:0; min-height:auto; font-weight:400; cursor:pointer; }
button:focus-visible, input:focus-visible, select:focus-visible, a:focus-visible { outline:2px solid var(--marca2); outline-offset:2px; }
.aviso { padding:10px 14px; border-radius:6px; margin:.75rem 0; background:var(--aviso); border:1px solid var(--aviso-b); }
.aviso.ok { background:var(--ok); border-color:var(--ok-b); } .aviso.error { background:var(--err); border-color:var(--err-b); }
.etq { display:inline-block; font-size:.75rem; padding:1px 8px; border-radius:99px; border:1px solid var(--borde); text-decoration:none; }
.etq.vigente,.etq.confirmada,.etq.error:not(.aviso) { } .etq.vencida,.etq.fallida { background:var(--err); border-color:var(--err-b); }
.etq.por_vencer,.etq.pendiente,.etq.advertencia { background:var(--aviso); border-color:var(--aviso-b); }
.etq.vigente,.etq.confirmada { background:var(--ok); border-color:var(--ok-b); }
.paginas { color:var(--tenue); font-size:.9rem; }
@media (max-width:640px) { .contenido { padding:12px 16px; } th, td { padding:6px 8px; } }
