/* Identidad compartida de Selene: emblema estático, violeta nocturno y oro. */
:root{--oro:#e8c872;--oro-claro:#f7e6b0;--oro-oscuro:#9a7430;--texto:#efe6d2;--texto-suave:#b9ad96;--panel:rgba(12,8,30,.78);--borde:rgba(232,200,114,.35)}
.astracielo-emblema{display:block;width:144px;height:80px;overflow:hidden;border-radius:12px;flex-shrink:0;pointer-events:auto;background:transparent}
.astracielo-emblema img{display:block;width:100%;height:auto;transform:translateY(-8px)}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid #ffe4ac;outline-offset:5px}
body #barra{padding:14px 22px;background:linear-gradient(#0c081ee8,transparent);z-index:3}
#barra .marca{gap:20px}.marca-titulo{font-weight:400;letter-spacing:.09em}.marca-estrella{animation:none!important}
.panel{border-radius:20px;border-color:var(--borde);box-shadow:inset 0 0 0 5px #d7b77706,0 24px 64px #0009;background:var(--panel)}
.panel h2{color:var(--oro-claro)}
.planes-selene button{background:#16151ee8;color:var(--texto);border-color:#bba37166;font-size:16px}
.planes-selene button[aria-pressed="true"]{background:linear-gradient(120deg,#f2d9a5,#c6a165);color:#19131c;box-shadow:0 3px 18px #e6c68b20}
.enlaces-plan{padding:10px 0;border-bottom:1px solid #ccb27a30;line-height:1.5}
.enlaces-plan a{text-decoration-color:#ccb27a60;text-underline-offset:4px}
#bocadillo{background:linear-gradient(160deg,rgba(28,16,60,.9),rgba(10,6,26,.92));box-shadow:0 15px 40px #0007}
.icono{background:rgba(10,6,25,.6)}.boton-oro{background:linear-gradient(110deg,#f1d7a0,#c59d5e);color:#19131c}
@media(max-width:760px){body #barra{padding:24px 12px 8px}.astracielo-emblema{width:112px;height:62px}.astracielo-emblema img{transform:translateY(-6px)}#barra .marca{gap:10px}.marca-titulo{max-width:115px;font-size:12px;line-height:1.6}.barra-botones{gap:5px}.icono{width:32px;height:32px}.panel{border-radius:20px}}
@media(prefers-reduced-motion:reduce){.astracielo-emblema,.bonos article{transition:none!important}}

/* El formulario completo comparte el espacio disponible, sin scroll interior. */
#panel{padding:16px}
#panel h2{margin-bottom:8px}
#panel .planes-selene{margin:8px 0}
#panel .nota{margin-bottom:8px}
#panel .enlaces-plan{padding:7px 0;margin:4px 0 10px;gap:5px 12px}
#panel .tiradas{margin-bottom:10px}
#panel textarea{display:block;margin-bottom:10px}
@media(min-width:761px){
  #panel{width:350px;top:110px;transform:none}
  #panel .tirada{padding:8px 10px}
}
@media(min-width:761px) and (max-height:740px){
  #panel{padding:12px 16px;top:100px}
  #panel .nota{font-size:15px;line-height:1.2;margin-bottom:6px}
  #panel .enlaces-plan{margin-bottom:8px;padding:5px 0}
  #panel .tiradas{gap:6px;margin-bottom:8px}
  #panel .tirada{padding:6px 8px}
  #panel textarea{height:52px;padding:7px 10px;margin-bottom:8px}
  #panel .boton-oro{padding:10px 12px}
}
/* En ventanas excepcionalmente bajas se desplaza la página, no el formulario. */
@media(max-height:580px){
  html,body{overflow-y:auto}
  #escenario{position:absolute;min-height:680px;overflow:visible}
  #panel{top:105px;bottom:auto;transform:none}
}

/* Lectura más cómoda: el panel crece hacia abajo, con esquinas iguales. */
#panel{border-radius:20px}
@media(min-width:761px){
  #panel{width:380px;padding:18px}
  #panel h2{font-size:20px;margin-bottom:10px}
  #panel .planes-selene button{font-size:18px;padding:10px}
  #panel .nota{font-size:18px;line-height:1.3;margin-bottom:9px}
  #panel .enlaces-plan{font-size:15px;gap:5px 14px;padding:8px 0;margin-bottom:12px}
  #panel .tirada{padding:10px}
  #panel .tirada b{font-size:15px}
  #panel .tirada span{font-size:17px;line-height:1.2}
  #panel .etiqueta{font-size:18px;line-height:1.3}
  #panel .etiqueta span{font-size:16px}
  #panel textarea{font-size:19px;height:68px;padding:9px 12px;margin-bottom:12px}
  #panel .boton-oro{font-size:15px;padding:13px 12px}
}
@media(min-width:761px) and (max-height:740px){
  #panel{padding:14px 18px}
  #panel .nota{font-size:17px;margin-bottom:7px}
  #panel .enlaces-plan{padding:6px 0;margin-bottom:9px}
  #panel .tirada{padding:8px}
  #panel textarea{height:58px;margin-bottom:9px}
}
