/* Shared building preloader art — colors via --bp-* set per instance (tenant vs platform). */
.boot-preloader {
  --bp-primary: #696cff;
  --bp-stroke: #a8aaef;
  --bp-win: #ffab00;
  --bp-door: rgba(168, 170, 239, 0.18);
  --bp-beacon: #ff3e1d;
  --bp-glow: rgba(105, 108, 255, 0.45);
  --bp-bar-track: rgba(168, 170, 239, 0.16);
  --bp-bar-fill: #696cff;
  --bp-sub: #c8c9f5;
  --bp-bg: radial-gradient(1200px 600px at 50% 28%, #2b2c66 0%, #141528 58%, #0a0a14 100%);
  position: fixed;
  inset: 0;
  z-index: 2147483647;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--bp-bg);
  font-family: "Outfit", system-ui, -apple-system, "Segoe UI", Tahoma, sans-serif;
  opacity: 0;
  transition: opacity 0.35s ease, visibility 0.55s ease;
}

.boot-preloader[hidden] {
  display: none !important;
}

.boot-preloader.boot-preloader--ready {
  opacity: 1;
}

.boot-preloader.boot-preloader--hide {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.boot-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 18px;
  padding: 0 24px;
  text-align: center;
}

.boot-scene {
  position: relative;
  width: 170px;
  height: 170px;
}

.boot-glow {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: radial-gradient(circle at 50% 55%, var(--bp-glow), transparent 62%);
  filter: blur(6px);
  animation: boot-glow 3.2s ease-in-out infinite;
}

.boot-svg {
  position: relative;
  width: 170px;
  height: 170px;
  animation: boot-float 3.4s ease-in-out infinite;
}

.boot-stroke {
  fill: none;
  stroke: var(--bp-stroke);
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.boot-draw {
  stroke-dasharray: 1;
  stroke-dashoffset: 1;
  animation: boot-draw 1s ease forwards;
  animation-delay: var(--d, 0s);
}

.boot-win {
  fill: var(--bp-win);
  opacity: 0;
  animation: boot-light 0.5s ease forwards;
  animation-delay: var(--d, 1s);
}

.boot-door {
  fill: var(--bp-door);
}

.boot-beacon {
  fill: var(--bp-beacon);
  animation: boot-pulse 1.2s ease-in-out infinite;
}

@keyframes boot-draw { to { stroke-dashoffset: 0; } }
@keyframes boot-light { from { opacity: 0; } to { opacity: 0.95; } }
@keyframes boot-pulse { 0%, 100% { opacity: 0.25; } 50% { opacity: 1; } }
@keyframes boot-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-9px); } }
@keyframes boot-glow { 0%, 100% { opacity: 0.55; transform: scale(0.95); } 50% { opacity: 1; transform: scale(1.05); } }

.boot-brand-block {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  max-width: min(92vw, 420px);
}

.boot-brand {
  font-size: clamp(26px, 5vw, 36px);
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.15;
  color: #ffffff;
  opacity: 0;
  animation: boot-in 0.8s ease 0.45s forwards;
}

.boot-brand-accent {
  color: var(--bp-primary);
  font-weight: 800;
}

.boot-brand-single {
  background: linear-gradient(135deg, #ffffff 0%, var(--bp-primary) 120%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.boot-brand-line {
  width: 52px;
  height: 3px;
  border-radius: 99px;
  background: linear-gradient(90deg, var(--bp-primary), transparent);
  opacity: 0;
  animation: boot-in 0.8s ease 0.55s forwards;
}

.boot-sub {
  font-size: 13px;
  font-weight: 500;
  color: var(--bp-sub);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  opacity: 0;
  animation: boot-in 0.8s ease 0.75s forwards;
}

@keyframes boot-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }

.boot-bar {
  width: 190px;
  height: 4px;
  border-radius: 99px;
  background: var(--bp-bar-track);
  overflow: hidden;
}

.boot-bar span {
  display: block;
  height: 100%;
  width: 42%;
  border-radius: 99px;
  background: linear-gradient(
    90deg,
    transparent,
    var(--bp-bar-fill),
    color-mix(in srgb, var(--bp-bar-fill) 70%, white),
    var(--bp-bar-fill),
    transparent
  );
  animation: boot-slide 1.25s ease-in-out infinite;
}

@keyframes boot-slide { 0% { transform: translateX(-130%); } 100% { transform: translateX(330%); } }

@media (prefers-reduced-motion: reduce) {
  .boot-svg, .boot-glow, .boot-beacon, .boot-bar span { animation: none; }
  .boot-draw { stroke-dashoffset: 0; }
  .boot-win { opacity: 0.95; animation: none; }
  .boot-brand, .boot-brand-line, .boot-sub { opacity: 1; animation: none; }
}