/* =============================================================================
   Base: reset, iOS correctness, typography
   -----------------------------------------------------------------------------
   The rules in the "iOS" block are not cosmetic. Each one fixes a specific way
   the previous build misbehaved on an iPhone: focus-zoom on inputs, the sheet
   jumping when the URL bar collapses, pull-to-refresh stealing map drags, and
   controls sitting under the home indicator.
   ========================================================================== */

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

html, body {
  margin: 0;
  padding: 0;
  height: 100%;
  /* dvh tracks the collapsing iOS URL bar; vh does not. */
  height: 100dvh;
}

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  font-family: var(--font);
  font-size: var(--fs-md);
  line-height: 1.45;
  color: var(--text);
  background: var(--bg);
  overflow: hidden;                 /* the map owns the viewport */
  overscroll-behavior: none;        /* no rubber-band / pull-to-refresh */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  touch-action: manipulation;       /* kills the 300ms tap delay + double-tap zoom */
  user-select: none;
}

/* Data is worth selecting; chrome is not. */
.selectable, .selectable * { user-select: text; -webkit-user-select: text; }

h1, h2, h3, h4, h5, h6 { margin: 0; font-weight: 600; line-height: 1.25; }
p { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }

button, input, select, textarea {
  font: inherit;
  color: inherit;
  margin: 0;
}

button {
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
  touch-action: manipulation;
}

a { color: var(--accent); text-decoration: none; }

/* iOS zooms the page when a focused input is under 16px. Every input is 16px. */
input, select, textarea {
  font-size: 16px;
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 10px 12px;
  min-height: var(--tap);
  width: 100%;
  appearance: none;
  -webkit-appearance: none;
}
input:focus-visible, select:focus-visible, textarea:focus-visible,
button:focus-visible, [tabindex]:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
input::placeholder { color: var(--text-faint); }

::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb { background: var(--border-strong); border-radius: var(--r-full); }
::-webkit-scrollbar-track { background: transparent; }

.scroll-y {
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;     /* scroll ends at the panel, not the page */
}

/* Horizontal chip rows: swipeable, no visible bar. */
.scroll-x {
  display: flex;
  gap: var(--sp-2);
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scrollbar-width: none;
  scroll-snap-type: x proximity;
  padding-bottom: 2px;
}
.scroll-x::-webkit-scrollbar { display: none; }
.scroll-x > * { flex: 0 0 auto; scroll-snap-align: start; }

.mono { font-family: var(--font-mono); font-variant-numeric: tabular-nums; }
.tnum { font-variant-numeric: tabular-nums; }
.truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.nowrap { white-space: nowrap; }

.sr-only {
  position: absolute; width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

.hidden { display: none !important; }

.icon {
  width: 22px; height: 22px;
  flex: 0 0 auto;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.75;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.icon-sm { width: 16px; height: 16px; }
.icon-lg { width: 26px; height: 26px; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
  }
}
/* Explicit user preference from Settings, honoured even when the OS disagrees. */
:root[data-motion="reduced"] *,
:root[data-motion="reduced"] *::before,
:root[data-motion="reduced"] *::after {
  animation-duration: 0.001ms !important;
  animation-iteration-count: 1 !important;
  transition-duration: 0.001ms !important;
}
