.arcade-number{display:inline-flex;align-self:flex-start;align-items:stretch;width:-moz-fit-content;width:fit-content;max-width:100%;background:var(--paper);border:2.5px solid var(--line);border-radius:var(--r-md);overflow:hidden;font-family:var(--font-sans);transition:border-color .12s,box-shadow .12s}.arcade-number:focus-within{border-color:var(--brand);box-shadow:var(--sh-cta)}.arcade-number--invalid{border-color:var(--err)}.arcade-number--invalid:focus-within{box-shadow:6px 6px 0 var(--err)}.arcade-number--disabled{opacity:.5;cursor:not-allowed;background:var(--paper-2)}.arcade-number__input{border:0;outline:none;background:transparent;text-align:center;font-size:14px;font-weight:700;color:var(--ink);width:90px;font-variant-numeric:tabular-nums;padding:0 8px;-moz-appearance:textfield}.arcade-number__input::-webkit-inner-spin-button,.arcade-number__input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.arcade-number--md .arcade-number__input{padding:10px 8px}.arcade-number--sm .arcade-number__input{padding:7px 6px;font-size:13px;width:72px}.arcade-number__step{background:var(--paper-2);border:0;width:38px;display:grid;place-items:center;cursor:pointer;color:var(--ink-2);transition:background .12s,color .12s}.arcade-number--sm .arcade-number__step{width:32px}.arcade-number__step:hover:not(:disabled){background:var(--brand-dim);color:var(--brand-d)}.arcade-number__step:focus-visible{outline:2px solid var(--brand);outline-offset:-2px}.arcade-number__step:disabled{opacity:.4;cursor:not-allowed}.arcade-number__step:first-child{border-right:2.5px solid var(--line)}.arcade-number__step:last-child{border-left:2.5px solid var(--line)}[data-scope=back] .arcade-number{border-width:1px}[data-scope=back] .arcade-number:focus-within{border-color:var(--ink-3);box-shadow:none}[data-scope=back] .arcade-number--invalid:focus-within{box-shadow:none}[data-scope=back] .arcade-number__step{border-color:var(--line-2)!important}[data-scope=back] .arcade-number__step:first-child{border-right-width:1px}[data-scope=back] .arcade-number__step:last-child{border-left-width:1px}[data-scope=back] .arcade-number__input{font-weight:600;font-size:13px}