/* Opt-in standalone-tool controls. Loaded only by tools using these classes.
   Time-stepper contract: native named buttons operate a labelled numeric input;
   aria-controls identifies that input, whose value communicates the current value.
   Names describe direction, context and increment. Keep direct entry and focused
   nodes; do not add live announcements. Arithmetic, ranges and boundary behaviour
   belong to each tool. Paired buttons share presentation, not action hierarchy.
   44px height supports frequent touch use; fluid widths preserve narrow grids. */
.time-control{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--tgl-space-1);max-width:none;margin-top:var(--tgl-space-2)}
.time-control input{grid-column:1/-1;margin-top:0;padding:8px;min-height:44px;text-align:center}
.time-control button{min-width:0;min-height:44px;padding:2px 4px;border:1px solid #708393;border-radius:9px;font:700 19px Arial;line-height:1;background:#39495F;color:#FFF;cursor:pointer}
.tgl-disclosure summary{display:flex;align-items:center;gap:12px;min-height:44px;list-style:none;cursor:pointer;line-height:1.4}
.tgl-disclosure summary::-webkit-details-marker{display:none}
.tgl-disclosure summary::after{content:"";width:8px;height:8px;flex:0 0 8px;margin-left:auto;margin-right:3px;border-right:1.5px solid #B9CAD3;border-bottom:1.5px solid #B9CAD3;transform:rotate(45deg)}
.tgl-disclosure[open]>summary::after{transform:rotate(225deg)}