/* D: fixed corner brand, centered growing mind map. Palette: ColorGroups.orange2. */
#nice-mind-startup {
  --surface: #fff;
  --text: #20243c;
  --muted: #7b8097;
  position: fixed;
  inset: 0;
  z-index: 10000;
  background: var(--surface);
  color: var(--text);
  font-family: "Segoe UI", "Microsoft YaHei", sans-serif;
  transition: opacity 180ms ease;
}
#nice-mind-startup.leaving { opacity: 0; pointer-events: none; }
.startup-brand {
  position: absolute;
  top: max(30px, env(safe-area-inset-top));
  left: max(30px, env(safe-area-inset-left));
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 18px;
  font-weight: 600;
  letter-spacing: -.5px;
}
.startup-brand img { width: 38px; height: 38px; border-radius: 11px; }
.startup-content {
  position: absolute;
  inset: 80px 20px 40px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.startup-map { width: min(324px, 85vw); height: auto; overflow: visible; flex-shrink: 0; }
.startup-wire { fill: none; stroke: var(--wire); stroke-width: 2; stroke-linecap: round; stroke-dasharray: 1; animation: startup-trace 4s ease-in-out infinite; }
.startup-node { fill: var(--node); animation: startup-appear 4s ease-in-out infinite; transform-box: fill-box; transform-origin: center; }
.startup-wire, .startup-node { animation-delay: var(--delay, 0s); }
.startup-root { fill: #f36b28; }
#startup-status { margin: 12px 0 0; max-width: 420px; text-align: center; color: var(--muted); font-size: 12px; line-height: 1.8; }
#startup-retry { margin-top: 18px; border: 1px solid #f36b28; border-radius: 8px; background: transparent; color: var(--text); padding: 9px 18px; cursor: pointer; font: inherit; font-size: 13px; }
#startup-retry:focus-visible { outline: 3px solid #ffad3f; outline-offset: 3px; }
#nice-mind-startup.failed .startup-wire, #nice-mind-startup.failed .startup-node { animation: none; }
@keyframes startup-trace {
  0%, 8% { stroke-dashoffset: 1; opacity: 0; }
  15% { opacity: 1; }
  40%, 78% { stroke-dashoffset: 0; opacity: 1; }
  95%, 100% { stroke-dashoffset: 0; opacity: 0; }
}
@keyframes startup-appear {
  0%, 20% { opacity: 0; transform: scale(.5); }
  37%, 78% { opacity: 1; transform: scale(1); }
  95%, 100% { opacity: 0; transform: scale(.9); }
}
@media (prefers-color-scheme: dark) {
  #nice-mind-startup { --surface: #1d202d; --text: #edf0ff; --muted: #9ca3bb; }
}
@media (max-width: 600px) {
  .startup-brand { top: max(20px, env(safe-area-inset-top)); left: max(20px, env(safe-area-inset-left)); font-size: 16px; }
  .startup-brand img { width: 32px; height: 32px; }
}
@media (prefers-reduced-motion: reduce) {
  #nice-mind-startup { transition: none; }
  .startup-wire, .startup-node { animation: none; }
}
