#startup-intro { position: fixed; inset: 0; z-index: 1000; overflow: hidden; isolation: isolate; background: var(--background); opacity: 1; transition: opacity 2000ms ease; }
.native-window #startup-intro { clip-path: inset(0 round var(--window-radius, 26px)); }
#startup-intro .intro-background { position: absolute; top: 0; left: 50%; height: 100%; width: auto; max-width: none; transform: translateX(-50%); }
#startup-intro .intro-logo { position: absolute; top: 8%; left: 50%; width: min(98vw, 55.125dvh); height: auto; transform: translateX(-50%); mix-blend-mode: screen; opacity: 0; transition: opacity 2500ms ease; }
#startup-intro img { user-select: none; -webkit-user-drag: none; }
#startup-intro.logo-visible .intro-logo { opacity: 1; }
#startup-intro.is-leaving { opacity: 0; pointer-events: none; }
#startup-intro .intro-start { position: absolute; bottom: 9%; left: 50%; transform: translateX(-50%); width: min(88vw, 440px); min-height: 96px; padding: 24px; border: 0; background: transparent; color: var(--foreground); font: 500 14px/1.5 var(--font-sans); letter-spacing: .22em; white-space: nowrap; opacity: 0; visibility: hidden; transition: opacity 1500ms ease; cursor: pointer; text-shadow: 0 1px 8px var(--background); isolation: isolate; }
#startup-intro .intro-start::before { content: ''; position: absolute; inset: -8px -12px; z-index: -1; background: radial-gradient(ellipse, color-mix(in srgb, var(--background) 28%, transparent), color-mix(in srgb, var(--background) 12%, transparent) 45%, transparent 72%); filter: blur(8px); pointer-events: none; }
#startup-intro.can-start .intro-start { opacity: .85; visibility: visible; }
#startup-intro.can-start.is-leaving .intro-start { opacity: 0; }
#startup-intro .intro-error { position: absolute; inset: auto 8% 8%; padding: 16px; color: var(--foreground); background: var(--surface); border-radius: var(--radius-lg); }
#startup-intro .intro-error button { display: block; margin-top: 12px; }
#startup-intro .intro-window-corner { position: absolute; top: 0; right: 0; width: 72px; height: 64px; }
#startup-intro .intro-close { position: absolute; top: var(--scene-inset, 8px); right: var(--scene-inset, 8px); width: 36px; height: 36px; padding: 0; display: grid; place-items: center; border: 0; border-radius: var(--control-radius, 18px); background: var(--mobile-control-bg); color: var(--foreground); backdrop-filter: blur(18px); opacity: 0; pointer-events: none; transition: opacity 200ms ease; cursor: pointer; }
#startup-intro .intro-window-corner:hover .intro-close, #startup-intro .intro-window-corner:focus-within .intro-close { opacity: 1; pointer-events: auto; }
@media (prefers-reduced-motion: reduce) { #startup-intro, #startup-intro .intro-logo { transition-duration: 0s; } }
