/* A quiet front door and a separate, accessible registration window. */
.site-theme[data-screen=home] .hero { min-height:calc(100svh - 230px); display:flex; align-items:center; padding:65px 54px; margin-bottom:30px; }
.site-theme[data-screen=home] .hero-copy { max-width:680px; }
.site-theme[data-screen=home] .hero-actions { margin-top:32px; gap:14px; }
.site-theme[data-screen=home] .hero-actions button { min-width:170px; min-height:48px; font-size:14px; }
.site-theme[data-screen=home] .tagline { display:none; }
.site-theme[data-screen=home] .hero-art { flex:1; min-width:230px; }
.member-actions { display:flex; align-items:center; gap:8px; margin-left:auto; }
.member-actions+.badge { margin-left:0; }
.app-welcome { display:flex; align-items:center; justify-content:space-between; gap:20px; margin:30px 0 22px; }
.app-welcome h2 { margin-bottom:0; }
.app-welcome .eyebrow { margin-bottom:8px; }
.app-welcome .world-switch { position:static; flex-shrink:0; background:var(--panel); color:var(--ink); border-color:var(--line); }
.app-welcome .world-switch-label { color:var(--muted); border-color:var(--line); }
.app-welcome .world-dot { background:var(--purple); }
#member-greeting:focus { outline:none; }
.welcome-dialog { padding:0; border:1px solid var(--line); border-radius:24px; width:min(980px,calc(100vw - 32px)); max-width:none; max-height:calc(100dvh - 32px); margin:auto; overflow:hidden; background:var(--panel); color:var(--ink); box-shadow:0 30px 130px #08051190; font-family:var(--reading-font); }
.welcome-dialog::backdrop { background:#090613bb; backdrop-filter:blur(9px); }
.welcome-window { display:grid; grid-template-columns:.83fr 1.17fr; min-height:min(650px,calc(100dvh - 32px)); }
.welcome-illustration { position:relative; overflow:hidden; background:#24162f; color:#fff; }
.welcome-illustration>img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:58% center; }
.welcome-illustration::after { content:''; position:absolute; inset:0; background:linear-gradient(180deg,#21142f3a 0%,#21132f88 40%,#160e22ec 100%); }
.welcome-art-copy { position:absolute; z-index:1; inset:auto 28px 40px; }
.welcome-art-copy .eyebrow { color:#ead6fa; font-size:8px; letter-spacing:1.6px; }
#welcome-brand { font-family:var(--display-font); color:#fff; font-size:27px; letter-spacing:-.6px; margin:0 0 32px; }
.welcome-art-copy h2 { font-size:33px; color:#fff; line-height:1.35; margin:0 0 20px; }
.welcome-art-copy h2 em { font-style:normal; color:#f7c0d9; }
.welcome-art-copy>p:last-child { color:#e4d1ee; font-size:11px; }
.welcome-form-panel { position:relative; padding:45px 36px 30px; overflow-y:auto; max-height:calc(100dvh - 32px); overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:var(--line) transparent; }
.welcome-close { position:absolute; top:12px; right:13px; height:32px; width:32px; display:grid; place-items:center; padding:0; border:1px solid var(--line); border-radius:50%; color:var(--muted); background:var(--panel); font-size:23px; line-height:1; z-index:2; }
.welcome-kicker { color:var(--purple); letter-spacing:1.8px; font-size:8px; font-weight:700; text-transform:uppercase; margin:4px 0 9px; }
#welcome-title { font-size:30px; line-height:1.3; margin:0 0 19px; }
#welcome-title:focus { outline:none; }
.welcome-lead { color:var(--muted); font-size:13px; line-height:1.75; margin:0 0 22px; }
.welcome-progress { padding:0; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:6px; margin:0 0 25px; list-style:none; }
.welcome-progress li { position:relative; display:flex; flex-direction:column; gap:7px; align-items:center; text-align:center; color:var(--muted); font-size:9px; }
.welcome-progress li>span { display:grid; place-items:center; width:27px; height:27px; border:1px solid var(--line); border-radius:50%; font-size:10px; background:var(--field); }
.welcome-progress .current { color:var(--purple); }
.welcome-progress .current>span { background:var(--purple); color:var(--button-ink); border-color:var(--purple); }
.welcome-progress .done>span { border-color:var(--purple); color:var(--purple); }
.welcome-progress small { font-size:9px; line-height:1.5; }
.contact-methods { display:grid; grid-template-columns:1fr 1fr; gap:7px; background:var(--field); border:1px solid var(--line); border-radius:11px; padding:5px; margin-bottom:22px; }
.contact-methods button { min-height:40px; border:1px solid transparent; border-radius:7px; background:transparent; color:var(--muted); font-size:12px; font-weight:650; }
.contact-methods button[aria-pressed=true] { background:var(--tint); border-color:var(--purple); color:var(--ink); }
#welcome-form label { font-size:12px; margin-top:12px; }
#welcome-form input,#welcome-form select { min-height:45px; font-size:13px; }
#welcome-form #contact-help { font-size:10px; line-height:1.65; margin:8px 0 20px; }
.welcome-preview-note { padding:13px 14px; border:1px solid var(--line); border-radius:10px; background:var(--field); font-size:10px; margin-bottom:20px; line-height:1.7; }
.welcome-preview-note strong { color:var(--purple); font-size:10px; font-weight:650; }
.welcome-preview-note p { color:var(--muted); margin:5px 0 0; }
.welcome-next { display:flex; align-items:center; justify-content:space-between; width:100%; padding:13px 18px; min-height:47px; }
.welcome-switch { text-align:center; font-size:11px; color:var(--muted); margin:19px 0; }
.text-button { border:0; background:none; color:var(--purple); font-size:inherit; font-weight:650; padding:3px; text-decoration:underline; text-underline-offset:3px; }
.welcome-adult { color:var(--muted); font-size:9px; text-align:center; margin:0; }
.welcome-error { font-size:12px; line-height:1.7; color:var(--danger); border-left:2px solid var(--danger); padding:8px 12px; margin-top:16px; background:var(--field); }
.welcome-modes { display:grid; gap:9px; margin-bottom:21px; }
.welcome-mode { text-align:left; display:flex; gap:12px; align-items:center; border:1px solid var(--line); padding:13px 15px; border-radius:11px; background:var(--field); color:var(--ink); }
.welcome-mode[aria-pressed=true] { border-color:var(--purple); background:var(--tint); }
.welcome-mode strong { display:block; font-size:12px; }
.welcome-mode small { display:block; color:var(--muted); font-size:10px; line-height:1.65; margin-top:3px; }
.mode-radio { height:15px; width:15px; border:1px solid var(--line); border-radius:50%; flex-shrink:0; }
[aria-pressed=true]>.mode-radio { border:4px solid var(--purple); background:var(--panel); }
.welcome-basics-grid { display:grid; grid-template-columns:1.5fr 1fr; gap:14px; }
.welcome-location { margin-top:23px; padding-top:22px; border-top:1px solid var(--line); }
.welcome-location h3 { font-size:16px; margin-bottom:7px; }
.welcome-location .small { font-size:11px; }
.welcome-location .welcome-basics-grid { grid-template-columns:1fr 1fr; }
.welcome-form-actions { display:flex; justify-content:space-between; gap:13px; border-top:1px solid var(--line); padding-top:21px; margin-top:25px; }
.welcome-form-actions button { min-height:43px; padding:11px 18px; }
.welcome-spheres { display:flex; flex-wrap:wrap; gap:8px; }
.welcome-spheres button { color:var(--ink); background:var(--field); border:1px solid var(--line); border-radius:25px; font-size:11px; min-height:37px; padding:8px 13px; }
.welcome-spheres button[aria-pressed=true],.welcome-interests button[aria-pressed=true] { border-color:var(--purple); background:var(--tint); color:var(--purple); }
.welcome-spheres button[aria-pressed=true]::before,.welcome-interests button[aria-pressed=true]::before { content:'✓ '; }
.welcome-more { margin:17px 0; padding-bottom:15px; border-bottom:1px solid var(--line); }
.welcome-more>summary { cursor:pointer; font-size:11px; color:var(--purple); margin-bottom:12px; }
.welcome-selection-count { font-size:10px; line-height:1.7; }
.welcome-interest-group { background:var(--field); border:1px solid var(--line); border-radius:12px; padding:15px; margin:12px 0; }
.welcome-interest-group h3 { font-size:15px; margin-bottom:4px; }
.welcome-interest-group .suggestions { gap:7px; }
.welcome-interest-group .suggestions button { font-size:10px; min-height:31px; }
.font-arcade #welcome-title { font-size:21px; line-height:1.7; }
.font-arcade #welcome-brand { font-size:21px; }
.font-arcade .welcome-art-copy h2 { font-size:19px; line-height:1.9; }
.font-arcade .welcome-location h3,.font-arcade .welcome-interest-group h3 { font-size:12px; }
.world-pixel .welcome-dialog,.world-pixel .welcome-mode,.world-pixel .contact-methods,.world-pixel .welcome-interest-group { border-radius:7px; }
.world-pixel .welcome-art-copy h2 em { color:#b2f2e9; }
@media(max-width:1000px) { .site-theme[data-screen=home] .hero { padding:50px 38px; } .site-header .tagline { display:none; } .welcome-form-panel { padding:45px 28px 27px; } .welcome-art-copy { left:24px; right:24px; } .welcome-art-copy h2 { font-size:29px; } }
@media(max-width:700px) { .site-theme[data-screen=home] .hero { min-height:calc(100svh - 205px); padding:45px 26px; display:block; align-content:center; } .site-theme[data-screen=home] .hero-art { display:none; } .site-theme[data-screen=home] .hero-actions { gap:12px; } .site-theme[data-screen=home] .hero-actions button { min-width:150px; min-height:45px; font-size:12px; } .app-welcome { align-items:flex-start; flex-direction:column; } .member-actions { gap:0; } .member-actions .quiet { padding:7px; } .member-actions .secondary { font-size:10px; padding:9px; } .site-theme[data-screen=app] .site-header>.badge { display:none; } .welcome-dialog { width:calc(100vw - 22px); max-height:calc(100dvh - 22px); border-radius:17px; } .welcome-window { display:block; min-height:0; } .welcome-illustration { display:none; } .welcome-form-panel { padding:43px 23px 25px; max-height:calc(100dvh - 22px); } #welcome-title { font-size:28px; } .welcome-progress { margin-bottom:23px; } .welcome-lead { font-size:12px; } }
@media(max-width:400px) { .site-theme[data-screen=home] .hero { padding:37px 21px; } .site-theme[data-screen=home] .hero-actions { align-items:stretch; } .site-theme[data-screen=home] .hero-actions button { width:100%; } .welcome-form-panel { padding-left:18px; padding-right:18px; } .welcome-basics-grid { gap:10px; grid-template-columns:1.3fr 1fr; } .welcome-location .welcome-basics-grid { grid-template-columns:1fr; gap:0; } .welcome-progress small { font-size:8px; } .member-actions .quiet { font-size:10px; } }