body { margin: 0; padding: 0; }

.splash-screen {
  position: absolute;
  z-index: 1000;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  background-color: #f5f5f5;
  gap: 10px;
}

/* Brand */
.splash-brand {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  line-height: 1;
}
.splash-brand__line {
  display: flex;
  align-items: baseline;
  gap: 8px;
}
.splash-brand__name {
  color: #ee2329;
  font-size: 2rem;
  font-weight: 800;
  letter-spacing: 0;
}
.splash-brand__accent {
  color: #0e0e0e;
  font-size: 2rem;
  font-weight: 800;
  letter-spacing: 0;
}
.splash-brand__tagline {
  color: #666;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.12em;
}

/* Status */
.splash-status {
  font-size: 0.72rem;
  color: #c4c9d4;
  letter-spacing: 0.03em;
  margin: 4px 0 0;
}

/* Spinner */
.splash-spinner {
  animation: splash-rotate 1.6s linear infinite;
  width: 26px;
  height: 26px;
}
.splash-spinner .path {
  stroke: #e91e2d;
  stroke-linecap: round;
  animation: splash-dash 1.5s ease-in-out infinite;
}

@keyframes splash-rotate {
  100% { transform: rotate(360deg); }
}
@keyframes splash-dash {
  0%   { stroke-dasharray: 1, 150;  stroke-dashoffset: 0; }
  50%  { stroke-dasharray: 90, 150; stroke-dashoffset: -35; }
  100% { stroke-dasharray: 90, 150; stroke-dashoffset: -124; }
}

#root {
  opacity: 1;
  transition: opacity 1s ease-in-out;
}
