.welcome-dialog{position:fixed;inset:0;width:100%;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;border-radius:0;background:var(--color-bg);color:var(--color-text);overflow:hidden;font-family:var(--font-ui)}
.welcome-dialog::backdrop{background:var(--color-bg);backdrop-filter:none}
.welcome-shell{display:grid;grid-template-rows:minmax(0,1fr) auto;height:100%;margin:0}
.welcome-scroll{min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:max(24px,env(safe-area-inset-top)) 20px 20px;scroll-padding-block:20px;scrollbar-width:thin;scrollbar-color:var(--color-border) transparent}
.welcome-content{width:min(100%,820px);margin:0 auto}
.welcome-header{margin-bottom:24px;text-align:center}
.welcome-heading-logo{display:inline-block;vertical-align:-.035em;line-height:0}
.welcome-wordmark{display:block;width:3.05em;height:.98em;color:var(--color-text)}
.welcome-heading{margin:0 auto;font-size:clamp(32px,5.5vw,48px);line-height:1.05;font-weight:700;letter-spacing:-.035em;text-wrap:balance}
.welcome-heading:focus{outline:none}
.welcome-subtitle{margin-top:10px;color:var(--color-text-secondary);font-size:16px;line-height:1.4}
.welcome-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:clamp(100px,14dvh,140px);gap:10px}
.welcome-tile{position:relative;isolation:isolate;grid-column:span 2;min-width:0;width:100%;padding:0;overflow:hidden;border:1px solid var(--color-border);border-radius:var(--radius-card);background:var(--color-sheet);color:var(--color-text);text-align:left;transition:border-color var(--duration-fast),transform var(--duration-fast)}
.welcome-tile:nth-child(5n+1){grid-row:span 2}
.welcome-tile[hidden]{display:none}
.welcome-tile img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 38%}
.welcome-tile-copy{position:absolute;inset:auto 0 0;display:grid;gap:2px;min-height:34px;padding:28px 10px 9px;background:linear-gradient(0deg,rgb(0 0 0 / .94),rgb(0 0 0 / .82) 56%,transparent);color:var(--color-text)}
.welcome-tile-label{font-size:15px;line-height:1.2;font-weight:500;overflow-wrap:anywhere;text-wrap:balance}
.welcome-tile:nth-child(5n+1) .welcome-tile-label{font-size:22px;line-height:1.1;letter-spacing:-.02em}
.welcome-related{font-size:12px;line-height:1.25;color:var(--color-text-secondary)}
.welcome-choice{position:absolute;top:9px;right:9px;display:grid;place-items:center;width:24px;height:24px;border:1px solid var(--color-control-border);border-radius:50%;background:var(--color-bg);color:var(--color-text-on-accent)}
.welcome-choice svg{width:18px;height:18px;opacity:0}
.welcome-tile[aria-pressed=true]{border-color:var(--color-accent)}
.welcome-tile[aria-pressed=true] .welcome-choice{border-color:var(--color-accent);background:var(--color-accent)}
.welcome-tile[aria-pressed=true] .welcome-choice svg{opacity:1}
.welcome-tile:hover{border-color:var(--color-accent)}
.welcome-tile:active{transform:scale(.98)}
.welcome-tile:focus-visible{outline:2px solid var(--color-accent);outline-offset:-4px}
.welcome-tile:disabled{opacity:.75;cursor:default}
.welcome-tile.is-image-unavailable{background:var(--color-sheet) url('../assets/brand/pattern-orange.svg') center/220px}
.welcome-more{display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;margin:14px auto 0;padding:10px 22px;border:1px solid var(--color-border);border-radius:var(--radius-pill);font-size:14px;line-height:1.4;color:var(--color-text-secondary)}
.welcome-more svg{width:18px;height:18px}
.welcome-more:hover{border-color:var(--color-accent);color:var(--color-text)}
.welcome-more:disabled{opacity:.55}
.welcome-footer{padding:12px 20px max(20px,env(safe-area-inset-bottom));background:var(--color-bg)}
.welcome-footer-content{width:min(100%,520px);margin:0 auto}
.welcome-hint{min-height:20px;margin:0 0 12px;font-size:13px;line-height:1.45;color:var(--color-text-secondary);text-align:center;text-wrap:balance}
.welcome-error{margin:0 0 12px;font-size:14px;line-height:1.45;color:var(--color-error);text-align:center}
.welcome-start{position:relative;isolation:isolate;display:flex;align-items:center;justify-content:center;gap:12px;width:100%;min-height:58px;padding:15px 20px;border:0;border-radius:var(--radius-pill);background:var(--color-accent);color:var(--color-text-on-accent);--brand-accent:currentColor;font-size:17px;line-height:1.4;font-weight:500;box-shadow:0 6px 24px rgb(var(--color-accent-rgb) / .22);animation:welcome-breathe 3.8s ease-in-out infinite;transition:transform var(--duration-fast),background var(--duration-fast)}
.welcome-start:hover{background:var(--color-accent-hover)}
.welcome-start:active{transform:scale(.985);background:var(--color-accent-pressed)}
.welcome-start:disabled{opacity:1;animation:none;box-shadow:none;background:var(--color-elevated);color:var(--color-text-secondary);cursor:wait}
.welcome-play{width:24px;height:24px;flex:none}
.welcome-dialog :is(button,a){scroll-margin-block:12px}
.welcome-dialog ::selection{background:var(--color-accent);color:var(--color-text-on-accent)}
@keyframes welcome-breathe{0%,100%{box-shadow:0 6px 22px rgb(var(--color-accent-rgb) / .18)}50%{box-shadow:0 8px 34px rgb(var(--color-accent-rgb) / .32)}}
@media(min-width:760px){.welcome-scroll{padding-top:32px}.welcome-header{margin-bottom:28px}.welcome-grid{grid-auto-rows:140px;gap:14px}.welcome-tile-copy{padding:32px 14px 10px}.welcome-tile-label{font-size:18px}.welcome-tile:nth-child(5n+1) .welcome-tile-label{font-size:28px}.welcome-footer{padding-top:16px;padding-bottom:28px}}
@media(max-width:360px){.welcome-scroll{padding:20px 16px 16px}.welcome-header{margin-bottom:20px}.welcome-heading{font-size:30px}.welcome-subtitle{margin-top:8px;font-size:15px}.welcome-grid{grid-auto-rows:90px;gap:8px}.welcome-tile-label{font-size:14px}.welcome-tile:nth-child(5n+1) .welcome-tile-label{font-size:20px}.welcome-tile-copy{padding:26px 8px 8px}.welcome-choice{width:22px;height:22px;top:7px;right:7px}.welcome-related{font-size:12px}.welcome-footer{padding-inline:16px}.welcome-hint{font-size:12px}.welcome-start{min-height:56px;font-size:16px}}
@media(max-height:500px) and (orientation:landscape){.welcome-scroll{padding-top:16px}.welcome-header{margin-bottom:16px}.welcome-heading{font-size:28px}.welcome-subtitle{font-size:14px;margin-top:6px}.welcome-grid{grid-auto-rows:92px}.welcome-footer{padding-top:8px;padding-bottom:max(12px,env(safe-area-inset-bottom))}.welcome-hint{margin-bottom:8px}.welcome-start{min-height:50px;padding-block:12px}}
@media(prefers-reduced-motion:reduce){.welcome-start{animation:none;box-shadow:0 6px 24px rgb(var(--color-accent-rgb) / .22)}.welcome-tile,.welcome-start{transition:none}}
