/* Заставка до первой отрисовки приложения (index.html → #boot-splash).
 * Отдельным файлом, как theme-init.js: стили бандла приходят вместе со
 * скриптом, а заставка нужна раньше. Цвета — копия токенов
 * `src/app/styles/index.css` (холст и пятна §2.2, brand, brand-tint) для обеих
 * тем; `data-theme` уже выставил theme-init.js. Снимает её
 * `shared/lib/bootSplash.ts`, когда стало известно, кто вошёл. */
#boot-splash {
  --splash-canvas: #eff1f9;
  --splash-track: #d4dbfc;
  --splash-bar: #2b4acb;
  --wash-1: rgba(43, 74, 203, 0.2);
  --wash-2: rgba(11, 125, 132, 0.12);
  --wash-3: rgba(107, 63, 160, 0.1);
  position: fixed;
  inset: 0;
  z-index: 2147483000;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 28px;
  background-color: var(--splash-canvas);
  background-image:
    radial-gradient(800px 500px at 85% -5%, var(--wash-1), transparent 60%),
    radial-gradient(700px 520px at 0% 10%, var(--wash-2), transparent 60%),
    radial-gradient(900px 600px at 50% 110%, var(--wash-3), transparent 65%);
  transition: opacity 200ms ease-out;
}
html[data-theme="dark"] #boot-splash {
  --splash-canvas: #0e0f16;
  --splash-track: #2c3661;
  --splash-bar: #9fb0f9;
  --wash-1: rgba(159, 176, 249, 0.16);
  --wash-2: rgba(63, 208, 214, 0.08);
  --wash-3: rgba(192, 162, 240, 0.08);
}
#boot-splash.is-done {
  opacity: 0;
  pointer-events: none;
}
#boot-splash .boot-splash__mark {
  width: 56px;
  height: 56px;
  border-radius: 16px;
  box-shadow: 0 12px 32px -12px rgba(43, 74, 203, 0.55);
  animation: boot-splash-breathe 1.6s ease-in-out infinite;
}
#boot-splash .boot-splash__track {
  position: relative;
  width: 120px;
  height: 3px;
  overflow: hidden;
  border-radius: 999px;
  background: var(--splash-track);
}
#boot-splash .boot-splash__bar {
  position: absolute;
  inset: 0 auto 0 0;
  width: 40%;
  border-radius: inherit;
  background: var(--splash-bar);
  animation: boot-splash-run 1.1s cubic-bezier(0.65, 0, 0.35, 1) infinite;
}
@keyframes boot-splash-breathe {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.04); }
}
@keyframes boot-splash-run {
  from { transform: translateX(-100%); }
  to { transform: translateX(250%); }
}
@media (prefers-reduced-motion: reduce) {
  #boot-splash { transition-duration: 1ms; }
  #boot-splash .boot-splash__mark { animation: none; }
  #boot-splash .boot-splash__bar { animation: none; width: 100%; opacity: 0.5; }
}