html.welcome-active, .welcome-active body { overflow: hidden; }
.welcome { position: fixed; inset: 0; width: 100%; max-width: none; height: 100%; height: 100dvh; max-height: none; margin: 0; padding: 0; border: 0; background: #221d19; color: #fff; font-family: Poppins, sans-serif; overflow: hidden; touch-action: none; }
.welcome::backdrop { background: #221d19; }
.welcome-photo, .welcome-shade { position: absolute; inset: 0; width: 100%; height: 100%; }
.welcome-photo { object-fit: cover; object-position: 48% center; }
.welcome-shade { background: linear-gradient(180deg, #211b1940, #211b1910 25%, #211b1980 55%, #211b19ed); }
.welcome-brand { position: absolute; top: max(30px, env(safe-area-inset-top)); left: 6vw; font-size: 12px; font-weight: 700; letter-spacing: .16em; }
.welcome-brand span { display: block; margin-top: 4px; font-size: 10px; letter-spacing: .4em; font-weight: 400; }
.welcome-intro { position: absolute; inset: auto 6vw max(24px, env(safe-area-inset-bottom)); transition: transform .65s ease, opacity .45s ease; }
.welcome .welcome-eyebrow { font-size: 11px; letter-spacing: .2em; font-weight: 600; }
.welcome-intro h2 { font-size: clamp(64px, 10vw, 148px); line-height: .98; letter-spacing: -.06em; font-weight: 700; margin: 22px 0; animation: welcome-arrive 1s ease both; }
.welcome-intro h2 span { color: #ffae64; background: linear-gradient(105deg, #fff0da, #ffae64 45%, #ff6a13); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.welcome-caption { font-size: clamp(13px, 1.5vw, 18px); color: #f1e6de; }
.welcome-unlock { display: flex; flex-direction: column; align-items: center; gap: 7px; margin: 32px auto 0; padding: 12px 24px; border: 0; background: transparent; color: #fff; font: inherit; font-size: 13px; cursor: pointer; }
.welcome-chevron { font-size: 28px; animation: welcome-hint 2s ease-in-out infinite; }
.welcome-click { font-size: 10px; color: #e2d1c4; }
.welcome-choices { position: absolute; bottom: 0; right: 6vw; width: min(460px, 100%); max-height: 90%; overflow-y: auto; box-sizing: border-box; padding: 22px 36px max(26px, env(safe-area-inset-bottom)); border-radius: 28px 28px 0 0; background: #fffaf5; color: #29211c; animation: welcome-sheet .6s cubic-bezier(.2,.8,.2,1) both; touch-action: pan-y; }
.welcome-choices[hidden] { display: none; }
.welcome-handle { display: block; width: 40px; height: 4px; border-radius: 5px; background: #d2beb0; margin: 0 auto 28px; }
.welcome-choices .welcome-eyebrow { color: #964007; font-size: 10px; }
.welcome-choices h2 { font-size: clamp(28px, 5vw, 36px); line-height: 1.2; letter-spacing: -.04em; margin: 14px 0; }
.welcome-choices p:not(.welcome-eyebrow) { font-size: 13px; line-height: 1.8; margin-bottom: 26px; }
.welcome-choices a, .welcome-guest { box-sizing: border-box; display: flex; justify-content: center; align-items: center; gap: 12px; width: 100%; padding: 16px; margin-top: 12px; border-radius: 12px; text-decoration: none; font: inherit; font-size: 14px; font-weight: 600; cursor: pointer; }
.welcome-primary { background: #ff6a13; color: #29211c; border: 1px solid #ff6a13; }
.welcome-secondary { border: 1px solid #bca694; color: #29211c; background: transparent; }
.welcome-guest { background: transparent; border: 0; color: #64432d; font-size: 12px; }
.welcome a:hover, .welcome-choices button:hover { background: #ffe0c5; color: #29211c; }
.welcome :focus-visible { outline: 3px solid #ff8a3d; outline-offset: 4px; }
.welcome-revealed .welcome-intro { transform: translateY(-60px); opacity: 0; pointer-events: none; }
@keyframes welcome-arrive { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: translateY(0); } }
@keyframes welcome-sheet { from { transform: translateY(100%); } to { transform: translateY(0); } }
@keyframes welcome-hint { 50% { transform: translateY(-7px); } }
@media (max-width: 600px) { .welcome-choices { right: 0; padding-inline: 26px; } .welcome-intro { bottom: max(22px, env(safe-area-inset-bottom)); } .welcome-intro h2 { font-size: clamp(64px, 18vw, 108px); } .welcome-unlock { margin-top: 44px; } }
@media (max-height: 550px) { .welcome-intro h2 { font-size: 54px; margin: 12px 0; } .welcome-unlock { margin-top: 8px; } .welcome-caption { display: none; } }
@media (prefers-reduced-motion: reduce) { .welcome *, .welcome *::before { animation: none !important; transition: none !important; } }
