/* AULAQUEST V2 — INSTRUMENTOS CIENTÍFICOS | capa visual independiente */
#wrap-timer-single, #wrap-timer-dual-1, #wrap-timer-dual-2,
#hud-p1-panel, #hud-p2-panel { isolation:isolate; }
#timer-single, #timer-dual-1, #timer-dual-2,
#hud-p1-panel, #hud-p2-panel {
  background:rgba(9,22,42,.89)!important;
  border:1px solid rgba(170,203,240,.34)!important;
  border-left:3px solid #60a5fa!important;
  border-radius:12px!important;
  box-shadow:0 8px 26px rgba(1,8,24,.26), inset 0 1px rgba(255,255,255,.06)!important;
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
#timer-dual-2, #hud-p2-panel { border-left-color:#fb923c!important; }
#hud-time, #hud-time-1, #hud-time-2,
#hud-v1, #hud-v2 { font-variant-numeric:tabular-nums; letter-spacing:-.025em; }
#hud-time {font-size:clamp(19px,2.1vw,29px)!important;line-height:1.2;}
#hud-v1, #hud-v2 {font-size:clamp(12px,1.2vw,17px)!important;}
#simCanvas {touch-action:pan-y;}
@media(max-width:767px){
  #wrap-timer-single, #wrap-timer-dual-1, #wrap-timer-dual-2,
  #hud-p1-panel, #hud-p2-panel {max-width:44vw;}
  #timer-single, #timer-dual-1, #timer-dual-2,
  #hud-p1-panel, #hud-p2-panel {border-radius:10px!important; padding:6px 9px!important;}
  #hud-time {font-size:19px!important;}
  #hud-time-1, #hud-time-2 {font-size:15px!important;}
}
@media (prefers-reduced-transparency:reduce) {
 #timer-single,#timer-dual-1,#timer-dual-2,#hud-p1-panel,#hud-p2-panel {backdrop-filter:none;background:#0e2038!important;}
}

/* =====================================================
   AULAQUEST V2 — PANEL DE CONTROL MODERNO (solo estilos)
   IDs originales preservados para Builder / AQ_Config.
===================================================== */
#view-controls-panel { background:#0b1426!important; scrollbar-gutter:stable; }
#view-controls-panel select {
  width:100%; min-height:46px; padding:10px 38px 10px 14px!important;
  border:1px solid #3a506b!important; border-radius:12px!important;
  background-color:#101f36!important; color:#f1f7ff!important;
  font-size:13px!important; font-weight:600; line-height:1.35;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
  transition:border-color .16s, box-shadow .16s;
}
#view-controls-panel select:hover {border-color:#749ed1!important;}
#view-controls-panel select:focus-visible,
#view-controls-panel button:focus-visible,
#view-controls-panel input:focus-visible {outline:2px solid #93c5fd;outline-offset:3px;}
#view-controls-panel #btn-run, #view-controls-panel #btn-reset,
#view-controls-panel #btn-teacher-mode {
  min-height:45px; border-radius:12px!important; font-size:13px!important;
  font-weight:700;box-shadow:0 3px 12px rgba(0,0,0,.14);
  transition:filter .14s, transform .14s;
}
#view-controls-panel #btn-run:active, #view-controls-panel #btn-reset:active,
#view-controls-panel #btn-teacher-mode:active {transform:scale(.985);}
#view-controls-panel #btn-h-minus, #view-controls-panel #btn-h-plus {
  width:46px!important;height:46px!important;min-width:46px;
  border-radius:11px!important;background:#203854!important;
  border:1px solid #3a587a!important;font-size:16px;
}
#view-controls-panel input[type=range] {
  min-height:30px; height:30px; touch-action:pan-x;
  accent-color:#60a5fa; cursor:pointer;
}
#view-controls-panel input[type=range]::-webkit-slider-thumb {
  -webkit-appearance:none; width:23px!important; height:23px!important;
  margin-top:0!important; border:3px solid #e3f1ff!important;
  border-radius:50%; background:#3b82f6!important;
  box-shadow:0 0 0 5px rgba(59,130,246,.13)!important;
}
#view-controls-panel input[type=range]::-moz-range-thumb {
  width:19px;height:19px;border:3px solid #e3f1ff;border-radius:50%;
  background:#3b82f6;
}
#view-controls-panel #check-dual, #view-controls-panel #check-linear-mode {cursor:pointer;}
@media (pointer:coarse) {
 #view-controls-panel select, #view-controls-panel button {min-height:44px;}
 #view-controls-panel input[type=range] {min-height:42px;height:42px;}
}
@media (max-width:767px) {
 #view-controls-panel {width:100%;min-width:0;}
 #view-controls-panel select {font-size:16px!important;} /* evita zoom al enfocar en iOS */
 #view-controls-panel #btn-run, #view-controls-panel #btn-reset {min-width:0;}
}


/* ============================================================
   AULAQUEST V2 — ACABADO PANEL LATERAL 3.0
   Sólo CSS: no altera IDs, valores ni eventos del Builder.
   ============================================================ */
#view-controls-panel {
  background:linear-gradient(180deg,#111e33 0%,#0b1527 100%)!important;
  border-left:1px solid rgba(148,181,220,.15)!important;
}
#view-controls-panel > div:first-child {
  background:#1a2a40!important;
  border-color:rgba(148,181,220,.16)!important;
}
#view-controls-panel .p-4.space-y-5 { gap:0; }
#view-controls-panel select {
  -webkit-appearance:none!important;
  appearance:none!important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%2399B9E7' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E")!important;
  background-position:right 14px center!important;
  background-repeat:no-repeat!important;
  background-size:18px!important;
  min-height:49px!important;
  background-color:#14233b!important;
  border:1px solid #354967!important;
  border-radius:12px!important;
  padding-inline:15px 42px!important;
}
#view-controls-panel select:focus,
#view-controls-panel select:hover {border-color:#6d9dea!important;}
#view-controls-panel #btn-run {background:#2d68e8!important;border:1px solid #4d8bff!important;}
#view-controls-panel #btn-reset {background:#344965!important;border:1px solid #506785!important;}
#view-controls-panel #btn-teacher-mode {background:#079a77!important;border:1px solid #28ba98!important;}
#view-controls-panel #btn-run,
#view-controls-panel #btn-reset,
#view-controls-panel #btn-teacher-mode {
  min-height:48px!important;border-radius:12px!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 5px 16px rgba(0,0,0,.12)!important;
}
#view-controls-panel #btn-h-minus,
#view-controls-panel #btn-h-plus {
  background:#253a56!important; border:1px solid #445f80!important;
  border-radius:11px!important; min-height:48px!important;
}
#view-controls-panel #slider-height,
#view-controls-panel #slider-drag {
  background:#344862!important;
  border-radius:12px!important;
  min-height:39px!important;
  height:39px!important;
  padding:0 8px!important;
  box-shadow:inset 0 1px 2px rgba(0,0,0,.17);
}
#view-controls-panel input[type=range]::-webkit-slider-thumb {
  height:24px!important;width:24px!important;
  border:3px solid white!important;border-radius:50%!important;
  background:#3b82f6!important;
  margin-top:0!important;
  box-shadow:0 0 0 4px rgba(81,153,255,.17)!important;
}
#view-controls-panel input[type=range]::-moz-range-thumb {
  height:20px!important;width:20px!important;
  border:3px solid white!important;border-radius:50%!important;
  background:#3b82f6!important;
}
#view-controls-panel label {line-height:1.35;}
#view-controls-panel label:has(> input[type=checkbox]) {min-height:32px;}
@media(max-width:767px){
  #view-controls-panel select{min-height:50px!important;font-size:16px!important;}
  #view-controls-panel #btn-run,#view-controls-panel #btn-reset,
  #view-controls-panel #btn-teacher-mode {min-height:48px!important;}
  #view-controls-panel #slider-height,#view-controls-panel #slider-drag {
    height:44px!important;min-height:44px!important;
  }
}
@media(prefers-reduced-motion:reduce){
  #view-controls-panel * {scroll-behavior:auto!important;}
}

/* =========================================================
 AULAQUEST V2 / PULIDO UI 4.0 — sliders compactos y cabecera
 Mantiene nodos, IDs, White Label, AQ_Hideable y eventos.
 ========================================================= */
#view-controls-panel > div:first-child {
  background:linear-gradient(150deg,#203751,#14243c 78%)!important;
  border-bottom:1px solid rgba(143,185,244,.18)!important;
  padding:18px!important;
}
#view-controls-panel .main-sim-title {
  font-size:16px!important;font-weight:800!important;letter-spacing:-.025em;
  line-height:1.25!important;color:#f8fbff!important;
}
#view-controls-panel .main-sim-title > i {
  display:inline-grid;place-items:center;color:#86b6ff!important;
  font-size:16px!important;
  width:32px;height:32px;border-radius:10px;
  background:rgba(57,116,229,.16);border:1px solid rgba(135,178,248,.16);
}
#view-controls-panel #btn-audio-desktop,#view-controls-panel #btn-show-help {
  width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;
  border:1px solid transparent;border-radius:10px;
  transition:background .16s,border-color .16s;
}
#view-controls-panel #btn-audio-desktop:hover,#view-controls-panel #btn-show-help:hover {
  background:rgba(124,167,220,.11);border-color:rgba(124,167,220,.20);
}
/* Área grande para dedo, pista estrecha a la vista */
#view-controls-panel #slider-height,#view-controls-panel #slider-drag {
  -webkit-appearance:none!important;appearance:none!important;
  display:block;width:100%!important;height:38px!important;min-height:38px!important;
  padding:0 5px!important;border:0!important;border-radius:0!important;
  box-shadow:none!important;background:transparent!important;
  accent-color:#60a5fa;touch-action:pan-x;cursor:pointer;
}
#view-controls-panel #slider-height::-webkit-slider-runnable-track,
#view-controls-panel #slider-drag::-webkit-slider-runnable-track {
  height:6px!important;border-radius:10px;background:#3d5877!important;
  border:1px solid rgba(156,194,239,.15);
}
#view-controls-panel #slider-height::-moz-range-track,
#view-controls-panel #slider-drag::-moz-range-track {
  height:6px!important;border-radius:10px;background:#3d5877!important;
  border:1px solid rgba(156,194,239,.15);
}
#view-controls-panel #slider-height::-webkit-slider-thumb,
#view-controls-panel #slider-drag::-webkit-slider-thumb {
  -webkit-appearance:none!important;appearance:none!important;
  margin-top:-7px!important;width:20px!important;height:20px!important;
  border:3px solid #e9f4ff!important;border-radius:50%!important;
  background:#347ded!important;box-shadow:0 2px 9px rgba(0,0,0,.34)!important;
}
#view-controls-panel #slider-height::-moz-range-thumb,
#view-controls-panel #slider-drag::-moz-range-thumb {
  width:17px!important;height:17px!important;border:3px solid #e9f4ff!important;
  border-radius:50%!important;background:#347ded!important;
  box-shadow:0 2px 9px rgba(0,0,0,.34)!important;
}
#view-controls-panel #slider-height:focus-visible,#view-controls-panel #slider-drag:focus-visible {
  outline:2px solid #93c5fd!important;outline-offset:2px;
}
#view-controls-panel #btn-h-minus,#view-controls-panel #btn-h-plus {
  height:38px!important;min-height:38px!important;width:38px!important;min-width:38px!important;
  border-radius:10px!important;
}
#view-controls-panel #slider-height { flex:1 1 0%;min-width:55px; }
#view-controls-panel #drag-controls-panel {border-radius:14px!important;}
@media(pointer:coarse){
  #view-controls-panel #slider-height,#view-controls-panel #slider-drag {
    height:44px!important;min-height:44px!important;
  }
  #view-controls-panel #btn-h-minus,#view-controls-panel #btn-h-plus {
    height:44px!important;min-height:44px!important;width:44px!important;min-width:44px!important;
  }
}
@media(max-width:767px){
  #view-controls-panel > div:first-child{padding:14px!important;}
  #view-controls-panel .main-sim-title{font-size:15px!important;}
  #view-controls-panel #slider-height,#view-controls-panel #slider-drag {
    height:44px!important;min-height:44px!important;
  }
}

/* ================================================
  AULAQUEST V2 · CONTROL DE FLUIDO Y SALIDA DIFERIDA
================================================ */
#aq-fluid-options[hidden], #aq-delay-panel[hidden] { display:none !important; }
.aq-feature-switch { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 15px; border:1px solid #304661; border-radius:14px; background:#15263e; color:#e8f2ff; cursor:pointer; min-height:60px; }
.aq-feature-copy { display:flex; flex-direction:column; gap:4px; }
.aq-feature-copy strong { font-size:12px; font-weight:750; }
.aq-feature-copy strong i { color:#60a5fa; margin-right:6px; }
.aq-feature-copy small { color:#9fb7d4; font-size:11px; }
.aq-feature-switch input { position:absolute; opacity:0; width:1px; height:1px; }
.aq-feature-track { flex:0 0 45px; width:45px; height:26px; border-radius:100px; background:#465875; position:relative; transition:background .2s; }
.aq-feature-track:after { content:''; position:absolute; left:4px; top:4px; width:18px; height:18px; border-radius:50%; background:#fff; transition:transform .2s; }
.aq-feature-switch input:checked + .aq-feature-track { background:#2563eb; }
.aq-feature-switch input:checked + .aq-feature-track:after { transform:translateX(19px); }
.aq-feature-switch:focus-within { outline:2px solid #93c5fd; outline-offset:2px; }
#aq-fluid-options { margin-top:9px; }
.aq-delay-card { margin-top:10px; padding:15px; border:1px solid #304661; border-radius:15px; background:#15263e; color:#e8f2ff; }
.aq-delay-title { display:flex; align-items:center; gap:8px; font-size:12px; margin-bottom:10px; }
.aq-delay-title i { color:#fdba74; }
.aq-delay-card > label { display:block; font-size:11px; color:#abc3dd; margin-bottom:6px; }
.aq-delay-card select { width:100%; min-height:43px; padding:9px 12px; border:1px solid #3b5373; border-radius:10px; background:#0b172b; color:#f0f7ff; font-size:13px; }
.aq-delay-card p { font-size:11px; color:#9fb7d4; line-height:1.5; margin-top:9px; }
@media (max-width:767px) { .aq-delay-card select { min-height:48px; } }

.aq-global-clock { margin-top:4px; font-size:10px; font-weight:650; color:#cee3ff; text-align:center; padding:3px 5px; background:rgba(9,24,44,.82); border:1px solid rgba(96,165,250,.35); border-radius:6px; font-variant-numeric:tabular-nums; }

/* =============================================
   AULAQUEST — RESULTADOS Y FOOTER V2
   ============================================= */
.aq-experiment-clock {display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 14px;border:1px solid #334b69;border-radius:12px;background:#17283f;color:#b6cbe8;font-size:12px;}
.aq-experiment-clock.hidden {display:none!important;}
.aq-experiment-clock strong {font-family:'JetBrains Mono',monospace;font-size:13px;color:#f2f7ff;font-variant-numeric:tabular-nums;}
.aq-lab-footer {padding:18px 17px 16px;border-top:1px solid #33455f;background:linear-gradient(180deg,#132238,#0c1728);color:#dbeafe;text-align:left;}
.aq-lab-footer__intro strong {font-size:13px;color:#f4f8ff;letter-spacing:-.1px;}
.aq-lab-footer__intro p {font-size:11px;line-height:1.55;color:#9fb6d4;margin:5px 0 14px;}
.aq-lab-footer__link {display:flex;align-items:center;justify-content:center;gap:9px;min-height:46px;padding:11px 12px;border-radius:12px;background:#1c3656;border:1px solid #3b6798;color:#dcecff;font-size:12px;font-weight:700;text-decoration:none;transition:background .15s,border-color .15s;}
.aq-lab-footer__link:hover {background:#23466e;border-color:#77b4fa;color:#fff;}
.aq-lab-footer__link i:last-child {font-size:10px;opacity:.7;}
.aq-lab-footer__brand {margin-top:18px;padding-top:14px;border-top:1px solid #2c3b53;display:flex;flex-direction:column;align-items:center;gap:5px;}
.aq-lab-footer__brand a {display:flex;align-items:center;gap:8px;color:#b7c8df;text-decoration:none;font-size:11px;font-weight:700;}
.aq-lab-footer__brand img {width:26px;height:26px;object-fit:contain;}
.aq-lab-footer__brand small {font-size:10px;color:#7c96b5;}
@media(max-width:767px) {.aq-lab-footer {padding:16px 14px}.aq-lab-footer__link {min-height:48px}}

/* AULAQUEST V2 · selección independiente de gráficas */
.aq-chart-selectors{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;padding:4px 2px 10px}
.aq-chart-selectors[hidden]{display:none!important}
.aq-chart-selectors label{display:flex;align-items:center;justify-content:center;gap:6px;min-height:38px;padding:7px 6px;border:1px solid #334b6a;border-radius:11px;background:#14243a;color:#d6e6f9;font-size:11px;font-weight:600;cursor:pointer}
.aq-chart-selectors input{width:15px;height:15px;accent-color:#3b82f6}
@media(max-width:450px){.aq-chart-selectors{gap:4px}.aq-chart-selectors label{font-size:10px;padding:6px 3px}}

/* AulaQuest V2 — condición inicial vertical descendente */
.aq-initial-velocity{padding:14px;border:1px solid #334765;border-radius:15px;background:#14253f;color:#e7f0ff;margin:12px 0}
.aq-velocity-heading{font-size:13px;font-weight:750;margin-bottom:12px;display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap}
.aq-velocity-heading small{font-size:11px;font-weight:400;color:#a2b8d4}
.aq-velocity-line{display:flex;align-items:center;gap:8px;margin-top:9px;font-size:12px;font-weight:650}
.aq-velocity-line input{margin-left:auto;width:90px;min-height:42px;border:1px solid #496588;border-radius:9px;padding:7px 10px;background:#0b1930;color:white;font-variant-numeric:tabular-nums;outline-offset:3px}
.aq-velocity-line span{font-size:11px;color:#b2c8e5}
.aq-initial-velocity p{color:#9eb6d7;font-size:11px;line-height:1.5;margin:12px 0 0}
.aq-initial-velocity [hidden]{display:none!important}



/* ====================================================
   AULAQUEST V2 — REFINAMIENTOS DE INTERFAZ
   ==================================================== */

/* AulaQuest V2 — controles compactos de velocidad y registros */
.aq-v0-inline{margin-top:10px;background:#142640;border:1px solid #334963;border-radius:12px;padding:10px 12px;color:#dceafe}
.aq-v0-toggle-row{display:flex;align-items:center;gap:9px;min-height:32px;cursor:pointer;font-size:12px;font-weight:650}
.aq-v0-toggle-row>span:first-child{margin-right:auto}.aq-v0-toggle-row i{color:#8fb9ed;margin-right:6px}
.aq-v0-toggle-row input{position:absolute;opacity:0;width:1px;height:1px}
.aq-v0-switch{width:38px;height:22px;border-radius:18px;background:#40516b;position:relative;transition:background .18s;flex:none}
.aq-v0-switch::after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:white;transition:transform .18s}
.aq-v0-toggle-row input:checked+.aq-v0-switch{background:#2563eb}
.aq-v0-toggle-row input:checked+.aq-v0-switch::after{transform:translateX(16px)}
.aq-v0-toggle-row:focus-within{outline:2px solid #93c5fd;outline-offset:3px;border-radius:5px}
.aq-v0-detail{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:9px;padding-top:10px;border-top:1px solid #2f4562;font-size:11px;color:#b5c9e6}
.aq-v0-detail[hidden]{display:none!important}
.aq-v0-detail input{width:91px;min-height:40px;border:1px solid #4b698c;background:#0b1b33;color:white;border-radius:9px;padding:6px 10px;text-align:center;font-size:14px;font-variant-numeric:tabular-nums}
#history-table .aq-history-context td{padding:8px 10px 4px;background:#17283f;border-top:2px solid #456185;white-space:normal}
.aq-history-context-line{display:flex;gap:6px;flex-wrap:wrap;font-size:10px}
.aq-history-context-line span{border-radius:5px;padding:3px 7px;color:#bed7f5;background:#213b59;white-space:nowrap}
#history-table td{font-variant-numeric:tabular-nums}
@media(max-width:640px){.aq-v0-inline{padding:9px 11px}.aq-v0-toggle-row{min-height:36px}#history-table th,#history-table td{white-space:nowrap}}



/* ================================================================
   AULAQUEST FASE 2B · COMPACTACIÓN REAL
   Archivo: css/instruments.css (última hoja de estilos del panel).
   Contratos, ids, eventos y datos del Builder: SIN CAMBIOS.
   Nota: prioriza las reglas !important preexistentes de este archivo.
   ================================================================ */

/* 1 · RITMO VERTICAL: sustituye el espacio entre bloques, no su lógica. */
#view-controls-panel > .p-4.space-y-5.flex-grow {
  display:flex;
  flex-direction:column;
  gap:11px;
  padding:12px!important;
  min-width:0;
}
#view-controls-panel > .p-4.space-y-5.flex-grow > * {
  margin-top:0!important;
  margin-bottom:0!important;
}
#view-controls-panel > div:first-child {
  padding:11px 12px!important;
  gap:7px!important;
}
#view-controls-panel .main-sim-title {
  font-size:13px!important;
  line-height:1.25!important;
}
#view-controls-panel .main-sim-title > i {
  width:26px!important;
  height:26px!important;
  border-radius:8px!important;
  font-size:13px!important;
}
#view-controls-panel #btn-audio-desktop,
#view-controls-panel #btn-show-help {width:32px;height:32px;}

/* 2 · BOTONES: de 48 px a 37 px en PC; mínimo 40 px en táctil. */
#view-controls-panel #btn-run,
#view-controls-panel #btn-reset,
#view-controls-panel #btn-teacher-mode {
  min-height:37px!important;
  padding:7px 10px!important;
  border-radius:9px!important;
  font-size:12px!important;
  line-height:1.15!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07)!important;
}
#view-controls-panel #btn-run i,
#view-controls-panel #btn-reset i,
#view-controls-panel #btn-teacher-mode i {font-size:12px!important;}
#view-controls-panel > .p-4.space-y-5.flex-grow > .grid.grid-cols-2 {gap:8px!important;}
#view-controls-panel > .p-4.space-y-5.flex-grow > .space-y-2 {padding-bottom:0!important;}
#view-controls-panel > .p-4.space-y-5.flex-grow > .space-y-2 > * + * {margin-top:0!important;}

/* 3 · COMPARAR y tarjetas. Tarjeta = estructura ligera, no contenedor gigante. */
#view-controls-panel div:has(> label #check-dual) {
  padding:8px 10px!important;
  border-radius:10px!important;
}
#view-controls-panel label:has(#check-dual) {min-height:25px!important;}
#view-controls-panel .aq-ball-card {
  padding:9px 10px!important;
  gap:7px!important;
  border-radius:11px!important;
}
#view-controls-panel .aq-ball-card > label:first-child {
  font-size:10px!important;
  line-height:1.3!important;
}
#view-controls-panel .aq-v0-inline {
  padding:7px 8px!important;
  margin-top:0!important;
  border-radius:9px!important;
  background:#11223a;
}
#view-controls-panel .aq-v0-single {
  padding:4px 0 0!important;
}
#view-controls-panel .aq-setting-block {
  padding-top:6px!important;
}
#view-controls-panel .aq-ball-card .aq-v0-heading {
  gap:5px!important;
  font-size:11px!important;
  line-height:1.3!important;
}
#view-controls-panel .aq-ball-card .aq-v0-heading output {
  font-size:12px!important;
  letter-spacing:-.02em;
}
#view-controls-panel .aq-v0-heading i {margin-right:4px;}
#view-controls-panel .aq-ball-card .aq-delay-card {margin-top:0!important;}

/* 4 · SELECTORES: 49/50 px => 38 px; iOS conserva fuente de 16 px. */
#view-controls-panel select {
  min-height:38px!important;
  height:38px!important;
  padding:6px 32px 6px 11px!important;
  padding-inline:11px 32px!important;
  font-size:12px!important;
  line-height:1.25!important;
  border-radius:9px!important;
  background-position:right 10px center!important;
  background-size:15px!important;
}

/* 5 · SLIDERS: pista visual de 6px dentro de una zona táctil de 30px.
   La pista ya no ocupa toda la altura del input. Valores/IDs sin cambios. */
#view-controls-panel input:is(#aq-v0-range-1,#aq-v0-range-2,#aq-h-range-1,#aq-h-range-2,#slider-drag) {
  -webkit-appearance:none!important;
  appearance:none!important;
  display:block!important;
  width:100%!important;
  height:30px!important;
  min-height:30px!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  background:linear-gradient(to right,
    var(--aq-range-color,#3b82f6) 0%,
    var(--aq-range-color,#3b82f6) var(--aq-range-progress,0%),
    #101b30 var(--aq-range-progress,0%),
    #101b30 100%) center / 100% 6px no-repeat!important;
  touch-action:pan-x;
}
#view-controls-panel input:is(#aq-v0-range-1,#aq-v0-range-2,#aq-h-range-1,#aq-h-range-2,#slider-drag)::-webkit-slider-runnable-track {
  -webkit-appearance:none!important;
  appearance:none!important;
  height:6px!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
#view-controls-panel input:is(#aq-v0-range-1,#aq-v0-range-2,#aq-h-range-1,#aq-h-range-2,#slider-drag)::-webkit-slider-thumb {
  -webkit-appearance:none!important;
  appearance:none!important;
  height:18px!important;
  width:18px!important;
  margin-top:-6px!important;
  border:2px solid #e8f3ff!important;
  border-radius:50%!important;
  background:var(--aq-range-color,#3b82f6)!important;
  box-shadow:0 1px 5px #0008!important;
}
#view-controls-panel input:is(#aq-v0-range-1,#aq-v0-range-2,#aq-h-range-1,#aq-h-range-2,#slider-drag)::-moz-range-track {
  height:6px!important;
  border:0!important;
  background:transparent!important;
}
#view-controls-panel input:is(#aq-v0-range-1,#aq-v0-range-2,#aq-h-range-1,#aq-h-range-2,#slider-drag)::-moz-range-thumb {
  height:14px!important;
  width:14px!important;
  border:2px solid #e8f3ff!important;
  border-radius:50%!important;
  background:var(--aq-range-color,#3b82f6)!important;
  box-shadow:0 1px 5px #0008!important;
}

/* 6 · Controles auxiliares: mismo idioma visual compacto. */
#view-controls-panel .aq-feature-switch {
  min-height:43px!important;
  padding:7px 10px!important;
  border-radius:10px!important;
}
#view-controls-panel .aq-feature-copy {gap:2px!important;}
#view-controls-panel .aq-feature-copy strong {font-size:11px!important;}
#view-controls-panel .aq-feature-copy small {font-size:10px!important;}
#view-controls-panel .aq-feature-track {width:40px;flex-basis:40px;height:23px;}
#view-controls-panel .aq-feature-track::after {width:15px;height:15px;}
#view-controls-panel .aq-feature-switch input:checked + .aq-feature-track:after {transform:translateX(17px);}
#view-controls-panel .aq-delay-card,
#view-controls-panel .aq-advanced-experiments {padding:9px!important;border-radius:10px!important;margin-top:6px!important;}
#view-controls-panel .aq-encounter-card {padding:8px 9px!important;border-radius:9px!important;margin-top:7px!important;}
#view-controls-panel .aq-visual-toggle {min-height:44px!important;padding:6px 8px!important;}
#view-controls-panel .aq-display-section {padding:9px 10px!important;}
#view-controls-panel .aq-display-heading {margin-bottom:6px!important;}
#view-controls-panel .aq-display-toggles {gap:5px!important;}

/* 7 · HUD: una sola banda, sin tarjetas internas ni columnas repetidas. */
#view-simulation .aq-top-hud {
  top:6px!important;
  left:6px!important;
  width:max-content!important;
  max-width:calc(100% - 12px)!important;
  padding:5px 8px!important;
  gap:8px!important;
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  flex-wrap:nowrap!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  pointer-events:auto!important;
  touch-action:pan-x!important;
  scrollbar-width:thin;
  scrollbar-color:#527395 transparent;
  overscroll-behavior-x:contain;
  border-radius:9px!important;
  white-space:nowrap;
  -webkit-overflow-scrolling:touch;
}
#view-simulation .aq-top-hud .aq-hud-readouts {
  width:max-content!important;
  max-width:none!important;
  display:flex!important;
  flex-wrap:nowrap!important;
  gap:0!important;
  flex:0 0 auto!important;
}
#view-simulation .aq-top-hud .aq-hud-cell {
  padding:0 8px!important;
  max-width:none!important;
  flex:0 0 auto!important;
  border-right:1px solid rgba(145,169,200,.26)!important;
}
#view-simulation .aq-top-hud .aq-hud-cell:first-child {padding-left:0!important;}
#view-simulation .aq-top-hud .aq-hud-cell:last-child {border-right:0!important;}
#view-simulation .aq-top-hud :is(#timer-single,#timer-dual-1,#timer-dual-2,#hud-p1-panel,#hud-p2-panel) {
  padding:0!important;
  max-width:none!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
#view-simulation .aq-top-hud .aq-hud-metric {gap:4px!important;white-space:nowrap!important;}
#view-simulation .aq-top-hud .aq-hud-label {font-size:9px!important;line-height:1.2!important;}
#view-simulation .aq-top-hud :is(#hud-time,#hud-time-1,#hud-time-2,#hud-v1,#hud-v2) {
  font:700 11px/1.25 'JetBrains Mono',monospace!important;
  letter-spacing:-.025em!important;
}
#view-simulation .aq-top-hud .aq-hud-maxima {
  flex:0 0 auto!important;
  width:max-content!important;
  max-width:none!important;
  min-width:0!important;
  margin:0!important;
  padding:0 0 0 8px!important;
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  gap:6px!important;
  border:0!important;
  border-left:1px solid rgba(145,169,200,.26)!important;
  white-space:nowrap!important;
}
#view-simulation .aq-top-hud .aq-hud-maxima-values {
  display:flex!important;
  flex-direction:row!important;
  flex-wrap:nowrap!important;
  gap:0 8px!important;
  font-size:10px!important;
  white-space:nowrap!important;
}
#view-simulation .aq-top-hud .aq-hud-section-label {
  display:block!important;
  font-size:9px!important;
  white-space:nowrap!important;
}
#view-simulation .aq-top-hud .aq-hud-maxima-values span {white-space:nowrap!important;margin-right:0!important;}
#view-simulation .aq-top-hud .aq-encounter-result {flex:0 0 auto!important;margin:0!important;white-space:nowrap!important;}

/* 8 · TABLET: el panel es estrecho incluso con viewport ancho. */
@media (max-width:1024px) {
  #view-controls-panel > .p-4.space-y-5.flex-grow {gap:9px;padding:10px!important;}
  #view-controls-panel .aq-ball-card {padding:8px 9px!important;gap:6px!important;}
  #view-controls-panel .aq-ball-card .aq-v0-heading {font-size:10px!important;}
  #view-controls-panel #btn-run,#view-controls-panel #btn-reset,#view-controls-panel #btn-teacher-mode {min-height:38px!important;}
}
@media (pointer:coarse) {
  #view-controls-panel #btn-run,#view-controls-panel #btn-reset,#view-controls-panel #btn-teacher-mode {min-height:40px!important;}
  #view-controls-panel select {min-height:42px!important;height:42px!important;}
}
@media (max-width:767px) {
  #view-controls-panel > div:first-child {padding:9px 11px!important;}
  #view-controls-panel > .p-4.space-y-5.flex-grow {gap:9px;padding:10px!important;}
  #view-controls-panel #btn-run,#view-controls-panel #btn-reset,#view-controls-panel #btn-teacher-mode {min-height:40px!important;}
  #view-controls-panel select {min-height:40px!important;height:40px!important;font-size:16px!important;}
  #view-controls-panel .aq-ball-card {padding:8px 9px!important;gap:6px!important;}
  #view-controls-panel .aq-v0-inline {padding:6px 8px!important;}
  #view-controls-panel .aq-ball-card .aq-v0-heading {font-size:10px!important;}
  #view-simulation .aq-top-hud {top:4px!important;left:4px!important;max-width:calc(100% - 8px)!important;padding:4px 7px!important;gap:6px!important;}
  #view-simulation .aq-top-hud .aq-hud-cell {padding:0 6px!important;}
  #view-simulation .aq-top-hud .aq-hud-label {font-size:9px!important;}
  #view-simulation .aq-top-hud :is(#hud-time,#hud-time-1,#hud-time-2,#hud-v1,#hud-v2) {font-size:11px!important;}
  #view-simulation .aq-top-hud .aq-hud-section-label {font-size:9px!important;}
  #view-simulation .aq-top-hud .aq-hud-maxima-values {font-size:9px!important;}
}


/* ==========================================================
   AULAQUEST · TIRO VERTICAL · FASE 3
   Responsive quirúrgico (sin cambiar controles ni contratos Builder)
   Anclas: #aq-flight-stage, #view-controls-panel, #aq-chart-selectors
   ========================================================== */

/* PC: escenario amplio y panel con espacio suficiente para los controles. */
@media (min-width: 1101px) {
  #view-simulation #aq-flight-stage {width:65%!important; flex:0 0 65%!important; min-width:0;}
  #view-simulation #view-controls-panel {width:35%!important; flex:0 0 35%!important; min-width:0;}
}
/* Tablet horizontal y portátil estrecho: 60/40, sin empujar el panel. */
@media (min-width: 768px) and (max-width: 1100px) {
  #view-simulation #aq-flight-stage {width:60%!important;flex:0 0 60%!important;min-width:0;}
  #view-simulation #view-controls-panel {width:40%!important;flex:0 0 40%!important;min-width:0;}
}

/* Los selectores de series no son nuevas opciones del Builder: siguen los mismos IDs. */
#view-controls-panel .aq-chart-selectors {min-width:0;width:100%;box-sizing:border-box;}
#view-controls-panel .aq-chart-selectors label {min-width:0;box-sizing:border-box;overflow:hidden;white-space:nowrap;}
#view-controls-panel .aq-chart-selectors input {flex:0 0 15px;min-width:15px;height:15px;margin:0;}
#view-controls-panel .aq-chart-symbol {display:none;}

/* Móvil: más altura de laboratorio, panel desplazable y controles sin cortes. */
@media (max-width: 767px) {
  #view-simulation {height:100dvh!important;min-height:0;}
  #view-simulation #aq-flight-stage {
    width:100%!important;
    height:clamp(300px,51dvh,560px)!important;
    flex:0 0 clamp(300px,51dvh,560px)!important;
    min-height:0!important;
  }
  #view-simulation #view-controls-panel {
    width:100%!important;flex:1 1 auto!important;
    min-height:0!important;overflow-y:auto!important;
  }
  /* Cada selector de gráfica dispone de una línea entera, no de media tarjeta. */
  #view-controls-panel #label-graficas,
  #view-controls-panel #aq-chart-selectors {grid-column:1 / -1!important;}
  #view-controls-panel #aq-chart-selectors {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:7px!important;padding:0 1px 4px!important;margin:0!important;
  }
  #view-controls-panel #aq-chart-selectors[hidden] {display:none!important;}
  #view-controls-panel #aq-chart-selectors label {
    min-height:34px!important;
    justify-content:center;gap:8px!important;
    padding:5px 8px!important;
    font-size:13px!important;
    background:#152943;
    border-radius:9px;
  }
  #view-controls-panel .aq-chart-name {display:none!important;}
  #view-controls-panel .aq-chart-symbol {
    display:inline!important;
    font:700 14px/1 'JetBrains Mono',monospace;
    color:#e6f1ff;
  }
  #view-controls-panel #select-planet {
    min-height:38px!important;
    height:38px!important;
    padding:7px 32px 7px 10px!important;
    font-size:14px!important;
    font-weight:600!important;
  }
  #view-controls-panel label[for="select-planet"],
  #view-controls-panel #select-planet + label {font-size:10px!important;}
}
/* iOS no debe hacer zoom al enfocar el selector nativo. */
@supports (-webkit-touch-callout: none) {
  @media (max-width:767px) {
    #view-controls-panel #select-planet {font-size:16px!important;}
  }
}

/* Tablet vertical: escenario arriba, panel debajo; sin barra lateral aplastada. */
@media (min-width:768px) and (max-width:1023px) and (orientation:portrait) {
  #view-simulation {flex-direction:column!important;height:100dvh!important;}
  #view-simulation #aq-flight-stage {
    width:100%!important;height:54dvh!important;flex:0 0 54dvh!important;min-height:0!important;
  }
  #view-simulation #view-controls-panel {
    width:100%!important;flex:1 1 auto!important;min-height:0!important;overflow-y:auto!important;
  }
  #view-controls-panel #label-graficas,
  #view-controls-panel #aq-chart-selectors {grid-column:1 / -1!important;}
}

/* En paneles de ancho medio también evitamos los nombres truncados de series. */
@media (min-width:768px) and (max-width:1279px) {
  #view-controls-panel .aq-chart-name {display:none!important;}
  #view-controls-panel .aq-chart-symbol {display:inline!important;font:700 13px/1 'JetBrains Mono',monospace;}
}

/* FASE 4 · Modal de gráficas y exportación */
.aq-chart-expand{position:absolute;z-index:4;top:7px;right:8px;display:grid;place-items:center;width:31px;height:31px;border:1px solid #475569;border-radius:8px;background:#182b45;color:#e2e8f0;cursor:pointer;box-shadow:0 2px 8px #0006}
.aq-chart-expand:hover{background:#264369;color:white}
.aq-graph-modal[hidden]{display:none!important}
.aq-graph-modal{position:fixed;inset:0;z-index:999998;display:grid;place-items:center;padding:18px}
.aq-graph-modal-backdrop{position:absolute;inset:0;background:rgba(2,6,23,.88);backdrop-filter:blur(5px)}
.aq-graph-modal-panel{position:relative;display:flex;flex-direction:column;gap:10px;width:min(1100px,100%);height:min(780px,92dvh);padding:16px;border:1px solid #365273;border-radius:16px;background:#0f1c30;box-shadow:0 22px 70px #0009;color:#f8fafc}
.aq-graph-modal-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.aq-graph-modal-head h2{font-size:16px;font-weight:750}
.aq-graph-modal-actions{display:flex;gap:8px}.aq-graph-modal-actions button{border:1px solid #415a77;border-radius:9px;padding:9px 12px;background:#213856;color:#e2e8f0;cursor:pointer;font-size:12px;font-weight:700}
.aq-graph-modal-plot{flex:1;min-height:0;position:relative}.aq-graph-modal-plot canvas{width:100%!important;height:100%!important}
.aq-graph-modal-credit{text-align:right;font-size:10px;color:#94a3b8}
body.aq-graph-modal-open{overflow:hidden}
@media(max-width:600px){.aq-graph-modal{padding:7px}.aq-graph-modal-panel{height:93dvh;padding:10px;border-radius:12px}.aq-graph-modal-head h2{font-size:13px}}

/* AulaQuest Fase 5: CTA de personalización del footer sin alterar su integración */
.aq-lab-footer__customize{margin-top:9px;background:#2563eb;border-color:#3b82f6;color:#fff}
.aq-lab-footer__customize:hover,.aq-lab-footer__customize:focus-visible{background:#1d4ed8;border-color:#93c5fd;color:#fff}
.aq-lab-footer__customize:focus-visible{outline:2px solid #bfdbfe;outline-offset:3px}


/* AulaQuest · Guía de tiro vertical V2. Estilos aislados del resto de modales. */
#help-modal .aq-guide{max-width:800px!important;width:min(95vw,800px);max-height:min(92vh,980px);background:#101c30;border:1px solid #334962;border-radius:18px;color:#e2e8f0;overflow-y:auto;overscroll-behavior:contain}
#help-modal .aq-guide-header{position:sticky;top:0;z-index:3;display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding:21px 24px 17px;background:rgba(16,28,48,.97);backdrop-filter:blur(12px);border-bottom:1px solid #30435c}
#help-modal .aq-guide-eyebrow{font:750 10px/1.5 Inter,sans-serif;color:#93c5fd;letter-spacing:.10em}
#help-modal .aq-guide-heading h3{font-size:23px;line-height:1.24;font-weight:800;letter-spacing:-.025em;color:#fff;margin:5px 0}
#help-modal .aq-guide-heading h3 i{color:#60a5fa;margin-right:7px}
#help-modal .aq-guide-heading p{font-size:12px;color:#b5c6db;line-height:1.6}
#help-modal .aq-guide-close{flex:0 0 36px;width:36px;height:36px;border:1px solid #465a75;border-radius:11px;background:#223550;color:#e2e8f0;display:grid;place-items:center;cursor:pointer}
#help-modal .aq-guide-close:hover{background:#315178;color:#fff}
#help-modal .aq-guide-body{padding:22px 24px 28px;font-size:13px;line-height:1.75}
#help-modal .aq-guide-intro{padding:16px 18px;border-radius:12px;background:linear-gradient(120deg,rgba(37,99,235,.19),rgba(20,45,78,.55));border:1px solid #36577f;color:#dceafe}
#help-modal .aq-guide-intro strong{color:#fff}
#help-modal .aq-guide-index{display:flex;gap:7px;flex-wrap:wrap;margin:16px 0 8px}
#help-modal .aq-guide-index a{background:#1d314c;border:1px solid #354e6b;border-radius:999px;padding:6px 10px;color:#cbdff6;font-size:11px;font-weight:700;text-decoration:none}
#help-modal .aq-guide-index a:hover{border-color:#60a5fa;color:#fff}
#help-modal .aq-guide-section{padding:24px 0 22px;border-bottom:1px solid #293d57;scroll-margin-top:115px}
#help-modal .aq-guide-number{font-size:10px;letter-spacing:.10em;font-weight:850;color:#7eb5ff}
#help-modal .aq-guide-section h4{font-size:19px;line-height:1.3;letter-spacing:-.02em;font-weight:800;color:#fff;margin:7px 0 12px}
#help-modal .aq-guide-section p{margin:9px 0;color:#c7d4e5}
#help-modal .aq-guide-section strong{color:#f3f7ff}
#help-modal .aq-guide-steps{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:15px}
#help-modal .aq-guide-steps>div{display:flex;align-items:flex-start;gap:10px;padding:12px;border-radius:10px;background:#1a2c45;border:1px solid #304661;color:#d7e3f2}
#help-modal .aq-guide-steps b{flex:0 0 23px;height:23px;display:grid;place-items:center;border-radius:7px;background:#2d5a9c;color:#fff;font-size:11px}
#help-modal .aq-guide-note{display:flex;align-items:flex-start;gap:11px;background:rgba(15,118,110,.13);border:1px solid rgba(45,212,191,.28);color:#c4f1e9;padding:12px 14px;border-radius:11px;margin-top:15px}
#help-modal .aq-guide-note i{margin-top:5px;color:#5eead4}
#help-modal .aq-guide-example{background:#162943;border:1px solid #3b587c;border-radius:12px;padding:15px;margin-top:16px}
#help-modal .aq-guide-example-label{font-size:10px;font-weight:850;letter-spacing:.08em;color:#f8bf82}
#help-modal .aq-guide-example small{font-size:11px;color:#acbfd7}
#help-modal .aq-guide-equation{max-width:100%;overflow-x:auto;text-align:center;background:#0d1b2e;border-radius:8px;padding:8px;margin:10px 0}
#help-modal .aq-guide-equations{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}
#help-modal .aq-guide-equations>div{padding:10px;border:1px solid #324a67;background:#172940;border-radius:10px;text-align:center;overflow-x:auto}
#help-modal .aq-guide-equations span{display:block;font-size:11px;color:#93c5fd;font-weight:750}
#help-modal .aq-guide-features{display:grid;gap:10px;margin-top:14px}
#help-modal .aq-guide-features>div{display:flex;gap:12px;padding:12px;border-radius:11px;background:#192b43;border:1px solid #2d4461}
#help-modal .aq-guide-features>div>i{margin-top:4px;font-size:16px;color:#79b8f9;flex:0 0 22px;text-align:center}
#help-modal .aq-guide-features p{margin:4px 0 0}
#help-modal .aq-guide-challenge{padding:15px;margin:12px 0;background:#172840;border:1px solid #345170;border-radius:12px}
#help-modal .aq-guide-challenge>span{font-size:10px;font-weight:850;letter-spacing:.09em;color:#f7ba7c}
#help-modal .aq-guide-challenge details{margin-top:10px;padding-top:9px;border-top:1px solid #324965}
#help-modal .aq-guide-challenge summary{font-weight:750;font-size:12px;color:#93c5fd;cursor:pointer}
#help-modal .aq-guide-finish{display:flex;gap:12px;margin-top:22px;padding:17px;border-radius:12px;background:#203757;border:1px solid #4c6d96}
#help-modal .aq-guide-finish>i{color:#93c5fd;font-size:22px}
#help-modal .aq-guide-finish strong{color:#fff}
#help-modal .aq-guide-finish p{margin-top:4px;color:#c5d8ed}
@media(max-width:600px){#help-modal .aq-guide{width:calc(100vw - 14px);max-height:calc(100dvh - 20px);border-radius:14px}#help-modal .aq-guide-header{padding:14px 15px 12px;gap:10px}#help-modal .aq-guide-heading h3{font-size:19px}#help-modal .aq-guide-body{padding:15px;font-size:12px}#help-modal .aq-guide-section{padding:20px 0}#help-modal .aq-guide-section h4{font-size:17px}#help-modal .aq-guide-steps,#help-modal .aq-guide-equations{grid-template-columns:1fr}#help-modal .aq-guide-close{width:34px;height:34px;flex-basis:34px}#help-modal .aq-guide-index{gap:5px}#help-modal .aq-guide-index a{font-size:10px;padding:5px 8px}}

/* AulaQuest · Encabezado de Practice: una sola variante según dispositivo.
   El bridge puede añadir la clase flex en JS, por eso se fija el breakpoint. */
@media (max-width: 767px) {
  #aq-wl-header-pc { display: none !important; }
}
@media (min-width: 768px) {
  #aq-wl-header-mobile { display: none !important; }
}
