@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600&family=DM+Sans:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap');

:root {
  --pine-900: #0a2e22;
  --pine-800: #0f3d2e;
  --pine-700: #154a39;
  --pine-600: #1f5d48;
  --pine-500: #2a7558;
  --fairway-400: #6b9468;
  --fairway-300: #9ab39a;
  --lime-400: #c8d96b;
  --lime-300: #d4e09b;
  --cream-50:  #faf6ec;
  --cream-100: #f5efe1;
  --cream-200: #ebe3cf;
  --cream-300: #ddd2b6;
  --ink-900: #1a1a17;
  --ink-700: #3d3a31;
  --ink-500: #6b6657;
  --ink-400: #8d8775;
  --burgundy: #8b2a2a;
  --gold: #b8924a;
  --sky-400: #6b8fa8;
  --score-eagle:  #b8924a;
  --score-birdie: #c44536;
  --score-par:    var(--ink-700);
  --score-bogey:  var(--sky-400);
  --score-double: #5a6b7a;
  --shadow-sm: 0 1px 2px rgba(10,46,34,0.06), 0 1px 3px rgba(10,46,34,0.04);
  --shadow-md: 0 2px 4px rgba(10,46,34,0.08), 0 4px 12px rgba(10,46,34,0.06);
  --shadow-lg: 0 8px 24px rgba(10,46,34,0.12), 0 2px 6px rgba(10,46,34,0.08);
  --font-display: 'Cormorant Garamond', 'Georgia', serif;
  --font-body:    'DM Sans', system-ui, sans-serif;
  --font-mono:    'JetBrains Mono', ui-monospace, monospace;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

html, body, #root {
  height: 100%;
  font-family: var(--font-body);
  color: var(--ink-900);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  background: var(--ink-900);
  overflow: hidden;
}

#root {
  display: flex;
  justify-content: center;
  align-items: stretch;
}

.app-shell {
  position: relative;
  width: 100%;
  max-width: 430px;
  height: 100%;
  background: var(--cream-50);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.screen-scroll {
  flex: 1;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 90px;
}

button { font-family: inherit; cursor: pointer; border: none; background: none; padding: 0; color: inherit; }

.serif  { font-family: var(--font-display); font-weight: 500; letter-spacing: -0.01em; }
.mono   { font-family: var(--font-mono); }
.tabular { font-variant-numeric: tabular-nums; }

.placeholder-stripe {
  background-image: repeating-linear-gradient(
    135deg,
    rgba(10,46,34,0.06) 0,
    rgba(10,46,34,0.06) 1px,
    transparent 1px,
    transparent 8px
  );
}

.tap {
  -webkit-tap-highlight-color: transparent;
  user-select: none;
  transition: transform 0.08s ease, background 0.15s ease;
}
.tap:active { transform: scale(0.97); }

.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { scrollbar-width: none; }