/* ================================================================ THE POLISH LAYER
 *
 * Loaded LAST, after every component sheet and after mobile.css, and it owns exactly one thing:
 * the FEEL that is common to every interactive element and therefore cannot live in any one
 * component's sheet without drifting. Four laws, each stated once:
 *
 * 1. ONE MOTION BUDGET. Everything that answers a pointer transitions its paint (ground, ink,
 *    rim, shadow) over --t-tap on --ease, and everything that arrives as a surface keeps the
 *    pop-in its sheet already gave it. A control that answers instantly beside one that fades
 *    reads as two products; the union of properties lives here so a component's own narrower
 *    transition list can never silently drop a property a sibling still animates.
 *
 * 2. ONE PRESS. Every pressable thing dips - scale(.98) under the finger or mouse for the length
 *    of the press and back on release. Tactile feedback is the difference between a control and
 *    a label; the dip is the smallest honest version of it. Elements that carry their own
 *    transform for state (folded chevrons, drawn knobs) are children, not the button, so they
 *    are untouched.
 *
 * 3. ONE NUMERIC FACE. Digits that update - tick fields, period chips, PnL cells - set in
 *    tabular figures, so a 1 becoming a 7 does not wiggle its neighbours. Anywhere the width of
 *    a changing number is layout, this is the rule it gets.
 *
 * 4. QUIET BY DEFAULT UNDER REDUCED MOTION: every rule this file adds that moves something has a
 *    prefers-reduced-motion answer, because a trading tool that ignores the platform's motion
 *    setting is arguing with its owner.
 *
 * What deliberately does NOT live here: colour (the palette owns it), layout (the sheets own
 * it), and close animations (a disappearing surface must be kept alive by script to fade out -
 * that is openWindow's change to make, not a stylesheet's to fake).
 */

/* ------------------------------------------------ 1. the motion budget, stated once */
button:not(:disabled),
.ctl,
.ctx-item,
.cp-chip,
.im-row,
.wl-row,
.set-navitem,
.ip-row,
.ws-row,
.tpl-row,
.ot-row,
.sb,
.tab,
.msheet-row,
.ps-tf,
.ps-more,
.wp-seg button,
.wp-more {
  transition: background-color var(--t-tap) var(--ease),
              color var(--t-tap) var(--ease),
              border-color var(--t-tap) var(--ease),
              opacity var(--t-tap) var(--ease),
              box-shadow var(--t-tap) var(--ease),
              transform var(--t-tap) var(--ease);
}

/* ---------------------------------------------------------- 2. the press, stated once */
button:not(:disabled):active,
.ctl:not(:disabled):active,
.ctx-item:active,
.cp-chip:active,
.im-row:active,
.wl-row:active,
.set-navitem:active,
.ip-row:active,
.ws-row:active,
.tpl-row:active,
.ot-row:active,
.sb:active,
.tab:active,
.msheet-row:active,
.ps-tf:active {
  transform: scale(.98);
}

/* The wheel drum's rows are pressable too, but they are positioned by their own transform - a
   press dip would fight the drum's placement transform and jump the row. They already answer a
   press with the drum's motion, which is the stronger signal. */

/* ------------------------------------------------- 3. digits that do not wiggle */
.stepper .val,
.tfq,
.ps-tf,
.pp-item,
.wp-item,
.tp-pospnl {
  font-variant-numeric: tabular-nums;
}

/* ------------------------------------------------------------ 4. quiet under reduced motion */
@media (prefers-reduced-motion: reduce) {
  button:not(:disabled),
  .ctl,
  .ctx-item,
  .cp-chip,
  .im-row,
  .wl-row,
  .set-navitem,
  .ip-row,
  .ws-row,
  .tpl-row,
  .ot-row,
  .sb,
  .tab,
  .msheet-row,
  .ps-tf,
  .ps-more,
  .wp-seg button,
  .wp-more {
    transition: none;
  }
  button:not(:disabled):active,
  .ctl:not(:disabled):active,
  .ctx-item:active,
  .cp-chip:active,
  .im-row:active,
  .wl-row:active,
  .set-navitem:active,
  .ip-row:active,
  .ws-row:active,
  .tpl-row:active,
  .ot-row:active,
  .sb:active,
  .tab:active,
  .msheet-row:active,
  .ps-tf:active {
    transform: none;
  }
}