/* Preserve the original central neon progress bar. Logs are a borderless
   lower-left terminal, not another window or replacement loading indicator. */
#loading { --boot-ease: cubic-bezier(.16,1,.3,1); background: rgba(10,10,31,.45); pointer-events: auto; opacity: 0; transition: opacity .55s var(--boot-ease); }
#loading.boot-visible { opacity: 1; }
#loading.done { opacity: 0; pointer-events: none; transition-duration: .74s; transition-timing-function: cubic-bezier(.55,0,.3,1); }
#loading[hidden] { display: none; }
.boot-terminal { position: absolute; left: max(clamp(22px,4vw,72px),env(safe-area-inset-left)); bottom: max(clamp(24px,4vh,44px),env(safe-area-inset-bottom)); width: min(520px,44vw); padding: 0; background: none; border: 0; box-shadow: none; backdrop-filter: none; color: #bdd1df; font: 10px/1.7 'Cascadia Mono',Consolas,monospace; letter-spacing: .025em; text-shadow: 0 1px 5px #020919; }
.boot-header { display: flex; align-items: center; gap: 12px; margin: 0 0 9px; color: #a7c7d9; font-size: 8px; letter-spacing: .13em; }
.boot-header > span:last-child { color: #7a98b1; font-size: 7px; }
.boot-led { display: inline-block; width: 3px; height: 3px; margin-right: 8px; border-radius: 50%; background: #b0eff2; }
#bootLog { height: clamp(90px,17vh,160px); overflow: auto; margin: 0; padding: 0; list-style: none; scrollbar-width: none; }
#bootLog::-webkit-scrollbar { display: none; }
.boot-line { display: grid; grid-template-columns: 35px 38px minmax(0,1fr); gap: 8px; margin: 4px 0; animation: boot-line-in .28s var(--boot-ease) both; }
.boot-line time { color: #688aa1; font-size: 9px; font-variant-numeric: tabular-nums; }
.boot-tag { color: #8aa9bf; font-size: 9px; }
.boot-line.done .boot-tag { color: #afece5; }
.boot-line.warn .boot-tag { color: #d8bd94; }
.boot-line.error .boot-tag { color: #e4a2c9; }
.boot-line > span:last-child { overflow-wrap: anywhere; }
.boot-command { display: flex; gap: 9px; color: #c9deee; margin: 8px 0 0; font-size: 10px; }
.boot-command > span:first-child { color: #b0eff2; }
.boot-cursor { display: inline-block; height: 11px; width: 5px; background: #b0eff2; align-self: center; animation: boot-cursor-breathe 1.8s ease-in-out infinite; }
.boot-footer { margin-top: 5px; color: #829fb5; font-size: 8px; }
/* Independent compositor transforms keep the original bar centring intact.
   Transitions reverse from their current value if a cached boot ends early. */
#loading .boot-terminal { opacity: 0; translate: -8px 9px; transition: opacity .62s var(--boot-ease),translate .72s var(--boot-ease); }
#loading.boot-visible .boot-terminal { opacity: 1; translate: 0 0; }
#loading.done .boot-terminal { opacity: 0; translate: 0 12px; transition-duration: .44s; transition-timing-function: cubic-bezier(.55,0,1,.45); }
#loading #loadTrack { opacity: 0; scale: .86 1; translate: 0 9px; transition: opacity .55s var(--boot-ease),scale .82s var(--boot-ease),translate .82s var(--boot-ease),top .55s var(--boot-ease); }
#loading.boot-visible #loadTrack { opacity: 1; scale: 1 1; translate: 0 0; }
#loading.done #loadTrack { opacity: 0; scale: 1.035 1; translate: 0 -4px; transition-duration: .46s; transition-timing-function: cubic-bezier(.55,0,1,.45); }
#loading #loadLabel { opacity: 0; translate: 0 7px; transition: opacity .58s var(--boot-ease),translate .68s var(--boot-ease),top .55s var(--boot-ease); }
#loading.boot-visible #loadLabel { opacity: 1; translate: 0 0; }
#loading.done #loadLabel { opacity: 0; translate: 0 -4px; transition-duration: .36s; transition-timing-function: cubic-bezier(.55,0,1,.45); }
/* Original dimensions, striped cyan/magenta fill, clipped silhouette, rim
   and bloom are intentionally inherited from index.html without restyling. */
#loading #loadBar {
  transition: width .38s var(--boot-ease);
  overflow: hidden; animation: none;
}
#loading .boot-color-stream {
  position: absolute; inset: 0 auto 0 0; width: 200%; pointer-events: none;
  background: linear-gradient(90deg,#ff2bd6 0%,#c816e8 12.5%,#00f0ff 25%,#c816e8 37.5%,#ff2bd6 50%,#c816e8 62.5%,#00f0ff 75%,#c816e8 87.5%,#ff2bd6 100%);
  will-change: transform; animation: boot-color-flow 3.2s cubic-bezier(.45,0,.55,1) infinite;
}
#loading #loadTrack::after { animation: boot-track-scan 5.8s cubic-bezier(.45,0,.55,1) infinite; }
#loading #loadBar::before { background: repeating-linear-gradient(90deg,rgba(0,0,0,.22) 0 3px,transparent 3px 19px); opacity: 1; mix-blend-mode: normal; clip-path: none; animation: none; }
#loading #loadBar::after { background: linear-gradient(90deg,transparent,rgba(150,248,255,.55),transparent); opacity: 0; clip-path: none; will-change: transform,opacity; animation: boot-fill-sweep 2.8s cubic-bezier(.45,0,.55,1) infinite; }
#loading.failed .boot-color-stream,#loading.failed #loadBar::after { animation-play-state: paused; }
#loading #loadLabel { animation: none; }
#loading #loadLabel::after { animation: boot-cursor-breathe 1.8s ease-in-out infinite; }
#bootRetry { display: inline-block; margin-top: 4px; min-height: 44px; padding: 4px 0; color: #c8eef1; background: none; border: 0; border-radius: 0; font: inherit; text-decoration: underline; text-underline-offset: 5px; cursor: pointer; transition: color .3s var(--boot-ease); }
#bootRetry[hidden] { display: none; }
#bootRetry:is(:hover,:focus-visible) { color: #e4fbff; outline: 1px solid #b0eff2; outline-offset: 4px; }
#loading.failed .boot-led { background: #e4a2c9; }
#loading.ready .boot-cursor,#loading.failed .boot-cursor { animation: none; }
@keyframes boot-line-in { from { opacity: 0; transform: translateY(3px); } to { opacity: 1; transform: none; } }
@keyframes boot-cursor-breathe { 0%,100% { opacity: .2; } 50% { opacity: .85; } }
@keyframes boot-track-scan { 0%,100% { background-position: 0 0; opacity: .55; } 50% { background-position: -34px 0; opacity: 1; } }
/* GPU-composited, seamless colour flow stays alive during scene construction.
   It is clipped to the actual completed width, never a simulated progress bar. */
@keyframes boot-color-flow { from { transform: translateX(-50%); } to { transform: translateX(0); } }
@keyframes boot-fill-sweep { 0% { opacity: 0; transform: translateX(-100%); } 18%,82% { opacity: .42; } 100% { opacity: 0; transform: translateX(100%); } }
@media (max-width: 700px) { .boot-terminal { left: max(20px,env(safe-area-inset-left)); bottom: max(22px,env(safe-area-inset-bottom)); width: calc(100% - 40px); font-size: 9px; } .boot-header { font-size: 7px; letter-spacing: .08em; } .boot-header > span:last-child { font-size: 6px; } .boot-line { grid-template-columns: 30px 33px minmax(0,1fr); gap: 7px; } .boot-tag,.boot-line time { font-size: 8px; } }
@media (max-height: 500px) { .boot-terminal { bottom: max(18px,env(safe-area-inset-bottom)); width: min(470px,44vw); font-size: 9px; } #bootLog { height: 44px; } .boot-header { margin-bottom: 5px; } .boot-line { margin: 3px 0; } .boot-command { margin-top: 5px; font-size: 9px; } .boot-footer { font-size: 7px; } #loading.failed #loadTrack { top: 40%; } #loading.failed #loadLabel { top: calc(40% + 28px); } }
@media (max-width: 700px) and (max-height: 500px) { .boot-terminal { width: calc(100% - 40px); } }
@media (prefers-reduced-motion: reduce) { #loading,#loading #loadBar,#loading #loadTrack,#loading #loadLabel,#loading .boot-terminal,#bootRetry { transition: none; } .boot-line,.boot-cursor,#loading .boot-color-stream,#loading #loadBar,#loading #loadTrack::after,#loading #loadBar::before,#loading #loadBar::after,#loading #loadLabel::after { animation: none; } }