/* ═══ V-PASAT ════════════════════════════════════════════════════════════════
   Mismo criterio de corrección visual que TOL/WCST/SDMT/BTA/BS-D/Claves:
   .screen--center fija min-height:80vh, que dentro de un viewport más alto deja
   contenido corto "pegado" arriba con vacío debajo — se ajusta por pantalla. */
.screen--pasat.screen--center { min-height: calc(100vh - 42px); }
.screen--pasat-mode.screen--center { min-height: calc(100vh - 42px); }
.screen--pasat { width: 100%; max-width: 460px; }

/* Estímulo (dígito) y respuesta son dos secciones simétricas — misma etiqueta,
   mismo ancho, un divisor entre ambas — en vez de un número flotante seguido de un
   par etiqueta:valor en línea. La tarjeta les da un límite claro; el tamaño de
   fuente es lo único que distingue su peso visual (el dígito, foco de la tarea, es
   varias veces más grande que la respuesta). La retroalimentación vive en su propio
   elemento debajo, con el estilo transversal .test-feedback (setFeedback en
   test-ui.js), y no reemplaza la respuesta mientras se muestra. */
.pasat-panel {
  display: flex; flex-direction: column; align-items: center; gap: 20px;
  width: 100%;
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: 0 2px 10px rgba(15, 30, 45, .06);
  padding: 32px 28px;
}
.pasat-topbar { display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; }
.pasat-topbar--with-help { justify-content: space-between; }
.pasat-chip {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 7px 14px; border-radius: 100px;
  background: var(--paper); border: 1px solid var(--line);
  color: var(--ink-soft); font-size: .82rem; font-weight: 500;
  font-variant-numeric: tabular-nums;
}
.pasat-chip strong { color: var(--ink); font-weight: 700; }
.pasat-help-btn:disabled { opacity: .4; cursor: not-allowed; pointer-events: none; }

.pasat-section { display: flex; flex-direction: column; align-items: center; gap: 8px; width: 100%; }
.pasat-section-label {
  font-size: .72rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
  color: var(--ink-soft);
}
.pasat-digit {
  font-size: clamp(4rem, 15vw, 6.5rem);
  font-weight: 700;
  line-height: 1;
  color: var(--ink);
  font-variant-numeric: tabular-nums;
  text-align: center;
  min-height: 1.1em;
}
.pasat-divider { width: 100%; height: 1px; background: var(--line); }
.pasat-response-value {
  min-width: 2.2em;
  padding: 6px 16px;
  font-size: 1.5rem;
  font-weight: 700;
  text-align: center;
  color: var(--ink);
  font-variant-numeric: tabular-nums;
  background: var(--paper);
  border: 2px solid var(--line-strong);
  border-radius: var(--radius-sm);
}
/* Feedback a tamaño completo (no .test-feedback--compact): ocupa el ancho del panel
   en vez de una píldora centrada de contenido mínimo, con ícono/título más grandes y
   el mensaje en números tabulares — es la señal principal de aprendizaje durante la
   práctica, así que merece la misma jerarquía visual que estímulo/respuesta. */
.pasat-feedback.test-feedback {
  width: 100%; margin: 0; justify-content: flex-start; text-align: left;
  padding: 14px 16px;
}
.pasat-feedback.test-feedback .test-feedback__icon { width: 38px; height: 38px; }
.pasat-feedback.test-feedback .test-feedback__icon svg { width: 21px; height: 21px; }
.pasat-feedback.test-feedback .test-feedback__title { font-size: 1rem; }
.pasat-feedback.test-feedback .test-feedback__message {
  font-size: .88rem; font-weight: 600; font-variant-numeric: tabular-nums;
}
.pasat-feedback[hidden] { display: none; }

/* Recuadro de aclaración en las instrucciones: el punto que más se confunde (sumar
   con el dígito que se VIO, no con la respuesta propia) merece más peso visual que
   un párrafo chico al final. */
.pasat-callout {
  display: flex; align-items: flex-start; gap: 10px;
  margin: 14px 0 0; padding: 12px 14px;
  background: var(--accent-soft); border: 1px solid var(--accent);
  border-radius: var(--radius-sm); text-align: left;
}
.pasat-callout__icon { flex: none; font-size: 1rem; line-height: 1.35; color: var(--accent-dark); }
.pasat-callout p { margin: 0; font-size: .88rem; color: var(--ink); line-height: 1.45; }

.pasat-help-content p { margin: 0 0 12px; font-size: .88rem; color: var(--ink); line-height: 1.45; }
.pasat-help-content p:last-child { margin-bottom: 0; }

.pasat-example-table { width: 100%; border-collapse: collapse; margin: 10px 0; font-size: .9rem; }
.pasat-example-table th, .pasat-example-table td { padding: 6px 12px; border: 1px solid var(--line); text-align: left; }
.pasat-example-table th { background: var(--surface); font-weight: 600; }

/* Teclado numérico en pantalla: PASAT es 100% teclado físico (dígitos 0-9 +
   retroceso) sin ningún <input> que dispare el teclado del celular — sin
   esto no hay forma de responder por touch. Oculto por defecto (en
   escritorio el teclado físico ya es más rápido bajo la presión de tiempo
   de la tarea); visible solo por tipo de dispositivo, no por ancho. */
.pasat-keypad {
  display: none;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  width: 100%;
  margin-top: 4px;
}
.pasat-key {
  min-height: 48px;
  font: inherit; font-size: 1.2rem; font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: var(--ink);
  background: var(--paper); border: 1px solid var(--line);
  border-radius: var(--radius-sm); cursor: pointer;
}
.pasat-key:hover { border-color: var(--accent); background: var(--accent-soft); }
.pasat-key:active { transform: scale(.96); }
.pasat-key--wide { grid-column: span 2; }
.pasat-key--back { font-size: 1.1rem; color: var(--ink-soft); }
@media (pointer: coarse), (hover: none) {
  .pasat-keypad { display: grid; }
}

/* Genérico: pantallas de elección de modo (PASAT, Corsi) — dos tarjetas apiladas. */
.mode-choices { display: flex; flex-direction: column; gap: 12px; width: 100%; margin-top: 6px; }
.mode-choices .test-choice { width: 100%; }
kbd {
  display: inline-block;
  padding: 1px 5px;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--surface);
  font-size: .85em;
  font-family: inherit;
}