/* Chronicles — session welcome over the newsprint stage */

#q200.dd-stage {
  position: relative;
}

.chr-welcome {
  position: absolute;
  inset: 0;
  z-index: 31;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.25rem;
  pointer-events: none;
  opacity: 0;
  transition: opacity 720ms ease;
  background: color-mix(in srgb, var(--drydock-hull-dark, #1e2834) 42%, transparent);
}

/* Phone: lift welcome into the visible stage (was sitting too low) */
.dd-viewport.dd-layout--phone-stack .chr-welcome,
body[data-dd-token='phone'] .chr-welcome,
body[data-dd-token='tablet-portrait'] .chr-welcome,
html.dd-chr-phone-boot .chr-welcome {
  align-items: flex-start;
  justify-content: center;
  padding-top: max(2.5rem, 12vh);
  padding-bottom: 0;
}

.chr-welcome--visible {
  opacity: 1;
}

.chr-welcome--out {
  opacity: 0;
  transition-duration: 920ms;
}

.chr-welcome[hidden] {
  display: none;
}

.chr-welcome__card {
  position: relative;
  z-index: 1;
  max-width: min(34rem, 94%);
  padding: 1.35rem 1.6rem 1.45rem;
  text-align: center;
  color: var(--drydock-hub-rim, #f5f5f5);
  background: color-mix(in srgb, var(--drydock-hub-bg, #141b24) 92%, #000);
  border: 1px solid color-mix(in srgb, var(--drydock-hub-glow, #bfcdd3) 45%, transparent);
  box-shadow: 0 12px 36px rgba(0, 0, 0, 0.4);
}

.chr-welcome__mast {
  margin: 0 0 0.85rem;
  font-family: var(--chr-font-mast, 'Fredoka', system-ui, sans-serif);
  font-weight: var(--chr-font-mast-weight, 700);
  font-size: clamp(1.55rem, 4.2vw, 2.35rem);
  letter-spacing: 0.01em;
  line-height: 1.1;
  opacity: 0;
  transform: scale(3.2);
}

.chr-welcome__mast--enter {
  opacity: 1;
}

.chr-welcome__mast--settled {
  opacity: 1;
  transform: scale(1);
  transition: transform 0.72s cubic-bezier(0.22, 1.2, 0.36, 1), opacity 0.28s ease;
}

.chr-welcome__phrases {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.35rem;
}

.chr-welcome__phrase {
  margin: 0;
  font-family: var(--chr-font-dispatch, 'Courier Prime', monospace);
  font-weight: 700;
  font-size: clamp(1.15rem, 3vw, 1.65rem);
  line-height: 1.2;
  letter-spacing: 0.02em;
  opacity: 0;
  transform: scale(3.4);
}

.chr-welcome__phrase--enter {
  opacity: 1;
}

.chr-welcome__phrase--settled {
  opacity: 1;
  transform: scale(1);
  transition: transform 0.72s cubic-bezier(0.22, 1.2, 0.36, 1), opacity 0.28s ease;
}

@media (prefers-reduced-motion: reduce) {
  .chr-welcome,
  .chr-welcome__mast,
  .chr-welcome__phrase {
    transition: none !important;
  }

  .chr-welcome__mast,
  .chr-welcome__phrase {
    opacity: 1;
    transform: none;
  }
}
