:root{
  --bg:#f2f4f8; --card:#ffffff; --ink:#132033; --mute:#64728a; --line:#e2e7ef;
  --navy:#0c2748; --navy2:#16407a; --accent:#1d5fd1; --accent-soft:#e8f0fd;
  --ok:#12784a; --ok-soft:#e2f5ea; --warn:#9a5b00; --warn-soft:#fdf2dd;
  --err:#b42e26; --err-soft:#fce8e6; --info:#3a5a88; --info-soft:#eaf0f8;
  --r:14px; --shadow:0 1px 2px rgba(16,32,60,.05),0 6px 20px rgba(16,32,60,.06);
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{color-scheme:light}
body{margin:0;background:var(--bg);color:var(--ink);font:14px/1.5 "Segoe UI",system-ui,-apple-system,sans-serif;-webkit-font-smoothing:antialiased}
h1,h2,h3,p{margin:0}
button,input,select{font:inherit;color:inherit}

/* ---------- botones y campos ---------- */
.btn{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:10px;border:1px solid var(--line);background:var(--card);font-weight:600;cursor:pointer;white-space:nowrap;transition:background .15s,border-color .15s}
.btn:hover{border-color:#c5cedb;background:#f8fafc}
.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}
.btn.primary:hover{background:#174fb2}
.btn.big{width:100%;justify-content:center;padding:11px 14px;font-size:15px}
.btn.ghost{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.22);color:#fff}
.btn.ghost:hover{background:rgba(255,255,255,.18);border-color:rgba(255,255,255,.4)}
.link{background:none;border:0;padding:0;color:var(--accent);cursor:pointer;font-weight:600}
.link:hover{text-decoration:underline}
select{padding:7px 10px;border-radius:10px;border:1px solid var(--line);background:var(--card)}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* ---------- inicio de sesión ---------- */
.login{min-height:100vh;display:grid;place-items:center;padding:24px;background:linear-gradient(135deg,#0c2748 0%,#16407a 55%,#1d5fd1 100%)}
.login-card{width:100%;max-width:860px;display:grid;grid-template-columns:1fr 1fr;background:var(--card);border-radius:20px;overflow:hidden;box-shadow:0 24px 60px rgba(4,16,36,.35)}
.login-brand{background:var(--navy);color:#fff;padding:40px 36px;display:flex;flex-direction:column;gap:18px}
.login-brand h1{font-size:24px;letter-spacing:-.01em;line-height:1.2}
.login-brand p{color:#b9c8de}
.login-brand ul{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:12px}
.login-brand li{display:flex;gap:10px;align-items:flex-start;color:#dbe5f3}
.login-brand li::before{content:"✓";flex:none;width:20px;height:20px;border-radius:50%;background:rgba(255,255,255,.14);display:grid;place-items:center;font-size:12px;font-weight:700}
.login-form{padding:40px 36px;display:flex;flex-direction:column;gap:14px}
.login-form h2{font-size:22px;letter-spacing:-.01em}
.login-form .sub{color:var(--mute);margin-top:-8px}
.field{display:grid;gap:6px;font-weight:600;font-size:13px}
.field input{padding:10px 12px;border-radius:10px;border:1px solid #cfd6e1;background:#fff;font-weight:400;font-size:14px}
.field input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.form-err{padding:9px 12px;border-radius:10px;background:var(--err-soft);color:var(--err);font-weight:600;font-size:13px}
.fine{color:var(--mute);font-size:12px;line-height:1.45}
.login-foot{display:flex;justify-content:center}
.logo{width:40px;height:40px;border-radius:11px;background:linear-gradient(135deg,#3b82f6,#1d5fd1);display:grid;place-items:center;flex:none}
.logo svg{width:22px;height:22px}
@media (max-width:720px){.login-card{grid-template-columns:1fr}.login-brand{padding:28px 24px}.login-brand ul{display:none}.login-form{padding:28px 24px}}

/* ---------- barra superior ---------- */
.bar{position:sticky;top:0;z-index:20;background:var(--navy);color:#fff;box-shadow:0 2px 12px rgba(4,16,36,.25)}
.bar-in{max-width:1320px;margin:0 auto;padding:10px 24px;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.bar .logo{width:32px;height:32px;border-radius:9px}
.bar .logo svg{width:18px;height:18px}
.brand{font-weight:700;font-size:16px;letter-spacing:-.01em}
.brand small{display:block;font-weight:400;font-size:12px;color:#a9bad3;letter-spacing:0}
.spacer{flex:1}
.file-chip{max-width:320px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:6px 12px;border-radius:999px;background:rgba(255,255,255,.1);font-size:13px;color:#dbe5f3}
.user{display:flex;align-items:center;gap:8px;padding-left:12px;border-left:1px solid rgba(255,255,255,.18)}
.avatar{width:30px;height:30px;border-radius:50%;background:#3b82f6;display:grid;place-items:center;font-weight:700;text-transform:uppercase}
.user b{font-weight:600;max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

main{max-width:1320px;margin:0 auto;padding:24px 24px 72px}

/* ---------- carga de archivo ---------- */
.upload{max-width:760px;margin:6vh auto 0;text-align:center}
.upload h2{font-size:24px;letter-spacing:-.01em}
.upload>p{color:var(--mute);margin-top:6px}
.drop{display:block;margin-top:24px;border:2px dashed #c3ccd9;border-radius:18px;background:var(--card);padding:44px 24px;cursor:pointer;transition:border-color .15s,background .15s,transform .15s;box-shadow:var(--shadow)}
.drop:hover,.drop.over{border-color:var(--accent);background:var(--accent-soft)}
.drop.over{transform:scale(1.01)}
.drop-ico{width:56px;height:56px;border-radius:16px;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center;margin:0 auto 14px}
.drop-ico svg{width:28px;height:28px}
.drop strong{display:block;font-size:17px}
.drop span{display:block;color:var(--mute);margin-top:4px}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:22px;text-align:left}
.step{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px}
.step i{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--navy);color:#fff;font-style:normal;font-weight:700;font-size:12px;margin-bottom:8px}
.step b{display:block}
.step span{color:var(--mute);font-size:13px}
@media (max-width:720px){.steps{grid-template-columns:1fr}}
#msg{max-width:760px;margin:16px auto 0;padding:12px 16px;border-radius:12px;background:var(--err-soft);color:var(--err);font-weight:600}

/* ---------- encabezado del reporte ---------- */
.hero{display:flex;flex-wrap:wrap;gap:20px;align-items:center;justify-content:space-between;background:linear-gradient(120deg,var(--navy),var(--navy2));color:#fff;border-radius:18px;padding:24px 28px;box-shadow:var(--shadow)}
.eyebrow{font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#a9bad3}
.hero h2{font-size:22px;letter-spacing:-.01em;margin-top:4px;overflow-wrap:anywhere}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.chips span{padding:4px 12px;border-radius:999px;background:rgba(255,255,255,.1);font-size:13px;color:#c9d6e8}
.chips b{color:#fff;font-weight:600;margin-left:4px}
.hero-total{text-align:right}
.hero-total small{display:block;color:#a9bad3;font-size:13px}
.hero-total b{display:block;font-size:34px;line-height:1.15;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.hero-total .pill{margin-top:8px}

.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:16px}
@media (max-width:1000px){.kpis{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.kpis{grid-template-columns:1fr}.hero-total{text-align:left}}
.kpi{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;box-shadow:var(--shadow)}
.kpi small{display:block;color:var(--mute);font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase}
.kpi b{display:block;font-size:24px;letter-spacing:-.01em;margin-top:4px;font-variant-numeric:tabular-nums}
.kpi span{display:block;color:var(--mute);font-size:13px;margin-top:2px}

.verdict{display:flex;gap:14px;align-items:flex-start;margin-top:16px;border-radius:var(--r);padding:16px 18px;border:1px solid transparent}
.verdict.ok{background:var(--ok-soft);border-color:#bfe6cf}
.verdict.warn{background:var(--warn-soft);border-color:#f3dba8}
.verdict.err{background:var(--err-soft);border-color:#f3c4bf}
.v-ico{flex:none;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:800;font-size:18px}
.verdict.ok .v-ico{background:var(--ok)} .verdict.warn .v-ico{background:#c98208} .verdict.err .v-ico{background:var(--err)}
.verdict h3{font-size:16px}
.verdict p{margin-top:2px}

/* ---------- pestañas ---------- */
.tabs{display:flex;flex-wrap:wrap;gap:6px;margin-top:24px;padding:6px;background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow)}
.tabs button{border:0;background:none;color:var(--mute);font-weight:600;padding:8px 14px;border-radius:9px;cursor:pointer;transition:background .15s,color .15s}
.tabs button:hover{background:#f1f4f9;color:var(--ink)}
.tabs button.on{background:var(--navy);color:#fff}
.tabs .n{display:inline-block;min-width:22px;padding:0 7px;margin-left:8px;border-radius:999px;background:#e8ecf3;color:var(--ink);font-size:12px;text-align:center}
.tabs button.on .n{background:rgba(255,255,255,.2);color:#fff}

/* ---------- tarjetas y tablas ---------- */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:18px 20px;margin-top:16px;box-shadow:var(--shadow)}
.card h2{font-size:16px;margin-bottom:12px}
.tw{overflow-x:auto;margin:0 -20px;padding:0 20px}
table{border-collapse:collapse;width:100%;font-variant-numeric:tabular-nums}
th,td{padding:8px 12px;border-bottom:1px solid var(--line);text-align:left;white-space:nowrap}
th{font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--mute);font-weight:700;background:#f7f9fc;border-bottom:1px solid #d5dce7}
th:first-child{border-radius:8px 0 0 8px} th:last-child{border-radius:0 8px 8px 0}
tbody tr:hover td{background:#f8fafd}
td.r,th.r{text-align:right}
td.wrap{white-space:normal;min-width:240px}
tr.tot td{font-weight:700;border-top:2px solid #cfd6e1;border-bottom:0;background:#f7f9fc}
tr.bad td{background:var(--err-soft)}
tr.flag td{background:var(--warn-soft)}
tr.bad:hover td{background:#f9dcd9} tr.flag:hover td{background:#fbe9c6}
td.mute,span.mute{color:var(--mute)}
.pos{color:var(--ok)} .neg{color:var(--err)}
.pill{display:inline-block;padding:2px 10px;border-radius:999px;font-size:12px;font-weight:700}
.pill.error{background:var(--err-soft);color:var(--err)}
.pill.warn{background:var(--warn-soft);color:var(--warn)}
.pill.info{background:var(--info-soft);color:var(--info)}
.pill.ok{background:var(--ok-soft);color:var(--ok)}
.filters{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center;margin-bottom:14px}
.filters label{display:inline-flex;gap:6px;align-items:center;color:var(--mute)}
.note{color:var(--mute);font-size:13px;margin-top:12px}

/* ---------- hallazgos ---------- */
.pane-h{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end;justify-content:space-between;margin-top:24px}
.pane-h h2{font-size:18px}
.pane-h p{color:var(--mute);font-size:13px;max-width:760px;margin-top:2px}
.group{margin-top:20px}
.group-h{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;margin-bottom:10px}
.group-h h2{font-size:15px}
.group-h p{color:var(--mute);font-size:13px;flex-basis:100%;padding-left:20px}
.dot{width:10px;height:10px;border-radius:50%}
.dot.error{background:var(--err)} .dot.warn{background:#d98d0b} .dot.info{background:#5b7fb3}
.count{padding:0 8px;border-radius:999px;background:#e3e8f0;font-size:12px;font-weight:700}
.finding{display:flex;gap:20px;align-items:flex-start;justify-content:space-between;background:var(--card);border:1px solid var(--line);border-left:4px solid #5b7fb3;border-radius:12px;padding:14px 18px;margin-top:10px;box-shadow:var(--shadow)}
.finding.error{border-left-color:var(--err)} .finding.warn{border-left-color:#d98d0b}
.finding h3{font-size:14px;margin-top:6px}
.finding p{color:var(--mute);margin-top:4px;max-width:900px}
.tag{display:inline-block;padding:1px 9px;border-radius:6px;background:#eef1f6;color:var(--mute);font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase}
.imp{flex:none;text-align:right;font-weight:700;font-size:16px;font-variant-numeric:tabular-nums;color:var(--ok);white-space:nowrap}
.imp small{display:block;font-weight:600;font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--mute)}
@media (max-width:640px){.finding{flex-direction:column;gap:8px}.imp{text-align:left}}
details.card summary{cursor:pointer;font-weight:700;font-size:15px}
details.card[open] summary{margin-bottom:12px}
ul.oks{margin:0;padding:0;list-style:none;columns:2;column-gap:32px;color:var(--mute)}
ul.oks li{break-inside:avoid;padding:3px 0 3px 22px;position:relative}
ul.oks li::before{content:"✓";position:absolute;left:0;color:var(--ok);font-weight:700}
@media (max-width:760px){ul.oks{columns:1}}

/* ---------- planes y cobro ---------- */
.pay{min-height:100vh;background:linear-gradient(180deg,#0c2748 0,#16407a 330px,var(--bg) 330px)}
.pay-in{max-width:1080px;margin:0 auto;padding:20px 24px 64px}
.pay-top{display:flex;align-items:center;gap:12px;flex-wrap:wrap;color:#fff}
.pay-top .logo{width:32px;height:32px;border-radius:9px}
.pay-top .logo svg{width:18px;height:18px}
.pay-head{text-align:center;color:#fff;margin-top:34px}
.pay-head h1{font-size:28px;letter-spacing:-.02em}
.pay-head p{color:#c2d0e4;margin-top:6px}
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:28px;align-items:stretch}
@media (max-width:860px){.plans{grid-template-columns:1fr}}
.plan{position:relative;display:flex;flex-direction:column;background:var(--card);border:2px solid transparent;border-radius:18px;padding:24px 22px;box-shadow:0 10px 30px rgba(8,24,52,.14);cursor:pointer;transition:border-color .15s,transform .15s}
.plan:hover{transform:translateY(-2px)}
.plan.sel{border-color:var(--accent)}
.plan .badge{position:absolute;top:-11px;left:22px;padding:2px 12px;border-radius:999px;background:var(--accent);color:#fff;font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase}
.plan h3{font-size:16px}
.plan .price{font-size:34px;font-weight:700;letter-spacing:-.02em;margin-top:8px;font-variant-numeric:tabular-nums}
.plan .dur{color:var(--mute);font-size:13px}
.plan ul{list-style:none;margin:16px 0 20px;padding:0;display:grid;gap:9px;flex:1}
.plan li{position:relative;padding-left:24px}
.plan li::before{content:"✓";position:absolute;left:0;color:var(--ok);font-weight:700}
.plan li.no{color:#9aa6b8}
.plan li.no::before{content:"–";color:#b6c0ce}
.plan .btn{justify-content:center}
.plan.sel .btn{background:var(--accent);border-color:var(--accent);color:#fff}
.pay-grid{display:grid;grid-template-columns:1.25fr 1fr;gap:18px;margin-top:22px;align-items:start}
@media (max-width:860px){.pay-grid{grid-template-columns:1fr}}
.pay-grid .card{margin-top:0}
.pay-steps{margin:0;padding-left:20px;display:grid;gap:12px}
.pay-steps b{font-weight:700}
.bank{display:grid;grid-template-columns:auto 1fr;gap:4px 16px;margin-top:8px;padding:12px 14px;border-radius:10px;background:#f6f8fb;border:1px solid var(--line)}
.bank span{color:var(--mute)}
.bank b{overflow-wrap:anywhere}
.pend{padding:10px 12px;border-radius:10px;background:var(--warn-soft);color:var(--warn);font-weight:600;margin-top:8px}
#pyCode{width:100%;min-height:104px;resize:vertical;padding:10px 12px;border-radius:10px;border:1px solid #cfd6e1;font:12px/1.5 Consolas,monospace;overflow-wrap:anywhere}
#pyCode:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
#pyForm{display:flex;flex-direction:column;gap:12px}
#pyForm h2{margin-bottom:0}
#pyForm p{color:var(--mute);font-size:13px}
.tabs button.locked::after{content:"🔒";font-size:11px;margin-left:6px;opacity:.75}
.lock{text-align:center;padding:44px 24px}
.lock .lock-ico{font-size:30px}
.lock h2{margin:8px 0 6px;font-size:18px}
.lock p{color:var(--mute);max-width:520px;margin:0 auto 18px}

/* ---------- día a día ---------- */
.cal td{vertical-align:top}
.cal td small{display:block;color:var(--mute)}
.cal tr.off td{color:var(--mute)}
.cal tr.wk td:first-child{font-weight:700}

/* ---------- web: varios ---------- */
a.btn{text-decoration:none}
.btn:disabled{opacity:.6;cursor:default}
#usoNota{font-size:13px;margin-top:10px}
#pyForm .link{align-self:center}

/* ---------- administración ---------- */
.adm h1{font-size:22px;letter-spacing:-.01em}
.adm .sub{color:var(--mute);margin-top:2px}
.adm-form{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
@media (max-width:820px){.adm-form{grid-template-columns:1fr}}
.adm-form .full{grid-column:1/-1;display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.acts{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.acts .btn,.acts select{padding:5px 10px;font-size:13px}
.btn.danger{color:var(--err)}
.aviso{padding:10px 14px;border-radius:10px;background:var(--ok-soft);color:var(--ok);font-weight:600;margin-top:16px;overflow-wrap:anywhere}
.aviso.mal{background:var(--err-soft);color:var(--err)}
.vacio{color:var(--mute);padding:6px 0}
.check{display:flex;gap:10px;align-items:center;font-weight:600;cursor:pointer}
.check input{width:18px;height:18px}

/* ---------- historial y comparación ---------- */
#historial{max-width:980px;margin:0 auto}
.hist{margin-top:28px}
.cmp td small{display:block;font-size:12px;font-weight:400}
.cmp th{white-space:normal;vertical-align:bottom;line-height:1.25}

/* ---------- ir desde un hallazgo al detalle ---------- */
.finding.clic{cursor:pointer;transition:border-color .15s,box-shadow .15s,transform .15s}
.finding.clic:hover{border-color:#b9c7dc;box-shadow:0 2px 4px rgba(16,32,60,.06),0 10px 26px rgba(16,32,60,.1);transform:translateY(-1px)}
.finding .ver{display:inline-block;margin-top:8px;color:var(--accent);font-weight:600;font-size:13px}
.volver{display:flex;flex-wrap:wrap;gap:10px 14px;align-items:center;margin-top:16px;padding:10px 14px;border-radius:12px;background:var(--accent-soft);border:1px solid #c9dbf7;scroll-margin-top:76px}
.volver span{flex:1;min-width:220px}
tr.foco td{background:#dbe8fd!important}
tr.foco td:first-child{box-shadow:inset 4px 0 0 var(--accent)}
tr[data-row],.card[data-inf]{scroll-margin-top:76px}

/* ---------- filtro de rutas (día a día) ---------- */
.chipsel{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:14px}
.chip{border:1px solid var(--line);background:var(--card);color:var(--mute);font-weight:600;padding:5px 12px;border-radius:999px;cursor:pointer;transition:background .15s,color .15s,border-color .15s}
.chip:hover{border-color:#b9c4d4;color:var(--ink)}
.chip.on{background:var(--navy);border-color:var(--navy);color:#fff}
.chipsel .link{margin-left:6px;font-size:13px}
.cal td small.neg{color:var(--err)} .cal td small.pos{color:var(--ok)}
.chipsel+.chipsel{margin-top:-4px}
.dia th,.dia td{padding:7px 9px}
.dia th{white-space:normal;vertical-align:bottom;line-height:1.25}
.dia td.tar{white-space:normal;min-width:120px;max-width:200px;color:var(--mute);font-size:13px}
.dia td small{display:block;color:var(--mute);font-size:12px;font-weight:400;white-space:normal;max-width:170px;margin-left:auto;line-height:1.3}
.dia td.wk{font-weight:700}
.dia tr.g td{border-top:2px solid #d5dce7}
.dia tr.off td{color:var(--mute)}
.dia tr.sub td{background:#f7f9fc;font-weight:600}
.dia tr.sub td.tar{font-weight:400}
.cal tr.tot td{vertical-align:top}
