/* La vida de las estrellas — añadidos sobre model-lite.css */

/* .select: ver shared/css/model-lite.css */
#age { width: min(300px, 38vw); accent-color: var(--sol-amber); }

.side-card {
  position: fixed; left: 14px; bottom: 96px; z-index: 9;
  width: min(320px, calc(100vw - 28px)); max-height: 46vh; overflow-y: auto;
  padding: 14px 16px; background: var(--space-panel);
  border: 1px solid var(--line); border-radius: 14px;
  box-shadow: var(--shadow); backdrop-filter: blur(8px); scrollbar-width: thin;
}
.side-card h2 { margin: 0; font-size: 1.18rem; }
.card-sub { margin: 2px 0 8px; font-size: 0.7rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--ion-teal); }
#stage-rows { margin: 0; padding: 0; }
#stage-rows .info-row { display: grid; grid-template-columns: 118px 1fr; gap: 10px; padding: 6px 0; border-bottom: 1px solid rgba(245,233,208,0.08); font-size: 0.83rem; }
#stage-rows dt { color: var(--starlight-dim); font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.06em; }
#stage-rows dd { margin: 0; font-family: var(--font-mono); font-size: 0.8rem; }
.card-blurb { font-size: 0.86rem; line-height: 1.5; font-style: italic; border-top: 1px solid var(--line); padding-top: 9px; margin-bottom: 0; }

#hr {
  position: fixed; right: 14px; bottom: 96px; z-index: 9; margin: 0;
  padding: 10px 12px 12px; background: var(--space-panel);
  border: 1px solid var(--line); border-radius: 14px;
  box-shadow: var(--shadow); backdrop-filter: blur(8px);
}
#hr figcaption { font-size: 0.68rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--starlight-dim); margin-bottom: 6px; }
#hr-canvas { display: block; }

@media (max-width: 900px) {
  #hr { right: 8px; bottom: auto; top: 70px; transform: scale(0.78); transform-origin: top right; }
  .side-card { bottom: 132px; max-height: 32vh; }
}

/* Destello de supernova: un fundido blanco-azulado de medio segundo. */
body.flash::after {
  content: '';
  position: fixed; inset: 0; z-index: 50; pointer-events: none;
  background: radial-gradient(circle at 50% 46%, rgba(235,245,255,0.95), rgba(160,200,255,0.35) 45%, transparent 75%);
  animation: snflash 0.7s ease-out forwards;
}
@keyframes snflash { from { opacity: 1; } to { opacity: 0; } }
