/* 32dots foundations v0.1. Framework-independent; use across product sites.
   Set data-product on the app root. Product accents are identity, not status.
   Marketing uses the display serif; working interfaces use the sans only. */
:root {
  color-scheme: dark;
  --ds-bg: #070b10;
  --ds-surface: #101923;
  --ds-surface-raised: #172330;
  --ds-text: #eef3f5;
  --ds-muted: #adbbc8;
  --ds-border: #ffffff26;
  --ds-border-strong: #ffffff45;
  --ds-hive: #a3ecd5;
  --ds-net: #a6caff;
  --ds-agent: #eab7cb;
  --ds-galaxy: #c7b5ff;
  --ds-healthos: #9ddfe5;
  --ds-curriculum: #ead9a4;
  --ds-vision: #ddc18c;
  --ds-accent: var(--ds-hive);
  --ds-on-accent: #10251e;
  --ds-sans: 'Segoe UI', Arial, sans-serif;
  --ds-serif: Georgia, serif;
  --ds-mono: Consolas, monospace;
  --ds-space-1: 4px;
  --ds-space-2: 8px;
  --ds-space-3: 12px;
  --ds-space-4: 16px;
  --ds-space-6: 24px;
  --ds-space-8: 32px;
  --ds-space-12: 48px;
  --ds-radius-control: 6px;
  --ds-radius-panel: 12px;
  --ds-ease: cubic-bezier(.2,.7,.2,1);
  --ds-duration: 220ms;
  /* Compatibility aliases for the first consumer, 32dots landing. */
  --bg: var(--ds-bg); --ink: var(--ds-text); --muted: var(--ds-muted);
  --line: var(--ds-border); --mint: var(--ds-accent); --gold: var(--ds-vision);
  --sans: var(--ds-sans); --mono: var(--ds-mono);
}
[data-product="1hive"] { --ds-accent: var(--ds-hive); }
[data-product="1net"] { --ds-accent: var(--ds-net); }
[data-product="1agent"] { --ds-accent: var(--ds-agent); }
[data-product="galaxy"] { --ds-accent: var(--ds-galaxy); }
[data-product="healthos"] { --ds-accent: var(--ds-healthos); }
.ds-panel { background: var(--ds-surface); border: 1px solid var(--ds-border); border-radius: var(--ds-radius-panel); padding: var(--ds-space-6); }
.ds-button { display: inline-flex; align-items: center; justify-content: center; gap: var(--ds-space-3); min-height: 44px; padding: 12px 20px; background: var(--ds-accent); color: var(--ds-on-accent); border: 1px solid transparent; border-radius: var(--ds-radius-control); font: 600 14px var(--ds-sans); text-decoration: none; cursor: pointer; transition: filter var(--ds-duration) var(--ds-ease); }
.ds-button:hover { filter: brightness(1.08); }
.ds-button:disabled { opacity: .45; cursor: not-allowed; filter: none; }
.ds-button--secondary { color: var(--ds-text); background: var(--ds-surface); border-color: var(--ds-border-strong); }
.ds-button:focus-visible { outline: 2px solid var(--ds-accent); outline-offset: 4px; }
@media (prefers-reduced-motion: reduce) { .ds-button { transition: none; } }