/* UXbeam diagram board shell, shared by the IA Process and IA Assessment guides.
   Tokens and the board frame match the diagram language of /information-architecture/deliverables/
   (ia-diagrams.css, v3 art direction). Only the shell lives here; each page composes its own boards in
   its page CSS. Every rule is scoped under .uxd so the guide's prose styles never override board type. */

.uxd{
  --ink:#1c1a24; --ink-2:#4f4a60; --ink-3:#86809a; --paper:#fffdf9; --line:#ece6dc; --line-2:#f1ece4;
  --purple:#6d3fd1; --purple-50:#efe8ff; --purple-ink:#4c23a8;
  --coral:#ef5f4f;  --coral-50:#ffe7e2;  --coral-ink:#b03424;
  --orange:#f08c1b; --orange-50:#fff0d9; --orange-ink:#9a5208;
  --turq:#12a594;   --turq-50:#d9f5f1;   --turq-ink:#0b6d62;
  --blue:#3b74e8;   --blue-50:#e3edff;   --blue-ink:#1f4fb8;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --r:16px; --r-sm:10px;
  color:var(--ink); font-feature-settings:"tnum" 1;
}
.uxd *{box-sizing:border-box}
.uxd p{margin:0}
.gd-article .uxd ul,.gd-article .uxd ol,.gd-article .uxd dl{list-style:none!important;padding-left:0!important;margin:0!important}
.gd-article .uxd li{margin:0!important}
.gd-article .uxd li::before{content:none!important}
.gd-article .uxd dd{margin:0}

/* board: warm paper, sized to content */
.uxd .uxd-board{container-type:inline-size;container-name:uxd;background:var(--paper);border:1px solid var(--line);border-radius:26px;padding:24px 26px 22px;margin:0 auto;
  box-shadow:0 1px 0 #fff inset,0 24px 48px -36px rgba(28,26,36,.35)}
.uxd .uxd-board__bar{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:12px 18px;margin:0 0 18px}
.uxd .uxd-eyebrow{display:inline-flex;align-items:center;gap:7px;font-size:11.5px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--acc-ink,var(--purple-ink))}
.uxd .uxd-eyebrow::before{content:"";width:18px;height:6px;border-radius:999px;background:var(--acc,var(--purple))}
.uxd--purple{--acc:var(--purple);--acc-ink:var(--purple-ink);--acc-50:var(--purple-50)}
.uxd--coral{--acc:var(--coral);--acc-ink:var(--coral-ink);--acc-50:var(--coral-50)}
.uxd--orange{--acc:var(--orange);--acc-ink:var(--orange-ink);--acc-50:var(--orange-50)}
.uxd--turq{--acc:var(--turq);--acc-ink:var(--turq-ink);--acc-50:var(--turq-50)}
.uxd--blue{--acc:var(--blue);--acc-ink:var(--blue-ink);--acc-50:var(--blue-50)}
.uxd .uxd-board__h{margin-top:6px;font-size:21px;line-height:1.2;font-weight:800;letter-spacing:-.02em;color:var(--ink)}
.uxd .uxd-board__sub{margin-top:4px;font-size:13px;line-height:1.45;color:var(--ink-3)}
.uxd .uxd-board__foot{margin-top:18px;padding-top:12px;border-top:1px solid var(--line-2);font-size:12.5px;color:var(--ink-3);line-height:1.5}
.uxd .uxd-id{display:inline-flex;align-items:center;height:20px;padding:0 8px;border-radius:999px;background:var(--ink);color:#fff;font:700 10.5px/1 var(--mono);letter-spacing:.02em;white-space:nowrap;vertical-align:middle}
.uxd .uxd-chip{display:inline-flex;align-items:center;height:22px;padding:0 9px;border-radius:7px;font-size:11.5px;font-weight:700;white-space:nowrap;line-height:1;vertical-align:middle;background:#fff;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--line);text-decoration:none}
.uxd a.uxd-chip{color:var(--acc-ink,var(--purple-ink));box-shadow:inset 0 0 0 1.5px var(--acc,var(--purple))}
.uxd a.uxd-chip:hover,.uxd a.uxd-chip:focus-visible{background:var(--acc-50,var(--purple-50))}
.uxd a:focus-visible{outline:3px solid var(--acc,var(--purple));outline-offset:2px}
.uxd .uxd-note{margin-top:12px;font-size:12.5px;line-height:1.5;color:var(--ink-3)}
.uxd .uxd-ill{display:inline-flex;align-items:center;gap:6px;margin-bottom:14px!important;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);border:1.5px dashed var(--ink-3);border-radius:999px;padding:4px 10px}
@media (max-width:640px){.uxd .uxd-board{padding:18px 14px 16px;border-radius:20px}.uxd .uxd-board__h{font-size:18px}}