:root{
  --navy:#14295A; --navy2:#1F3864; --navy3:#0B1838; --red:#E0353B; --red2:#C62A30;
  --ink:#16213A; --muted:#5B6B85; --line:#DCE3EE; --bg:#EEF2F8; --card:#FFFFFF;
  --radius:16px; --shadow:0 10px 30px rgba(20,41,90,.12);
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--ink);font-family:'Inter',system-ui,-apple-system,'Segoe UI',Arial,sans-serif}
a{color:inherit}
button{font:inherit;cursor:pointer}
.hidden{display:none!important}

/* ---------- inicio de sesión */
.login-wrap{min-height:100vh;display:grid;grid-template-columns:1.1fr 1fr}
.login-art{position:relative;overflow:hidden;background:radial-gradient(1200px 600px at -10% 110%,#2B4C9B 0,transparent 60%),linear-gradient(150deg,var(--navy3),var(--navy) 55%,#20408A);color:#fff;padding:56px;display:flex;flex-direction:column;justify-content:space-between}
.login-art .ecg{position:absolute;left:0;right:0;top:46%;height:120px;opacity:.55}
.login-art .ecg path{fill:none;stroke:#FF5A60;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1400;stroke-dashoffset:1400;animation:draw 3.2s ease forwards infinite}
@keyframes draw{60%{stroke-dashoffset:0}100%{stroke-dashoffset:0;opacity:.0}}
.login-art h1{font-size:44px;line-height:1.08;margin:0;font-weight:800;letter-spacing:-.02em}
.login-art p{color:#C9D5EE;font-size:17px;max-width:460px;line-height:1.5}
.badge{display:inline-flex;gap:8px;align-items:center;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);padding:8px 14px;border-radius:999px;font-size:13px;color:#E3EAF8}
.badge i{width:8px;height:8px;border-radius:50%;background:#3DDC97;box-shadow:0 0 0 4px rgba(61,220,151,.18)}
.login-form{display:flex;align-items:center;justify-content:center;padding:40px;background:#fff}
.login-card{width:100%;max-width:380px}
.login-card img{width:230px;display:block;margin:0 0 28px}
.login-card h2{margin:0 0 6px;font-size:26px;color:var(--navy)}
.login-card .sub{color:var(--muted);margin:0 0 28px}
.field{display:block;margin:0 0 16px}
.field span{display:block;font-size:13px;font-weight:600;color:var(--navy2);margin-bottom:6px}
.field input{width:100%;padding:13px 14px;border:1.5px solid var(--line);border-radius:12px;font-size:15px;outline:none;transition:.15s;background:#FAFBFE}
.field input:focus{border-color:var(--navy2);background:#fff;box-shadow:0 0 0 4px rgba(31,56,100,.1)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:12px;padding:13px 18px;font-weight:700;font-size:15px;transition:.15s}
.btn-primary{background:linear-gradient(135deg,var(--navy2),var(--navy));color:#fff;width:100%;box-shadow:0 8px 18px rgba(20,41,90,.25)}
.btn-primary:hover{transform:translateY(-1px);box-shadow:0 12px 24px rgba(20,41,90,.3)}
.btn-ghost{background:#fff;color:var(--navy);border:1.5px solid var(--line)}
.btn-ghost:hover{border-color:var(--navy2)}
.btn-red{background:linear-gradient(135deg,var(--red),var(--red2));color:#fff}
.err{color:var(--red2);font-size:14px;min-height:20px;margin:6px 0 10px}
.demo{background:#FFF6DB;border:1px solid #F2D27A;color:#7A5A00;border-radius:10px;padding:10px 12px;font-size:13px;margin-bottom:18px}
.foot{color:#8A97AE;font-size:12px;margin-top:28px}

/* ---------- menú */
.top{display:flex;align-items:center;justify-content:space-between;padding:18px 34px;background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}
.top img{height:42px}
.top .who{display:flex;gap:10px;align-items:center;color:var(--muted);font-size:14px}
.hero{background:linear-gradient(150deg,var(--navy3),var(--navy) 60%,#24479A);color:#fff;padding:48px 34px 120px;position:relative;overflow:hidden}
.hero h1{margin:0;font-size:34px;font-weight:800;letter-spacing:-.02em}
.hero p{margin:10px 0 0;color:#C9D5EE;font-size:16px}
.hero svg{position:absolute;right:-40px;bottom:30px;width:640px;opacity:.35}
.hero svg path{fill:none;stroke:#FF5A60;stroke-width:3}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;max-width:1180px;margin:-84px auto 40px;padding:0 34px;position:relative}
.card{background:var(--card);border-radius:22px;box-shadow:var(--shadow);padding:28px;text-decoration:none;color:inherit;display:flex;flex-direction:column;gap:14px;border:1px solid rgba(20,41,90,.06);transition:.2s;position:relative;overflow:hidden}
.card:hover{transform:translateY(-6px);box-shadow:0 22px 44px rgba(20,41,90,.18)}
.card::after{content:'';position:absolute;inset:auto -40px -60px auto;width:180px;height:180px;border-radius:50%;background:radial-gradient(circle,rgba(224,53,59,.10),transparent 70%)}
.card .ico{width:58px;height:58px;border-radius:16px;display:grid;place-items:center;background:linear-gradient(135deg,#EAF0FB,#DCE6F7)}
.card .ico svg{width:32px;height:32px}
.card h3{margin:0;font-size:20px;color:var(--navy)}
.card p{margin:0;color:var(--muted);line-height:1.5;font-size:14.5px;flex:1}
.card .go{display:flex;align-items:center;gap:8px;font-weight:700;color:var(--red2);font-size:14px}
.card.soon{opacity:.6;pointer-events:none}
.card .tag{position:absolute;top:18px;right:18px;font-size:11px;font-weight:700;background:#EEF2F8;color:var(--muted);padding:4px 9px;border-radius:999px}
.modal{position:fixed;inset:0;background:rgba(11,24,56,.5);display:grid;place-items:center;z-index:50;padding:20px}
.modal .box{background:#fff;border-radius:18px;padding:28px;width:100%;max-width:400px;box-shadow:var(--shadow)}
.modal h3{margin:0 0 16px;color:var(--navy)}
.ok{color:#1E8E5A;font-size:14px;min-height:20px}

/* ---------- informe */
.bar{display:flex;align-items:center;gap:14px;padding:10px 22px;background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:30}
.bar img{height:34px}
.bar .t{font-weight:800;color:var(--navy);font-size:16px}
.bar .t small{display:block;font-weight:500;color:var(--muted);font-size:12px}
.bar .sp{flex:1}
.bar .btn{padding:10px 14px;font-size:14px}
.tabs{display:flex;gap:6px;padding:10px 22px 0;background:#fff;border-bottom:1px solid var(--line);position:sticky;top:55px;z-index:29;overflow-x:auto}
.tab{border:0;background:transparent;padding:10px 16px;border-radius:10px 10px 0 0;font-weight:700;color:var(--muted);font-size:13.5px;border-bottom:3px solid transparent;white-space:nowrap}
.tab.on{color:var(--navy);border-bottom-color:var(--red)}
.stage{padding:24px;overflow:auto}
.loading{padding:80px;text-align:center;color:var(--muted)}
.sheet{display:flex;flex-direction:column;align-items:center;gap:24px}
.sheet:not(.informe) .page{background:#fff;box-shadow:var(--shadow);border-radius:6px}
.page{position:relative;background:#fff}
.sheet.informe .page{box-shadow:0 6px 24px rgba(20,41,90,.16)}
.grid{border-collapse:collapse;table-layout:fixed}
.grid td{padding:0;overflow:visible;position:relative;vertical-align:top}
.grid .c{display:flex;overflow:hidden;padding:0 2px;line-height:1.15}
.grid .c:not(.w){white-space:pre;overflow:visible}
.grid .c:not(.w) > span{position:relative;z-index:1}
.grid .c.w{white-space:pre-wrap;word-break:break-word}
.grid .c.w span{display:block;width:100%}
.grid .c.inbox{overflow:hidden;padding:0}
.in{width:100%;height:100%;border:0;background:rgba(255,236,170,.28);resize:none;overflow:hidden;line-height:1.15;font:inherit;color:inherit;padding:0 3px;outline:none;font-weight:inherit;text-align:inherit}
.in.filled{background:transparent}
.in:hover{background:rgba(255,226,140,.45)}
textarea.in{padding:2px 3px;white-space:pre-wrap}
.in:focus{background:#FFF7D6;box-shadow:inset 0 0 0 2px #F0B429}
select.in{appearance:none;-webkit-appearance:none;cursor:pointer;text-align-last:center}
.pic{position:absolute;pointer-events:none}
.hint{max-width:1000px;margin:0 auto 16px;background:#fff;border:1px solid var(--line);border-left:4px solid var(--red);border-radius:10px;padding:10px 14px;color:var(--muted);font-size:13.5px}

@page{size:letter;margin:0.2in}
@media print{
  html,body{background:#fff!important}
  .bar,.tabs,.hint,.no-print{display:none!important}
  .stage{padding:0;overflow:visible}
  .sheet{display:none!important}
  .sheet.informe{display:block!important}
  .sheet.informe .page{zoom:.72;box-shadow:none;margin:0 auto;break-after:page;page-break-after:always}
  .sheet.informe .page:last-child{break-after:auto;page-break-after:auto}
  .in{background:transparent!important;box-shadow:none!important}
  select.in{color:inherit}
  input[type=date].in::-webkit-calendar-picker-indicator{display:none}
  *{-webkit-print-color-adjust:exact;print-color-adjust:exact}
}
@media (max-width:900px){.login-wrap{grid-template-columns:1fr}.login-art{display:none}.cards{grid-template-columns:1fr}}

/* ---------- motilidad interactiva */
.mot{max-width:1500px;margin:0 auto;display:flex;flex-direction:column;gap:18px;position:relative}
.mot-head h2{margin:0;color:var(--navy);font-size:22px}
.mot-head p{margin:4px 0 0;color:var(--muted);font-size:14px}
.mot-body{display:grid;grid-template-columns:250px minmax(0,1fr);gap:18px;align-items:start}
.mot-side{background:#fff;border-radius:16px;box-shadow:var(--shadow);padding:16px;display:flex;flex-direction:column;gap:8px;position:sticky;top:120px}
.mot-lbl{font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-top:6px}
.mot-ph{display:flex;flex-direction:column;align-items:flex-start;gap:2px;border:1.5px solid var(--line);background:#fff;border-radius:12px;padding:10px 12px;text-align:left;font-weight:700;color:var(--navy)}
.mot-ph small{font-weight:500;color:var(--muted);font-size:12px}
.mot-ph.on{border-color:var(--navy2);background:linear-gradient(135deg,var(--navy2),var(--navy));color:#fff}
.mot-ph.on small{color:#C9D5EE}
.mot-br{display:flex;align-items:center;gap:10px;border:1.5px solid var(--line);background:#fff;border-radius:12px;padding:9px 12px;font-weight:600;color:var(--ink)}
.mot-br i{width:18px;height:18px;border-radius:5px;border:1px solid rgba(0,0,0,.18)}
.mot-br kbd{margin-left:auto;font:600 11px/1 'Inter',sans-serif;color:var(--muted);border:1px solid var(--line);border-radius:5px;padding:3px 6px}
.mot-br.on{border-color:var(--red);box-shadow:0 0 0 3px rgba(224,53,59,.15)}
.mot-help{margin:0;font-size:12.5px;color:var(--muted);line-height:1.4}
.mot-reset{width:100%;padding:9px 12px;font-size:13px}
.mot-tg{display:flex;gap:8px;align-items:center;font-size:12.5px;color:var(--muted);margin-top:6px}
.mot-fig{background:#fff;border-radius:16px;box-shadow:var(--shadow);padding:14px 18px;min-width:0}
.mot-phase{display:flex;align-items:center;gap:12px;font-size:15px;color:var(--navy);margin-bottom:4px}
.mot-phase span{color:var(--muted);font-variant-numeric:tabular-nums}
.mot-svg{width:100%;height:auto;display:block}
.mot-svg .mot-vt{font:800 22px 'Inter',Arial,sans-serif;fill:#111A2E}
.mot-svg .mot-lv{font:600 22px 'Inter',Arial,sans-serif;fill:#4A5872}
.mot-svg .mot-ch{font:600 20px 'Inter',Arial,sans-serif;fill:#4A5872}
.mot-seg{cursor:pointer;outline:none}
.mot-seg path{stroke:#1D2433;stroke-width:2.2;transition:fill .15s}
.mot-seg text{font:700 17px 'Inter',Arial,sans-serif;pointer-events:none}
.mot-seg:hover path,.mot-seg:focus path{stroke:#E0353B;stroke-width:3.2}
.mot-seg.alt path{stroke-width:2.8}
.mot-legend{display:flex;flex-wrap:wrap;gap:8px 16px;font-size:12.5px;color:var(--muted);padding:10px 4px 2px;border-top:1px solid var(--line);margin-top:6px}
.mot-legend span{display:inline-flex;align-items:center;gap:6px}
.mot-legend i{width:14px;height:14px;border-radius:4px;border:1px solid rgba(0,0,0,.15)}
.mot-legend .sep{width:1px;height:16px;background:var(--line)}
.mot-tablewrap{background:#fff;border-radius:16px;box-shadow:var(--shadow);padding:6px;overflow-x:auto}
.mot-table{width:100%;border-collapse:collapse;font-size:13px;font-variant-numeric:tabular-nums}
.mot-table th{background:var(--navy2);color:#fff;font-size:11.5px;letter-spacing:.04em;text-transform:uppercase;padding:9px 8px;text-align:left}
.mot-table th:first-child{border-radius:10px 0 0 0}.mot-table th:last-child{border-radius:0 10px 0 0}
.mot-table th.cur{background:var(--red)}
.mot-table td{padding:5px 8px;border-bottom:1px solid #EDF1F7}
.mot-table tbody tr:nth-child(even){background:#F8FAFD}
.mot-table td.cur{background:rgba(224,53,59,.05)}
.mot-table .chip{display:inline-block;padding:2px 9px;border-radius:999px;font-weight:700;font-size:12px}
.mot-table .dot{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:-1px}
.mot-table tfoot td{background:#EEF3FA;font-weight:700;color:var(--navy)}
.mot-table tfoot td:first-child{text-align:right}
em[class^="g-"]{font-style:normal;font-weight:700;padding:2px 9px;border-radius:999px;font-size:12px}
.g-Normal{background:#E3F4EA;color:#1E7A4A}.g-Leve{background:#FFF1B8;color:#6B5300}.g-Moderada{background:#FBD3B0;color:#7A3A00}.g-Severa{background:#F6B3B5;color:#7A0D12}
.mot-txt{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.mot-txt>div{background:#fff;border-radius:16px;box-shadow:var(--shadow);padding:14px 16px}
.mot-txt b{color:var(--navy);font-size:13px;text-transform:uppercase;letter-spacing:.05em}
.mot-txt p{margin:6px 0 0;font-size:13.5px;line-height:1.5;color:var(--ink)}
.mot-tip{position:absolute;z-index:40;background:#0B1838;color:#fff;font-size:12.5px;line-height:1.4;padding:8px 10px;border-radius:10px;pointer-events:none;box-shadow:var(--shadow)}
@media (max-width:1000px){.mot-body{grid-template-columns:1fr}.mot-side{position:static}.mot-txt{grid-template-columns:1fr}}

.mot-stage{position:relative}
.mot-seg path{stroke:transparent;stroke-width:0;fill-opacity:.62}
.mot-seg:hover path,.mot-seg:focus path{stroke:#E0353B;stroke-width:6;fill:rgba(224,53,59,.12)}
.mot-seg.alt:hover path{fill-opacity:.7}
.mot-seg.sel path{stroke:#1F3864;stroke-width:8;stroke-dasharray:14 8}
.mot-badge{pointer-events:none}.mot-badge circle{stroke:#fff;stroke-width:4}.mot-seg .mot-badge text{font:800 22px 'Inter',Arial,sans-serif}
.mot-keys{display:flex;flex-direction:column;gap:6px}
.mot-keys div{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:600}
.mot-keys kbd{min-width:34px;text-align:center;font:800 13px/1 'Inter',sans-serif;padding:7px 6px;border-radius:8px;border:1px solid rgba(0,0,0,.15)}
.mot-keys small{margin-left:auto;color:var(--muted);font-weight:600}
.mot-menu{position:absolute;z-index:45;background:#fff;border-radius:14px;box-shadow:0 18px 40px rgba(11,24,56,.25);padding:8px;min-width:210px;border:1px solid var(--line)}
.mot-mh{font-size:12px;font-weight:800;color:var(--navy);padding:4px 8px 8px;border-bottom:1px solid var(--line);margin-bottom:4px}
.mot-menu button{display:flex;align-items:center;gap:10px;width:100%;border:0;background:transparent;padding:8px;border-radius:9px;font-weight:600;font-size:14px;color:var(--ink);text-align:left}
.mot-menu button:hover,.mot-menu button.on{background:#EEF2F8}
.mot-menu i{width:16px;height:16px;border-radius:4px;border:1px solid rgba(0,0,0,.18)}
.mot-menu kbd{margin-left:auto;font:700 11px/1 'Inter',sans-serif;color:var(--muted);border:1px solid var(--line);border-radius:5px;padding:3px 6px}