/* AlloyScape design tokens — one source of truth for the UI.
 *
 * The system is built on a duality drawn from the process itself:
 *   COLD (arc blue)  = structure, navigation, geometry, selection.
 *   HOT  (weld amber) = energy, heat, motion, anything wanting attention.
 * Neutrals are biased blue (not grey) so the dark ground reads as steel.
 * Monospace is the "machine voice" — labels, indices, telemetry.
 *
 * Linked first on every page; page stylesheets consume these vars and never
 * redefine the palette. Dark is the product's committed identity. */

:root {
  color-scheme: dark;

  /* neutrals — blue-black steel, not grey */
  --bg:      #0b0d11;
  --panel:   #161a22;
  --panel2:  #1e242e;
  --panel3:  #252d3a;
  --line:    #2a313d;
  --line-soft:#1f2530;
  --ink:     #e7eaf1;
  --ink2:    #c2c8d4;
  --dim:     #949daf;
  --mute:    #5b6473;

  /* cold = structure / primary */
  --accent:      #4da3ff;
  --accent2:     #2f6fe0;   /* CTA / brand steel-blue */
  --accent-soft: #7cbcff;

  /* hot = energy / attention */
  --hot:      #ff8a42;
  --hot-deep: #f2691f;
  --hot-soft: #ffb27a;

  /* admin surface marker */
  --admin: #b98cff;

  /* semantic (separate from the accent hues) */
  --good: #46cf86;
  --warn: #ffb454;
  --bad:  #ff6b6b;

  /* type */
  --mono: ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas, monospace;
  --sans: -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, Helvetica, Arial, sans-serif;

  /* spacing + shape scale */
  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px;
  --sp-4: 16px; --sp-5: 24px; --sp-6: 32px;
  --radius: 8px; --radius-lg: 14px;
}

/* The `hidden` attribute must ALWAYS win. Without this, any element whose
 * class sets `display` (e.g. `.card { display:flex }`) renders even when
 * hidden — which is how the admin-only menu card leaked to non-admins. */
[hidden] { display: none !important; }

/* shared utility: the mono eyebrow/label used across surfaces */
.eyebrow {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--dim);
  font-weight: 600;
}