.km-controls{grid-template-columns:repeat(3,minmax(0,1fr));gap:.7rem;margin:.65rem 0 .85rem;display:grid}.km-field{--km-field-colour:var(--accent);border:1px solid var(--border);border-left:3px solid var(--km-field-colour);background:var(--bg-surface);border-radius:0;flex-direction:column;gap:.35rem;min-width:0;padding:.6rem .7rem .65rem .85rem;display:flex}.km-field--trial{--km-field-colour:#2563eb;grid-column:1/-1}.km-field--k{--km-field-colour:#dc2626}.km-field--set{--km-field-colour:#6b7280}.km-field--init{--km-field-colour:#52525b}.km-field--n{--km-field-colour:#16a34a}.km-field--spread{--km-field-colour:#f59e0b}.km-field-head{letter-spacing:.02em;color:var(--text-dim);justify-content:space-between;align-items:center;gap:.5rem;font-size:.73rem;font-weight:700;display:flex}.km-field-head output{font:750 .82rem var(--font-mono,monospace);font-variant-numeric:tabular-nums;color:var(--text);white-space:nowrap}.km-field-note{color:var(--text-dim);font-size:.72rem;line-height:1.4}.km-field-note b{color:var(--text);font-variant-numeric:tabular-nums}.tool-body .km-controls input[type=range],.tool-body .km-step input[type=range]{appearance:none;cursor:pointer;background:0 0;width:100%;height:1.1rem;margin:.15rem 0 .05rem}.tool-body .km-controls input[type=range]::-webkit-slider-runnable-track{background:linear-gradient(to right, var(--km-field-colour,var(--accent)) 0 var(--km-fill,0%), var(--border) var(--km-fill,0%) 100%);border-radius:0;height:.4rem}.tool-body .km-step input[type=range]::-webkit-slider-runnable-track{background:linear-gradient(to right, var(--km-field-colour,var(--accent)) 0 var(--km-fill,0%), var(--border) var(--km-fill,0%) 100%);border-radius:0;height:.4rem}.tool-body .km-controls input[type=range]::-moz-range-track{background:var(--border);border-radius:0;height:.4rem}.tool-body .km-step input[type=range]::-moz-range-track{background:var(--border);border-radius:0;height:.4rem}.tool-body .km-controls input[type=range]::-moz-range-progress{background:var(--km-field-colour,var(--accent));height:.4rem}.tool-body .km-step input[type=range]::-moz-range-progress{background:var(--km-field-colour,var(--accent));height:.4rem}.tool-body .km-controls input[type=range]::-webkit-slider-thumb{appearance:none;border:2px solid var(--bg-surface);background:var(--km-field-colour,var(--accent));border-radius:50%;width:1.05rem;height:1.05rem;margin-top:-.33rem}.tool-body .km-step input[type=range]::-webkit-slider-thumb{appearance:none;border:2px solid var(--bg-surface);background:var(--km-field-colour,var(--accent));border-radius:50%;width:1.05rem;height:1.05rem;margin-top:-.33rem}.tool-body .km-controls input[type=range]::-moz-range-thumb{border:2px solid var(--bg-surface);background:var(--km-field-colour,var(--accent));border-radius:50%;width:1.05rem;height:1.05rem}.tool-body .km-step input[type=range]::-moz-range-thumb{border:2px solid var(--bg-surface);background:var(--km-field-colour,var(--accent));border-radius:50%;width:1.05rem;height:1.05rem}.tool-body .km-controls input[type=range]:focus,.tool-body .km-step input[type=range]:focus{outline:2px solid var(--km-field-colour,var(--accent));outline-offset:2px}.km-set,.km-init{gap:0;margin:.1rem 0 0;display:flex}.segmented.km-set .km-set-btn,.segmented.km-init .km-init-btn{border:1px solid var(--border);background:var(--bg-surface);min-width:0;color:var(--text-dim);cursor:pointer;border-radius:0;flex:1 1 0;padding:.34rem .24rem;font-size:.73rem;font-weight:700}.segmented.km-set .km-set-btn+.km-set-btn,.segmented.km-init .km-init-btn+.km-init-btn{border-left:none}.segmented.km-set .km-set-btn.active,.segmented.km-init .km-init-btn.active{background:var(--km-field-colour);border-color:var(--km-field-colour);color:#fff}.km-verdict-box{--km-verdict-colour:var(--text-dim);border-left:3px solid var(--km-verdict-colour);background:var(--bg-surface);border-radius:0;margin:0 0 .35rem;padding:.55rem .75rem}.km-verdict-box[data-variant=best]{--km-verdict-colour:#009e73}.km-verdict-box[data-variant=worse]{--km-verdict-colour:#d55e00}.km-verdict-box[data-variant=empty]{--km-verdict-colour:#cc79a7}.km-verdict{color:var(--text);margin:0;font-size:.86rem;line-height:1.5}.km-verdict b{color:var(--km-verdict-colour);font-variant-numeric:tabular-nums}.km-chart-head{justify-content:space-between;align-items:end;gap:1rem;margin:1.05rem 0 .5rem;display:flex}.km-heading{letter-spacing:-.01em;color:var(--text);margin:0;font-size:.93rem;font-weight:800}.km-step{--km-field-colour:#2563eb;flex:0 15rem;min-width:0}.km-playback{flex:0 23rem;align-items:end;gap:.7rem;min-width:0;display:flex}.km-playback .km-step{flex:15rem}.km-replay{background:var(--bg-surface);color:#2563eb;white-space:nowrap;cursor:pointer;border:1px solid #2563eb;border-radius:0;justify-content:center;align-items:center;gap:.42rem;min-height:2.15rem;padding:.38rem .68rem;font-size:.73rem;font-weight:800;display:inline-flex}.km-replay:hover,.km-replay:focus-visible,.km-replay.is-playing{color:#fff;background:#2563eb}.km-replay:focus-visible{outline-offset:2px;outline:2px solid #2563eb}.km-replay:disabled{opacity:.48;cursor:not-allowed}.km-replay.is-playing .km-replay-icon{animation:.72s ease-in-out infinite alternate km-replay-pulse}@keyframes km-replay-pulse{0%{opacity:.65;transform:scale(.82)}to{opacity:1;transform:scale(1.16)}}.km-step-label{color:var(--text-dim);justify-content:space-between;align-items:center;gap:.5rem;font-size:.72rem;font-weight:700;display:flex}.km-step-label output{font:750 .78rem var(--font-mono,monospace);font-variant-numeric:tabular-nums;color:var(--text);white-space:nowrap}.km-visual{width:100%;margin:.2rem 0 .7rem}.km-visual .chart-shell-canvas canvas{display:block}.results-rows .bd-row[data-readout=verdictRow] .res-value,.results-rows .bd-row[data-readout=sizes] .res-value,.results-rows .bd-row[data-readout=iterations] .res-value,.results-rows .bd-row[data-readout=bestWcss] .res-value,.results-rows .bd-row[data-readout=worstWcss] .res-value{font-weight:800}@media (width<=760px){.km-controls{grid-template-columns:repeat(2,minmax(0,1fr))}.km-chart-head{flex-direction:column;align-items:stretch;gap:.5rem}.km-step{flex:auto}.km-playback{flex:auto;width:100%}}@media (width<=480px){.km-controls{grid-template-columns:minmax(0,1fr)}.km-field--trial{grid-column:auto}}@media (width<=420px){.km-playback{flex-direction:column;align-items:stretch}.km-replay{align-self:flex-start}}@media (prefers-reduced-motion:reduce){.km-replay.is-playing .km-replay-icon{animation:none}}
