/* Hallmark · component: input and pitch workbenches · genre: modern-minimal
 * Existing slate-blue tokens; motion cut. Pre-emit critique: P5 H5 E5 S5 R5 V4. */
.practical-tool{padding:var(--space-lg);color:var(--color-ink)}
.practical-controls{display:flex;align-items:center;flex-wrap:wrap;gap:var(--space-sm);margin-bottom:var(--space-lg)}
.practical-controls label{display:flex;align-items:center;flex-wrap:wrap;gap:var(--space-sm);font-size:var(--text-sm)}
.practical-controls select,.practical-controls input{min-height:44px;max-width:100%;border:var(--rule) solid var(--color-rule);background:var(--color-paper);color:var(--color-ink);padding:var(--space-xs);font:inherit}
.practical-tool button{touch-action:manipulation;min-height:44px;white-space:nowrap}
.practical-tool :is(button,select,input):focus-visible{outline:3px solid var(--color-focus);outline-offset:3px}
.practical-tool button:disabled{opacity:.55;cursor:not-allowed}
.practical-tool .click-pad{display:flex;align-items:center;justify-content:center;width:100%;min-height:12rem;padding:var(--space-md);background:var(--color-accent);color:var(--color-accent-ink);border:var(--rule) solid var(--color-accent);font:600 var(--text-xl)/1.3 var(--font-body);user-select:none;-webkit-user-select:none}
.click-pad:active:not(:disabled){background:var(--color-graphite);color:var(--color-on-dark)}
.practical-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-md);margin:var(--space-lg) 0}
.practical-metrics>div{min-width:0;border-block:var(--rule) solid var(--color-rule);padding-block:var(--space-md)}
.practical-metrics dt{font-size:var(--text-xs);color:var(--color-muted)}
.practical-metrics dd{margin:var(--space-xs) 0 0;font-weight:600;font-size:var(--text-xl);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.practical-tool p{font-size:var(--text-sm);line-height:1.6;color:var(--color-muted)}
.practical-status{min-height:3em}
.practical-chart{margin:var(--space-lg) 0;padding:0}
.practical-chart figcaption{font-size:var(--text-sm);margin-bottom:var(--space-sm)}
.practical-chart svg{display:block;width:100%;height:10rem;background:var(--color-paper-2);border:var(--rule) solid var(--color-rule)}
.practical-chart path,.practical-chart polyline{fill:none;stroke:var(--color-accent);stroke-width:2;vector-effect:non-scaling-stroke}
.practical-chart line{stroke:var(--color-rule);stroke-width:1}
.practical-chart text{fill:var(--color-muted);font:11px var(--font-body)}
.double-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-lg)}
.double-grid .practical-metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-sm)}
.double-grid .click-pad{min-height:9rem;font-size:var(--text-base)}
.double-history{display:flex;flex-wrap:wrap;gap:var(--space-xs);list-style:none;padding:0;font-size:var(--text-xs);font-variant-numeric:tabular-nums}
.double-history li{border:var(--rule) solid var(--color-rule);padding:var(--space-xs)}
.double-history li[data-rapid=true]{color:var(--color-error);border-color:var(--color-error)}
.pitch-note{display:block;text-align:center;font-size:clamp(2.5rem,10vw,5rem);font-weight:700;margin:var(--space-lg) 0;line-height:1.2}
.pitch-source{display:flex;align-items:center;gap:var(--space-sm);flex-wrap:wrap;font-size:var(--text-sm);color:var(--color-muted)}
.pitch-source strong{color:var(--color-ink)}
.pitch-cents{display:block;appearance:none;-webkit-appearance:none;width:100%;height:.5rem;border:0;background:var(--color-paper-3);accent-color:var(--color-accent)}
.pitch-cents::-webkit-meter-bar{border:0;background:var(--color-paper-3);box-shadow:none}
.pitch-cents::-webkit-meter-optimum-value{background:var(--color-accent)}
.pitch-cents::-moz-meter-bar{background:var(--color-accent)}
.pitch-scale{display:flex;justify-content:space-between;margin-top:var(--space-xs);font-size:var(--text-xs);color:var(--color-muted)}
@media(max-width:39.99rem){.practical-tool{padding:var(--space-md)}.practical-metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-sm)}.double-grid{grid-template-columns:1fr}.practical-tool .click-pad{min-height:10rem}.practical-controls .button{padding-inline:var(--space-sm);font-size:var(--text-sm)}}