/* STRATEGIA · Socratic Strategic Decision Lab — estilos (basados en el diseño inicial) */
:root{
  --ink:#0F3D2E;--ink2:#26362F;--mute:#4A5952;--mute2:#6F7D76;--line:#DDE4DF;--line2:#C9D3CC;
  --bg:#F4F6F4;--soft:#E8EEEA;--green:#1E7A4C;--gold:#F9B21D;--amber:#E0A21A;--white:#FFFFFF;
  --dark2:#164A39;--dark3:#245443;--darkline:#3A6B59;--pale:#A8C4B6;--pale2:#C5DACF;--err:#B3261E;
  --serif:'Source Serif 4',Georgia,serif;--sans:'Source Sans 3','Segoe UI',system-ui,sans-serif;--mono:'IBM Plex Mono',ui-monospace,monospace;--label:'Source Sans 3','Segoe UI',system-ui,sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0}
body{background:var(--bg);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased;font-size:16px;line-height:1.5}
a{color:var(--green)}a:hover{color:var(--ink)}
textarea,input,button,select{font-family:inherit;font-size:inherit;color:inherit}
button{cursor:pointer}
button:disabled{cursor:not-allowed;opacity:.45}
h1,h2,h3{font-weight:400;margin:0}
.serif{font-family:var(--serif)}
.mono{font-family:var(--mono);font-size:.92em}
.mono-label{font-family:var(--label);font-size:12.5px;font-weight:600;letter-spacing:.07em;text-transform:uppercase}
.mono-label b{color:var(--green);font-weight:500}
.dark .mono-label b{color:var(--gold)}
.muted{color:var(--mute)}
.small{font-size:14px}
.hidden{display:none !important}
.row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.spacer{flex:1}

/* ---------- cabecera ---------- */
html,body{overflow-x:hidden}
.top{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:20px;min-height:64px;padding:8px 28px;background:var(--ink);color:#fff;box-shadow:0 2px 0 rgba(0,0,0,.08)}
.brand{display:flex;align-items:center;gap:12px;cursor:pointer;flex:none}
.brand-name,.brand-lg{font-family:var(--serif);font-size:24px;font-weight:700;letter-spacing:.02em;line-height:1}
.brand-name b,.brand-lg b{color:var(--gold);font-weight:700}
.brand-sub{font-family:var(--label);font-size:10.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--pale);line-height:1.25;border-left:1px solid var(--darkline);padding-left:12px}
.nav{display:flex;gap:4px;flex:1;min-width:0;flex-wrap:wrap}
.nav button{background:none;border:none;border-radius:999px;padding:8px 14px;font-size:15px;font-weight:600;color:var(--pale2);white-space:nowrap}
.nav button:hover{background:rgba(255,255,255,.08);color:#fff}
.nav button.on{background:var(--gold);color:var(--ink)}
.menu-toggle{display:none;background:none;border:1px solid var(--darkline);color:#fff;border-radius:8px;padding:7px 12px;font-size:15px;font-weight:600}
.who{display:flex;align-items:center;gap:10px;flex:none}
.saved{display:flex;align-items:center;gap:8px;font-family:var(--label);font-size:13px;font-weight:600;color:var(--pale)}
.saved i{width:8px;height:8px;border-radius:50%;background:#8FD1AE;display:inline-block}
.saved.busy i{background:var(--gold)}
.saved.err i{background:#FF8A80}
.userchip{display:flex;align-items:center;gap:10px;padding:4px 14px 4px 4px;border:1px solid var(--darkline);border-radius:999px;background:rgba(255,255,255,.04);color:#fff;text-align:left;max-width:280px}
.userchip:hover{background:rgba(255,255,255,.1)}
.userchip .av{flex:none;width:34px;height:34px;border-radius:50%;background:var(--gold);color:var(--ink);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px}
.userchip .uc{display:flex;flex-direction:column;min-width:0;line-height:1.2}
.userchip .uc b{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.userchip .uc small{font-size:12px;color:var(--pale);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hbtn{display:inline-flex;align-items:center;gap:8px;padding:9px 16px;border-radius:999px;font-size:14px;font-weight:700;border:1px solid transparent}
.hbtn.help{background:transparent;border-color:var(--pale);color:#fff}
.hbtn.help span{width:20px;height:20px;border-radius:50%;background:var(--pale2);color:var(--ink);display:inline-flex;align-items:center;justify-content:center;font-size:13px;font-weight:700}
.hbtn.help:hover{background:rgba(255,255,255,.1)}
.hbtn.out{background:var(--gold);color:var(--ink)}
.hbtn.out:hover{filter:brightness(1.05)}
.subnav{position:sticky;top:64px;z-index:19;display:flex;align-items:center;gap:18px;flex-wrap:wrap;padding:8px 28px;background:#E3ECE6;border-bottom:1px solid var(--line2);font-size:14.5px}
.subnav nav{display:flex;gap:4px;flex:1}
.subnav nav button{border:none;background:none;padding:6px 12px;border-radius:999px;font-weight:600;color:var(--ink2)}
.subnav nav button.on{background:var(--ink);color:#fff}
.subnav .linkbtn{font-size:14px;color:var(--ink2);font-weight:600}
.pill{padding:7px 14px;border:1px solid var(--darkline);border-radius:999px;font-family:var(--sans);font-size:14px;font-weight:600;background:none;color:#fff}
@media (max-width:1180px){
  .brand-sub{display:none}
  .userchip .uc{display:none}.userchip{padding:4px}
}
@media (max-width:980px){
  .top{flex-wrap:wrap;gap:10px;padding:8px 16px}
  .menu-toggle{display:block;order:2}
  .who{order:3;margin-left:auto}
  .nav{order:4;flex-basis:100%;display:none;flex-direction:column;gap:2px;padding:6px 0 10px}
  .top.open .nav{display:flex}
  .nav button{text-align:left;border-radius:8px}
  .saved{display:none}
  .hbtn{padding:8px 12px}
  .subnav{top:56px;padding:8px 16px}
}
/* ayuda */
.help-drawer{width:min(520px,100%)}
.help-body details{border-bottom:1px solid var(--line);padding:4px 0}
.help-body summary{cursor:pointer;padding:12px 0;font-weight:700;font-size:16px;list-style:none;display:flex;justify-content:space-between}
.help-body summary::after{content:'+';color:var(--green);font-size:20px;line-height:1}
.help-body details[open] summary::after{content:'−'}
.help-body details p{margin:0 0 14px;font-size:15.5px;line-height:1.65;color:#1E2B25}
.help-body .impl{margin:14px 0 10px}
/* actualizaciones */
.upd-pend{display:flex;flex-direction:column;gap:12px;padding:16px 18px;background:#FFF8E6;border:1px solid var(--amber)}
.upd-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px 16px;font-size:14px;color:var(--ink2)}
.upd-grid b{color:var(--ink);margin-left:4px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:11px 18px;border-radius:2px;font-size:14px;font-weight:600;border:1px solid var(--ink);background:transparent;color:var(--ink);text-decoration:none;white-space:nowrap}
.btn.primary{background:var(--ink);color:#F4F6F4}
.btn.gold{background:var(--gold);border-color:var(--gold);color:var(--ink);border-radius:999px}
.btn.round{border-radius:999px}
.btn.sm{padding:7px 12px;font-size:13px}
.btn.ghost{border-color:var(--line2);color:var(--ink2);font-weight:500}
.btn.danger{border-color:var(--err);color:var(--err)}
.linkbtn{background:none;border:none;color:var(--mute2);padding:0;font-size:13px}
.linkbtn:hover{color:var(--err)}

/* ---------- formularios ---------- */
.field{display:flex;flex-direction:column;gap:6px;font-size:14px;font-weight:600;color:var(--ink)}
.field span.hint{font-weight:400;color:var(--mute);font-size:13.5px}
.inp,.field input,.field textarea,.field select{padding:11px 12px;border:1px solid var(--line2);background:#fff;font-size:15px;outline:none;border-radius:2px;width:100%}
.inp:focus,.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--green)}
textarea{resize:vertical;line-height:1.45}
.err{color:var(--err);font-size:14px}
.warn{padding:12px 16px;background:#FFF4D6;border:1px solid var(--amber);font-size:14px;line-height:1.5}
.note{padding:12px 16px;background:#fff;border:1px solid var(--line);font-size:14px;line-height:1.5}
.seg{display:flex;padding:4px;background:var(--soft);border-radius:999px}
.seg button{flex:1;border:none;padding:9px 12px;border-radius:999px;font-size:13px;font-weight:600;background:transparent;color:var(--ink)}
.seg button.on{background:var(--ink);color:#fff}
.seg-sq{display:flex;border:1px solid var(--ink);border-radius:2px;overflow:hidden;align-self:flex-start}
.seg-sq button{border:none;padding:6px 12px;font-size:12px;background:transparent}
.seg-sq button.on{background:var(--ink);color:#F4F6F4}

/* ---------- ingreso ---------- */
.login{min-height:calc(100vh - 54px);display:flex;flex-wrap:wrap;background:var(--ink);color:#fff}
.login-hero{flex:1.2 1 420px;display:flex;flex-direction:column;justify-content:center;gap:24px;padding:64px clamp(24px,6vw,96px)}
.chips{display:flex;gap:8px;flex-wrap:wrap}
.chips span{padding:7px 14px;border:1px solid var(--darkline);border-radius:999px;font-size:13px}
.login h1{font-family:var(--serif);font-weight:600;font-size:clamp(40px,4.8vw,68px);line-height:1.08;letter-spacing:-.01em;text-wrap:balance}
.login h1 em{font-style:normal;color:var(--gold)}
.login-hero p{margin:0;max-width:540px;font-size:17px;line-height:1.6;color:var(--pale2)}
.login-side{flex:1 1 380px;display:flex;align-items:center;justify-content:center;padding:48px 24px}
.login-card{width:100%;max-width:420px;display:flex;flex-direction:column;gap:18px;padding:32px;background:#fff;color:var(--ink);border-radius:20px;box-shadow:0 24px 60px rgba(0,0,0,.25)}
.login-card .t{font-family:var(--serif);font-weight:600;font-size:30px;line-height:1.1}
.login-card input{border-radius:12px;padding:13px 14px}
.login-card .code{font-family:var(--mono);text-transform:uppercase}

/* ---------- estructura ---------- */
.wrap{max-width:1360px;margin:0 auto;padding:40px 32px 90px;display:flex;flex-direction:column;gap:28px}
.wrap.narrow{max-width:1280px}
.h-xl{font-family:var(--serif);font-weight:600;font-size:clamp(34px,3.8vw,52px);line-height:1.1;letter-spacing:-.01em;text-wrap:balance}
.h-l{font-family:var(--serif);font-weight:600;font-size:clamp(28px,3.2vw,42px);line-height:1.15;letter-spacing:-.005em;text-wrap:balance}
.h-m{font-family:var(--serif);font-weight:600;font-size:28px;line-height:1.15}
.h-s{font-family:var(--serif);font-weight:600;font-size:22px;line-height:1.2}
.lead{margin:0;font-size:16px;line-height:1.6;color:var(--ink2);text-wrap:pretty;max-width:860px}
.card{background:#fff;border:1px solid var(--line);padding:22px}
.split{display:flex;flex-wrap:wrap;gap:28px;align-items:flex-start}
.grid-auto{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}

/* ---------- inscripción ---------- */
.reto{text-align:left;display:flex;flex-direction:column;gap:10px;padding:18px;background:#fff;border:1px solid var(--line);border-radius:2px;color:var(--ink)}
.reto.sel{box-shadow:0 0 0 2px var(--green)}
.reto.taken{background:#ECEFED;opacity:.6;cursor:not-allowed}
.reto .meta{display:flex;justify-content:space-between;gap:8px;width:100%;font-family:var(--label);font-weight:600;font-size:12.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--mute)}
.reto .meta b{color:var(--green);font-weight:500}
.reto .n{font-family:var(--serif);font-weight:600;font-size:24px;line-height:1.15}
.reto .d{font-size:15px;line-height:1.55;color:var(--ink2)}
.reto .lock{margin-top:auto;font-size:12px;font-weight:600;color:var(--green)}
.reto.taken .lock{color:var(--mute)}
.reto.own{background:transparent;border:1px dashed var(--green)}
.members{display:flex;flex-direction:column}
.members div{padding:9px 0;border-bottom:1px solid var(--line);font-size:14px;display:flex;justify-content:space-between;gap:10px}

/* ---------- ruta ---------- */
.progress{height:6px;background:#E1E7E3}.progress div{height:6px;background:var(--green)}
.route{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));border-top:1px solid var(--ink);border-left:1px solid var(--line)}
.stop{text-align:left;display:flex;flex-direction:column;gap:12px;min-height:250px;padding:22px;background:transparent;border:none;border-right:1px solid var(--line);border-bottom:1px solid var(--line);color:var(--ink)}
.stop.cur{background:#fff}
.stop.locked{opacity:.5;cursor:not-allowed}
.stop .num{font-family:var(--serif);font-weight:600;font-size:46px;line-height:.9;color:var(--green)}
.stop.locked .num{color:#B5C1B9}
.stop .code{font-family:var(--label);font-weight:600;font-size:13px;letter-spacing:.08em}
.stop .q{font-size:17px;font-weight:600;line-height:1.4}
.stop .cq{font-size:14.5px;line-height:1.5;color:var(--ink2)}
.stop .feeds{margin-top:auto;font-size:13.5px;color:var(--mute);line-height:1.45}
.chip{padding:4px 10px;font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;white-space:nowrap}
.chip.locked{background:transparent;color:var(--mute2);border:1px dashed #B5C1B9}
.chip.draft{background:#fff;color:var(--ink);border:1px solid var(--ink)}
.chip.review{background:var(--gold);color:var(--ink);border:1px solid var(--gold)}
.chip.closed{background:var(--green);color:#fff;border:1px solid var(--green)}
.chip.pend{background:#FFF4D6;color:var(--ink);border:1px solid var(--amber)}

/* ---------- estación ---------- */
.stepper{display:flex;gap:4px;flex-wrap:wrap}
.stepper button{flex:1 1 60px;display:flex;flex-direction:column;gap:6px;padding:0;background:none;border:none;text-align:left}
.stepper i{height:4px;width:100%;background:var(--line);display:block}
.stepper span{font-family:var(--label);font-weight:600;font-size:12.5px;color:var(--ink)}
.stepper .draft i,.stepper .review i{background:var(--ink)}
.stepper .closed i{background:var(--green)}
.stepper .on i{background:var(--green)}.stepper .on span{color:var(--green)}
.stepper .locked span{color:#A3B0A8}.stepper .locked{cursor:not-allowed}
.est-head{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;align-items:flex-end;padding-bottom:24px;border-bottom:1px solid var(--ink)}
.est-head .casoq{margin-top:4px;font-size:15px;line-height:1.5;color:var(--ink2);max-width:880px}
.feedback{display:flex;flex-direction:column;gap:10px;padding:16px 20px;background:#fff;border:1px solid var(--line);border-left:4px solid var(--gold)}
.feedback .it{display:flex;gap:14px;font-size:15.5px;line-height:1.55}
.feedback .it span:first-child{font-family:var(--label);font-weight:600;font-size:12.5px;color:var(--mute);white-space:nowrap;padding-top:2px}
.inputs div{display:flex;gap:12px;padding:10px 0;border-bottom:1px solid var(--line);font-size:15px;line-height:1.5}
.inputs div span:first-child{font-family:var(--label);font-weight:600;font-size:12.5px;color:var(--mute);min-width:84px;padding-top:2px}
.tool .n{font-family:var(--serif);font-weight:600;font-size:24px;line-height:1.2}
.tool p{margin:0;font-size:15.5px;line-height:1.6;color:var(--ink2)}
.cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px}
.col{display:flex;flex-direction:column;gap:8px;padding:14px;background:var(--soft);min-height:200px}
.col .lbl{font-size:14px;font-weight:700}
.cardx{display:flex;gap:8px;align-items:flex-start;padding:10px 12px;background:#fff;border:1px solid var(--line);box-shadow:0 1px 0 var(--line2);font-size:14px;line-height:1.45}
.cardx span{flex:1;white-space:pre-wrap;word-break:break-word}
.cardx button,.x{border:none;background:none;color:var(--mute2);font-size:16px;line-height:1;padding:0}
.newcard{margin-top:auto;padding:9px 10px;border:1px dashed #9AAAA0;background:transparent;font-size:14.5px;outline:none;width:100%}
.newcard:focus{border-color:var(--green);background:#fff}
.branches{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.branch{display:flex;flex-direction:column;gap:8px;padding:14px;background:#fff;border:1px solid var(--line)}
.branch.on{box-shadow:0 0 0 2px var(--green)}
.branch .bl{display:flex;justify-content:space-between;align-items:center;font-family:var(--label);font-weight:600;font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--green)}
.branch input,.branch textarea{padding:8px 10px;border:1px solid var(--line);background:#fff;font-size:15px;outline:none;width:100%}
.branch input{font-weight:600;font-size:14px}
.branch textarea.why{border-color:#F3D58A;background:#FFF8E6}
.addbranch{min-height:120px;border:1px dashed #9AAAA0;background:transparent;font-size:14px;color:var(--mute)}
.guide{flex:1 1 380px;min-width:0;position:sticky;top:76px;display:flex;flex-direction:column;gap:16px;padding:24px;background:var(--ink);color:#F4F6F4;align-self:flex-start}
.guide .quote{font-family:var(--serif);font-size:20px;line-height:1.4}
.guide .gbtn{padding:12px 16px;border:none;border-radius:2px;background:var(--gold);color:var(--ink);font-size:14px;font-weight:600}
.guide .gbtn.alt{background:transparent;border:1px solid var(--gold);color:var(--gold)}
.guide .warnai{font-size:14px;color:#FFD47A;line-height:1.45}
.guide .ai-tag{font-family:var(--label);font-weight:600;font-size:12.5px;padding:4px 8px;border:1px solid var(--darkline);color:var(--pale)}
.move{display:flex;flex-direction:column;gap:8px;padding:14px 0;border-top:1px solid var(--dark3)}
.move .mh{display:flex;justify-content:space-between;gap:8px;font-size:14px;font-weight:700}
.move .mk{font-family:var(--label);font-size:12.5px;color:var(--gold);font-weight:400}
.move .mk.ok{color:#8FD1AE}
.move .mq{font-family:var(--serif);font-size:17.5px;line-height:1.5}
.move .mq.ph{color:#7FA593}
.move textarea{padding:10px 12px;border:1px solid #2C5E4C;background:var(--dark2);color:#F4F6F4;font-size:15px;line-height:1.5;outline:none;border-radius:2px;width:100%}
.move textarea:focus{border-color:var(--gold)}
.move .rep{font-size:14.5px;line-height:1.5;padding:8px 10px;border-left:3px solid var(--gold);background:rgba(249,178,29,.08);color:#F6E3B4}
.decision-ta{padding:14px;border:1px solid var(--line2);background:#fff;font-family:var(--serif);font-size:20px;line-height:1.45;outline:none;border-radius:2px;width:100%}
.decision-ta:focus{border-color:var(--green)}
.assm{display:flex;gap:10px;padding:8px 0;border-bottom:1px solid var(--line);font-size:14px}
.assm b{font-family:var(--label);font-size:12.5px;color:var(--green);padding-top:2px;font-weight:400}
.assm span{flex:1}
.addline{padding:9px 10px;border:1px dashed #9AAAA0;background:transparent;font-size:14.5px;outline:none;width:100%}
.steps{display:flex;gap:4px}
.steps span{flex:1;padding:10px;text-align:center;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;background:#E1E7E3;color:var(--mute2)}
.steps .s0{background:var(--ink);color:#fff}.steps .s1{background:var(--amber);color:var(--ink)}.steps .s2{background:var(--green);color:#fff}
.checks div{display:flex;gap:10px;font-size:14.5px;align-items:baseline;color:var(--mute);padding:2px 0}
.checks div b{font-family:var(--mono);color:var(--green);font-weight:400}
.checks div.ok{color:var(--ink)}
input[type=range]{width:100%;accent-color:var(--green)}
.ro .newcard,.ro .addline,.ro .addbranch,.ro .cardx button,.ro .x,.ro .branch .linkbtn{display:none}

table.tbl.edit td{padding:6px 4px}
table.tbl.edit textarea,table.tbl.edit input,table.tbl.edit select{width:100%;padding:7px 8px;border:1px solid var(--line);background:#fff;font-size:14.5px;outline:none}
table.tbl.edit textarea:focus,table.tbl.edit input:focus,table.tbl.edit select:focus{border-color:var(--green)}
.impl{padding:12px 16px;background:#F3F8F5;border-left:4px solid var(--green);font-size:14px;line-height:1.55}
.taf .ref{padding-left:24px;text-indent:-24px;font-size:13px}
.slides-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px}
.slide{display:flex;flex-direction:column;gap:8px;padding:18px;background:#fff;border:1px solid var(--line);border-top:4px solid var(--ink);aspect-ratio:16/10;overflow:auto}
.slide .st{font-family:var(--serif);font-weight:600;font-size:18px;line-height:1.25}
.slide ul{margin:0;padding-left:18px;font-size:14px;line-height:1.45}
.crit{display:grid;grid-template-columns:minmax(220px,1.2fr) 160px minmax(220px,2fr);gap:12px;align-items:start;padding:12px 0;border-top:1px solid var(--line)}
.crit>div{display:flex;flex-direction:column;gap:4px}
@media (max-width:820px){.crit{grid-template-columns:1fr}}

/* ---------- caso ---------- */
.ficha{display:grid;grid-template-columns:180px 1fr;border-top:1px solid var(--ink)}
.ficha div{padding:14px 0;border-bottom:1px solid var(--line);font-size:16px;line-height:1.6;color:#1E2B25}
.ficha div:nth-child(odd){font-family:var(--label);font-weight:600;font-size:12.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--mute);padding-top:14px}
.ficha .pc{font-family:var(--serif);font-weight:600;font-size:19px;line-height:1.5;color:var(--ink)}
.case-body{max-width:72ch;font-family:var(--serif);font-size:18px;line-height:1.75;color:#1E2B25}
.case-body h2{font-family:var(--serif);font-weight:700;font-size:25px;line-height:1.3;margin:42px 0 12px;color:var(--ink)}
.case-body h2 span{color:var(--green);font-family:var(--label);font-weight:600;font-size:14px;vertical-align:middle;margin-right:6px}
.case-body h2.refs{border-top:1px solid var(--ink);padding-top:24px}
.case-body h3.callout{font-family:var(--label);font-weight:600;font-size:13px;letter-spacing:.1em;color:var(--ink);background:var(--gold);display:inline-block;padding:6px 10px;margin:18px 0 4px}
.case-body p{margin:0 0 18px}
.case-body p.q{font-family:var(--sans);font-weight:600;font-size:18px;line-height:1.55;padding:16px 20px;color:var(--ink);border-left:4px solid var(--gold);background:#fff}
.case-body ul{padding-left:20px}.case-body li{margin-bottom:8px}
table.tbl{width:100%;border-collapse:collapse;font-size:15px}
table.tbl th{text-align:left;font-family:var(--label);font-size:12.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--mute);font-weight:400;padding:10px 8px;border-bottom:1px solid var(--ink)}
table.tbl td{padding:10px 8px;border-bottom:1px solid var(--line);vertical-align:top;line-height:1.45}
.case-toc{position:sticky;top:76px;display:flex;flex-direction:column;gap:2px;max-height:calc(100vh - 100px);overflow:auto;font-size:14px;line-height:1.35}
.case-toc a{text-decoration:none;color:var(--ink2);padding:4px 0;border-bottom:1px solid var(--line)}

/* ---------- TAF ---------- */
.taf{flex:1 1 600px;min-width:0;max-width:860px;background:#fff;padding:64px clamp(24px,6vw,72px);border:1px solid var(--line);display:flex;flex-direction:column;gap:36px}
.taf header{display:flex;flex-direction:column;gap:12px;padding-bottom:28px;border-bottom:2px solid var(--ink)}
.taf h1{font-family:var(--serif);font-weight:600;font-size:38px;line-height:1.15}
.taf section{display:flex;flex-direction:column;gap:10px}
.taf .sh{display:flex;gap:14px;align-items:baseline}
.taf .sh span{font-family:var(--label);font-weight:600;font-size:13px;color:var(--green)}
.taf h2{font-family:var(--serif);font-weight:600;font-size:24px;line-height:1.25}
.taf .dec{margin:0;font-family:var(--serif);font-weight:600;font-size:18px;line-height:1.5}
.taf p{margin:0;font-size:16px;line-height:1.65}
.taf .pend{color:var(--mute2);font-style:italic}
.taf-side{flex:1 1 300px;position:sticky;top:76px;display:flex;flex-direction:column;gap:20px}
.taf-side .dark{display:flex;flex-direction:column;gap:12px;padding:24px;background:var(--ink);color:#F4F6F4}
.slides span{display:block;padding:9px 0;border-top:1px solid var(--line);font-size:13px}

/* ---------- panel docente ---------- */
.matrix{overflow-x:auto;border-top:1px solid var(--ink)}
.mrow{display:grid;grid-template-columns:minmax(220px,1.6fr) repeat(8,minmax(52px,1fr)) minmax(80px,.7fr);min-width:860px;align-items:center;border-bottom:1px solid var(--line)}
.mrow.head{border-bottom:none}
.mrow.head span{padding:12px 4px;text-align:center;font-family:var(--label);font-weight:600;font-size:12.5px;color:var(--mute)}
.mrow.head span:first-child{text-align:left;padding-left:8px}
.mrow .g{display:flex;flex-direction:column;gap:2px;padding:14px 8px}
.mrow .g b{font-size:16px}.mrow .g span{font-size:13px;color:var(--mute)}
.cell{margin:6px 4px;height:40px;display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:11px;font-weight:500}
.cell.locked{background:transparent;color:var(--mute2);border:1px dashed #B5C1B9}
.cell.draft{background:#fff;color:var(--ink);border:1px solid var(--ink)}
.cell.review{background:var(--gold);color:var(--ink);border:1px solid var(--gold)}
.cell.closed{background:var(--green);color:#fff;border:1px solid var(--green)}
.cell.sel{box-shadow:0 0 0 2px var(--ink),0 0 0 4px var(--gold)}
.cell .dot{width:5px;height:5px;border-radius:50%;background:var(--gold);margin-left:4px}
.mrow .v{padding:14px 8px;text-align:right;font-family:var(--mono);font-size:13px}
.legend{display:flex;gap:18px;flex-wrap:wrap;padding:14px 8px;font-size:13.5px;color:var(--mute)}
.sidecard{flex:1 1 340px;min-width:0;display:flex;flex-direction:column;gap:14px;padding:22px;background:#fff;border:1px solid var(--line)}
.com{display:flex;flex-direction:column;gap:3px;padding:10px 0;border-top:1px solid var(--line)}
.com span:first-child{font-family:var(--label);font-weight:600;font-size:12.5px;color:var(--mute)}
.com span:last-child{font-size:15px;line-height:1.55}
.bar{height:6px;background:#E1E7E3;flex:1}.bar div{height:6px;background:var(--green)}

/* ---------- administración ---------- */
.list{display:flex;flex-direction:column;border-top:1px solid var(--ink)}
.li{display:flex;gap:14px;align-items:center;flex-wrap:wrap;padding:14px 4px;border-bottom:1px solid var(--line)}
.li .main{flex:1;min-width:220px;display:flex;flex-direction:column;gap:3px}
.li .main b{font-size:16px}.li .main span{font-size:14px;color:var(--mute)}
.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.form-grid .full,.form-grid h2{grid-column:1/-1}
.form-grid h2{font-family:var(--serif);font-weight:600;font-size:21px;margin-top:8px}
.check{flex-direction:row !important;align-items:center;gap:10px !important;font-weight:500;font-size:14px}
.check input{width:auto !important}
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--ink)}
.tabs button{border:none;background:none;padding:10px 14px;font-size:14px;font-weight:500;color:var(--mute);border-bottom:3px solid transparent;margin-bottom:-1px}
.tabs button.on{color:var(--ink);border-color:var(--gold)}
.secret{font-family:var(--mono);background:var(--soft);padding:2px 6px}

/* ---------- capas ---------- */
.overlay{position:fixed;inset:0;background:rgba(15,61,46,.45);z-index:30}
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(460px,100%);z-index:31;background:var(--bg);border-left:1px solid var(--ink);display:flex;flex-direction:column}
.drawer .dh{display:flex;justify-content:space-between;align-items:center;padding:20px 24px;border-bottom:1px solid var(--line)}
.drawer .db{flex:1;overflow-y:auto;padding:12px 24px}
.ver{display:flex;gap:14px;padding:12px 0;border-bottom:1px solid var(--line)}
.ver b{font-family:var(--label);font-size:12.5px;color:var(--green);min-width:30px;padding-top:2px;font-weight:400}
.ver div{display:flex;flex-direction:column;gap:2px;flex:1}
.ver span:last-child{font-family:var(--label);font-weight:600;font-size:12.5px;color:var(--mute)}
.modal{position:fixed;z-index:32;left:50%;top:50%;transform:translate(-50%,-50%);width:min(680px,calc(100% - 24px));max-height:calc(100vh - 40px);overflow:auto;background:#fff;padding:28px;border:1px solid var(--ink);display:flex;flex-direction:column;gap:16px}
.toast{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);z-index:40;padding:12px 20px;background:var(--ink);color:#fff;border-radius:999px;font-size:14px;box-shadow:0 10px 30px rgba(0,0,0,.25);max-width:calc(100% - 24px)}
.toast.bad{background:var(--err)}
.loading{padding:80px 32px;text-align:center;font-family:var(--serif);font-size:24px;color:var(--mute)}

/* ---------- instalador ---------- */
body.install{background:var(--ink);min-height:100vh;display:flex;align-items:center;justify-content:center;padding:32px 16px}
.install-card{width:100%;max-width:760px;background:#fff;padding:36px;border-radius:20px;display:flex;flex-direction:column;gap:16px}
.install-card .brand-lg{color:var(--ink)}
.install-card h1{font-family:var(--serif);font-weight:600;font-size:34px}

@media (max-width:720px){
  .top{padding:12px 16px;gap:12px}
  .wrap{padding:24px 16px 80px}
  .ficha{grid-template-columns:1fr}
  .ficha div:nth-child(odd){padding-bottom:0;border-bottom:none}
  .guide{position:static}
}
@media print{
  .noprint,.top,.taf-side,.toast{display:none !important}
  body{background:#fff}
  .wrap{padding:0;max-width:none}
  .taf{border:none;padding:0;max-width:none;gap:14px;font-family:'Times New Roman',Times,serif}
  .taf p,.taf .dec,.taf td,.taf th,.taf .impl{font-family:'Times New Roman',Times,serif;font-size:12pt;line-height:1.15}
  .taf h1{font-size:20pt}.taf h2{font-size:14pt}
  .taf .pb{break-before:page}
  .slide{break-inside:avoid}
}

/* ---------- proceso de la docente ---------- */
.nav .stepn{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;margin-right:7px;border-radius:50%;background:rgba(255,255,255,.14);color:#fff;font-style:normal;font-size:12px;font-weight:700}
.nav button.on .stepn{background:var(--ink);color:var(--gold)}
.process{display:flex;align-items:stretch;gap:6px;flex-wrap:wrap}
.process .arrow{align-self:center;color:var(--mute2);font-size:18px}
.process button{flex:1 1 160px;display:flex;align-items:center;gap:10px;padding:10px 12px;background:#fff;border:1px solid var(--line);border-radius:10px;text-align:left;color:var(--ink)}
.process button:hover{border-color:var(--green)}
.process button i{flex:none;width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-style:normal;font-weight:700;background:var(--soft);color:var(--ink)}
.process button.ok i{background:var(--green);color:#fff}
.process button.on{border-color:var(--ink);box-shadow:inset 0 -3px 0 var(--gold)}
.process button.on i{background:var(--gold);color:var(--ink)}
.process button span{display:flex;flex-direction:column;line-height:1.25;min-width:0}
.process button b{font-size:15px}
.process button small{font-size:12.5px;color:var(--mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.course-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:14px}
.course-card{display:flex;flex-direction:column;gap:12px;padding:20px;background:#fff;border:1px solid var(--line);border-radius:10px}
.course-card.sel{border-color:var(--ink);box-shadow:inset 4px 0 0 var(--gold)}
.li.off .main{opacity:.6}
.field.assign{min-width:240px;font-size:13px}
.field.assign select{padding:8px 10px;font-size:14.5px}
@media (max-width:1500px){.brand-sub{display:none}}
@media (max-width:1320px){.nav button{padding:8px 10px;font-size:14.5px}.userchip .uc{display:none}.userchip{padding:4px}}
@media (max-width:820px){.process .arrow{display:none}.process button{flex-basis:100%}}
