/* ==========================================================================
   VATS GTAM0499 · v3
   Identidad: pizarra (ink), amarillo señalética (signal), azul lápiz de formulario (pen),
   curvas de nivel como firma visual (instrumentación geotécnica / tranque).
   ========================================================================== */
:root{
  --ink:#16232B; --ink-2:#203540; --ink-3:#2C4552; --bg:#EDF0EC; --panel:#FFFFFF; --panel-2:#F7F9F6;
  --text:#18262E; --muted:#5A6870; --line:#D3DAD4; --line-2:#E5EAE5;
  --pen:#1F4E9C; --pen-2:#173E7E; --pen-soft:#E8EEF8; --signal:#F2B705; --signal-2:#FFD23F; --signal-soft:#FFF5D1;
  --sug:#0E7A6B; --sug-soft:#E2F2EE; --no:#B42318; --no-soft:#FDECEA; --ok:#18794E; --ok-soft:#E3F4EA;
  --font:"Segoe UI Variable Text","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --narrow:"Arial Narrow","Roboto Condensed","Segoe UI Variable Display","Helvetica Neue",Arial,sans-serif;
  --r-lg:14px; --r:10px; --r-sm:7px;
  --e1:0 1px 2px rgba(22,35,43,.06),0 2px 8px rgba(22,35,43,.04);
  --e3:0 20px 50px -12px rgba(22,35,43,.35),0 4px 14px rgba(22,35,43,.12);
  --side-w:248px; --appbar-h:68px;
  --safe-b:env(safe-area-inset-bottom,0px);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
html,body{margin:0;background:var(--bg);color:var(--text);font:15px/1.55 var(--font)}
body.dlg-open{overflow:hidden}
button,input,select,textarea{font:inherit;color:inherit}
button{-webkit-tap-highlight-color:transparent}
:focus-visible{outline:3px solid var(--pen);outline-offset:2px;border-radius:4px}
[hidden]{display:none!important}
.ico{width:20px;height:20px;flex:none}
h1,h2,h3{font-family:var(--narrow);font-stretch:condensed;letter-spacing:-.01em;margin:0}

/* ---------- logo ---------- */
.logo-row{display:flex;align-items:center;gap:10px}
.logo-mark{width:34px;height:34px;border-radius:8px;display:grid;place-items:center;background:var(--signal);color:var(--ink);font:900 22px/1 Arial,sans-serif}
.logo-txt{font:700 17px/1 var(--narrow);font-stretch:condensed;color:#fff;display:flex;flex-direction:column;gap:3px;letter-spacing:.02em}
.logo-txt b{font-size:21px;letter-spacing:0}

/* ---------- ingreso ---------- */
.auth{min-height:100vh;min-height:100dvh;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(380px,.9fr)}
.auth-brand{position:relative;background:var(--ink) url(/static/topo.svg) center/cover no-repeat;color:#fff;padding:40px 48px;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden}
.auth-brand::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(22,35,43,.55),rgba(22,35,43,.92) 75%);pointer-events:none}
.auth-brand>*{position:relative}
.claim{font:700 clamp(28px,3.4vw,46px)/1.08 var(--narrow);font-stretch:condensed;max-width:15ch;margin:0 0 18px}
.claim-sub{color:#A9B9C2;margin:0;max-width:46ch}
.auth-panel{display:grid;place-items:center;padding:32px 20px;background:var(--panel)}
.auth-card{width:100%;max-width:380px;display:flex;flex-direction:column;gap:16px}
.auth-card h2{font-size:32px;line-height:1.1}
.auth-card .hint{margin:0}
.auth-err{color:var(--no);font-size:14px;margin:0;min-height:1.3em}
.pw-wrap{position:relative}
.pw-wrap input{padding-right:46px}
.pw-eye{position:absolute;right:6px;top:50%;transform:translateY(-50%);border:0;background:none;color:var(--muted);width:36px;height:36px;border-radius:8px;cursor:pointer;display:grid;place-items:center}
.pw-eye:hover{background:var(--panel-2);color:var(--text)}
.pw-meter{height:4px;border-radius:4px;background:var(--line-2);overflow:hidden;margin-top:6px}
.pw-meter i{display:block;height:100%;width:0;background:var(--no);transition:width .25s,background .25s}

/* ---------- shell ---------- */
.shell{min-height:100vh;min-height:100dvh}
.side{position:fixed;inset:0 auto 0 0;width:var(--side-w);background:var(--ink);color:#CBD6DC;display:flex;flex-direction:column;z-index:40;padding:18px 14px calc(14px + var(--safe-b));overflow:hidden}
.side::after{content:"";position:absolute;left:-40%;right:-40%;bottom:-10%;height:46%;background:url(/static/topo.svg) center/cover no-repeat;opacity:.13;pointer-events:none}
.side>*{position:relative;z-index:1}
.side-top{display:flex;align-items:center;justify-content:space-between;padding:4px 6px 22px}
.sidenav{display:flex;flex-direction:column;gap:2px}
.sidenav button{display:flex;align-items:center;gap:12px;width:100%;border:0;background:none;color:#C3CFD6;padding:11px 12px;border-radius:var(--r-sm);cursor:pointer;font-size:15px;text-align:left;position:relative}
.sidenav button:hover{background:var(--ink-2);color:#fff}
.sidenav button.on{background:var(--ink-3);color:#fff;font-weight:600}
.sidenav button.on::before{content:"";position:absolute;left:-14px;top:8px;bottom:8px;width:4px;border-radius:0 4px 4px 0;background:var(--signal)}
.side-user{margin-top:auto;border-top:1px solid #2B414D;padding-top:14px;display:flex;flex-direction:column;gap:8px}
.who-card{display:flex;align-items:center;gap:10px;padding:4px 6px}
.avatar{width:38px;height:38px;border-radius:50%;background:var(--signal);color:var(--ink);display:grid;place-items:center;font:700 14px/1 var(--font);flex:none}
.who-card b{display:block;color:#fff;font-size:14px;line-height:1.25}
.who-card span{font-size:12.5px;color:#93A6B0}
.side-user .row{gap:6px}
.side-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;border:1px solid #33505E;background:transparent;color:#C3CFD6;border-radius:var(--r-sm);padding:8px;cursor:pointer;font-size:13px}
.side-btn:hover{background:var(--ink-2);color:#fff}
.side-btn .ico{width:16px;height:16px}
.icon-btn{width:40px;height:40px;border-radius:var(--r-sm);border:0;background:none;display:grid;place-items:center;cursor:pointer;color:inherit}
.icon-btn:hover{background:rgba(127,140,150,.15)}
.side-close,.burger{display:none}
.scrim{display:none}

.main{margin-left:var(--side-w);min-width:0}
.appbar{position:sticky;top:0;z-index:30;min-height:var(--appbar-h);display:flex;align-items:center;gap:14px;padding:12px 32px;background:rgba(237,240,236,.88);backdrop-filter:saturate(1.4) blur(10px);-webkit-backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--line-2)}
.appbar-title{min-width:0;flex:1}
.appbar h1{font-size:24px;line-height:1.15}
.appbar p{margin:0;color:var(--muted);font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.appbar-actions{display:flex;gap:8px;align-items:center}

.view{padding:24px 32px 64px;max-width:1500px}
.stage{background:var(--panel);border:1px solid var(--line-2);border-radius:var(--r-lg);padding:30px 34px;box-shadow:var(--e1);outline:none;min-width:0}
.stage.narrow{max-width:640px}
.stage h1{font-size:30px;line-height:1.12;margin:0 0 6px}
.stage h2{font-size:20px;line-height:1.25;margin:28px 0 10px}
.lead{color:var(--muted);margin:0 0 22px;max-width:72ch}
.hint{color:var(--muted);font-size:13px}
.empty{padding:36px 0;color:var(--muted)}
.warn{padding:10px 12px;background:var(--signal-soft);border-left:3px solid var(--signal);border-radius:0 var(--r-sm) var(--r-sm) 0;font-size:13.5px}
.warn ul{margin:0;padding-left:18px}
.ro-note{display:flex;gap:10px;align-items:center;padding:10px 14px;background:var(--pen-soft);border-radius:var(--r-sm);font-size:14px;margin:0 0 16px;color:var(--pen-2)}

/* ---------- formularios ---------- */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px 18px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px 16px}
.grid4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px 16px;margin-top:8px}
.grid2>*,.grid4>*{min-width:0}
.field{display:flex;flex-direction:column;gap:6px;min-width:0}
.field.full{grid-column:1/-1}
.field.wide{grid-column:span 2}
.field label{font-size:13px;font-weight:600;color:var(--text)}
.field input,.field select,.field textarea,.input{width:100%;min-width:0;border:1.5px solid var(--line);border-radius:var(--r-sm);padding:10px 12px;background:#fff;transition:border-color .15s,box-shadow .15s}
.field textarea{resize:vertical;line-height:1.45}
.field input:focus,.field textarea:focus,.field select:focus,.input:focus{border-color:var(--pen);outline:none;box-shadow:0 0 0 4px var(--pen-soft)}
.field .hint{font-weight:400}
.req::after{content:" *";color:var(--no)}
input:disabled,textarea:disabled,select:disabled{background:var(--panel-2);color:var(--text);border-color:var(--line-2)}
.switch{display:inline-flex;gap:10px;align-items:center;font-size:14px;cursor:pointer;user-select:none}
.switch input[type=checkbox]{appearance:none;-webkit-appearance:none;width:38px;height:22px;border-radius:99px;background:#C3CCC5;position:relative;cursor:pointer;flex:none;transition:background .18s;margin:0}
.switch input[type=checkbox]::after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.25);transition:transform .18s}
.switch input[type=checkbox]:checked{background:var(--pen)}
.switch input[type=checkbox]:checked::after{transform:translateX(16px)}
.switch input[type=checkbox]:disabled{opacity:.5}
input[type=checkbox]{accent-color:var(--pen);width:18px;height:18px}

/* ---------- botones ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1.5px solid var(--line);background:#fff;color:var(--text);padding:10px 16px;border-radius:var(--r-sm);cursor:pointer;font-weight:600;font-size:14.5px;text-decoration:none;line-height:1.2;transition:background .15s,border-color .15s,transform .05s;min-height:42px}
.btn:hover{border-color:var(--ink);background:var(--panel-2)}
.btn:active{transform:translateY(1px)}
.btn .ico{width:18px;height:18px}
.btn.primary{background:var(--pen);border-color:var(--pen);color:#fff}
.btn.primary:hover{background:var(--pen-2);border-color:var(--pen-2)}
.btn.signal{background:var(--signal);border-color:var(--signal);color:var(--ink)}
.btn.signal:hover{background:var(--signal-2);border-color:var(--signal-2)}
.btn.ghost{background:transparent}
.btn.small{padding:6px 11px;font-size:13px;min-height:34px}
.btn.block{width:100%}
.btn.danger{color:var(--no);border-color:#EBC3BE}
.btn.danger:hover{background:var(--no-soft);border-color:var(--no)}
.btn.danger-solid{background:var(--no);border-color:var(--no);color:#fff}
.btn.danger-solid:hover{background:#932016}
.btn:disabled{opacity:.45;cursor:not-allowed}
.icon{width:34px;height:34px;border:1.5px solid var(--line);background:#fff;border-radius:var(--r-sm);cursor:pointer;font-size:14px;display:grid;place-items:center}
.icon:hover:not(:disabled){border-color:var(--ink)}
.icon.danger{color:var(--no)}
.icon:disabled{opacity:.35;cursor:default}
.link{background:none;border:0;padding:0;cursor:pointer;font-size:12.5px;text-decoration:underline;color:var(--pen)}
.link.danger{color:var(--no)}
.row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.nav{display:flex;justify-content:space-between;gap:10px;margin-top:34px;padding-top:20px;border-top:1px solid var(--line-2)}

/* ---------- stepper ---------- */
.stepper{list-style:none;margin:0 0 18px;padding:6px;display:flex;gap:4px;background:var(--panel);border:1px solid var(--line-2);border-radius:var(--r-lg);overflow-x:auto;scrollbar-width:none;box-shadow:var(--e1)}
.stepper::-webkit-scrollbar{display:none}
.stepper li{flex:1;min-width:max-content}
.stepper button{width:100%;display:flex;align-items:center;gap:10px;border:0;background:none;padding:9px 12px;border-radius:var(--r);cursor:pointer;color:var(--muted);font-size:14px;white-space:nowrap}
.stepper button:hover:not(:disabled){background:var(--panel-2)}
.stepper .n{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font:700 12.5px/1 var(--font);border:1.5px solid currentColor;flex:none}
.stepper button.done{color:var(--text)}
.stepper button.done .n{background:var(--ink);border-color:var(--ink);color:#fff}
.stepper button.on{background:var(--pen-soft);color:var(--pen-2);font-weight:600}
.stepper button.on .n{background:var(--pen);border-color:var(--pen);color:#fff}
.stepper button:disabled{opacity:.5;cursor:not-allowed}
.step-mobile{display:none}

.vats-grid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:18px;align-items:start}
.sheet{position:sticky;top:calc(var(--appbar-h) + 16px);background:var(--panel);border:1px solid var(--line-2);border-radius:var(--r-lg);padding:18px 20px;font-size:13.5px;box-shadow:var(--e1);max-height:calc(100vh - var(--appbar-h) - 40px);overflow:auto}
.sheet h3{font-size:18px;line-height:1.2;margin:0 0 2px}
.sheet .file{font-size:12px;color:var(--muted);word-break:break-all;margin-bottom:14px}
.sheet dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:4px 12px}
.sheet dt{color:var(--muted)}
.sheet dd{margin:0}
.sheet .pages{list-style:none;padding:0;margin:14px 0 0;border-top:1px solid var(--line-2)}
.sheet .pages li{padding:7px 0;border-bottom:1px solid var(--line-2);display:flex;gap:10px}
.sheet .pages small{color:var(--muted);white-space:nowrap;min-width:62px}
.sheet .warn{margin-top:14px}
.sheet-toggle{display:none}
.mbar{display:none}

/* ---------- paso 1: actividades ---------- */
.sub{margin:24px 0 10px;font:700 15px/1.2 var(--narrow);font-stretch:condensed;color:var(--muted)}
.acts{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px}
.act{display:flex;gap:12px;align-items:flex-start;text-align:left;border:1.5px solid var(--line-2);background:#fff;padding:12px 14px;border-radius:var(--r);cursor:pointer;transition:border-color .15s,background .15s,box-shadow .15s}
.act code{font:700 13px/1.5 var(--narrow);background:var(--panel-2);border:1px solid var(--line-2);padding:0 7px;border-radius:5px;white-space:nowrap;color:var(--muted)}
.act span{font-size:14.5px;line-height:1.35}
.act:hover{border-color:var(--ink)}
.act.on{border-color:var(--pen);background:var(--pen-soft);box-shadow:0 0 0 3px var(--pen-soft)}
.act.on code{background:var(--pen);border-color:var(--pen);color:#fff}
.tasks{margin-top:10px;border:1px solid var(--line-2);border-radius:var(--r);overflow:hidden}
.task{display:flex;gap:12px;align-items:center;padding:11px 14px;border-bottom:1px solid var(--line-2);cursor:pointer}
.task:last-child{border-bottom:0}
.task:hover{background:var(--panel-2)}
.task .n{font:700 12.5px var(--narrow);color:var(--muted);min-width:48px}
.task small{margin-left:auto;color:var(--muted);white-space:nowrap;font-size:12.5px}

/* ---------- revisión ---------- */
.rev{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.rev-col{border:1.5px solid var(--ink);border-radius:var(--r);overflow:hidden}
.rev-col header{display:grid;grid-template-columns:1fr 58px 58px;background:var(--ink);color:#fff;font:600 13px/1.25 var(--narrow);font-stretch:condensed}
.rev-col header span{padding:10px 12px}
.rev-col header span+span{text-align:center;border-left:1px solid #ffffff2e}
.rev-item{display:grid;grid-template-columns:1fr 58px 58px;border-top:1px solid var(--line);min-height:64px}
.rev-item p{margin:0;padding:10px 12px;font-size:13.5px;line-height:1.4}
.mark{border:0;border-left:1px solid var(--line);background:#fff;cursor:pointer;font:900 24px/1 Arial,sans-serif;color:var(--ink);transition:background .12s}
.mark:hover{background:var(--panel-2)}
.mark.on{background:var(--signal)}
.mark.on.no{background:var(--no);color:#fff}

/* ---------- energías ---------- */
.energy-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(205px,1fr));gap:8px}
.en{display:grid;grid-template-columns:26px minmax(0,1fr) 42px;grid-template-rows:auto auto;column-gap:8px;align-items:center;text-align:left;border:1.5px solid var(--line-2);background:#fff;padding:10px 10px 10px 12px;border-radius:var(--r);cursor:pointer;min-height:62px;transition:border-color .15s,background .15s}
.en:hover{border-color:var(--ink)}
.en .num{font:700 15px/1 var(--narrow);color:var(--muted)}
.en .nm{font-weight:600;font-size:14px;line-height:1.2;overflow-wrap:break-word}
.en .box{grid-row:1/3;grid-column:3;width:42px;height:32px;border:2px solid var(--ink);border-radius:5px;display:grid;place-items:center;font:900 24px/1 Arial,sans-serif;color:transparent;background:#fff}
.en .src{grid-column:2;font-size:11.5px;color:var(--sug);line-height:1.25}
.en.sug .num{color:var(--sug)}
.en.sug{border-color:#A8D5CC}
.en.on{background:var(--signal-soft);border-color:var(--signal)}
.en.on .box{color:var(--ink)}
.en.just .box{animation:stamp .2s ease-out}
@keyframes stamp{from{transform:scale(1.7);opacity:.1}to{transform:scale(1);opacity:1}}
.page-tabs{display:flex;gap:6px;flex-wrap:wrap;margin:14px 0 10px}
.page-tabs button{border:1.5px solid var(--line);background:#fff;padding:6px 12px;border-radius:99px;cursor:pointer;font-size:13px;max-width:240px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.page-tabs button.on{border-color:var(--pen);background:var(--pen);color:#fff}
.who{display:flex;gap:14px;align-items:center;margin:22px 0 10px;flex-wrap:wrap}
.who h2{margin:0}
.why{margin-top:14px;font-size:13.5px}
.why summary{cursor:pointer;color:var(--pen);font-weight:600}
.why ul{margin:8px 0 0;padding-left:18px;color:var(--muted)}
.chips{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px;align-items:center}
.chip{border:1.5px dashed var(--sug);color:var(--sug);background:#fff;border-radius:99px;padding:4px 11px;font-size:13px;cursor:pointer}
.chip:hover{background:var(--sug-soft)}

/* ---------- condiciones ---------- */
.cond{border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.cond-row{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;padding:11px 14px;border-top:1px solid var(--line-2)}
.cond-row:first-child{border-top:0}
.cond-row .lab{font-size:14px}
.cond-row .lab small{display:block;color:var(--muted);font-size:12.5px}
.seg{display:inline-flex;border:1.5px solid var(--line);border-radius:var(--r-sm);overflow:hidden;background:#fff;flex:none}
.seg button{border:0;background:none;padding:7px 12px;cursor:pointer;font:600 13px var(--font);min-width:48px;min-height:36px}
.seg button+button{border-left:1.5px solid var(--line)}
.seg button:hover{background:var(--panel-2)}
.seg button.on{background:var(--ink);color:#fff}
.seg button.on.si{background:var(--signal);color:var(--ink)}
.cond-extra{grid-column:1/-1}
.cond-extra input{width:100%;border:1.5px solid var(--line);border-radius:var(--r-sm);padding:8px 10px}

/* ---------- hoja 2 ---------- */
.q{border-top:1px solid var(--line-2);padding:14px 0}
.q-head{display:grid;grid-template-columns:30px 1fr auto;gap:10px;align-items:start}
.q-head b{font:700 16px/1.4 var(--narrow)}
.q-head p{margin:0;font-size:14.5px}
.badge{display:inline-block;font-size:12px;color:var(--sug);background:var(--sug-soft);border-radius:99px;padding:2px 10px;margin-top:6px}
.actions{margin:12px 0 0 40px;padding:12px 14px;background:var(--pen-soft);border-radius:var(--r)}
.actions label{display:flex;gap:10px;align-items:flex-start;font-size:14px;padding:4px 0}
.actions input[type=checkbox]{margin-top:2px}
.add{display:flex;gap:6px;margin-top:8px}
.add input{flex:1;min-width:0;border:1.5px solid var(--line);border-radius:var(--r-sm);padding:7px 10px;font-size:14px;background:#fff}
.pot{border:1px solid var(--line);border-radius:var(--r);margin-top:12px;overflow:hidden}
.pot>header{display:flex;gap:10px;align-items:center;padding:10px 14px;background:var(--panel-2);flex-wrap:wrap;border-bottom:1px solid var(--line-2)}
.pot>header b{font:700 17px/1.2 var(--narrow);font-stretch:condensed}
.pot .orig{font-size:12.5px;color:var(--muted)}
.pot .orig strong{color:var(--ink);font:700 14px var(--narrow);border:1.5px solid var(--ink);border-radius:4px;padding:0 6px;margin-left:4px;background:#fff}
.pot>header .switch{margin-left:auto}
.pot .ctrls{padding:10px 14px}
.pot .ctrls label{display:flex;gap:10px;align-items:flex-start;font-size:14px;padding:4px 0}
.pot .ctrls input[type=checkbox]{margin-top:2px}
.pot .ctrls .cnt{margin-left:auto;color:var(--muted);font-size:12px;white-space:nowrap}
.pot.off .ctrls{display:none}
.pot.off>header{border-bottom:0;opacity:.7}
.more{background:none;border:0;color:var(--pen);cursor:pointer;padding:6px 0;font-weight:600;font-size:13.5px}

/* ---------- generar ---------- */
.out{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:14px}
.out-card{border:1px solid var(--line);border-radius:var(--r-lg);padding:20px;display:flex;flex-direction:column;gap:6px;background:linear-gradient(180deg,#fff,var(--panel-2))}
.out-card .oc-ic{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:var(--pen-soft);color:var(--pen);margin-bottom:6px}
.out-card.oc-main .oc-ic{background:var(--signal);color:var(--ink)}
.out-card h3{font-size:20px}
.out-card p{margin:0 0 12px;color:var(--muted);font-size:14px}
.out-card .row{margin-top:auto}
.preview{margin-top:18px;border:1px solid var(--line);border-radius:var(--r);height:78vh;width:100%;background:#fff}

/* ---------- tablas ---------- */
.table-wrap{border:1px solid var(--line-2);border-radius:var(--r);overflow:auto}
table.list{width:100%;border-collapse:collapse;font-size:14px}
table.list th{text-align:left;font:600 12.5px var(--font);color:var(--muted);background:var(--panel-2);border-bottom:1px solid var(--line);padding:10px 12px;white-space:nowrap}
table.list td{border-bottom:1px solid var(--line-2);padding:11px 12px;vertical-align:top}
table.list tr:last-child td{border-bottom:0}
table.list tbody tr:hover td{background:#FAFBFA}
table.list select{border:1.5px solid var(--line);border-radius:var(--r-sm);padding:6px 8px;background:#fff;max-width:180px}
tr.off td{color:var(--muted)}
td.c,th.c{text-align:center}
td.nw{white-space:nowrap}
td.det{max-width:440px}
.tag{display:inline-block;font-size:11.5px;font-weight:600;background:var(--signal-soft);color:#7A5B00;border-radius:99px;padding:1px 9px;margin-top:4px}
.tag.red{background:var(--no-soft);color:var(--no)}
.tag.ok{background:var(--ok-soft);color:var(--ok)}
dl.kv{display:grid;grid-template-columns:auto 1fr;gap:6px 16px;margin:0}
dl.kv dt{color:var(--muted)}
dl.kv dd{margin:0;font-weight:600}
.toolbar{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap;margin-bottom:14px}
.search{position:relative;flex:1;max-width:380px}
.search .ico{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--muted);width:18px;height:18px}
.search input{width:100%;border:1.5px solid var(--line);border-radius:99px;padding:9px 14px 9px 38px;background:#fff}
.search input:focus{outline:none;border-color:var(--pen);box-shadow:0 0 0 4px var(--pen-soft)}

/* ---------- mapa de procesos ---------- */
.view.mapa{display:grid;grid-template-columns:300px minmax(0,1fr);gap:18px;align-items:start}
.m-list{position:sticky;top:calc(var(--appbar-h) + 16px);background:var(--panel);border:1px solid var(--line-2);border-radius:var(--r-lg);padding:14px;max-height:calc(100vh - var(--appbar-h) - 40px);overflow:auto;box-shadow:var(--e1)}
.m-head{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:10px}
.m-head h2{margin:0;font-size:18px}
.m-current{display:none}
.m-list .search{max-width:none;margin-bottom:6px}
.m-sub{font:700 12.5px/1.3 var(--narrow);color:var(--muted);margin:14px 6px 4px}
.m-item{display:grid;grid-template-columns:auto 1fr auto;gap:8px;width:100%;text-align:left;background:none;border:0;padding:8px;border-radius:var(--r-sm);cursor:pointer;font-size:13.5px;line-height:1.3}
.m-item code{font:700 12px/1.4 var(--narrow);color:var(--muted)}
.m-item small{color:var(--muted);font-size:11px}
.m-item:hover{background:var(--panel-2)}
.m-item.on{background:var(--pen-soft);color:var(--pen-2);font-weight:600}
.m-item.on code{color:var(--pen)}
.m-item.off span{color:var(--muted)}
.m-title{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;margin-bottom:16px}
.m-title .ver{font-size:13px;color:var(--muted)}
.pchips{display:flex;flex-wrap:wrap;gap:5px;align-items:center;margin:10px 0}
.pchips>span{font-size:13px;font-weight:600;min-width:140px}
.pchip{border:1.5px solid var(--line);background:#fff;border-radius:99px;padding:4px 10px;font-size:12.5px;cursor:pointer}
.pchip:hover:not(:disabled){border-color:var(--ink)}
.pchip.on{background:var(--signal);border-color:var(--signal);font-weight:600;color:var(--ink)}
.pchip:disabled{cursor:default}
.m-tasks{border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.m-task{border-top:1px solid var(--line-2)}
.m-task:first-child{border-top:0}
.m-task-head{display:flex;gap:8px;align-items:center;padding:9px 12px}
.m-task-head .n{font:700 12.5px var(--narrow);color:var(--muted);min-width:46px}
.m-task-head input{flex:1;min-width:0;border:1.5px solid transparent;border-radius:var(--r-sm);padding:7px 9px;font-weight:600;background:transparent}
.m-task-head input:not(:disabled):hover,.m-task-head input:focus{border-color:var(--line);background:#fff;outline:none}
.m-task.open{background:var(--panel-2)}
.m-task-body{padding:4px 14px 16px}
.risk{border:1px solid var(--line);border-left:4px solid var(--signal);background:#fff;border-radius:var(--r-sm);padding:12px 14px;margin:12px 0}
.risk-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.risk .field label{font-size:12.5px}
.risk textarea{font-size:13.5px}
.m-save{position:sticky;bottom:0;background:rgba(255,255,255,.96);backdrop-filter:blur(8px);border-top:1px solid var(--line);margin:28px -34px -30px;padding:14px 34px;display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap;z-index:3;border-radius:0 0 var(--r-lg) var(--r-lg)}
.m-save .field{flex:1;min-width:240px}
.dirty{color:var(--no);font-size:13px;font-weight:600;align-self:center;display:flex;align-items:center;gap:6px}
.dirty:not(:empty)::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--no)}

/* ---------- diálogos ---------- */
#dlg-host{position:relative;z-index:100}
.dlg-backdrop{position:fixed;inset:0;background:rgba(14,24,30,.5);backdrop-filter:blur(3px);display:grid;place-items:center;padding:20px;opacity:0;transition:opacity .16s}
.dlg-backdrop.in{opacity:1}
.dlg-backdrop.out{opacity:0}
.dlg{width:100%;max-width:440px;background:#fff;border-radius:18px;box-shadow:var(--e3);padding:30px 28px 22px;text-align:center;transform:translateY(10px) scale(.96);transition:transform .2s cubic-bezier(.2,.9,.3,1.2)}
.dlg-backdrop.in .dlg{transform:none}
.dlg h2{font-size:24px;line-height:1.2;margin:0 0 8px}
.dlg-text{color:var(--muted);margin:0 0 6px;font-size:15px}
.dlg-note{color:var(--muted);font-size:13px;margin:8px 0 0}
.dlg-actions{display:flex;gap:10px;justify-content:center;margin-top:22px;flex-wrap:wrap}
.dlg-actions .btn{min-width:130px}
.dlg-icon{width:78px;height:78px;margin:0 auto 14px;display:block;fill:none;stroke-width:4;stroke-linecap:round;stroke-linejoin:round}
.dlg-icon .ring{stroke-dasharray:240;stroke-dashoffset:240;animation:draw .5s ease-out forwards}
.dlg-icon .mark{stroke-dasharray:120;stroke-dashoffset:120;animation:draw .35s .35s ease-out forwards}
.dlg-icon .dot{stroke:none;opacity:0;animation:pop .2s .6s forwards}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes pop{to{opacity:1}}
.dlg-success .dlg-icon{stroke:var(--ok)} .dlg-success .dlg-icon .dot{fill:var(--ok)}
.dlg-error .dlg-icon,.dlg-danger .dlg-icon{stroke:var(--no)} .dlg-danger .dlg-icon .dot{fill:var(--no)}
.dlg-warning .dlg-icon{stroke:#C99400} .dlg-warning .dlg-icon .dot{fill:#C99400}
.dlg-question .dlg-icon,.dlg-info .dlg-icon,.dlg-key .dlg-icon{stroke:var(--pen)} .dlg-question .dlg-icon .dot,.dlg-info .dlg-icon .dot{fill:var(--pen)}
.dlg-success .dlg-icon .ring{fill:var(--ok-soft)}
.secret code{display:block;font:700 26px/1.3 Consolas,"Courier New",monospace;letter-spacing:2px;padding:14px;background:var(--signal-soft);border:1.5px dashed var(--signal);border-radius:var(--r);margin-top:12px;user-select:all;word-break:break-all}

/* ---------- toasts ---------- */
#toasts{position:fixed;right:20px;bottom:20px;z-index:120;display:flex;flex-direction:column;gap:10px;align-items:flex-end;pointer-events:none;max-width:calc(100vw - 32px)}
.toast{pointer-events:auto;position:relative;overflow:hidden;display:flex;align-items:center;gap:12px;min-width:280px;max-width:420px;background:var(--ink);color:#fff;border-radius:12px;padding:12px 12px 14px 14px;box-shadow:var(--e3);transform:translateX(24px);opacity:0;transition:transform .22s cubic-bezier(.2,.9,.3,1.1),opacity .2s}
.toast.in{transform:none;opacity:1}
.toast.out{transform:translateX(24px);opacity:0}
.t-ic{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;flex:none;background:var(--ok)}
.t-ic .ico{width:16px;height:16px;stroke-width:2.6}
.t-error .t-ic{background:var(--no)}
.t-warning .t-ic{background:#C99400}
.t-info .t-ic{background:var(--pen)}
.t-msg{flex:1;font-size:14px;line-height:1.4}
.t-x{border:0;background:none;color:#93A6B0;cursor:pointer;width:28px;height:28px;border-radius:6px;display:grid;place-items:center;flex:none}
.t-x:hover{background:#2B414D;color:#fff}
.t-x .ico{width:16px;height:16px}
.t-bar{position:absolute;left:0;bottom:0;height:3px;width:100%;background:var(--signal);transform-origin:left;animation:shrink linear forwards}
.t-error .t-bar{background:#F28B82}
@keyframes shrink{to{transform:scaleX(0)}}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .dlg-icon .ring,.dlg-icon .mark{stroke-dashoffset:0}
  .dlg-icon .dot{opacity:1}
}

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width:1280px){
  .vats-grid{grid-template-columns:minmax(0,1fr) 270px}
  .stepper .lbl{display:none}
  .stepper button.on .lbl{display:inline}
}
@media (max-width:1100px){
  :root{--appbar-h:60px}
  .side{transform:translateX(-100%);transition:transform .25s ease;box-shadow:var(--e3);width:min(300px,86vw)}
  .shell.side-open .side{transform:none}
  .shell.side-open .scrim{display:block;position:fixed;inset:0;background:rgba(14,24,30,.45);z-index:35}
  .side-close,.burger{display:grid}
  .side-close .ico{color:#fff}
  .main{margin-left:0}
  .appbar{padding:10px 18px}
  .appbar h1{font-size:21px}
  .view{padding:18px 18px 56px}
  .vats-grid{grid-template-columns:minmax(0,1fr)}
  .sheet{position:static;max-height:none;order:-1;padding:0;overflow:hidden}
  .sheet-toggle{display:flex;width:100%;align-items:center;gap:10px;border:0;background:none;padding:14px 18px;cursor:pointer;text-align:left}
  .sheet-toggle .st-txt{flex:1;min-width:0}
  .sheet-toggle b{display:block;font-size:14.5px}
  .sheet-toggle span{font-size:12.5px;color:var(--muted);display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .sheet-toggle .ico{transition:transform .2s;color:var(--muted)}
  .sheet.open .sheet-toggle .ico{transform:rotate(90deg)}
  .sheet-body{display:none;padding:0 18px 16px}
  .sheet.open .sheet-body{display:block}
  .view.mapa{grid-template-columns:minmax(0,1fr)}
  .m-list{position:static;max-height:none}
  .m-list.collapsed .m-browse{display:none}
  .m-current{display:flex;align-items:center;gap:10px;justify-content:space-between}
  .m-list:not(.collapsed) .m-current{display:none}
}
@media (max-width:760px){
  html,body{font-size:15px}
  .auth{grid-template-columns:1fr}
  .auth-brand{padding:22px 20px 26px;min-height:auto}
  .claim{font-size:26px;max-width:none;margin-bottom:8px}
  .claim-sub{font-size:13px}
  .auth-panel{align-items:start;padding:26px 20px 40px}
  .stage{padding:20px 16px;border-radius:var(--r)}
  .stage h1{font-size:25px}
  .view{padding:12px 12px calc(96px + var(--safe-b))}
  .appbar{padding:8px 10px 8px 6px;gap:8px}
  .appbar p{display:none}
  .appbar-actions .btn .lbl{display:none}
  .appbar-actions .btn{padding:8px 10px}
  .stepper{display:none}
  .step-mobile{display:block;margin:0 0 12px;padding:12px 14px;background:var(--panel);border:1px solid var(--line-2);border-radius:var(--r)}
  .step-mobile .sm-top{display:flex;justify-content:space-between;font-size:13px;color:var(--muted)}
  .step-mobile b{font-size:16px;color:var(--text);display:block;margin-top:2px}
  .step-mobile .sm-bar{height:5px;background:var(--line-2);border-radius:5px;margin-top:10px;overflow:hidden}
  .step-mobile .sm-bar i{display:block;height:100%;background:var(--pen);border-radius:5px;transition:width .3s}
  #view-vats .stage .nav{display:none}
  .mbar{display:flex;gap:10px;position:fixed;left:0;right:0;bottom:0;z-index:25;padding:10px 12px calc(10px + var(--safe-b));background:rgba(255,255,255,.96);backdrop-filter:blur(10px);border-top:1px solid var(--line)}
  .mbar .btn{flex:1;min-height:48px}
  .mbar .btn.ghost{flex:0 0 auto}
  .grid{grid-template-columns:1fr}
  .grid2,.grid4{grid-template-columns:1fr 1fr}
  .grid2{grid-template-columns:1fr}
  .field.wide{grid-column:auto}
  .acts{grid-template-columns:1fr}
  .rev{grid-template-columns:1fr}
  .rev-col header,.rev-item{grid-template-columns:1fr 54px 54px}
  .energy-grid{grid-template-columns:1fr 1fr}
  .en{grid-template-columns:minmax(0,1fr) 36px;padding:10px;min-height:70px}
  .en .num{grid-column:1;grid-row:1;font-size:13px}
  .en .nm{grid-column:1;grid-row:2;font-size:13.5px}
  .en .src{grid-column:1/-1;grid-row:3;margin-top:4px}
  .en .box{grid-column:2;grid-row:1/3;width:36px;height:30px;font-size:21px}
  .cond-row{grid-template-columns:1fr;gap:8px}
  .seg{width:100%}
  .seg button{flex:1}
  .q-head{grid-template-columns:24px 1fr}
  .q-head .seg{grid-column:1/-1;margin-left:0}
  .actions{margin-left:0}
  .pchips>span{min-width:100%}
  .task{padding:12px}
  .task small{display:none}
  .m-save{margin:20px -16px -20px;padding:12px 16px calc(12px + var(--safe-b))}
  .m-task-head{flex-wrap:wrap}
  .m-task-head input{flex-basis:100%;order:-1}
  .m-task-head .n{min-width:auto}
  /* tablas -> tarjetas */
  table.list.cards thead{display:none}
  table.list.cards,table.list.cards tbody,table.list.cards tr,table.list.cards td{display:block;width:100%}
  table.list.cards tr{border-bottom:1px solid var(--line);padding:10px 2px}
  table.list.cards td{border:0;padding:4px 10px;display:grid;grid-template-columns:110px 1fr;gap:10px;align-items:start}
  table.list.cards td::before{content:attr(data-l);color:var(--muted);font-size:12.5px;font-weight:600}
  table.list.cards td[data-l=""]{grid-template-columns:1fr}
  table.list.cards td[data-l=""]::before{display:none}
  table.list.cards tbody tr:hover td{background:none}
  td.det{max-width:none}
  .toolbar .search{max-width:none}
  #toasts{left:12px;right:12px;bottom:calc(76px + var(--safe-b));align-items:stretch}
  .toast{min-width:0;max-width:none}
  .dlg{padding:26px 20px 18px;border-radius:16px}
  .dlg-actions .btn{flex:1;min-width:0}
}
@media (max-width:380px){
  .energy-grid{grid-template-columns:1fr}
}
.who-card .avatar{color:var(--ink)}
table.list.perms th{white-space:normal;vertical-align:bottom}
@media (hover:none){.hover-only{display:none}}
