@font-face {
  font-family: 'Instrument Sans';
  font-style: normal;
  font-display: swap;
  font-weight: 400 700;
  src: url('/fonts/instrument-sans-latin-wght-normal.woff2') format('woff2');
}

main.workspace-loading-screen {
  --workspace-loader-bg: var(--gf-color-bg, #08090b);
  --workspace-loader-text: var(--gf-color-text, #eceef1);
  --workspace-loader-muted: var(--gf-color-text-secondary, #9aa0ab);
  --workspace-loader-border: var(--gf-color-border, rgba(255, 255, 255, .09));
  --workspace-loader-accent: var(--gf-color-accent, #f6821f);
  position: relative;
  isolation: isolate;
  box-sizing: border-box;
  display: grid;
  place-items: center;
  min-height: 100dvh;
  padding: 40px 24px;
  overflow: hidden;
  color: var(--workspace-loader-text);
  background: var(--workspace-loader-bg);
  font-family: var(--gf-font-sans, 'Instrument Sans', system-ui, sans-serif);
  -webkit-font-smoothing: antialiased;
}

:root[data-theme="light"] .workspace-loading-screen {
  --workspace-loader-bg: var(--gf-color-bg, #fff);
  --workspace-loader-text: var(--gf-color-text, #18212f);
  --workspace-loader-muted: var(--gf-color-text-secondary, #4d596b);
  --workspace-loader-accent: var(--gf-color-accent, #b84f00);
  --workspace-loader-border: var(--gf-color-border, rgba(17, 24, 39, .1));
}

body:has(> #root > .workspace-loading-screen) { margin: 0; }

.workspace-loading-scaffold {
  position: absolute;
  z-index: -1;
  width: min(880px, calc(100% - 64px));
  height: auto;
  max-height: calc(100dvh - 72px);
  stroke: var(--workspace-loader-border);
  stroke-width: 1;
  mask-image: radial-gradient(ellipse 42% 62% at 50% 54%, transparent 30%, #000 100%);
}

.workspace-loading-scaffold .workspace-scaffold-line {
  stroke-width: 5;
  stroke-linecap: round;
  opacity: .8;
}

.workspace-loading-content {
  width: min(100%, 360px);
  text-align: center;
}

.workspace-loading-signal {
  --workspace-signal-phase: .25;
  --workspace-signal-energy: 1;
  position: relative;
  display: block;
  width: 164px;
  height: 128px;
  margin: 0 auto 18px;
  color: var(--workspace-loader-accent);
}

.workspace-loading-signal::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: -48px;
  background: radial-gradient(ellipse, color-mix(in srgb, currentColor 7%, transparent), transparent 68%);
}

.workspace-loading-signal svg { display: block; width: 100%; height: 100%; overflow: visible; }
.workspace-signal-grid { stroke: var(--workspace-loader-border); stroke-width: 1; opacity: .6; }
.workspace-signal-halo { stroke: currentColor; stroke-width: 1; opacity: .07; }
.workspace-signal-wire { stroke: currentColor; stroke-width: 3; stroke-linecap: round; opacity: .24; }
.workspace-signal-flow { stroke: currentColor; stroke-width: 3; stroke-linecap: round; stroke-dasharray: 26 74; stroke-dashoffset: calc(var(--workspace-signal-phase) * -100); }
.workspace-signal-branch { stroke-dashoffset: calc(var(--workspace-signal-phase) * -100 - 50); }
.workspace-signal-node { stroke: currentColor; stroke-width: 2; fill: var(--workspace-loader-bg); }
.workspace-signal-destination { fill: color-mix(in srgb, currentColor 9%, var(--workspace-loader-bg)); }
.workspace-signal-core { fill: currentColor; opacity: calc(.35 + var(--workspace-signal-energy) * .65); }

.workspace-loading-brand {
  font-size: 29px;
  font-weight: 650;
  letter-spacing: -1.1px;
  line-height: 1.2;
}

.workspace-loading-status h1 {
  margin: 26px 0 7px;
  color: var(--workspace-loader-text);
  font-size: 14px;
  font-weight: 500;
  letter-spacing: -.1px;
  line-height: 1.5;
}

.workspace-loading-status p {
  margin: 0;
  color: var(--workspace-loader-muted);
  font-size: 12px;
  font-weight: 400;
  line-height: 1.6;
}

@media (max-width: 540px) {
  .workspace-loading-scaffold { width: 690px; max-width: none; opacity: .55; }
  .workspace-loading-content { padding: 20px 0; }
}

@media (prefers-reduced-motion: reduce) {
  .workspace-signal-flow { stroke-dasharray: none; opacity: .5; }
  .workspace-signal-core { opacity: 1; }
}