/*
 * Darja Rihla: Build Log 003, Web Evidence Inspector
 * Scope: post-content.html only. Loaded directly by the candidate Custom HTML block.
 * Requires: existing dr-global.css, dr-single-post.css and dr-post-base.css runtime.
 * Width system (20261005d): canvas up to 90rem (1440px), evidence column up to about
 * 1064px beside the record rail, readable prose capped at 52rem (832px).
 */

/*
 * Live width revision (20261005d).
 * dr-global.css and dr-post-base.css are unlayered and use specificity 0,2,1:
 *   body.dr-family-post .wp-block-post-content      width: min(100% - 2rem, var(--dr-container)), 1200px
 *   body.dr-family-post .wp-block-post-content > *  max-width: var(--dr-reading), 74ch, about 751px
 * Unlayered rules beat the layered resets in dr-single-post.css, so the alignfull
 * post-content block cannot widen this page. Release only the post-content wrapper of
 * post 2722 (specificity 0,3,1); #dr-build-003 below then sets its own canvas.
 */
body.postid-2722 .dr-single-content-wrap > .wp-block-post-content { width: 100%; }

#dr-build-003 {
  --dr-b003-ink: #eaf3f6;
  --dr-b003-muted: #aebec8;
  --dr-b003-paper: #e7ddca;
  --dr-b003-signal: #83d7d1;
  --dr-b003-warm: #d7a967;
  --dr-b003-link-hover: #c9f4ef;
  --dr-b003-focus: var(--dr-b003-warm);
  --dr-b003-line: color-mix(in srgb, var(--dr-b003-signal) 26%, transparent);
  --dr-b003-canvas: 90rem;
  --dr-b003-wide: 70rem;
  --dr-b003-prose: 52rem;
  --dr-b003-gutter: 2rem;
  --dr-b003-surface-graphite: color-mix(in srgb, var(--dr-b003-ink) 3%, transparent);
  --dr-b003-surface-warm: color-mix(in srgb, var(--dr-b003-warm) 6%, transparent);
  --dr-b003-surface-cool: color-mix(in srgb, var(--dr-b003-signal) 5%, transparent);
  width: min(100% - var(--dr-b003-gutter), var(--dr-b003-canvas));
  max-width: none;
  margin-inline: auto;
  color: var(--dr-b003-ink);
  background:
    linear-gradient(90deg, rgba(131, 215, 209, 0.035) 1px, transparent 1px),
    linear-gradient(rgba(131, 215, 209, 0.035) 1px, transparent 1px),
    radial-gradient(circle at 82% 7%, rgba(215, 169, 103, 0.16), transparent 28rem),
    linear-gradient(180deg, #0b141b 0%, #071019 48%, #060d13 100%);
  background-size: 2.5rem 2.5rem, 2.5rem 2.5rem, auto, auto;
  border-block: 1px solid rgba(131, 215, 209, 0.16);
  font-family: var(--dr-font-body, system-ui, sans-serif);
  overflow: hidden;
}

#dr-build-003 *,
#dr-build-003 *::before,
#dr-build-003 *::after { box-sizing: border-box; }

/* Theme bridge: reuse the site's existing light-mode selectors and tokens. */
html[data-theme="light"] #dr-build-003,
body.theme-light #dr-build-003 {
  --dr-b003-ink: var(--dr-text, #17130d);
  --dr-b003-muted: var(--dr-text-soft, #2c2519);
  --dr-b003-paper: var(--dr-heading, #0f0c08);
  --dr-b003-signal: var(--dr-cyan, #245b64);
  --dr-b003-warm: #805d1c;
  --dr-b003-link-hover: var(--dr-gold-2, #8a641d);
  --dr-b003-focus: var(--dr-cyan, #245b64);
  --dr-b003-line: var(--dr-border-soft, rgba(92, 78, 54, 0.15));
  background:
    linear-gradient(90deg, color-mix(in srgb, var(--dr-b003-signal) 8%, transparent) 1px, transparent 1px),
    linear-gradient(color-mix(in srgb, var(--dr-b003-signal) 8%, transparent) 1px, transparent 1px),
    radial-gradient(circle at 82% 7%, color-mix(in srgb, var(--dr-b003-warm) 16%, transparent), transparent 28rem),
    linear-gradient(180deg, var(--dr-bg-soft, #f8f3ea) 0%, var(--dr-bg, #f2eadc) 48%, var(--dr-bg-deep, #ddd2c0) 100%);
  border-color: var(--dr-border-soft, rgba(92, 78, 54, 0.15));
}

#dr-build-003 a { color: var(--dr-b003-signal); text-decoration-thickness: 1px; text-underline-offset: 0.18em; }
#dr-build-003 a:hover { color: var(--dr-b003-link-hover); }
#dr-build-003 a:focus-visible,
#dr-build-003 summary:focus-visible { outline: 2px solid var(--dr-b003-focus); outline-offset: 4px; }

#dr-build-003 .dr-build-003__article { width: min(100%, 1500px); margin-inline: auto; }

#dr-build-003 .dr-build-003__hero {
  position: relative;
  padding: clamp(4.5rem, 11vw, 9rem) clamp(1.25rem, 5vw, 5rem) clamp(3rem, 7vw, 6rem);
  border-bottom: 1px solid var(--dr-b003-line);
}

#dr-build-003 .dr-build-003__hero::after {
  position: absolute;
  right: clamp(1.25rem, 5vw, 5rem);
  top: clamp(2.4rem, 6vw, 4.5rem);
  width: min(30vw, 22rem);
  aspect-ratio: 1;
  border: 1px solid rgba(215, 169, 103, 0.26);
  border-radius: 50%;
  box-shadow: inset 0 0 0 1.75rem rgba(215, 169, 103, 0.035), inset 0 0 0 5rem rgba(131, 215, 209, 0.025);
  content: "";
  pointer-events: none;
}

#dr-build-003 .dr-build-003__eyebrow,
#dr-build-003 .dr-build-003__section-label,
#dr-build-003 .dr-build-003__status dt {
  font-family: var(--dr-font-mono, ui-monospace, monospace);
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

#dr-build-003 .dr-build-003__eyebrow { position: relative; z-index: 1; margin: 0 0 1.25rem; color: var(--dr-b003-warm); font-size: 0.76rem; }
#dr-build-003 .dr-build-003__eyebrow span { padding-inline: 0.35rem; color: var(--dr-b003-muted); }
#dr-build-003 .dr-build-003__title { position: relative; z-index: 1; max-width: 36ch; margin: 0 0 clamp(1.2rem, 3vw, 2rem); color: var(--dr-b003-ink); font-family: var(--dr-font-display, Georgia, serif); font-size: clamp(1.4rem, 2.4vw, 2.15rem); font-weight: 500; line-height: 1.08; letter-spacing: -0.025em; text-wrap: balance; }

#dr-build-003 .dr-build-003__hero-grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(15rem, 0.7fr); gap: clamp(2rem, 7vw, 8rem); align-items: end; }
#dr-build-003 .dr-build-003__lede { max-width: 18ch; margin: 0; color: var(--dr-b003-paper); font-family: var(--dr-font-display, Georgia, serif); font-size: clamp(2.4rem, 6.4vw, 6rem); font-weight: 500; line-height: 0.98; letter-spacing: -0.04em; }

#dr-build-003 .dr-build-003__status { display: grid; gap: 0.95rem; margin: 0; padding: 1.15rem 0; border-top: 1px solid var(--dr-b003-line); border-bottom: 1px solid var(--dr-b003-line); }
#dr-build-003 .dr-build-003__status div { display: grid; grid-template-columns: minmax(7rem, 1fr) minmax(0, 1fr); gap: 0.75rem; }
#dr-build-003 .dr-build-003__status dt { color: var(--dr-b003-muted); font-size: 0.67rem; }
#dr-build-003 .dr-build-003__status dd { margin: 0; color: var(--dr-b003-ink); font-size: 0.9rem; font-weight: 650; }
#dr-build-003 .dr-build-003__boundary { position: relative; z-index: 1; max-width: 74ch; margin: clamp(2.5rem, 6vw, 5rem) 0 0; color: var(--dr-b003-muted); font-size: 0.93rem; line-height: 1.65; }

#dr-build-003 .dr-build-003__layout { padding: clamp(3.5rem, 8vw, 7rem) clamp(1.25rem, 5vw, 5rem) clamp(5rem, 10vw, 9rem); }

#dr-build-003 .dr-build-003__content { min-width: 0; max-width: var(--dr-b003-wide); }
#dr-build-003 .dr-build-003__content section + section { margin-top: clamp(4rem, 9vw, 8rem); }
#dr-build-003 .dr-build-003__content section:nth-of-type(5n + 2) { background: linear-gradient(90deg, var(--dr-b003-surface-graphite), transparent 82%); }
#dr-build-003 .dr-build-003__content section:nth-of-type(5n + 3) { background: linear-gradient(90deg, var(--dr-b003-surface-warm), transparent 82%); }
#dr-build-003 .dr-build-003__content section:nth-of-type(5n + 5) { background: linear-gradient(90deg, var(--dr-b003-surface-cool), transparent 82%); }
#dr-build-003 .dr-build-003__section-label { display: flex; gap: 0.7rem; align-items: center; margin: 0 0 1rem; color: var(--dr-b003-warm); font-size: 0.7rem; }
#dr-build-003 .dr-build-003__section-label span { color: var(--dr-b003-muted); }
#dr-build-003 h2 { max-width: 20ch; margin: 0; color: var(--dr-b003-paper); font-family: var(--dr-font-display, Georgia, serif); font-size: clamp(2rem, 4.2vw, 4.25rem); font-weight: 500; line-height: 1.04; letter-spacing: -0.035em; text-wrap: balance; }
#dr-build-003 h3 { margin: 0 0 0.55rem; color: var(--dr-b003-ink); font-size: 1rem; line-height: 1.25; }
#dr-build-003 p,
#dr-build-003 li { color: var(--dr-b003-muted); font-size: 1rem; line-height: 1.8; }
#dr-build-003 h2 + p,
#dr-build-003 h2 + .dr-build-003__split,
#dr-build-003 h2 + .dr-build-003__outputs,
#dr-build-003 h2 + .dr-build-003__run-table { margin-top: 1.5rem; }
#dr-build-003 p + p { margin-top: 1rem; }
#dr-build-003 .dr-build-003__content section > p,
#dr-build-003 .dr-build-003__content section > .dr-build-003__limits,
#dr-build-003 .dr-build-003__content section > .dr-build-003__callout,
#dr-build-003 .dr-build-003__content section > .dr-build-003__details { max-width: var(--dr-b003-prose); }
#dr-build-003 code { padding: 0.14em 0.35em; border: 1px solid rgba(131, 215, 209, 0.2); border-radius: 3px; background: rgba(131, 215, 209, 0.07); color: #d4fbf7; font-family: var(--dr-font-mono, ui-monospace, monospace); font-size: 0.88em; }

#dr-build-003 .dr-build-003__pipeline { margin: clamp(2rem, 5vw, 4rem) 0 0; padding: clamp(1rem, 3vw, 2rem); border: 1px solid var(--dr-b003-line); background: rgba(4, 14, 19, 0.56); }
#dr-build-003 .dr-build-003__pipeline svg { display: block; width: 100%; height: auto; color: var(--dr-b003-signal); }
#dr-build-003 .dr-build-003__pipeline-flow { opacity: 0.7; }
#dr-build-003 .dr-build-003__pipeline-step rect { fill: rgba(131, 215, 209, 0.06); stroke: rgba(131, 215, 209, 0.48); }
#dr-build-003 .dr-build-003__pipeline-step text { fill: var(--dr-b003-ink); font-family: var(--dr-font-mono, ui-monospace, monospace); font-size: 12px; letter-spacing: 0.5px; text-anchor: middle; }
#dr-build-003 .dr-build-003__pipeline-fallback { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; margin: 1.25rem 0 0; padding: 1px; list-style: none; background: var(--dr-b003-line); }
#dr-build-003 .dr-build-003__pipeline-fallback li { display: grid; gap: 0.5rem; min-height: 8.5rem; margin: 0; padding: 1rem; background: #0a151d; color: var(--dr-b003-muted); font-size: 0.82rem; line-height: 1.5; }
#dr-build-003 .dr-build-003__pipeline-fallback span { color: var(--dr-b003-warm); font: 0.66rem/1 var(--dr-font-mono, ui-monospace, monospace); letter-spacing: 0.08em; }
#dr-build-003 .dr-build-003__pipeline-fallback strong { color: var(--dr-b003-ink); font-size: 0.92rem; }
#dr-build-003 .dr-build-003__pipeline-fallback small { color: var(--dr-b003-muted); font-size: inherit; }
#dr-build-003 figcaption,
#dr-build-003 .dr-build-003__caption { margin-top: 0.9rem; color: var(--dr-b003-muted); font-size: 0.82rem; line-height: 1.55; }

#dr-build-003 .dr-build-003__image { width: 100%; max-width: 56rem; margin: clamp(2rem, 5vw, 4rem) 0 0; padding: clamp(0.4rem, 1vw, 0.65rem); border: 1px solid var(--dr-b003-line); background: rgba(4, 14, 19, 0.56); }
#dr-build-003 .dr-build-003__image img { display: block; width: 100%; max-width: 100%; height: auto; border: 1px solid rgba(131, 215, 209, 0.2); background: #0a151d; }
#dr-build-003 .dr-build-003__image figcaption { max-width: 70ch; margin: 0.75rem 0 0; }
#dr-build-003 .dr-build-003__image--hero { position: relative; z-index: 1; max-width: 66rem; margin-left: auto; }
#dr-build-003 .dr-build-003__image--pipeline,
#dr-build-003 .dr-build-003__image--runs { margin-left: auto; }
#dr-build-003 .dr-build-003__image--bundle { max-width: 45rem; }
#dr-build-003 .dr-build-003__result .dr-build-003__image--result { max-width: 48rem; }

#dr-build-003 .dr-build-003__callout { margin-top: clamp(2rem, 5vw, 4rem); padding: clamp(1.25rem, 3vw, 2rem); border-left: 3px solid var(--dr-b003-warm); background: linear-gradient(90deg, rgba(215, 169, 103, 0.12), transparent); }
#dr-build-003 .dr-build-003__callout strong { color: var(--dr-b003-warm); font-size: 0.82rem; letter-spacing: 0.06em; text-transform: uppercase; }
#dr-build-003 .dr-build-003__callout p { margin: 0.65rem 0 0; }

#dr-build-003 .dr-build-003__outputs { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 1px; border: 1px solid var(--dr-b003-line); background: var(--dr-b003-line); }
#dr-build-003 .dr-build-003__outputs article { min-height: 13rem; padding: 1.25rem; background: #0a151d; }
#dr-build-003 .dr-build-003__outputs article > span { display: block; margin-bottom: 2.4rem; color: var(--dr-b003-warm); font: 0.68rem/1 var(--dr-font-mono, ui-monospace, monospace); }
#dr-build-003 .dr-build-003__outputs p { margin: 0; font-size: 0.86rem; line-height: 1.6; }

#dr-build-003 .dr-build-003__split { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(1rem, 4vw, 3rem); }
#dr-build-003 .dr-build-003__split > div { padding-top: 1.25rem; border-top: 1px solid var(--dr-b003-line); }
#dr-build-003 .dr-build-003__split ul,
#dr-build-003 .dr-build-003__limits { margin: 0; padding-left: 1.15rem; }
#dr-build-003 .dr-build-003__split li,
#dr-build-003 .dr-build-003__limits li { margin-bottom: 0.8rem; }

#dr-build-003 .dr-build-003__run-table { overflow-x: auto; border: 1px solid var(--dr-b003-line); background: rgba(4, 14, 19, 0.56); }
#dr-build-003 table { width: 100%; min-width: 38rem; border-collapse: collapse; }
#dr-build-003 th,
#dr-build-003 td { padding: 1rem; border-bottom: 1px solid rgba(131, 215, 209, 0.14); text-align: left; vertical-align: top; }
#dr-build-003 th { color: var(--dr-b003-warm); font: 0.68rem/1.3 var(--dr-font-mono, ui-monospace, monospace); letter-spacing: 0.07em; text-transform: uppercase; }
#dr-build-003 td { color: var(--dr-b003-muted); font-size: 0.88rem; line-height: 1.6; }
#dr-build-003 tr:last-child td { border-bottom: 0; }

#dr-build-003 .dr-build-003__result { margin-top: 1.5rem; padding: clamp(2rem, 6vw, 5rem); border: 1px solid rgba(215, 169, 103, 0.42); background: linear-gradient(135deg, rgba(215, 169, 103, 0.13), rgba(131, 215, 209, 0.055)); }
#dr-build-003 .dr-build-003__result > p:first-child { margin: 0 0 1rem; color: var(--dr-b003-warm); font: 0.7rem/1.3 var(--dr-font-mono, ui-monospace, monospace); letter-spacing: 0.1em; text-transform: uppercase; }
#dr-build-003 .dr-build-003__result-title { max-width: none; margin: 0; color: var(--dr-b003-paper); font-family: var(--dr-font-display, Georgia, serif); font-size: clamp(3rem, 8vw, 7rem); font-weight: 500; line-height: 1.04; letter-spacing: -0.035em; }
#dr-build-003 .dr-build-003__result-title + p { max-width: 65ch; }

#dr-build-003 .dr-build-003__details { margin-top: 1.25rem; border-top: 1px solid var(--dr-b003-line); border-bottom: 1px solid var(--dr-b003-line); }
#dr-build-003 .dr-build-003__details summary { padding: 1rem 0; color: var(--dr-b003-signal); cursor: pointer; font-size: 0.92rem; }
#dr-build-003 .dr-build-003__details p { margin: 0; padding: 0 0 1rem; }

#dr-build-003 .dr-build-003__next-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; margin-top: 1.5rem; border: 1px solid var(--dr-b003-line); background: var(--dr-b003-line); }
#dr-build-003 .dr-build-003__next-grid > div { padding: clamp(1.25rem, 3vw, 2rem); background: #0a151d; }
#dr-build-003 .dr-build-003__next-grid h3 { color: var(--dr-b003-warm); font-family: var(--dr-font-mono, ui-monospace, monospace); font-size: 0.76rem; letter-spacing: 0.08em; text-transform: uppercase; }
#dr-build-003 .dr-build-003__next-grid p { margin: 0; font-size: 0.9rem; line-height: 1.65; }
#dr-build-003 .dr-build-003__return { margin-top: 2rem; }
#dr-build-003 .dr-build-003__return a { display: inline-block; padding: 0.75rem 1rem; border: 1px solid var(--dr-b003-signal); text-decoration: none; }

html[data-theme="light"] #dr-build-003 code,
body.theme-light #dr-build-003 code { border-color: color-mix(in srgb, var(--dr-b003-signal) 28%, transparent); background: var(--dr-surface-3, rgba(80, 64, 42, 0.1)); color: var(--dr-b003-signal); }
html[data-theme="light"] #dr-build-003 .dr-build-003__pipeline,
html[data-theme="light"] #dr-build-003 .dr-build-003__run-table,
body.theme-light #dr-build-003 .dr-build-003__pipeline,
body.theme-light #dr-build-003 .dr-build-003__run-table { background: var(--dr-panel, #fffaf1); }
html[data-theme="light"] #dr-build-003 .dr-build-003__image,
body.theme-light #dr-build-003 .dr-build-003__image { border-color: var(--dr-border-soft, rgba(92, 78, 54, 0.15)); background: var(--dr-panel, #fffaf1); }
html[data-theme="light"] #dr-build-003 .dr-build-003__image img,
body.theme-light #dr-build-003 .dr-build-003__image img { border-color: color-mix(in srgb, var(--dr-b003-signal) 28%, transparent); background: var(--dr-bg-soft, #f8f3ea); }
html[data-theme="light"] #dr-build-003 .dr-build-003__outputs article,
html[data-theme="light"] #dr-build-003 .dr-build-003__pipeline-fallback li,
html[data-theme="light"] #dr-build-003 .dr-build-003__next-grid > div,
body.theme-light #dr-build-003 .dr-build-003__outputs article,
body.theme-light #dr-build-003 .dr-build-003__pipeline-fallback li,
body.theme-light #dr-build-003 .dr-build-003__next-grid > div { background: var(--dr-panel, #fffaf1); }
html[data-theme="light"] #dr-build-003 .dr-build-003__pipeline-step rect,
body.theme-light #dr-build-003 .dr-build-003__pipeline-step rect { fill: color-mix(in srgb, var(--dr-b003-signal) 7%, var(--dr-panel, #fffaf1)); stroke: color-mix(in srgb, var(--dr-b003-signal) 48%, transparent); }
html[data-theme="light"] #dr-build-003 .dr-build-003__callout,
body.theme-light #dr-build-003 .dr-build-003__callout { background: linear-gradient(90deg, color-mix(in srgb, var(--dr-b003-warm) 14%, transparent), transparent); }
html[data-theme="light"] #dr-build-003 .dr-build-003__result,
body.theme-light #dr-build-003 .dr-build-003__result { border-color: color-mix(in srgb, var(--dr-b003-warm) 45%, transparent); background: linear-gradient(135deg, color-mix(in srgb, var(--dr-b003-warm) 14%, var(--dr-panel, #fffaf1)), color-mix(in srgb, var(--dr-b003-signal) 7%, var(--dr-panel, #fffaf1))); }

@media (max-width: 960px) {
  #dr-build-003 .dr-build-003__hero-grid { grid-template-columns: 1fr; }
  #dr-build-003 .dr-build-003__outputs { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  #dr-build-003 .dr-build-003__pipeline-fallback { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #dr-build-003 .dr-build-003__image--hero,
  #dr-build-003 .dr-build-003__image--pipeline,
  #dr-build-003 .dr-build-003__image--runs { margin-left: 0; }
}

/* Keep the existing production mobile gutter (dr-post-base.css at max-width 820px: 100% - 1.1rem). */
@media (max-width: 820px) {
  #dr-build-003 { --dr-b003-gutter: 1.1rem; }
}

@media (max-width: 640px) {
  #dr-build-003 .dr-build-003__hero::after { width: 12rem; right: -3rem; top: 1rem; }
  #dr-build-003 .dr-build-003__status div { grid-template-columns: 1fr; gap: 0.25rem; }
  #dr-build-003 .dr-build-003__split,
  #dr-build-003 .dr-build-003__next-grid,
  #dr-build-003 .dr-build-003__outputs,
  #dr-build-003 .dr-build-003__pipeline-fallback { grid-template-columns: 1fr; }
  #dr-build-003 .dr-build-003__outputs article { min-height: 0; }
  #dr-build-003 .dr-build-003__outputs article > span { margin-bottom: 1rem; }
  #dr-build-003 .dr-build-003__pipeline { overflow-x: auto; }
  #dr-build-003 .dr-build-003__pipeline svg { min-width: 48rem; }
  #dr-build-003 .dr-build-003__image { padding: 0.4rem; }
}

@media (prefers-reduced-motion: reduce) {
  #dr-build-003 * { scroll-behavior: auto; }
}