[data-interactive="hole-callout"] { margin-block: 1rem; }
[data-interactive="hole-callout"] .hc-controls { display: grid; grid-template-columns: repeat(auto-fit,minmax(175px,1fr)); gap: .8rem; }
[data-interactive="hole-callout"] label { display: flex; flex-direction: column; gap: .3rem; color: var(--ink); font: inherit; }
[data-interactive="hole-callout"] input,
[data-interactive="hole-callout"] select,
[data-interactive="hole-callout"] button { min-height: 44px; padding: .5rem; max-width: 100%; min-width: 0; border: 1px solid var(--rule); border-radius: 4px; background: var(--surface); color: var(--ink); font: inherit; }
[data-interactive="hole-callout"] button { cursor: pointer; align-self: end; }
[data-interactive="hole-callout"] :is(input,select,button):focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }
[data-interactive="hole-callout"] [hidden] { display: none !important; }
[data-interactive="hole-callout"] .hc-callout { white-space: pre-wrap; overflow-wrap: anywhere; padding: 1rem; background: var(--surface-2); border-left: 4px solid var(--msu-gold); color: var(--ink); font-size: 1.25rem; }
[data-interactive="hole-callout"] svg { display: block; width: 100%; max-width: 620px; margin-inline: auto; }
[data-interactive="hole-callout"] svg text { fill: var(--ink); font: 15px Arial,sans-serif; }
[data-interactive="hole-callout"] .hc-material { fill: var(--surface-2); stroke: var(--ink); stroke-width: 2; }
[data-interactive="hole-callout"] .hc-axis { fill: none; stroke: var(--ink-soft); stroke-dasharray: 14 4 3 4; }
[data-interactive="hole-callout"] .hc-measure { fill: none; stroke: var(--accent); stroke-width: 1.5; }
[data-interactive="hole-callout"] .hc-error:not(:empty) { border-left: 4px solid var(--msu-redorange); padding: .7rem; }
[data-interactive="hole-callout"][data-hc-ready] .hc-static { display: none; }
@media print {
  [data-interactive="hole-callout"] .hc-live { display: none !important; }
  [data-interactive="hole-callout"][data-hc-ready] .hc-static { display: block; }
}