/* round-detail.css — Round Detail Page (Premium Redesign) */

/* ===== Theme tokens (match site) ===== */
:root {
  --fw-cream: #fbfaf7;
  --fw-surface: #ffffff;
  --fw-ink: #111318;
  --fw-muted: rgba(17,19,24,0.62);
  --fw-gold: #d4af37;
  --fw-gold-2: #b98f23;
  --fw-green: #0f3b2f;
  --fw-card: rgba(255,255,255,0.78);
  --fw-border: rgba(17,19,24,0.12);
  --fw-shadow: 0 18px 54px rgba(0,0,0,0.10);
  --fw-shadow-sm: 0 4px 14px rgba(0,0,0,0.05);
  --fw-radius: 22px;
}

body { background: var(--fw-cream); color: var(--fw-ink); }

/* ===== Page container ===== */
.fw-rd {
  max-width: 960px;
  margin: 0 auto 64px;
  padding: 0 20px;
  display: flex;
  flex-direction: column;
  gap: 20px;
  position: relative;
}

.fw-rd::before {
  content: "";
  position: absolute;
  inset: -60px -40px 0;
  pointer-events: none;
  z-index: -1;
  background:
    radial-gradient(800px 240px at 20% 0%, rgba(217,178,96,0.12), transparent 70%),
    radial-gradient(700px 260px at 80% 60px, rgba(15,59,47,0.08), transparent 70%);
}

/* ===== ASYMMETRIC GRID WRAPPERS ===== */
.fw-rd-grid {
  display: grid;
  gap: 20px;
}

.fw-rd-grid--wide-left {
  grid-template-columns: 1.25fr 0.75fr;
}

.fw-rd-grid--wide-right {
  grid-template-columns: 0.75fr 1.25fr;
}

.fw-rd-grid--even {
  grid-template-columns: 1fr 1fr;
}

/* ===== ANALYSIS PANEL TABS ===== */
.fw-rd-tabs {
  display: flex;
  justify-content: center;
  gap: 2px;
  margin-bottom: 24px;
  border-bottom: 2px solid rgba(0,0,0,0.06);
  padding-bottom: 0;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}

.fw-rd-tabs::-webkit-scrollbar {
  display: none;
}

.fw-rd-tab {
  padding: 10px 16px;
  font-size: 13px;
  font-weight: 600;
  color: var(--fw-muted);
  white-space: nowrap;
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  margin-bottom: -2px;
  cursor: pointer;
  transition: color 0.15s ease, border-color 0.15s ease;
  letter-spacing: 0.01em;
}

.fw-rd-tab:hover {
  color: var(--fw-ink);
}

.fw-rd-tab.is-active {
  color: var(--fw-green);
  border-bottom-color: var(--fw-green);
  font-weight: 700;
}

.fw-rd-panel {
  /* panels shown/hidden via display */
}

/* ===== OVERVIEW STATS ===== */
.fw-rd-ov-hero {
  text-align: center;
  padding: 12px 0 10px;
}
.fw-rd-ov-hero__score { font-size: 3rem; font-weight: 900; color: var(--fw-ink); line-height: 1; }
.fw-rd-ov-hero__diff { font-size: 1.4rem; font-weight: 800; margin-top: 2px; }
.fw-rd-ov-hero__sub { font-size: 0.68rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.08em; color: #aaa; margin-top: 2px; }

.fw-rd-ov-rings {
  display: flex; justify-content: center; gap: 24px;
  padding: 12px 0; border-top: 1px solid rgba(0,0,0,0.05); border-bottom: 1px solid rgba(0,0,0,0.05);
}
.fw-rd-ov-ring { text-align: center; }
.fw-rd-ov-ring__svg { position: relative; display: inline-block; }
.fw-rd-ov-ring__pct { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); font-size: 0.82rem; font-weight: 800; color: var(--fw-ink); }
.fw-rd-ov-ring__num { font-size: 1.6rem; font-weight: 800; color: var(--fw-ink); line-height: 1; padding: 14px 0 2px; }
.fw-rd-ov-ring__label { font-size: 0.68rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: #999; margin-top: 4px; }
.fw-rd-ov-ring__sub { font-size: 0.68rem; color: #bbb; margin-top: 1px; }

.fw-rd-ov-fb { padding: 14px 0 0; }
.fw-rd-ov-fb__label { font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: #999; margin-bottom: 8px; }
.fw-rd-ov-fb__bars { display: flex; flex-direction: column; gap: 6px; }
.fw-rd-ov-fb__row { display: grid; grid-template-columns: 55px 1fr 70px; gap: 8px; align-items: center; }
.fw-rd-ov-fb__name { font-size: 0.78rem; font-weight: 600; color: var(--fw-ink); }
.fw-rd-ov-fb__bar { height: 10px; background: rgba(0,0,0,0.04); border-radius: 5px; overflow: hidden; }
.fw-rd-ov-fb__fill { height: 100%; border-radius: 5px; transition: width 0.3s; }
.fw-rd-ov-fb__score { font-size: 0.82rem; font-weight: 700; color: var(--fw-ink); text-align: right; }
.fw-rd-ov-fb__score small { font-weight: 500; color: #999; }

.fw-rd-ov-penalty {
  margin-top: 12px; padding: 8px 14px; border-radius: 8px;
  background: rgba(239,68,68,0.06); border: 1px solid rgba(239,68,68,0.12);
  color: #ef4444; font-size: 0.82rem; text-align: center;
}
.fw-rd-ov-penalty i { margin-right: 4px; }

/* ===== LEADERBOARD ===== */
.fw-rd-lb { display: flex; flex-direction: column; gap: 0; }

.fw-rd-lb__row {
  display: grid;
  grid-template-columns: 32px 1fr 50px 50px 20px;
  gap: 8px;
  align-items: center;
  padding: 10px 0;
  border-bottom: 1px solid rgba(0,0,0,0.05);
}
.fw-rd-lb__row:last-child { border-bottom: none; }

.fw-rd-lb__row--winner {
  background: rgba(22,163,74,0.04);
  border-radius: 8px;
  padding: 10px 8px;
  margin: 0 -8px;
}

.fw-rd-lb__pos {
  font-size: 0.82rem; font-weight: 800; color: #999; text-align: center;
}
.fw-rd-lb__row--winner .fw-rd-lb__pos { color: var(--fw-green); }

.fw-rd-lb__player {
  display: flex; align-items: center; gap: 8px; min-width: 0;
}
.fw-rd-lb__avatar {
  width: 28px; height: 28px; border-radius: 999px; object-fit: cover;
  background: #e5e7eb; flex-shrink: 0;
}
.fw-rd-lb__name {
  font-size: 0.85rem; font-weight: 600; color: var(--fw-ink);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

.fw-rd-lb__scores {
  display: flex; gap: 4px; justify-content: center;
}
.fw-rd-lb__front, .fw-rd-lb__back {
  font-size: 0.75rem; color: #888; font-weight: 500;
  padding: 2px 6px; background: rgba(0,0,0,0.03); border-radius: 4px;
}

.fw-rd-lb__total {
  font-size: 0.95rem; font-weight: 800; color: var(--fw-ink); text-align: center;
}

.fw-rd-lb__diff {
  font-size: 0.82rem; font-weight: 700; text-align: center;
}

/* Player row in group scorecard */
.sc-player-row { cursor: pointer; }
.sc-player-row:hover td { background: rgba(0,0,0,0.02); }

.sc-player-name {
  font-weight: 600; font-size: 0.75rem; color: var(--fw-ink);
}

.sc-player-diff {
  font-size: 0.65rem; font-weight: 700; margin-left: 4px;
}

.sc-chevron {
  font-size: 0.55rem; color: #bbb; margin-left: 4px;
  transition: transform 0.2s;
}

.sc-yes { color: var(--fw-green); font-weight: 600; }

/* Detail rows hidden by default */
.sc-detail-row { display: none; }
.sc-detail-row td {
  font-size: 0.68rem !important; color: #999 !important;
  padding: 4px 6px !important;
  border-bottom: 1px solid rgba(0,0,0,0.03) !important;
}
.sc-detail-row .sc-label {
  font-size: 0.65rem !important; color: #bbb !important;
  font-weight: 500 !important;
  padding-left: 8px !important;
}

/* Make summary card content distribute evenly when shorter than momentum */
#rd-overview-stats {
  justify-content: center;
}

/* ===== BREADCRUMB (inside hero) ===== */
.fw-rd-breadcrumb {
  margin-bottom: 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.fw-rd-breadcrumb__actions {
  display: flex;
  gap: 6px;
}

.fw-rd-breadcrumb__link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: rgba(255,255,255,0.5);
  text-decoration: none;
  font-size: 0.78rem;
  font-weight: 400;
  transition: color 0.15s;
}

.fw-rd-breadcrumb__link:hover {
  color: rgba(255,255,255,0.85);
}

.fw-rd-breadcrumb__link i {
  font-size: 0.65rem;
}

/* ===== HERO (full-width green banner) ===== */
.fw-rd-hero {
  --fw-banner-start: #1a5c3a;
  --fw-banner-mid: #1e6b42;
  --fw-banner-end: #237a4d;
  background: linear-gradient(135deg, var(--fw-banner-start) 0%, var(--fw-banner-mid) 50%, var(--fw-banner-end) 100%);
  margin-left: calc(-50vw + 50%);
  margin-right: calc(-50vw + 50%);
  padding: 32px max(20px, calc((100vw - 960px) / 2 + 20px));
  position: relative;
  overflow: hidden;
  border-radius: 0;
  border: none;
  box-shadow: 0 4px 20px rgba(0,0,0,0.15);
}

.fw-rd-hero__top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}

.fw-rd-hero__info {
  flex: 1;
  min-width: 0;
}

.fw-rd-hero__course {
  margin: 0 0 4px;
  font-size: 1.65rem;
  font-weight: 800;
  color: #ffffff;
  letter-spacing: 0.01em;
}

.fw-rd-hero__date {
  margin: 0;
  font-size: 0.92rem;
  color: rgba(255,255,255,0.72);
}

.fw-rd-hero__player {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin-top: 10px;
}

.fw-rd-hero__player-item {
  display: flex;
  align-items: center;
  gap: 6px;
  background: rgba(255,255,255,0.1);
  padding: 3px 10px 3px 3px;
  border-radius: 999px;
}

/* Desktop: show full name, hide first-only */
.fw-rd-name-full { display: inline; }
.fw-rd-name-first { display: none; }

.fw-rd-hero__player-overflow {
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255,255,255,0.15);
  color: rgba(255,255,255,0.7);
  font-size: 0.72rem;
  font-weight: 700;
  padding: 3px 8px;
  border-radius: 999px;
}

.fw-rd-hero__player-avatar {
  width: 28px;
  height: 28px;
  border-radius: 999px;
  object-fit: cover;
  background: rgba(255,255,255,0.2);
  border: 2px solid rgba(255,255,255,0.3);
}

.fw-rd-hero__player-initial {
  width: 28px;
  height: 28px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  font-weight: 700;
  font-size: 0.72rem;
  color: #ffffff;
  background: rgba(255,255,255,0.18);
  border: 2px solid rgba(255,255,255,0.3);
}

.fw-rd-hero__player-name {
  font-weight: 600;
  font-size: 0.88rem;
  color: rgba(255,255,255,0.92);
}

/* Score box */
.fw-rd-hero__score-area {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 4px;
  flex-shrink: 0;
}

.fw-rd-hero__score {
  font-size: 2.6rem;
  font-weight: 900;
  line-height: 1;
  color: #ffffff;
}

.fw-rd-hero__to-par {
  display: inline-block;
  padding: 3px 12px;
  border-radius: 999px;
  font-size: 0.82rem;
  font-weight: 700;
}

.fw-rd-hero__to-par--under {
  background: rgba(255,255,255,0.18);
  color: #b8f5d5;
}

.fw-rd-hero__to-par--over {
  background: rgba(255,255,255,0.18);
  color: #ffc9c0;
}

.fw-rd-hero__to-par--even {
  background: rgba(255,255,255,0.18);
  color: #fff1c0;
}

/* Hero right column: score + action icons */
.fw-rd-hero__right {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
  flex-shrink: 0;
}

.fw-rd-hero__top-actions {
  display: flex;
  gap: 6px;
}

.fw-rd-hero__icon-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 8px;
  background: rgba(255,255,255,0.12);
  color: rgba(255,255,255,0.7);
  border: none;
  cursor: pointer;
  font-size: 14px;
  text-decoration: none;
  transition: background 0.15s, color 0.15s;
}

.fw-rd-hero__icon-btn:hover {
  background: rgba(255,255,255,0.2);
  color: #fff;
}

/* Stats + Rating row */
.fw-rd-hero__stats-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid rgba(255,255,255,0.12);
}

/* Hero course rating — right side */
.fw-rd-hero__rating {
  flex-shrink: 0;
  text-align: right;
}

.fw-rd-hero__rating .fw-rd-stars {
  display: flex;
  gap: 3px;
  justify-content: flex-end;
}

.fw-rd-hero__rating .fw-rd-star {
  font-size: 20px;
  cursor: default;
  transition: color 0.15s, transform 0.15s;
  color: rgba(255,255,255,0.2);
}

.fw-rd-hero__rating .fw-rd-star i {
  background: linear-gradient(180deg, rgba(255,255,255,0.2), rgba(255,255,255,0.1));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.fw-rd-hero__rating .fw-rd-star.is-filled i {
  background: linear-gradient(180deg, #fcd34d, #d4a017);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  filter: drop-shadow(0 1px 2px rgba(212,160,23,0.4));
}

.fw-rd-hero__rating .fw-rd-star.is-hovered i {
  background: linear-gradient(180deg, #fef08a, #fbbf24);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.fw-rd-hero__rating .fw-rd-star.is-hovered {
  transform: scale(1.15);
}

.fw-rd-hero__rating .fw-rd-stars.is-interactive .fw-rd-star {
  cursor: pointer;
}

/* ===== Hero stats strip ===== */
.fw-rd-hero__stats {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0;
  flex: 1;
  min-width: 0;
}

.fw-rd-hero-stat {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 0 18px;
  border-left: 2px solid rgba(255,255,255,0.2);
}

.fw-rd-hero-stat:first-child {
  border-left: none;
  padding-left: 0;
}

.fw-rd-hero-stat__value {
  font-size: 14px;
  font-weight: 700;
  color: #ffffff;
  line-height: 1.2;
}

.fw-rd-hero-stat__label {
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: rgba(255,255,255,0.62);
  margin-top: 1px;
}

/* (old hero actions removed — now using icon buttons in hero__right) */

/* ===== Shared buttons ===== */
.fw-rd-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border-radius: 12px;
  padding: 9px 18px;
  font-size: 0.84rem;
  font-weight: 600;
  cursor: pointer;
  border: 1.5px solid transparent;
  background: #ffffff;
  color: var(--fw-green);
  box-shadow: 0 2px 8px rgba(12,23,18,0.08);
  transition: transform 0.14s ease, box-shadow 0.15s ease;
  text-decoration: none;
}

.fw-rd-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 14px rgba(12,23,18,0.12);
}

.fw-rd-btn--primary {
  background: linear-gradient(135deg, #0b3d2e, #145c3f);
  color: #f9fafb;
  border-color: rgba(6,95,70,0.9);
}

.fw-rd-btn--ghost {
  background: rgba(255,255,255,0.92);
  border-color: var(--fw-border);
}

/* ===== KEY STATS ROW ===== */
.fw-rd-keystats {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 16px;
}

.fw-rd-keycard {
  border-radius: 16px;
  background: rgba(255,255,255,0.92);
  border: 2px solid rgba(184,148,48,0.25);
  box-shadow: var(--fw-shadow-sm);
  padding: 18px 20px;
  display: flex;
  align-items: center;
  gap: 14px;
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.fw-rd-keycard:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 36px rgba(0,0,0,0.08);
}

.fw-rd-keycard--best {
  border-left: 4px solid rgba(11,61,46,0.75);
}

.fw-rd-keycard--worst {
  border-left: 4px solid rgba(192,57,43,0.65);
}

.fw-rd-keycard--rating {
  border-left: 4px solid rgba(212,175,55,0.70);
}

.fw-rd-keycard__icon {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  font-size: 1rem;
  flex-shrink: 0;
}

.fw-rd-keycard--best .fw-rd-keycard__icon {
  background: rgba(11,61,46,0.08);
  color: #0b3d2e;
}

.fw-rd-keycard--worst .fw-rd-keycard__icon {
  background: rgba(192,57,43,0.08);
  color: #c0392b;
}

.fw-rd-keycard--rating .fw-rd-keycard__icon {
  background: rgba(212,175,55,0.10);
  color: var(--fw-gold-2);
}

.fw-rd-keycard__body {
  min-width: 0;
  flex: 1;
}

.fw-rd-keycard__label {
  font-size: 0.70rem;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--fw-muted);
  font-weight: 600;
}

.fw-rd-keycard__value {
  font-size: 1.15rem;
  font-weight: 800;
  color: var(--fw-ink);
  margin-top: 2px;
}

.fw-rd-keycard__sub {
  font-size: 0.74rem;
  color: var(--fw-muted);
  margin-top: 1px;
}

/* ===== Star rating ===== */
.fw-rd-stars {
  display: inline-flex;
  gap: 4px;
  margin-top: 4px;
}

.fw-rd-star {
  font-size: 20px;
  color: var(--fw-border);
  transition: color 0.12s ease, transform 0.12s ease;
  line-height: 1;
}

.fw-rd-star.is-filled {
  color: var(--fw-gold);
}

.fw-rd-stars.is-interactive .fw-rd-star {
  cursor: pointer;
}

.fw-rd-stars.is-interactive .fw-rd-star:hover {
  transform: scale(1.15);
}

.fw-rd-stars.is-interactive:hover .fw-rd-star {
  color: var(--fw-border);
}

.fw-rd-stars.is-interactive:hover .fw-rd-star.is-hovered {
  color: var(--fw-gold);
}

/* ===== Sections (with hover lift) ===== */
.fw-rd-section {
  border-radius: var(--fw-radius);
  background: rgba(255,255,255,0.92);
  border: 2px solid rgba(184,148,48,0.35);
  box-shadow: var(--fw-shadow-sm), var(--fw-shadow);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  padding: 20px 24px;
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.fw-rd-section:hover {
  transform: translateY(-2px);
  box-shadow: 0 24px 64px rgba(0,0,0,0.12);
}

.fw-rd-section__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(211,183,119,0.14);
  margin-bottom: 16px;
}

.fw-rd-section__title {
  font-size: 1.15rem;
  font-weight: 750;
  color: #10131f;
  margin: 0;
}

/* ===== Scorecard ===== */
/* ===== SCORECARD ===== */
.fw-rd-scorecard { overflow-x: auto; -webkit-overflow-scrolling: touch; }

.fw-rd-scorecard table {
  border-collapse: collapse; min-width: 100%; font-size: 0.75rem; white-space: nowrap;
}

.fw-rd-scorecard th,
.fw-rd-scorecard td {
  padding: 8px 6px; text-align: center; vertical-align: middle;
  border-bottom: 1px solid rgba(0,0,0,0.06);
  width: 34px; min-width: 34px;
}

/* Header row — minimal */
.fw-rd-scorecard thead th {
  font-weight: 600; font-size: 0.68rem; color: #9ca3af;
  background: transparent; border-bottom: 2px solid rgba(0,0,0,0.08);
}

/* Sticky label column */
.fw-rd-scorecard .sc-label {
  position: sticky; left: 0; z-index: 2;
  background: #fff; text-align: left; font-weight: 600; font-size: 0.75rem;
  color: #6b7280; width: auto; min-width: 65px; max-width: 65px;
  padding-left: 0; padding-right: 12px;
  border-right: 1px solid rgba(0,0,0,0.06);
}
.fw-rd-scorecard thead .sc-label { color: #9ca3af; background: #fff; }

/* Par row */
.fw-rd-scorecard .sc-par td { color: #9ca3af; font-weight: 500; }
.fw-rd-scorecard .sc-par .sc-label { color: #9ca3af; }

/* Strokes row — slightly heavier but not bold */
.fw-rd-scorecard .sc-strokes td { font-weight: 600; color: var(--fw-ink); }
.fw-rd-scorecard .sc-strokes .sc-label { font-weight: 600; color: var(--fw-ink); }

/* Summary columns: OUT / IN */
.fw-rd-scorecard .sc-sum {
  font-weight: 600; border-left: 1px solid rgba(0,0,0,0.08);
  min-width: 36px; width: 36px; color: #6b7280;
}

/* TOTAL column */
.fw-rd-scorecard .sc-total {
  font-weight: 700; font-size: 0.8rem;
  border-left: 1px solid rgba(0,0,0,0.08);
  min-width: 40px; width: 40px; color: var(--fw-ink);
}
.fw-rd-scorecard .sc-strokes .sc-total { color: var(--fw-green); }

/* Dim dashes */
.fw-rd-scorecard td.sc-dim { color: #d4d4d4; font-weight: 400; }

/* GIR/FIR ticks */
.fw-rd-scorecard td.sc-yes { color: var(--fw-green); font-weight: 600; }

/* Score outcome shapes */
.fw-rd-scorecard td.is-birdie,
.fw-rd-scorecard td.is-eagle,
.fw-rd-scorecard td.is-bogey,
.fw-rd-scorecard td.is-double { position: relative; font-weight: 600; }

.fw-rd-scorecard td.is-birdie::before,
.fw-rd-scorecard td.is-eagle::before,
.fw-rd-scorecard td.is-bogey::before,
.fw-rd-scorecard td.is-double::before {
  content: ""; position: absolute; left: 50%; top: 50%;
  width: 26px; height: 26px; transform: translate(-50%,-50%);
  pointer-events: none;
}
.fw-rd-scorecard td.is-eagle::after,
.fw-rd-scorecard td.is-double::after {
  content: ""; position: absolute; left: 50%; top: 50%;
  width: 20px; height: 20px; transform: translate(-50%,-50%);
  pointer-events: none;
}
/* Birdie: circle — green */
.fw-rd-scorecard td.is-birdie::before { border-radius: 999px; border: 2px solid rgba(22,163,74,0.4); }
/* Eagle: double circle */
.fw-rd-scorecard td.is-eagle::before,
.fw-rd-scorecard td.is-eagle::after { border-radius: 999px; border: 2px solid rgba(22,163,74,0.5); }
/* Bogey: square — subtle warm */
.fw-rd-scorecard td.is-bogey::before { border-radius: 4px; border: 2px solid rgba(234,179,8,0.4); }
/* Double+: double square */
.fw-rd-scorecard td.is-double::before,
.fw-rd-scorecard td.is-double::after { border-radius: 4px; border: 2px solid rgba(239,68,68,0.35); }

.fw-rd-scorecard td.is-bogey::before {
  border-radius: 5px;
  border: 2px solid rgba(212, 175, 55, 0.65);
}

.fw-rd-scorecard td.is-double::before,
.fw-rd-scorecard td.is-double::after {
  border-radius: 5px;
  border: 2px solid rgba(212, 175, 55, 0.72);
}

.fw-rd-scorecard td.is-hio {
  position: relative;
  font-weight: 900;
  color: #0b3d2e;
  background:
    radial-gradient(220px 90px at 30% 20%, rgba(255,255,255,0.70), transparent 60%),
    linear-gradient(135deg, rgba(212,175,55,0.45), rgba(212,175,55,0.16));
  box-shadow:
    inset 0 0 0 1px rgba(212,175,55,0.60),
    inset 0 0 18px rgba(212,175,55,0.22),
    0 8px 18px rgba(0,0,0,0.06);
}

.fw-rd-scorecard td.is-hio::before { display: none; }

.fw-rd-scorecard td.is-hio::after {
  content: "\2726";
  position: absolute;
  top: 4px;
  right: 6px;
  font-size: 0.72rem;
  color: rgba(184, 137, 42, 0.95);
  opacity: 0.9;
}

/* ===== Stat grid ===== */
.fw-rd-stat-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.fw-rd-stat-grid--2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.fw-rd-stat-grid--4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.fw-rd-stat-card {
  text-align: center;
  padding: 16px 10px;
  border-radius: 14px;
  background: linear-gradient(180deg, #ffffff, #fbf7eb);
  border: 1px solid rgba(212,175,55,0.25);
  box-shadow: var(--fw-shadow-sm);
}

.fw-rd-stat-card__label {
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: #9ca3af;
}

.fw-rd-stat-card__value {
  font-size: 1.35rem;
  font-weight: 850;
  color: var(--fw-green);
  margin-top: 4px;
}

.fw-rd-stat-card__sub {
  font-size: 0.74rem;
  color: var(--fw-muted);
  margin-top: 2px;
}

/* ===== Chart container ===== */
.fw-rd-chart-wrap {
  position: relative;
  height: 220px;
  margin-top: 12px;
}

.fw-rd-chart-wrap--sm {
  height: 160px;
}

/* Two-column layout for stats + chart side by side */
.fw-rd-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  align-items: start;
}

/* ===== Horizontal bar (inline, no Chart.js) ===== */
.fw-rd-hbar {
  display: flex;
  height: 28px;
  border-radius: 8px;
  overflow: hidden;
  background: rgba(10,20,15,0.04);
  margin-top: 8px;
}

.fw-rd-hbar__seg {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.72rem;
  font-weight: 700;
  color: #fff;
  min-width: 2px;
  transition: width 0.3s ease;
}

/* Bar segment colours */
.fw-rd-hbar__seg--hit   { background: rgba(11,61,46,0.75); }
.fw-rd-hbar__seg--left  { background: rgba(192,57,43,0.65); }
.fw-rd-hbar__seg--right { background: rgba(59,130,246,0.65); }
.fw-rd-hbar__seg--short { background: rgba(212,175,55,0.70); }
.fw-rd-hbar__seg--long  { background: rgba(147,51,234,0.60); }
.fw-rd-hbar__seg--green { background: rgba(11,61,46,0.75); }

.fw-rd-hbar-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 6px;
  font-size: 0.74rem;
  color: var(--fw-muted);
}

.fw-rd-hbar-legend__dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 2px;
  margin-right: 4px;
  vertical-align: middle;
}

/* ===== Front/Back comparison ===== */
.fw-rd-fb-card {
  text-align: center;
  padding: 18px 12px;
  border-radius: 14px;
  background: linear-gradient(180deg, #ffffff, #fbf7eb);
  border: 1px solid rgba(212,175,55,0.25);
  box-shadow: var(--fw-shadow-sm);
}

.fw-rd-fb-card__label {
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: #9ca3af;
  font-weight: 600;
}

.fw-rd-fb-card__score {
  font-size: 1.6rem;
  font-weight: 850;
  color: var(--fw-green);
  margin-top: 4px;
}

.fw-rd-fb-card__diff {
  font-size: 0.82rem;
  font-weight: 700;
  margin-top: 2px;
}

.fw-rd-fb-card__diff--under { color: #0b3d2e; }
.fw-rd-fb-card__diff--over  { color: #c0392b; }
.fw-rd-fb-card__diff--even  { color: var(--fw-gold-2); }

.fw-rd-fb-card__par {
  font-size: 0.72rem;
  color: var(--fw-muted);
  margin-top: 2px;
}

/* ===== Streaks ===== */
.fw-rd-streak {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  border-radius: 12px;
  background: rgba(249,250,251,0.7);
  border: 1px solid rgba(10,20,15,0.06);
  margin-bottom: 10px;
}

.fw-rd-streak:last-child { margin-bottom: 0; }

.fw-rd-streak__icon {
  width: 36px;
  height: 36px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  font-size: 1rem;
  flex-shrink: 0;
  background: rgba(212,175,55,0.10);
  color: var(--fw-gold-2);
}

.fw-rd-streak__body { flex: 1; min-width: 0; }

.fw-rd-streak__title {
  font-size: 0.88rem;
  font-weight: 700;
  color: var(--fw-ink);
}

.fw-rd-streak__sub {
  font-size: 0.74rem;
  color: var(--fw-muted);
  margin-top: 1px;
}

.fw-rd-streak__badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 12px;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 700;
  background: rgba(11,61,46,0.08);
  color: #0b3d2e;
  flex-shrink: 0;
}

/* ===== Correlation 2x2 grid ===== */
.fw-rd-corr-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.fw-rd-corr-cell {
  text-align: center;
  padding: 14px 10px;
  border-radius: 12px;
  background: rgba(249,250,251,0.7);
  border: 1px solid rgba(10,20,15,0.06);
}

.fw-rd-corr-cell__label {
  font-size: 0.68rem;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--fw-muted);
  font-weight: 600;
}

.fw-rd-corr-cell__value {
  font-size: 1.2rem;
  font-weight: 800;
  margin-top: 4px;
}

.fw-rd-corr-cell__value--good { color: #0b3d2e; }
.fw-rd-corr-cell__value--bad  { color: #c0392b; }
.fw-rd-corr-cell__value--ok   { color: var(--fw-gold-2); }

.fw-rd-corr-cell__sub {
  font-size: 0.72rem;
  color: var(--fw-muted);
  margin-top: 2px;
}

/* ===== Penalty analysis ===== */
.fw-rd-penalty-row {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 12px 0;
  border-bottom: 1px solid rgba(10,20,15,0.06);
}

.fw-rd-penalty-row:last-child { border-bottom: none; }

.fw-rd-penalty-row__hole {
  width: 38px;
  height: 38px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  font-weight: 800;
  font-size: 0.88rem;
  background: rgba(192,57,43,0.08);
  color: #c0392b;
  flex-shrink: 0;
}

.fw-rd-penalty-row__info { flex: 1; min-width: 0; }

.fw-rd-penalty-row__title {
  font-size: 0.84rem;
  font-weight: 600;
  color: var(--fw-ink);
}

.fw-rd-penalty-row__sub {
  font-size: 0.74rem;
  color: var(--fw-muted);
}

/* ===== Notes ===== */
.fw-rd-notes {
  font-size: 0.92rem;
  line-height: 1.55;
  color: var(--fw-ink);
  white-space: pre-wrap;
}

/* ===== Empty state ===== */
.fw-rd-empty {
  text-align: center;
  padding: 24px 16px;
  border-radius: 14px;
  border: 1px dashed rgba(10,20,15,0.15);
  background: rgba(249,250,251,0.7);
  color: var(--fw-muted);
  font-size: 0.88rem;
}

.fw-rd-empty i {
  display: block;
  font-size: 1.6rem;
  margin-bottom: 8px;
  opacity: 0.5;
}

/* ===== Toast ===== */
.fw-rd-toast {
  position: fixed;
  bottom: 24px;
  left: 50%;
  transform: translateX(-50%) translateY(20px);
  padding: 10px 20px;
  border-radius: 12px;
  background: linear-gradient(135deg, #0b3d2e, #145c3f);
  color: #f9fafb;
  font-size: 0.84rem;
  font-weight: 600;
  box-shadow: 0 12px 36px rgba(0,0,0,0.18);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease, transform 0.2s ease;
  z-index: 9999;
}

.fw-rd-toast.is-visible {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
  pointer-events: auto;
}

/* ===== Loading ===== */
.fw-rd-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 32px 16px;
  color: var(--fw-muted);
  font-size: 0.88rem;
}

.fw-rd-spinner {
  width: 24px;
  height: 24px;
  border: 3px solid rgba(217,178,96,0.2);
  border-top-color: #d9b260;
  border-radius: 999px;
  animation: fw-rd-spin 0.7s linear infinite;
}

@keyframes fw-rd-spin {
  to { transform: rotate(360deg); }
}

/* ===== 404 state ===== */
.fw-rd-notfound {
  text-align: center;
  padding: 60px 20px;
}

.fw-rd-notfound h1 {
  font-size: 1.4rem;
  font-weight: 700;
  margin-bottom: 8px;
}

.fw-rd-notfound p {
  color: var(--fw-muted);
  margin-bottom: 20px;
}

/* ===== Responsive ===== */
@media (max-width: 640px) {
  .fw-rd {
    padding: 0 12px;
    max-width: 100vw;
    overflow-x: hidden;
  }

  .fw-rd-hero {
    padding: 20px 16px;
    margin-left: -12px;
    margin-right: -12px;
  }

  .fw-rd-hero__top {
    flex-direction: row;
    align-items: flex-start;
  }

  .fw-rd-hero__info {
    min-width: 0; /* allow truncation */
  }

  .fw-rd-hero__course {
    font-size: 1.2rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .fw-rd-hero__score-area {
    flex-shrink: 0;
  }

  .fw-rd-hero__score {
    font-size: 2rem;
  }

  /* Player names: first name only on mobile */
  .fw-rd-name-full { display: none; }
  .fw-rd-name-first { display: inline; }

  /* Stack player avatars on mobile */
  .fw-rd-hero__player {
    flex-wrap: nowrap;
  }

  .fw-rd-hero__player-item {
    padding: 4px 10px 4px 4px;
    font-size: 0.78rem;
    height: 32px;
  }

  .fw-rd-hero__player-avatar {
    width: 24px;
    height: 24px;
  }

  .fw-rd-hero__player-name {
    font-size: 0.78rem;
  }

  /* Ensure all cards stack single column and fit screen on mobile */
  .fw-rd-putting-layout {
    grid-template-columns: 1fr !important;
  }

  .fw-rd-putting-card {
    max-width: 100%;
    overflow-x: auto;
  }

  .fw-rd-panel {
    max-width: 100%;
    overflow-x: hidden;
  }

  .fw-rd-hero__stats {
    flex-wrap: wrap;
    gap: 8px 0;
  }

  .fw-rd-hero-stat {
    padding: 0 12px;
  }

  /* Grids collapse to single column */
  .fw-rd-grid--wide-left,
  .fw-rd-grid--wide-right,
  .fw-rd-grid--even {
    grid-template-columns: 1fr;
  }

  .fw-rd-keystats {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .fw-rd-section {
    padding: 16px;
    border-radius: 18px;
  }

  /* No hover lift on mobile (touch) */
  .fw-rd-section:hover {
    transform: none;
    box-shadow: var(--fw-shadow-sm), var(--fw-shadow);
  }

  .fw-rd-keycard:hover {
    transform: none;
    box-shadow: var(--fw-shadow-sm);
  }

  .fw-rd-stat-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .fw-rd-stat-grid--4 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .fw-rd-split {
    grid-template-columns: 1fr;
  }

  .fw-rd-corr-grid {
    grid-template-columns: 1fr 1fr;
  }

  /* Putting analysis layout stacks on mobile */
  .fw-rd-putting-layout {
    grid-template-columns: 1fr;
  }

  /* Scorecard name column wider on mobile */
  .fw-rd-scorecard .sc-label {
    min-width: 55px;
    max-width: 85px;
    font-size: 0.65rem;
    padding-right: 6px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .fw-rd-scorecard th, .fw-rd-scorecard td {
    padding: 6px 4px;
    font-size: 0.65rem;
    min-width: 26px;
    width: 26px;
  }
  .fw-rd-pt-wrap { overflow-x: auto; }
}

/* ===== Putting Analysis (Redesigned) ===== */

.fw-rd-putting-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  max-width: 100%;
  overflow: hidden;
}

.fw-rd-putting-card {
  border-radius: 12px;
  background: #fff;
  border: 1px solid rgba(0,0,0,0.1);
  box-shadow: 0 4px 14px rgba(0,0,0,0.07), 0 1px 4px rgba(0,0,0,0.05);
  padding: 20px;
  display: flex;
  flex-direction: column;
  position: relative;
  transition: box-shadow 0.2s ease, border-color 0.2s ease;
}

.fw-rd-putting-card:hover {
  box-shadow: 0 6px 20px rgba(0,0,0,0.1), 0 2px 6px rgba(0,0,0,0.06);
  border-color: rgba(0,0,0,0.14);
}

.fw-rd-putting-card--story,
.fw-rd-putting-card--wide {
  grid-column: 1 / -1;
}

.fw-rd-putting-card__title {
  font-size: 0.78rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--fw-ink);
  margin: 0 0 14px;
}

/* ── Module 1: Putting Story ── */

.fw-rd-story {
  padding: 4px 0 0;
}

.fw-rd-story--positive {
  background: linear-gradient(135deg, rgba(22,163,74,0.06) 0%, rgba(22,163,74,0.02) 100%);
  border-radius: 10px;
  padding: 16px 20px;
}

.fw-rd-story--negative {
  background: linear-gradient(135deg, rgba(239,68,68,0.06) 0%, rgba(239,68,68,0.02) 100%);
  border-radius: 10px;
  padding: 16px 20px;
}

.fw-rd-story__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
}

.fw-rd-story__header .fw-rd-putting-card__title {
  margin: 0;
}

.fw-rd-story__sg {
  font-size: 1.6rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}

.fw-rd-story__sg.is-positive { color: #16a34a; }
.fw-rd-story__sg.is-negative { color: #ef4444; }

.fw-rd-story__baseline {
  font-size: 0.72rem;
  font-weight: 600;
  color: rgba(0,0,0,0.35);
  text-align: right;
  margin: -6px 0 8px;
  letter-spacing: 0.02em;
}

.fw-rd-story__text {
  font-size: 0.88rem;
  line-height: 1.6;
  color: var(--fw-ink);
  margin: 0;
}

/* ── Module 2: Enhanced Miss Map ── */

.fw-rd-missmap-desc {
  font-size: 0.75rem;
  color: #999;
  margin: -8px 0 10px;
  line-height: 1.4;
}

.fw-rd-missmap-filters {
  display: flex;
  align-items: center;
  gap: 4px;
  margin-bottom: 12px;
}

.fw-rd-missmap-filters__label {
  font-size: 0.68rem;
  font-weight: 600;
  color: #999;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-right: 4px;
  white-space: nowrap;
}

.fw-rd-missmap-btn {
  padding: 4px 8px;
  border-radius: 5px;
  border: 1px solid rgba(0,0,0,0.1);
  background: #f8f9fa;
  font-size: 0.7rem;
  font-weight: 600;
  cursor: pointer;
  color: var(--fw-ink);
  transition: background 0.15s, border-color 0.15s;
  white-space: nowrap;
}

.fw-rd-missmap-btn:hover {
  background: #eef0f2;
}

.fw-rd-missmap-btn.is-active {
  background: var(--fw-ink);
  color: #fff;
  border-color: var(--fw-ink);
}

.fw-rd-missmap-btn.is-disabled {
  opacity: 0.35;
  cursor: not-allowed;
  pointer-events: none;
}

.fw-rd-missmap-body {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
}

.fw-rd-missmap-svg {
  width: 100%;
  height: 100%;
  display: block;
  flex: 1;
  min-height: 200px;
}


.fw-rd-missmap-stats {
  display: flex;
  gap: 1px;
  margin-top: 10px;
  background: rgba(0,0,0,0.04);
  border-radius: 10px;
  overflow: hidden;
  width: 100%;
}

.fw-rd-missmap-stat {
  flex: 1;
  background: #fff;
  padding: 12px 10px;
  text-align: center;
}

.fw-rd-missmap-stat:first-child {
  border-radius: 10px 0 0 10px;
}

.fw-rd-missmap-stat:last-child {
  border-radius: 0 10px 10px 0;
}

.fw-rd-missmap-stat__value {
  font-size: 1.15rem;
  font-weight: 800;
  color: var(--fw-ink);
  line-height: 1.2;
}

.fw-rd-missmap-stat__unit {
  font-size: 0.7rem;
  font-weight: 600;
  opacity: 0.5;
}

.fw-rd-missmap-stat__label {
  font-size: 0.65rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #999;
  margin-top: 2px;
}

.fw-rd-missmap-stat__sub {
  font-size: 0.68rem;
  color: #aaa;
  margin-top: 1px;
}

.fw-rd-missmap-dot-svg {
  cursor: pointer;
  transition: r 0.12s ease;
}

.fw-rd-missmap-dot-svg:hover {
  r: 6;
  filter: drop-shadow(0 0 3px rgba(0,0,0,0.25));
}

.fw-rd-missmap-tooltip {
  display: none;
  position: absolute;
  z-index: 50;
  background: #fff;
  color: var(--fw-ink);
  font-size: 0.75rem;
  font-weight: 600;
  padding: 5px 10px;
  border-radius: 6px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.12), 0 0 0 1px rgba(0,0,0,0.06);
  pointer-events: none;
  white-space: nowrap;
}

/* ── Module 3: Distance Performance Table ── */

.fw-rd-pt-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.fw-rd-pt {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.82rem;
}

.fw-rd-pt th {
  text-align: left;
  font-weight: 700;
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #777;
  padding: 8px 10px;
  border-bottom: 2px solid rgba(0,0,0,0.08);
  white-space: nowrap;
}

.fw-rd-pt td {
  padding: 10px 10px;
  border-bottom: 1px solid rgba(0,0,0,0.05);
  vertical-align: middle;
}

.fw-rd-pt tbody tr:nth-child(even) {
  background: rgba(0,0,0,0.02);
}

.fw-rd-pt-band {
  font-weight: 700;
  white-space: nowrap;
}

.fw-rd-pt-num {
  text-align: center;
  font-variant-numeric: tabular-nums;
}

.fw-rd-pt-make {
  min-width: 100px;
}

.fw-rd-pt-bar-wrap {
  height: 6px;
  background: rgba(0,0,0,0.06);
  border-radius: 3px;
  overflow: hidden;
  margin-bottom: 3px;
}

.fw-rd-pt-bar-fill {
  height: 100%;
  background: #16a34a;
  border-radius: 3px;
  transition: width 0.3s;
}

.fw-rd-pt-pct {
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--fw-ink);
}

.fw-rd-pt-dir {
  white-space: nowrap;
  font-size: 0.8rem;
}

.fw-rd-pt-arrow {
  font-size: 0.95rem;
  vertical-align: middle;
}

.fw-rd-pt-sg {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.fw-rd-pt-sg.is-positive { color: #16a34a; }
.fw-rd-pt-sg.is-negative { color: #ef4444; }

.fw-rd-pt-speed {
  min-width: 90px;
}

.fw-rd-speed-bar {
  position: relative;
  display: flex;
  height: 8px;
  border-radius: 4px;
  overflow: hidden;
  margin-bottom: 3px;
}

.fw-rd-speed-bar__short {
  background: #3b82f6;
  height: 100%;
}

.fw-rd-speed-bar__long {
  background: #ef4444;
  height: 100%;
}

.fw-rd-speed-bar__center {
  position: absolute;
  left: 50%;
  top: -1px;
  bottom: -1px;
  width: 2px;
  background: #fff;
  transform: translateX(-50%);
}

.fw-rd-speed-label {
  font-size: 0.68rem;
  color: #888;
}

/* ── Module 4: Speed Control by Distance ── */

.fw-rd-speed-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
}

.fw-rd-speed-score {
  display: flex;
  align-items: baseline;
}

.fw-rd-speed-score__num {
  font-size: 2rem;
  font-weight: 800;
  color: var(--fw-ink);
  line-height: 1;
}

.fw-rd-speed-score__label {
  font-size: 0.85rem;
  color: #999;
  font-weight: 600;
  margin-left: 2px;
}

.fw-rd-speed-score__title {
  font-size: 0.82rem;
  font-weight: 600;
  color: #777;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.fw-rd-speed-rows {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 16px;
}

.fw-rd-speedrow {
  display: grid;
  grid-template-columns: 60px 1fr 65px;
  gap: 8px;
  align-items: center;
}

.fw-rd-speedrow--header {
  margin-bottom: 4px;
}

.fw-rd-speedrow__axis {
  display: flex;
  justify-content: space-between;
  font-size: 0.65rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #aaa;
}

.fw-rd-speedrow__label {
  font-size: 0.8rem;
  font-weight: 700;
  color: var(--fw-ink);
}

.fw-rd-speedrow__track {
  position: relative;
  height: 10px;
  border-radius: 5px;
  overflow: visible;
}

.fw-rd-speedrow__bg {
  position: absolute;
  inset: 0;
  border-radius: 5px;
  background: linear-gradient(90deg, rgba(59,130,246,0.3), rgba(22,163,74,0.2) 45%, rgba(22,163,74,0.2) 55%, rgba(239,68,68,0.3));
}

.fw-rd-speedrow__marker {
  position: absolute;
  top: -3px;
  width: 10px;
  height: 16px;
  border-radius: 5px;
  border: 2px solid #fff;
  transform: translateX(-50%);
  box-shadow: 0 1px 3px rgba(0,0,0,0.2);
}

.fw-rd-speedrow__center-line {
  position: absolute;
  left: 50%;
  top: 0;
  bottom: 0;
  width: 2px;
  background: rgba(0,0,0,0.15);
  transform: translateX(-50%);
  pointer-events: none;
}

.fw-rd-speedrow__val {
  font-size: 0.72rem;
  color: #888;
  text-align: right;
  white-space: nowrap;
}

.fw-rd-speed-summary {
  font-size: 0.84rem;
  line-height: 1.55;
  color: #555;
  margin: auto 0 0;
  padding: 10px 14px;
  background: #f8f9fa;
  border-radius: 8px;
}

/* Proximity / Miss Distance section */
.fw-rd-speed-proximity {
  padding-top: 18px;
  margin-top: 16px;
  border-top: 2px solid rgba(0,0,0,0.06);
}

.fw-rd-speed-proximity__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
}

.fw-rd-speed-proximity__title {
  font-size: 0.78rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--fw-ink);
}

.fw-rd-speed-proximity__badge {
  font-size: 0.75rem;
  font-weight: 700;
}

.fw-rd-speed-proximity__bars {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 10px;
}

.fw-rd-prox-row {
  display: grid;
  grid-template-columns: 70px 1fr 45px;
  gap: 8px;
  align-items: center;
}

.fw-rd-prox-row__label {
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--fw-ink);
}

.fw-rd-prox-row__track {
  height: 8px;
  background: rgba(0,0,0,0.05);
  border-radius: 4px;
  overflow: hidden;
}

.fw-rd-prox-row__fill {
  height: 100%;
  border-radius: 4px;
  transition: width 0.3s;
}

.fw-rd-prox-row__val {
  font-size: 0.75rem;
  font-weight: 600;
  color: #555;
  text-align: right;
}

.fw-rd-prox-insight {
  font-size: 0.84rem;
  line-height: 1.55;
  color: #555;
  margin: 6px 0 0;
  padding: 10px 14px;
  background: #f8f9fa;
  border-radius: 8px;
}

.fw-rd-prox-insight strong {
  color: var(--fw-ink);
}

/* ══════════════════════════════════════════════
   APPROACH ANALYSIS PANEL
   ══════════════════════════════════════════════ */

/* ── Approach Miss Map SVG ── */
.fw-rd-approach-map-svg {
  width: 100%;
  display: block;
  min-height: 220px;
  flex: 1;
}

.fw-rd-approach-dot {
  cursor: pointer;
  transition: r 0.12s ease;
}

.fw-rd-approach-dot:hover {
  r: 8;
  filter: drop-shadow(0 0 4px rgba(0,0,0,0.3));
}

/* ── GIR Grid ── */
.fw-rd-gir-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 16px;
}

.fw-rd-gir-cell {
  width: 36px;
  height: 44px;
  border-radius: 6px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  position: relative;
  font-size: 0;
  transition: transform 0.12s ease, box-shadow 0.12s ease;
  background: rgba(0,0,0,0.06);
  border: 1px solid rgba(0,0,0,0.06);
}

.fw-rd-gir-cell:hover {
  transform: scale(1.1);
  box-shadow: 0 2px 8px rgba(0,0,0,0.12);
}

.fw-rd-gir-cell--hit {
  background: rgba(22,163,74,0.15);
  border-color: rgba(22,163,74,0.3);
}

.fw-rd-gir-cell--miss {
  background: rgba(239,68,68,0.12);
  border-color: rgba(239,68,68,0.25);
}

.fw-rd-gir-cell--none {
  background: rgba(0,0,0,0.04);
  border-color: rgba(0,0,0,0.06);
}

.fw-rd-gir-cell__check {
  font-size: 0.72rem;
  color: #16a34a;
  font-weight: 700;
  line-height: 1;
}

.fw-rd-gir-cell__arrow {
  font-size: 0.72rem;
  color: #ef4444;
  line-height: 1;
  opacity: 0.7;
}

.fw-rd-gir-cell__hole {
  font-size: 0.6rem;
  font-weight: 700;
  color: var(--fw-muted);
  line-height: 1;
  margin-top: 2px;
}

/* ── GIR Summary Stats ── */
.fw-rd-gir-summary {
  display: flex;
  gap: 1px;
  background: rgba(0,0,0,0.04);
  border-radius: 10px;
  overflow: hidden;
  margin-bottom: 12px;
}

.fw-rd-gir-stat {
  flex: 1;
  background: #fff;
  padding: 12px 8px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
}

.fw-rd-gir-stat:first-child {
  border-radius: 10px 0 0 10px;
}

.fw-rd-gir-stat:last-child {
  border-radius: 0 10px 10px 0;
}

.fw-rd-gir-stat__value {
  font-size: 1.15rem;
  font-weight: 800;
  color: var(--fw-ink);
  line-height: 1.2;
}

.fw-rd-gir-stat__label {
  font-size: 0.65rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #999;
}

.fw-rd-gir-stat__sub {
  font-size: 0.68rem;
  color: #aaa;
}

/* ── GIR Streak ── */
.fw-rd-gir-streak {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.82rem;
  color: #555;
  padding: 10px 14px;
  background: linear-gradient(135deg, rgba(234,179,8,0.08) 0%, rgba(234,179,8,0.03) 100%);
  border-radius: 8px;
  border: 1px solid rgba(234,179,8,0.15);
}

.fw-rd-gir-streak i {
  color: #ea580c;
  font-size: 0.9rem;
}

.fw-rd-gir-streak strong {
  color: var(--fw-ink);
}

/* Scrambling section */
.fw-rd-gir-scramble {
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid rgba(0,0,0,0.06);
}

.fw-rd-gir-scramble__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 6px;
}

.fw-rd-gir-scramble__pct {
  font-size: 1.4rem;
  font-weight: 800;
}

.fw-rd-gir-scramble__desc {
  font-size: 0.82rem;
  color: #666;
  line-height: 1.5;
  margin: 0 0 8px;
}

.fw-rd-gir-scramble__bar {
  height: 6px;
  background: rgba(0,0,0,0.06);
  border-radius: 3px;
  overflow: hidden;
}

.fw-rd-gir-scramble__fill {
  height: 100%;
  border-radius: 3px;
  transition: width 0.3s;
}

/* GIR Impact — on vs off green comparison */
.fw-rd-gir-impact {
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid rgba(0,0,0,0.06);
}

.fw-rd-gir-impact__row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

.fw-rd-gir-impact__card {
  padding: 12px;
  border-radius: 10px;
  text-align: center;
}

.fw-rd-gir-impact__card--on {
  background: rgba(22,163,74,0.05);
  border: 1px solid rgba(22,163,74,0.12);
}

.fw-rd-gir-impact__card--off {
  background: rgba(239,68,68,0.04);
  border: 1px solid rgba(239,68,68,0.1);
}

.fw-rd-gir-impact__label {
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #888;
  margin-bottom: 8px;
}

.fw-rd-gir-impact__stat {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 4px;
  margin-bottom: 4px;
}

.fw-rd-gir-impact__unit {
  font-size: 0.68rem;
  color: #999;
  font-weight: 500;
}

.fw-rd-gir-impact__count {
  font-size: 0.68rem;
  color: #aaa;
  margin-top: 4px;
}

/* Scramble detail — per-hole breakdown */
.fw-rd-gir-scramble-detail {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 10px;
}

.fw-rd-scramble-hole {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 5px 10px;
  border-radius: 8px;
  font-size: 0.75rem;
  font-weight: 600;
  border: 1px solid;
}

.fw-rd-scramble-hole--saved {
  background: rgba(22,163,74,0.06);
  border-color: rgba(22,163,74,0.15);
  color: #16a34a;
}

.fw-rd-scramble-hole--lost {
  background: rgba(239,68,68,0.04);
  border-color: rgba(239,68,68,0.12);
  color: #ef4444;
}

.fw-rd-scramble-hole__num {
  font-weight: 700;
  color: var(--fw-ink);
  font-size: 0.72rem;
}

.fw-rd-scramble-hole__result {
  font-weight: 700;
}

.fw-rd-scramble-hole__chip {
  font-size: 0.68rem;
  color: #888;
  font-weight: 500;
}

/* TTG driving accuracy grid */
.fw-rd-ttg-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 14px;
}

.fw-rd-ttg-cell {
  width: 42px;
  height: 42px;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border: 1.5px solid;
  position: relative;
}

.fw-rd-ttg-cell--hit {
  background: rgba(22,163,74,0.08);
  border-color: rgba(22,163,74,0.25);
}

.fw-rd-ttg-cell--miss {
  background: rgba(245,158,11,0.06);
  border-color: rgba(245,158,11,0.25);
}

.fw-rd-ttg-cell--short {
  background: rgba(239,68,68,0.06);
  border-color: rgba(239,68,68,0.2);
}

.fw-rd-ttg-cell--par3 {
  background: rgba(0,0,0,0.02);
  border-color: rgba(0,0,0,0.06);
}

.fw-rd-ttg-cell--none {
  background: rgba(0,0,0,0.02);
  border-color: rgba(0,0,0,0.06);
}

.fw-rd-ttg-cell--penalty {
  box-shadow: 0 0 0 2px rgba(220,38,38,0.3);
}

.fw-rd-ttg-cell__icon {
  font-size: 14px;
  font-weight: 600;
  line-height: 1;
}

.fw-rd-ttg-cell--hit .fw-rd-ttg-cell__icon { color: #16a34a; }
.fw-rd-ttg-cell--miss .fw-rd-ttg-cell__icon { color: #f59e0b; }
.fw-rd-ttg-cell--short .fw-rd-ttg-cell__icon { color: #ef4444; }
.fw-rd-ttg-cell--par3 .fw-rd-ttg-cell__icon { color: #bbb; font-size: 9px; }
.fw-rd-ttg-cell--none .fw-rd-ttg-cell__icon { color: #ccc; }

.fw-rd-ttg-cell__hole {
  font-size: 9px;
  font-weight: 600;
  color: #999;
  line-height: 1;
}

/* Penalty type breakdown */
.fw-rd-ttg-pen-types {
  margin-top: 20px;
  padding-top: 20px;
  border-top: 2px solid rgba(0,0,0,0.06);
}

.fw-rd-ttg-pen-types__title {
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #888;
  margin-bottom: 8px;
}

.fw-rd-ttg-pen-type-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 4px 0;
  border-bottom: 1px solid rgba(0,0,0,0.04);
}

.fw-rd-ttg-pen-type-label {
  font-size: 0.82rem;
  color: var(--fw-ink);
}

.fw-rd-ttg-pen-type-count {
  font-size: 0.82rem;
  font-weight: 700;
  color: #ef4444;
}

/* Par 3 row in detail table */
.fw-rd-ttg-row--par3 {
  background: rgba(0,0,0,0.04) !important;
  color: #aaa;
}

.fw-rd-ttg-row--par3 .fw-rd-ttg-td-hole,
.fw-rd-ttg-row--par3 .fw-rd-ttg-td-score {
  color: #aaa;
}

/* Fairway SVG visual */
.fw-rd-ttg-fairway-wrap {
  margin-bottom: 4px;
}

#rd-ttg-panel-content {
  grid-template-columns: 3fr 2fr;
}

.fw-rd-ttg-fairway-svg {
  width: 100%;
  max-width: 300px;
  height: auto;
  display: block;
  margin: 0 auto;
}

/* ── Responsive: GIR grid on small screens ── */
@media (max-width: 600px) {
  .fw-rd-gir-grid {
    gap: 4px;
  }
  .fw-rd-gir-cell {
    width: 30px;
    height: 38px;
  }
  .fw-rd-gir-cell__check,
  .fw-rd-gir-cell__arrow {
    font-size: 0.62rem;
  }
  .fw-rd-gir-cell__hole {
    font-size: 0.52rem;
  }
}

/* ══════════════════════════════════════════════
   TEE TO GREEN PANEL
   ══════════════════════════════════════════════ */

/* ── Story stats row ── */
.fw-rd-ttg-stats-row {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin: 10px 0 12px;
}

.fw-rd-story-stat {
  font-size: 0.84rem;
  color: var(--fw-muted);
  line-height: 1.4;
}

.fw-rd-story-stat strong {
  color: var(--fw-ink);
  font-weight: 700;
}

/* ── Driving Accuracy Map ── */
.fw-rd-ttg-map-desc {
  font-size: 0.75rem;
  color: #999;
  margin: -8px 0 12px;
  line-height: 1.4;
}

.fw-rd-ttg-map-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  padding: 4px 0;
}

.fw-rd-ttg-svg {
  display: block;
  width: 100%;
  min-width: 600px;
  height: auto;
}

.fw-rd-ttg-map-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 10px;
  font-size: 0.74rem;
  color: var(--fw-muted);
}

.fw-rd-ttg-legend-item {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.fw-rd-ttg-legend-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
}

/* ── Penalty & Recovery ── */
.fw-rd-ttg-clean {
  text-align: center;
  padding: 24px 16px;
}

.fw-rd-ttg-penalty-stats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-bottom: 16px;
}

.fw-rd-ttg-pstat {
  text-align: center;
  padding: 12px 8px;
  border-radius: 10px;
  background: rgba(249,250,251,0.8);
  border: 1px solid rgba(0,0,0,0.06);
}

.fw-rd-ttg-pstat__val {
  font-size: 1.25rem;
  font-weight: 800;
  color: var(--fw-ink);
  line-height: 1.2;
}

.fw-rd-ttg-pstat__lbl {
  font-size: 0.68rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #999;
  margin-top: 2px;
}

/* 18-hole strip — two rows of 9 */
.fw-rd-ttg-hole-strip {
  display: flex;
  gap: 4px;
  justify-content: center;
  margin: 6px 0;
}

.fw-rd-ttg-hole-dot {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 0.68rem;
  font-weight: 700;
  transition: transform 0.12s;
  cursor: default;
}

.fw-rd-ttg-hole-dot:hover {
  transform: scale(1.12);
}

.fw-rd-ttg-hole-dot--clean {
  background: rgba(22,163,74,0.12);
  color: #16a34a;
  border: 1.5px solid rgba(22,163,74,0.25);
}

.fw-rd-ttg-hole-dot--penalty {
  background: rgba(220,38,38,0.12);
  color: #dc2626;
  border: 1.5px solid rgba(220,38,38,0.3);
}

.fw-rd-ttg-hole-dot--sand {
  background: rgba(212,175,55,0.14);
  color: #b98f23;
  border: 1.5px solid rgba(212,175,55,0.3);
}

.fw-rd-ttg-sand-detail {
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid rgba(0,0,0,0.04);
}

.fw-rd-ttg-sand-label {
  font-size: 0.78rem;
  color: var(--fw-muted);
}

/* ── Tee Shot Detail Table ── */
.fw-rd-ttg-table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.fw-rd-ttg-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.82rem;
}

.fw-rd-ttg-table th {
  text-align: left;
  font-weight: 700;
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #777;
  padding: 8px 10px;
  border-bottom: 2px solid rgba(0,0,0,0.08);
  white-space: nowrap;
}

.fw-rd-ttg-table td {
  padding: 10px 10px;
  border-bottom: 1px solid rgba(0,0,0,0.05);
  vertical-align: middle;
}

.fw-rd-ttg-table tbody tr:nth-child(even) {
  background: rgba(0,0,0,0.02);
}

.fw-rd-ttg-row--hit {
  background: rgba(22,163,74,0.04) !important;
}

.fw-rd-ttg-row--miss {
  background: rgba(245,158,11,0.04) !important;
}

.fw-rd-ttg-row--penalty {
  background: rgba(220,38,38,0.06) !important;
}

.fw-rd-ttg-td-hole {
  font-weight: 800;
  color: var(--fw-ink);
}

.fw-rd-ttg-td-score {
  font-weight: 700;
}

/* Fairway result icons */
.fw-rd-ttg-fw {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border-radius: 6px;
  font-size: 0.72rem;
}

.fw-rd-ttg-fw--hit {
  background: rgba(22,163,74,0.12);
  color: #16a34a;
}

.fw-rd-ttg-fw--left {
  background: rgba(239,68,68,0.10);
  color: #ef4444;
}

.fw-rd-ttg-fw--right {
  background: rgba(59,130,246,0.10);
  color: #3b82f6;
}

.fw-rd-ttg-fw--short {
  background: rgba(245,158,11,0.12);
  color: #d97706;
}

.fw-rd-ttg-fw--na {
  color: #ccc;
}

/* Score diff classes */
.fw-rd-ttg-under { color: #0b3d2e; font-weight: 700; }
.fw-rd-ttg-even  { color: var(--fw-gold-2); font-weight: 600; }
.fw-rd-ttg-bogey { color: #d97706; font-weight: 700; }
.fw-rd-ttg-double { color: #c0392b; font-weight: 700; }

/* ── Mobile: TTG panel ── */
@media (max-width: 640px) {
  .fw-rd-ttg-svg {
    min-width: 500px;
  }

  .fw-rd-ttg-penalty-stats {
    grid-template-columns: repeat(2, 1fr);
  }

  .fw-rd-ttg-hole-dot {
    width: 26px;
    height: 26px;
    font-size: 0.62rem;
  }
}

/* ══════════════════════════════════════════════
   SCORING ANALYSIS PANEL
   ══════════════════════════════════════════════ */

/* ── Module 2: Par Type Performance ── */

#rd-scoring-partype {
  justify-content: center;
}

.fw-rd-partype-cards {
  display: flex;
  gap: 14px;
}

.fw-rd-partype-card {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  padding: 16px 10px 12px;
  border-radius: 10px;
  background: #f8f9fa;
  border: 1px solid rgba(0,0,0,0.05);
}

.fw-rd-partype-card__header {
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--fw-ink);
  text-align: center;
}

.fw-rd-partype-card__donut {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}

.fw-rd-partype-card__donut-inner {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: #f8f9fa;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1px;
}

.fw-rd-partype-card__par-label {
  font-size: 0.68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #888;
}

.fw-rd-partype-card__avg {
  font-size: 1.05rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}

.fw-rd-partype-card__breakdown {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.fw-rd-partype-row {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.75rem;
  font-weight: 600;
  color: #555;
  padding: 2px 4px;
}

.fw-rd-partype-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}

.fw-rd-partype-count {
  margin-left: auto;
  font-weight: 700;
  color: var(--fw-ink);
  font-variant-numeric: tabular-nums;
}

.fw-rd-partype-card__footer {
  font-size: 0.68rem;
  font-weight: 600;
  color: #aaa;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

/* ── Module 3: Scoring Timeline Chart ── */

.fw-rd-scoring-chart-desc {
  font-size: 0.78rem;
  color: #999;
  margin: -8px 0 12px;
  line-height: 1.4;
}

.fw-rd-scoring-chart-wrap {
  position: relative;
  height: 260px;
  margin-bottom: 12px;
}

.fw-rd-scoring-legend {
  display: flex;
  justify-content: center;
  gap: 14px;
  flex-wrap: wrap;
}

.fw-rd-scoring-legend__item {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 0.72rem;
  font-weight: 600;
  color: #777;
}

.fw-rd-scoring-legend__dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}

/* ── Module 4: Streaks & Difficulty Split ── */

.fw-rd-scoring-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}

.fw-rd-scoring-streak-badge {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  border-radius: 8px;
  font-size: 0.82rem;
  line-height: 1.4;
  margin-bottom: 10px;
}

.fw-rd-scoring-streak-badge i {
  font-size: 1rem;
  flex-shrink: 0;
}

.fw-rd-scoring-streak-badge--good {
  background: rgba(22,163,74,0.07);
  color: #15803d;
}

.fw-rd-scoring-streak-badge--good i {
  color: #f97316;
}

.fw-rd-scoring-streak-badge--bad {
  background: rgba(239,68,68,0.07);
  color: #b91c1c;
}

.fw-rd-scoring-streak-badge--bad i {
  color: #6b7280;
}

.fw-rd-scoring-streak-badge__range {
  margin-left: auto;
  font-size: 0.72rem;
  font-weight: 700;
  white-space: nowrap;
  opacity: 0.7;
}

/* 18-hole visual strip */
.fw-rd-scoring-strip {
  display: grid;
  grid-template-columns: repeat(9, 1fr);
  gap: 3px;
  margin-top: 14px;
}

.fw-rd-scoring-sq {
  aspect-ratio: 1;
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  transition: transform 0.15s, box-shadow 0.15s;
  cursor: default;
}

.fw-rd-scoring-sq:hover {
  transform: scale(1.12);
  z-index: 2;
}

.fw-rd-scoring-sq__num {
  font-size: 0.6rem;
  font-weight: 700;
  color: rgba(255,255,255,0.85);
  text-shadow: 0 1px 2px rgba(0,0,0,0.3);
}

.fw-rd-scoring-sq--best {
  box-shadow: 0 0 0 2px rgba(22,163,74,0.5), 0 0 6px rgba(22,163,74,0.3);
}

.fw-rd-scoring-sq--worst {
  box-shadow: 0 0 0 2px rgba(239,68,68,0.5), 0 0 6px rgba(239,68,68,0.3);
}

/* Hole Difficulty bars */
.fw-rd-difficulty-rows {
  display: flex;
  flex-direction: column;
  gap: 4px;
  max-height: 340px;
  overflow-y: auto;
}

.fw-rd-difficulty-row {
  display: grid;
  grid-template-columns: 32px 42px 1fr 36px;
  gap: 6px;
  align-items: center;
  padding: 3px 4px;
  border-radius: 4px;
  transition: background 0.15s;
}

.fw-rd-difficulty-row:hover {
  background: rgba(0,0,0,0.03);
}

.fw-rd-difficulty-row--hardest {
  background: rgba(239,68,68,0.04);
}

.fw-rd-difficulty-row--easiest {
  background: rgba(22,163,74,0.04);
}

.fw-rd-difficulty-row__hole {
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--fw-ink);
}

.fw-rd-difficulty-row__par {
  font-size: 0.68rem;
  font-weight: 600;
  color: #999;
}

.fw-rd-difficulty-row__bar-wrap {
  width: 100%;
}

.fw-rd-difficulty-row__bar-container {
  position: relative;
  height: 8px;
  border-radius: 4px;
  background: rgba(0,0,0,0.04);
}

.fw-rd-difficulty-row__bar-center {
  position: absolute;
  left: 50%;
  top: 0;
  bottom: 0;
  width: 2px;
  background: rgba(0,0,0,0.12);
  transform: translateX(-50%);
}

.fw-rd-difficulty-row__bar {
  position: absolute;
  top: 0;
  height: 100%;
  border-radius: 4px;
  transition: width 0.3s;
}

.fw-rd-difficulty-row__bar--right {
  left: 50%;
}

.fw-rd-difficulty-row__bar--left {
  right: 50%;
}

.fw-rd-difficulty-row__val {
  font-size: 0.75rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  text-align: right;
}

.fw-rd-difficulty-row__val.is-easy {
  color: #16a34a;
}

.fw-rd-difficulty-row__val.is-par {
  color: #999;
}

.fw-rd-difficulty-row__val.is-hard {
  color: #ef4444;
}

/* Scoring Distribution Bar */
.fw-rd-score-dist-bar {
  display: flex;
  height: 28px;
  border-radius: 8px;
  overflow: hidden;
  margin-bottom: 10px;
}

.fw-rd-score-dist-seg {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.72rem;
  font-weight: 700;
  color: #fff;
  min-width: 2px;
  transition: width 0.3s;
}

.fw-rd-score-dist-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 18px;
}

.fw-rd-score-dist-item {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 0.78rem;
  color: #666;
}

.fw-rd-score-dist-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
}

/* Best/Worst/Front/Back highlight cards */
.fw-rd-score-highlights {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  margin-bottom: 18px;
}

.fw-rd-score-highlight {
  padding: 12px 10px;
  border-radius: 10px;
  text-align: center;
  border: 1px solid rgba(0,0,0,0.06);
}

.fw-rd-score-highlight--best {
  background: rgba(22,163,74,0.04);
  border-color: rgba(22,163,74,0.12);
}

.fw-rd-score-highlight--worst {
  background: rgba(239,68,68,0.04);
  border-color: rgba(239,68,68,0.1);
}

.fw-rd-score-highlight--front,
.fw-rd-score-highlight--back {
  background: rgba(0,0,0,0.02);
}

.fw-rd-score-highlight__label {
  font-size: 0.68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #999;
  margin-bottom: 4px;
}

.fw-rd-score-highlight__value {
  font-size: 1.1rem;
  font-weight: 800;
  color: var(--fw-ink);
}

.fw-rd-score-highlight__sub {
  font-size: 0.72rem;
  color: #888;
  margin-top: 2px;
}

/* ── Scoring Panel Responsive ── */

@media (max-width: 640px) {
  .fw-rd-partype-cards {
    flex-direction: column;
  }

  .fw-rd-partype-card {
    flex-direction: row;
    gap: 14px;
    padding: 12px 14px;
  }

  .fw-rd-partype-card__header {
    display: none;
  }

  .fw-rd-partype-card__donut {
    width: 70px;
    height: 70px;
    flex-shrink: 0;
  }

  .fw-rd-partype-card__donut-inner {
    width: 46px;
    height: 46px;
  }

  .fw-rd-partype-card__par-label {
    font-size: 0.6rem;
  }

  .fw-rd-partype-card__avg {
    font-size: 0.9rem;
  }

  .fw-rd-scoring-split {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .fw-rd-score-highlights {
    grid-template-columns: 1fr 1fr;
  }

  .fw-rd-scoring-chart-wrap {
    height: 220px;
  }

  .fw-rd-scoring-strip {
    grid-template-columns: repeat(9, 1fr);
  }

  .fw-rd-difficulty-rows {
    max-height: 280px;
  }
}

/* ═════════════════════════════════════════════════
   AI FEATURES — Summary & Analysis
   ═════════════════════════════════════════════════ */

/* -- AI Summary story variant (neutral bg, not red/green) -- */
.fw-rd-story--ai {
  background: linear-gradient(135deg, rgba(212,175,55,0.06) 0%, rgba(212,175,55,0.02) 100%);
  border-radius: 10px;
  padding: 16px 20px;
}

/* -- Loading state -- */
.fw-rd-ai-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 28px 16px;
  font-size: 0.88rem;
  color: var(--fw-muted);
}

/* -- Generate button styling -- */
.fw-rd-ai-gen-btn {
  font-size: 0.85rem;
  gap: 6px;
}

/* -- AI Analysis sections container -- */
.fw-rd-ai-sections {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* ── AI Analysis: Performance-style layout ── */

.fw-rd-ai-h3 {
  font-size: 1.1rem; font-weight: 800; color: var(--fw-ink);
  margin: 0 0 14px; display: flex; align-items: center; gap: 8px;
}
.fw-rd-ai-h3 i { font-size: 0.9rem; color: var(--fw-gold); }
.fw-rd-ai-h3--green { color: #16a34a; }
.fw-rd-ai-h3--green i { color: #16a34a; }
.fw-rd-ai-h3--red { color: #dc2626; }
.fw-rd-ai-h3--red i { color: #dc2626; }

/* Summary card */
.fw-rd-ai-summary-card {
  background: #fff; border: 1px solid rgba(0,0,0,0.08);
  border-radius: 12px; padding: 20px 24px; margin-bottom: 24px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.04);
}
.fw-rd-ai-summary-text {
  font-size: 0.9rem; line-height: 1.7; color: var(--fw-ink); margin: 0;
}

/* Strengths & Weaknesses — two columns */
.fw-rd-ai-sw {
  display: grid; grid-template-columns: 1fr 1fr; gap: 24px;
  margin-bottom: 24px;
}
.fw-rd-ai-sw__col { display: flex; flex-direction: column; gap: 12px; }

.fw-rd-ai-sw-item {
  padding: 14px 16px; border-radius: 10px;
  border-left: 3px solid; background: #fff;
  border-color: rgba(0,0,0,0.06);
  box-shadow: 0 1px 4px rgba(0,0,0,0.04);
}
.fw-rd-ai-sw-item--green { border-left-color: #16a34a; }
.fw-rd-ai-sw-item--red { border-left-color: #dc2626; }

.fw-rd-ai-sw-item__title {
  font-size: 0.88rem; font-weight: 700; color: var(--fw-ink); margin-bottom: 4px;
}
.fw-rd-ai-sw-item__detail {
  font-size: 0.82rem; line-height: 1.55; color: #555;
}
.fw-rd-ai-sw-item__stat {
  font-size: 0.75rem; color: #999; margin-top: 6px; font-style: italic;
}

/* Action Plan */
.fw-rd-ai-action-card {
  background: #fff; border: 1px solid rgba(0,0,0,0.08);
  border-radius: 12px; padding: 20px 24px; margin-bottom: 24px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.04);
}

.fw-rd-ai-action {
  display: flex; gap: 14px; padding: 14px 0;
  border-bottom: 1px solid rgba(0,0,0,0.05);
}
.fw-rd-ai-action:last-of-type { border-bottom: none; }

.fw-rd-ai-action__num {
  width: 28px; height: 28px; border-radius: 8px;
  background: rgba(212,175,55,0.12); color: var(--fw-gold);
  font-weight: 800; font-size: 0.82rem;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.fw-rd-ai-action__body { flex: 1; }
.fw-rd-ai-action__title {
  font-size: 0.88rem; font-weight: 700; color: var(--fw-ink); margin-bottom: 4px;
}
.fw-rd-ai-action__instruction {
  font-size: 0.82rem; line-height: 1.55; color: #555;
}
.fw-rd-ai-action__goal {
  font-size: 0.78rem; color: #16a34a; font-style: italic; margin-top: 4px;
}

/* Trend Analysis */
.fw-rd-ai-trend-card {
  background: #fff; border: 1px solid rgba(0,0,0,0.08);
  border-radius: 12px; padding: 20px 24px; margin-bottom: 16px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.04);
}
.fw-rd-ai-trend-text {
  font-size: 0.88rem; line-height: 1.65; color: #555; margin: 0;
}

/* Regenerate button */
.fw-rd-ai-regen {
  text-align: center; padding-top: 20px; margin-top: 8px;
}

/* Credit cost badge + balance */
.fw-rd-credit-cost {
  display: inline-block;
  background: rgba(212,175,55,0.15);
  color: var(--fw-gold-2);
  font-size: 0.72rem;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 4px;
  margin-left: 6px;
}

.fw-rd-credit-balance {
  font-size: 0.78rem;
  color: #999;
  margin: 8px 0 0;
  text-align: center;
}

/* Mobile: stack S/W columns */
@media (max-width: 640px) {
  .fw-rd-ai-sw { grid-template-columns: 1fr; gap: 16px; }
}

/* Legacy format: hide old section cards if new format loaded */
.fw-rd-ai-sections { display: none; }

/* -- Old section card (kept for backwards compat but hidden by default) -- */
.fw-rd-ai-section {
  background: var(--fw-card);
  border: 1px solid var(--fw-border);
  border-radius: 14px;
  padding: 20px 22px;
  border-left: 3px solid rgba(0,0,0,0.06);
  transition: box-shadow 0.2s, border-color 0.2s;
}

.fw-rd-ai-section:hover {
  box-shadow: 0 4px 16px rgba(0,0,0,0.07);
  border-color: rgba(0,0,0,0.14);
}

/* Section colour accents — left border */
.fw-rd-ai-section[data-section="overall"] { border-left-color: var(--fw-gold); }
.fw-rd-ai-section[data-section="strengths"] { border-left-color: #16a34a; }
.fw-rd-ai-section[data-section="weaknesses"] { border-left-color: #ef4444; }
.fw-rd-ai-section[data-section="stats"] { border-left-color: #3b82f6; }
.fw-rd-ai-section[data-section="recommendations"] { border-left-color: #8b5cf6; }
.fw-rd-ai-section[data-section="mental"] { border-left-color: #0891b2; }

/* Section icon colours to match */
.fw-rd-ai-section[data-section="overall"] .fw-rd-ai-section__icon { color: var(--fw-gold); }
.fw-rd-ai-section[data-section="strengths"] .fw-rd-ai-section__icon { color: #16a34a; }
.fw-rd-ai-section[data-section="weaknesses"] .fw-rd-ai-section__icon { color: #ef4444; }
.fw-rd-ai-section[data-section="stats"] .fw-rd-ai-section__icon { color: #3b82f6; }
.fw-rd-ai-section[data-section="recommendations"] .fw-rd-ai-section__icon { color: #8b5cf6; }
.fw-rd-ai-section[data-section="mental"] .fw-rd-ai-section__icon { color: #0891b2; }

/* -- Hero variant (overall assessment) -- */
.fw-rd-ai-section--hero {
  background: linear-gradient(135deg, rgba(15,59,47,0.04) 0%, rgba(212,175,55,0.04) 100%);
  border-color: rgba(212,175,55,0.2);
  border-left: 4px solid var(--fw-gold);
  padding: 24px 26px;
}

/* Regenerate button spacing */
.fw-rd-ai-regen {
  text-align: center;
  padding-top: 20px;
  margin-top: 8px;
}

.fw-rd-ai-section--hero .fw-rd-ai-section__title {
  font-size: 0.95rem;
}

.fw-rd-ai-section--hero .fw-rd-ai-section__body p {
  font-size: 0.95rem;
  line-height: 1.7;
}

/* -- Section header -- */
.fw-rd-ai-section__header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
}

.fw-rd-ai-section__icon {
  font-size: 0.82rem;
  color: var(--fw-gold);
  width: 20px;
  text-align: center;
  flex-shrink: 0;
}

.fw-rd-ai-section__title {
  font-size: 0.78rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--fw-ink);
  margin: 0;
}

/* -- Section body -- */
.fw-rd-ai-section__body p {
  margin: 0 0 10px;
  font-size: 0.88rem;
  line-height: 1.65;
  color: var(--fw-ink);
}

.fw-rd-ai-section__body p:last-child {
  margin-bottom: 0;
}

/* -- Bullet list for recommendations -- */
.fw-rd-ai-bullets {
  margin: 0;
  padding: 0 0 0 20px;
  list-style: none;
}

.fw-rd-ai-bullets li {
  position: relative;
  margin: 0 0 10px;
  font-size: 0.88rem;
  line-height: 1.6;
  color: var(--fw-ink);
  padding-left: 8px;
}

.fw-rd-ai-bullets li:last-child {
  margin-bottom: 0;
}

.fw-rd-ai-bullets li::before {
  content: "";
  position: absolute;
  left: -16px;
  top: 8px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--fw-gold);
}

/* -- Mobile adjustments -- */
@media (max-width: 640px) {
  .fw-rd-ai-section {
    padding: 16px 18px;
  }

  .fw-rd-ai-section--hero {
    padding: 20px 20px;
  }

  .fw-rd-ai-section__body p,
  .fw-rd-ai-bullets li {
    font-size: 0.85rem;
  }
}

/* ===== Momentum Graph ===== */
.fw-rd-momentum-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 4px;
}

.fw-rd-momentum-header .fw-rd-putting-card__title {
  margin-bottom: 0;
}

.fw-rd-momentum-toggle {
  display: flex;
  gap: 0;
  background: rgba(17,19,24,0.06);
  border-radius: 8px;
  padding: 2px;
  flex-shrink: 0;
}

.fw-rd-momentum-pill {
  padding: 4px 14px;
  font-size: 0.78rem;
  font-weight: 600;
  border: none;
  background: transparent;
  color: var(--fw-muted);
  border-radius: 6px;
  cursor: pointer;
  transition: all 0.2s ease;
  line-height: 1.4;
}

.fw-rd-momentum-pill:hover {
  color: var(--fw-ink);
}

.fw-rd-momentum-pill.is-active {
  background: var(--fw-surface);
  color: var(--fw-ink);
  box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}

.fw-rd-chart-wrap--momentum {
  flex: 1;
  min-height: 200px;
  margin-top: 8px;
}

#rd-overview-momentum {
  display: flex;
  flex-direction: column;
}

/* ===== Momentum Legend (multi-player) ===== */
.fw-rd-momentum-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 20px;
  padding: 10px 0 0;
  justify-content: center;
}

.fw-rd-momentum-legend__item {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.82rem;
  font-weight: 500;
  color: var(--fw-ink);
}

.fw-rd-momentum-legend__dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex-shrink: 0;
}

/* ===== Awards Grid ===== */
.fw-rd-awards-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}

@media (max-width: 700px) {
  .fw-rd-awards-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
  }
  .fw-rd-award {
    padding: 12px 8px;
  }
  .fw-rd-award__icon { width: 28px; height: 28px; }
  .fw-rd-award__icon i { font-size: 0.72rem; }
  .fw-rd-award__title { font-size: 0.6rem; }
  .fw-rd-award__winner { font-size: 0.78rem; }
  .fw-rd-award__stat { font-size: 0.68rem; }
}

.fw-rd-award {
  background: linear-gradient(160deg, #fff 0%, #fdfbf6 100%);
  border: 1px solid rgba(180,150,60,0.15);
  border-radius: 12px;
  padding: 16px 12px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.fw-rd-award:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 14px rgba(180,150,60,0.1);
  border-color: rgba(180,150,60,0.25);
}

.fw-rd-award__icon {
  width: 34px; height: 34px; border-radius: 999px;
  background: rgba(180,150,60,0.08);
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 6px;
}
.fw-rd-award__icon i {
  font-size: 0.82rem; color: #a08530;
}

.fw-rd-award__title {
  font-size: 0.68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #a08530;
}

.fw-rd-award--negative {
  background: linear-gradient(160deg, #fff 0%, #fef5f5 100%);
  border-color: rgba(220,50,50,0.12);
}
.fw-rd-award--negative .fw-rd-award__icon { background: rgba(220,50,50,0.06); }
.fw-rd-award--negative .fw-rd-award__icon i { color: #c0392b; }
.fw-rd-award--negative .fw-rd-award__title { color: #c0392b; }

.fw-rd-award__winner {
  font-size: 0.92rem;
  font-weight: 700;
  color: var(--fw-ink);
  line-height: 1.3;
}

.fw-rd-award__stat {
  font-size: 0.78rem;
  color: var(--fw-muted);
  font-weight: 500;
}

/* ===== Head to Head ===== */
.fw-rd-h2h-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
}

.fw-rd-h2h-player {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1;
}

.fw-rd-h2h-player--p2 {
  justify-content: flex-end;
  text-align: right;
}

.fw-rd-h2h__avatar {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
}

.fw-rd-h2h__name {
  font-size: 0.88rem;
  font-weight: 600;
  color: var(--fw-ink);
}

.fw-rd-h2h__wins {
  font-size: 1.3rem;
  font-weight: 800;
  color: var(--fw-ink);
  min-width: 28px;
  text-align: center;
}

.fw-rd-h2h-middle {
  flex-shrink: 0;
  text-align: center;
}

.fw-rd-h2h__halved {
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--fw-muted);
  white-space: nowrap;
}

.fw-rd-h2h-holes {
  display: grid;
  grid-template-columns: repeat(18, 1fr);
  gap: 4px;
}

@media (max-width: 600px) {
  .fw-rd-h2h-holes {
    grid-template-columns: repeat(9, 1fr);
  }
}

.fw-rd-h2h-hole {
  aspect-ratio: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 6px;
  font-size: 0.7rem;
  font-weight: 700;
  color: #fff;
  min-width: 0;
}

.fw-rd-h2h-hole--p1 {
  background: #1a5c3a;
}

.fw-rd-h2h-hole--p2 {
  background: #3b82f6;
}

.fw-rd-h2h-hole--halved {
  background: #d1d5db;
  color: #6b7280;
}

.fw-rd-h2h-hole--none {
  background: #f3f4f6;
  color: #d1d5db;
}

/* ===== Key Moments ===== */
.fw-rd-moments {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.fw-rd-moment {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 10px 12px;
  background: rgba(17, 19, 24, 0.03);
  border-radius: 10px;
  border-left: 3px solid var(--fw-gold);
}

.fw-rd-moment__badge {
  flex-shrink: 0;
  background: var(--fw-green);
  color: #fff;
  font-size: 0.72rem;
  font-weight: 700;
  padding: 3px 8px;
  border-radius: 6px;
  letter-spacing: 0.02em;
  min-width: 32px;
  text-align: center;
}

.fw-rd-moment__text {
  font-size: 0.88rem;
  line-height: 1.5;
  color: var(--fw-ink);
}