/* IRONCADE MOTION FOUNDATION - motion.css
   ruleVersion: motion-1.0

   This file does not introduce a new design language. Every token below was
   measured out of styles.css as it already ships. The point is to give the
   values that are already in use a NAME, so that the next screen built uses
   the same number instead of a new one.

   Inventory that produced these tokens (styles.css @ build 86):
     .09s  x1   transform/filter on .addex           -> instant
     .12s  x27  the de-facto house duration          -> fast
     .15s  x2   background, pin dots                 -> fast
     .2s   x2                                        -> standard
     .22s  x1   @keyframes fade (screen enter)       -> standard
     .26s  x2   #pinGate opacity, pwaUp              -> emphasized
     .28s  x1   with cubic-bezier(.3,1.6,.5,1)       -> emphasized + arcade ease
     .35s .5s .7s  width on data bars                -> data

   NOTHING IN THIS FILE IS APPLIED AUTOMATICALLY except the token
   declarations themselves and the reduced-motion safety net. Classes are
   opt-in so that shipping this file cannot change how the live app looks.
*/

:root {
  /* ---- duration scale ---- */
  --motion-instant: 80ms;
  --motion-fast: 120ms;
  --motion-standard: 180ms;
  --motion-emphasized: 240ms;
  --motion-data: 300ms;

  /* ---- easing scale (three, and only three) ---- */
  /* Everyday movement. Symmetric, unremarkable, gets out of the way. */
  --ease-standard: cubic-bezier(.4, 0, .2, 1);
  /* Things arriving and settling: sheets, toasts, screens. Already the
     curve behind @keyframes pwaUp, so sheets keep the feel they have. */
  --ease-entrance: cubic-bezier(.22, 1, .36, 1);
  /* The arcade one. Slight overshoot. Reserved for confirmation of a
     completed action - never for routine movement. Already in use at
     styles.css:502 and on the tug-of-war bar. */
  --ease-arcade: cubic-bezier(.3, 1.6, .5, 1);
}

/* ------------------------------------------------------------------
   PRESSED STATE STANDARD

   The audit found 14 pressed rules using 6 different scale values:
   .92 .96 .97 .975 .98 .99. A control's size should not tell you which
   file it was written in. One value, one duration, applied by adding
   class="press" to the element.

   Scale .97 is the median of what already ships and reads as a press on
   a 44px target without looking like a bounce on a 72px one.

   Existing :active rules are deliberately NOT overridden here. They are
   migrated screen by screen in a later phase, so no surface changes
   appearance the moment this file loads.
   ------------------------------------------------------------------ */
.press {
  transition: transform var(--motion-instant) var(--ease-standard);
}
.press:active {
  transform: scale(.97);
}
/* Large targets (>= 64px) need less scale to read as pressed. */
.press.press-lg:active {
  transform: scale(.985);
}
/* Small chips need more. */
.press.press-sm:active {
  transform: scale(.94);
}

/* ------------------------------------------------------------------
   TEXT SELECTION GUARD  (iOS long-press callout on controls)

   The brief is explicit: do not apply user-select: none globally.
   There is a concrete reason in this codebase. styles.css:802 sets
   .wl-crew-id { user-select: all } - that is the CREW INVITE CODE.
   A global guard would make invite codes uncopyable and quietly break
   the way people join a crew.

   So: the guard is a list of chrome and control surfaces, and there is
   an explicit opt-out that outranks it.
   ------------------------------------------------------------------ */
.tabbar,
.tab,
.btn,
.gbtn,
.confirm,
.exp,
.snd,
.addex,
.set-keep,
.mail-btn,
.pwa-cta,
.rpk-opt,
.press,
.seg,
.chip,
.nav-label,
.scorecard-label,
.hdr-title {
  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
}

/* Anything a person may legitimately want to copy wins over the guard.
   .wl-crew-id is listed by name because losing it is a real failure. */
.selectable,
.wl-crew-id,
input,
textarea,
[contenteditable="true"] {
  -webkit-user-select: text;
  user-select: text;
  -webkit-touch-callout: default;
}
.wl-crew-id {
  -webkit-user-select: all;
  user-select: all;
}

/* ------------------------------------------------------------------
   REDUCED MOTION

   Before this file there was exactly ONE prefers-reduced-motion rule in
   the whole app (styles.css:678, covering .pwa-sheet-card and .pwa-cta).
   Everything else animated regardless of the setting.

   Reduced motion means reduced, not removed: state still changes, it
   just changes without travel. Opacity is kept because a thing appearing
   is information; transform and width travel are what cause trouble.
   ------------------------------------------------------------------ */
@media (prefers-reduced-motion: reduce) {
  :root {
    --motion-instant: 1ms;
    --motion-fast: 1ms;
    --motion-standard: 1ms;
    --motion-emphasized: 1ms;
    --motion-data: 1ms;
  }

  .press:active,
  .press.press-lg:active,
  .press.press-sm:active {
    transform: none;
  }

  /* Existing app animations, now actually covered. */
  .screen.on { animation: none; }
  #pinDots.shake { animation: none; }
  .blink { animation: none; opacity: 1; }

  /* Data bars still fill - they just arrive rather than travel. */
  .tug-bar,
  .pace-bar,
  .bar-fill {
    transition: none !important;
  }
}
