/* CSS instrument-panel icon foundation. Opt-in; no BUY layout overrides. */
.css-instrument{display:inline-grid;place-items:center;width:2.5rem;height:2.5rem;flex:none;color:var(--css-green,#84ff48);border:1px solid rgba(132,255,72,.36);border-radius:5px;background:rgba(6,12,8,.92);box-shadow:inset 0 0 0 1px rgba(0,0,0,.6);vertical-align:middle}
.css-instrument svg{width:65%;height:65%;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 2px rgba(132,255,72,.22))}
.css-instrument[data-state="active"]{border-color:currentColor;box-shadow:inset 0 0 5px rgba(132,255,72,.1),0 0 7px rgba(132,255,72,.14)}
.css-instrument[data-tone="amber"]{color:#ffb24e;border-color:rgba(255,178,78,.4)}
.css-instrument[data-tone="amber"] svg{filter:drop-shadow(0 0 2px rgba(255,178,78,.22))}
.css-instrument[data-tone="red"]{color:#ff7771;border-color:rgba(255,119,113,.4)}
@media(prefers-reduced-motion:reduce){.css-instrument,.css-instrument svg{animation:none!important;transition:none!important}}

/* Shared section-label placement. No heading dimensions or tool controls changed. */
.css-section-icon{display:inline-grid;place-items:center;width:1.6em;height:1.6em;vertical-align:-.43em;margin-right:.55em;border:1px solid rgba(132,255,72,.28);border-radius:3px;background:rgba(6,12,8,.75);color:var(--css-green,#84ff48);box-shadow:0 0 5px rgba(132,255,72,.10)}
.css-section-icon svg{width:74%;height:74%;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 2px rgba(132,255,72,.24))}
.css-section-icon[data-tone="amber"]{color:#ffb24e;border-color:rgba(255,178,78,.35)}
.css-section-icon[data-tone="amber"] svg{filter:drop-shadow(0 0 2px rgba(255,178,78,.24))}

/* Panel-top-left placement, opt-in to major panels only.
   Icon sits in normal flow: never overlays a heading or narrows controls. */
.spec-intro>.tool-kicker,.finder-callout .tool-kicker,.compare-intro>.tool-kicker,.section-title>.tool-kicker,
.routes>header>.eyebrow,.diagnostic>header>.eyebrow,
.mod-section>header>.kicker {display:flex;align-items:center;gap:9px;text-align:left}
.spec-intro>.tool-kicker .css-section-icon,.finder-callout .tool-kicker .css-section-icon,
.compare-intro>.tool-kicker .css-section-icon,.section-title>.tool-kicker .css-section-icon,
.routes>header>.eyebrow .css-section-icon,.diagnostic>header>.eyebrow .css-section-icon,
.mod-section>header>.kicker .css-section-icon{margin-right:0;flex:none}
@media(max-width:380px){.css-section-icon{width:1.35em;height:1.35em}}
