/* Explanatory drawings sit directly on the portfolio page. */
.studio-diagram.sketch-diagram{--sketch-ink:var(--ink);--sketch-muted:var(--muted);--sketch-paper:var(--bg);--sketch-highlight:#f3e9c6;margin:28px 0 36px;padding:6px 0 0;border:0;background:none;border-radius:0}.sketch-diagram svg{display:block;width:100%;height:auto;overflow:visible}.sketch-box{fill:var(--sketch-paper);stroke:var(--sketch-ink);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.sketch-highlight{fill:var(--sketch-highlight)}.sketch-dashed{stroke-dasharray:3 3}.sketch-line{fill:none;stroke:var(--sketch-ink);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.sketch-arrowhead{fill:none;stroke:var(--sketch-ink);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.sketch-label,.sketch-sub,.sketch-note,.sketch-kicker{font-family:Inter,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;fill:var(--sketch-ink)}.sketch-label{font-size:17px;font-weight:500;letter-spacing:-.25px}.sketch-sub{font-size:13px;fill:var(--sketch-muted)}.sketch-note{font-size:14px;font-style:italic;fill:var(--sketch-muted)}.sketch-kicker{font-size:11px;letter-spacing:1.2px;fill:var(--sketch-muted)}.studio-diagram.sketch-diagram figcaption{font-size:11px;line-height:1.8;margin:16px 0 0;padding:0;color:var(--muted);border:0}.sketch-diagram figcaption>span{display:block;font-size:10px;letter-spacing:.08em;margin-bottom:7px;color:var(--muted)}.sketch-box,.sketch-line,.sketch-arrowhead,.sketch-label,.sketch-sub,.sketch-note,.sketch-kicker{transition:fill 400ms ease-out,stroke 400ms ease-out}[data-theme=dark] .sketch-diagram{--sketch-highlight:#473f24}@media(max-width:480px){.studio-diagram.sketch-diagram{margin:24px 0 30px}.sketch-label{font-size:19px}.sketch-sub{font-size:15px}.sketch-note{font-size:16px}.sketch-kicker{font-size:13px}.studio-diagram.sketch-diagram figcaption{font-size:11px}.sketch-box,.sketch-line{stroke-width:2}}@media(prefers-reduced-motion:reduce){.sketch-box,.sketch-line,.sketch-arrowhead,.sketch-label,.sketch-sub,.sketch-note,.sketch-kicker{transition:none!important}}

/* Compact explanatory diagrams; keep mobile labels legible. */
.studio-diagram.sketch-diagram{max-width:430px;margin:20px auto 28px;padding:0}.studio-diagram.sketch-diagram svg{width:100%}.studio-diagram.sketch-diagram figcaption{margin-top:10px;line-height:1.65}@media(max-width:480px){.studio-diagram.sketch-diagram{max-width:360px;margin:18px auto 24px}}