/* Startup intro overlay. The video fills the screen (cropping edges) so no letterbox bands appear on non-16:9 screens. */
#boot-intro{position:fixed;inset:0;z-index:2147483000;overflow:hidden;background:#111a24;transition:opacity .55s ease,visibility .55s}
html[data-theme="light"] #boot-intro{background:#f7f8fa}
#boot-intro video,#boot-intro img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
#boot-intro.is-done{opacity:0;visibility:hidden;pointer-events:none}
#boot-intro .boot-intro-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* CSS-drawn loader used when video autoplay is refused (e.g. iOS Low Power Mode). Geometry, colours and speeds
   match the Remotion compact loader (graphicScale .45); --u maps 1080p video pixels onto the cover-fitted screen. */
#boot-intro .boot-scene{--u:max(calc(100vw / 1920),calc(100vh / 1080));--k:.45;--p:#1fb5ac;--sec:#4a7fe0;--acc:#22d39a;--bg:#111a24;position:absolute;inset:0;overflow:hidden;background:radial-gradient(circle at 50% 46.4%,color-mix(in srgb,var(--p) 12%,transparent),transparent 32%),var(--bg);animation:boot-fade .35s ease-out both}
html[data-theme="light"] #boot-intro .boot-scene{--p:#116078;--sec:#1d4089;--acc:#028765;--bg:#f7f8fa}
#boot-intro .boot-scene::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at center,transparent 48%,color-mix(in srgb,var(--bg) 67%,transparent) 100%);pointer-events:none}
#boot-intro .boot-orbits{position:absolute;inset:0}
#boot-intro .boot-ring{position:absolute;inset:0;margin:auto;width:calc(var(--r) * 2 * var(--k) * var(--u));height:calc(var(--r) * 2 * var(--k) * var(--u));box-sizing:border-box;border:1px solid color-mix(in srgb,var(--sec) 45%,transparent);border-radius:50%;opacity:.32;animation-name:boot-spin;animation-timing-function:linear;animation-iteration-count:infinite}
/* The video scales a 1px ring to .45px; a 1px CSS line at 45% strength matches its weight. */
#boot-intro .boot-ring-1{border-color:color-mix(in srgb,var(--p) 45%,transparent)}
#boot-intro .boot-sat{position:absolute;left:50%;top:50%;width:calc(var(--d) * var(--k) * var(--u));height:calc(var(--d) * var(--k) * var(--u));margin:calc(var(--d) * var(--k) * var(--u) / -2);border-radius:50%;background:var(--p);box-shadow:0 0 calc(18 * var(--k) * var(--u)) var(--p);transform:rotate(var(--a)) translateX(calc(var(--r) * var(--k) * var(--u)))}
#boot-intro .boot-sat-alt{background:var(--acc)}
#boot-intro .boot-disc{position:absolute;inset:0;margin:auto;width:calc(440 * var(--k) * var(--u));height:calc(440 * var(--k) * var(--u));border-radius:50%;background:radial-gradient(circle,var(--bg) 45%,color-mix(in srgb,var(--p) 20%,transparent) 72%,transparent 73%)}
#boot-intro .boot-logo{position:absolute;inset:0;margin:auto;width:calc(400 * var(--k) * var(--u));height:auto;max-width:none;object-fit:initial}
html:not([data-theme="light"]) #boot-intro .boot-logo{filter:brightness(1.75) saturate(1.15)}
/* Cold start: rings build in, then the disc and logo reveal left to right (Remotion intro timing). */
#boot-intro .is-intro .boot-orbits{animation:boot-build 1.95s .27s cubic-bezier(.2,.8,.2,1) both}
#boot-intro .is-intro .boot-disc{animation:boot-disc 1.2s 1.87s cubic-bezier(.2,.8,.2,1) both}
#boot-intro .is-intro .boot-logo{-webkit-mask-image:linear-gradient(90deg,#000 45%,transparent 55%);mask-image:linear-gradient(90deg,#000 45%,transparent 55%);-webkit-mask-size:240% 100%;mask-size:240% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;animation:boot-wipe 1.2s 1.87s cubic-bezier(.65,0,.35,1) both}
@keyframes boot-spin{to{transform:rotate(360deg)}}
@keyframes boot-fade{from{opacity:0}}
@keyframes boot-build{from{transform:scale(.45);opacity:0}}
@keyframes boot-disc{from{transform:scale(.7);opacity:0}}
@keyframes boot-wipe{from{-webkit-mask-position:100% 0;mask-position:100% 0;filter:blur(6px) brightness(1.75) saturate(1.15);translate:0 8px}to{-webkit-mask-position:0 0;mask-position:0 0;translate:0 0}}
html[data-theme="light"] #boot-intro .is-intro .boot-logo{animation-name:boot-wipe-light}
@keyframes boot-wipe-light{from{-webkit-mask-position:100% 0;mask-position:100% 0;filter:blur(6px);translate:0 8px}to{-webkit-mask-position:0 0;mask-position:0 0;translate:0 0}}
