/* ============================================================
   FAIRWAY FEUD — golf.css
   Design system carried over from SouffleSlam (uplate.ca).
   Same palette, surfaces, buttons, nav, admin styling —
   pickleball motifs swapped for golf. Mobile-first, 560px shell.
   ============================================================ */

:root {
  --cream: #fff7e8;
  --cream-2: #fffdf5;
  --cream-3: #f7efd9;
  --green: #073d20;
  --green-2: #0f6035;
  --green-3: #174c31;
  --gold: #ffc83d;
  --gold-2: #f2aa18;
  --ink: #092616;
  --muted: #61715f;
  --line: rgba(7, 61, 32, 0.18);
  --danger: #9f2c1e;
  --shadow: 0 18px 48px rgba(18, 52, 24, 0.18);
  --soft-shadow: 0 10px 24px rgba(18, 52, 24, 0.12);
  --radius: 22px;
  /* Golf ball: white sphere, subtle dimple grid, soft shading */
  --golf-ball: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20100%20100%27%3E%3Cdefs%3E%3CradialGradient%20id%3D%27b%27%20cx%3D%270.37%27%20cy%3D%270.31%27%20r%3D%270.85%27%3E%3Cstop%20offset%3D%270%27%20stop-color%3D%27%23ffffff%27%2F%3E%3Cstop%20offset%3D%270.5%27%20stop-color%3D%27%23f3f1e9%27%2F%3E%3Cstop%20offset%3D%270.82%27%20stop-color%3D%27%23dbd7c9%27%2F%3E%3Cstop%20offset%3D%271%27%20stop-color%3D%27%23b6b1a0%27%2F%3E%3C%2FradialGradient%3E%3CradialGradient%20id%3D%27d%27%20cx%3D%270.62%27%20cy%3D%270.66%27%20r%3D%270.9%27%3E%3Cstop%20offset%3D%270%27%20stop-color%3D%27%23f5f2ea%27%2F%3E%3Cstop%20offset%3D%271%27%20stop-color%3D%27%23bdb8a6%27%2F%3E%3C%2FradialGradient%3E%3CradialGradient%20id%3D%27h%27%20cx%3D%270.32%27%20cy%3D%270.26%27%20r%3D%270.4%27%3E%3Cstop%20offset%3D%270%27%20stop-color%3D%27%23ffffff%27%20stop-opacity%3D%270.9%27%2F%3E%3Cstop%20offset%3D%271%27%20stop-color%3D%27%23ffffff%27%20stop-opacity%3D%270%27%2F%3E%3C%2FradialGradient%3E%3Cpattern%20id%3D%22p%22%20width%3D%2220%22%20height%3D%2217.3%22%20patternUnits%3D%22userSpaceOnUse%22%3E%3Ccircle%20cx%3D%225%22%20cy%3D%224.3%22%20r%3D%224.2%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2215%22%20cy%3D%2213%22%20r%3D%224.2%22%20fill%3D%22url%28%23d%29%22%2F%3E%3C%2Fpattern%3E%3CclipPath%20id%3D%22cp%22%3E%3Ccircle%20cx%3D%2250%22%20cy%3D%2250%22%20r%3D%2245.5%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3Ccircle%20cx%3D%2750%27%20cy%3D%2750%27%20r%3D%2747%27%20fill%3D%27url%28%23b%29%27%20stroke%3D%27rgba%287%2C61%2C32%2C0.16%29%27%20stroke-width%3D%270.8%27%2F%3E%3Cg%20opacity%3D%220%22%3E%3Ccircle%20cx%3D%2240.1%22%20cy%3D%2221.4%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2248.7%22%20cy%3D%2221.4%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2257.3%22%20cy%3D%2221.4%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2265.9%22%20cy%3D%2221.4%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2227.2%22%20cy%3D%2228.8%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2235.8%22%20cy%3D%2228.8%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2244.4%22%20cy%3D%2228.8%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2253.0%22%20cy%3D%2228.8%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2261.6%22%20cy%3D%2228.8%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2270.2%22%20cy%3D%2228.8%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2222.9%22%20cy%3D%2236.2%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2231.5%22%20cy%3D%2236.2%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2240.1%22%20cy%3D%2236.2%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2248.7%22%20cy%3D%2236.2%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2257.3%22%20cy%3D%2236.2%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2265.9%22%20cy%3D%2236.2%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2274.5%22%20cy%3D%2236.2%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2218.6%22%20cy%3D%2243.6%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2227.2%22%20cy%3D%2243.6%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2235.8%22%20cy%3D%2243.6%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2244.4%22%20cy%3D%2243.6%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2253.0%22%20cy%3D%2243.6%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2261.6%22%20cy%3D%2243.6%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2270.2%22%20cy%3D%2243.6%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2278.8%22%20cy%3D%2243.6%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2222.9%22%20cy%3D%2251.0%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2231.5%22%20cy%3D%2251.0%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2240.1%22%20cy%3D%2251.0%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2248.7%22%20cy%3D%2251.0%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2257.3%22%20cy%3D%2251.0%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2265.9%22%20cy%3D%2251.0%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2274.5%22%20cy%3D%2251.0%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2283.1%22%20cy%3D%2251.0%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2218.6%22%20cy%3D%2258.4%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2227.2%22%20cy%3D%2258.4%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2235.8%22%20cy%3D%2258.4%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2244.4%22%20cy%3D%2258.4%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2253.0%22%20cy%3D%2258.4%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2261.6%22%20cy%3D%2258.4%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2270.2%22%20cy%3D%2258.4%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2278.8%22%20cy%3D%2258.4%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2222.9%22%20cy%3D%2265.8%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2231.5%22%20cy%3D%2265.8%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2240.1%22%20cy%3D%2265.8%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2248.7%22%20cy%3D%2265.8%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2257.3%22%20cy%3D%2265.8%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2265.9%22%20cy%3D%2265.8%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2274.5%22%20cy%3D%2265.8%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2227.2%22%20cy%3D%2273.2%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2235.8%22%20cy%3D%2273.2%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2244.4%22%20cy%3D%2273.2%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2253.0%22%20cy%3D%2273.2%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2261.6%22%20cy%3D%2273.2%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2270.2%22%20cy%3D%2273.2%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2240.1%22%20cy%3D%2280.6%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2248.7%22%20cy%3D%2280.6%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3Ccircle%20cx%3D%2257.3%22%20cy%3D%2280.6%22%20r%3D%222.7%22%20fill%3D%22url%28%23d%29%22%2F%3E%3C%2Fg%3E%3Crect%20width%3D%22100%22%20height%3D%22100%22%20fill%3D%22url%28%23p%29%22%20clip-path%3D%22url%28%23cp%29%22%2F%3E%3Cellipse%20cx%3D%2739%27%20cy%3D%2733%27%20rx%3D%2719%27%20ry%3D%2714%27%20fill%3D%27url%28%23h%29%27%2F%3E%3C%2Fsvg%3E");
  /* Flag-in-hole accent used on badges and dividers */
  --flag-pin: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23073d20' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v14'/%3E%3Cpath d='M12 4l7 2.5L12 9'/%3E%3Cellipse cx='12' cy='19.5' rx='5.5' ry='2'/%3E%3C/svg%3E");
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }

html {
  min-height: 100%;
  background: var(--cream);
  overflow-x: hidden;                 /* no horizontal shift at any width */
  -webkit-text-size-adjust: 100%;     /* stop iOS from auto-inflating text ("zoomed in a tad") */
  text-size-adjust: 100%;
}

body {
  margin: 0;
  min-height: 100svh;
  color: var(--ink);
  background:
    radial-gradient(circle at 20% -10%, rgba(255, 200, 61, 0.34), transparent 20rem),
    radial-gradient(circle at 90% 0%, rgba(15, 96, 53, 0.13), transparent 18rem),
    linear-gradient(180deg, var(--cream-2), var(--cream));
}

button, input, select, textarea { font: inherit; }
button { cursor: pointer; }

/* ---------- Shell & layout ---------- */

.score-shell {
  width: min(100%, 560px);
  min-height: 100svh;
  margin: 0 auto;
  padding: max(14px, env(safe-area-inset-top)) 14px calc(120px + env(safe-area-inset-bottom));
}

.score-app { display: grid; gap: 14px; }

.brand-head { text-align: center; padding: 8px 8px 0; }
.brand-head.compact { display: grid; gap: 5px; text-align: center; justify-items: center; }

.score-logo {
  color: var(--green);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2.4rem, 12vw, 4.1rem);
  font-weight: 800;
  line-height: 0.82;
  text-shadow: 0 2px 0 rgba(255, 255, 255, 0.8);
}

.brand-head:not(.compact) .score-logo { color: #d83902; }
.brand-head.compact .score-logo { font-size: 2.15rem; }

.brand-golfball {
  display: inline-block;
  width: 0.86em;
  height: 0.86em;
  margin-left: 0.16em;
  vertical-align: middle;
  background-image: var(--golf-ball);
  background-size: contain;
  background-repeat: no-repeat;
  filter: drop-shadow(0 3px 5px rgba(60, 70, 55, 0.25));
}

.brand-kicker {
  margin: 12px 0 10px;
  color: var(--ink);
  font-size: 0.74rem;
  font-weight: 900;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.event-facts {
  display: grid;
  gap: 6px;
  justify-content: center;
  margin: 12px 0 0;
  font-size: 1rem;
  font-weight: 800;
}

.section-title {
  margin: 14px 0 8px;
  text-align: center;
  color: var(--green);
  font-size: clamp(1.7rem, 8vw, 2.25rem);
  line-height: 1;
}

/* Divider: gold rails with a golf ball at centre (was .pickle-divider) */
.tee-divider {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 8px;
  margin: 0 auto 12px;
  width: min(78%, 320px);
}

.tee-divider::before,
.tee-divider::after {
  content: "";
  height: 2px;
  border-radius: 999px;
  background: var(--gold);
}

.ball-icon {
  display: inline-block;
  width: 18px;
  height: 18px;
  background-image: var(--golf-ball);
  background-size: contain;
  background-repeat: no-repeat;
}

/* ---------- Cards & surfaces ---------- */

.app-card {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: rgba(255, 255, 255, 0.68);
  box-shadow: var(--soft-shadow);
  padding: 16px;
}

.loading-card { text-align: center; padding: 40px 16px; }

.ball-spinner {
  width: 44px;
  height: 44px;
  margin: 0 auto 12px;
  background-image: var(--golf-ball);
  background-size: contain;
  background-repeat: no-repeat;
  animation: ball-roll 1.1s linear infinite;
}

@keyframes ball-roll { to { transform: rotate(360deg); } }

.screen-head {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 8px;
  padding: 4px 0 8px;
}

.screen-title {
  grid-column: 1 / -1;
  margin: 8px 0 0;
  text-align: center;
  color: var(--green);
  font-size: clamp(1.55rem, 7vw, 2rem);
  line-height: 1.05;
}

.screen-time {
  grid-column: 1 / -1;
  margin: 2px 0 0;
  color: var(--muted);
  text-align: center;
  font-size: 1.02rem;
  font-weight: 900;
}

.back-button {
  min-height: 38px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--ink);
  background: rgba(255, 255, 255, 0.75);
  font-weight: 800;
  padding: 7px 12px;
}

.helper-text {
  margin: 8px 0 0;
  color: var(--muted);
  font-size: 0.9rem;
  font-weight: 750;
}

/* ---------- Buttons ---------- */

.primary-button, .secondary-button, .gold-button, .danger-button, .round-button {
  min-height: 54px;
  border: 0;
  border-radius: 13px;
  font-weight: 900;
  line-height: 1.1;
  transition: transform 120ms ease, box-shadow 120ms ease, background 120ms ease;
}

.primary-button:active, .secondary-button:active, .gold-button:active,
.danger-button:active, .round-button:active { transform: translateY(1px); }

.primary-button {
  min-height: 56px;
  color: white;
  background: linear-gradient(180deg, var(--green-2), var(--green));
  box-shadow: 0 12px 22px rgba(7, 61, 32, 0.24);
}

.secondary-button {
  color: var(--green);
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid var(--line);
}

.gold-button {
  color: var(--ink);
  background: linear-gradient(180deg, #ffd85d, var(--gold));
  box-shadow: 0 10px 18px rgba(242, 170, 24, 0.24);
}

.danger-button {
  color: white;
  background: linear-gradient(180deg, #bd4535, var(--danger));
}

.message {
  border-radius: 13px;
  padding: 11px 12px;
  color: var(--danger);
  background: rgba(159, 44, 30, 0.09);
  border: 1px solid rgba(159, 44, 30, 0.22);
  font-weight: 800;
}

.message.warning {
  color: #664600;
  background: rgba(255, 200, 61, 0.22);
  border-color: rgba(242, 170, 24, 0.38);
}

/* ---------- Daily itinerary cards (Home) ---------- */

.day-card {
  display: grid;
  gap: 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: rgba(255, 255, 255, 0.72);
  box-shadow: var(--soft-shadow);
  padding: 16px;
}

.day-card.is-today {
  border-color: rgba(242, 170, 24, 0.65);
  box-shadow: 0 0 0 3px rgba(255, 200, 61, 0.28), var(--soft-shadow);
}

.day-card-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}

.day-card-title { margin: 0; color: var(--green); font-size: 1.35rem; line-height: 1.05; }
.day-card-date { color: var(--muted); font-size: 0.88rem; font-weight: 850; }

.format-badge {
  border-radius: 999px;
  padding: 6px 12px;
  font-size: 0.74rem;
  font-weight: 1000;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  white-space: nowrap;
}

.format-badge.skins { color: var(--ink); background: #ffe0a0; }
.format-badge.match { color: white; background: linear-gradient(180deg, var(--green-2), var(--green)); }
.format-badge.combined { color: #7a3410; background: #fbe0cb; border: 1px solid rgba(232, 110, 21, 0.32); }

.day-card-facts {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  font-weight: 850;
  font-size: 0.94rem;
}

.day-card-facts .fact span { display: block; color: var(--muted); font-size: 0.72rem; font-weight: 900; text-transform: uppercase; }

.pairing-row {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 8px;
}

.team-chip {
  display: grid;
  gap: 2px;
  justify-items: center;
  padding: 10px 8px;
  border-radius: 14px;
  color: white;
  background: linear-gradient(180deg, var(--green-2), var(--green));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2);
  font-weight: 900;
  font-size: 0.95rem;
  text-align: center;
  line-height: 1.15;
}

.team-chip small { font-weight: 800; font-size: 0.72rem; opacity: 0.85; text-transform: uppercase; letter-spacing: 0.06em; }

.vs-pill {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border: 1px solid rgba(7, 61, 32, 0.16);
  border-radius: 999px;
  color: var(--ink);
  background: var(--gold);
  font-size: 0.95rem;
  font-weight: 1000;
  box-shadow: 0 10px 18px rgba(255, 200, 61, 0.32);
}

.day-status-line {
  border-radius: 999px;
  padding: 8px 12px;
  color: var(--green);
  background: rgba(7, 61, 32, 0.07);
  font-size: 0.9rem;
  font-weight: 900;
  text-align: center;
}

/* ---------- Weather block (placeholder framework, §10 of ROADMAP) ---------- */

.weather-block {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 12px;
  border: 1px solid rgba(242, 170, 24, 0.4);
  border-radius: 16px;
  padding: 10px 14px;
  background:
    radial-gradient(circle at 12% 20%, rgba(255, 216, 93, 0.5), transparent 8rem),
    rgba(255, 253, 245, 0.85);
}

.weather-icon { width: 40px; height: 40px; color: var(--gold-2); }
.weather-icon svg { width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

.weather-main { display: grid; gap: 1px; font-weight: 900; }
.weather-main .weather-cond { color: var(--green); font-size: 0.95rem; }
.weather-main .weather-course { color: var(--muted); font-size: 0.74rem; font-weight: 850; text-transform: uppercase; letter-spacing: 0.05em; }

.weather-temps { text-align: right; font-weight: 1000; color: var(--green); font-size: 1.15rem; line-height: 1.1; }
.weather-temps small { display: block; color: var(--muted); font-size: 0.74rem; font-weight: 850; }

.weather-block.is-pending .weather-cond { color: var(--muted); font-weight: 800; }

/* ---------- Score entry: hole stepper ---------- */

.hole-header {
  display: grid;
  justify-items: center;
  gap: 2px;
  padding: 4px 0;
}

.hole-number { color: var(--green); font-size: clamp(2.6rem, 13vw, 3.6rem); font-weight: 1000; line-height: 0.95; }
.hole-meta { color: var(--muted); font-weight: 900; font-size: 0.95rem; }

.player-score-row {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.78);
  padding: 10px 12px;
  box-shadow: var(--soft-shadow);
}

.player-score-name { display: grid; gap: 2px; font-weight: 900; font-size: 1.05rem; color: var(--green); }
.player-score-name small { color: var(--muted); font-size: 0.76rem; font-weight: 850; }

.stroke-dots { display: inline-flex; gap: 3px; }
.stroke-dots i {
  width: 8px; height: 8px; border-radius: 999px;
  background: var(--gold-2);
  box-shadow: inset 0 0 0 1px rgba(7, 61, 32, 0.2);
}

.stepper { display: inline-flex; align-items: center; gap: 6px; }

.stepper button {
  width: 46px;
  height: 46px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--green);
  background: rgba(255, 255, 255, 0.9);
  font-size: 1.3rem;
  font-weight: 1000;
  line-height: 1;
  display: grid;
  place-items: center;
}

.stepper button:active { transform: translateY(1px); background: var(--cream-3); }

.stepper .stepper-value {
  min-width: 44px;
  text-align: center;
  color: var(--green);
  font-size: 1.45rem;
  font-weight: 1000;
}

/* (Removed the old fixed .step-bottom-bar — hole nav is now static in flow, see .hole-nav below.) */

.step-label { color: var(--ink); font-size: 0.9rem; font-weight: 900; text-align: right; padding-right: 8px; }

/* ---------- Scorecard strip (18-hole horizontal scroller) ---------- */

.scorecard-strip {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 44px;
  gap: 4px;
  overflow-x: auto;
  padding: 4px 2px 10px;
  scroll-snap-type: x proximity;
  -webkit-overflow-scrolling: touch;
}

.scorecard-cell {
  display: grid;
  gap: 2px;
  justify-items: center;
  padding: 6px 2px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.8);
  scroll-snap-align: start;
  font-weight: 900;
  font-size: 0.82rem;
}

.scorecard-cell .sc-hole { color: var(--muted); font-size: 0.68rem; }
.scorecard-cell .sc-score { color: var(--green); font-size: 1.02rem; font-weight: 1000; }
.scorecard-cell.is-under .sc-score { color: #c2410c; }        /* birdie or better */
.scorecard-cell.is-over .sc-score { color: var(--muted); }
.scorecard-cell.has-stroke { border-color: rgba(242, 170, 24, 0.6); background: rgba(255, 200, 61, 0.14); }

/* Skins ledger chips (Day 1 detail) */
.skins-ledger { display: flex; flex-wrap: wrap; gap: 5px; }

.skin-chip {
  border-radius: 999px;
  padding: 5px 10px;
  font-size: 0.78rem;
  font-weight: 1000;
}

.skin-chip.team-a { color: white; background: var(--green-2); }
.skin-chip.team-b { color: var(--ink); background: var(--gold); }
.skin-chip.carry { color: var(--muted); background: rgba(7, 61, 32, 0.08); border: 1px dashed var(--line); }

/* Match play ticker (Day 2 detail) */
.match-ticker {
  text-align: center;
  color: var(--green);
  font-size: clamp(1.3rem, 6vw, 1.7rem);
  font-weight: 1000;
  padding: 8px 0 2px;
}

.match-ticker small { display: block; color: var(--muted); font-size: 0.85rem; font-weight: 850; }

/* ---------- Leaderboard ---------- */

.leader-table {
  width: 100%;
  border-collapse: collapse;
  font-weight: 850;
}

.leader-table th {
  padding: 8px 6px;
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 900;
  text-align: left;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  border-bottom: 1px solid var(--line);
}

.leader-table td {
  padding: 12px 6px;
  border-bottom: 1px solid rgba(7, 61, 32, 0.08);
  font-size: 1rem;
}

.leader-table tr:last-child td { border-bottom: 0; }
.leader-table .rank { width: 34px; color: var(--muted); font-weight: 1000; }
.leader-table .pts { color: var(--green); font-size: 1.2rem; font-weight: 1000; text-align: center; }
.leader-table .diff { text-align: right; font-weight: 900; color: var(--muted); }
.leader-table tr.is-leader td { background: rgba(255, 200, 61, 0.16); }
.leader-table tr.is-leader .rank::before { content: "\2691\00a0"; color: var(--gold-2); } /* flag */

.points-chip {
  display: inline-grid;
  place-items: center;
  min-width: 30px;
  height: 30px;
  border-radius: 999px;
  color: white;
  background: linear-gradient(180deg, var(--green-2), var(--green));
  font-weight: 1000;
}

/* ---------- Status pills / badges ---------- */

.status-pill {
  border-radius: 999px;
  padding: 4px 10px;
  font-size: 0.74rem;
  font-weight: 1000;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--green);
  background: rgba(7, 61, 32, 0.08);
}

.status-pill.live { color: #7a3410; background: rgba(232, 110, 21, 0.16); }
.status-pill.final { color: white; background: var(--green-2); }
.status-pill.pending-sync { color: #664600; background: rgba(255, 200, 61, 0.3); }

/* ---------- Bottom navigation ---------- */

.score-bottom-nav {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 20;
  width: 100%;
  border-top: 1px solid rgba(7, 61, 32, 0.14);
  background: rgba(255, 253, 245, 0.94);
  backdrop-filter: blur(14px);
  box-shadow: 0 -1px 0 rgba(7, 61, 32, 0.05), 0 -12px 28px rgba(18, 52, 24, 0.16);
}

/* Items are constrained + centred while the bar spans the full width (fixes tablet/desktop). */
.nav-inner {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  width: min(100%, 560px);
  margin: 0 auto;
  padding: 9px 6px max(9px, env(safe-area-inset-bottom));
}
.admin-body .nav-inner { width: min(100%, 900px); }

.nav-item {
  display: grid;
  gap: 3px;
  justify-items: center;
  align-content: center;
  min-height: 64px;
  border: 0;
  border-radius: 14px;
  padding: 2px 3px;
  color: var(--ink);
  background: transparent;
  text-decoration: none;
  font-size: 0.78rem;
  font-weight: 900;
  line-height: 1.05;
  text-align: center;
}

.nav-icon { color: currentColor; display: inline-flex; line-height: 0; }
.nav-icon svg { width: 28px; height: 28px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.nav-item.is-active { color: var(--green); background: rgba(7, 61, 32, 0.08); }
.nav-inner .nav-item { font-size: 0.72rem; padding: 2px 2px; }
.nav-inner .nav-icon svg { width: 26px; height: 26px; }
.nav-item.is-active .nav-icon { color: var(--green-2); }

/* ---------- Forms ---------- */

.field-label { font-size: 0.94rem; font-weight: 900; }

.text-input, .admin-pin-input, .admin-score-input, .admin-select-native {
  width: 100%;
  min-height: 50px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 13px;
  color: var(--green);
  background: rgba(255, 255, 255, 0.78);
  box-shadow: inset 0 1px 2px rgba(7, 61, 32, 0.08);
  font-weight: 850;
}

.action-stack { display: grid; gap: 10px; }

/* ---------- Admin panel (mirrors SouffleSlam admin) ---------- */

.admin-shell { width: min(100%, 900px); }
.admin-app { gap: 16px; }

.admin-login-card {
  display: grid;
  gap: 14px;
  min-height: 520px;
  align-content: center;
  text-align: center;
}

.admin-login-card h1 { margin: 0; color: var(--green); }
.admin-login-form { display: grid; gap: 12px; }

.admin-dashboard {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.admin-summary-card {
  display: grid;
  gap: 4px;
  min-height: 82px;
  align-content: center;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.72);
  box-shadow: var(--soft-shadow);
}

.admin-summary-card.wide { grid-column: 1 / -1; }
.admin-summary-card span { color: var(--muted); font-size: 0.78rem; font-weight: 900; text-transform: uppercase; }
.admin-summary-card strong { color: var(--green); font-size: 1.25rem; line-height: 1.08; }

.admin-section { display: grid; gap: 12px; }
.admin-section h2 { margin: 0; color: var(--green); }

.admin-message {
  border-radius: 13px;
  padding: 12px;
  font-weight: 850;
  background: rgba(255, 200, 61, 0.22);
  border: 1px solid rgba(242, 170, 24, 0.38);
}

/* Player / course editor rows */
.admin-edit-row {
  display: grid;
  grid-template-columns: 1fr 110px;
  gap: 8px;
  align-items: end;
}

/* 18-cell grids: stroke index editor + score editor */
.hole-grid {
  display: grid;
  grid-template-columns: repeat(9, minmax(0, 1fr));
  gap: 5px;
}

.hole-grid-cell { display: grid; gap: 2px; justify-items: center; }
.hole-grid-cell label { color: var(--muted); font-size: 0.66rem; font-weight: 900; }

.hole-grid-cell input {
  width: 100%;
  min-height: 44px;
  padding: 2px;
  text-align: center;
  border: 1px solid var(--line);
  border-radius: 10px;
  color: var(--green);
  background: rgba(255, 255, 255, 0.85);
  font-weight: 1000;
  font-size: 1rem;
}

.hole-grid-cell input.is-invalid {
  border-color: var(--danger);
  background: rgba(159, 44, 30, 0.08);
  color: var(--danger);
}

/* Manual override +/- */
.override-row {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.72);
  padding: 10px 12px;
}

.override-buttons { display: inline-flex; gap: 8px; }

.override-buttons button {
  width: 44px;
  height: 44px;
  border: 1px solid var(--line);
  border-radius: 999px;
  font-size: 1.35rem;
  font-weight: 1000;
  display: grid;
  place-items: center;
}

.override-buttons .minus { color: var(--danger); background: rgba(159, 44, 30, 0.08); }
.override-buttons .plus { color: white; background: linear-gradient(180deg, var(--green-2), var(--green)); border: 0; }

/* Modal */
.admin-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 40;
  display: grid;
  place-items: center;
  padding: 16px;
  background: rgba(9, 38, 22, 0.45);
  backdrop-filter: blur(3px);
}

.admin-modal {
  width: min(100%, 480px);
  max-height: 86svh;
  overflow: auto;
  display: grid;
  gap: 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--cream-2);
  box-shadow: var(--shadow);
  padding: 18px;
}

/* ---------- Utility ---------- */

.success-mark {
  display: grid;
  place-items: center;
  width: 74px;
  height: 74px;
  margin: 6px auto 10px;
  border-radius: 999px;
  color: white;
  background: #5aac3c;
  font-size: 2.6rem;
  font-weight: 1000;
  box-shadow: 0 12px 28px rgba(90, 172, 60, 0.28);
}

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

@media (min-width: 640px) {
  .admin-dashboard { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .hole-grid { grid-template-columns: repeat(18, minmax(0, 1fr)); }
}


/* ============================================================
   v2 additions — saved score rows, Schedule scroller, Analysis
   ============================================================ */

/* Enter Scores: individual save + gray-out */
.score-controls { display: flex; align-items: center; gap: 8px; }
.player-score-row.is-saved {
  background: rgba(7, 61, 32, 0.05);
  border-color: rgba(7, 61, 32, 0.10);
  box-shadow: none;
}
.player-score-row.is-saved .player-score-name,
.player-score-row.is-saved .stepper-value { color: var(--muted); }
.player-score-row.is-saved .stepper button { opacity: 0.6; }
.row-save {
  min-width: 50px;
  min-height: 46px;
  padding: 5px 9px;
  border: 1px solid var(--line);
  border-radius: 13px;
  color: var(--green);
  background: rgba(255, 255, 255, 0.9);
  font-weight: 900;
}
.row-save:active { transform: translateY(1px); }
.row-save .rs-done { display: none; }
.player-score-row.is-saved .row-save {
  color: #4e9a34;
  background: rgba(90, 172, 60, 0.14);
  border-color: rgba(90, 172, 60, 0.42);
}
.player-score-row.is-saved .row-save .rs-label { display: none; }
.player-score-row.is-saved .row-save .rs-done { display: inline; font-size: 0.95rem; line-height: 1; }

/* Schedule: horizontal day-by-day scroller */
.sched-head {
  display: grid;
  grid-template-columns: 44px 1fr 44px;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}
.sched-arrow {
  width: 44px; height: 44px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.85);
  color: var(--green);
  font-size: 1.2rem; font-weight: 1000;
}
.sched-arrow:active { transform: translateY(1px); }
.sched-dots { display: flex; justify-content: center; gap: 8px; }
.sched-dot {
  width: 10px; height: 10px; padding: 0;
  border: 0; border-radius: 999px;
  background: rgba(7, 61, 32, 0.18);
  cursor: pointer;
}
.sched-dot.is-on { background: var(--gold-2); box-shadow: 0 0 0 3px rgba(255, 200, 61, 0.28); }
.schedule-scroller {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 100%;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.schedule-scroller::-webkit-scrollbar { display: none; }
.schedule-day {
  scroll-snap-align: center;
  display: grid;
  gap: 12px;
  align-content: start;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: rgba(255, 255, 255, 0.72);
  box-shadow: var(--soft-shadow);
  padding: 16px;
}

/* Analysis: odds bars + scenario cards */
.odds-row {
  display: grid;
  grid-template-columns: 38% 1fr 42px;
  align-items: center;
  gap: 8px;
  margin: 7px 0;
}
.odds-name { font-weight: 850; font-size: 0.86rem; color: var(--green); line-height: 1.1; }
.odds-track {
  position: relative;
  height: 14px;
  border-radius: 999px;
  background: rgba(7, 61, 32, 0.10);
  overflow: hidden;
}
.odds-fill {
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--green-2), var(--green));
  min-width: 2px;
  transition: width 240ms ease;
}
.odds-fill.team-b-fill { background: linear-gradient(90deg, var(--gold), var(--gold-2)); }
.odds-pct { text-align: right; font-weight: 1000; color: var(--green); font-size: 0.9rem; }
.analysis-day {
  border: 1px solid var(--line);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.6);
  padding: 10px 12px;
  margin-bottom: 10px;
}
.analysis-day-head { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.status-pill.danger-pill { color: var(--danger); background: rgba(159, 44, 30, 0.10); }


/* ============================================================
   v3 additions — realistic ball, Home itinerary, Enter Scores
   redesign, Schedule handicaps, Analysis scenarios, sync status
   ============================================================ */

/* ---- Home: itinerary timeline (distinct from Schedule) ---- */
.home-intro { color: var(--muted); font-weight: 750; font-size: 0.94rem; margin: 2px 0 12px; text-align: center; }
.itinerary-list { display: grid; gap: 14px; }
.itin-card {
  border: 1px solid var(--line); border-radius: var(--radius);
  background: linear-gradient(180deg, rgba(255,255,255,0.85), rgba(255,253,245,0.7));
  box-shadow: var(--soft-shadow); padding: 16px;
}
.itin-card.is-today { border-color: rgba(242,170,24,0.6); box-shadow: 0 0 0 3px rgba(255,200,61,0.25), var(--soft-shadow); }
.itin-head { width: 100%; display: flex; align-items: center; gap: 10px; margin: 0; padding: 2px 0; border: 0; background: transparent; text-align: left; cursor: pointer; color: inherit; font: inherit; min-height: 46px; }
.itin-head .itin-headings { flex: 1 1 auto; min-width: 0; }
.itin-caret { flex: 0 0 auto; margin-left: 2px; }
.itin-caret::after { content: '▸'; color: var(--muted); font-size: 0.95rem; }
.itin-card.is-open > .itin-head .itin-caret::after { content: '▾'; }
.itin-body { margin-top: 4px; }
.itin-day { color: var(--green); font-weight: 1000; font-size: 1.3rem; line-height: 1; }
.itin-date { color: var(--muted); font-weight: 850; font-size: 0.82rem; margin-top: 3px; }
.timeline { list-style: none; margin: 6px 0 0; padding: 0; }
.timeline-step { display: grid; grid-template-columns: 58px 20px 1fr; align-items: start; gap: 8px; min-height: 34px; }
.tl-time { color: var(--green-2); font-weight: 1000; font-size: 0.8rem; text-align: right; padding-top: 1px; }
.tl-rail { position: relative; display: flex; justify-content: center; }
.tl-rail::before { content: ""; position: absolute; top: 0; bottom: -10px; width: 2px; background: rgba(7,61,32,0.14); }
.timeline-step:last-child .tl-rail::before { display: none; }
.tl-dot { position: relative; z-index: 1; width: 11px; height: 11px; margin-top: 2px; border-radius: 999px; background: var(--gold); box-shadow: 0 0 0 3px var(--cream-2), inset 0 0 0 1px rgba(7,61,32,0.2); }
.tl-label { color: var(--ink); font-weight: 800; font-size: 0.95rem; padding-bottom: 10px; }

/* ---- Enter Scores redesign ---- */
.score-daybar { display: flex; align-items: center; gap: 10px; }
.score-daybar .field-label { white-space: nowrap; }
.score-daybar select { flex: 1; min-width: 0; }
.hole-topbar { display: flex; align-items: center; justify-content: center; gap: 10px; }
.hole-title { color: var(--green); font-size: clamp(1.7rem, 8vw, 2.2rem); font-weight: 1000; line-height: 1; }
.hole-select { min-height: 46px; padding: 6px 12px; border: 1px solid var(--line); border-radius: 13px; color: var(--green); background: rgba(255,255,255,0.85); font-weight: 900; font-size: 1rem; text-align: center; text-align-last: center; }
.hole-meta-row { display: flex; align-items: center; justify-content: center; gap: 8px; flex-wrap: wrap; color: var(--muted); font-weight: 900; font-size: 0.95rem; margin: 12px 0 8px; }
.stroke-badge { display: inline-block; margin-left: 4px; padding: 1px 7px; border-radius: 999px; background: rgba(255,200,61,0.32); color: #6b4e00; font-size: 0.72rem; font-weight: 1000; vertical-align: middle; }
.player-score-row { position: relative; }
.player-score-row.team-a { border-left: 4px solid var(--green-2); }
.player-score-row.team-b { border-left: 4px solid var(--gold-2); }
#hole-entry-card { margin-bottom: 14px; }
/* Static hole nav directly under Save-all (no longer a floating bar) */
.hole-nav { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--line); }
.hole-nav .step-label { padding: 0; }
/* Mobile overflow guards: nothing on the scores screen may push the page wider than the viewport */
body { overflow-x: hidden; }
.hole-topbar, .hole-meta-row, .score-controls, .player-score-row { min-width: 0; }
.player-score-name { min-width: 0; white-space: nowrap; }
.hole-select { max-width: 40%; }

/* ---- Schedule: handicap block + stroke badge on the strip ---- */
.handicap-block { border: 1px solid rgba(242,170,24,0.4); border-radius: 16px; background: rgba(255,253,245,0.75); padding: 10px 12px; margin-top: 4px; }
.hc-teams { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 8px; }
.hc-team { display: grid; gap: 3px; }
.hc-team-label { font-size: 0.7rem; font-weight: 1000; text-transform: uppercase; letter-spacing: 0.06em; color: var(--muted); }
.hc-a .hc-team-label { color: var(--green-2); }
.hc-b .hc-team-label { color: var(--gold-2); }
.hc-player { display: flex; justify-content: space-between; gap: 8px; font-weight: 850; font-size: 0.9rem; color: var(--ink); }
.hc-player b { color: var(--green); }
.hc-total { margin-top: 2px; font-size: 0.82rem; font-weight: 900; color: var(--muted); }
.hc-total b { color: var(--green); font-size: 1rem; }
.hc-vs { color: var(--muted); font-weight: 1000; font-size: 0.8rem; }
.hc-result { margin-top: 8px; font-size: 0.9rem; font-weight: 800; color: var(--ink); line-height: 1.35; }
.hc-result strong { color: var(--green); }
.scorecard-cell { position: relative; }
.sc-stroke { position: absolute; top: 2px; right: 2px; font-size: 0.6rem; font-weight: 1000; color: var(--gold-2); }

/* ---- Analysis: scenarios ---- */
.scenario-list { margin: 6px 0 0; padding-left: 16px; }
.scenario-list li { font-size: 0.88rem; font-weight: 750; color: var(--ink); margin-bottom: 3px; line-height: 1.35; }
.scenario-list b { color: var(--green); font-weight: 900; }
.tie-note { color: var(--muted); font-weight: 700; }
.live-dot { color: #d1791b; font-size: 0.7em; vertical-align: middle; }
.leader-table .pts.is-provisional { color: var(--muted); }

/* ---- Global sync status (pending pill + dead-letter banner on every screen) ---- */
.sync-status { position: fixed; left: 50%; top: max(8px, env(safe-area-inset-top)); transform: translateX(-50%); z-index: 30; width: min(calc(100% - 20px), 540px); display: none; }
.sync-pill { display: inline-flex; align-items: center; gap: 6px; padding: 5px 12px; border-radius: 999px; background: rgba(255,200,61,0.28); color: #664600; font-weight: 900; font-size: 0.8rem; box-shadow: var(--soft-shadow); }
.sync-dead { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 6px; padding: 8px 12px; border-radius: 13px; background: rgba(159,44,30,0.12); border: 1px solid rgba(159,44,30,0.3); color: var(--danger); font-weight: 850; font-size: 0.84rem; box-shadow: var(--soft-shadow); }
.sync-dead-btns { display: inline-flex; gap: 6px; }
.sync-dead-btns button { border: 0; border-radius: 999px; padding: 5px 10px; font-weight: 900; font-size: 0.78rem; cursor: pointer; }
.sync-dead-btns button[data-dead-retry] { color: white; background: var(--green-2); }
.sync-dead-btns button[data-dead-dismiss] { color: var(--danger); background: rgba(159,44,30,0.14); }


/* ============================================================
   v4 additions — UX polish pass
   1. Home/Leaderboard accordions get a real dropdown affordance
   2. Enter Scores: player names get a full row at phone widths
   3. Schedule: more breathing room + live/final result block
   4. Leaderboard: summary-first, per-hole detail collapsed
   ============================================================ */

/* ---- 1. Accordion affordance: circular chevron button, rotates open ---- */
.itin-head { min-height: 54px; }
.itin-caret {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  margin-left: 4px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 2px 6px rgba(18, 52, 24, 0.10);
  transition: background 150ms ease;
}
.itin-caret::after {
  content: '▾';
  color: var(--green);
  font-size: 1.05rem;
  line-height: 1;
  transform: rotate(-90deg);
  transition: transform 200ms ease;
}
.itin-card.is-open > .itin-head .itin-caret::after { content: '▾'; }
[aria-expanded="true"] .itin-caret::after { transform: rotate(0deg); }
.itin-head:active .itin-caret,
.lb-head:active .itin-caret { background: var(--cream-3); }
.itin-card.is-open > .itin-head {
  border-bottom: 1px dashed var(--line);
  padding-bottom: 10px;
  margin-bottom: 10px;
}
.itin-head:focus-visible,
.lb-head:focus-visible {
  outline: 3px solid rgba(242, 170, 24, 0.6);
  outline-offset: 2px;
  border-radius: 14px;
}

/* ---- 2. Enter Scores: stack name above controls so names never squish ---- */
.player-score-row {
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 10px;
  padding: 7px 12px;
}
.player-score-row.team-a, .player-score-row.team-b { padding-left: 14px; }
.player-score-name {
  display: flex;
  align-items: center;
  gap: 7px;
  flex-wrap: wrap;
  font-size: 1rem;
}
.stroke-badge { margin-left: 0; }
.score-controls { width: auto; justify-content: flex-end; }
.score-controls .stepper { gap: 8px; }
@media (min-width: 480px) {
  .player-score-row { grid-template-columns: 1fr auto; }
  .score-controls { width: auto; justify-content: flex-end; }
}

/* ---- 3. Schedule: breathing room ---- */
.schedule-day { gap: 16px; padding: 18px 16px 14px; }
.day-card-date { line-height: 1.45; margin-top: 3px; }
.day-card-facts { gap: 10px 12px; }
.day-card-facts .fact { line-height: 1.4; }
.day-card-facts .fact span { margin-bottom: 2px; }
.handicap-block { padding: 12px 14px; margin-top: 0; }
.hc-teams { gap: 10px; }
.hc-team { gap: 5px; }
.hc-player { font-size: 0.92rem; line-height: 1.35; }
.hc-result {
  margin-top: 10px;
  padding-top: 9px;
  border-top: 1px dashed rgba(242, 170, 24, 0.5);
  line-height: 1.5;
}
.scorecard-strip { grid-auto-columns: 48px; gap: 6px; }
.helper-text { line-height: 1.45; }

/* Schedule: live / final result block */
.sched-result {
  display: grid;
  gap: 4px;
  justify-items: center;
  text-align: center;
  border: 1px solid rgba(7, 61, 32, 0.16);
  border-radius: 16px;
  background: linear-gradient(180deg, rgba(7, 61, 32, 0.06), rgba(7, 61, 32, 0.03));
  padding: 12px 14px;
}
.sched-result.is-final {
  border-color: rgba(242, 170, 24, 0.55);
  background: linear-gradient(180deg, rgba(255, 200, 61, 0.20), rgba(255, 253, 245, 0.6));
}
.sr-head {
  font-size: 0.68rem;
  font-weight: 1000;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: #7a3410;
}
.sched-result.is-final .sr-head { color: #7a5200; }
.sr-main { color: var(--green); font-size: 1.15rem; font-weight: 1000; line-height: 1.2; }
.sr-sub { color: var(--muted); font-size: 0.82rem; font-weight: 850; line-height: 1.35; }
.sr-win {
  margin-top: 3px;
  border-radius: 999px;
  padding: 5px 12px;
  color: var(--green);
  background: rgba(7, 61, 32, 0.08);
  font-size: 0.84rem;
  font-weight: 900;
}

/* ---- 4. Leaderboard: summary-first day accordions ---- */
.lb-section-hint { margin: 14px 2px 0; }
.lb-head {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  margin: 0;
  padding: 2px 0;
  border: 0;
  background: transparent;
  text-align: left;
  color: inherit;
  font: inherit;
  cursor: pointer;
}
.lb-headings { flex: 1 1 auto; min-width: 0; }
.lb-title { color: var(--green); font-weight: 1000; font-size: 1.12rem; line-height: 1.15; }
.lb-status { color: var(--muted); font-weight: 800; font-size: 0.84rem; line-height: 1.35; margin-top: 2px; }
.lb-day.is-open .lb-head {
  border-bottom: 1px dashed var(--line);
  padding-bottom: 10px;
  margin-bottom: 10px;
}

/* ==== Henry's 2026-07-13 changes: handicap heading, schedule hole-by-hole, leaderboard summary, info popover ==== */

/* Small uppercase section heading (Handicaps block + schedule hole-by-hole strip) */
.hc-heading {
  font-size: 0.7rem;
  font-weight: 1000;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted);
  margin: 0 0 6px;
}

/* Schedule: per-hole result strip — team strokes (A–B) + winner/carry. Reuses .scorecard-strip container. */
.result-strip { grid-auto-columns: 54px; }
.result-cell {
  display: grid;
  gap: 2px;
  justify-items: center;
  align-content: center;
  padding: 6px 3px;
  min-height: 58px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.8);
  scroll-snap-align: start;
}
.result-cell .sc-hole { color: var(--muted); font-size: 0.62rem; font-weight: 900; }
.result-cell .rc-scores { color: var(--green); font-size: 0.92rem; font-weight: 1000; letter-spacing: -0.01em; }
.result-cell .rc-mark { font-size: 0.72rem; font-weight: 1000; color: var(--muted); }
.result-cell.result-a { border-color: rgba(15, 96, 53, 0.5); background: rgba(15, 96, 53, 0.12); }
.result-cell.result-a .rc-mark { color: var(--green-2); }
.result-cell.result-b { border-color: rgba(242, 170, 24, 0.65); background: rgba(255, 200, 61, 0.18); }
.result-cell.result-b .rc-mark { color: #7a5200; }
.result-cell.result-carry { border-style: dashed; }
.result-cell.result-pending { opacity: 0.5; }
.result-cell.result-pending .rc-scores { color: var(--muted); font-weight: 900; }

/* Leaderboard: per-day summary table (strokes, net, projected points) */
.lb-day-table { width: 100%; border-collapse: collapse; margin: 10px 0 2px; }
.lb-day-table th {
  text-align: right;
  font-size: 0.64rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--muted);
  font-weight: 1000;
  padding: 0 0 6px;
}
.lb-day-table th:first-child { text-align: left; }
.lb-day-table td {
  padding: 7px 0;
  border-top: 1px solid var(--line);
  text-align: right;
  font-weight: 1000;
  color: var(--green);
  font-variant-numeric: tabular-nums;
}
.lb-day-table td.lb-pl-name { text-align: left; color: var(--ink); font-weight: 900; }
.lb-day-table td small { font-weight: 800; font-size: 0.66rem; color: var(--muted); }
.lb-pl-pts { color: var(--green-2); }
.lb-pl-pts small { display: block; }
.lb-team-dot { display: inline-block; width: 8px; height: 8px; border-radius: 999px; margin-right: 7px; vertical-align: middle; }
.lb-dot-a { background: var(--green-2); }
.lb-dot-b { background: var(--gold-2); }
.lb-points { margin-top: 8px; font-size: 0.86rem; font-weight: 850; color: var(--ink); line-height: 1.45; }
.lb-points-label {
  display: inline-block;
  font-size: 0.64rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-weight: 1000;
  color: var(--muted);
  margin-right: 5px;
}

/* Info "i" button + popover bubble (Analysis → Win probability) */
.info-dot {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: var(--green-2);
  color: var(--cream);
  font: italic 1000 0.74rem/1 Georgia, "Times New Roman", serif;
  cursor: pointer;
  vertical-align: middle;
}
.info-dot:focus-visible { outline: 2px solid var(--gold-2); outline-offset: 2px; }
.info-pop {
  margin: 0 0 12px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-left: 3px solid var(--green-2);
  border-radius: 12px;
  background: var(--cream-2);
  color: var(--ink);
  font-size: 0.82rem;
  font-weight: 700;
  line-height: 1.45;
  box-shadow: var(--soft-shadow);
}
.info-pop[hidden] { display: none; }

/* ==== Henry's changes (round 2): merged schedule strip + leaderboard point breakdown ==== */

/* Schedule: one combined per-hole strip — SI, handicap-stroke advantage, team score, result */
.hole-strip { grid-auto-columns: 58px; }
.hole-col {
  display: grid;
  gap: 2px;
  justify-items: center;
  align-content: start;
  padding: 6px 3px;
  min-height: 90px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.8);
  scroll-snap-align: start;
}
.hcol-h { color: var(--green); font-size: 0.7rem; font-weight: 1000; }
.hcol-si { color: var(--muted); font-size: 0.62rem; font-weight: 900; }
.hcol-adv { min-height: 15px; font-size: 0.66rem; font-weight: 1000; color: transparent; }
.hcol-adv.adv-a, .hcol-adv.adv-b { color: var(--danger); }
.hcol-score { margin-top: 1px; color: var(--green); font-size: 0.9rem; font-weight: 1000; letter-spacing: -0.02em; }
.hcol-mark { font-size: 0.84rem; font-weight: 1000; color: var(--muted); line-height: 1; }
.hcol-mark small { font-size: 0.6rem; }
.hole-col.result-a { border-color: rgba(15, 96, 53, 0.5); background: rgba(15, 96, 53, 0.12); }
.hole-col.result-a .hcol-mark { color: var(--green-2); }
.hole-col.result-b { border-color: rgba(242, 170, 24, 0.65); background: rgba(255, 200, 61, 0.18); }
.hole-col.result-b .hcol-mark { color: #7a5200; }
.hole-col.result-carry { border-style: dashed; }
.hole-col.result-carry .hcol-mark { color: var(--danger); }
.hole-col.result-tie .hcol-mark { color: var(--muted); }

/* Leaderboard: point-source breakdown stacked under each player name */
.leader-table td { vertical-align: top; }
.lb-name { font-weight: 900; }
.pts-sources { display: flex; flex-direction: column; gap: 2px; margin-top: 3px; }
.pts-source { font-size: 0.72rem; font-weight: 850; color: var(--muted); }

/* ==== Henry's changes (round 3): analysis cards, live-scoring teams, compact saved rows ==== */

/* Enter Scores: compact a row once its score is saved */
.player-score-row.is-saved { padding-top: 5px; padding-bottom: 5px; }
.player-score-row.is-saved .stepper button { width: 40px; height: 40px; font-size: 1.1rem; }
.player-score-row.is-saved .stepper-value { font-size: 1.15rem; min-width: 34px; }
.player-score-row.is-saved .player-score-name { font-size: 0.92rem; }
.player-score-row.is-saved .row-save { min-height: 40px; min-width: 46px; }

/* Analysis: clickable win-probability rows */
.odds-row-btn { width: 100%; grid-template-columns: 38% 1fr 40px 15px; padding: 9px 9px; margin: 7px 0; border: 1px solid var(--line); border-radius: 12px; background: var(--cream-2); font: inherit; cursor: pointer; text-align: left; }
.odds-row-btn:hover, .odds-row-btn:focus-visible { background: #fff; border-color: var(--green-2); outline: none; }
.odds-row-btn:active { background: rgba(7, 61, 32, 0.06); }
.odds-row-btn:hover .odds-name, .odds-row-btn:focus-visible .odds-name { text-decoration: underline; }
.odds-jump-caret { display: inline-flex; align-items: center; justify-content: center; color: var(--green-2); }

/* Analysis: expandable per-player cards */
.analysis-player { border: 1px solid var(--line); border-radius: 14px; background: rgba(255, 255, 255, 0.72); margin-top: 8px; overflow: hidden; }
.ap-head { width: 100%; display: flex; align-items: center; gap: 8px; padding: 11px 12px; border: 0; background: transparent; text-align: left; font: inherit; cursor: pointer; }
.ap-name { font-weight: 1000; color: var(--green); font-size: 1.02rem; flex: 0 0 auto; }
.ap-head .status-pill { flex: 0 0 auto; }
.ap-pct { margin-left: auto; font-weight: 1000; color: var(--green); font-variant-numeric: tabular-nums; font-size: 1rem; }
.ap-head .itin-caret { flex: 0 0 auto; }
.ap-body { padding: 2px 13px 12px; }
.ap-body p { margin: 0 0 8px; font-size: 0.9rem; font-weight: 600; color: var(--ink); line-height: 1.5; }
.ap-body p b { color: var(--green); font-weight: 1000; }
.ap-body .helper-text { margin-top: 4px; }
.analysis-player.is-open .ap-head { border-bottom: 1px dashed var(--line); }
.analysis-player.is-open .ap-head .itin-caret::after { content: '▾'; }

/* Schedule live scoring: both teams' scores + "through N holes" */
.sr-teams { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 8px; margin: 4px 0 6px; }
.sr-team { display: flex; flex-direction: column; align-items: center; gap: 1px; padding: 6px 8px; border-radius: 12px; border: 1px solid transparent; }
.sr-team.is-lead { background: rgba(15, 96, 53, 0.10); border-color: rgba(15, 96, 53, 0.35); }
.srt-label { font-size: 0.68rem; font-weight: 1000; text-transform: uppercase; letter-spacing: 0.05em; color: var(--muted); }
.srt-score { font-size: 1.7rem; font-weight: 1000; color: var(--green); line-height: 1; }
.sr-team.is-lead .srt-score { color: var(--green-2); }
.sr-vs { font-size: 0.66rem; font-weight: 900; color: var(--muted); text-transform: uppercase; letter-spacing: 0.04em; text-align: center; }

/* ==== Henry's changes (round 4): centred brand, stacked matchup names, bigger down/up caret ==== */

/* Matchup names stacked one per line */
.tc-name { display: block; line-height: 1.2; }

/* Expand/collapse caret: DOWN when collapsed (more below), UP when open; larger */
.itin-caret::after { content: '▾'; transform: none; font-size: 1.5rem; color: var(--green); }
.itin-card.is-open > .itin-head .itin-caret::after,
.lb-day.is-open .lb-head .itin-caret::after,
.analysis-player.is-open .ap-head .itin-caret::after,
[aria-expanded="true"] .itin-caret::after { content: '▴'; transform: none; }

/* Tied/halved holes get a dashed border on skins (carry) and match play (round 2); combined (round 3) stays solid */
.hole-col.is-dashed { border-style: dashed; }

/* Round day picker: pill dropdown with calendar icon (Rounds + Enter Scores), no card wrapper */
.round-picker {
  display: flex;
  align-items: center;
  gap: 8px;
  width: fit-content;
  max-width: 100%;
  margin: 0 auto 2px;
  padding: 0 8px 0 13px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--cream-2);
  box-shadow: var(--soft-shadow);
  cursor: pointer;
}
.round-picker-icon { display: inline-flex; align-items: center; color: var(--green-2); flex: 0 0 auto; }
.round-select {
  appearance: none;
  -webkit-appearance: none;
  border: 0;
  background: transparent;
  padding: 11px 26px 11px 2px;
  font-weight: 1000;
  font-size: 1rem;            /* 16px: below this iOS Safari auto-zooms on focus and shifts the page */
  color: var(--green);
  cursor: pointer;
  min-width: 0;
  max-width: 100%;
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2712%27%20height%3D%2712%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23073d20%27%20stroke-width%3D%273%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M6%209l6%206%206-6%27%2F%3E%3C%2Fsvg%3E");
  background-repeat: no-repeat;
  background-position: right 6px center;
}
.round-select:focus-visible { outline: none; }

/* Rounds page: format tag sits directly under the dropdown, centered. */
.sched-format-row { text-align: center; margin: -4px 0 2px; }

/* Rounds page: day / date / tee-off + course on the gold "tier" banner —
   centered bold ink text on a gold gradient with a cream frame + soft shadow. */
.schedule-day { overflow: hidden; border: none; }
.schedule-day .day-card-head {
  position: relative;
  display: block;
  text-align: center;
  background: linear-gradient(180deg, var(--gold), var(--gold-2));
  color: var(--ink);
  margin: -18px -16px 0;
  padding: 14px 14px 15px;
  border-radius: var(--radius) var(--radius) 0 0;
}
.schedule-day .day-card-head .dch-info { min-width: 0; }
.schedule-day .day-card-head .dch-course {
  color: var(--ink);
  font-weight: 1000;
  font-size: 0.96rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
                                                                                                                                                                                                                                
/* Sacrificial rule — do not remove. A file-sync glitch left a run of
   invisible NUL bytes just above this line. CSS error recovery discards
   the garbage plus the FIRST rule after it, so this dummy rule absorbs
   the damage and every real rule below parses cleanly. */
#nul-byte-recovery-sacrifice { --absorbed: 1; }

/* ============================================================
   Rounds page redesign (2026-07-15) — hierarchy, colour
   language, legibility. Everything below the picker/format tag.
   ============================================================ */

/* ---- Banner: its own floating card above the main panel. Neutral
   "scorecard letterhead" — cream with the app's deep-green heading and a
   firm green frame. Gold and green blocks belong exclusively to Team B
   and Team A, so the banner stays outside the team-colour language. */
.day-banner-card {
  text-align: center;
  padding: 13px 16px 14px;
  border: 2px solid rgba(7, 61, 32, 0.55);
  border-radius: 18px;
  background: linear-gradient(180deg, var(--cream-2), var(--cream-3));
  box-shadow: var(--soft-shadow);
}
.day-banner-card .dch-course {
  color: var(--green);
  font-weight: 1000;
  font-size: 1.28rem;
  line-height: 1.15;
  letter-spacing: -0.01em;
}
.dch-meta { margin-top: 4px; color: #4c5c4a; font-weight: 800; font-size: 0.8rem; }

/* ---- Section rhythm: generous between sections, tight within ---- */
.schedule-day { gap: 20px; padding: 18px 16px 16px; }
.sd-section { display: grid; gap: 6px; }
.sd-sec-head { display: flex; align-items: center; gap: 6px; margin: 0; }
/* Overflow containment: the nested 18-hole scroller must never widen the
   card. Without min-width:0 its ~1300px min-content propagates up through
   .sd-section → .schedule-day → .score-app and pushes everything off-screen. */
.schedule-day, .schedule-day > *, .sd-section, .strip-wrap { min-width: 0; }
.strip-wrap { max-width: 100%; }

/* ---- Flatten: the result block is the only bordered box left ---- */
.schedule-day .weather-block { border: none; background: transparent; padding: 2px 2px; }
/* Divider before the forecast only when it has dropped to the bottom (live/final) */
.schedule-day > .weather-block:not(:first-child) {
  border-top: 1px solid var(--line);
  border-radius: 0;
  padding-top: 16px;
}
.handicap-block {
  display: grid;
  gap: 8px;
  border: none;
  background: transparent;
  border-radius: 0;
  padding: 16px 2px 0;
  border-top: 1px solid var(--line);
  margin-top: 0;
}
.schedule-day .sd-section { border-top: 1px solid var(--line); padding-top: 16px; }

/* ---- Team colour language: A = green, B = gold, everywhere ---- */
.team-chip-b {
  color: var(--ink);
  background: linear-gradient(180deg, var(--gold), var(--gold-2));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.45);
}
.team-chip-b small { color: rgba(9, 38, 22, 0.72); opacity: 1; }
.vs-pill { box-shadow: none; background: var(--cream-3); }

/* ---- Handicaps: conclusion first ---- */
.hc-pill {
  width: fit-content;
  margin: 0 auto;
  padding: 6px 14px;
  border-radius: 999px;
  color: var(--green);
  background: rgba(7, 61, 32, 0.08);
  font-weight: 900;
  font-size: 0.88rem;
  text-align: center;
}
.hc-pill-a { color: var(--green-2); background: rgba(15, 96, 53, 0.12); }
.hc-pill-b { color: #7a5200; background: rgba(255, 200, 61, 0.3); }
.hc-course-line { text-align: center; color: var(--muted); font-weight: 700; font-size: 0.76rem; }
/* Team panels: soft tinted cards in each team's colour. Team A hugs the
   left edge, Team B mirrors it on the right, VS stays centered between. */
.hc-team { padding: 9px 12px; border-radius: 12px; }
.hc-a { background: rgba(15, 96, 53, 0.07); border: 1px solid rgba(15, 96, 53, 0.18); }
.hc-b { background: rgba(255, 200, 61, 0.16); border: 1px solid rgba(242, 170, 24, 0.35); justify-items: end; }
/* Numbers sit right next to the names instead of drifting apart */
.hc-player { justify-content: flex-start; gap: 9px; }
.hc-b .hc-player { justify-content: flex-end; }

/* ---- Weight discipline: reserve 900+ for numbers and headings ---- */
.hc-player { font-weight: 650; }
.hc-player b { font-weight: 900; }
.hc-total { font-weight: 700; }
.sr-sub { font-weight: 700; font-size: 0.84rem; }

/* ---- Legibility floor: micro-labels ≥0.72rem, darker muted ---- */
.schedule-day .hc-heading, .hc-team-label, .srt-label, .sr-vs { font-size: 0.72rem; color: #4c5c4a; }
.hc-a .hc-team-label { color: var(--green-2); }
.hc-b .hc-team-label { color: #7a5200; }
.sr-head { font-size: 0.72rem; }
.sched-result:not(.is-final) .sr-head { color: #4c5c4a; }

/* ---- Live result block ---- */
.sr-live-dot {
  display: inline-block;
  width: 7px; height: 7px;
  margin-right: 6px;
  border-radius: 999px;
  background: #d1791b;
  vertical-align: 1px;
  animation: sr-pulse 1.6s ease-in-out infinite;
}
@keyframes sr-pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.3; } }
@media (prefers-reduced-motion: reduce) { .sr-live-dot { animation: none; } }
/* Team B leads in gold, matching the chip/strip language */
.sr-team.sr-b.is-lead { background: rgba(255, 200, 61, 0.22); border-color: rgba(242, 170, 24, 0.6); }
.sr-team.sr-b.is-lead .srt-score { color: #7a5200; }

/* ---- Hole-by-hole strip: par + SI, gold stroke tags, edge fade ---- */
.hole-strip { grid-auto-columns: 72px; }
.hcol-h { font-size: 0.74rem; }
.hcol-par { color: #4c5c4a; font-size: 0.7rem; font-weight: 800; white-space: nowrap; }
.hcol-adv { min-height: 16px; font-size: 0.7rem; }
.hcol-adv.adv-a, .hcol-adv.adv-b { color: #7a5200; }   /* strokes are gold, not an alarm */
.strip-wrap { position: relative; }
.strip-wrap::after {
  content: "";
  position: absolute;
  top: 4px; right: 0; bottom: 10px;
  width: 26px;
  border-radius: 0 12px 12px 0;
  background: linear-gradient(90deg, rgba(255, 253, 245, 0), var(--cream-2));
  pointer-events: none;
  opacity: 1;
  transition: opacity 160ms ease;
}
.strip-wrap.is-end::after { opacity: 0; }

/* ==== 2026-07-16 site-review pass: a11y + hit targets ==== */
h1.score-logo { margin: 0; }                       /* brand heading is now a real h1 */
.hole-strip:focus-visible { outline: 2px solid var(--gold-2); outline-offset: 2px; border-radius: 12px; }
/* info-dot stays 20px visually but gains a ~48px touch target */
.info-dot { position: relative; }
.info-dot::after { content: ""; position: absolute; inset: -14px; border-radius: 999px; }

/* ==== 2026-07 Hole-by-hole per-player detail (Rounds) ==== */
.hole-col.is-tappable { cursor: pointer; -webkit-appearance: none; appearance: none; font: inherit; text-align: center; }
.hole-col.is-tappable:focus-visible { outline: 2px solid var(--gold-2); outline-offset: 2px; }
.hole-col.is-selected { border-color: var(--green-2); box-shadow: 0 0 0 2px var(--green-2) inset; }
.hd-hint { margin: 4px 2px 0; font-size: 0.76rem; font-weight: 800; color: var(--muted); }
.hole-detail { margin-top: 8px; padding: 12px; border: 1px solid var(--line); border-radius: 14px; background: var(--cream-2); box-shadow: var(--soft-shadow); }
.hd-head { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 10px; margin-bottom: 10px; }
.hd-hole { font-size: 1rem; font-weight: 1000; color: var(--green); }
.hd-facts { font-size: 0.8rem; font-weight: 800; color: #4c5c4a; }
.hd-chip { margin-left: auto; padding: 3px 10px; border: 1px solid var(--line); border-radius: 999px; font-size: 0.72rem; font-weight: 1000; color: var(--muted); background: rgba(255, 255, 255, 0.72); }
.hd-chip.result-a { border-color: rgba(15, 96, 53, 0.5); background: rgba(15, 96, 53, 0.12); color: var(--green-2); }
.hd-chip.result-b { border-color: rgba(242, 170, 24, 0.65); background: rgba(255, 200, 61, 0.22); color: var(--gold-2); }
.hd-chip.result-carry { border-style: dashed; }
.hd-teams { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.hd-team { border: 1px solid var(--line); border-radius: 12px; padding: 8px 9px; background: rgba(255, 255, 255, 0.7); }
.hd-team.hd-a { border-top: 3px solid var(--green-2); }
.hd-team.hd-b { border-top: 3px solid var(--gold-2); }
.hd-team-head { display: flex; justify-content: space-between; align-items: baseline; flex-wrap: nowrap; gap: 6px; min-height: 18px; font-size: 0.7rem; font-weight: 1000; letter-spacing: 0.02em; text-transform: uppercase; color: var(--muted); margin-bottom: 6px; }
.hd-team-total { flex: 0 0 auto; white-space: nowrap; }
.hd-team-total b { color: var(--ink); font-size: 0.9rem; }
.hd-players { display: grid; gap: 6px; }
.hd-p { display: flex; align-items: baseline; gap: 6px; }
.hd-name { flex: 1 1 auto; min-width: 0; font-size: 0.9rem; font-weight: 800; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hd-gross { font-size: 1.1rem; font-weight: 1000; color: var(--green); min-width: 20px; text-align: center; }
.hd-gross.hd-empty { color: var(--muted); font-weight: 800; }
.hd-gross.g-under { color: var(--danger); }
.hd-gross.g-par { color: var(--ink); }
.hd-gross.g-over { color: var(--muted); }
.hd-net { flex: 0 0 auto; min-width: 46px; text-align: right; font-size: 0.72rem; font-weight: 800; color: var(--muted); }
.hd-stroke { margin-left: 3px; color: var(--danger); letter-spacing: -1px; }
