/**
 * v3 careerweb — base reset + body typography.
 * Loaded after tokens.css. Everything in here is global (un-classed)
 * or near-global; per-component styles live in their own files.
 */

*, *::before, *::after { box-sizing: border-box; }

html, body { margin: 0; padding: 0; }

body {
    font-family: 'Geist', -apple-system, BlinkMacSystemFont, sans-serif;
    background: var(--bg);
    color: var(--ink);
    /* Body baseline bumped 14 → 15 (--fs-body). 15px is the job-board
       sweet spot — comfortably above the 14px "dense app" line without
       drifting into editorial 16/18px territory. Lifts list scannability
       and detail prose at the same time. */
    font-size: var(--fs-body);
    line-height: var(--lh-body);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    /* Theme swap is a paint-only change — animate so it doesn't flash. */
    transition: background 200ms ease, color 200ms ease;
}

button                     { font-family: inherit; }
input, textarea, select    { font-family: inherit; color: inherit; }

/* Kill the OS-drawn rectangular tap-flash on every interactive surface.
   Android Chrome and iOS Safari paint a translucent gray rectangle over
   the bounding box on tap, which ignores border-radius and reads as a
   misaligned overlay on every rounded button / card / pill in the app.
   Every tappable surface here already has its own :hover / :active
   feedback (transform: scale, background swap, shadow), so the OS
   rectangle is purely visual noise. */
a, button, [role="button"], [tabindex] {
    -webkit-tap-highlight-color: transparent;
    tap-highlight-color: transparent;
}

::selection { background: var(--brand); color: var(--brand-on); }

/* App-root layout container — fills the viewport vertically so the
   sticky apply bar can attach to the bottom of the page on mobile.
   100dvh tracks the dynamic viewport (excludes Chrome Android's URL
   bar when collapsed) so the layout doesn't oscillate by ~50px on
   every scroll. 100vh stays as a fallback for older browsers. */
.app {
    min-height: 100vh;
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
}
