/* Share one intrinsic control column: the L/R switches and all four fields align. */
.debounce-card{display:grid;grid-template-columns:minmax(0,1fr) minmax(120px,max-content);column-gap:12px;align-content:start}
.debounce-card>.card-heading,.debounce-card .debounce-values,.debounce-card .debounce-values>.setting-row{display:grid;grid-column:1/-1;grid-template-columns:subgrid}
.debounce-card>.card-heading,.debounce-card .debounce-values,.debounce-card .debounce-values>.setting-row{column-gap:12px}
/* A fieldset's anonymous content box cannot inherit subgrid tracks. Keep its
   native disabled behavior while its values participate in the card grid. */
.debounce-card .debounce-controls{display:contents}
.debounce-card .debounce-values{transition:opacity .16s ease}
.debounce-card .debounce-controls:disabled .debounce-values{opacity:.38}
@media(prefers-reduced-motion:reduce){.debounce-card .debounce-values{transition:none}}
.sensor-card>.card-heading,.debounce-card>.card-heading{min-height:30px}
.debounce-card .number-stepper{width:100%;min-width:0;height:30px;box-sizing:border-box}
.debounce-card .number-stepper input{flex:1 1 auto}
/* Move the unit slightly toward the value; retain the roomy, centered input. */
.debounce-card .number-stepper>span{padding:0 14px 0 2px}
.spdt-button-controls{display:grid;grid-template-columns:repeat(2,minmax(max-content,1fr));gap:12px;align-items:center;margin:0}
.spdt-control{display:flex;align-items:center;justify-content:space-between;gap:6px;min-height:30px}
.spdt-control-label{font-size:13px;font-weight:600;line-height:20px;cursor:pointer;user-select:none}
/* Use the same .switch component and theme styling as the other settings. */
/* Use the same responsive layout for every language. */
.performance-grid{container-type:inline-size;container-name:performance}
@container performance (max-width:770px){.sensor-card,.debounce-card{grid-column:1/-1}}
/* Keep the standard switches centered beside taller fields on small windows. */
@container performance (max-width:520px){
 .spdt-control{min-height:40px}
 .debounce-card .number-stepper{height:40px}
}