/* =========================================
   CSS VARIABLES & GLOBAL RESET
   ========================================= */
:root {
  /* Colors */
  --bg: #fafafa;
  --border: #e6e6e6;
  --text: #111;
  --muted: #666;
  --accent-color: #0095f6;
  --sale-color: #2fe66b;
  --secondary-text: #a8a8a8;
  
  /* Layout */
  --max-width: 100%;
  --bottom-nav-h: 64px;
  
  /* Header */
  --header-row1-h: 35px;
  --header-row1-pad-y: 5px;
  --header-gap: 5px;
  --icon-max-w: 150px;
  --icon-radius: 4px;
  
  /* Search */
  --search-width: min(520px, 78vw);
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  background-color: #fff;
  color: var(--text);
  padding-bottom: calc(var(--bottom-nav-h) + env(safe-area-inset-bottom));
  overscroll-behavior-y: none;
}

main {
  max-width: var(--max-width);
  margin: 0 auto;
  padding-bottom: 60px;
}