:root{
  --navy:#1f3864; --navy2:#2d4a7c; --ink:#1d2433; --muted:#667085; --line:#e4e7ec; --bg:#f5f6f8; --card:#fff;
  --ok:#1b7f4b; --okbg:#e3f4ea; --info:#175cd3; --infobg:#e6efff; --warn:#a15c07; --warnbg:#fdf1dc; --bad:#b42318; --badbg:#fde8e7;
  --r:10px;
}
*{box-sizing:border-box}
html,body{margin:0}
body{font:14px/1.45 -apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:var(--ink);background:var(--bg)}
a{color:var(--navy2);text-decoration:none} a:hover{text-decoration:underline}
.top{display:flex;align-items:center;gap:18px;background:var(--navy);color:#fff;padding:0 24px;height:58px;position:sticky;top:0;z-index:10}
.brand{display:flex;align-items:center;gap:10px;color:#fff}
.brand:hover{text-decoration:none}
.brand .logo{width:32px;height:32px;border-radius:8px;background:#fff;color:var(--navy);display:grid;place-items:center;font-weight:800}
.brand small{display:block;font-size:11px;opacity:.75;margin-top:-2px}
.top nav{display:flex;gap:4px;flex:1}
.top nav a{color:#dbe3f1;padding:8px 10px;border-radius:7px;white-space:nowrap}
.top nav a.on,.top nav a:hover{background:rgba(255,255,255,.12);color:#fff;text-decoration:none}
.top .user{display:flex;gap:14px}.top .user a{color:#fff}.top .user a.muted{opacity:.7}
main{max-width:1320px;margin:0 auto;padding:24px}
h1{font-size:22px;margin:0 0 4px} h2{font-size:16px;margin:0 0 12px} .sub{color:var(--muted);margin:0 0 20px}
.row{display:flex;gap:16px;flex-wrap:wrap;align-items:flex-start}
.head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:18px}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:18px;margin-bottom:18px}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;margin-bottom:18px}
.kpi{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px}
.kpi span{color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.03em}
.kpi b{display:block;font-size:22px;margin-top:4px;font-variant-numeric:tabular-nums}
.kpi.hl{background:var(--navy);color:#fff;border-color:var(--navy)} .kpi.hl span{color:#c9d5ea}
.kpi small{color:var(--muted)}
table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
th,td{padding:8px 10px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
th{font-size:12px;color:var(--muted);font-weight:600;background:#fafbfc;cursor:default;white-space:nowrap}
.nw{white-space:nowrap}
th.sort{cursor:pointer} th.sort:after{content:" ↕";opacity:.35}
td.n,th.n{text-align:right;white-space:nowrap}
tbody tr:hover{background:#f8fafc}
tr.clic{cursor:pointer}
tfoot td{font-weight:700;border-top:2px solid var(--ink)}
.tbl{overflow-x:auto}
.badge{display:inline-block;padding:2px 9px;border-radius:99px;font-size:12px;font-weight:600;white-space:nowrap}
.badge.ok{background:var(--okbg);color:var(--ok)} .badge.info{background:var(--infobg);color:var(--info)}
.badge.warn{background:var(--warnbg);color:var(--warn)} .badge.bad{background:var(--badbg);color:var(--bad)}
.badge.gray{background:#eef0f3;color:#475467}
.pos{color:var(--ok)} .neg{color:var(--bad)} .muted{color:var(--muted)}
.btn{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:#fff;color:var(--ink);padding:8px 14px;border-radius:8px;font:inherit;font-weight:600;cursor:pointer;white-space:nowrap}
.btn:hover{text-decoration:none;border-color:#c7ccd4}
.btn.pri{background:var(--navy);border-color:var(--navy);color:#fff} .btn.pri:hover{background:var(--navy2)}
.btn.danger{color:var(--bad);border-color:#f4c7c3}
.btn.sm{padding:4px 10px;font-size:12px}
.actions{display:flex;gap:8px;flex-wrap:wrap}
form.filters{display:flex;gap:10px;flex-wrap:wrap;align-items:end;margin-bottom:14px}
label{display:block;font-size:12px;font-weight:600;color:#344054;margin-bottom:4px}
input[type=text],input[type=email],input[type=password],input[type=date],input[type=month],input[type=number],select,textarea{
  font:inherit;border:1px solid #d0d5dd;border-radius:8px;padding:8px 10px;background:#fff;width:100%;color:var(--ink)}
textarea{min-height:90px}
input:focus,select:focus,textarea:focus{outline:2px solid #b2c5e8;border-color:var(--navy2)}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px 18px}
.grid .full{grid-column:1/-1}
.form{max-width:760px}
.help{font-size:12px;color:var(--muted);margin-top:4px}
.flash{padding:10px 14px;border-radius:8px;margin-bottom:16px;background:var(--okbg);color:var(--ok);border:1px solid #b7e1c7}
.flash.err{background:var(--badbg);color:var(--bad);border-color:#f4c7c3}
.flash.warn{background:var(--warnbg);color:var(--warn);border-color:#f3d9a4}
.flash.info{background:var(--infobg);color:var(--info);border-color:#b2ccff}
dl.datos{display:grid;grid-template-columns:140px 1fr;gap:6px 12px;margin:0}
dl.datos dt{color:var(--muted)} dl.datos dd{margin:0}
.login{max-width:380px;margin:10vh auto}
.login .card{padding:28px}
.chk{display:flex;gap:8px;align-items:center;font-weight:400}
.chk input{width:auto}
.note{white-space:pre-wrap;background:#fffbea;border:1px solid #f3e3a1;border-radius:8px;padding:10px 12px;font-size:13px}
@media (max-width:800px){.top{flex-wrap:wrap;height:auto;padding:10px 16px}.top nav{order:3;width:100%;overflow-x:auto}main{padding:16px}}
.subnav{background:#fff;border-bottom:1px solid var(--line)}
.subnav>div{max-width:1320px;margin:0 auto;padding:0 24px;display:flex;gap:4px}
.subnav a{padding:10px 12px;color:var(--muted);border-bottom:2px solid transparent;font-weight:600}
.subnav a.on,.subnav a:hover{color:var(--navy);border-color:var(--navy);text-decoration:none}
.small{font-size:12px}
.nota{border-top:1px solid var(--line);padding:10px 0}
.nota-form{display:flex;gap:10px;align-items:flex-start;margin-bottom:10px}
.linkbtn{background:none;border:0;color:var(--bad);cursor:pointer;font-size:12px;padding:0 4px}
.warn-t{color:var(--warn);font-weight:600}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(420px,1fr));gap:18px}
.list{list-style:none;margin:0;padding:0}
.list li{padding:8px 0;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:10px}
.list li:last-child{border-bottom:0}
.clave{font-family:ui-monospace,Menlo,Consolas,monospace;background:#f2f4f7;padding:3px 8px;border-radius:6px}
.tabs{display:flex;gap:6px;margin-bottom:14px;flex-wrap:wrap}
.tabs a{padding:6px 12px;border-radius:99px;background:#eef0f3;color:#344054;font-weight:600;font-size:13px}
.tabs a.on{background:var(--navy);color:#fff}
.tabs a:hover{text-decoration:none}
@media (max-width:800px){.grid2{grid-template-columns:1fr}.nota-form{flex-direction:column}}
a.kpi{color:inherit;display:block}a.kpi:hover{text-decoration:none;border-color:#c7ccd4}a.kpi.hl:hover{background:var(--navy2)}
/* Calendario */
.cal{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}
.cal-h{font-size:12px;font-weight:700;color:var(--muted);text-align:center;padding:4px 0}
.cal-d{min-height:108px;border:1px solid var(--line);border-radius:8px;padding:4px 5px;background:#fff;overflow:hidden}
.cal-d.vacio{background:transparent;border-color:transparent}
.cal-d.finde{background:#fafbfc}
.cal-d.hoy{border-color:var(--navy);box-shadow:inset 0 0 0 1px var(--navy)}
.cal-n{font-size:12px;font-weight:700;color:var(--muted);margin-bottom:2px}
.cal-d.hoy .cal-n{color:var(--navy)}
.cal-ev{display:block;font-size:11.5px;line-height:1.3;padding:2px 5px;border-radius:5px;margin-bottom:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--ink);border-left:3px solid}
.cal-ev:hover{text-decoration:none;filter:brightness(.96)}
.t-venc{background:#fde8e7;border-color:#d92d20}.t-evento{background:#e6efff;border-color:#175cd3}
.t-priv{background:#f4ebff;border-color:#7a5af8}.t-trabajo{background:#fdf1dc;border-color:#dc6803}.t-doc{background:#e3f4ea;border-color:#1b7f4b}
.cal.compacto .cal-d{min-height:44px;padding:3px}
.cal-dots{display:flex;gap:3px;flex-wrap:wrap}
.dot{display:inline-block;width:8px;height:8px;border-radius:99px;border:0}
.dot.t-venc{background:#d92d20}.dot.t-evento{background:#175cd3}.dot.t-priv{background:#7a5af8}.dot.t-trabajo{background:#dc6803}.dot.t-doc{background:#1b7f4b}
.leyenda{display:flex;gap:14px;flex-wrap:wrap;font-size:12px;color:var(--muted);margin-top:10px}
.leyenda i{margin-right:5px;vertical-align:middle}
/* Control mensual */
.ctl td,.ctl th{padding:5px 6px;text-align:center}
.ctl td:first-child,.ctl th:first-child{text-align:left}
.ctl th.rot{writing-mode:vertical-rl;transform:rotate(180deg);height:150px;white-space:nowrap;font-size:11.5px;vertical-align:bottom}
.mk{width:30px;height:28px;border:1px solid var(--line);border-radius:6px;background:#fff;cursor:pointer;font-weight:800;font-size:15px;color:var(--ok);padding:0}
.mk:hover{border-color:var(--navy)}
.mk.ok{background:var(--okbg);border-color:#9fd8b6}
.mk.na{color:#98a2b3;background:#f2f4f7}
.mk.bloq{cursor:default;opacity:.35}
.barra-p{height:8px;background:#eef0f3;border-radius:99px;overflow:hidden;min-width:80px}
.barra-p i{display:block;height:100%;background:var(--ok)}
.tarea{display:flex;gap:10px;align-items:center;padding:7px 0;border-bottom:1px solid var(--line)}
.tarea.hecha span{text-decoration:line-through;color:var(--muted)}
.tarea input[type=checkbox]{width:18px;height:18px}
.alerta{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:8px 0;border-bottom:1px solid var(--line)}
.alerta:last-child{border-bottom:0}
@media (max-width:800px){.cal-d{min-height:60px}.cal-ev{font-size:10px}}
@media print{.top,.subnav,.no-print{display:none}main{padding:0}.card{border:0}}
