/* Struct Flow Tools — Muro en voladizo */
:root{
  --tinta:#0D1B2A; --tinta2:#2C4257; --gris:#5F7488; --gris2:#8FA2B4;
  --marino:#102D4C; --marino2:#0A1E34; --marino3:#1B4573;
  --oro:#D69B2C; --oro2:#B37F17; --oro-cla:#FDF5E6;
  --azul:#1B62B8; --azul2:#134B92; --azul-cla:#ECF3FB; --azul-b:#C6DCF4;
  --blanco:#fff; --fondo:#EEF2F6; --borde:#DDE5EC; --borde2:#F0F4F8;
  --ok:#0D7A57; --ok-cla:#E4F4EE; --ok-b:#B6E0D0;
  --mal:#B33A1B; --mal-cla:#FCEDE8; --mal-b:#F0C9BB;
  --ft:"Poppins",-apple-system,Segoe UI,sans-serif;
  --fx:"Inter",-apple-system,Segoe UI,sans-serif;
  --fn:"IBM Plex Mono",ui-monospace,Menlo,monospace;
  --r:12px; --rs:8px;
  --sb:0 1px 2px rgba(13,27,42,.04),0 4px 14px rgba(13,27,42,.06);
  --sb2:0 8px 30px rgba(13,27,42,.14);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--fondo);color:var(--tinta);font:400 15.5px/1.6 var(--fx);-webkit-font-smoothing:antialiased}
svg{display:block;max-width:100%}
h1,h2,h3,h4{font-family:var(--ft);letter-spacing:-.02em;margin:0;font-weight:600}
a{color:var(--azul);text-decoration:none}
:focus-visible{outline:2px solid var(--azul);outline-offset:2px}
.env{max-width:1400px;margin:0 auto;padding:0 22px}

/* ---- barra superior ---- */
.top{background:var(--marino2);border-bottom:2px solid var(--oro)}
.top .env{display:flex;align-items:center;gap:14px;min-height:58px;flex-wrap:wrap}
.top .mk{display:flex;align-items:center;gap:10px;color:#fff}
.top .mk i{width:32px;height:32px;border-radius:8px;background:var(--oro);color:var(--marino2);display:grid;place-items:center;flex:0 0 auto}
.top .mk b{font:700 15.5px var(--ft);letter-spacing:-.02em}
.top nav{margin-left:auto;display:flex;gap:2px;font:500 14px var(--ft)}
.top nav a{color:#9FB6CC;padding:7px 12px;border-radius:6px}
.top nav a:hover{background:rgba(255,255,255,.07);color:#fff}

/* ---- encabezado ---- */
.hero{background:linear-gradient(155deg,var(--marino2) 0%,var(--marino) 55%,var(--marino3) 100%);color:#fff;padding:26px 0 30px}
.hero .fl{display:flex;gap:18px;align-items:flex-start}
.hero .ic{width:56px;height:56px;border-radius:14px;background:rgba(214,155,44,.16);border:1px solid rgba(214,155,44,.4);color:var(--oro);display:grid;place-items:center;flex:0 0 auto}
.hero h1{font-size:clamp(23px,3.2vw,31px);font-weight:700;color:#fff;line-height:1.14}
.hero p{margin:7px 0 0;color:#A8C1D8;font-size:15px;max-width:72ch}
.tg{display:inline-flex;align-items:center;gap:7px;font:600 10.5px var(--fn);letter-spacing:.11em;text-transform:uppercase;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);border-radius:999px;padding:4px 12px;color:#DCEAF6;margin-bottom:9px}

/* ---- rejilla ---- */
.wrap{display:grid;grid-template-columns:1fr;gap:22px;padding:24px 0 46px}
@media(min-width:1100px){.wrap{grid-template-columns:minmax(0,420px) minmax(0,1fr);align-items:start}
  .cIn{position:sticky;top:16px;max-height:calc(100vh - 32px);overflow-y:auto;padding-right:4px}
  .cIn::-webkit-scrollbar{width:7px}.cIn::-webkit-scrollbar-thumb{background:#C6D2DE;border-radius:4px}}

/* ---- tarjetas ---- */
.cd{background:var(--blanco);border:1px solid var(--borde);border-radius:var(--r);box-shadow:var(--sb);margin-bottom:14px;overflow:hidden}
.cd>h2{display:flex;align-items:center;gap:11px;padding:13px 17px;font-size:14.5px;border-bottom:1px solid var(--borde2);background:#FAFCFE;cursor:pointer;user-select:none}
.cd>h2 .num{width:23px;height:23px;border-radius:6px;background:var(--marino);color:#fff;font:600 11.5px var(--fn);display:grid;place-items:center;flex:0 0 auto}
.cd>h2 .ch{margin-left:auto;width:8px;height:8px;border-right:2px solid var(--gris2);border-bottom:2px solid var(--gris2);transform:rotate(45deg);transition:transform .2s}
.cd.cerrada>h2 .ch{transform:rotate(-45deg)}
.cd.cerrada .bd{display:none}
.bd{padding:17px}

/* ---- formulario ---- */
.g2{display:grid;grid-template-columns:1fr 1fr;gap:11px}
.g3{display:grid;grid-template-columns:repeat(3,1fr);gap:11px}
@media(max-width:600px){.g2,.g3{grid-template-columns:1fr}}
.f{margin-bottom:12px}.f:last-child{margin-bottom:0}
label{display:block;font:500 12.8px var(--ft);margin-bottom:5px;color:var(--tinta)}
label em{font-style:normal;font-family:var(--fn);color:var(--azul);font-weight:600}
.ent{display:flex}
input[type=text],input[type=number],select{width:100%;font:500 14.5px var(--fn);color:var(--tinta);background:#F8FAFC;border:1px solid #C9D6E2;border-radius:var(--rs);padding:9px 11px}
select{font-family:var(--fx);font-weight:400}
input[type=file]{font:400 12.5px var(--fx);width:100%}
input:focus,select:focus{outline:none;background:#fff;border-color:var(--azul);box-shadow:0 0 0 3px var(--azul-cla)}
input[type=number]{-moz-appearance:textfield}
input[type=number]::-webkit-outer-spin-button,input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.ent input{border-radius:var(--rs) 0 0 var(--rs)}
.ent .u{flex:0 0 auto;display:grid;place-items:center;padding:0 11px;font:500 12px var(--fn);color:var(--gris);background:#EBF1F6;border:1px solid #C9D6E2;border-left:0;border-radius:0 var(--rs) var(--rs) 0}
.ay{display:block;font-size:11.8px;color:var(--gris);margin-top:4px;line-height:1.42}
.sg{font:500 11px var(--fn);color:var(--azul);cursor:pointer;background:var(--azul-cla);border:1px solid var(--azul-b);border-radius:5px;padding:2px 7px;margin-left:5px}
.sg:hover{background:#DDEAF8}
.ck{display:flex;gap:9px;font-size:13.5px;margin-bottom:9px;cursor:pointer;align-items:flex-start;line-height:1.45}
.ck input{margin:3px 0 0;width:16px;height:16px;flex:0 0 auto;accent-color:var(--azul)}
.sw{display:flex;gap:5px;flex-wrap:wrap}
.sw label{flex:1 1 auto;min-width:88px;margin:0;position:relative}
.sw input{position:absolute;opacity:0;width:0;height:0}
.sw span{display:block;text-align:center;cursor:pointer;font:500 13px var(--ft);border:1px solid #C9D6E2;border-radius:var(--rs);background:#F8FAFC;padding:8px 6px;color:var(--tinta2)}
.sw input:checked+span{background:var(--azul);border-color:var(--azul);color:#fff}

.bt{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:600 14px var(--ft);border:1px solid var(--azul);border-radius:var(--rs);background:var(--azul);color:#fff;padding:11px 17px;cursor:pointer;transition:.14s}
.bt:hover{background:var(--azul2);border-color:var(--azul2)}
.bt.oro{background:var(--oro);border-color:var(--oro);color:#2A1D02}
.bt.oro:hover{background:var(--oro2);border-color:var(--oro2)}
.bt.gh{background:#fff;color:var(--tinta2);border-color:#C9D6E2}
.bt.gh:hover{background:#F3F7FA}
.bt.blk{width:100%}
.ac{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}

/* ---- veredicto ---- */
.vd{border-radius:var(--r);padding:17px 19px;margin-bottom:16px;display:flex;gap:14px;align-items:flex-start}
.vd .em{width:38px;height:38px;border-radius:10px;display:grid;place-items:center;flex:0 0 auto}
.vd.ok{background:var(--ok-cla);border:1px solid var(--ok-b)}
.vd.ok .em{background:var(--ok);color:#fff}
.vd.mal{background:var(--mal-cla);border:1px solid var(--mal-b)}
.vd.mal .em{background:var(--mal);color:#fff}
.vd h3{font-size:16.5px;margin-bottom:3px}
.vd.ok h3{color:var(--ok)}.vd.mal h3{color:var(--mal)}
.vd p{margin:0;font-size:13.8px;color:var(--tinta2)}
.vd ul{margin:7px 0 0;padding-left:17px;font-size:13.4px;color:var(--tinta2)}
.vd li{margin-bottom:4px}

/* ---- indicadores ---- */
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:11px;margin-bottom:16px}
.kpi{background:#fff;border:1px solid var(--borde);border-radius:var(--rs);padding:13px 14px;position:relative;overflow:hidden}
.kpi::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px}
.kpi.ok::before{background:var(--ok)}.kpi.mal::before{background:var(--mal)}
.kpi .n{font:600 11px var(--ft);letter-spacing:.06em;text-transform:uppercase;color:var(--gris);margin-bottom:3px}
.kpi .v{font:700 23px var(--fn);letter-spacing:-.025em;font-variant-numeric:tabular-nums;line-height:1.1}
.kpi.ok .v{color:var(--ok)}.kpi.mal .v{color:var(--mal)}
.kpi .m{font-size:11.5px;color:var(--gris);margin-top:3px}

/* ---- pestañas ---- */
.tabs{display:flex;gap:3px;background:#E3EAF1;padding:4px;border-radius:10px;margin-bottom:16px;overflow-x:auto}
.tabs button{flex:1 1 auto;white-space:nowrap;font:600 13.5px var(--ft);border:0;background:transparent;color:var(--tinta2);padding:9px 14px;border-radius:7px;cursor:pointer}
.tabs button.on{background:#fff;color:var(--marino);box-shadow:0 1px 3px rgba(13,27,42,.12)}
.pane{display:none}.pane.on{display:block}

table{border-collapse:collapse;width:100%;font-size:13.4px}
th,td{text-align:left;padding:8px 11px;border-bottom:1px solid var(--borde2)}
th{font:600 11px var(--ft);letter-spacing:.055em;text-transform:uppercase;color:var(--tinta2);background:#F5F9FC}
td.n,th.n{text-align:right;font-family:var(--fn);font-variant-numeric:tabular-nums}
tbody tr:last-child td{border-bottom:0}
tr.tt td{font-weight:700;background:#F5F9FC;border-top:1px solid var(--borde)}
.tw{overflow-x:auto;border:1px solid var(--borde);border-radius:var(--rs);margin-bottom:14px}
.eq{font:500 12.8px var(--fn);background:#F6F9FC;border-left:3px solid var(--oro);border-radius:0 6px 6px 0;padding:9px 12px;margin:0 0 10px;overflow-x:auto;color:var(--tinta2)}
.eq b{color:var(--marino)}
.dib{background:#fff;border:1px solid var(--borde);border-radius:var(--rs);padding:8px;margin-bottom:14px}
.dib figcaption{font-size:12px;color:var(--gris);padding:6px 8px 3px;border-top:1px solid var(--borde2);margin-top:6px}
.nota{font-size:12.2px;color:var(--gris);line-height:1.55}

/* ---- vista previa de memoria ---- */
.ovl{position:fixed;inset:0;background:rgba(9,20,32,.72);z-index:200;display:none;flex-direction:column}
.ovl.on{display:flex}
.ovl .bar{background:var(--marino2);color:#fff;padding:11px 18px;display:flex;align-items:center;gap:12px;flex-wrap:wrap;flex:0 0 auto}
.ovl .bar b{font:600 14.5px var(--ft)}
.ovl .bar .sp{margin-left:auto;display:flex;gap:8px;flex-wrap:wrap}
.ovl .sc{flex:1;overflow-y:auto;padding:22px 14px 50px}
.hoja{width:210mm;max-width:100%;margin:0 auto 18px;background:#fff;box-shadow:var(--sb2);padding:17mm 15mm;font-size:10.6pt;line-height:1.58;color:#12212F}
.bloq{position:relative}
.bloq::after{content:"Vista previa — suscríbete para descargar";position:absolute;inset:0;display:grid;place-items:center;background:rgba(255,255,255,.72);font:600 15px var(--ft);color:var(--marino);backdrop-filter:blur(3px)}

@media(max-width:700px){
  .hero{padding:20px 0 24px}.bd{padding:14px}
  .hoja{padding:12mm 8mm}
  .top nav{width:100%;overflow-x:auto;padding-bottom:6px}
}
@media print{
  body>*:not(.ovl){display:none!important}
  .ovl{position:static;background:#fff;display:block!important}
  .ovl .bar{display:none!important}
  .ovl .sc{overflow:visible;padding:0}
  .hoja{box-shadow:none;margin:0;width:auto;padding:0;page-break-after:always}
  .bloq::after{display:none}
}

/* ============ Notación matemática ============ */
.mat{font-family:"Cambria Math","Latin Modern Math","STIX Two Math",Georgia,"Times New Roman",serif}
.ec{display:grid;grid-template-columns:max-content 1.6em 1fr;align-items:center;
    row-gap:.34em;column-gap:.1em;margin:0 0 3.5mm;padding:8px 12px;
    background:#F6F9FC;border-left:3px solid #D69B2C;border-radius:0 6px 6px 0;
    font-family:"Cambria Math","Latin Modern Math",Georgia,"Times New Roman",serif;
    font-size:11.2pt;line-height:1.45;color:#22364B;overflow-x:auto}
.ec>.lh{text-align:right;white-space:nowrap}
.ec>.ig{text-align:center;color:#5F7488}
.ec>.rh{text-align:left}
.ec .fin{font-weight:700;color:#102D4C}
.ec var{font-style:italic;font-family:inherit}
.ec sub{font-size:.7em;vertical-align:-.28em;font-style:normal}
.ec sup{font-size:.68em;vertical-align:.42em;font-style:normal}
.frac{display:inline-flex;flex-direction:column;vertical-align:-.52em;text-align:center;margin:0 .3em}
.frac>span:first-child{border-bottom:1.1px solid currentColor;padding:0 .4em .12em}
.frac>span:last-child{padding:.12em .4em 0}
.rad{display:inline-flex;align-items:stretch;margin:0 .1em}
.rad>i{font-style:normal;font-size:1.28em;line-height:.95;transform:translateY(-.02em)}
.rad>span{border-top:1.1px solid currentColor;padding:.14em .2em 0;margin-left:-.14em}
.par{display:inline-block;transform:scaleY(1.35);margin:0 .06em;font-weight:300}
.uni{font-family:Inter,sans-serif;font-size:.82em;color:#5F7488;font-style:normal;margin-left:.35em}
.nota-ec{font-family:Inter,sans-serif;font-size:8.8pt;color:#5F7488;margin:-2mm 0 3.5mm;padding-left:12px}