:root{
  --papel:#ffffff; --fondo:#f3f6f9; --tinta:#1b2733; --suave:#5b6b7b; --linea:#d5dde5;
  --fijo:#1d4e79;      /* estator, carcasa, control */
  --rotor:#b03a2e;     /* lo que gira */
  --rotor-bg:#fdf1ef;
  --dc:#a8650a;        /* excitación DC */
  --salida:#2e7d32;    /* potencia de salida y medida */
  --magnet:#7b3fa0;    /* acoplamiento magnético */
  --motor:#7a5c1e;
  --ok:#2e7d32; --alerta:#b7791f; --falla:#c0392b;
  --panel:#ffffff; --sombra:0 1px 2px rgba(20,40,60,.08);
  color-scheme: light;
}
html[data-tema="oscuro"]{
    --papel:#16202b; --fondo:#0f1720; --tinta:#e6edf3; --suave:#9fb0c0; --linea:#2c3a48;
    --fijo:#6fa8dc; --rotor:#ef8b7f; --rotor-bg:#2a1a1a; --dc:#e0a84a; --salida:#7cc47f;
    --magnet:#c39be0; --motor:#d1ab62; --ok:#7cc47f; --alerta:#e0a84a; --falla:#ef8b7f;
    --panel:#16202b; --sombra:none; color-scheme: dark;
  }

*{box-sizing:border-box}
body{margin:0;background:var(--fondo);color:var(--tinta);font-family:"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;line-height:1.5;font-size:15px}
.wrap{width:94%;max-width:1480px;margin:0 auto;padding:18px 0 40px}
.sim-head h1{font-size:1.65rem;margin:6px 0 2px;color:var(--fijo);letter-spacing:-.01em}
.sim-head p{margin:0 0 14px;color:var(--suave);max-width:75ch}
.tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px}
.tabs button{border:1px solid var(--linea);background:var(--panel);color:var(--tinta);padding:8px 12px;border-radius:8px;cursor:pointer;font:inherit;font-size:.9rem;display:flex;gap:7px;align-items:center}
.tabs button .n{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--fijo);color:#fff;font-size:.78rem;font-weight:700}
.tabs button[aria-selected="true"]{border-color:var(--fijo);box-shadow:inset 0 -3px 0 var(--fijo);font-weight:600}
.tabs button.hecho .n{background:var(--ok)}
.tabs button:focus-visible,button:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid var(--alerta);outline-offset:2px}
.stage{display:none}
.stage.on{display:block}
.grid{display:grid;grid-template-columns:330px 1fr;gap:14px;align-items:start}
.grid>*,.explica>*{min-width:0}
.grid.col1{grid-template-columns:1fr}
.info{min-height:0}
body.embed .mis,body.embed h3:has(+ .mis){display:none}
.card{background:var(--panel);border:1px solid var(--linea);border-radius:10px;padding:14px;box-shadow:var(--sombra)}
.card h2{font-size:1.1rem;margin:0 0 8px;color:var(--fijo)}
.card h3{font-size:.95rem;margin:12px 0 6px}
.ctrl{margin:10px 0}
.ctrl label{display:flex;justify-content:space-between;font-size:.88rem;color:var(--suave);margin-bottom:3px}
.ctrl label b{color:var(--tinta);font-variant-numeric:tabular-nums}
.ctrl input[type=range]{width:100%;accent-color:var(--fijo)}
select{width:100%;padding:7px;border-radius:7px;border:1px solid var(--linea);background:var(--papel);color:var(--tinta);font:inherit}
.btns{display:flex;flex-wrap:wrap;gap:6px}
.btn{border:1px solid var(--fijo);background:var(--papel);color:var(--fijo);padding:7px 11px;border-radius:7px;cursor:pointer;font:inherit;font-size:.87rem}
.btn:hover{background:var(--fijo);color:#fff}
.btn.pri{background:var(--fijo);color:#fff}
.btn.peligro{border-color:var(--falla);color:var(--falla)}
.btn.peligro:hover{background:var(--falla);color:#fff}
.btn:disabled{opacity:.4;cursor:not-allowed;background:var(--papel);color:var(--suave);border-color:var(--linea)}
.seg{display:flex;border:1px solid var(--linea);border-radius:8px;overflow:hidden}
.seg button{flex:1;border:0;background:var(--papel);color:var(--tinta);padding:7px 4px;cursor:pointer;font:inherit;font-size:.85rem}
.seg button[aria-pressed="true"]{background:var(--fijo);color:#fff}
.lect{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:8px;margin-top:10px}
.lect div{border:1px solid var(--linea);border-radius:8px;padding:6px 9px;background:var(--papel)}
.lect small{display:block;color:var(--suave);font-size:.76rem}
.lect b{font-size:1.15rem;font-variant-numeric:tabular-nums}
.estado{margin-top:10px;padding:9px 11px;border-radius:8px;border-left:4px solid var(--fijo);background:var(--fondo);font-size:.92rem}
.estado.ok{border-color:var(--ok)} .estado.alerta{border-color:var(--alerta)} .estado.falla{border-color:var(--falla)}
.vis svg{width:100%;height:auto;display:block}
.desliza{overflow-x:auto;-webkit-overflow-scrolling:touch}
@media (max-width:700px){.desliza svg{min-width:720px}.desliza::after{content:'Desliza el esquema hacia los lados';display:block;font-size:.75rem;color:var(--suave);text-align:right}}
canvas{width:100%;display:block;border-radius:8px}
.explica{margin-top:14px;display:grid;grid-template-columns:1fr 1fr;gap:14px}
.explica p{margin:.3em 0}
.mis{list-style:none;padding:0;margin:6px 0 0;font-size:.88rem}
.mis li{padding:3px 0 3px 24px;position:relative;color:var(--suave)}
.mis li::before{content:"";position:absolute;left:2px;top:7px;width:13px;height:13px;border:2px solid var(--linea);border-radius:50%}
.mis li.ok{color:var(--tinta)}
.mis li.ok::before{background:var(--ok);border-color:var(--ok)}
.info{min-height:150px}
.info .dom{display:inline-block;padding:1px 9px;border-radius:20px;color:#fff;font-size:.8rem;margin-bottom:4px}
table.t{border-collapse:collapse;width:100%;font-size:.86rem}
table.t td,table.t th{border-bottom:1px solid var(--linea);padding:4px 6px;text-align:left}
table.t th{color:var(--suave);font-weight:600}
.blk{cursor:pointer}
.blk rect{transition:stroke-width .15s}
.blk:hover rect,.blk:focus rect{stroke-width:4}
.blk.visto rect{fill-opacity:.18}
svg text{font-family:inherit}
.flow{stroke-dasharray:7 7}
.running .flow{animation:fl 0.9s linear infinite}
@keyframes fl{to{stroke-dashoffset:-14}}
@media (prefers-reduced-motion: reduce){.running .flow{animation:none}}
.panel-ctl{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.gauge{border:1px solid var(--linea);border-radius:8px;padding:6px 9px;background:var(--papel)}
.gauge small{color:var(--suave);font-size:.76rem;display:block}
.gauge b{font-variant-numeric:tabular-nums;font-size:1.1rem}
.bar{height:6px;background:var(--linea);border-radius:3px;margin-top:4px;overflow:hidden}
.bar i{display:block;height:100%;background:var(--fijo);width:0}
.seq{display:flex;flex-wrap:wrap;gap:4px;margin:10px 0}
.seq span{font-size:.78rem;padding:3px 8px;border-radius:12px;border:1px solid var(--linea);color:var(--suave)}
.seq span.act{background:var(--fijo);color:#fff;border-color:var(--fijo)}
.seq span.pas{color:var(--ok);border-color:var(--ok)}
.log{font-size:.82rem;max-height:220px;overflow:auto;border:1px solid var(--linea);border-radius:8px;padding:6px 8px;background:var(--papel);font-variant-numeric:tabular-nums}
.log div{padding:2px 0;border-bottom:1px dashed var(--linea)}
.log .sd{color:var(--falla);font-weight:600} .log .al{color:var(--alerta)} .log .tr{color:var(--falla)}
.lamp{display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--linea);margin-right:5px;vertical-align:middle}
.lamp.on{background:var(--ok)} .lamp.red{background:var(--falla)}
.quiz .op{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:10px}
.quiz .op button{padding:12px;border-radius:8px;border:1px solid var(--linea);background:var(--papel);color:var(--tinta);cursor:pointer;font:inherit;text-align:left}
.quiz .op button.bien{border-color:var(--ok);background:color-mix(in srgb,var(--ok) 15%,var(--papel))}
.quiz .op button.mal{border-color:var(--falla);background:color-mix(in srgb,var(--falla) 12%,var(--papel))}
.sintoma{font-size:1.15rem;font-weight:600;margin:8px 0;max-width:60ch}
.cta{display:inline-block;margin-top:10px;background:#1f8f4e;color:#fff;padding:9px 14px;border-radius:8px;text-decoration:none;font-weight:600}
.pie{margin-top:20px;color:var(--suave);font-size:.8rem}
body.embed .sim-head,body.embed .pie{display:none}
body.embed.una .tabs{display:none}
body.embed .wrap{padding-top:8px}
body.embed .explica{display:none}
@media (max-width:900px){
  .explica{grid-template-columns:1fr}
  .panel-ctl{grid-template-columns:repeat(2,1fr)}
  .sim-head h1{font-size:1.35rem}
  .tabs button{padding:6px 9px;font-size:.82rem}
  .tabs button .t{display:none}
  .tabs button[aria-selected="true"] .t{display:inline}
}
@media (max-width:760px){.grid{grid-template-columns:1fr}}
@media (min-width:761px) and (max-width:1000px){.grid:not(.col1){grid-template-columns:290px 1fr}}
@media print{.tabs{display:none}}


.tema{position:absolute;top:0;right:0;border:1px solid var(--linea);background:var(--panel);color:var(--tinta);border-radius:20px;padding:6px 12px;font:inherit;font-size:.85rem;cursor:pointer;display:flex;gap:6px;align-items:center}
.tema:hover{border-color:var(--fijo)}
.sim-head{position:relative;padding-right:130px}
@media (max-width:600px){.sim-head{padding-right:0}.tema{position:static;margin-bottom:8px}}
body.embed .tema{display:none}

#svg1,#svg4{max-width:640px;margin:0 auto}
.ctrl input[type=number]{width:100%;padding:7px;border-radius:7px;border:1px solid var(--linea);background:var(--papel);color:var(--tinta);font:inherit}
.quiz .op{grid-template-columns:repeat(2,1fr)}
@media (max-width:600px){.quiz .op{grid-template-columns:1fr}}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:10px;align-items:center;margin-bottom:10px}
@media (max-width:1100px){.duo{grid-template-columns:1fr}}
#svg1{max-width:none}

/* ===== Identidad JAC (misma paleta y tipografía del sitio) ===== */
:root{
  --papel:#ffffff; --panel:#ffffff; --tinta:#0B2B40; --suave:#4a5b66; --linea:#d7e2e8;
  --fondo:#EEF3F6; --rejilla:rgba(0,58,95,.055);
  --fijo:#003A5F; --teal:#0E6E7E; --naranja:#F6860A;
  --salida:#2E8B57; --dc:#B86A06; --alerta:#C98A12; --falla:#C0392B; --ok:#1F8A5B;
  --rotor:#B03A2E; --rotor-bg:#FDF1EF; --magnet:#7B3FA0; --motor:#7A5C1E;
  --sombra:0 1px 2px rgba(11,43,64,.06), 0 8px 24px rgba(11,43,64,.06);
}
html[data-tema="oscuro"]{
  --papel:#0F3550; --panel:#0E3048; --tinta:#E8F1F6; --suave:#A9C0CD; --linea:#24506B;
  --fondo:#0B2B40; --rejilla:rgba(255,255,255,.035);
  --fijo:#7CC3E8; --teal:#5FC4D2; --naranja:#F6A54A;
  --salida:#7FD18B; --dc:#F2B661; --alerta:#F6C25A; --falla:#FF8A7A; --ok:#7FD18B;
  --rotor:#FF9B8E; --rotor-bg:#2B2230; --magnet:#C9A3EC; --motor:#E2BF77;
  --sombra:0 8px 24px rgba(0,0,0,.25);
}
body{font-family:"IBM Plex Sans","Segoe UI",Roboto,Arial,sans-serif;
  background-color:var(--fondo);
  background-image:linear-gradient(var(--rejilla) 1px,transparent 1px),linear-gradient(90deg,var(--rejilla) 1px,transparent 1px);
  background-size:28px 28px}
.sim-head{background:linear-gradient(140deg,#0B2B40 0%,#003A5F 55%,#0E5E6F 100%);color:#fff;border-radius:18px;padding:22px 150px 22px 26px;margin-bottom:16px;box-shadow:0 10px 30px rgba(11,43,64,.18)}
.sim-head .eyebrow{font-family:"IBM Plex Mono",monospace;font-size:.78rem;letter-spacing:.1em;color:#F6A54A;text-transform:uppercase}
.sim-head h1{font-family:Oswald,"Segoe UI",sans-serif;font-weight:600;font-size:clamp(1.6rem,3vw,2.3rem);color:#fff;margin:4px 0 6px;letter-spacing:0}
.sim-head p{color:#d6e6ee;margin:0}
.tema{top:20px;right:20px;background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.35);color:#fff}
.tema:hover{border-color:#F6A54A}
.card{border-radius:14px}
.card h2{font-family:Oswald,"Segoe UI",sans-serif;font-weight:500;font-size:1.25rem;color:var(--tinta);letter-spacing:.01em}
.tabs button{border-radius:10px}
.tabs button .n{font-family:"IBM Plex Mono",monospace;background:var(--fijo)}
html[data-tema="oscuro"] .tabs button .n{color:#0B2B40}
.tabs button[aria-selected="true"]{border-color:var(--naranja);box-shadow:inset 0 -3px 0 var(--naranja)}
.tabs button.hecho .n{background:var(--ok)}
.btn{border-radius:9px;border-color:var(--teal);color:var(--teal)}
.btn:hover{background:var(--teal);color:#fff}
.btn.pri{background:var(--naranja);border-color:var(--naranja);color:#fff;font-weight:600}
.btn.pri:hover{filter:brightness(1.08);background:var(--naranja)}
html[data-tema="oscuro"] .btn.pri{color:#0B2B40}
.seg button[aria-pressed="true"]{background:var(--fijo);color:#fff}
html[data-tema="oscuro"] .seg button[aria-pressed="true"]{color:#0B2B40}
.ctrl input[type=range]{accent-color:var(--naranja)}
.lect div{border-radius:10px}
.lect small{font-family:"IBM Plex Mono",monospace;font-size:.74rem}
.lect b{font-family:"IBM Plex Mono",monospace;font-weight:500}
.estado{background:var(--papel);border:1px solid var(--linea);border-left-width:4px}
.mis li.ok::before{background:var(--ok);border-color:var(--ok)}
.pie{font-family:"IBM Plex Mono",monospace;font-size:.72rem}
canvas{border:1px solid var(--linea)}
@media (max-width:600px){.sim-head{padding:18px}.tema{position:static;margin-bottom:10px}}