/* ===========================================================================
   GenRoot Design System — the single source of truth for EVERY touchpoint.
   genroot.io (landing) · the app · the lineage view · the Pulse widget ·
   agent-rendered surfaces. Change a token here -> it changes everywhere.
   Monochrome by rule (SAL2 brand book v5). Machine-readable mirror for agents:
   /.well-known/genroot-design.json. Fonts: Albert Sans + IBM Plex Mono/Sans.
   =========================================================================== */
:root{
  /* surfaces (dark canvas, by rule) */
  --canvas:#0A0B0C; --surface:#16181B; --surf2:#1C1F23;
  /* ink */
  --signal:#F4F3EF; --dim:#E4E3DE; --soft:#A6A8AD; --mid:#7C7F85; --faint:#65686D;
  /* lines */
  --hair:rgba(255,255,255,.08); --hair-strong:rgba(255,255,255,.16);
  /* completeness — the honest signal; the ONLY semantic color, kept muted */
  --ok:#9FE1CB;   /* complete  */
  --warn:#E8C58A; /* partial   */
  --bad:#E59B9B;  /* failed    */
  /* type */
  --font-sans:'Albert Sans',sans-serif;
  --font-mono:'IBM Plex Mono',monospace;
  --font-wm:'IBM Plex Sans',sans-serif;
  /* shape */
  --radius:8px; --radius-card:12px; --radius-lg:14px;
}

/* base primitives — canonical for any GenRoot surface (pages may extend) */
*{box-sizing:border-box;margin:0;padding:0;}
body{background:var(--canvas);color:var(--signal);font-family:var(--font-sans);line-height:1.5;-webkit-font-smoothing:antialiased;min-height:100vh;position:relative;}
/* the GenRoot grain — a faint fractal-noise texture over the canvas */
body::after{content:"";position:fixed;inset:0;z-index:1;pointer-events:none;opacity:.04;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}

/* the wordmark — weight tension: gen=600, root=200 */
.wm{font-family:var(--font-wm);letter-spacing:-.05em;}
.wm b{font-weight:600;} .wm i{font-weight:200;font-style:normal;}

/* the mono label — uppercase, wide tracking, faint */
.mono{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.18em;font-size:11px;color:var(--faint);}

/* base controls (opt-in; .gr-* to avoid clashing with page classes) */
.gr-btn{background:none;border:1px solid var(--hair);color:var(--soft);font-family:var(--font-mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;padding:7px 10px;cursor:pointer;text-decoration:none;transition:background .15s,color .15s;}
.gr-btn:hover{background:var(--signal);color:var(--canvas);}
.gr-btn--solid{background:var(--signal);color:var(--canvas);border-color:var(--signal);}
.gr-chip{font-family:var(--font-mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;padding:4px 9px;border:1px solid var(--hair);color:var(--soft);}
.gr-chip--ok{color:var(--ok);border-color:rgba(159,225,203,.3);}
.gr-chip--warn{color:var(--warn);border-color:rgba(232,197,138,.3);}
.gr-chip--bad{color:var(--bad);border-color:rgba(229,155,155,.3);}
.gr-card{background:var(--surface);border:1px solid var(--hair);border-radius:var(--radius-card);}
