@import url("https://fonts.googleapis.com/css2?family=Doto:wght@600;900&family=Chivo:wght@400;600;800&family=Chivo+Mono:wght@400;600&display=swap");
/* IV Instrument Panel components. Every value comes from tokens.css. */
.iv-chassis{background:linear-gradient(180deg,var(--chassis-hi),var(--chassis));border-radius:var(--radius-chassis);box-shadow:var(--shadow-chassis);padding:var(--space-5);position:relative;color:var(--ink);font-family:var(--font-sans)}
.iv-chassis::before,.iv-chassis::after{content:"";position:absolute;top:12px;width:10px;height:10px;border-radius:var(--radius-round);background:radial-gradient(circle at 35% 35%,var(--key),var(--screw))}
.iv-chassis::before{left:12px}.iv-chassis::after{right:12px}
.iv-plate{background:var(--plate);border-radius:var(--radius-plate);padding:var(--space-4);display:grid;gap:var(--space-3)}
.iv-label{font-family:var(--font-mono);font-size:10.5px;line-height:14px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-muted)}
.iv-readout{background:var(--lcd);border-radius:var(--radius-plate);box-shadow:var(--shadow-lcd);padding:var(--space-4) var(--space-5);color:var(--lcd-on);font-family:var(--font-lcd);display:grid;gap:var(--space-2)}
.iv-readout__line{font-size:22px;line-height:28px;font-weight:600;letter-spacing:.04em}
.iv-readout__value{font-size:58px;line-height:58px;font-weight:900;font-variant-numeric:tabular-nums;text-shadow:0 0 12px var(--lcd-on)}
.iv-readout__stats{font-family:var(--font-mono);font-size:11px;opacity:.75;display:flex;justify-content:space-between;gap:var(--space-3);flex-wrap:wrap}
.iv-keys{display:grid;grid-template-columns:repeat(auto-fit,minmax(48px,1fr));gap:var(--space-2)}
.iv-key{background:var(--key);color:var(--ink);border:0;border-radius:var(--radius-key);box-shadow:var(--shadow-key);font-family:var(--font-mono);font-weight:600;font-size:14px;line-height:18px;padding:14px 8px;cursor:pointer;transition:transform .06s,box-shadow .06s}
.iv-key:active,.iv-key[aria-pressed="true"]{transform:translateY(2px);box-shadow:var(--shadow-key-pressed)}
.iv-key[aria-pressed="true"]{color:var(--signal-text)}
.iv-key:disabled{opacity:.45;cursor:not-allowed;text-decoration:line-through}
.iv-key:focus-visible,.iv-dial:focus-visible,.iv-swatch:focus-visible,.iv-action:focus-visible{outline:2px solid var(--signal);outline-offset:3px}
.iv-dial{width:96px;height:96px;flex:none;border:0;border-radius:var(--radius-round);background:radial-gradient(circle at 40% 35%,var(--key),var(--chassis));box-shadow:var(--shadow-key);position:relative;cursor:pointer;transition:transform .25s}
.iv-dial::after{content:"";position:absolute;left:50%;top:10px;width:4px;height:18px;margin-left:-2px;border-radius:2px;background:var(--signal)}
.iv-dial-steps{display:grid;gap:var(--space-1);font-family:var(--font-mono);font-size:12px;color:var(--ink-muted)}
.iv-dial-steps [aria-current="true"]{color:var(--signal-text);font-weight:600}
.iv-swatch{width:34px;height:34px;border-radius:var(--radius-round);border:3px solid var(--key);box-shadow:var(--shadow-key);cursor:pointer;padding:0}
.iv-swatch[aria-pressed="true"]{outline:2px solid var(--signal);outline-offset:2px}
.iv-action{display:flex;justify-content:space-between;align-items:center;gap:var(--space-4);width:100%;background:var(--signal);color:var(--on-signal);border:0;border-radius:var(--radius-plate);padding:18px var(--space-5);font-family:var(--font-sans);font-weight:800;font-size:17px;line-height:22px;letter-spacing:.02em;cursor:pointer;box-shadow:var(--shadow-signal);transition:transform .06s,box-shadow .06s}
.iv-action:active{transform:translateY(3px);box-shadow:none}
.iv-spec{background:var(--plate);border-radius:var(--radius-plate);padding:var(--space-4);display:grid;gap:var(--space-1);color:var(--ink);font-family:var(--font-sans);font-size:15px;line-height:22px}
.iv-spec__num{font-family:var(--font-lcd);font-weight:900;font-size:30px;line-height:30px}
@media (prefers-reduced-motion:reduce){.iv-key,.iv-dial,.iv-action{transition:none}}