/* Large, school-color steppers retain the native number field and its validation. */
.number-stepper {display:flex;align-items:stretch;width:100%;min-width:0;min-height:88px;margin:8px 0 20px;border:2px solid var(--school-primary,var(--blue));border-radius:14px;background:#fff;overflow:hidden;box-shadow:0 4px 0 var(--school-light,var(--paper));transition:box-shadow .15s ease,border-color .15s ease;}
.number-stepper:focus-within {outline:3px solid var(--school-accent,var(--orange));outline-offset:3px;}
.number-stepper input[type=number],#scoreFields .number-stepper .score-input {appearance:textfield;-moz-appearance:textfield;flex:1;min-width:0;width:100%;min-height:88px;margin:0;padding:12px 16px;border:0;border-radius:0;background:#fff;color:var(--school-primary,var(--ink));font-size:28px;font-weight:800;text-align:center;box-shadow:none;outline:none;}
.number-stepper input::-webkit-inner-spin-button,.number-stepper input::-webkit-outer-spin-button {-webkit-appearance:none;margin:0;}
.number-stepper-controls {display:flex;flex-direction:column;flex:0 0 52px;border-left:2px solid var(--school-primary,var(--blue));}
.number-stepper .number-stepper-button {display:flex;align-items:center;justify-content:center;flex:1;min-height:44px;width:52px;margin:0;padding:8px;border:0;border-radius:0;background:var(--school-primary,var(--blue));color:#fff;cursor:pointer;box-shadow:none;transition:filter .15s ease;}
.number-stepper .number-stepper-button+button {border-top:1px solid #ffffff50;}
.number-stepper .number-stepper-button:hover:not(:disabled) {filter:brightness(1.25);transform:none;}
.number-stepper .number-stepper-button:active:not(:disabled) {filter:brightness(.85);}
.number-stepper .number-stepper-button:focus-visible {outline:3px solid #fff;outline-offset:-5px;}
.number-stepper .number-stepper-button:disabled {background:var(--school-light,var(--paper));color:var(--school-primary,var(--ink));opacity:.5;cursor:default;}
.number-stepper-button svg {pointer-events:none;}