.echo-number-field{--ctl-h:var(--echo-control-default);--ctl-font:var(--echo-text-lg);--ctl-radius:var(--echo-radius-lg);--ctl-gap:var(--echo-space-5);--nf-readout:84px;display:inline-grid;gap:var(--echo-space-3);min-width:0;max-width:100%}.echo-number-field[data-size=sm]{--ctl-h:var(--echo-control-compact);--ctl-font:var(--echo-text-md);--ctl-radius:var(--echo-radius-md);--ctl-gap:var(--echo-space-4);--nf-readout:64px}.echo-number-field[data-size=lg]{--ctl-h:var(--echo-control-large);--ctl-font:var(--echo-text-xl);--ctl-radius:var(--echo-radius-xl);--ctl-gap:var(--echo-space-6);--nf-readout:108px}.echo-number-field__scrub{display:inline-flex;width:fit-content;cursor:ew-resize;-webkit-user-select:none;user-select:none}.echo-number-field__label{font-family:var(--echo-font-machine,ui-sans-serif,system-ui,sans-serif);font-size:var(--echo-text-3xs);font-weight:var(--echo-weight-semibold,600);letter-spacing:var(--echo-tracking-label,.2em);text-transform:uppercase;color:var(--echo-text-dim);cursor:inherit}.echo-number-field__group{display:inline-flex;align-items:stretch;height:var(--ctl-h);gap:var(--ctl-gap);min-width:0}.echo-number-field__step{display:inline-flex;align-items:center;justify-content:center;width:var(--ctl-h);border:0;border-radius:var(--ctl-radius);cursor:pointer;font-family:var(--echo-font-mono,ui-monospace,SFMono-Regular,Menlo,monospace);font-size:var(--ctl-font);line-height:var(--echo-leading-none,1);color:var(--echo-text);background:linear-gradient(180deg,var(--echo-cap-highlight) 0,var(--echo-cap) 40%,var(--echo-cap) 62%,var(--echo-cap-shadow) 100%);box-shadow:inset 0 1.5px 0 rgb(255 255 255/calc(.42 * var(--echo-gloss, 1))),inset 0 -3px 4px color-mix(in oklab,var(--echo-cast-ink,black) calc(.5 * var(--echo-shade, 1) * 100%),transparent),0 calc(3px + 1px * var(--lift, 0) - 2px * var(--press, 0)) 0 var(--echo-seam),0 calc(7px + 4px * var(--lift, 0) - 4px * var(--press, 0)) calc(12px + 6px * var(--lift, 0) - 6px * var(--press, 0)) color-mix(in oklab,var(--echo-cast-ink,black) calc(.5 * var(--echo-shade, 1) * 100%),transparent),inset 0 0 0 var(--echo-line-width,0) var(--echo-line,transparent);will-change:transform}.echo-number-field__step:focus-visible{outline:2px solid transparent;outline-offset:2px;box-shadow:var(
    --echo-shadow-ring,0 0 0 2px var(--echo-surface),0 0 0 4px var(--echo-accent-ink,var(--echo-accent-glow))
  )}.echo-number-field__step[disabled]{opacity:.45;cursor:default}.echo-number-field__window{position:relative;display:inline-flex;min-width:0}.echo-number-field__roll{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:0 var(--echo-space-5);overflow:hidden;pointer-events:none;white-space:pre;font-family:var(--echo-font-lcd,ui-monospace,SFMono-Regular,Menlo,monospace);font-size:var(--ctl-font);font-feature-settings:"tnum";font-variant-numeric:tabular-nums;color:var(--echo-accent-ink,var(--echo-accent-glow));text-shadow:0 0 8px color-mix(in oklab,var(--echo-lcd-glow) 45%,transparent)}.echo-number-field__roll[hidden]{display:none}.echo-number-field[data-rolling] .echo-number-field__input{color:transparent;text-shadow:none;caret-color:var(--echo-accent-glow)}.echo-number-field__input{box-sizing:border-box;width:var(--nf-readout);min-width:0;padding:0 var(--echo-space-5);border:0;border-radius:var(--ctl-radius);text-align:center;font-family:var(--echo-font-lcd,ui-monospace,SFMono-Regular,Menlo,monospace);font-size:var(--ctl-font);font-feature-settings:"tnum";font-variant-numeric:tabular-nums;color:var(--echo-accent-ink,var(--echo-accent-glow));text-shadow:0 0 8px color-mix(in oklab,var(--echo-lcd-glow) 45%,transparent);background:var(--echo-drawn-glass,linear-gradient(160deg,var(--echo-well) 0,var(--echo-lcd) 100%));box-shadow:inset 0 calc(2px + 3px * var(--well-depth, 0)) calc(5px + 6px * var(--well-depth, 0)) color-mix(in oklab,var(--echo-cast-ink,black) calc(.85 * var(--echo-shade, 1) * 100%),transparent),inset 0 -1px 0 rgb(255 255 255/calc(.05 * var(--echo-gloss, 1))),inset 0 0 0 var(--echo-line-width,0) var(--echo-line,transparent)}.echo-number-field__input:focus-visible{outline:2px solid transparent;outline-offset:-2px;box-shadow:inset 0 0 0 var(--echo-border-thick,2px) var(--echo-accent-ink,var(--echo-accent-glow)),inset 0 calc(2px + 3px * var(--well-depth, 0)) calc(5px + 6px * var(--well-depth, 0)) color-mix(in oklab,var(--echo-cast-ink,black) calc(.85 * var(--echo-shade, 1) * 100%),transparent)}.echo-number-field__input[disabled]{opacity:.45}@media (prefers-reduced-motion:reduce){.echo-number-field__step{transition:none}}@media (pointer:coarse){.echo-number-field__step{min-width:44px}.echo-number-field__input,.echo-number-field__step{min-height:44px}}@media (forced-colors:active){.echo-number-field__input{border:var(--echo-border-hairline,1px) solid CanvasText}.echo-number-field__step{border:var(--echo-border-hairline,1px) solid ButtonText}.echo-number-field__roll{display:none}}