/* CLUBHOUSE — Stage 1 read-only round review */
.clubhouse-preview {
   padding-bottom: 28px;
}
.clubhouse-photo {
   width: 100%;
   height: 148px;
   margin-bottom: 18px;
   border-radius: 10px;
   background: #4b493b url("../images/Clubhouse-trophys.png") center 53% / cover no-repeat;
}
.clubhouse-preview h1 {
   font: 900 25px Arial, sans-serif;
   margin: 0 0 8px;
   color: var(--green);
}
.clubhouse-lead {
   font-size: 18px;
   line-height: 1.4;
   margin: 0 0 18px;
}
.clubhouse-round-card {
   background: #fff;
   border: 1px solid var(--line);
   border-radius: 10px;
   padding: 17px 14px;
}
.clubhouse-round-card h2 {
   margin: 0 0 6px;
   font: 800 20px Arial, sans-serif;
}
.clubhouse-round-card > p {
   margin: 5px 0 12px;
}
.clubhouse-metrics {
   display: grid;
   grid-template-columns: repeat(3, minmax(0,1fr));
   gap: 5px;
   text-align: center;
}
.clubhouse-metrics > div {
   border-left: 1px solid #ddd;
}
.clubhouse-metrics > div:first-child {
   border-left: 0;
}
.clubhouse-metrics strong {
   display: block;
   font-size: 28px;
   color: #222;
}
.clubhouse-metrics span {
   display: block;
   font-size: 11px;
   font-weight: 800;
}
.clubhouse-note, .clubhouse-next-note {
   font-size: 13px;
   line-height: 1.4;
   color: #666;
}
.clubhouse-check-heading {
   margin: 22px 0 10px;
   font: 800 18px Arial, sans-serif;
}
.clubhouse-review-item {
   background: #fff;
   border-left: 4px solid var(--green);
   padding: 11px 12px;
   margin: 0 0 8px;
   font-size: 15px;
}
.clubhouse-return {
   width: 100%;
   margin-top: 12px;
   border: 0;
   border-radius: 10px;
   background: var(--green);
   color: #fff;
   padding: 15px;
   font-size: 18px;
   font-weight: 800;
   cursor: pointer;
}
.clubhouse-return[hidden] {
   display: none;
}

/* CLUBHOUSE HEADER — shared PWA screen, Clubhouse-only presentation */
#homeDestinationScreen .destination-photo-header.is-clubhouse-header {
  position: relative;
  z-index: 1;
  box-sizing: border-box;
  height: 250px;
  min-height: 250px;
  padding: 0;
  display: block;
  background-image: linear-gradient(180deg, rgba(0,0,0,.43), rgba(0,0,0,.03) 60%, rgba(0,0,0,.4)), url("../images/Clubhouse-trophys.png");
  background-size: cover;
  background-position: center 48%;
  background-repeat: no-repeat;
  border-bottom: 3px solid #fff;
}
#homeDestinationScreen .is-clubhouse-header .setup-heading {
  position: absolute;
  top: 14px;
  left: 18px;
  right: 12px;
  padding: 0;
}
#homeDestinationScreen .clubhouse-header-brand { display: none; }
#homeDestinationScreen .is-clubhouse-header .clubhouse-header-brand { display: block; }
#homeDestinationScreen .clubhouse-header-brand img {
  display: block;
  width: min(429px, 100%);
  max-height: 150px;
  object-fit: contain;
  object-position: left top;
  filter: drop-shadow(0 4px 6px rgba(0,0,0,.8));
  transform: translateY(-30px);
}
#homeDestinationScreen .is-clubhouse-header .setup-kicker,
#homeDestinationScreen .is-clubhouse-header .setup-title { display: none; }
#homeDestinationScreen .is-clubhouse-header .setup-back {
  position: absolute;
  left: 20px;
  bottom: 16px;
  top: auto;
  z-index: 2;
  background: rgba(255,255,255,.20);
}
.app:has(#homeDestinationScreen:not([hidden]) .is-clubhouse-header) > .global-menu-button {
  top: 184px;
  background: rgba(255,255,255,.20);
}
#homeDestinationScreen .destination-photo-header.is-clubhouse-header + .destination-content {
  padding-top: 24px;
}
#homeDestinationScreen .clubhouse-main-heading {
  color: var(--green);
  font: 900 28px/1.1 Arial,sans-serif;
  margin: 0 0 4px;
}

/* ACCELERATING RIGHT-TO-LEFT CHARACTER ARRIVAL — letters slide from right.
   Start delay and total cascade remain in clubhouse.js. */
#homeDestinationScreen .clubhouse-lead {
  font-weight: 800;
  animation: none;
}
#homeDestinationScreen .clubhouse-lead .clubhouse-letter {
  display: inline-block;
  opacity: 0;
  transform: translate3d(75px, 0, 0);
  animation: clubhouse-letter-arrive 620ms cubic-bezier(.18,.75,.25,1) both;
  animation-delay: var(--clubhouse-letter-delay, 0ms);
}
#homeDestinationScreen .clubhouse-lead .clubhouse-space {
  white-space: pre;
}
@keyframes clubhouse-letter-arrive {
  from { opacity: 0; transform: translate3d(75px, 0, 0); }
  to   { opacity: 1; transform: translate3d(0, 0, 0); }
}
@media (prefers-reduced-motion: reduce) {
  #homeDestinationScreen .clubhouse-lead .clubhouse-letter {
    animation: none;
    opacity: 1;
    transform: none;
  }
}

/* Clubhouse: the photo stops with its tagline visible, and both controls remain reachable. */
#homeDestinationScreen .destination-photo-header.is-clubhouse-header {
  position: sticky;
  top: -185px;
  z-index: 35;
}
#homeDestinationScreen .is-clubhouse-header .setup-back { z-index: 40; }
.app:has(#homeDestinationScreen:not([hidden]) .is-clubhouse-header) > .global-menu-button {
  top: clamp(8px, calc(184px - var(--clubhouse-scroll, 0px)), 184px);
  z-index: 1100;
}
/* Stroke counts and metric labels remain neutral; only TO PAR value is colored. */
#homeDestinationScreen .clubhouse-metrics strong { color: #303030; }
#homeDestinationScreen .clubhouse-metrics span { color: #303030; }
#homeDestinationScreen .clubhouse-metrics .clubhouse-par-over strong { color: var(--score-over); }
#homeDestinationScreen .clubhouse-metrics .clubhouse-par-even strong { color: var(--score-even); }
#homeDestinationScreen .clubhouse-metrics .clubhouse-par-under strong { color: var(--score-under); }


/* CHRC design iteration — scoped to Round Check; existing Clubhouse header unchanged. */
#homeDestinationScreen .clubhouse-check-heading { font: 900 26px/1.2 Arial,sans-serif; margin: 26px 0 16px; color: #202b23; }
#homeDestinationScreen .chrc-summary, #homeDestinationScreen .chrc-performance { margin: 0 0 24px; }
#homeDestinationScreen .chrc-section-title { font: 900 20px/1.25 Arial,sans-serif; letter-spacing: .01em; margin: 0 0 13px; }
#homeDestinationScreen .chrc-section-title--review { font-size: 23px; border-left: 6px solid #c53d35; padding-left: 12px; }
#homeDestinationScreen .chrc-status { background: #fff; border: 1px solid #e3e6e3; border-left: 6px solid #aab0ad; border-radius: 10px; padding: 14px 15px; margin: 0 0 10px; display: grid; gap: 5px; }
#homeDestinationScreen .chrc-status--complete { border-left-color: #00a249; }
#homeDestinationScreen .chrc-status--attention { border-left-color: #c53d35; }
#homeDestinationScreen .chrc-status-title { font: 800 18px/1.25 Arial,sans-serif; }
#homeDestinationScreen .chrc-status-detail { font: 16px/1.4 Arial,sans-serif; color: #505750; }
#homeDestinationScreen .chrc-intro { font: 17px/1.45 Arial,sans-serif; margin: 0 0 15px; color: #3c453e; }
#homeDestinationScreen .chrc-card-track { display: flex; gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain; scrollbar-width: thin; padding: 3px 1px 12px; -webkit-overflow-scrolling: touch; }
#homeDestinationScreen .chrc-hole-card { box-sizing: border-box; flex: 0 0 100%; min-width: 0; scroll-snap-align: start; background: #fff; border: 1px solid #dfe3df; border-top: 6px solid #c53d35; border-radius: 14px; padding: 20px 18px 16px; box-shadow: 0 3px 12px rgba(0,0,0,.06); }
#homeDestinationScreen .chrc-card-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
#homeDestinationScreen .chrc-card-count { font: 800 13px Arial,sans-serif; color: #626a63; }
#homeDestinationScreen .chrc-card-status { font: 800 12px Arial,sans-serif; color: #a52c25; background: #fff0ee; padding: 7px 9px; border-radius: 6px; }
#homeDestinationScreen .chrc-hole-title { font: 900 30px/1.15 Arial,sans-serif; margin: 14px 0; }
#homeDestinationScreen .chrc-card-metrics { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 7px; }
#homeDestinationScreen .chrc-card-metric { background: #f2f4f2; border-radius: 9px; padding: 12px 6px; text-align: center; display: grid; gap: 4px; }
#homeDestinationScreen .chrc-card-metric span { font: 800 12px Arial,sans-serif; color: #505050; }
#homeDestinationScreen .chrc-card-metric strong { font: 900 25px Arial,sans-serif; color: var(--charcoal); }
#homeDestinationScreen .chrc-card-prompt { font: 800 19px/1.3 Arial,sans-serif; margin: 20px 0 12px; }
#homeDestinationScreen .chrc-issues { margin: 0; padding: 0; list-style: none; display: grid; gap: 9px; }
#homeDestinationScreen .chrc-issues li { font: 700 17px/1.4 Arial,sans-serif; border-left: 4px solid #c53d35; background: #fff7f6; border-radius: 5px; padding: 11px 12px; }
#homeDestinationScreen .chrc-card-footnote { font: 15px/1.45 Arial,sans-serif; color: #555d55; margin: 16px 0 0; }
#homeDestinationScreen .chrc-navigation { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 8px 0 4px; }
#homeDestinationScreen .chrc-nav-button { border: 1px solid #b9c2b9; border-radius: 9px; background: #fff; padding: 12px 10px; color: #22372a; font: 800 14px Arial,sans-serif; cursor: pointer; min-height: 44px; }
#homeDestinationScreen .chrc-nav-button:disabled { opacity: .35; cursor: default; }
#homeDestinationScreen .chrc-nav-position { font: 800 14px Arial,sans-serif; white-space: nowrap; }
#homeDestinationScreen .chrc-swipe-hint { text-align: center; font: 15px/1.4 Arial,sans-serif; color: #626a63; margin: 8px 0 0; }
@media (prefers-reduced-motion: reduce) { #homeDestinationScreen .chrc-card-track { scroll-behavior: auto; } }

/* CHRC refinement: approximately 10% smaller text and internal spacing.
   Scoped to Round Check; do not change course summary, Clubhouse header, or app navigation. */
#homeDestinationScreen .clubhouse-check-heading { font-size: 23.4px; margin: 23px 0 14px; }
#homeDestinationScreen .chrc-summary, #homeDestinationScreen .chrc-performance { margin-bottom: 22px; }
#homeDestinationScreen .chrc-section-title { font-size: 18px; margin-bottom: 12px; }
#homeDestinationScreen .chrc-section-title--review { font-size: 20.7px; border-left-width: 5px; padding-left: 11px; }
#homeDestinationScreen .chrc-status { padding: 13px 14px; margin-bottom: 9px; gap: 4px; }
#homeDestinationScreen .chrc-status-title { font-size: 16.2px; }
#homeDestinationScreen .chrc-status-detail { font-size: 14.4px; }
#homeDestinationScreen .chrc-intro { font-size: 15.3px; margin-bottom: 14px; }
#homeDestinationScreen .chrc-hole-card { padding: 18px 16px 15px; border-top-width: 5px; }
#homeDestinationScreen .chrc-card-count { font-size: 12px; }
#homeDestinationScreen .chrc-card-status { font-size: 11px; padding: 6px 8px; }
#homeDestinationScreen .chrc-hole-title { font-size: 27px; margin: 13px 0; }
#homeDestinationScreen .chrc-card-metric { padding: 11px 5px; }
#homeDestinationScreen .chrc-card-metric span { font-size: 11px; }
#homeDestinationScreen .chrc-card-metric strong { font-size: 22.5px; }
#homeDestinationScreen .chrc-card-prompt { font-size: 17.1px; margin: 18px 0 11px; }
#homeDestinationScreen .chrc-issues { gap: 8px; }
#homeDestinationScreen .chrc-issues li { font-size: 15.3px; padding: 10px 11px; }
#homeDestinationScreen .chrc-card-footnote { font-size: 13.5px; margin-top: 14px; }
#homeDestinationScreen .chrc-nav-position { font-size: 13px; }
#homeDestinationScreen .chrc-swipe-hint { font-size: 13.5px; }

/* CLUBHOUSE TALL STICKY HEADER — fixed height from initial render.
   Overrides earlier scrolling/collapsing Clubhouse rules only. */
#homeDestinationScreen .destination-photo-header.is-clubhouse-header {
  position: sticky !important;
  top: 0 !important;
  height: 180px !important;
  min-height: 180px !important;
  max-height: 180px !important;
  z-index: 100 !important;
  padding: 0 !important;
  overflow: visible;
  background-position: center 48%;
}
#homeDestinationScreen .is-clubhouse-header .setup-heading {
  position: absolute;
  top: 12px;
  left: 20px;
  right: 20px;
  margin: 0;
  padding: 0;
  width: auto;
}
#homeDestinationScreen .is-clubhouse-header .clubhouse-header-brand img {
  width: min(300px, calc(100vw - 40px));
  max-height: 105px;
  height: auto;
  object-fit: contain;
  object-position: left top;
  transform: none;
}
#homeDestinationScreen .is-clubhouse-header .header-nav-layer > .setup-back,
#homeDestinationScreen .is-clubhouse-header .header-nav-layer > .global-menu-button {
  top: auto !important;
  bottom: 12px !important;
  width: 44px !important;
  height: 44px !important;
  background: rgba(255,255,255,.20);
}
#homeDestinationScreen .is-clubhouse-header .header-nav-layer > .setup-back { left: 20px !important; }
#homeDestinationScreen .is-clubhouse-header .header-nav-layer > .global-menu-button { right: 20px !important; }

/* CLUBHOUSE BRAND REFINEMENT — enlarged artwork, clear navigation controls. */
#homeDestinationScreen .is-clubhouse-header .setup-heading {
  top: -18px !important;
  left: 20px !important;
  right: 20px !important;
}
#homeDestinationScreen .is-clubhouse-header .clubhouse-header-brand img {
  width: min(420px, calc(100vw - 40px)) !important;
  max-height: 140px !important;
  height: auto !important;
  object-fit: contain;
  object-position: left top;
  transform: none !important;
}
#homeDestinationScreen .is-clubhouse-header .setup-back,
#homeDestinationScreen .is-clubhouse-header .header-nav-layer > .setup-back,
#homeDestinationScreen .is-clubhouse-header .header-nav-layer > .global-menu-button,
.app:has(#homeDestinationScreen:not([hidden]) .is-clubhouse-header) > .global-menu-button {
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: none !important;
}

/* Prevent horizontal movement during Clubhouse welcome animation */
#homeDestinationScreen .clubhouse-lead {
  overflow-x: clip;
}