/* Only the five guide figures: no navigation, shared storefront, or business styles. */
.research-guide .guide-diagram{margin:0;min-width:0;max-width:100%;color:var(--ink);font-family:var(--font-sans)}
.research-guide .guide-diagram-canvas{max-width:100%;overflow-x:auto;border:1px solid var(--line);border-radius:10px;background:var(--surface-2);padding:16px;box-sizing:border-box;scrollbar-width:thin}
.research-guide .guide-diagram-canvas:focus-visible{outline:3px solid var(--teal-strong);outline-offset:3px}
.research-guide .guide-diagram svg[role=img]{display:block;max-width:none;min-width:0;width:100%;height:auto;margin:auto;overflow:visible}
.research-guide .guide-diagram[data-diagram=vial] svg{max-width:420px;min-width:280px}
.research-guide .guide-diagram[data-diagram=bevel] svg{max-width:420px;min-width:280px}
.research-guide .guide-diagram[data-diagram=sites] svg{width:280px;max-width:100%;min-width:260px}
.research-guide .guide-diagram[data-diagram=pen] svg{width:100%;min-width:560px;max-width:760px}
.research-guide .guide-diagram[data-diagram=filling] svg{max-width:420px;min-width:280px}
.research-guide .guide-diagram svg [stroke]{vector-effect:non-scaling-stroke}
.research-guide .guide-diagram svg [stroke="var(--border)"],.research-guide .guide-diagram svg [stroke="var(--teal-mid)"]{stroke:var(--muted)}
.research-guide .guide-diagram svg text{font-family:var(--font-sans);fill:var(--ink)}
.research-guide .guide-diagram svg text[fill="#1fc99f"],.research-guide .guide-diagram svg text[fill="#fff"]{fill:var(--on-dark)}
.research-guide .guide-diagram svg [fill="#0d2a1e"]{fill:var(--navy);opacity:1}
.research-guide .guide-diagram[data-diagram=pen] svg circle{fill:var(--navy)}
.research-guide .guide-diagram figcaption{margin-top:12px;font-size:var(--fs-sm);line-height:1.6;color:var(--ink-2)}
.research-guide .guide-diagram figcaption strong{display:block;font-size:var(--fs-base);color:var(--ink)}
.research-guide .guide-diagram-note{margin:6px 0 10px;max-width:65ch}
.research-guide .guide-diagram-legend{display:flex;flex-wrap:wrap;gap:6px;list-style:none;padding:0;margin:0}
.research-guide .guide-diagram-legend li{font-size:var(--fs-sm);line-height:1.5;border:1px solid var(--line);border-radius:5px;background:var(--surface);padding:4px 8px;color:var(--ink)}
.research-guide [style*="display:flex"]:has(>.guide-diagram){display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px!important;align-items:start!important}
@media(max-width:1100px){.research-guide [style*="display:flex"]:has(>.guide-diagram){grid-template-columns:minmax(0,1fr)}.research-guide .guide-diagram{width:100%}.research-guide .guide-diagram-canvas{padding:10px}}
@media print{.research-guide .guide-diagram{break-inside:avoid}.research-guide .guide-diagram-canvas{overflow:visible}.research-guide .guide-diagram[data-diagram=pen] svg{min-width:0}.research-guide .guide-diagram-legend li{border-color:currentColor}}
/* Preserve readable label sizes; narrow screens scroll the figure, never the page. */
.research-guide .guide-diagram[data-diagram=vial] svg{min-width:420px}
.research-guide .guide-diagram[data-diagram=bevel] svg{min-width:320px}
.research-guide .guide-diagram[data-diagram=sites] svg{min-width:280px}
.research-guide .guide-diagram[data-diagram=filling] svg{min-width:320px}
@media(max-width:760px){.research-guide .guide-diagram-canvas::after{content:"Scroll horizontally to inspect the full illustration.";display:block;position:sticky;left:0;margin-top:10px;font:var(--fs-sm)/1.5 var(--font-sans);color:var(--ink-2);max-width:32ch}}
/* Old figure holders used flex-shrink:0; constrain them so only the canvas scrolls. */
.research-guide div:has(>.guide-diagram){flex:1 1 340px!important;width:min(100%,460px);min-width:0;max-width:100%;box-sizing:border-box}
.research-guide div:has(>.guide-diagram[data-diagram=pen]){width:100%;flex-basis:100%!important}
.research-guide .guide-diagram,.research-guide .guide-diagram-canvas{width:100%;min-width:0;max-width:100%}
.research-guide .diagram-wrap:has(.guide-diagram){flex-wrap:wrap;align-items:flex-start}