/* Taller de ingeniería: controles compactos y escena protagonista. */
[hidden]{display:none!important}   /* igual que el envoltorio del artifact */
.riel{padding:13px 20px;box-shadow:0 3px 18px #14253112;z-index:2}
.marca b{letter-spacing:.10em}.marca span{display:none}
.banco{padding:12px 16px;gap:9px;box-shadow:0 -4px 24px #1425310c;z-index:2}
.chip{border-radius:9px;min-width:100px;position:relative;overflow:hidden}
.chip .sw{height:8px;box-shadow:inset 0 1px 1px #ffffff80,0 2px 2px #0003}
.acc{border-radius:8px;padding:0 10px;min-height:40px}.probar{min-width:142px}
.mision{border-radius:10px;padding:11px 14px;box-shadow:0 4px 20px #13263412}
.hud.tl{max-width:min(370px,43%)}
.cargaPanel{position:absolute;top:14px;right:14px;width:264px;padding:15px 17px;border:1px solid var(--line2);border-radius:12px;background:color-mix(in srgb,var(--panel) 95%,transparent);box-shadow:0 8px 28px #1023331c;backdrop-filter:blur(12px)}
.cargaCab{display:flex;flex-direction:column;gap:5px}.cargaCab span{font:9px 'IBM Plex Mono',monospace;letter-spacing:.13em;color:var(--ink3)}.cargaCab b{font-size:15px}
.cargaPeso{display:flex;flex-direction:column;gap:3px;margin:10px 0 15px}.cargaPeso strong{font:600 29px 'IBM Plex Mono',monospace;letter-spacing:-.06em}.cargaPeso span{font-size:10px;color:var(--ink2)}
.cargaPanel label{display:flex;justify-content:space-between;font-size:11px;color:var(--ink2)}.cargaPanel output{font-family:'IBM Plex Mono',monospace;color:var(--ink)}
.cargaPanel input{display:block;width:100%;accent-color:var(--acc);margin:12px 0 5px;cursor:pointer}.cargaPanel input:disabled{cursor:default;opacity:.5}
.cargaEscala{display:flex;justify-content:space-between;align-items:center;font:10px 'IBM Plex Mono',monospace;color:var(--ink3)}.cargaEscala button{color:var(--acc);padding:5px}
.cargaPanel p{font:9px/1.5 'IBM Plex Mono',monospace;color:var(--ink3);border-top:1px solid var(--line);padding-top:10px;margin:8px 0 0}
.mesa.probando .cargaPanel{display:none}.panelAn{border-radius:10px;padding:14px;box-shadow:0 8px 24px #1023331c}
.acta{width:min(490px,100%);border-radius:14px}.acta .pie{flex-wrap:wrap}.acta .pie .acc{min-width:120px}
.pista{border-radius:10px;max-width:min(760px,75%);line-height:1.5}.zoom button{border-radius:9px}
@media(max-width:1120px){.banco{flex-wrap:wrap}.banco>.espaciador{display:none}#grpSim{margin-left:auto}.chip{min-width:88px}.marca{display:none}}
@media(max-width:720px){.riel{padding:8px 10px}.cargaPanel{width:190px;padding:10px;top:10px;right:10px}.cargaPeso{margin:6px 0}.cargaPeso strong{font-size:22px}.cargaPeso span{font-size:9px}.cargaPanel p{font-size:8px}.cargaCab b{font-size:12px}.hud.tl{max-width:calc(100% - 220px);left:10px;top:10px}.mision .t{font-size:8px}.mision .d{font-size:10px}.mision{padding:8px}.banco{padding:8px}.pista{max-width:calc(100% - 80px);left:10px;transform:none;bottom:10px;font-size:10px}#grpSim{margin:0}.probar{min-width:125px}.acc{padding:0 9px;font-size:11px}}
@media(max-width:440px){.hud.tl{max-width:calc(100% - 195px)}.cargaPanel{width:175px}.mision .d{display:none}.banco .chip{min-width:80px}.app{min-height:620px}.cargaPeso span{font-size:8px}}
@media(max-width:600px){
  .riel{gap:6px}.riel>.espaciador,.presu .barra{display:none}
  .nivelnav{gap:4px;min-width:0;flex:1 1 auto}.nivelnom{min-width:0;max-width:110px}
  .nivelnom .n{font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .flecha{width:22px;height:26px;flex:0 0 22px}.presu{gap:0;margin-left:auto}
  .presu .cifra .vl{font-size:11px;white-space:nowrap}.presu .cifra .vl .exc{font-size:10px}
  .presu .cifra .et{font-size:7px}.temaBtn{flex:0 0 26px;width:26px}
}
/* iPhone: tablero despejado, controles táctiles y zonas seguras. */
.movilBarra{display:none}
@media(max-width:960px){
  html,body{height:100%;overflow:hidden}
  .app{height:100vh;height:100dvh;min-height:0;padding-top:env(safe-area-inset-top);padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}
  button{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
  .riel{padding:3px 6px;gap:4px;min-height:50px}
  .riel .marca,.riel>.espaciador,.presu .barra{display:none}
  .nivelnav{gap:0;flex:1;min-width:0}.nivelnom{max-width:none;min-width:0;padding:6px 4px;margin:0}
  .nivelnom .k{display:none}.nivelnom .n{font-size:12px;max-width:150px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .flecha{width:44px;height:44px;flex:0 0 44px;border:0;font-size:23px}
  .temaBtn{width:44px;height:44px;flex:0 0 44px;border:0;font-size:20px}
  .presu{margin-left:auto;gap:0}.presu .cifra .vl{font-size:11px;white-space:nowrap}.presu .cifra .et{font-size:8px}
  .presu .cifra .vl .exc{font-size:9px}
  .movilBarra{display:flex;position:absolute;top:8px;left:8px;right:8px;gap:6px;z-index:4;pointer-events:none}
  .movilBarra button{pointer-events:auto;min-height:44px;padding:8px 12px;border:1px solid var(--line2);border-radius:12px;background:var(--panel);box-shadow:0 3px 14px #0002;font-size:12px;font-weight:600}
  .movilBarra button[aria-expanded=true]{border-color:var(--acc);color:var(--acc)}
  #bCargaMovil{margin-left:auto}#bAnalisisMovil{display:none}
  .mesa .hud.tl,.mesa .cargaPanel{display:none}
  .mesa.objetivoAbierto .hud.tl{display:block;top:60px;left:8px;right:8px;width:auto;max-width:none;z-index:4;max-height:calc(100% - 72px);overflow:auto;pointer-events:auto}
  .mision{padding:14px;background:var(--panel);border-radius:12px}.mision .t{font-size:10px;line-height:1.6}.mision .d{display:block;font-size:13px;line-height:1.6}
  .mesa.cargaAbierta .cargaPanel{display:block;top:60px;right:8px;left:8px;width:auto;z-index:4;max-height:calc(100% - 72px);overflow:auto;padding:16px;background:var(--panel)}
  .cargaCab b{font-size:15px}.cargaCab span{font-size:10px}.cargaPeso{margin:10px 0}.cargaPeso strong{font-size:28px}.cargaPeso span{font-size:12px}
  .cargaPanel label{font-size:13px}.cargaPanel input{height:44px;margin:0}.cargaEscala{font-size:11px}.cargaEscala button{min-height:44px;min-width:80px}.cargaPanel p{font-size:10px}
  .pista{display:none}
  .zoom{right:8px;bottom:8px;gap:6px}.zoom button{width:44px;height:44px;font-size:20px;background:var(--panel)}
  .banco{padding:6px 8px max(6px,env(safe-area-inset-bottom));gap:5px;display:grid;grid-template-columns:1fr;flex:0 0 auto}
  .banco>.espaciador{display:none}.banco .grupo{margin:0!important;padding:0!important;border:0;min-width:0;overflow:visible!important;display:grid;gap:5px;grid-template-columns:repeat(4,minmax(0,1fr))}
  .banco .chip{min-width:0;min-height:48px;padding:6px;gap:3px;border-radius:10px}.chip .nm{font-size:11px}.chip .cab{gap:4px}.chip .sw{width:11px;height:6px}.chip .tc{font-size:8px;line-height:1.25;max-height:10px;overflow:hidden;white-space:nowrap}.chip kbd,.acc kbd{display:none}
  .banco .acc{min-height:44px;min-width:0;padding:4px;font-size:11px;border-radius:10px;white-space:normal}
  #grpSim{grid-template-columns:1fr 1fr 1fr 1.65fr}
  .enEnsayo #mats,.enEnsayo #grpEd{display:none}
  .mesa.probando #bObjetivoMovil,.mesa.probando #bCargaMovil{display:none}
  .mesa.probando #bAnalisisMovil{display:block;margin-left:auto}
  .mesa.probando .hud.tr{top:8px;left:8px;right:100px;z-index:3}
  .mesa.probando .panelAn.on{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;min-width:0;padding:8px 10px;background:var(--panel);border-radius:12px}
  .mesa.probando .panelAn>*{display:none}
  .mesa.probando .panelAn>.filaAn:nth-child(1),.mesa.probando .panelAn>.filaAn:nth-child(2),.mesa.probando .panelAn>.danoMovil{display:flex;flex-direction:column;gap:3px;padding:0;font-size:11px}
  .mesa.probando .panelAn .k{font-size:8px;letter-spacing:0}
  .mesa.probando.analisisAbierto .hud.tr{right:8px;top:60px;max-height:calc(100% - 70px);overflow:auto;pointer-events:auto}
  .mesa.probando.analisisAbierto .panelAn.on{display:block;padding:12px}
  .mesa.probando.analisisAbierto .panelAn>*{display:block}
  .mesa.probando.analisisAbierto .panelAn .filaAn{display:flex;flex-direction:row;padding:4px;font-size:12px}
  .mesa.probando.analisisAbierto .panelAn .filaAn.off{display:none}
  .mesa.probando.analisisAbierto .panelAn .k{font-size:11px}
  .leyenda{font-size:9px;padding:8px;gap:6px}.hud.bl{left:8px;bottom:8px;max-width:calc(100% - 64px)}
  .velo{padding:10px;z-index:10}.acta,.lista{max-height:calc(100% - 8px);overflow:auto;overscroll-behavior:contain}
  .acta .encab{padding:12px 14px}.acta h2{font-size:20px}.acta .datos>div{padding:8px 12px}.acta .datos .vl{font-size:15px}.acta .datos .et{font-size:8px}
  .acta .pie{padding:8px;gap:5px;position:sticky;bottom:0;background:var(--panel)}.acta .pie .acc{min-height:44px;min-width:95px;font-size:11px}.listaCab{padding:10px}.cerrarX{width:44px;height:44px}
  .tramo{min-height:64px;padding:10px 14px}.listaCuerpo{grid-template-columns:1fr;flex:1;min-height:0}
}
@media(max-width:380px){.nivelnom .n{max-width:94px;font-size:11px}.presu .cifra .vl{font-size:10px}.presu .cifra .et{font-size:7px}.riel{padding-inline:2px;gap:0}.chip .nm{font-size:10px}}
@media(max-width:960px) and (max-height:500px) and (orientation:landscape){
  .app{display:grid;grid-template-columns:minmax(0,1fr) 174px;grid-template-rows:48px minmax(0,1fr);padding-bottom:env(safe-area-inset-bottom)}
  .riel{grid-column:1 / -1;min-height:0}.mesa{grid-column:1;grid-row:2;min-width:0}
  .banco{grid-column:2;grid-row:2;display:flex;flex-direction:column;justify-content:center;padding:6px;overflow:auto;border-top:0;border-left:1px solid var(--line)}
  .banco .grupo,#grpSim{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));flex:none;width:100%;gap:4px}
  .banco .chip{min-height:44px}.banco .acc{min-height:44px}#bProbar{font-size:10px}
  .movilBarra{top:5px}.mesa.objetivoAbierto .hud.tl,.mesa.cargaAbierta .cargaPanel{top:54px}
  .zoom{flex-direction:row}.mesa.probando .panelAn .k{font-size:9px}
  .enEnsayo .banco{justify-content:center}.acta .datos{grid-template-columns:repeat(4,1fr)}
}

.movilAyuda{display:none}
@media(max-width:960px){
  .movilAyuda{display:block;font:12px/1.6 Archivo,sans-serif;color:var(--ink2);padding-top:10px;border-top:1px solid var(--line);margin-bottom:0}
  .mesa.probando.analisisAbierto .panelAn .critVal{display:flex;gap:12px}
}
@media(max-width:960px) and (max-height:500px) and (orientation:landscape){
  #mats,#grpEd,#grpSim{flex:0 0 auto;grid-auto-rows:44px;align-content:start}
}
/* Paleta lateral y barra de acciones unificada. */
.mesa #mats{position:absolute;left:12px;top:50%;transform:translateY(-50%);z-index:3;display:flex;flex-direction:column;gap:5px;padding:6px;background:color-mix(in srgb,var(--panel) 95%,transparent);border:1px solid var(--line);border-radius:17px;box-shadow:0 5px 24px #10203025;backdrop-filter:blur(12px);overflow:visible}
#mats .chip{display:grid;place-items:center;width:44px;height:44px;min-width:44px;min-height:44px;padding:0;border:1px solid transparent;border-radius:12px;background:transparent;color:var(--material);box-shadow:none}
#mats .chip svg{width:25px;height:25px;pointer-events:none}
#mats .chip:hover{background:var(--bg2)}
#mats .chip[aria-pressed=true]{background:var(--accSoft);border-color:var(--acc);box-shadow:inset 0 0 0 1px var(--acc)}
.mesa.probando #mats{display:none}
.banco{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px;background:var(--panel);border-top:1px solid var(--line);box-shadow:0 -4px 22px #10203012}
.banco>.espaciador{display:none}
.banco #grpEd,.banco #grpSim{display:flex;align-items:center;gap:6px;flex:0 0 auto;margin:0!important;padding:0!important;border:0;overflow:visible;grid-auto-rows:auto}
.banco .acc{height:44px;min-height:44px;border-radius:12px;font-size:12px}
.banco .herrIcono{display:grid;place-items:center;min-width:44px;width:44px;padding:0;border-color:transparent;background:transparent;color:var(--ink2)}
.banco .herrIcono[aria-pressed=true]{background:var(--accSoft);color:var(--acc);border-color:var(--acc)}
.banco .herrIcono svg{width:21px;height:21px;pointer-events:none}
.banco #bProbar{min-width:150px;padding:0 16px;font-weight:600}
.banco #bPausa{padding:0 14px}
@media(max-width:960px){
  .app{display:flex;flex-direction:column;padding-bottom:0}
  .mesa{flex:1 1 auto;min-height:0}
  .mesa #mats{left:8px;padding:4px;gap:3px;border-radius:15px}
  #mats .chip{width:44px;height:44px;min-width:44px;min-height:44px}
  #mats .chip svg{width:23px;height:23px}
  .banco{flex:0 0 auto;flex-wrap:nowrap;gap:6px;padding:7px 8px max(7px,env(safe-area-inset-bottom));overflow:visible;border-left:0}
  .banco #grpEd{gap:2px;flex:0 0 auto}
  .banco #grpSim{gap:5px;flex:1 1 auto;justify-content:flex-end}
  .banco #bProbar{min-width:0;max-width:180px;flex:1 1 auto;padding:0 10px;font-size:12px}
  .banco .herrIcono{flex:0 0 44px;width:44px;min-width:44px}
  .app:not(.enEnsayo) #bEsfuerzos,.app:not(.enEnsayo) #bPausa,.app:not(.enEnsayo) #bLento{display:none}
  .app.enEnsayo #grpEd{display:none}.app.enEnsayo #grpSim{justify-content:center}
  .app.enEnsayo #bProbar{margin-left:auto}
  .zoom{flex-direction:column;gap:4px;right:8px;bottom:8px}
  .zoom button{background:var(--panel);border-radius:12px}
  .movilBarra button{border-radius:12px;background:color-mix(in srgb,var(--panel) 94%,transparent)}
}
@media(max-width:960px) and (max-height:500px) and (orientation:landscape){
  .app{padding-bottom:0}.banco{padding:5px 8px max(5px,env(safe-area-inset-bottom))}
  .mesa #mats{top:54px;transform:none;gap:2px;padding:3px;max-height:calc(100% - 60px);overflow-y:auto;scrollbar-width:none}
  #mats .chip{flex:0 0 44px}
  .zoom{flex-direction:row}
  .banco #grpSim{flex:0 1 350px}
}
.banco #grpEd,.banco #grpSim{width:auto;min-width:0}

/* Menú de opciones (sonido, compartir, orden de tramos). El riel sube por
   encima de la barra flotante del móvil (z-index 4) para que el menú, que
   cuelga de él, no quede por debajo; los velos (z-index 10) siguen ganando. */
.riel{position:relative;z-index:6}
.menuMas{position:absolute;right:12px;top:calc(100% + 6px);z-index:30;min-width:232px;display:flex;}
.menuMas{flex-direction:column;padding:6px;background:var(--panel);border:1px solid var(--line2);border-radius:12px;box-shadow:0 12px 32px #10203030}
.menuMas button{text-align:left;padding:11px 12px;min-height:44px;border-radius:8px;font-size:13px}
.menuMas button:hover{background:var(--bg2)}
.menuMas button[aria-checked=true]::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--ok);margin-right:9px;vertical-align:middle}
.menuMas button[aria-checked=false]::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;border:1px solid var(--line2);margin-right:9px;vertical-align:middle;box-sizing:border-box}
.menuMas button:disabled{opacity:.45;cursor:default}
@media(max-width:960px){.menuMas{right:6px;top:calc(100% + 2px);min-width:min(260px,calc(100vw - 12px))}}

/* Compartir diseño: código de texto para copiar o pegar. */
.compartir .cpCuerpo{display:flex;flex-direction:column;gap:8px;padding:14px 18px}
.compartir label{font:10px 'IBM Plex Mono',monospace;letter-spacing:.11em;text-transform:uppercase;color:var(--ink3);margin-top:4px}
.compartir textarea{width:100%;resize:none;font:12px/1.5 'IBM Plex Mono',monospace;color:var(--ink);background:var(--bg2);border:1px solid var(--line);border-radius:8px;padding:9px 10px;word-break:break-all;-webkit-user-select:text;user-select:text}
.compartir textarea:focus{outline:2px solid var(--acc);outline-offset:1px}
.compartir textarea[readonly]{color:var(--ink2)}
.compartir .cpFila{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.compartir .cpFila .acc{min-height:40px;min-width:110px}
.cpAviso{font:11px 'IBM Plex Mono',monospace;color:var(--ok);flex:1 1 auto;min-width:0}
.cpAviso.mal{color:var(--bad)}
.compartir .pie{padding:10px 18px 14px;justify-content:flex-end}.compartir .pie .acc{flex:0 0 auto;min-width:120px}
@media(max-width:960px){.compartir .cpCuerpo{padding:12px}.compartir textarea{font-size:11px}}

/* Tramos bloqueados en la lista. */
.tramo.bloqueado{opacity:.55;cursor:not-allowed}
.tramo.bloqueado .nm{color:var(--ink3)}
.tramo.bloqueado.aviso{animation:sacudir .35s ease}
@keyframes sacudir{0%,100%{transform:translateX(0)}25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}
