/* ============================================================
   AI-103 Field Manual — diagram design system
   Single source of truth. Inlined into the page AND injected
   into every standalone .svg export.

   SITE NOTE (sdselite.com): the dark-theme blocks from the source
   bundle were removed here on purpose. sdselite.com is a light-only
   site, so the diagrams render in the light palette regardless of the
   visitor's OS colour-scheme. The four semantic accent families
   (a=trap, b=recommended, c=blocked, d=neutral grouping) are kept as
   authored — they are purpose-built, brand-distinct and 4.5:1 legible,
   and collapsing them into the site's cool indigo/violet/cyan would
   destroy the meaning they carry.
   ============================================================ */

:root{
  --dg-ground:#F6F8FB;
  --dg-surface:#FFFFFF;
  --dg-panel:#EAEEF5;
  --dg-panel-2:#DFE5EF;
  --dg-ink:#131820;
  --dg-ink-2:#4B5666;
  --dg-ink-3:#7C8797;
  --dg-line:#BFC9D8;
  --dg-line-2:#94A2B6;

  --dg-a:#B4530F;        /* signal / the exam trap / the thing under discussion */
  --dg-a-fill:#FCEEE1;
  --dg-a-line:#E39A5F;

  --dg-b:#0E6F62;        /* recommended path / correct answer */
  --dg-b-fill:#E2F2EF;
  --dg-b-line:#5FAFA3;

  --dg-c:#9E2A3C;        /* blocked / wrong / harm */
  --dg-c-fill:#FBE9EC;
  --dg-c-line:#D48C97;

  --dg-d:#2C4C8C;        /* neutral-cool secondary grouping */
  --dg-d-fill:#E6ECF8;
  --dg-d-line:#8DA3CE;
}

/* ---------- surfaces ---------- */
.dg .pnl   { fill:var(--dg-panel);   stroke:none; }
.dg .pnl2  { fill:var(--dg-panel-2); stroke:none; }
.dg .pnlA  { fill:var(--dg-a-fill);  stroke:var(--dg-a-line); stroke-width:1; stroke-dasharray:4 3; }
.dg .pnlB  { fill:var(--dg-b-fill);  stroke:var(--dg-b-line); stroke-width:1; stroke-dasharray:4 3; }
.dg .pnlC  { fill:var(--dg-c-fill);  stroke:var(--dg-c-line); stroke-width:1; stroke-dasharray:4 3; }
.dg .pnlD  { fill:var(--dg-d-fill);  stroke:var(--dg-d-line); stroke-width:1; stroke-dasharray:4 3; }

/* ---------- nodes ---------- */
.dg .bx    { fill:var(--dg-surface); stroke:var(--dg-line-2); stroke-width:1.4; }
.dg .bxA   { fill:var(--dg-a-fill);  stroke:var(--dg-a);      stroke-width:1.6; }
.dg .bxB   { fill:var(--dg-b-fill);  stroke:var(--dg-b);      stroke-width:1.6; }
.dg .bxC   { fill:var(--dg-c-fill);  stroke:var(--dg-c);      stroke-width:1.6; }
.dg .bxD   { fill:var(--dg-d-fill);  stroke:var(--dg-d);      stroke-width:1.6; }
.dg .bxM   { fill:none;              stroke:var(--dg-line);   stroke-width:1.2; stroke-dasharray:5 4; }
.dg .bxK   { fill:var(--dg-ink);     stroke:none; }
.dg .bxG   { fill:var(--dg-panel);   stroke:var(--dg-line);   stroke-width:1.2; }

/* ---------- type ---------- */
.dg text{ font-family:"IBM Plex Sans","Segoe UI",system-ui,sans-serif; fill:var(--dg-ink); }
.dg .tt  { font-size:19px; font-weight:600; letter-spacing:-0.1px; }
.dg .ts  { font-size:10.5px; font-weight:600; letter-spacing:1.2px; text-transform:uppercase; fill:var(--dg-ink-3); }
.dg .tb  { font-size:14px;  font-weight:450; }
.dg .tbs { font-size:12px;  font-weight:450; fill:var(--dg-ink-2); }
.dg .tn  { font-size:11px;  font-weight:450; fill:var(--dg-ink-3); }
.dg .tm  { font-family:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace; font-size:12px; }
.dg .tms { font-family:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace; font-size:10.5px; fill:var(--dg-ink-2); }
.dg .b   { font-weight:650; }
.dg .c   { text-anchor:middle; }
.dg .e   { text-anchor:end; }
.dg .kk  { fill:var(--dg-ground); }
.dg .ta  { fill:var(--dg-a); }
.dg .tbb { fill:var(--dg-b); }
.dg .tc  { fill:var(--dg-c); }
.dg .td  { fill:var(--dg-d); }
.dg .t2  { fill:var(--dg-ink-2); }
.dg .t3  { fill:var(--dg-ink-3); }

/* ---------- edges ---------- */
.dg .ed   { fill:none; stroke:var(--dg-ink-2); stroke-width:1.6; marker-end:url(#dgA); }
.dg .edA  { fill:none; stroke:var(--dg-a);     stroke-width:1.9; marker-end:url(#dgAa); }
.dg .edB  { fill:none; stroke:var(--dg-b);     stroke-width:1.9; marker-end:url(#dgAb); }
.dg .edC  { fill:none; stroke:var(--dg-c);     stroke-width:1.9; marker-end:url(#dgAc); }
.dg .edD  { fill:none; stroke:var(--dg-d);     stroke-width:1.9; marker-end:url(#dgAd); }
.dg .dash { stroke-dasharray:6 4; }
.dg .noar { marker-end:none; }
.dg .ln   { fill:none; stroke:var(--dg-line); stroke-width:1; }
.dg .ln2  { fill:none; stroke:var(--dg-line-2); stroke-width:1.2; }
.dg .lnA  { fill:none; stroke:var(--dg-a); stroke-width:1.4; }
.dg .thick{ stroke-width:2.6; }

/* arrowhead polygons — coloured via CSS so themes carry through */
.dg .mk  { fill:var(--dg-ink-2); }
.dg .mkA { fill:var(--dg-a); }
.dg .mkB { fill:var(--dg-b); }
.dg .mkC { fill:var(--dg-c); }
.dg .mkD { fill:var(--dg-d); }

/* label backing plate — put behind any text that crosses a line */
.dg .lbl { fill:var(--dg-ground); stroke:none; }
