@layer pages {
  .welcome-shell {
    min-height: 100svh; position: relative; isolation: isolate; overflow: hidden;
    display: flex; flex-direction: column;
    padding: max(1.5rem, env(safe-area-inset-top)) max(2rem, env(safe-area-inset-right)) max(1.2rem, env(safe-area-inset-bottom)) max(2rem, env(safe-area-inset-left));
    background: radial-gradient(ellipse at 5% 90%, #e1e8d7 0, transparent 48%), radial-gradient(ellipse at 100% 0, var(--sky) 0, transparent 52%), var(--paper);
  }
  .garden-layer { position: absolute; inset: 0; z-index: -1; pointer-events: none; }
  .welcome-header { display: flex; align-items: center; gap: 1.2rem; }
  .header-rule { width: 64px; height: 1px; background: var(--line); }
  .welcome-card { width: min(100%, 820px); align-self: center; text-align: center; margin: auto; padding: 1rem 0 1.5rem; }
  .welcome-mark { height: clamp(90px, 13vh, 145px); width: 120px; margin: 0 auto .9rem; }
  .welcome-card h1 { font-size: clamp(3rem, 7.2vw, 5.2rem); line-height: 1.02; }
  .subtitle { margin-top: 1.2rem; font-size: clamp(1rem, 2.2vw, 1.2rem); color: var(--green); }
  .intro { margin-top: 1.2rem; color: var(--muted); line-height: 1.7; }
  .welcome-actions { display: grid; justify-items: center; margin-top: 1.8rem; }
  .welcome-actions .primary-action { min-width: min(100%, 310px); min-height: 70px; }
  .entry-status { min-height: 1.5em; margin-top: .7rem; color: var(--muted); font-size: .8rem; }
  .welcome-footer { display: flex; justify-content: space-between; align-items: end; gap: 1rem; }
  .footer-note { color: var(--muted); font-family: var(--font-display); font-style: italic; font-size: .95rem; }
  @media (max-width: 600px) {
    .welcome-shell { padding: 1.2rem; }
    .welcome-header { justify-content: center; }
    .header-rule { display: none; }
    .welcome-card { padding: 1.5rem 0; }
    .welcome-footer { flex-direction: column; align-items: center; gap: .5rem; }
  }
}