/* Information architecture deliverables guide (/information-architecture/deliverables/).
   Layered over home-parity.css + site-nav-dropdown.css + guides.css + guides-rich.css.
   Scope: body.iad. Existing guide tokens only; no new colours beyond the house palette. */

.iad{--ink:#303030;--muted:#6d6d6d;--purple:#643995;--line:#d9d2e2;--wash:#f1eafb;--band:#faf8fd;--rule:#e3dedd;--sticky:64px}
.iad [id]{scroll-margin-top:calc(var(--sticky) + 16px)}

/* first-screen deliverable list */
.iad-set{list-style:none;margin:18px 0 8px;padding:0;border-top:1px solid var(--rule)}
.iad-set li{display:grid;grid-template-columns:150px 1fr;gap:12px;padding:10px 0;border-bottom:1px solid var(--rule)}
.iad-set .iad-set__k{font-weight:600;color:var(--purple)}
.iad-set a{text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:3px}
.iad-set .iad-set__hub{font-weight:600}
@media (max-width:640px){.iad-set li{grid-template-columns:1fr;gap:2px}}
.iad-test{border-left:3px solid var(--purple);background:var(--band);padding:12px 16px;margin:18px 0}

/* matrix badges: the reason carries the meaning; badges are text, never colour alone */
.iad-matrix td{vertical-align:top;font-size:14px;line-height:1.45}
.iad-b{display:block;font-weight:600;font-size:12px;letter-spacing:.02em;text-transform:uppercase;margin-bottom:2px}
.iad-b--core{color:var(--purple)}
.iad-b--dep{color:#555}
.iad-b--not{color:#6d6d6d}
.iad-matrix th[scope=row] a{font-weight:600}

/* mistakes */
.iad-mistakes{counter-reset:none;padding-left:1.1em}
.iad-mistakes li{margin:0 0 10px}

/* entries */
.iad-entry{border-top:2px solid var(--ink);padding-top:14px;margin-top:40px}
.iad-entry--compact{border-top:1px solid var(--rule);margin-top:24px}
.iad-fields{display:grid;grid-template-columns:170px 1fr;gap:6px 18px;margin:12px 0}
.iad-fields dt{font-weight:600;color:var(--muted);font-size:14px}
.iad-fields dd{margin:0}
@media (max-width:640px){.iad-fields{grid-template-columns:1fr;gap:2px}.iad-fields dd{margin-bottom:8px}}
.iad-ready{margin:4px 0 0;padding-left:1.1em}
.iad-ready li{margin:2px 0}
.iad-label{display:inline-block;font-size:12px;font-weight:600;letter-spacing:.03em;text-transform:uppercase;color:var(--purple);border:1px solid var(--line);border-radius:3px;padding:1px 6px;margin-bottom:6px}
.iad-refs{font-size:14px;color:var(--muted)}
.iad-badges a{display:inline-block;font-size:13px;border:1px solid var(--line);border-radius:3px;padding:1px 6px;margin:0 4px 4px 0;text-decoration:none}
.iad-dl{font-size:15px}
.iad-dl a{font-weight:600}
.iad-note{font-size:14px;color:var(--muted)}
.iad-caveats{font-size:14px;color:var(--muted);padding-left:1.1em}
.iad .gd-table td,.iad .gd-table th{font-size:14px}
.iad-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:13px}
.iad details.iad-alt{margin:8px 0 0;font-size:14px}
.iad details.iad-alt summary{cursor:pointer;color:var(--purple)}

/* acceptance checklist */
.iad-checklist h4{margin:16px 0 4px}
.iad-copy{margin:6px 0 10px}
.iad-copy button{font:inherit;font-size:14px;padding:4px 10px;border:1px solid var(--purple);background:#fff;color:var(--purple);border-radius:3px;cursor:pointer}
.iad-copy button:focus-visible{outline:2px solid var(--purple);outline-offset:2px}
.iad-scope{font-size:15px;max-width:640px;margin:0 auto 14px}

@media print{.iad nav,.iad .gd-outline,.iad .gd-cta-glow,.iad .iad-copy,.iad .fig-full{display:none!important}}

/* stacked tables: the shared stack rule styles td only; these tables use th[scope=row] as the row label */
@media (max-width:640px){
  .iad .gd-table-scroll--stack .gd-table{min-width:0!important}
  .iad .gd-table-scroll--stack th[scope=row]{display:block;width:100%;padding:0 0 6px;border:0;font-weight:700}
  .iad .iad-matrix td{margin-bottom:8px}
}

/* figure captions: plain muted text, never link-coloured */
.iad figure figcaption{color:var(--muted);font-size:14px;margin-top:6px}

/* ---------- Wide-artifact layout (page-local; candidate for a future `wide-artifact` guide variant) ----------
   Desktop keeps the mobile pattern: the outline is a horizontal pill row above the article, no side rail.
   Prose stays in the 740px reading column; .iad-wide blocks break out to a wider centred band. */
@media (min-width:1100px){
  .iad .gd-layout{display:block;max-width:740px;margin:0 auto}
  .iad .gd-outline{position:static;margin:0 0 28px}
  .iad .gd-outline__list{display:flex;flex-wrap:wrap;gap:8px;overflow:visible;padding:0 0 4px}
  .iad .gd-outline__list a{display:inline-block;white-space:nowrap;padding:4px 12px;border:1.5px solid #303030;border-radius:999px;background:#fff;color:#303030;font-size:12.5px;font-weight:600;line-height:1.5}
  .iad .gd-outline__list a:hover{background:#fff;box-shadow:2px 2px 0 #E0BBF5}
  .iad .gd-outline__list a.is-active{background:#f5f0ff;color:#303030;font-weight:600}
}
/* Breakout band: up to 1180px, never closer than 32px to the viewport edge, centred on the reading column. */
.iad .iad-wide{--iad-wide:min(1180px,calc(100vw - 64px));width:var(--iad-wide);max-width:none;margin-left:calc(50% - var(--iad-wide) / 2);margin-right:0}
.iad .iad-wide.gd-table-scroll{overflow-x:auto}
.iad .iad-wide.gd-table-scroll .gd-table{width:100%}
.iad .iad-wide--figure{margin-top:20px;margin-bottom:20px}
.iad .iad-wide--figure figcaption,.iad .iad-wide--figure .fig-full{max-width:740px;margin-left:auto;margin-right:auto}
@media (max-width:640px){
  /* phones: no breakout; stack or scroll inside the column */
  .iad .iad-wide{--iad-wide:100%;width:100%;margin-left:0}
}

/* ---------- C4 (R3 on 2bcf795b): page-local fixes ---------- */
/* matrix: balanced columns; verdict labels stay on one line */
.iad .iad-matrix{table-layout:fixed}
.iad .iad-matrix thead th:first-child{width:18%}
.iad .iad-b{white-space:nowrap}
/* wide tables that still scroll: static edge shadows + an always-visible scrollbar (no JS) */
.iad .gd-table-scroll{background:linear-gradient(to right,#fff 30%,rgba(255,255,255,0)) left center/40px 100% no-repeat local,linear-gradient(to left,#fff 30%,rgba(255,255,255,0)) right center/40px 100% no-repeat local,radial-gradient(farthest-side at 0 50%,rgba(48,48,48,.3),rgba(48,48,48,0)) left center/16px 100% no-repeat scroll,radial-gradient(farthest-side at 100% 50%,rgba(48,48,48,.3),rgba(48,48,48,0)) right center/16px 100% no-repeat scroll;background-color:#fff;scrollbar-width:thin;scrollbar-color:#b9afc9 #f1eafb}
.iad .gd-table-scroll::-webkit-scrollbar{height:10px}
.iad .gd-table-scroll::-webkit-scrollbar-thumb{background:#b9afc9;border-radius:6px}
.iad .gd-table-scroll::-webkit-scrollbar-track{background:#f1eafb}
/* copyable tables that repeat a figure: collapsed by default */
.iad details.iad-copytable{margin:6px 0 20px}
.iad details.iad-copytable>summary{cursor:pointer;color:var(--purple);font-size:14px;font-weight:600}
.iad details.iad-copytable>summary:focus-visible{outline:2px solid var(--purple);outline-offset:2px}
/* entry definition blocks: body-prose rhythm */
.iad .iad-fields dd{line-height:1.6}
.iad .iad-fields .iad-ready{margin:0}
/* figure captions: muted, never link-coloured */
.iad .gd-figure figcaption{color:var(--muted)}
.iad .iad-matrix th{white-space:normal}
/* C4.2: long row headers (findings, tasks) wrap at every width instead of clipping */
.iad .gd-table th[scope="row"]{white-space:normal}
/* print only: wide tables fit the page width (no scroll clipping); headings stay with what follows. Kept last so it wins over the screen rules above. */
@media print{
  .iad .iad-wide{width:100%!important;margin-left:0!important}
  .iad .gd-table-scroll{overflow:visible!important;background:none!important}
  .iad .gd-table{min-width:0!important;width:100%!important}
  .iad .gd-table{font-size:11px}
  .iad .gd-table th,.iad .gd-table td{white-space:normal;overflow-wrap:break-word;padding:5px 6px}
  .iad .iad-b{white-space:normal}
  .iad h2,.iad h3,.iad h4{break-after:avoid}
  .iad .iad-checklist{break-before:avoid}
}