/* Emoji: Noto Color Emoji, Google's set -- what Android, and so the
   Android app, already shows. Windows' own emoji font (Segoe UI Emoji)
   looks dated beside it, so every font stack in every module ends with
   "Apple Color Emoji", "Noto Color Emoji", before the generic family:
   Apple devices keep Apple's emoji (as the iPhone app does), everyone else
   gets Noto. Google Fonts serves it in slices by unicode-range, so a page
   only downloads the emoji it shows. See CLAUDE.md "Emoji". @import must
   be the first rule in a stylesheet, hence above everything else. */
@import url('https://fonts.googleapis.com/css2?family=Noto+Color+Emoji&display=swap');

/* ================================================================
   SHARED — BROWSER DEFAULTS
   ---------------------------------------------------------------
   What the browser would otherwise supply that ShiftTrack replaces,
   set once for every layout: control chrome it never wants, and the
   emoji font. Loaded FIRST by every layout (before the
   module's own tokens/reset), so it is the floor every module's
   form CSS stands on. See CLAUDE.md "Number Inputs -- No Browser
   Spinner".

   Owns: the native up/down stepper on <input type="number">; loading
   the emoji font (Noto Color Emoji) -- each module's font stack names it.
   Does NOT own: any module's field styling (borders, sizes, focus
   rings) -- those live in each module's form owner file. Do not
   re-declare this rule per module or per page; there were three
   copies of it before this file, and the pages that had none still
   showed the stepper.
   ================================================================ */

/* The stepper is browser chrome, not a ShiftTrack control: it is
   3px of clickable arrows that fight the field's own unit label and
   change a value by 1 when a person meant to scroll. Values are
   typed. Firefox needs the appearance switch; Chromium/WebKit need
   the pseudo-elements removed as well. */
input[type="number"] {
    -moz-appearance: textfield;
    appearance: textfield;
}

input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}