/* =========================================================================
   WEBSITE BLUEPRINTS (render/ia-blueprints.ts; founder brief 2026-10-18,
   preview for approval). patterns/index.html, patterns/blueprint-<id>.html.
   House tokens only. Prefix wbp-. The cards follow the entry gallery's
   values (no card box, hairline edge, purple ring on hover, title
   underlined); the drawings keep the library's light paper. The library's
   motif carries the one new idea: solid = every site needs it, dashed = add
   it if it fits.
   ========================================================================= */

.wbp-vh { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.ia [hidden] { display: none !important; }
.wbp-nw { white-space: nowrap; }

/* ---- landing: hero, then the bar (filters + the six questions), then the drawings ---- */
.wbp-hero { margin-bottom: var(--s6); }
.wbp-hero .stg-hero__lede { max-width: 34ch; }
.wbp-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--s3) var(--s5); margin: 0 0 var(--s5); }
.wbp-filters { display: flex; flex-wrap: wrap; gap: var(--s2); }
/* Reserve the row's own height before JS reveals it, so the page below doesn't jump (Savva's review, 2026-11-02).
   The buttons are already in the markup; `hidden` keeps them out of the a11y tree and off-screen-equivalent
   until the filter script runs and clears the attribute. */
.wbp-filters[hidden] { display: flex; visibility: hidden; }
.wbp-filters button { min-height: 2.5rem; padding: 0 var(--s4); border: 1px solid var(--rule-firm); background: var(--paper); color: var(--ink); font: 600 var(--t-sm)/1 var(--ui); cursor: pointer; }
.wbp-filters button:hover { border-color: var(--ink-2); }
.wbp-filters button[aria-pressed="true"] { background: var(--ink); border-color: var(--ink); color: var(--paper); }
.wbp-filters button:focus-visible, .wbp-unsure summary:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }

.wbp-unsure summary { display: inline-flex; align-items: center; gap: var(--s2); min-height: 2.5rem; cursor: pointer; list-style: none; font: 600 var(--t-sm)/1.3 var(--ui); color: var(--brand); }
.wbp-unsure summary::-webkit-details-marker { display: none; }
.wbp-unsure summary::after { content: "↓"; font-weight: 400; }
.wbp-unsure[open] { flex-basis: 100%; order: 2; }
/* Closed, the finder's content is invisible but Chromium still lays it out at the summary's width, where its chips
   measure past their row (breakfinder, 2026-10-26). Don't lay it out until the panel opens. No visible change. */
.wbp-unsure:not([open]) > :not(summary) { display: none; }
.wbp-unsure[open] summary::after { content: "↑"; }
.wbp-unsure .pidx-find { margin: var(--s3) 0 var(--s4); padding: var(--s5); background: var(--paper-deep); border: 1px solid var(--rule); }
.wbp-unsure .pidx-route { margin-bottom: var(--s3); }

.wbp-gal { container-type: inline-size; margin: 0 0 var(--s6); }
.wbp-gal__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--s6) var(--s5); }
@container (min-width: 34rem) { .wbp-gal__list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@container (min-width: 56rem) { .wbp-gal__list { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.wbp-gal__none:empty { display: none; }
.wbp-gal__none { margin: var(--s4) 0 0; font: var(--t-xs)/1.4 var(--mono); color: var(--ink-3); }

.wbp-card { display: flex; flex-direction: column; height: 100%; color: var(--ink); text-decoration: none; border-radius: var(--r-soft); }
.ia .wbp-card { color: var(--ink); }
.wbp-card:focus-visible { outline: 2px solid var(--brand); outline-offset: 3px; }
.wbp-card__pic { position: relative; display: block; aspect-ratio: 4 / 3; overflow: hidden; container-type: inline-size; border-radius: var(--r-soft); background: #fff; outline: 1px solid var(--rule); outline-offset: -1px; }
.wbp-card__pic .stg-gal__wire { border-radius: inherit; }
.wbp-card:is(:hover, :focus-visible) .wbp-card__pic { outline: 2px solid var(--brand); outline-offset: -2px; }
.wbp-card__txt { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: baseline; gap: var(--s1) var(--s4); padding-top: var(--s3); }
.wbp-card__pages { grid-column: 1 / -1; }
.wbp-card__t { font: 600 var(--t-md)/1.25 var(--ui); letter-spacing: -.005em; text-wrap: balance; }
.wbp-card:is(:hover, :focus-visible) .wbp-card__t { text-decoration: underline; text-underline-offset: .2em; text-decoration-thickness: 1px; }
.wbp-card__pages { font: var(--t-sm)/1.45 var(--ui); color: var(--ink-2); }
.wbp-card .stg-gal__st { justify-self: end; white-space: nowrap; }

.wbp-gap { max-width: 60rem; margin: 0 0 var(--s2); font: var(--t-sm)/1.5 var(--ui); color: var(--ink-2); }
.wbp-gap a, .wbp-guide a { color: var(--ink); text-underline-offset: .2em; }
.wbp-guide { margin: 0 0 var(--s8); font: var(--t-sm)/1.5 var(--ui); }

/* ---- one blueprint ---- */
.wbp-head { max-width: 52rem; margin: 0 0 var(--s7); }
.wbp-head__h { max-width: 15ch; margin-bottom: var(--s3); text-wrap: balance; }
.wbp-head > .stg-gal__st { display: inline-flex; margin-bottom: var(--s4); }
.wbp-head__for { margin: 0 0 var(--s2); max-width: 34ch; font: 700 var(--t-lg)/1.15 var(--display); letter-spacing: -.02em; color: var(--ink); text-wrap: pretty; }
.wbp-head__ex { margin: 0 0 var(--s5); font: var(--t-sm)/1.5 var(--ui); color: var(--ink-3); max-width: 60ch; }
.wbp-head--guide .wbp-head__for { font: var(--t-base)/1.5 var(--ui); color: var(--ink-2); max-width: 56ch; }
.wbp-cta { display: inline-flex; align-items: center; gap: var(--s2); min-height: 2.75rem; padding: 0 var(--s5); background: var(--brand); color: var(--paper); font: 650 var(--t-base)/1 var(--ui); text-decoration: none; }
.ia a.wbp-cta { color: var(--paper); }
.wbp-cta:hover { background: var(--brand-lift); }
.wbp-cta:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; }
.wbp-head__go { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s2) var(--s4); margin: 0 0 var(--s4); }
.wbp-head__note { max-width: 40ch; font: var(--t-sm)/1.45 var(--ui); color: var(--ink-2); }
.wbp-status { max-width: 62ch; margin: 0; font: var(--t-xs)/1.55 var(--mono); color: var(--ink-3); }
.wbp-status b { font-weight: 400; color: var(--ink-2); }
/* Untested badge + its explanation, by the H1 (Savva's review, 2026-11-02): same honesty as the old paragraph
   between the CTA and the page content, less to read up front. */
.wbp-head__h .ia-state { font-size: var(--t-sm); vertical-align: middle; margin-bottom: .15em; }
.wbp-untested { margin: 0 0 var(--s4); max-width: 60ch; }
.wbp-untested > summary { cursor: pointer; font: var(--t-xs)/1 var(--mono); color: var(--ink-3); list-style: none; }
.wbp-untested > summary:hover { color: var(--ink-2); }
.wbp-untested__p { margin: var(--s2) 0 0; font: var(--t-sm)/1.55 var(--ui); color: var(--ink-2); }

.wbp-map__top { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: var(--s3) var(--s5); margin-bottom: var(--s4); }
.wbp-map__top .wbp-h2 { margin: 0; }
/* the Instructions/Example switch sits at the top edge of the drawing it controls, not beside the sitemap heading
   (Savva's review, 2026-11-02: "it's far from what it controls"). */
.wbp-mode-row { display: flex; justify-content: flex-end; margin: 0 0 var(--s3); }
.wbp-mode { display: inline-flex; }
.wbp-mode button { min-height: 2.5rem; padding: 0 var(--s4); border: 1px solid var(--rule-firm); background: var(--paper); color: var(--ink); font: 600 var(--t-sm)/1 var(--ui); cursor: pointer; }
.wbp-mode button + button { margin-left: -1px; }
.wbp-mode button[aria-pressed="true"] { background: var(--ink); border-color: var(--ink); color: var(--paper); }
.wbp-mode button:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; position: relative; }
.wbp-mode__note { margin: calc(-1 * var(--s3)) 0 var(--s4); font: var(--t-xs)/1.4 var(--mono); color: var(--ink-3); }

/* how blueprints work: three steps, each with one picture from the library itself */
.wbp-steps { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--s6) var(--s5); margin: 0 0 var(--s7); padding: 0; list-style: none; }
@media (min-width: 48rem) { .wbp-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.wbp-step { display: flex; flex-direction: column; }
.wbp-step__pic { aspect-ratio: 4 / 3; margin-bottom: var(--s4); }
.wbp-step__pic--map, .wbp-step__pic--qs { display: flex; flex-direction: column; gap: var(--s3); padding: var(--s4); border: 1px solid var(--rule); border-radius: var(--r-soft); background: var(--paper-deep); }
.wbp-step__pic i { font-style: normal; }
.wbp-step__row { display: flex; flex-wrap: wrap; gap: var(--s2); }
.wbp-step__row .wbp-node { min-height: 2rem; padding: 0 var(--s3); font-size: var(--t-xs); }
.wbp-step__secs { display: flex; flex-direction: column; margin-top: var(--s2); border-top: 1px solid var(--rule); }
.wbp-step__secs i { padding: var(--s2) 0; border-bottom: 1px solid var(--rule); font: var(--t-xs)/1.3 var(--ui); color: var(--ink-2); }
.wbp-step__secs i.is-sel { padding-left: var(--s3); border-left: 2px solid var(--brand); color: var(--ink); font-weight: 650; }
.wbp-step__pic--qs i { padding: var(--s3); border: 1px dashed var(--rule-firm); font: var(--t-xs)/1.4 var(--ui); color: var(--ink); background: var(--paper); }
.wbp-step__n { font: var(--t-xs)/1 var(--mono); color: var(--ink-3); }
.wbp-step__t { margin: var(--s2) 0 var(--s2); font: 700 var(--t-md)/1.2 var(--display); letter-spacing: -.015em; }
.wbp-step__d { margin: 0; font: var(--t-base)/1.5 var(--ui); color: var(--ink-2); max-width: 34ch; }
.wbp-guide-go { margin-bottom: var(--s8); }

.wbp-h2 { margin: 0 0 var(--s4); font: 700 var(--t-lg)/1.15 var(--display); letter-spacing: -.02em; }
.wbp-h3 { margin: 0 0 var(--s3); font: 650 var(--t-md)/1.2 var(--display); letter-spacing: -.015em; }

/* the sitemap as two groups of page names: solid boxes are essential, dashed are optional */
.wbp-map { margin: 0 0 var(--s7); }
.wbp-map__groups { display: flex; flex-wrap: wrap; gap: var(--s4) var(--s7); margin: 0 0 var(--s5); }
.wbp-map__k { display: flex; align-items: center; gap: var(--s2); margin: 0 0 var(--s3); font: var(--t-xs)/1.3 var(--mono); color: var(--ink-2); }
.wbp-key { display: inline-block; width: 1.5rem; height: .75rem; border: 1.5px solid var(--ink); }
.wbp-key--opt { border-style: dashed; border-color: var(--ink-2); }
.wbp-map__list { display: flex; flex-wrap: wrap; gap: var(--s2); margin: 0; padding: 0; list-style: none; }
.wbp-node { display: inline-flex; align-items: center; min-height: 2.5rem; padding: 0 var(--s4); border: 1.5px solid var(--ink); color: var(--ink); font: 600 var(--t-sm)/1.2 var(--ui); text-decoration: none; }
.ia a.wbp-node { color: var(--ink); }
.wbp-node--opt { border-style: dashed; border-color: var(--ink-2); font-weight: 500; }
.wbp-node:hover { background: var(--paper-deep); }
.wbp-node:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }
.wbp-js .wbp-node[aria-current="true"], .ia .wbp-js a.wbp-node[aria-current="true"] { background: var(--ink); border-color: var(--ink); color: var(--paper); }
:root.wbp-js .ia a.wbp-node[aria-current="true"] { color: var(--paper); }

/* one page at a time: its drawing beside what it holds. The drawing is drawn at its real width (no scaling), so the
   formulas read at full size; the wireframe's own container queries give a phone layout on a phone. Two columns only
   when the drawing still gets a desktop width (the wireframe switches to its phone layout under 560px). */
.wbp-panels { container-type: inline-size; display: grid; gap: var(--s7); }
.wbp-panel { display: grid; grid-template-columns: minmax(0, 1fr); align-items: start; scroll-margin-top: var(--s5); }
.wbp-panel__txt { display: contents; }
.wbp-panel__h, .wbp-panel__q, .wbp-panel__note, .wbp-panel__if { order: 0; }
.wbp-panel__pic { order: 1; margin: 0 0 var(--s5); }
.wbp-panel__k, .wbp-panel__hint, .wbp-secs, .wbp-panel__more { order: 2; }
@container (min-width: 60rem) {
  .wbp-panel { grid-template-columns: minmax(0, 1fr) minmax(18rem, 22rem); gap: var(--s5) var(--s6); }
  .wbp-panel__txt { display: block; position: sticky; top: var(--s4); max-height: calc(100vh - 2 * var(--s4)); overflow: auto; overscroll-behavior: contain; scrollbar-gutter: stable; padding-right: var(--s4); }
  /* ONE SCROLL (Savva's review, 2026-11-01: "way too many scrolling parts"): the drawing is the whole page at full
     height and scrolls with the page; the guidance stays pinned beside it. Before, the drawing scrolled in its own
     window next to a page that also scrolled. */
  .wbp-panels .wbp-panel__pic { margin: 0; grid-column: 1; grid-row: 1; }
}
.wbp-panel__pic { position: relative; background: #fff; border-radius: var(--r-soft); outline: 1px solid var(--rule); outline-offset: -1px; }
/* the drawing is a whole page in a window: an edge fade and one label say there is more below, until the end */
.wbp-scrollhint { display: none !important; } /* nothing to scroll inside any more (2026-11-02) */
.wbp-scrollhint > span { padding: .3rem .7rem; background: #0B0D12; color: #fff; font: var(--t-xs)/1.3 var(--mono); }
.wbp-scrollhint__a { display: inline-block; margin-left: .25rem; }
.wbp-panel__pic.is-end .wbp-scrollhint, .wbp-panel__pic.is-fit .wbp-scrollhint { opacity: 0; }
@media (prefers-reduced-motion: reduce) { .wbp-scrollhint { transition: none; } }
.wbp-wire .wf-browser { max-width: none; box-shadow: none; border: 0; }
.wbp-wire .wf-dep, .wbp-wire .wf-mnote, .wbp-wire .wf-rule, .wbp-wire .wf-pbar { display: none; }
.wbp-wire .wf-mod[data-state="ask"], .wbp-wire .wf-mod[data-state="optional"] { background: none; box-shadow: none; }
/* every section is one button over its drawing: invisible until hovered, focused or chosen */
.wbp-wire .wf-tag { position: absolute; inset: 0; top: 0; left: 0; margin: 0; max-width: none; width: 100%; padding: 0; background: transparent; border-radius: 0; }
.wbp-wire .wf-tag > span { display: none; }
.wbp-wire .wf-tag > .wf-tag__n { position: absolute; top: 0; left: .5rem; transform: translateY(-50%); padding: .1rem .45rem; background: var(--wf-v); color: #fff; font: var(--t-xs)/1.4 var(--mono); }
.wbp-wire .wf-tag { outline: 0; }
.wbp-wire .wf-tag:is(:hover, :focus-visible) { outline: 2px solid var(--wf-v); outline-offset: -2px; }
.wbp-wire .wf-mod.is-sel .wf-tag { outline: 0; }
.wbp-wire .wf-tag:is(:hover, :focus-visible) > .wf-tag__n, .wbp-wire .wf-mod.is-sel .wf-tag > .wf-tag__n { display: inline-block; }
.wbp-wire .wf-mod.is-sel { background: var(--wf-wash); box-shadow: inset 0 0 0 2px var(--wf-v); }

/* the two text layers: formulas (Instructions, the default) and example copy. One drawing; CSS shows one layer. */
.wbp-f::before { content: "["; }
.wbp-f::after { content: "]"; }
/* span.x inside .wf-browser outranks the drawings' own span rules (e.g. .wstep span { display: flex }) */
.wf-browser span.wtx { display: contents; }
.wf-browser span.wtx__ex { display: none; }
.wf-browser span.wtx__in { display: inline; color: var(--wf-v, #5B21D6); }
.wf-browser span.wbp-f { display: inline; }
.wtx__in--line .wl { background: var(--rule-firm); }
.wbp-ex .wf-browser span.wtx__ex { display: contents; }
.wbp-ex .wf-browser span.wtx__in { display: none; }
.wbp-wire .wstep > b { min-width: 0; overflow-wrap: anywhere; }
.wf-browser .wbtn span.wtx__in, .wf-browser .wf-fx span.wtx__in { color: inherit; }

.wbp-panel__h { margin: 0 0 var(--s2); font: 700 var(--t-lg)/1.15 var(--display); letter-spacing: -.02em; }
.wbp-panel__h small { font: 400 var(--t-xs)/1 var(--mono); letter-spacing: 0; color: var(--ink-3); }
.wbp-panel__q { margin: 0 0 var(--s4); font: var(--t-base)/1.45 var(--ui); color: var(--ink); max-width: 40ch; }
.wbp-panel__note { margin: 0 0 var(--s4); font: var(--t-xs)/1.4 var(--mono); color: var(--ink-3); }
.wbp-panel__if { margin: 0 0 var(--s4); padding: var(--s3) var(--s4); border: 1px dashed var(--rule-firm); font: var(--t-sm)/1.5 var(--ui); color: var(--ink-2); }
.wbp-panel__if span { display: block; margin-bottom: var(--s1); font: var(--t-xs)/1.3 var(--mono); color: var(--ink-3); }
.wbp-panel__if b { font-weight: 600; color: var(--ink); }
.wbp-panel__k { margin: 0; font: var(--t-xs)/1.3 var(--mono); color: var(--ink-3); }
.wbp-panel__hint { margin: var(--s1) 0 var(--s2); font: var(--t-sm)/1.45 var(--ui); color: var(--ink-2); }
.wbp-panel__more { margin: var(--s4) 0 0; font: var(--t-sm)/1.4 var(--ui); }
.wbp-panel__more a { color: var(--ink); text-underline-offset: .2em; }

/* the sections, each a disclosure: its guidance opens beside the drawing */
.wbp-secs { margin: 0; padding: 0; list-style: none; }
.wbp-secs > li { border-top: 1px solid var(--rule); }
.wbp-sec > summary { display: grid; grid-template-columns: 1.75rem minmax(0, 1fr) auto; align-items: center; min-height: 2.75rem; cursor: pointer; list-style: none; font: var(--t-sm)/1.35 var(--ui); color: var(--ink); }
.wbp-sec > summary::-webkit-details-marker { display: none; }
.wbp-sec > summary::after { content: "+"; font: var(--t-md)/1 var(--ui); color: var(--ink-3); }
.wbp-sec[open] > summary::after { content: "−"; }
.wbp-sec > summary:hover .wbp-sec__t { text-decoration: underline; text-underline-offset: .2em; }
.wbp-sec > summary:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }
.wbp-sec__n { font: var(--t-xs)/1 var(--mono); color: var(--ink-3); }
.wbp-sec[open] { margin-bottom: var(--s3); }
.wbp-sec[open] > summary { font-weight: 650; }
.wbp-sec[open] .wbp-sec__n { color: var(--brand); }
.wbp-g { margin: 0 0 0 1.75rem; padding: var(--s3) 0 0 var(--s4); border-left: 2px solid var(--brand); }
.wbp-g > div { margin: 0 0 var(--s3); }
.wbp-g dt { margin: 0 0 2px; font: var(--t-xs)/1.3 var(--mono); color: var(--ink-3); }
.wbp-g dd { margin: 0; font: var(--t-sm)/1.5 var(--ui); color: var(--ink-2); }
.wbp-g dd.wbp-g__f { color: var(--brand); font-weight: 600; }
.wbp-g ul { margin: 0; padding-left: 1.1em; }
.wbp-g dd.wbp-g__ex { color: var(--ink); }
.wbp-g__more { margin: 0 0 var(--s3) 1.75rem; padding-left: var(--s4); border-left: 2px solid var(--brand); }
.wbp-g__more summary { display: inline-flex; align-items: center; gap: var(--s2); min-height: 2.25rem; cursor: pointer; list-style: none; font: 600 var(--t-xs)/1.3 var(--ui); color: var(--ink-2); }
.wbp-g__more summary::-webkit-details-marker { display: none; }
.wbp-g__more summary::after { content: "+"; font-weight: 400; }
.wbp-g__more[open] summary::after { content: "−"; }
.wbp-g__more summary:hover { color: var(--ink); }
.wbp-g__more summary:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }
.wbp-g--more { margin: 0; padding: 0; border: 0; }
.wbp-g:not(.wbp-g--more) { padding-bottom: var(--s1); }
.wbp-g li + li { margin-top: var(--s1); }
/* A quiet pointer to the matching Copy & Content topic (reviewer request, 2026-11-02). */
.wbp-g__cpy { margin: var(--s2) 0 0 1.75rem; padding-left: var(--s4); font: var(--t-xs)/1.3 var(--mono); color: var(--ink-3); }
.wbp-g__cpy a { color: var(--ink-2); }

/* the rest, closed */
.wbp-more { max-width: 64rem; margin: 0 0 var(--s7); border-top: 1px solid var(--rule-firm); border-bottom: 1px solid var(--rule); }
.wbp-more summary { padding: var(--s4) 0; cursor: pointer; font: 650 var(--t-md)/1.2 var(--display); letter-spacing: -.015em; color: var(--ink); }
.wbp-more summary:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }
.wbp-more__in { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s5) var(--s7); padding: 0 0 var(--s6); }
.wbp-more__list { margin: 0; padding: 0; list-style: none; }
.wbp-more__list li { padding: var(--s2) 0; border-top: 1px solid var(--rule); font: var(--t-sm)/1.5 var(--ui); color: var(--ink-2); }
.wbp-more__list b { display: block; font-weight: 600; color: var(--ink); }
.wbp-more__list a { color: var(--ink); white-space: nowrap; }
.wbp-more__ref { grid-column: 1 / -1; margin: 0; font: var(--t-sm)/1.5 var(--ui); color: var(--ink-2); }
.wbp-more__ref a { color: var(--ink); font-weight: 600; }

.wbp-others { margin: 0 0 var(--s8); }
.wbp-others ul { display: flex; flex-wrap: wrap; gap: var(--s2) var(--s5); margin: 0; padding: 0; list-style: none; font: var(--t-sm)/1.5 var(--ui); }
.wbp-others a { color: var(--ink); text-underline-offset: .2em; }

@media (max-width: 40rem) {
  .wbp-filters button { padding: 0 var(--s3); }
  .wbp-head__for { font-size: var(--t-md); line-height: 1.25; }
}
@media (max-width: 56rem) {
  .wbp-more__in { grid-template-columns: minmax(0, 1fr); }
}

/* standalone small links get a 24px hit area (inline links in sentences are exempt, WCAG 2.5.8) */
.wbp-head .lc-kicker a, .wbp-guide a, .wbp-others a, .wbp-panel__more a { display: inline-block; padding-block: .3125rem; }
.wbp-full { margin: var(--s6) 0 var(--s5); } /* the full-pattern link, after the page drawings (2026-11-02) */