[data-unit-visual-extension^="p05_"] {
    --p05-ink: #183c40;
    --p05-muted: #486366;
    --p05-accent: #126d73;
    --p05-line: #bfcece;
    --p05-alert: #a13731;
    color: var(--p05-ink);
    background: #f3f8f7;
    border: 1px solid #ccdedc;
    border-radius: 16px;
    padding: clamp(14px, 3vw, 26px);
    margin: 24px 0;
    min-width: 0;
    line-height: 1.6;
}
[data-unit-visual-extension^="p05_"] * { box-sizing: border-box; }
[data-unit-visual-extension^="p05_"] .p05-title { margin: 0 0 12px; font-size: 1.18rem; line-height: 1.4; }
[data-unit-visual-extension^="p05_"] .p05-intro { margin: 0 0 18px; }
[data-unit-visual-extension^="p05_"] .p05-svg { display: block; width: 100%; max-width: 650px; height: auto; margin: 0 auto; overflow: visible; }
[data-unit-visual-extension="p05_spring_timing"] .p05-svg { max-width: 520px; }
[data-unit-visual-extension^="p05_"] .p05-svg-text { font: 18px system-ui, sans-serif; fill: var(--p05-ink); }
[data-unit-visual-extension^="p05_"] .p05-tick { font: 19px system-ui, sans-serif; fill: var(--p05-muted); }
[data-unit-visual-extension^="p05_"] .p05-grid { stroke: #dbe5e4; stroke-width: 0.8; }
[data-unit-visual-extension^="p05_"] .p05-axis { stroke: var(--p05-ink); stroke-width: 1.4; }
[data-unit-visual-extension^="p05_"] .p05-best { stroke: #78888a; stroke-width: 1.8; stroke-dasharray: 6 5; }
[data-unit-visual-extension^="p05_"] .p05-candidate { stroke: var(--p05-accent); stroke-width: 2.5; }
[data-unit-visual-extension^="p05_"] .p05-error { stroke: currentColor; stroke-width: 1.6; }
[data-unit-visual-extension^="p05_"] .p05-bar.is-in { color: #27624b; }
[data-unit-visual-extension^="p05_"] .p05-bar.is-out { color: var(--p05-alert); }
[data-unit-visual-extension^="p05_"] .p05-point { stroke: var(--p05-ink); stroke-width: 1.3; }
[data-unit-visual-extension^="p05_"] .p05-apparatus { stroke: #5a7477; stroke-width: 2.5; }
[data-unit-visual-extension^="p05_"] .p05-reference { stroke: #a3612d; stroke-width: 1.5; stroke-dasharray: 4 3; }
[data-unit-visual-extension^="p05_"] .p05-spring { fill: none; stroke: var(--p05-accent); stroke-width: 2; }
[data-unit-visual-extension^="p05_"] .p05-mass { fill: #d6e9e5; stroke: var(--p05-ink); stroke-width: 1.5; }
[data-unit-visual-extension^="p05_"] .p05-readout { display: flex; align-items: baseline; flex-wrap: wrap; gap: 8px; min-height: 44px; margin: 14px 0; }
[data-unit-visual-extension^="p05_"] .p05-equation { flex-basis: 100%; }
[data-unit-visual-extension^="p05_"] .p05-value-pair { display: inline-flex; align-items: baseline; gap: 4px; white-space: nowrap; }
[data-unit-visual-extension^="p05_"] .p05-number { display: inline-block; width: 5.5ch; min-width: 5.5ch; font-variant-numeric: tabular-nums; font-feature-settings: "tnum"; text-align: right; font-family: inherit; }
[data-unit-visual-extension^="p05_"] input.p05-number { width: 8ch; min-width: 8ch; padding: 6px; min-height: 44px; font-size: 16px; border: 1px solid #91a9aa; border-radius: 6px; background: white; color: var(--p05-ink); }
[data-unit-visual-extension^="p05_"] .p05-controls { display: grid; gap: 12px; }
[data-unit-visual-extension^="p05_"] .p05-control-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(100px, 2fr) auto; align-items: center; gap: 12px; margin: 10px 0; }
[data-unit-visual-extension^="p05_"] .p05-range { min-width: 0; width: 100%; min-height: 44px; accent-color: var(--p05-accent); }
[data-unit-visual-extension^="p05_"] .p05-actions { display: flex; flex-wrap: wrap; gap: 8px; margin: 16px 0; }
[data-unit-visual-extension^="p05_"] .p05-button { appearance: none; min-height: 44px; padding: 8px 14px; border: 1px solid #8eaaaa; border-radius: 8px; color: var(--p05-ink); background: #fff; font: inherit; line-height: 1.35; cursor: pointer; }
[data-unit-visual-extension^="p05_"] .p05-button[aria-pressed="true"] { color: #fff; background: var(--p05-accent); border-color: var(--p05-accent); }
[data-unit-visual-extension^="p05_"] :is(button, input):focus-visible { outline: 3px solid #d38739; outline-offset: 3px; }
[data-unit-visual-extension^="p05_"] .p05-feedback { margin: 12px 0; font-weight: 560; }
[data-unit-visual-extension^="p05_"] .p05-feedback:empty { display: none; }
[data-unit-visual-extension^="p05_"] .p05-lab-layout { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(290px, 1fr); gap: 20px; align-items: start; }
[data-unit-visual-extension^="p05_"] .p05-control-side { min-width: 0; }
[data-unit-visual-extension^="p05_"] .p05-control-side .p05-control-row { grid-template-columns: minmax(0, 1fr) auto; gap: 0 8px; margin: 4px 0; }
[data-unit-visual-extension^="p05_"] .p05-control-side .p05-control-label { grid-column: 1 / -1; }
[data-unit-visual-extension^="p05_"] .p05-control-side .p05-readout { margin-top: 0; margin-bottom: 4px; }
[data-unit-visual-extension^="p05_"] .p05-control-side .p05-controls { gap: 4px; }
[data-unit-visual-extension^="p05_"] .p05-control-side .p05-actions { margin: 10px 0; }
[data-unit-visual-extension^="p05_"] .p05-control-side .p05-table :is(th, td) { padding-top: 4px; padding-bottom: 4px; }
[data-unit-visual-extension^="p05_"] .p05-summary { margin: 12px 0; }
[data-unit-visual-extension^="p05_"] :is(.p05-legend, .p05-caption) { color: var(--p05-muted); font-size: 0.95rem; margin: 12px 0; }
[data-unit-visual-extension^="p05_"] .p05-table { width: 100%; border-collapse: collapse; font-size: 0.95rem; table-layout: fixed; }
[data-unit-visual-extension^="p05_"] .p05-table :is(th, td) { text-align: left; border-bottom: 1px solid var(--p05-line); padding: 8px 5px; overflow-wrap: anywhere; }
[data-unit-visual-extension^="p05_"] .p05-table th { font-weight: 600; }
[data-unit-visual-extension^="p05_"] .p05-table th:first-child { width: 12%; }
[data-unit-visual-extension^="p05_"] .p05-table [data-crosses="false"] td:last-child { color: var(--p05-alert); font-weight: 650; }
[data-unit-visual-extension^="p05_"] .p05-tabular { font-variant-numeric: tabular-nums; }
[data-unit-visual-extension^="p05_"] .p05-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
[data-unit-visual-extension^="p05_"] .p05-field { display: flex; flex-direction: column; gap: 8px; }
[data-unit-visual-extension^="p05_"] .p05-entry { min-width: 0; width: 100%; min-height: 44px; border: 1px solid #91a9aa; border-radius: 6px; padding: 8px; font: inherit; font-size: 16px; color: var(--p05-ink); background: #fff; }
[data-unit-visual-extension^="p05_"] [aria-invalid="true"] { border-color: var(--p05-alert); border-width: 2px; }
[data-unit-visual-extension^="p05_"] .p05-limit-values { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin: 20px 0; }
[data-unit-visual-extension^="p05_"] .p05-limit-values dt { font-size: 0.94rem; }
[data-unit-visual-extension^="p05_"] .p05-limit-values dd { margin: 8px 0 0; font-size: 1.15rem; }
@media (max-width: 600px) {
    [data-unit-visual-extension^="p05_"] .p05-control-row { grid-template-columns: minmax(0, 1fr) auto; gap: 4px 10px; }
    [data-unit-visual-extension^="p05_"] .p05-control-label { grid-column: 1 / -1; }
    [data-unit-visual-extension^="p05_"] .p05-fields { grid-template-columns: 1fr; }
    [data-unit-visual-extension^="p05_"] .p05-limit-values { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 900px) {
    [data-unit-visual-extension^="p05_"] .p05-lab-layout { grid-template-columns: minmax(0, 1fr); gap: 6px; }
}

[data-unit-visual-extension="p05_spring_timing"] > :is(.p05-readout,.p05-control-row,.p05-actions) { max-width: 650px; margin-inline: auto; }
[data-unit-visual-extension="p05_spring_timing"] > .p05-control-row { grid-template-columns: auto minmax(100px,1fr) auto; }
@media(max-width: 600px) {
    [data-unit-visual-extension="p05_spring_timing"] > .p05-control-row { grid-template-columns: minmax(0,1fr) auto; }
}
