/* ═══════════════════════════════════════════════════════════════════
   TU ESPACIO DE NOCHE — panel del respirador (registro.html)
   2026-10-22 · Diego: «no está diseñado para celular».

   Solo cuando Tu espacio está abierto (#state-dashboard.is-active): el
   papel crema pasa a negro, la letra crece y todo va en crema de alto
   contraste. El flujo de reserva no se toca (lo trabajan otras ramas).
   ═══════════════════════════════════════════════════════════════════ */

.ritual .registro-flow-card:has(#state-dashboard.is-active) {
  --e-bg: #12110F;
  --e-surface: #1F1C19;
  --e-surface-2: #2A2622;
  --e-ink: #F2EDE4;
  --e-ink-2: rgba(242, 237, 228, 0.9);
  --e-ink-3: rgba(242, 237, 228, 0.76);
  --e-hair: rgba(242, 237, 228, 0.2);
  --e-gold: #C9A84C;
  background-color: var(--e-bg);
  color: var(--e-ink);
  border: 1px solid var(--e-hair);
}
.ritual .registro-flow-card:has(#state-dashboard.is-active)::before,
.ritual .registro-flow-card:has(#state-dashboard.is-active) > .papel-luz { display: none; }

/* ─── Texto: crema de alto contraste, nada pequeño ─── */
.ritual #state-dashboard { color: #F2EDE4; font-size: 1.0625rem; }
.ritual #state-dashboard :is(h2, h3, .rp__t, .rp__lema, .siguiente-puerta__t, .nw, .registro-title) { color: #F2EDE4; }
.ritual #state-dashboard :is(.registro-copy, .recorrido__note, .recorrido__since, .espacio-facet__hint) { color: rgba(242, 237, 228, 0.9); font-size: 1.0625rem; line-height: 1.5; }
.ritual #state-dashboard :is(.espacio-facet__name, .siguiente-puerta__label) { color: #E3C988; font-size: 1rem; font-weight: 700; letter-spacing: 0; text-transform: none; }
.ritual #state-dashboard :is(.espacio-facet__edit, .recorrido__share, .js-integracion, .moment__later) { color: #E3C988; font-size: 1.0625rem; font-weight: 700; }
.ritual #state-dashboard .pill { font-size: 0.9375rem; font-weight: 600; }

/* ─── V5 (2026-10-27): un solo scroll, sin pestañas ─── */
/* Con plan, la portada de /registro y la lista de espera no son para esta
   persona: Tu espacio abre arriba (body.con-plan lo pone js/registro.js). */
:is(body.con-plan, .con-plan-pre body) :is(#avisos, #hero > :not(.rhero__home)) { display: none; }
/* Del hero solo queda «‹ DEMIN CONSCIENTE» para volver al HUB */
:is(body.con-plan, .con-plan-pre body) #hero { min-height: 0; height: auto; padding: max(1.25rem, env(safe-area-inset-top)) 1.25rem 0; overflow: visible; }
:is(body.con-plan, .con-plan-pre body) #hero .rhero__home { position: static; }
:is(body.con-plan, .con-plan-pre body) .registro-partido { display: block; }
:is(body.con-plan, .con-plan-pre body) #registro-flow { display: block; padding-top: max(1.5rem, env(safe-area-inset-top)); }
:is(body.con-plan, .con-plan-pre body) #registro-flow .container--narrow { margin-inline: auto; }

.ritual #state-dashboard .espacio-hola { margin-bottom: 2.5rem; }
.ritual #state-dashboard .espacio-hola__eyebrow { margin: 0 0 0.5rem; color: #E3C988; font-size: 1rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.ritual #state-dashboard .espacio-hola .espacio-title { font-size: clamp(2.25rem, 8vw, 3rem); line-height: 1.1; margin: 0; }
.ritual #state-dashboard .espacio-hola__semana { margin: 0.75rem 0 1.25rem; font-size: 1.25rem; font-weight: 700; color: #F2EDE4; }
.ritual #state-dashboard .espacio-hola__cta { font-size: 1.125rem; }

.ritual #state-dashboard .espacio-bloque { margin-top: 2.75rem; }
.ritual #state-dashboard .espacio-bloque[hidden] { display: none; }
/* Todos los títulos de bloque iguales (sesión, herramientas, práctica, vaso, cuenta) */
.ritual #state-dashboard :is(.espacio-bloque__t, .hz-fila__t, .rp__t) { margin: 0 0 1rem; font-family: 'Playfair Display', Georgia, serif; font-size: clamp(1.75rem, 6vw, 2.25rem); font-weight: 700; line-height: 1.1; letter-spacing: 0; color: #F2EDE4; }

.ritual #state-dashboard :is(.espacio-herr, .espacio-reset, .espacio-grabaciones) { margin-top: 2.75rem; }
/* V6: herramientas en tarjetas compactas: en el celular una por renglón
   (glifo a la izquierda, nombre grande a la derecha) y tres por renglón en
   laptop. Nada escondido en un carrusel. Con RESET aquí, su panel sobra. */
.ritual #state-dashboard .hz--fila { margin: 0; }
.ritual #state-dashboard .hz-fila__t { padding: 0; }
.ritual #state-dashboard .hz-fila { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0.625rem; padding: 0; overflow: visible; }
@media (max-width: 699px) {
  .ritual #state-dashboard .hz-tile :is(.hz-door, .hz-video) { display: grid; grid-template-columns: 3rem minmax(0, 1fr); grid-template-rows: auto auto; column-gap: 1rem; row-gap: 0.125rem; align-items: center; padding: 0.875rem 1rem; }
  .ritual #state-dashboard .hz-tile :is(.hz-door__arch, .hz-video__portada) { grid-row: 1 / 3; }
  .ritual #state-dashboard .hz-tile .hz-tile__verbo { margin: 0; align-self: end; }
  .ritual #state-dashboard .hz-tile .hz-tile__lugar { align-self: start; }
  .ritual #state-dashboard .hz-tile--video .hz-video__portada { width: 3rem; }
}
@media (min-width: 700px) { .ritual #state-dashboard .hz-fila { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.ritual #state-dashboard .hz-tile { min-width: 0; }
.ritual #state-dashboard .hz-tile--video.is-abierto { grid-column: 1 / -1; }
.ritual #state-dashboard .hz-tile__verbo { font-size: 1.375rem; font-weight: 700; color: #F2EDE4; }
.ritual #state-dashboard .hz-tile .hz-door__arch { width: 3rem; height: 3.75rem; }
.ritual #state-dashboard .hz-tile .hz-door__glifo { width: 2.25rem; height: 2.25rem; }
.ritual #state-dashboard .hz-tile--video .hz-video__portada { width: 3.5rem; }
.ritual #state-dashboard .hz-tile__lugar { font-size: 1.0625rem; font-weight: 600; }
body.con-reset #dashboard-reset { display: none; }
.ritual #state-dashboard .espacio-ayuda { margin: 1.5rem 0 0.5rem; font-size: 1.0625rem; color: rgba(242, 237, 228, 0.9); }
.ritual #state-dashboard .espacio-ayuda a { color: #E3C988; font-weight: 700; }

/* Tu cuenta: lo que se consulta poco, en un desplegable al final */
.ritual #state-dashboard .espacio-cuenta { margin-top: 2.75rem; border-top: 1px solid rgba(242, 237, 228, 0.2); }
.ritual #state-dashboard .espacio-cuenta__sum { display: flex; flex-direction: column; gap: 0.25rem; padding: 1.25rem 2.5rem 1.25rem 0; cursor: pointer; list-style: none; position: relative; }
.ritual #state-dashboard .espacio-cuenta__sum::-webkit-details-marker { display: none; }
.ritual #state-dashboard .espacio-cuenta__sum::after { content: ''; position: absolute; right: 0.5rem; top: 1.75rem; width: 0.75rem; height: 0.75rem; border-right: 2px solid #E3C988; border-bottom: 2px solid #E3C988; transform: rotate(45deg); transition: transform 200ms ease; }
.ritual #state-dashboard .espacio-cuenta[open] .espacio-cuenta__sum::after { transform: rotate(-135deg); }
.ritual #state-dashboard .espacio-cuenta__sum .espacio-bloque__t { margin: 0; }
.ritual #state-dashboard .espacio-cuenta__hint { font-size: 1.0625rem; color: rgba(242, 237, 228, 0.76); }
.ritual #state-dashboard .espacio-cuenta__sum:focus-visible { outline: 2px solid #E3C988; outline-offset: 4px; border-radius: 6px; }

/* ─── Superficies que eran papel ─── */
.ritual #state-dashboard :is(.espacio-facets, .espacio-facet) { background: #1F1C19; border-color: rgba(242, 237, 228, 0.2); color: #F2EDE4; }
.ritual #state-dashboard :is(.dashboard-new-session, .siguiente-puerta) { background: #1F1C19; border-color: rgba(201, 168, 76, 0.5); color: #F2EDE4; }
.ritual #state-dashboard .recorrido__dot { background: #12110F; }
.ritual #state-dashboard .recorrido__line { border-color: rgba(242, 237, 228, 0.3); }

/* Dorado sobre negro: sí. Botón dorado con tinta, letra más grande */
.ritual #state-dashboard :is(.btn--primary, .respirando__cta) { font-size: 1.0625rem; font-weight: 700; min-height: 52px; }
@media (max-width: 559px) {
  .ritual #state-dashboard :is(.btn, .respirando__cta) { width: 100%; justify-content: center; }
}

/* «Conocer los paquetes»: botón crema con tinta, no texto oscuro */
.ritual #state-dashboard .respirando__cta { display: inline-flex; align-items: center; padding: 0 1.25rem; border-radius: 999px; background: #F2EDE4; color: #1C1A18; font-family: var(--font-body); font-style: normal; text-decoration: none; }

/* Aviso de nuevas sesiones (debajo de Tu espacio): letra más grande */
body.page-registro:has(#state-dashboard.is-active) .avisos__p { font-size: 1.0625rem; color: rgba(242, 237, 228, 0.9); }
body.page-registro:has(#state-dashboard.is-active) .avisos__btn { font-size: 1.0625rem; font-weight: 700; }

/* V6: lo que quedaba chico u oscuro dentro de la sesión en vivo */
.ritual #state-dashboard .espacio-antes { border-top-color: rgba(242, 237, 228, 0.2); }
.ritual #state-dashboard .espacio-antes__sum .espacio-h { font-size: 1.25rem; color: #F2EDE4; }
.ritual #state-dashboard .espacio-antes__hint { font-size: 1rem; color: rgba(242, 237, 228, 0.76); }
.ritual #state-dashboard .espacio-antes__sum::after { color: #E3C988; }
.ritual #state-dashboard :is(.moment__rel, .moment__cancelar-btn) { font-size: 1rem; }
.ritual #state-dashboard .moment__cancelar-btn { color: rgba(242, 237, 228, 0.82); }

/* ─── Contraste AA (2026-10-29, auditoría de todo el sitio) ───
   Tu espacio pasó a negro, pero «Antes de tu sesión» seguía en tarjetas
   blancas (#fff) con la letra ya en crema: 1.2:1, invisible. Y el bloque
   del plan heredó tinta oscura sobre el negro (1.1:1). */
.ritual #state-dashboard .antes-sesion { align-items: start; }
.ritual #state-dashboard .antes-sesion__item { background: var(--e-surface, #1F1C19); border-color: rgba(242, 237, 228, 0.2); }
.ritual #state-dashboard .antes-sesion__item summary { color: #F2EDE4; font-size: 1.0625rem; font-weight: 600; }
.ritual #state-dashboard .antes-sesion__item summary:hover { color: #E3C988; }
.ritual #state-dashboard .antes-sesion__item summary::after { color: #E3C988; }
.ritual #state-dashboard .antes-sesion__item p { color: rgba(242, 237, 228, 0.9); font-size: 1rem; opacity: 1; }
.ritual #state-dashboard .antes-sesion__icon { color: #E3C988; border-color: rgba(227, 201, 136, 0.55); }
.ritual #state-dashboard .respirando__nivel { color: #F2EDE4; }
.ritual #state-dashboard :is(.respirando__vence, .respirando__reserva-nota) { color: rgba(242, 237, 228, 0.82); font-size: 1rem; }

/* Flujo de reserva (papel crema): pasos, mes y modalidad quedaban en
   tinta al 42–60 % (2.6–4.4:1) y en 9–12 px. */
.ritual .wizard-steps__step { color: rgba(28, 26, 24, 0.72); }
.page-registro .feed-month { opacity: 1; color: rgba(28, 26, 24, 0.72); font-size: 0.875rem; }
.page-registro .experience-card__mode { opacity: 1; color: rgba(28, 26, 24, 0.75); }
.page-registro :is(.field-feedback, #confirm-error) { color: #9A3B1C; }

/* Grabaciones (2026-10-29, captura de Diego): tarjetas blancas con el
   título en crema y la nota en tinta oscura sobre negro. */
.ritual #state-dashboard .grabacion { background: var(--e-surface, #1F1C19); border-color: rgba(242, 237, 228, 0.2); }
.ritual #state-dashboard .grabacion__t { color: #F2EDE4; font-size: 1.25rem; }
.ritual #state-dashboard :is(.grabacion__f, .grabacion__codigo, .espacio-grabaciones__nota) { color: rgba(242, 237, 228, 0.82); font-size: 1rem; }
.ritual #state-dashboard .grabacion__codigo strong { color: #F2EDE4; }
.ritual #state-dashboard .grabacion__ver { color: #F2EDE4; border-color: rgba(242, 237, 228, 0.6); font-weight: 600; }
.ritual #state-dashboard .grabacion__ver:hover { background: #F2EDE4; color: #1C1A18; }
.ritual #state-dashboard :is(.siguiente-puerta__nota, .registro-note) { color: rgba(242, 237, 228, 0.82); font-size: 1rem; }
/* Integración tras cada experiencia: el panel era papel crema y la letra
   ya era crema (1:1). En Tu espacio va oscuro como lo demás. */
.ritual #state-dashboard .experience-form-panel { background: var(--e-surface, #1F1C19); border: 1px solid rgba(242, 237, 228, 0.2); }
.ritual #state-dashboard .integracion__q { color: #F2EDE4; }
.ritual #state-dashboard .session-cta__pending { color: #E3C988; }
.ritual #state-dashboard .experience-form-panel .btn--ghost { color: #F2EDE4; border-color: rgba(242, 237, 228, 0.6); }
