/* The chooser is shared by both experiences and never inherits an OS theme. */
html.welcome-active, .welcome-active body { background: #fafafa; overflow: hidden; }
.welcome-active body > :not(.welcome):not(.os-boot):not(script) { visibility: hidden; }
.welcome {
    position: fixed; inset: 0; width: 100%; max-width: none; height: 100dvh; max-height: none;
    margin: 0; border: 0; padding: 64px 28px; box-sizing: border-box; overflow: auto;
    background: #fafafa; color: #191919; color-scheme: light;
    font: 16px/1.6 -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", Helvetica, Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
}
.welcome[open] { display: flex; align-items: center; justify-content: center; }
.welcome::backdrop { background: #fafafa; }
.welcome-inner { width: 100%; max-width: 820px; margin-block: auto; }
.welcome-identity { margin: 0 0 24px; color: #626262; font-size: 13px; }
.welcome h1 { max-width: 640px; margin: 0; color: #191919; font-size: clamp(32px, 4vw, 48px); font-weight: 500; line-height: 1.12; letter-spacing: -.045em; }
.welcome h1:focus { outline: none; }
.welcome-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; margin-top: 40px; }
.welcome-choice { display: flex; flex-direction: column; align-items: start; min-width: 0; padding: 28px; border: 1px solid #ddd; border-radius: 12px; background: #fff; color: #191919; text-decoration: none; transition: border-color 180ms ease, box-shadow 180ms ease; }
.welcome-choice:hover { border-color: #999; box-shadow: 0 8px 28px #00000006; }
.welcome-choice:focus-visible { outline: 2px solid #191919; outline-offset: 5px; }
.welcome-icon { display: grid; place-items: center; width: 44px; height: 44px; margin-bottom: 28px; border-radius: 10px; background: #222; color: #fff; font-size: 23px; font-weight: 600; line-height: 1; }
.welcome-icon--page { background: #f1f1f1; color: #333; }
.welcome-icon svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }
.welcome h2 { margin: 0; color: #191919; font-size: 23px; font-weight: 500; line-height: 1.3; letter-spacing: -.025em; }
.welcome-description { display: block; margin: 12px 0 28px; font-size: 15px; color: #626262; line-height: 1.6; }
.welcome-action { display: flex; align-items: center; justify-content: space-between; align-self: stretch; gap: 20px; margin-top: auto; padding-top: 20px; border-top: 1px solid #eee; font-size: 13px; }
@media (max-width: 600px) {
    .welcome { padding: 36px 20px; }
    .welcome-options { grid-template-columns: 1fr; gap: 16px; margin-top: 28px; }
    .welcome-choice { padding: 22px; }
    .welcome-icon { margin-bottom: 16px; }
    .welcome-description { margin-bottom: 20px; }
}
@media (prefers-reduced-motion: reduce) { .welcome-choice { transition: none; } }
