:root{color-scheme:light dark;--bg:#f4f3ef;--card:#fff;--fg:#14202a;--muted:#5a6870;--line:#e2dfd8;--ok:#15803d;--ok-bg:#dcf3e4;--mal:#b42318;--mal-bg:#fde4e1;--warn:#9a5b00;--warn-bg:#fff1cc;--acc:#ff6a3d;--focus:#1d6fe0}
@media (prefers-color-scheme:dark){:root{--bg:#0d1418;--card:#151f25;--fg:#e7eef1;--muted:#97a6ad;--line:#25333b;--ok:#4ade80;--ok-bg:#12301f;--mal:#ff8a7a;--mal-bg:#3a1714;--warn:#ffcc66;--warn-bg:#3a2c0b;--focus:#7cb4ff}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);font:400 15px/1.5 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
a{color:inherit}
:focus-visible{outline:3px solid var(--focus);outline-offset:2px;border-radius:6px}
.top{display:flex;justify-content:space-between;align-items:center;padding:12px 20px;background:#0b1a20;color:#eaf2f3}
.marca{display:flex;align-items:center;gap:10px;text-decoration:none;font-weight:700}
.logo{width:30px;height:30px}.logo rect{fill:var(--acc)}.logo path{stroke:#fff;stroke-width:3;stroke-linecap:round;fill:none}
.btn-link{background:none;border:0;color:inherit;text-decoration:underline;cursor:pointer;font:inherit}
.wrap{max-width:1180px;margin:0 auto;padding:20px}
h1{font-size:1.5rem;margin:.2em 0}
.resumen{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:16px}
.resumen div{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px 16px;display:flex;flex-direction:column}
.resumen b{font-size:1.5rem;line-height:1.2}
.resumen span{color:var(--muted);font-size:.85rem}
.resumen .alerta{border-color:var(--mal);background:var(--mal-bg)}
.chips{display:flex;gap:8px;overflow-x:auto;margin-bottom:16px;padding-bottom:4px}
.chip{flex:none;padding:8px 14px;border-radius:999px;border:1px solid var(--line);background:var(--card);text-decoration:none;font-weight:600;font-size:.9rem}
.chip.on{background:var(--fg);color:var(--bg);border-color:var(--fg)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:14px}
.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:16px;display:flex;flex-direction:column;gap:10px}
.card.is-susp{border-style:dashed}
.card-hd{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}
.card h2{font-size:1.1rem;margin:0}
.dom{color:var(--muted);font-size:.85rem;word-break:break-all}
.badge{flex:none;font-size:.78rem;font-weight:700;padding:4px 10px;border-radius:999px}
.b-ok{background:var(--ok-bg);color:var(--ok)}.b-susp{background:var(--mal-bg);color:var(--mal)}
.b-warn{background:var(--warn-bg);color:var(--warn)}.b-prueba{background:var(--line);color:var(--muted);font-size:.7rem;vertical-align:middle}
.card.is-hecho{opacity:.7}.mano{margin:0 0 8px;font-weight:800;color:var(--acc);letter-spacing:.06em;font-size:.85rem}
.lineas{margin:0 0 12px;padding-left:18px}.seg{display:grid;gap:4px;margin-bottom:8px;font-size:.85rem;color:var(--muted)}
.seg input{font:inherit;padding:8px 10px;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--fg)}
.meta{display:grid;grid-template-columns:1fr 1fr;gap:8px 14px;margin:0}
.meta dt{font-size:.75rem;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.meta dd{margin:0;font-size:.9rem}
.pago.vencido{color:var(--mal);font-weight:700}.pago.pronto{color:var(--warn);font-weight:700}
.w-ok{color:var(--ok)}.w-mal{color:var(--mal)}
.notas{margin:0;font-size:.88rem;color:var(--muted);background:var(--bg);border-radius:10px;padding:8px 10px;white-space:pre-wrap}
.acciones{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto}
.acciones form{margin:0}
.btn{display:inline-flex;align-items:center;min-height:40px;padding:8px 14px;border-radius:10px;border:1px solid var(--line);background:var(--bg);color:var(--fg);font:600 .88rem system-ui,sans-serif;text-decoration:none;cursor:pointer}
.btn:hover{border-color:var(--muted)}
.btn-ok{background:var(--ok);border-color:var(--ok);color:#fff}
@media (prefers-color-scheme:dark){.btn-ok{color:#06210f}}
.btn-mal{background:var(--mal-bg);border-color:var(--mal);color:var(--mal)}
.confirmar summary{list-style:none}.confirmar summary::-webkit-details-marker{display:none}
.confirmar[open]{flex-basis:100%}
.confirmar form{margin-top:8px;padding:10px;border-radius:10px;background:var(--mal-bg)}
.confirmar p{margin:0 0 8px;font-size:.88rem}
.form{display:grid;gap:12px;max-width:560px;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:20px}
.form label{display:flex;flex-direction:column;gap:4px;font-weight:600;font-size:.88rem}
.form input,.form textarea{font:inherit;padding:10px 12px;border-radius:10px;border:1px solid var(--line);background:var(--bg);color:var(--fg);min-height:42px}
.dos{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.login{margin:8vh auto 0;max-width:380px}
.error{background:var(--mal-bg);color:var(--mal);padding:10px 12px;border-radius:10px;margin:0}
.toast{background:var(--ok-bg);color:var(--ok);padding:10px 14px;border-radius:10px;font-weight:600;margin:0 0 14px}
.vacio,.pie{color:var(--muted);font-size:.85rem}
.pie{margin-top:24px}
@media (max-width:640px){.resumen{grid-template-columns:1fr 1fr}.grid{grid-template-columns:1fr}.dos{grid-template-columns:1fr}.wrap{padding:14px}}