/* Current Connect startup storyboard, shared by session intro and Settings preview. */
.startup-preview{position:fixed;inset:0;z-index:1000;width:100%;height:100dvh;display:grid;place-items:center;background:#fff;color:#164e33;color-scheme:light;isolation:isolate;overflow:hidden;overflow:clip;outline:none;touch-action:none}
.startup-preview .connect-splash-scene{position:relative;width:min(88vw,420px,70dvh);aspect-ratio:1;contain:layout;pointer-events:none;user-select:none}
.startup-preview .connect-splash-action,.startup-preview .connect-splash-flight,.startup-preview .connect-splash-connection{position:absolute;inset:0}
.startup-preview .connect-splash-flight{z-index:2;transform-origin:50% 55%}
.startup-preview .connect-splash-eagle{position:absolute;left:10%;top:5%;width:80%;height:auto;aspect-ratio:384/246;object-fit:contain}
.startup-preview .connect-splash-ball{position:absolute;left:43%;top:51%;width:14%;height:auto;aspect-ratio:1;object-fit:contain;transform-origin:center bottom}
.startup-preview .connect-splash-pulse{position:absolute;left:9%;top:74%;width:82%;height:16%;border:2px solid #48b82b;border-radius:50%;box-shadow:0 0 9px #88d73c55,inset 0 0 6px #88d73c33;z-index:1}
.startup-preview .connect-splash-line-position{position:absolute;left:50%;top:80%;height:2px;transform-origin:left center}
.startup-preview .connect-splash-line{display:block;height:100%;width:100%;background:#65b32e;transform-origin:left center;border-radius:2px}
.startup-preview .connect-splash-golfer-position{position:absolute;width:11%;aspect-ratio:1;transform:translate(-50%,-50%)}
.startup-preview .connect-splash-golfer{width:100%;height:100%;object-fit:contain}
.startup-preview .startup-splash-logo{position:absolute;display:block;width:96%;height:auto;max-height:96%;left:2%;top:4%;aspect-ratio:372/349;object-fit:contain;pointer-events:none;user-select:none;transform-origin:center;z-index:3}
.startup-preview .startup-splash-skip{padding:10px 16px;min-height:44px;border:1px solid #d1d5db;border-radius:8px;background:#fff;color:#164e33;font-size:12px;cursor:pointer;transition:background-color .15s,border-color .15s}
.startup-preview .startup-splash-skip:hover{background:#f0fdf4;border-color:#16814a}.startup-preview .startup-splash-skip:focus-visible{outline:2px solid #059669;outline-offset:3px}
@media(max-height:440px){.startup-preview .connect-splash-scene{width:min(62vw,62dvh)}}
@media(prefers-reduced-motion:reduce){.startup-preview .startup-splash-skip{transition:none}}

.startup-preview .startup-splash-controls{position:absolute;left:50%;bottom:max(20px,env(safe-area-inset-bottom));transform:translateX(-50%);display:grid;justify-items:center;gap:8px;width:min(420px,calc(100% - 32px));text-align:center}
.startup-preview .startup-splash-preference{display:flex;align-items:center;justify-content:center;gap:9px;min-height:44px;padding:4px 10px;border-radius:8px;font-size:12px;line-height:18px;cursor:pointer}
.startup-preview .startup-splash-preference input{width:18px;height:18px;margin:0;flex-shrink:0;accent-color:#246d43;cursor:pointer}
.startup-preview .startup-splash-preference input:focus-visible{outline:2px solid #059669;outline-offset:4px}
.startup-preview .startup-splash-preference-note{margin:0;color:#627467;font-size:11px;line-height:17px}
.startup-preview--with-options .connect-splash-scene{width:min(88vw,420px,calc(100dvh - 200px));transform:translateY(-35px)}
@media(max-height:440px){.startup-preview .startup-splash-controls{bottom:8px;gap:4px}.startup-preview--with-options .connect-splash-scene{width:min(62vw,48dvh);transform:translateY(-40px)}}