:root { --fondo:#fff; --texto:#1d1d1f; --suave:#5f6368; --borde:#d0d4d9; --cab:#f1f3f4; --acento:#c8102e; --aviso:#8a5a00; }
@media (prefers-color-scheme: dark) {
  :root { --fondo:#16181b; --texto:#e8eaed; --suave:#a0a6ad; --borde:#3a3f45; --cab:#23272b; --acento:#ff5c6f; --aviso:#f0b54a; }
}
* { box-sizing: border-box; }
body { margin:0; background:var(--fondo); color:var(--texto); font:15px/1.45 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
header { display:flex; flex-wrap:wrap; gap:8px; justify-content:space-between; align-items:center; padding:16px; border-bottom:1px solid var(--borde); }
h1 { font-size:1.15rem; margin:0; }
h2 { font-size:1rem; margin:24px 0 2px; word-break:break-all; }
main { max-width:860px; margin:0 auto; padding:16px; }
#sesion { color:var(--suave); font-size:.9rem; display:flex; gap:10px; align-items:center; }
label { display:block; font-weight:600; margin:12px 0 4px; }
textarea, input { width:100%; font:inherit; color:inherit; background:var(--fondo); border:1px solid var(--borde); border-radius:6px; padding:8px; }
.fechas { display:flex; gap:16px; flex-wrap:wrap; }
.fechas label { flex:1 1 180px; }
.botones { display:flex; gap:10px; margin-top:16px; flex-wrap:wrap; }
button { font:inherit; padding:8px 16px; border-radius:6px; border:1px solid var(--acento); background:var(--acento); color:#fff; cursor:pointer; }
button.secundario, #sesion button { background:transparent; color:var(--acento); }
#sesion button { padding:4px 10px; }
button:disabled { opacity:.5; cursor:wait; }
#estado { color:var(--suave); min-height:1.4em; }
.url { color:var(--suave); font-size:.8rem; word-break:break-all; margin:0 0 6px; }
.tabla { overflow-x:auto; }
table { border-collapse:collapse; width:100%; min-width:520px; }
th, td { border:1px solid var(--borde); padding:6px 8px; text-align:right; }
th:first-child, td:first-child { text-align:left; }
th { background:var(--cab); font-weight:600; }
tr.total td { font-weight:700; }
.error { color:var(--acento); }
.aviso { color:var(--aviso); }
.nota { color:var(--suave); font-size:.8rem; margin-top:24px; }
.ayuda { color:var(--suave); font-size:.85rem; margin:4px 0 0; }