
  * { box-sizing: border-box; margin: 0; padding: 0; }
  :root {
    /* Deep premium green - private members club */
    --bg: #0e1913;
    --bg-2: #112018;
    --panel: #15281e;
    --panel-2: #193125;
    --border: #213a2d;
    --border-subtle: #14241c;
    --text: #f0f4f1;
    --text-2: #cfd8d3;
    --muted: #7a8c84;
    --muted-2: #525f59;

    /* Restrained green - core UI structure */
    --accent: #5a9276;
    --accent-bright: #7eb59a;
    --accent-2: #3e7558;
    --accent-dim: #15281e;
    --accent-glow: rgba(90, 146, 118, 0.12);

    /* Gold - prestige, trophies, achievements */
    --gold: #c9a961;
    --gold-bright: #e1c47e;
    --gold-dim: #7a6740;

    /* Deep red - tension, pressure, losing streaks */
    --tension: #a64545;
    --tension-bright: #c45a5a;
    --tension-dim: #3d1818;

    /* Soft blue - historical, legacy */
    --legacy: #6c8aa6;
    --legacy-dim: #3a4e62;

    --warn: #b88847;
    --danger: #a64545;
    --info: #6c8aa6;

    --shadow-sm: 0 1px 2px rgba(0,0,0,0.3);
    --shadow: 0 4px 20px rgba(0,0,0,0.35);
    --shadow-lg: 0 12px 50px rgba(0,0,0,0.5);
    --radius: 10px;
    --radius-lg: 14px;
  }
  html, body {
    background:
      radial-gradient(ellipse 80% 60% at 20% 0%, rgba(109, 168, 136, 0.04), transparent 50%),
      radial-gradient(ellipse 60% 50% at 80% 100%, rgba(201, 169, 97, 0.025), transparent 50%),
      var(--bg);
    color: var(--text);
    font-family: Georgia, 'Times New Roman', serif;
    font-size: 14px;
    font-feature-settings: "cv11", "ss01", "ss03";
    min-height: 100vh;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
  }
  .app { max-width: 1180px; margin: 0 auto; padding: 18px 18px 80px; }
  .app { position: relative; }
  header {
    display: flex; align-items: flex-start; justify-content: space-between;
    padding: 8px 0 28px; border-bottom: 1px solid var(--border-subtle); margin-bottom: 36px;
  }
  header .brand { display: flex; align-items: center; gap: 22px; }
  header .brand .monogram {
    width: 92px; height: 92px;
    display: flex; align-items: center; justify-content: center;
    filter: drop-shadow(0 2px 8px rgba(201,169,97,0.15));
  }
  header .brand .monogram svg { width: 100%; height: 100%; }
  header .brand-text h1 {
    font-size: 22px; letter-spacing: -0.005em; font-family: Georgia, "Times New Roman", serif; background: linear-gradient(180deg,#f0d488,#c9a961 60%,#8a7340); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; font-weight: 700; letter-spacing: 0.18em;
    color: var(--text); line-height: 1; font-feature-settings: "ss01";
  }
  header .brand-text .tagline {
    font-size: 10px; color: var(--muted); letter-spacing: 0.28em;
    text-transform: uppercase; margin-top: 6px; font-weight: 500;
  }
  header .brand-text .brand-sub {
    font-size: 11px; color: var(--gold-dim); letter-spacing: 0.12em;
    margin-top: 6px; text-transform: uppercase; font-weight: 500;
    min-height: 11px;
  }
  @media (max-width: 700px) {
    .app { padding: 18px 18px 60px; }
    header .brand { gap: 14px; }
    header .brand .monogram { width: 44px; height: 44px; }
    header .brand-text h1 { font-size: 18px; letter-spacing: 0.14em; }
    header .brand-text .tagline { font-size: 9px; letter-spacing: 0.2em; }
    header .brand-text .brand-sub { display: none; }
  }
  header .header-right { display: flex; align-items: center; gap: 12px; }
  .profile-chip {
    display: flex; align-items: center; gap: 8px;
    padding: 6px 12px 6px 6px; background: var(--panel); border: 1px solid var(--border);
    border-radius: 999px; cursor: pointer; transition: all 0.15s;
  }
  .profile-chip:hover { border-color: var(--accent); }
  .profile-avatar {
    width: 28px; height: 28px; border-radius: 50%;
    background: linear-gradient(135deg, var(--accent), var(--accent-2));
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 14px; color: #07140d;
  }
  .profile-name { font-size: 13px; font-weight: 500; }
  .lang-picker {
    background: var(--panel); color: var(--text); border: 1px solid var(--border);
    padding: 6px 10px; border-radius: 999px; font-size: 12px;
    cursor: pointer; max-width: 90px;
  }
  .lang-picker:hover { border-color: var(--accent); }
  @media (max-width: 700px) {
    header { flex-wrap: wrap; gap: 12px; }
    .hcp-display { display: none; }
  }
  .dropdown-menu {
    position: absolute; top: 70px; right: 20px; z-index: 50;
    background: var(--panel); border: 1px solid var(--border);
    border-radius: 12px; padding: 8px; min-width: 240px;
    box-shadow: 0 8px 30px rgba(0,0,0,0.4);
    display: none;
  }
  .dropdown-menu.open { display: block; }
  .dropdown-menu .item-row {
    padding: 8px 12px; border-radius: 8px; cursor: pointer; display: flex; align-items: center; gap: 10px;
    font-size: 13px;
  }
  .dropdown-menu .item-row:hover { background: var(--panel-2); }
  .dropdown-menu .item-row.active { color: var(--accent); }
  .dropdown-menu hr { border: none; border-top: 1px solid var(--border); margin: 6px 0; }

  /* Tab container with edge-fade affordance so users can see more tabs scroll horizontally */
  .tabs-wrap {
    position: relative; margin-bottom: 22px;
  }
  .tabs-wrap::before, .tabs-wrap::after {
    content: ""; position: absolute; top: 0; bottom: 1px; width: 28px;
    pointer-events: none; z-index: 2; transition: opacity 0.2s;
  }
  .tabs-wrap::before {
    left: 0;
    background: linear-gradient(90deg, var(--bg) 0%, transparent 100%);
    opacity: 0;
  }
  .tabs-wrap::after {
    right: 0;
    background: linear-gradient(270deg, var(--bg) 0%, transparent 100%);
  }
  .tabs-wrap.scrolled-left::before { opacity: 1; }
  .tabs-wrap.scrolled-right::after { opacity: 0; }
  nav.tabs {
    display: flex; gap: 2px; border-bottom: 1px solid var(--border);
    flex-wrap: wrap; overflow-x: visible; scrollbar-width: thin; -webkit-overflow-scrolling: touch;
  }
  nav.tabs::-webkit-scrollbar { height: 4px; }
  nav.tabs::-webkit-scrollbar-thumb { background: var(--border); border-radius: 2px; }
  nav.tabs button {
    background: transparent; border: none; color: var(--muted);
    padding: 10px 13px; font-size: 13px; cursor: pointer; font-weight: 800;
    border-bottom: 2px solid transparent; transition: color 0.15s, border-color 0.15s;
    white-space: nowrap; flex-shrink: 0; letter-spacing: 0.06em;
  }
  nav.tabs button:hover { color: var(--text); }
  nav.tabs button.active { color: var(--accent-bright); border-bottom-color: var(--accent); }

  .panel {
    background: linear-gradient(180deg, var(--panel) 0%, var(--bg-2) 100%);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg); padding: 22px;
    margin-bottom: 18px;
    box-shadow: var(--shadow-sm);
  }
  .panel.glass {
    background: linear-gradient(180deg, rgba(18, 32, 26, 0.85) 0%, rgba(13, 24, 19, 0.85) 100%);
    backdrop-filter: blur(8px);
  }
  .panel h2 {
    font-size: 15px; font-weight: 600; margin-bottom: 16px; color: var(--text);
    letter-spacing: -0.01em;
  }
  .panel h3 {
    font-size: 11px; font-weight: 600; margin-bottom: 10px; color: var(--muted);
    text-transform: uppercase; letter-spacing: 0.08em;
  }

  .grid { display: grid; gap: 14px; }
  .grid-4 { grid-template-columns: repeat(4, 1fr); }
  .grid-3 { grid-template-columns: repeat(3, 1fr); }
  .grid-2 { grid-template-columns: 1fr 1fr; }
  @media (max-width: 900px) {
    .grid-4 { grid-template-columns: repeat(2, 1fr); }
    .grid-3 { grid-template-columns: 1fr; }
    .grid-2 { grid-template-columns: 1fr; }
  }

  .kpi {
    background: linear-gradient(180deg, var(--panel) 0%, var(--bg-2) 100%);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg); padding: 18px;
    box-shadow: var(--shadow-sm);
    transition: border-color 0.15s, transform 0.15s;
  }
  .kpi:hover { border-color: var(--accent-2); }
  .kpi .label {
    font-size: 10px; color: var(--muted-2); text-transform: uppercase;
    letter-spacing: 0.1em; margin-bottom: 8px; font-weight: 500;
  }
  .kpi .value {
    font-size: 30px; font-weight: 600; letter-spacing: -0.025em;
    font-variant-numeric: tabular-nums;
  }
  .kpi .sub { font-size: 12px; color: var(--muted); margin-top: 4px; font-weight: 400; }
  .kpi.accent .value { color: var(--accent-bright); }
  .kpi.premium {
    border-color: var(--gold-dim);
    background: linear-gradient(180deg, rgba(201, 169, 97, 0.05) 0%, var(--bg-2) 100%);
  }
  .kpi.premium .value { color: var(--gold); }

  table { width: 100%; border-collapse: collapse; font-size: 13px; }
  table th, table td {
    padding: 11px 14px; text-align: left;
    border-bottom: 1px solid var(--border-subtle);
  }
  table th {
    font-size: 10px; text-transform: uppercase; letter-spacing: 0.08em;
    color: var(--muted-2); font-weight: 500;
  }
  table tr:last-child td { border-bottom: none; }
  table tr { transition: background 0.1s; }
  table tr:hover td { background: var(--panel-2); }
  table td.num, table th.num { text-align: right; font-variant-numeric: tabular-nums; }
  table td strong { font-weight: 500; color: var(--text); }
  .table-wrap { overflow-x: auto; border-radius: 10px; }

  button.btn, .btn {
    background: var(--accent); color: #08160e;
    border: none; padding: 9px 18px; border-radius: 9px;
    font-size: 13px; font-weight: 600; cursor: pointer;
    transition: background 0.15s, transform 0.1s;
    letter-spacing: -0.005em;
    box-shadow: 0 1px 2px rgba(0,0,0,0.15);
  }
  button.btn:hover, .btn:hover { background: var(--accent-bright); }
  button.btn:active, .btn:active { transform: translateY(1px); }
  button.btn-ghost, .btn-ghost {
    background: transparent; color: var(--text); border: 1px solid var(--border);
    box-shadow: none;
  }
  button.btn-ghost:hover, .btn-ghost:hover {
    background: var(--panel-2); border-color: var(--accent-2);
    color: var(--accent-bright);
  }
  button.btn-gold, .btn-gold { background: var(--gold); color: #1a1408; }
  button.btn-gold:hover, .btn-gold:hover { background: #d8b975; }
  button.btn-danger, .btn-danger { background: var(--danger); color: white; }
  button.btn-small { padding: 5px 12px; font-size: 12px; }
  button.icon-btn {
    background: transparent; border: none; color: var(--muted); cursor: pointer;
    padding: 6px; font-size: 14px; border-radius: 6px;
    transition: color 0.15s, background 0.15s;
  }
  button.icon-btn:hover { color: var(--accent-bright); background: var(--panel-2); }

  input, select, textarea {
    background: var(--bg-2); color: var(--text); border: 1px solid var(--border);
    border-radius: 9px; padding: 10px 13px; font-size: 13px; width: 100%;
    font-family: inherit; transition: border-color 0.15s, background 0.15s;
  }
  input:hover, select:hover, textarea:hover { border-color: var(--border); background: var(--panel); }
  input:focus, select:focus, textarea:focus {
    outline: none; border-color: var(--accent);
    background: var(--panel);
    box-shadow: 0 0 0 3px var(--accent-glow);
  }
  textarea { resize: vertical; min-height: 60px; }
  label.field { display: flex; flex-direction: column; gap: 6px; }
  label.field span {
    font-size: 11px; color: var(--muted); font-weight: 500;
    letter-spacing: 0.02em;
  }
  .form-row { display: grid; gap: 12px; }
  .form-row.cols-2 { grid-template-columns: 1fr 1fr; }
  .form-row.cols-3 { grid-template-columns: 1fr 1fr 1fr; }
  .form-row.cols-4 { grid-template-columns: 1fr 1fr 1fr 1fr; }
  /* Mid breakpoint: tablet / large phone landscape — 2 columns */
  @media (max-width: 760px) {
    .form-row.cols-3 { grid-template-columns: 1fr 1fr; }
    .form-row.cols-4 { grid-template-columns: 1fr 1fr; }
  }
  /* Small phone — single column */
  @media (max-width: 480px) {
    .form-row.cols-2, .form-row.cols-3, .form-row.cols-4 { grid-template-columns: 1fr; }
  }

  .radio-group { display: flex; gap: 8px; flex-wrap: wrap; }
  .radio-group label {
    flex: 1; min-width: 110px; padding: 10px 12px;
    background: var(--bg); border: 1px solid var(--border); border-radius: 8px;
    cursor: pointer; text-align: center; font-size: 13px;
    transition: all 0.15s;
  }
  .radio-group label.selected {
    border-color: var(--accent); background: rgba(74,222,128,0.08); color: var(--accent);
  }
  .radio-group input { display: none; }

  .friend-chip {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 5px 12px; background: var(--panel-2); border: 1px solid var(--border);
    border-radius: 999px; font-size: 12px; cursor: pointer;
    transition: all 0.15s;
  }
  .friend-chip.selected { border-color: var(--accent); background: rgba(74,222,128,0.1); color: var(--accent); }
  .friend-chip:hover { border-color: var(--accent); }

  .modal-bg {
    position: fixed; inset: 0; background: rgba(0,0,0,0.6); backdrop-filter: blur(4px);
    display: none; align-items: center; justify-content: center; z-index: 100; padding: 20px;
  }
  .modal-bg.open { display: flex; }
  .modal {
    background: var(--panel); border: 1px solid var(--border);
    border-radius: 14px; padding: 22px; max-width: 700px; width: 100%;
    max-height: 90vh; overflow-y: auto;
  }
  .modal h2 { margin-bottom: 14px; }
  .modal .actions { display: flex; gap: 8px; justify-content: flex-end; margin-top: 18px; }

  .badge {
    display: inline-block; padding: 2px 8px; border-radius: 999px;
    font-size: 11px; font-weight: 500;
  }
  .badge.tee-white { background: #e5e7eb; color: #1f2937; }
  .badge.tee-yellow { background: #fde047; color: #422006; }
  .badge.tee-red { background: #f87171; color: #450a0a; }
  .badge.tee-blue { background: #60a5fa; color: #0c1d36; }
  .badge.tee-gold { background: #facc15; color: #422006; }
  .badge.tee-black { background: #1f2937; color: #f3f4f6; border: 1px solid #4b5563; }
  .badge.tee-green { background: #4ade80; color: #052e16; }

  .holes-grid { display: grid; grid-template-columns: repeat(9, 1fr); gap: 6px; margin-bottom: 12px; }
  .hole-input { display: flex; flex-direction: column; gap: 4px; }
  .hole-input .hole-num { font-size: 10px; color: var(--muted); text-align: center; }
  .hole-input .par-tag { font-size: 9px; color: var(--accent); text-align: center; }
  .hole-input input { padding: 6px; text-align: center; font-size: 13px; }
  @media (max-width: 700px) {
    .holes-grid { grid-template-columns: repeat(3, 1fr); }
  }

  .toast {
    position: fixed; bottom: 20px; right: 20px;
    background: var(--accent); color: #07140d;
    padding: 12px 18px; border-radius: 10px; font-weight: 500;
    box-shadow: 0 6px 20px rgba(0,0,0,0.3);
    transform: translateY(100px); opacity: 0;
    transition: all 0.3s; z-index: 200;
  }
  .toast.show { transform: translateY(0); opacity: 1; }
  .toast.error { background: var(--danger); color: white; }

  .empty {
    text-align: center; padding: 40px 20px; color: var(--muted);
    background: var(--panel); border: 1px dashed var(--border); border-radius: 12px;
  }
  .empty .icon { font-size: 36px; margin-bottom: 8px; }

  .filter-bar { display: flex; gap: 10px; margin-bottom: 14px; flex-wrap: wrap; }
  .filter-bar input, .filter-bar select { max-width: 280px; }

  .scroll-300 { max-height: 360px; overflow-y: auto; }

  .small-link { color: var(--info); cursor: pointer; font-size: 12px; }
  .small-link:hover { text-decoration: underline; }

  .stat-row { display: flex; justify-content: space-between; padding: 6px 0; border-bottom: 1px solid var(--border); font-size: 13px; }
  .stat-row:last-child { border-bottom: none; }
  .stat-row .label { color: var(--muted); }
  .stat-row .value { font-weight: 500; font-variant-numeric: tabular-nums; }

  .pill-row { display: flex; gap: 6px; flex-wrap: wrap; }
  .pill {
    padding: 3px 9px; background: var(--panel-2); border: 1px solid var(--border);
    border-radius: 999px; font-size: 11px; color: var(--muted);
  }

  .chart-wrap { position: relative; height: 280px; }

  .tee-row { display: grid; grid-template-columns: 1fr 60px 80px 80px 80px auto; gap: 8px; align-items: center; margin-bottom: 6px; }
  @media (max-width: 700px) { .tee-row { grid-template-columns: 1fr 1fr; } }

  .rating-row { display: flex; gap: 4px; }
  .rating-btn {
    flex: 1; padding: 8px 0; border: 1px solid var(--border); background: var(--bg);
    color: var(--text); border-radius: 8px; cursor: pointer; font-size: 13px; font-weight: 500;
    transition: all 0.15s;
  }
  .rating-btn:hover { border-color: var(--accent); }
  .rating-btn.selected { background: var(--accent); color: #07140d; border-color: var(--accent); }

  .achievement-card {
    background: var(--bg-2); border: 1px solid var(--border-subtle); border-radius: 10px;
    padding: 22px 18px; text-align: center; transition: border-color 0.3s ease;
  }
  .achievement-card.earned {
    border-color: var(--gold-dim);
    background: linear-gradient(180deg, rgba(201,169,97,0.04) 0%, var(--bg-2) 100%);
  }
  .achievement-card.locked { opacity: 0.38; }
  .achievement-card .ach-mark {
    font-size: 18px; margin-bottom: 12px; line-height: 1;
    color: var(--gold);
  }
  .achievement-card.locked .ach-mark { color: var(--muted-2); }
  .achievement-card .title {
    font-size: 13px; font-weight: 600; margin-bottom: 6px; letter-spacing: 0.02em;
    color: var(--text);
  }
  .achievement-card .desc {
    font-size: 11px; color: var(--muted); line-height: 1.5;
    letter-spacing: 0.01em;
  }
  .achievement-card .date {
    font-size: 9px; color: var(--gold); margin-top: 10px;
    text-transform: uppercase; letter-spacing: 0.15em; font-weight: 500;
  }

  .insight-card {
    background: var(--panel-2); border: 1px solid var(--border); border-radius: 10px;
    padding: 14px; display: flex; gap: 12px; align-items: flex-start; margin-bottom: 8px;
  }
  .insight-card .ic-icon { font-size: 22px; }
  .insight-card .ic-text { flex: 1; }
  .insight-card .ic-title { font-weight: 600; margin-bottom: 4px; }
  .insight-card .ic-body { color: var(--muted); font-size: 13px; }

  .bar-row {
    display: grid; grid-template-columns: 80px 1fr 60px; align-items: center;
    gap: 10px; margin-bottom: 8px; font-size: 13px;
  }
  .bar-row .bar-bg {
    height: 22px; background: var(--bg); border-radius: 6px; overflow: hidden; position: relative;
  }
  .bar-row .bar-fill {
    height: 100%; background: linear-gradient(90deg, var(--accent-dim), var(--accent));
    transition: width 0.4s;
  }
  .bar-row .bar-val { text-align: right; font-variant-numeric: tabular-nums; color: var(--muted); }

  .toast-large {
    position: fixed; top: 24px; left: 50%; transform: translateX(-50%) translateY(-100px);
    background: linear-gradient(135deg, var(--accent), var(--accent-2));
    color: #07140d; padding: 14px 22px; border-radius: 14px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.4); font-weight: 600; font-size: 14px;
    opacity: 0; transition: all 0.4s; z-index: 250;
    display: flex; align-items: center; gap: 10px;
  }
  .toast-large.show { transform: translateX(-50%) translateY(0); opacity: 1; }

  /* ============================================
     CINEMATIC HERO - the fight card
     ============================================ */
  .hero-fight-card {
    position: relative;
    padding: 60px 40px 48px;
    background:
      radial-gradient(ellipse 80% 60% at 50% 0%, rgba(201,169,97,0.05), transparent 60%),
      linear-gradient(180deg, var(--panel) 0%, var(--bg-2) 100%);
    border: 1px solid var(--border);
    border-radius: 18px;
    overflow: hidden;
    cursor: pointer;
    transition: border-color 0.4s ease;
    box-shadow: var(--shadow-lg);
  }
  .hero-fight-card::before {
    content: '';
    position: absolute; top: 0; left: 0; right: 0; height: 1px;
    background: linear-gradient(90deg, transparent, var(--gold), transparent);
    opacity: 0.3;
  }
  .hero-fight-card:hover { border-color: var(--gold-dim); }
  .hero-fight-card:hover::before { opacity: 0.6; }

  .hero-meta-top {
    text-align: center; margin-bottom: 36px;
    font-size: 10px; letter-spacing: 0.32em; color: var(--muted);
    text-transform: uppercase; font-weight: 500;
  }
  .hero-meta-top .hero-tag { color: var(--gold); }
  .hero-meta-top .hero-meta-dot { margin: 0 12px; color: var(--muted-2); }

  .hero-matchup {
    font-size: 56px; font-weight: 700; letter-spacing: 0.08em;
    text-align: center; color: var(--text-2); line-height: 1;
    margin-bottom: 28px; font-feature-settings: "ss01";
    display: flex; justify-content: center; align-items: center; gap: 24px; flex-wrap: wrap;
  }
  .hero-matchup span.leading { color: var(--text); }
  .hero-matchup .versus { color: var(--gold-dim); font-weight: 400; opacity: 0.7; }

  .hero-score {
    display: flex; justify-content: center; align-items: center; gap: 48px;
    margin: 0 auto 44px; padding: 24px 0;
    position: relative;
  }
  .hero-score::before, .hero-score::after {
    content: ''; position: absolute; left: 50%; top: 0;
    width: 1px; height: 100%; background: var(--border);
    transform: translateX(-50%);
  }
  .hero-score .score-num {
    font-size: 168px; font-weight: 700; letter-spacing: -0.06em;
    line-height: 0.85; font-variant-numeric: tabular-nums;
    color: var(--muted);
    transition: color 0.6s ease;
    min-width: 200px; text-align: center;
  }
  .hero-score .score-num.win { color: var(--text); text-shadow: 0 0 40px rgba(201,169,97,0.08); }
  .hero-score .score-num.loss { color: var(--muted-2); }
  .hero-score .score-num.tie { color: var(--gold-dim); }
  .hero-score .score-separator { width: 1px; }

  .hero-meta-bottom {
    display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px;
    padding: 28px 0 0; border-top: 1px solid var(--border-subtle);
    margin-top: 8px;
  }
  .hero-meta-item {
    display: flex; flex-direction: column; gap: 6px; text-align: center;
  }
  .hero-meta-item .meta-label {
    font-size: 9px; color: var(--muted-2); letter-spacing: 0.24em;
    text-transform: uppercase; font-weight: 500;
  }
  .hero-meta-item .meta-value {
    font-size: 14px; color: var(--text-2); font-weight: 500; letter-spacing: 0.02em;
  }

  .hero-cta {
    display: flex; align-items: center; gap: 14px; margin: 36px auto 0;
    padding: 16px 36px; background: transparent; border: 1px solid var(--gold-dim);
    color: var(--gold-bright); border-radius: 999px;
    font-size: 12px; font-weight: 600; letter-spacing: 0.2em; text-transform: uppercase;
    cursor: pointer; transition: all 0.3s ease;
    font-family: inherit;
  }
  .hero-cta:hover {
    background: rgba(201,169,97,0.08); border-color: var(--gold);
    color: var(--gold-bright); transform: translateY(-1px);
  }
  .hero-cta .arrow { transition: transform 0.3s ease; }
  .hero-cta:hover .arrow { transform: translateX(4px); }

  /* Empty state - editorial style */
  .hero-empty {
    padding: 80px 40px;
    text-align: center;
    background:
      radial-gradient(ellipse 70% 50% at 50% 30%, rgba(201,169,97,0.04), transparent 60%),
      linear-gradient(180deg, var(--panel) 0%, var(--bg-2) 100%);
    border: 1px solid var(--border);
    border-radius: 18px;
  }
  .hero-empty-label {
    font-size: 10px; color: var(--gold); letter-spacing: 0.32em;
    text-transform: uppercase; font-weight: 500; margin-bottom: 24px;
  }
  .hero-empty-title {
    font-size: 48px; font-weight: 600; letter-spacing: -0.02em;
    line-height: 1.1; color: var(--text); margin-bottom: 20px;
  }
  .hero-empty-body {
    color: var(--muted); font-size: 14px; line-height: 1.8;
    max-width: 420px; margin: 0 auto 36px;
  }

  /* ============================================
     IDENTITY HERO - Dashboard "about me"
     ============================================ */
  .identity-card {
    position: relative;
    padding: 56px 40px 44px;
    background:
      radial-gradient(ellipse 70% 50% at 50% 0%, rgba(90,146,118,0.06), transparent 60%),
      linear-gradient(180deg, var(--panel) 0%, var(--bg-2) 100%);
    border: 1px solid var(--border);
    border-radius: 18px;
    overflow: hidden;
    box-shadow: var(--shadow-lg);
  }
  .identity-card::before {
    content: '';
    position: absolute; top: 0; left: 0; right: 0; height: 1px;
    background: linear-gradient(90deg, transparent, var(--accent), transparent);
    opacity: 0.4;
  }
  .identity-meta-top {
    text-align: center; margin-bottom: 24px;
    font-size: 10px; letter-spacing: 0.32em; color: var(--gold);
    text-transform: uppercase; font-weight: 500;
  }
  .identity-name {
    font-size: 72px; font-weight: 700; letter-spacing: -0.025em;
    text-align: center; color: var(--text); line-height: 1;
    margin-bottom: 14px;
  }
  .identity-status {
    text-align: center; margin-bottom: 44px;
    font-size: 11px; letter-spacing: 0.28em; color: var(--muted);
    text-transform: uppercase; font-weight: 500;
  }
  .identity-stats {
    display: grid; grid-template-columns: repeat(4, 1fr); gap: 0;
    border-top: 1px solid var(--border-subtle);
    padding-top: 32px;
  }
  .identity-stat {
    text-align: center; padding: 0 16px;
    border-right: 1px solid var(--border-subtle);
  }
  .identity-stat:last-child { border-right: none; }
  .identity-stat .stat-num {
    font-size: 48px; font-weight: 600; color: var(--text);
    letter-spacing: -0.02em; font-variant-numeric: tabular-nums;
    line-height: 1; margin-bottom: 10px;
  }
  .identity-stat .stat-num.accent { color: var(--gold); }
  .identity-stat .stat-label {
    font-size: 9px; color: var(--muted-2); letter-spacing: 0.28em;
    text-transform: uppercase; font-weight: 500;
  }
  @media (max-width: 700px) {
    .identity-card { padding: 36px 20px 28px; }
    .identity-name { font-size: 40px; }
    .identity-status { margin-bottom: 28px; font-size: 10px; }
    .identity-stats { grid-template-columns: repeat(2, 1fr); gap: 24px 0; padding-top: 24px; }
    .identity-stat:nth-child(2n) { border-right: none; }
    .identity-stat .stat-num { font-size: 32px; }
  }

  /* Welcome state for brand new users */
  .identity-card.welcome { padding: 60px 40px 48px; }
  .welcome-tagline {
    text-align: center; margin-bottom: 44px;
    font-size: 16px; color: var(--muted); letter-spacing: 0.02em; font-style: italic;
    font-weight: 400;
  }
  .welcome-cta-row {
    display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 14px;
    margin-bottom: 40px;
  }
  .welcome-cta {
    background: var(--bg-2); border: 1px solid var(--border);
    border-radius: 14px; padding: 22px 20px;
    display: flex; gap: 14px; align-items: flex-start;
    cursor: pointer; transition: all 0.25s ease;
    text-align: left; color: var(--text);
    font-family: inherit;
  }
  .welcome-cta:hover {
    border-color: var(--accent-2); transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0,0,0,0.2);
  }
  .welcome-cta.primary { border-color: var(--accent-2); background: linear-gradient(180deg, rgba(90,146,118,0.08), var(--bg-2)); }
  .welcome-cta.primary:hover { border-color: var(--accent-bright); }
  .welcome-cta.gold { border-color: var(--gold-dim); background: linear-gradient(180deg, rgba(201,169,97,0.08), var(--bg-2)); }
  .welcome-cta.gold:hover { border-color: var(--gold); }
  .welcome-cta .cta-num {
    font-size: 11px; color: var(--muted-2); letter-spacing: 0.16em;
    text-transform: uppercase; font-weight: 600; flex-shrink: 0;
    margin-top: 4px; min-width: 22px;
  }
  .welcome-cta .cta-title {
    display: block; font-size: 15px; font-weight: 600;
    letter-spacing: -0.01em; color: var(--text); margin-bottom: 4px;
  }
  .welcome-cta .cta-sub {
    display: block; font-size: 12px; color: var(--muted); line-height: 1.5;
  }
  .welcome-cta.primary .cta-title { color: var(--accent-bright); }
  .welcome-cta.gold .cta-title { color: var(--gold); }

  .welcome-preview {
    display: flex; justify-content: center; gap: 24px;
    padding-top: 24px; border-top: 1px solid var(--border-subtle);
  }
  .welcome-preview .wp-item { text-align: center; }
  .welcome-preview .wp-num {
    font-size: 28px; font-weight: 700; letter-spacing: -0.02em;
    color: var(--text); font-variant-numeric: tabular-nums;
  }
  .welcome-preview .wp-label {
    font-size: 10px; color: var(--muted-2); letter-spacing: 0.2em;
    text-transform: uppercase; font-weight: 500; margin-top: 4px;
  }
  .welcome-preview .wp-divider {
    width: 1px; background: var(--border-subtle); flex-shrink: 0;
  }
  @media (max-width: 700px) {
    .identity-card.welcome { padding: 36px 20px 28px; }
    .welcome-cta-row { grid-template-columns: 1fr; gap: 10px; margin-bottom: 28px; }
    .welcome-cta { padding: 16px 18px; }
    .welcome-tagline { font-size: 14px; margin-bottom: 28px; }
    .welcome-preview { gap: 14px; }
    .welcome-preview .wp-num { font-size: 22px; }
  }

  /* Mini rivalry card on dashboard */
  .rivalry-mini {
    display: flex; align-items: center; justify-content: space-between;
    padding: 14px 16px; border: 1px solid var(--border-subtle);
    border-radius: 10px; margin-bottom: 8px; cursor: pointer;
    transition: border-color 0.2s ease;
  }
  .rivalry-mini:hover { border-color: var(--gold-dim); }
  .rivalry-mini .mini-meta { font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--muted-2); margin-bottom: 4px; }
  .rivalry-mini .mini-name { font-size: 14px; font-weight: 500; color: var(--text); }
  .rivalry-mini .mini-score {
    font-size: 22px; font-weight: 600; color: var(--text);
    letter-spacing: -0.01em; font-variant-numeric: tabular-nums;
  }
  .rivalry-mini .mini-score .lead { color: var(--gold); }
  .rivalry-mini .mini-score .lose { color: var(--muted); }
  .rivalry-mini .mini-score .sep { color: var(--muted-2); margin: 0 6px; font-weight: 400; }

  /* Secondary stats - quiet horizontal strip, not cards */
  .secondary-stats {
    display: grid; grid-template-columns: repeat(4, 1fr);
    border-top: 1px solid var(--border-subtle);
    border-bottom: 1px solid var(--border-subtle);
    padding: 24px 0; gap: 0;
  }
  .secondary-stats .stat-cell {
    text-align: center; padding: 0 16px;
    border-right: 1px solid var(--border-subtle);
  }
  .secondary-stats .stat-cell:last-child { border-right: none; }
  .secondary-stats .cell-label {
    font-size: 9px; color: var(--muted-2); letter-spacing: 0.28em;
    text-transform: uppercase; font-weight: 500; margin-bottom: 8px;
  }
  .secondary-stats .cell-value {
    font-size: 28px; font-weight: 600; color: var(--text);
    letter-spacing: -0.02em; font-variant-numeric: tabular-nums;
  }
  @media (max-width: 700px) {
    .secondary-stats { grid-template-columns: repeat(2, 1fr); gap: 12px 0; padding: 18px 0; }
    .secondary-stats .stat-cell:nth-child(2n) { border-right: none; }
    .secondary-stats .cell-value { font-size: 22px; }
  }

  /* Mobile - shrink everything */
  @media (max-width: 700px) {
    .hero-fight-card { padding: 36px 20px 32px; }
    .hero-matchup { font-size: 26px; gap: 12px; margin-bottom: 18px; }
    .hero-score { gap: 20px; padding: 16px 0; margin-bottom: 28px; }
    .hero-score .score-num { font-size: 88px; min-width: 100px; }
    .hero-meta-bottom { grid-template-columns: repeat(2, 1fr); gap: 16px; padding: 20px 0 0; }
    .hero-cta { padding: 13px 24px; font-size: 11px; }
    .hero-empty-title { font-size: 32px; }
    .hero-empty { padding: 50px 24px; }
  }

  /* Hole-by-hole table */
  .hole-grid-wrap { background: var(--bg-2); border: 1px solid var(--border); border-radius: 10px; padding: 10px; }
  .hole-grid-header {
    display: grid; grid-template-columns: 40px 1fr 1fr; gap: 8px;
    padding: 6px 0; font-size: 10px; color: var(--muted-2);
    text-transform: uppercase; letter-spacing: 0.08em; font-weight: 500;
  }
  .hole-grid-header span:not(:first-child) { text-align: center; }
  .hole-grid-cells { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 4px; }
  .hole-row {
    display: grid; grid-template-columns: 40px 1fr 1fr; gap: 8px;
    align-items: center; padding: 3px 0;
  }
  .hole-num { font-size: 12px; color: var(--muted); text-align: center; font-weight: 500; }
  .hole-input-small {
    padding: 5px 8px; text-align: center; font-size: 12px;
    background: var(--panel); width: 100%;
  }
  .hole-grid-totals {
    margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--border);
    text-align: right; font-size: 12px; color: var(--muted);
  }
  .hole-grid-totals strong { color: var(--accent-bright); }

  /* Detailed hole rows (par, SI, distance, name, notes) */
  .hole-grid-header-detailed {
    display: grid; grid-template-columns: 36px 60px 60px 80px 1fr 1.5fr;
    gap: 8px; padding: 6px 0;
    font-size: 10px; color: var(--muted-2);
    text-transform: uppercase; letter-spacing: 0.08em; font-weight: 500;
  }
  .hole-grid-header-detailed span:nth-child(-n+4) { text-align: center; }
  .hole-row-detailed {
    display: grid; grid-template-columns: 36px 60px 60px 80px 1fr 1.5fr;
    gap: 8px; align-items: center; padding: 3px 0;
    border-bottom: 1px solid var(--border-subtle);
  }
  .hole-row-detailed:last-child { border-bottom: none; }
  .hole-input-text {
    padding: 5px 9px; font-size: 12px; background: var(--panel); width: 100%;
  }
  @media (max-width: 900px) {
    .hole-grid-header-detailed { display: none; }
    .hole-row-detailed {
      grid-template-columns: 32px 1fr 1fr 1fr; grid-template-rows: auto auto;
      grid-template-areas: "num par si dist" "name name notes notes";
      padding: 8px 0; gap: 6px;
    }
    .hole-row-detailed .hole-num { grid-area: num; }
    .hole-row-detailed input[data-f=par] { grid-area: par; }
    .hole-row-detailed input[data-f=si] { grid-area: si; }
    .hole-row-detailed input[data-f=distance] { grid-area: dist; }
    .hole-row-detailed input[data-f=name] { grid-area: name; }
    .hole-row-detailed input[data-f=notes] { grid-area: notes; }
  }

  /* Hole info during round entry */
  .hole-context {
    font-size: 10px; color: var(--muted-2); text-align: center;
    margin-top: 2px; line-height: 1.3; min-height: 12px;
  }
  .hole-context .name { color: var(--gold); }
  .hole-context .notes { color: var(--info); font-style: italic; }

  /* Community badge */
  .badge-community {
    display: inline-block; padding: 2px 8px;
    background: rgba(201, 169, 97, 0.12); color: var(--gold);
    border: 1px solid var(--gold-dim); border-radius: 999px;
    font-size: 10px; font-weight: 500; letter-spacing: 0.02em;
    margin-left: 6px;
  }

  /* Editorial section headers */
  .section-header {
    display: flex; justify-content: space-between; align-items: flex-end;
    margin-bottom: 8px; flex-wrap: wrap; gap: 16px;
  }
  .section-eyebrow {
    font-size: 10px; letter-spacing: 0.32em; color: var(--gold);
    text-transform: uppercase; font-weight: 500; margin-bottom: 10px;
  }
  .section-title {
    font-size: 36px; font-weight: 700; letter-spacing: -0.02em;
    color: var(--text); line-height: 1; margin-bottom: 8px;
  }
  .section-sub {
    font-size: 13px; color: var(--muted); max-width: 480px; line-height: 1.6;
  }
  @media (max-width: 700px) {
    .section-title { font-size: 26px; }
  }

  /* Rivalry list cards - the "roster" view */
  .rivalry-list-card {
    position: relative;
    padding: 32px 36px;
    background:
      radial-gradient(ellipse 60% 40% at 50% 0%, rgba(201,169,97,0.03), transparent 70%),
      linear-gradient(180deg, var(--panel) 0%, var(--bg-2) 100%);
    border: 1px solid var(--border);
    border-radius: 16px;
    margin-bottom: 14px;
    cursor: pointer;
    transition: border-color 0.3s ease, transform 0.2s ease;
    overflow: hidden;
  }
  .rivalry-list-card::before {
    content: '';
    position: absolute; top: 0; left: 0; right: 0; height: 1px;
    background: linear-gradient(90deg, transparent, var(--gold), transparent);
    opacity: 0.15;
    transition: opacity 0.3s ease;
  }
  .rivalry-list-card:hover { border-color: var(--gold-dim); }
  .rivalry-list-card:hover::before { opacity: 0.45; }
  .rivalry-list-card.completed { opacity: 0.6; }
  .rivalry-list-card.completed:hover { opacity: 1; }

  .rlc-top {
    display: flex; justify-content: space-between; align-items: flex-start;
    margin-bottom: 28px;
  }
  .rlc-status {
    font-size: 10px; letter-spacing: 0.28em; font-weight: 600;
    text-transform: uppercase; margin-bottom: 6px;
  }
  .rlc-title { font-size: 18px; font-weight: 500; letter-spacing: -0.01em; color: var(--text); }
  .rlc-meta {
    text-align: right; font-size: 11px; color: var(--muted);
    letter-spacing: 0.04em; line-height: 1.6;
  }

  .rlc-matchup {
    display: grid; grid-template-columns: 1fr auto 1fr;
    align-items: center; gap: 28px;
    margin: 0 auto 28px;
  }
  .rlc-side { text-align: center; }
  .rlc-name {
    font-size: 14px; font-weight: 600; letter-spacing: 0.12em;
    color: var(--muted); text-transform: uppercase; margin-bottom: 14px;
  }
  .rlc-name.leading { color: var(--text); }
  .rlc-pts {
    font-size: 96px; font-weight: 700; line-height: 0.9;
    letter-spacing: -0.05em; font-variant-numeric: tabular-nums;
    color: var(--muted);
    transition: color 0.4s ease;
  }
  .rlc-pts.win { color: var(--text); }
  .rlc-pts.loss { color: var(--muted-2); }
  .rlc-pts.tie { color: var(--gold-dim); }
  .rlc-vs { font-size: 28px; font-weight: 300; color: var(--gold-dim); }

  .rlc-bottom {
    display: flex; justify-content: space-between; align-items: center;
    padding-top: 20px; border-top: 1px solid var(--border-subtle);
    font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase;
    color: var(--muted-2);
  }
  .rlc-arrow {
    color: var(--gold); transition: transform 0.3s ease;
  }
  .rivalry-list-card:hover .rlc-arrow { transform: translateX(4px); }

  @media (max-width: 700px) {
    .rivalry-list-card { padding: 22px 18px; }
    .rlc-pts { font-size: 56px; }
    .rlc-name { font-size: 12px; margin-bottom: 8px; }
    .rlc-matchup { gap: 14px; margin-bottom: 20px; }
    .rlc-top { flex-direction: column; gap: 8px; margin-bottom: 20px; }
    .rlc-meta { text-align: left; }
  }

  /* Course search with custom dropdown */
  .course-search-wrap { position: relative; }
  .course-suggestions {
    display: none;
    position: absolute; top: 100%; left: 0; right: 0;
    background: var(--panel); border: 1px solid var(--border);
    border-radius: 10px; margin-top: 4px;
    max-height: 280px; overflow-y: auto;
    z-index: 10; box-shadow: var(--shadow-lg);
  }
  .course-suggestions.open { display: block; }
  .course-suggestion-item {
    padding: 10px 14px; cursor: pointer; font-size: 13px;
    border-bottom: 1px solid var(--border-subtle);
    display: flex; justify-content: space-between; align-items: center; gap: 12px;
  }
  .course-suggestion-item:last-child { border-bottom: none; }
  .course-suggestion-item:hover, .course-suggestion-item.focused {
    background: var(--panel-2); color: var(--accent-bright);
  }
  .course-suggestion-item .csi-name { font-weight: 500; }
  .course-suggestion-item .csi-meta { font-size: 11px; color: var(--muted); }

  /* Trophy category label */
  .trophy-cat-label {
    font-size: 10px; color: var(--gold); letter-spacing: 0.32em;
    text-transform: uppercase; font-weight: 600;
    padding-bottom: 8px; border-bottom: 1px solid var(--border-subtle);
  }
  /* Trophy card with tier dots */
  .trophy-card {
    background: var(--bg-2); border: 1px solid var(--border-subtle);
    border-radius: 12px; padding: 20px 18px; text-align: center;
    transition: border-color 0.3s ease, transform 0.2s ease;
    display: flex; flex-direction: column; gap: 4px;
  }
  .trophy-card.earned { border-color: var(--gold-dim); }
  .trophy-card.locked { opacity: 0.45; }
  .tcard-tier-row {
    display: flex; gap: 4px; justify-content: center; margin-bottom: 10px;
  }
  .tcard-tier-dot {
    width: 8px; height: 8px; border-radius: 50%;
    transition: background 0.3s ease;
  }
  .tcard-mark { font-size: 22px; margin-bottom: 4px; }
  .tcard-title {
    font-size: 13px; font-weight: 600; color: var(--text); letter-spacing: 0.01em;
  }
  .tcard-desc { font-size: 11px; color: var(--muted); line-height: 1.5; }
  .tcard-date {
    font-size: 9px; color: var(--gold); margin-top: 6px;
    text-transform: uppercase; letter-spacing: 0.15em; font-weight: 500;
  }
  .tcard-progress {
    margin-top: 8px; font-size: 10px; color: var(--muted-2);
    display: flex; align-items: center; gap: 8px;
  }
  .tcard-prog-bar {
    flex: 1; height: 4px; background: var(--bg); border-radius: 2px; overflow: hidden;
  }
  .tcard-prog-bar div {
    height: 100%; background: var(--gold);
    transition: width 0.5s ease;
  }

  /* Memories cards */
  .memory-card {
    display: flex; gap: 14px; align-items: center;
    padding: 12px 14px; border-bottom: 1px solid var(--border-subtle);
  }
  .memory-card:last-child { border-bottom: none; }
  .memory-icon { font-size: 22px; flex-shrink: 0; }
  .memory-text { flex: 1; min-width: 0; }
  .memory-title { font-size: 13px; font-weight: 500; color: var(--text); margin-bottom: 2px; }
  .memory-body { font-size: 11px; color: var(--muted); }

  /* Hole-by-hole wizard */
  .hbh-wizard { max-width: 480px; margin: 0 auto; }
  .hbh-progress { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; }
  .hbh-progress-bar { flex: 1; height: 4px; background: var(--bg-2); border-radius: 2px; overflow: hidden; }
  .hbh-progress-bar > div { height: 100%; background: linear-gradient(90deg, var(--accent-2), var(--gold)); transition: width 0.3s ease; }
  .hbh-progress-text { font-size: 11px; color: var(--muted); letter-spacing: 0.1em; font-variant-numeric: tabular-nums; }
  .hbh-hole-card {
    background: linear-gradient(180deg, var(--panel), var(--bg-2));
    border: 1px solid var(--border); border-radius: 18px;
    padding: 28px 24px; text-align: center; margin-bottom: 18px;
  }
  .hbh-hole-num { font-size: 11px; color: var(--gold); letter-spacing: 0.28em; font-weight: 600; margin-bottom: 6px; }
  .hbh-hole-info { font-size: 14px; color: var(--text-2); margin-bottom: 4px; letter-spacing: 0.02em; }
  .hbh-hole-name { font-size: 13px; color: var(--gold-dim); font-style: italic; min-height: 14px; margin-bottom: 22px; }
  .hbh-stepper { display: flex; align-items: center; justify-content: center; gap: 18px; margin-bottom: 20px; }
  .hbh-btn {
    width: 56px; height: 56px; border-radius: 50%;
    background: var(--bg-2); border: 1px solid var(--border); color: var(--text);
    font-size: 28px; font-weight: 300; cursor: pointer; font-family: inherit;
    transition: all 0.15s; line-height: 1;
  }
  .hbh-btn:hover { border-color: var(--accent); background: var(--accent-glow); }
  .hbh-btn:active { transform: scale(0.95); }
  .hbh-score-display { min-width: 120px; }
  .hbh-score-num {
    font-size: 64px; font-weight: 700; line-height: 1;
    letter-spacing: -0.03em; color: var(--text); font-variant-numeric: tabular-nums;
  }
  .hbh-score-label {
    font-size: 12px; color: var(--muted); margin-top: 6px;
    letter-spacing: 0.16em; text-transform: uppercase; font-weight: 500;
  }
  .hbh-score-label.eagle { color: #8a73ff; }
  .hbh-score-label.birdie { color: var(--accent-bright); }
  .hbh-score-label.par { color: var(--gold); }
  .hbh-score-label.bogey { color: var(--warn); }
  .hbh-score-label.double { color: var(--tension); }
  .hbh-quick-row { display: flex; justify-content: center; gap: 4px; flex-wrap: wrap; }
  .hbh-quick {
    padding: 6px 12px; background: transparent; color: var(--muted);
    border: 1px solid var(--border); border-radius: 999px;
    font-size: 11px; cursor: pointer; font-family: inherit;
    transition: all 0.15s;
  }
  .hbh-quick:hover { color: var(--text); border-color: var(--accent-2); }
  .hbh-controls { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 4px; }
  .hbh-totals { font-size: 12px; color: var(--muted); display: flex; gap: 14px; }
  .hbh-totals strong { color: var(--text); font-variant-numeric: tabular-nums; }
  #hbh-next.done { background: var(--gold); color: #1a1408; }

  /* HCP banner shown after saving a round */
  .hcp-banner {
    background: linear-gradient(135deg, rgba(201,169,97,0.15), rgba(13,24,19,0.4));
    border: 1px solid var(--gold-dim); border-radius: 14px;
    margin-bottom: 24px;
    animation: hcpBannerSlide 0.4s ease-out;
  }
  .hcp-banner-inner { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 18px 24px; }
  .hcp-banner-label { font-size: 10px; color: var(--gold); letter-spacing: 0.24em; text-transform: uppercase; font-weight: 600; }
  .hcp-banner-value { font-size: 36px; font-weight: 700; color: var(--text); letter-spacing: -0.02em; line-height: 1; margin-top: 4px; font-variant-numeric: tabular-nums; }
  .hcp-banner-meta { font-size: 12px; color: var(--muted); line-height: 1.5; text-align: right; }
  @keyframes hcpBannerSlide { from { transform: translateY(-10px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
  @media (max-width: 700px) {
    .hcp-banner-inner { flex-direction: column; align-items: flex-start; gap: 8px; }
    .hcp-banner-meta { text-align: left; }
  }

  /* Auth modal tabs */
  .auth-tab {
    flex: 1; padding: 10px 14px; background: transparent; border: none;
    color: var(--muted); font-size: 13px; font-weight: 500; cursor: pointer;
    border-bottom: 2px solid transparent; transition: all 0.15s;
  }
  .auth-tab:hover { color: var(--text); }
  .auth-tab.active { color: var(--gold); border-bottom-color: var(--gold); }

  /* Cloud status chip - matches profile-chip style */
  .cloud-chip {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 7px 14px;
    background: var(--panel); border: 1px solid var(--border);
    border-radius: 999px; cursor: pointer; transition: border-color 0.15s, background 0.15s;
    font-size: 12px; color: var(--text); letter-spacing: 0.02em;
    white-space: nowrap;
  }
  .cloud-chip:hover { border-color: var(--gold-dim); }
  .cloud-chip.connected { border-color: var(--gold-dim); background: rgba(201,169,97,0.05); }
  .cloud-chip.connected:hover { border-color: var(--gold); }
  .cloud-dot {
    width: 7px; height: 7px; border-radius: 50%;
    background: var(--muted-2); flex-shrink: 0;
    transition: background 0.3s, box-shadow 0.3s;
  }
  .cloud-chip.connected .cloud-dot {
    background: var(--gold-bright);
    box-shadow: 0 0 0 3px rgba(201,169,97,0.18);
  }

  /* HCP feedback panel after round save */
  .hcp-feedback {
    background: linear-gradient(135deg, rgba(201,169,97,0.08), var(--bg-2));
    border: 1px solid var(--gold-dim); border-radius: 12px;
    padding: 20px 24px; margin-top: 16px;
  }
  .hcp-feedback .label {
    font-size: 10px; color: var(--gold); letter-spacing: 0.24em;
    text-transform: uppercase; font-weight: 600; margin-bottom: 8px;
  }
  .hcp-feedback .value {
    font-size: 32px; font-weight: 700; color: var(--text);
    letter-spacing: -0.02em; font-variant-numeric: tabular-nums;
  }
  .hcp-feedback .body {
    font-size: 13px; color: var(--muted); margin-top: 8px; line-height: 1.6;
  }

  /* Generic rv-score for use in rivalry detail and other contexts */
  .rv-score {
    display: grid; grid-template-columns: 1fr auto 1fr; gap: 16px;
    align-items: center; padding: 18px 0;
  }
  .rv-score .rv-side { text-align: center; }
  .rv-score .rv-side .name {
    font-size: 13px; color: var(--muted); letter-spacing: 0.06em;
    text-transform: uppercase; font-weight: 500; margin-bottom: 8px;
  }
  .rv-score .rv-side .pts {
    font-size: 48px; font-weight: 700; font-variant-numeric: tabular-nums;
    color: var(--muted); letter-spacing: -0.02em; line-height: 1;
  }
  .rv-score .rv-side.leading .pts { color: var(--accent-bright); }
  .rv-score .rv-side.losing .pts { color: var(--muted-2); }
  .rv-score .rv-vs {
    font-size: 14px; color: var(--gold-dim); text-transform: uppercase;
    letter-spacing: 0.16em; text-align: center; font-weight: 500;
  }

  /* Old card class kept for compatibility - just an alias */
  .rivalry-card {
    background: linear-gradient(135deg, var(--panel) 0%, var(--bg-2) 100%);
    border: 1px solid var(--border); border-radius: var(--radius-lg);
    padding: 18px; margin-bottom: 12px; cursor: pointer;
    transition: border-color 0.15s, transform 0.15s;
  }
  .rivalry-card:hover { border-color: var(--accent); }
  .rivalry-card.completed { opacity: 0.7; }
  .rivalry-card .rv-header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 12px; }
  .rivalry-card .rv-title { font-size: 16px; font-weight: 600; }
  .rivalry-card .rv-period { font-size: 11px; color: var(--muted); text-transform: uppercase; letter-spacing: 0.05em; margin-top: 2px; }
  .rivalry-card .rv-status {
    font-size: 10px; padding: 3px 9px; border-radius: 999px;
    background: var(--accent-glow); color: var(--accent-bright);
    text-transform: uppercase; letter-spacing: 0.06em; font-weight: 600;
  }
  .rivalry-card .rv-status.completed { background: rgba(201,169,97,0.1); color: var(--gold); }
  .rivalry-card .rv-score {
    display: grid; grid-template-columns: 1fr auto 1fr; gap: 10px;
    align-items: center; padding: 12px 0;
  }
  .rivalry-card .rv-side { text-align: center; }
  .rivalry-card .rv-side .name { font-size: 12px; color: var(--muted); margin-bottom: 2px; }
  .rivalry-card .rv-side .pts { font-size: 32px; font-weight: 600; font-variant-numeric: tabular-nums; }
  .rivalry-card .rv-side.leading .pts { color: var(--accent-bright); }
  .rivalry-card .rv-side.losing .pts { color: var(--muted); }
  .rivalry-card .rv-vs {
    font-size: 11px; color: var(--muted-2); text-transform: uppercase;
    letter-spacing: 0.1em;
  }

  /* Clickable table rows reveal on hover */
  tr.row-clickable { transition: background 0.12s; }
  tr.row-clickable:hover { background: rgba(255,255,255,0.025); }

  /* Floating mobile new-round CTA */
  .mobile-fab {
    position: fixed; bottom: 18px; right: 18px; z-index: 50;
    display: none; align-items: center; gap: 8px;
    padding: 13px 20px; border-radius: 999px;
    background: linear-gradient(135deg, var(--gold), var(--gold-bright));
    color: #1a1408; font-weight: 600; font-size: 14px; letter-spacing: -0.005em;
    border: none; cursor: pointer;
    box-shadow: 0 6px 20px rgba(201,169,97,0.35), 0 0 0 1px rgba(201,169,97,0.5);
    transition: transform 0.15s, box-shadow 0.15s;
  }
  .mobile-fab:hover { transform: translateY(-1px); box-shadow: 0 8px 24px rgba(201,169,97,0.45), 0 0 0 1px rgba(201,169,97,0.6); }
  .mobile-fab:active { transform: translateY(0); }
  .mobile-fab-icon { font-size: 18px; line-height: 1; }
  @media (max-width: 760px) {
    .mobile-fab { display: inline-flex; }
    /* Add bottom padding to body so the FAB doesn't cover the last row */
    body { padding-bottom: calc(80px + env(safe-area-inset-bottom, 0px)); }
  }

  /* PWA install banner — slides up from bottom on mobile */
  .pwa-install-banner {
    position: fixed; left: 12px; right: 12px; bottom: 12px; z-index: 70;
    display: none; align-items: center; gap: 12px;
    padding: 14px 16px; border-radius: 16px;
    background: linear-gradient(135deg, var(--panel-2) 0%, var(--panel) 100%);
    border: 1px solid var(--border);
    box-shadow: 0 20px 60px rgba(0,0,0,0.55), 0 0 0 1px rgba(201,169,97,0.18);
    transform: translateY(120%); opacity: 0;
    transition: transform 0.4s cubic-bezier(0.16,1,0.3,1), opacity 0.3s;
    /* Respect iOS safe area */
    padding-bottom: calc(14px + env(safe-area-inset-bottom));
  }
  .pwa-install-banner.show { display: flex; transform: translateY(0); opacity: 1; }
  .pwa-install-icon {
    flex: 0 0 44px; width: 44px; height: 44px; border-radius: 12px;
    background: linear-gradient(135deg, var(--gold), var(--gold-bright));
    display: flex; align-items: center; justify-content: center;
    font-size: 22px; color: #1a1408;
  }
  .pwa-install-body { flex: 1; min-width: 0; }
  .pwa-install-title { font-size: 14px; font-weight: 600; color: var(--text); letter-spacing: -0.005em; }
  .pwa-install-sub   { font-size: 12px; color: var(--muted); margin-top: 2px; line-height: 1.35; }
  .pwa-install-actions { display: flex; gap: 8px; flex: 0 0 auto; }
  .pwa-install-btn {
    padding: 9px 14px; border-radius: 10px; font-size: 13px; font-weight: 600;
    background: var(--gold); color: #1a1408; border: none; cursor: pointer;
    letter-spacing: -0.005em;
  }
  .pwa-install-btn.secondary {
    background: transparent; color: var(--muted); border: 1px solid var(--border);
  }
  @media (min-width: 761px) {
    .pwa-install-banner { left: auto; right: 24px; bottom: 24px; max-width: 380px; }
  }

  /* iOS install instructions sheet */
  .pwa-ios-sheet {
    position: fixed; inset: 0; z-index: 90; display: none;
    background: rgba(6, 13, 10, 0.72); backdrop-filter: blur(8px);
    align-items: flex-end; justify-content: center;
    animation: fadeIn 0.25s ease;
  }
  .pwa-ios-sheet.show { display: flex; }
  .pwa-ios-card {
    width: min(420px, 100%); margin: 0 12px 12px;
    background: linear-gradient(180deg, var(--panel-2) 0%, var(--panel) 100%);
    border: 1px solid var(--border); border-radius: 18px;
    padding: 22px 22px calc(22px + env(safe-area-inset-bottom));
    box-shadow: 0 24px 80px rgba(0,0,0,0.6);
    animation: slideUp 0.32s cubic-bezier(0.16,1,0.3,1);
  }
  @keyframes slideUp { from { transform: translateY(40px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
  .pwa-ios-card h3 { font-size: 17px; margin-bottom: 6px; color: var(--text); }
  .pwa-ios-card p  { font-size: 13px; color: var(--muted); margin-bottom: 14px; line-height: 1.5; }
  .pwa-ios-steps { display: flex; flex-direction: column; gap: 10px; }
  .pwa-ios-step  {
    display: flex; gap: 12px; align-items: center;
    padding: 10px 12px; border-radius: 12px;
    background: var(--bg-2); border: 1px solid var(--border-subtle);
  }
  .pwa-ios-step-num {
    flex: 0 0 28px; width: 28px; height: 28px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    background: var(--gold); color: #1a1408; font-size: 13px; font-weight: 600;
  }
  .pwa-ios-step-text { font-size: 13px; color: var(--text-2); }
  .pwa-ios-step-icon { font-size: 18px; margin-left: auto; }
  .pwa-ios-card .pwa-install-btn { width: 100%; margin-top: 14px; padding: 12px; font-size: 14px; }

  /* Update available toast */
  .pwa-update-toast {
    position: fixed; left: 50%; transform: translateX(-50%) translateY(-120%);
    top: 16px; z-index: 95;
    display: flex; align-items: center; gap: 12px;
    padding: 10px 14px; border-radius: 999px;
    background: linear-gradient(135deg, var(--accent-2), var(--accent));
    border: 1px solid rgba(255,255,255,0.08);
    color: var(--text); font-size: 13px; font-weight: 500;
    box-shadow: 0 10px 30px rgba(0,0,0,0.45);
    transition: transform 0.4s cubic-bezier(0.16,1,0.3,1);
    cursor: pointer;
  }
  .pwa-update-toast.show { transform: translateX(-50%) translateY(0); }
  .pwa-update-toast-btn {
    background: rgba(255,255,255,0.18); color: var(--text);
    border: none; padding: 5px 11px; border-radius: 999px;
    font-size: 12px; font-weight: 600; cursor: pointer;
  }
  .pwa-update-toast-btn:hover { background: rgba(255,255,255,0.28); }

  /* Game-kind picker cards (Step 1 of New Round) */
  .gk-grid {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px;
    margin-top: 10px;
  }
  .gk-card {
    background: linear-gradient(180deg, var(--panel) 0%, var(--bg-2) 100%);
    border: 1px solid var(--border); border-radius: var(--radius-lg);
    padding: 22px 18px; cursor: pointer; text-align: center;
    transition: border-color 0.15s, transform 0.15s, background 0.15s;
    color: var(--text); font-family: inherit; min-height: 150px;
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px;
  }
  .gk-card:hover { border-color: var(--gold-dim); transform: translateY(-2px); }
  .gk-card:active { transform: translateY(0); }
  .gk-icon { font-size: 38px; line-height: 1; }
  .gk-title { font-size: 15px; font-weight: 600; letter-spacing: -0.01em; }
  .gk-desc { font-size: 11px; color: var(--muted); line-height: 1.4; }

  /* Minigame catalog list */
  .gm-list {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 10px;
  }
  .gm-item {
    background: var(--panel); border: 1px solid var(--border); border-radius: 12px;
    padding: 14px 16px; cursor: pointer; text-align: left;
    transition: border-color 0.15s, background 0.15s;
    color: var(--text); font-family: inherit;
  }
  .gm-item:hover { border-color: var(--gold-dim); background: var(--bg-2); }
  .gm-item-head { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; }
  .gm-item-icon { font-size: 20px; }
  .gm-item-title { font-size: 14px; font-weight: 600; }
  .gm-item-desc { font-size: 11px; color: var(--muted); line-height: 1.4; }

/* ============================================================
   STORY HERO — adaptive dashboard hero (Mode A/B/C)
   ============================================================ */
.story-hero {
  background: linear-gradient(180deg, var(--panel) 0%, var(--bg-2) 100%);
  border: 1px solid var(--border);
  border-radius: 18px; padding: 44px 44px 38px;
  position: relative; overflow: hidden;
}
.story-hero::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, transparent, var(--gold), transparent);
  opacity: 0.5;
}
.story-hero.modeC::before {
  background: linear-gradient(90deg, var(--accent-2), var(--gold), var(--tension));
  opacity: 0.7;
}
.story-tag {
  font-size: 10px; letter-spacing: 0.32em; text-transform: uppercase;
  color: var(--gold); font-weight: 600; margin-bottom: 16px;
}
.story-title {
  font-size: 38px; font-weight: 700; line-height: 1.08;
  letter-spacing: -0.02em; color: var(--text);
  margin-bottom: 18px;
  font-family: Georgia, 'Times New Roman', serif;
}
.story-title.rivalry-title {
  display: flex; align-items: baseline; gap: 14px; flex-wrap: wrap;
  font-size: 44px;
}
.story-title .leading { color: var(--gold); }
.story-title .versus {
  font-size: 18px; color: var(--muted-2); font-weight: 400;
  letter-spacing: 0.08em; font-family: inherit;
}
.story-body {
  font-size: 14px; line-height: 1.6; color: var(--text-2);
  margin-bottom: 22px; max-width: 560px;
}
.story-milestone {
  background: rgba(201,169,97,0.06);
  border-left: 3px solid var(--gold);
  padding: 12px 16px; border-radius: 0 10px 10px 0;
  font-size: 13px; color: var(--text-2);
  margin-bottom: 24px; line-height: 1.55;
}
.story-milestone strong { color: var(--gold); }
.story-cta-hint { font-size: 11px; color: var(--muted-2); margin-top: 10px; letter-spacing: 0.04em; }
.story-cta-row { display: flex; gap: 12px; margin-bottom: 32px; flex-wrap: wrap; }
.story-cta {
  padding: 14px 22px; border-radius: 11px;
  font-size: 14px; font-weight: 600; cursor: pointer;
  border: 1px solid transparent; font-family: inherit;
  transition: transform 0.15s, border-color 0.2s, background 0.2s;
  letter-spacing: -0.005em; min-height: 48px;
}
.story-cta.primary {
  background: linear-gradient(180deg, #d8b975, #c9a961);
  color: #1a1408;
  box-shadow: 0 6px 18px rgba(201,169,97,0.18);
}
.story-cta.primary:hover { transform: translateY(-1px); }
.story-cta.ghost {
  background: transparent; color: var(--gold);
  border-color: rgba(201,169,97,0.4);
}
.story-cta.ghost:hover { border-color: var(--gold); background: rgba(201,169,97,0.05); }
.story-grid-2, .story-grid-3, .story-grid-4 { display: grid; gap: 12px; }
.story-grid-2 { grid-template-columns: repeat(2, 1fr); }
.story-grid-3 { grid-template-columns: repeat(3, 1fr); }
.story-grid-4 { grid-template-columns: repeat(4, 1fr); }
.story-card {
  background: var(--bg-2);
  border: 1px solid var(--border-subtle);
  border-radius: 12px; padding: 16px 18px;
}
.sc-icon { font-size: 24px; margin-bottom: 8px; }
.sc-icon-inline { font-size: 20px; margin-right: 8px; }
.sc-label { font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--muted); font-weight: 600; margin-bottom: 8px; }
.sc-title { font-size: 13px; font-weight: 600; color: var(--text); margin-bottom: 4px; }
.sc-desc { font-size: 11px; color: var(--muted); line-height: 1.5; }
.sc-value-row { display: flex; align-items: baseline; gap: 4px; margin-bottom: 6px; }
.sc-value { font-size: 20px; font-weight: 600; color: var(--text); letter-spacing: -0.01em; }
.sc-value.muted { color: var(--muted); }
.sc-value-suffix { font-size: 13px; color: var(--muted); font-weight: 400; }
.sc-progress-bar { height: 4px; background: var(--bg); border-radius: 2px; overflow: hidden; margin-top: 8px; }
.sc-progress-bar div { height: 100%; background: var(--gold); transition: width 0.5s ease; }
.rivalry-score-row { display: flex; align-items: center; gap: 18px; margin-bottom: 20px; }
.rivalry-score { font-size: 56px; font-weight: 700; line-height: 1; color: var(--text); letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.rivalry-score.win { color: var(--gold); }
.rivalry-score.loss { color: var(--muted); }
.rivalry-score.tie { color: var(--text-2); }
.rivalry-score-sep { font-size: 32px; color: var(--muted-2); font-weight: 300; }
.form-streak-row { display: flex; gap: 6px; align-items: center; margin: 4px 0 6px; }
.form-pill {
  width: 28px; height: 28px; border-radius: 6px;
  display: flex; align-items: center; justify-content: center;
  font-size: 12px; font-weight: 700;
  background: var(--bg); color: var(--muted-2);
  border: 1px solid var(--border-subtle);
}
.form-pill.win { background: rgba(201,169,97,0.12); color: var(--gold); border-color: var(--gold-dim); }
.form-pill.loss { background: rgba(166,69,69,0.1); color: var(--tension); border-color: rgba(166,69,69,0.3); }
@media (max-width: 760px) {
  .story-hero { padding: 28px 22px 26px; border-radius: 14px; }
  .story-title { font-size: 26px; }
  .story-title.rivalry-title { font-size: 28px; gap: 10px; }
  .story-grid-2, .story-grid-3, .story-grid-4 { grid-template-columns: 1fr; }
  .story-cta-row { flex-direction: column; }
  .story-cta { width: 100%; }
  .rivalry-score { font-size: 44px; }
}
.demo-rivalry { padding: 8px 4px; }
.dr-tag { font-size: 10px; letter-spacing: 0.28em; text-transform: uppercase; color: var(--gold); font-weight: 600; margin-bottom: 12px; text-align: center; }
.dr-title { font-size: 28px; text-align: center; margin-bottom: 16px; font-family: Georgia, serif; font-weight: 700; letter-spacing: -0.01em; }
.dr-title .versus { font-size: 14px; color: var(--muted-2); font-weight: 400; margin: 0 8px; }
.dr-score-row { display: flex; align-items: center; justify-content: center; gap: 16px; margin-bottom: 14px; }
.dr-score { font-size: 52px; font-weight: 700; font-variant-numeric: tabular-nums; }
.dr-score.win { color: var(--gold); }
.dr-score.loss { color: var(--muted); }
.dr-sep { font-size: 26px; color: var(--muted-2); }
.dr-story { text-align: center; font-size: 14px; color: var(--text-2); margin-bottom: 24px; font-style: italic; font-family: Georgia, serif; }
.dr-section { margin-bottom: 18px; }
.dr-label { font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--gold); font-weight: 600; margin-bottom: 10px; }
.dr-card { background: var(--bg-2); border: 1px solid var(--border-subtle); border-radius: 10px; padding: 12px 14px; font-size: 13px; line-height: 1.55; color: var(--text-2); }
.dr-card strong { color: var(--text); }
.dr-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.dr-list { list-style: none; padding: 0; margin: 0; }
.dr-list li { padding: 8px 0; border-bottom: 1px dashed var(--border-subtle); font-size: 13px; color: var(--text-2); }
.dr-list li:last-child { border-bottom: none; }


.wl-overlay { position: fixed; inset: 0; z-index: 200; background: radial-gradient(ellipse at 50% 0%, rgba(201,169,97,0.08) 0%, transparent 50%), linear-gradient(180deg, #060d0a 0%, #030806 100%); overflow-y: auto; -webkit-overflow-scrolling: touch; animation: wlFadeIn 0.5s ease; }
@keyframes wlFadeIn { from { opacity: 0 } to { opacity: 1 } }
.wl-content { max-width: 560px; margin: 0 auto; padding: 56px 28px 64px; text-align: center; }
.wl-logo { width: 280px; height: 280px; margin: 0 auto 20px; filter: drop-shadow(0 8px 32px rgba(201,169,97,0.18)); }
.wl-brand { font-size: 54px; font-weight: 700; letter-spacing: -0.015em; background: linear-gradient(180deg, #f0d488, #c9a961 55%, #8a7340); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; margin-bottom: 10px; font-family: Georgia, 'Times New Roman', serif; line-height: 1.05; }
.wl-brand-sub { font-size: 12px; letter-spacing: 0.32em; color: var(--gold-dim); margin-bottom: 22px; text-transform: uppercase; font-weight: 500; }
.wl-headline { font-size: 44px; font-weight: 700; line-height: 1.08; color: var(--text); letter-spacing: -0.02em; margin-bottom: 20px; }
.wl-body { font-size: 14px; line-height: 1.7; color: var(--muted); max-width: 460px; margin: 0 auto 44px; }
.wl-hook { font-size: 15.5px; line-height: 1.6; color: var(--muted); max-width: 440px; margin: 12px auto 22px; }
.wl-proof { font-size: 12px; letter-spacing: 0.02em; color: var(--gold-dim); margin: 4px 0 14px; }
.demo-roster .rv-card.example { margin-bottom: 10px; }
.wl-pillars { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-bottom: 22px; }
.wl-pillar { text-align: center; padding: 13px 6px; border: 1px solid rgba(201,169,97,0.22); border-radius: 12px; background: linear-gradient(180deg, rgba(201,169,97,0.07), rgba(201,169,97,0.02)); }

.wl-pillar-title { font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--gold); font-weight: 600; margin-bottom: 4px; }
.wl-pillar-sub { font-size: 9.5px; letter-spacing: 0.04em; text-transform: uppercase; color: var(--muted); font-weight: 500; line-height: 1.35; }
.wl-form { margin-bottom: 18px; }
.wl-input { width: 100%; padding: 16px 18px; margin-bottom: 14px; background: rgba(13, 24, 19, 0.6); border: 1px solid rgba(201,169,97,0.22); border-radius: 12px; color: var(--text); font-size: 15px; font-family: inherit; -webkit-appearance: none; appearance: none; }
.wl-input:focus { outline: none; border-color: var(--gold); background: rgba(13, 24, 19, 0.9); box-shadow: 0 0 0 4px rgba(201,169,97,0.08); }
.wl-cta-primary { width: 100%; padding: 17px 24px; border-radius: 12px; background: linear-gradient(180deg, #d8b975, #c9a961); color: #1a1408; font-size: 15px; font-weight: 600; border: none; cursor: pointer; box-shadow: 0 8px 24px rgba(201,169,97,0.18); margin-bottom: 12px; min-height: 52px; font-family: inherit; }
.wl-cta-primary:hover { transform: translateY(-1px); }
.wl-cta-secondary { width: 100%; padding: 16px 24px; border-radius: 12px; background: transparent; border: 1px solid rgba(201,169,97,0.4); color: var(--gold); font-size: 14px; font-weight: 500; cursor: pointer; min-height: 50px; font-family: inherit; }
.wl-cta-secondary:hover { border-color: var(--gold); background: rgba(201,169,97,0.05); }
.wl-badges { display: flex; justify-content: center; gap: 24px; margin-top: 36px; font-size: 12px; color: var(--muted-2); flex-wrap: wrap; }
.wl-badge { display: inline-flex; align-items: center; gap: 6px; }
@media (max-width: 700px) {
  .wl-content { padding: 40px 20px 48px; }
  .wl-logo { width: 210px; height: 210px; margin-bottom: 14px; }
  .wl-brand { font-size: 40px; }
  .wl-headline { font-size: 30px; }
  .wl-pillars { grid-template-columns: repeat(3, 1fr); padding: 16px 0; }



}

/* ---- Mobile text-reduction pass: keep momentum, cut the wall of words ---- */
.only-mobile { display: none; }
@media (max-width: 640px) {
  .only-desktop { display: none !important; }
  .only-mobile { display: inline; }
  /* Tighten verbose secondary copy so screens lead with action, not paragraphs */
  .section-sub { font-size: 12px; line-height: 1.4; margin-top: 4px;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
  .section-title { font-size: 26px; }
  .section-eyebrow { font-size: 9px; }
  .fgl-sub { font-size: 12px; line-height: 1.4; }
  .fgl-title { margin-bottom: 6px; }
  .wl-body { font-size: 13px; line-height: 1.5; margin-bottom: 30px; }
  .wl-brand-sub { margin-bottom: 26px; }
  .fgl-empty p, .fgl-tip { font-size: 12px; line-height: 1.5; }
  /* Hide the longest, skippable explainer prose on phones (still openable) */
  .fgl-explain-body p:first-child { font-size: 12px; }
  /* Dashboard hero: lead with the headline + CTA, soften the prose */
  .story-body { font-size: 13px; line-height: 1.45; margin-bottom: 14px;
    display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
  .sc-desc { display: none; }
  .sc-title { font-size: 12px; }
  .wfb-title { font-size: 18px; line-height: 1.25; }
  .wfb-card-body { font-size: 12px; line-height: 1.4;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
}




/* Landing — Link sent confirmation screen */
.wl-sent { text-align: center; max-width: 480px; }
.wl-sent-icon { font-size: 56px; margin-bottom: 12px; }
.wl-sent-h { font-size: 32px; font-weight: 700; color: var(--text); letter-spacing: -0.01em; margin: 0 0 14px; font-family: Georgia, serif; }
.wl-sent-p { color: var(--muted); font-size: 14px; line-height: 1.6; max-width: 400px; margin: 0 auto 14px; }
.wl-sent-p strong { color: var(--gold-bright); }
.wl-sent-sub { font-size: 12px; color: var(--muted-2); margin: 0 0 22px; max-width: 360px; margin-left: auto; margin-right: auto; }

/* Landing — sign-in button (secondary on landing) */
.wl-signin { background: var(--panel-2); border: 1px solid var(--gold-dim); color: var(--gold-bright); margin-bottom: 12px !important; padding: 14px 18px; border-radius: 12px; font-weight: 600; cursor: pointer; font-family: inherit; min-height: 50px; }
.wl-signin:hover { background: rgba(201,169,97,0.08); border-color: var(--gold); }

/* See a rivalry in action — glowing, eye-catching CTA */
.wl-cta-demo { position: relative; width: 100%; padding: 0; margin-bottom: 12px; border: none; background: transparent; cursor: pointer; font-family: inherit; overflow: hidden; border-radius: 16px; }
.wl-demo-glow { position: absolute; inset: 0; background: linear-gradient(135deg, rgba(201,169,97,0.32) 0%, rgba(150,200,255,0.16) 35%, rgba(255,200,100,0.28) 65%, rgba(201,169,97,0.32) 100%); border-radius: 16px; opacity: 0.85; animation: demoGlow 4s ease-in-out infinite; }
.wl-demo-content { position: relative; display: flex; align-items: center; gap: 14px; padding: 16px 18px; background: linear-gradient(180deg, rgba(13,28,21,0.95), rgba(6,13,10,0.85)); border-radius: 14px; margin: 2px; color: var(--gold-bright); text-align: left; }
.wl-demo-text { flex: 1; display: flex; flex-direction: column; gap: 2px; }
.wl-demo-text strong { font-size: 15px; font-weight: 800; letter-spacing: 0.02em; color: var(--gold-bright); }
.wl-demo-sub { font-size: 11px; color: var(--muted); font-weight: 400; }
.wl-demo-arrow { font-size: 18px; color: var(--gold); }
@keyframes demoGlow { 0%, 100% { background-position: 0% 50% } 50% { background-position: 100% 50% } }
.wl-cta-demo { background-size: 200% 200%; }

.wl-cta-tertiary { width: 100%; padding: 14px 24px; margin-top: 10px; background: transparent; border: none; color: var(--muted); font-size: 13px; font-weight: 500; cursor: pointer; font-family: inherit; text-decoration: underline; text-decoration-color: var(--muted-2); text-underline-offset: 4px; transition: color 0.2s; }
.wl-cta-tertiary:hover { color: var(--text-2); text-decoration-color: var(--muted); }


/* ============================================================
   Fairway symbol system — premium monoline SVG icons
   ============================================================ */
.fg-icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 22px; height: 22px; flex-shrink: 0;
  color: var(--gold);
}
.fg-icon svg { width: 100%; height: 100%; display: block; }
.fg-icon.lg { width: 32px; height: 32px; }
.fg-icon.xl { width: 48px; height: 48px; }
.fg-icon.silver { color: #cdc9be; }
.fg-icon.muted { color: var(--muted); }

/* Dashboard section header (re-used everywhere) */
.dash-section-header {
  display: flex; align-items: baseline; justify-content: space-between;
  margin-bottom: 14px;
}
.dash-section-header h3 {
  font-size: 13px; letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--gold); font-weight: 600; margin: 0;
}
.dash-section-link { font-size: 11px; color: var(--muted); text-decoration: none; letter-spacing: 0.06em; }
.dash-section-link:hover { color: var(--accent-bright); }

/* Recent Moments feed */
.moments-feed { display: flex; flex-direction: column; gap: 8px; }
.moment-card {
  display: flex; align-items: center; gap: 14px;
  padding: 12px 16px; border-radius: 10px;
  background: var(--bg-2); border: 1px solid var(--border-subtle);
  transition: border-color 0.2s, transform 0.2s;
}
.moment-card:hover { border-color: var(--gold-dim); transform: translateX(2px); }
.moment-icon { width: 26px; height: 26px; flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; }
.moment-icon svg { width: 100%; height: 100%; }
.moment-text { flex: 1; font-size: 13px; color: var(--text-2); line-height: 1.45; }
.moment-date { font-size: 10px; color: var(--muted-2); letter-spacing: 0.04em; flex-shrink: 0; }

/* What's at Stake card */
.stakes-card {
  position: relative;
  background:
    radial-gradient(circle at 0% 0%, rgba(201,169,97,0.08) 0%, transparent 50%),
    linear-gradient(180deg, var(--panel) 0%, var(--bg-2) 100%);
  border: 1px solid var(--gold-dim);
  border-radius: 14px; padding: 22px 24px;
  overflow: hidden;
}
.stakes-card::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px;
  background: linear-gradient(90deg, transparent, var(--gold), transparent);
}
.stakes-tag {
  font-size: 10px; letter-spacing: 0.32em; text-transform: uppercase;
  color: var(--gold); font-weight: 600; margin-bottom: 8px;
}
.stakes-title {
  font-size: 18px; font-weight: 600; color: var(--text);
  margin-bottom: 16px; font-family: Georgia, serif; letter-spacing: -0.005em;
}
.stakes-list { list-style: none; padding: 0; margin: 0; }
.stakes-list li {
  display: flex; align-items: center; gap: 12px;
  padding: 10px 0; font-size: 13px; color: var(--text-2);
  border-bottom: 1px dashed var(--border-subtle);
}
.stakes-list li:last-child { border-bottom: none; }
.stakes-icon {
  width: 24px; height: 24px; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
}
.stakes-icon svg { width: 100%; height: 100%; color: var(--gold); }

/* Your Game grid */
.your-game-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px;
}
.yg-card {
  background: var(--bg-2); border: 1px solid var(--border-subtle);
  border-radius: 12px; padding: 16px 18px;
}
.yg-label {
  font-size: 9px; letter-spacing: 0.24em; text-transform: uppercase;
  color: var(--muted); font-weight: 600; margin-bottom: 8px;
}
.yg-value {
  font-size: 28px; font-weight: 700; color: var(--text);
  letter-spacing: -0.02em; line-height: 1; font-variant-numeric: tabular-nums;
  font-family: Georgia, serif;
}
.yg-value-text {
  font-size: 15px; font-weight: 600; color: var(--text);
  letter-spacing: -0.005em; line-height: 1.2;
}
.yg-value-suffix { font-size: 13px; color: var(--muted); font-weight: 400; }
@media (max-width: 760px) {
  .your-game-grid { grid-template-columns: repeat(2, 1fr); }
}

/* Advanced divider */
.advanced-divider {
  display: flex; align-items: center; gap: 14px;
  font-size: 10px; letter-spacing: 0.32em; text-transform: uppercase;
  color: var(--muted-2); font-weight: 600;
  margin: 32px 0 8px;
}
.advanced-divider::before, .advanced-divider::after {
  content: ''; flex: 1; height: 1px; background: var(--border-subtle);
}


.sc-icon-svg { margin-bottom: 8px; display: inline-flex; }
.sc-icon-svg .fg-icon { width: 32px; height: 32px; }


.gk-icon-svg { width: 38px; height: 38px; color: var(--gold); display: inline-flex; align-items: center; justify-content: center; }
.gk-icon-svg svg { width: 100%; height: 100%; }
.gk-card:hover .gk-icon-svg { filter: drop-shadow(0 0 8px rgba(201,169,97,0.4)); }


.empty-state-card {
  background: radial-gradient(ellipse at top, rgba(201,169,97,0.08) 0%, transparent 60%),
              linear-gradient(180deg, var(--panel) 0%, var(--bg-2) 100%) !important;
  border: 1px solid var(--gold-dim) !important;
  padding: 48px 36px !important; text-align: center;
  position: relative; overflow: hidden;
}
.empty-state-card::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px;
  background: linear-gradient(90deg, transparent, var(--gold), transparent);
}
.es-eyebrow {
  font-size: 11px; letter-spacing: 0.32em; text-transform: uppercase;
  color: var(--gold); font-weight: 600; margin-bottom: 20px;
}
.es-headline {
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 30px; font-weight: 700; line-height: 1.18;
  letter-spacing: -0.015em; color: var(--text);
  max-width: 640px; margin: 0 auto 18px;
}
.es-body {
  font-size: 14px; line-height: 1.75; color: var(--text-2);
  max-width: 620px; margin: 0 auto 28px;
}
.es-quote {
  font-family: Georgia, serif; font-style: italic;
  font-size: 16px; line-height: 1.5; color: var(--gold);
  margin: 0 auto 32px; max-width: 480px;
  padding: 18px 24px;
  border-top: 1px solid var(--gold-dim);
  border-bottom: 1px solid var(--gold-dim);
}
.es-examples {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px;
  max-width: 720px; margin: 0 auto; text-align: left;
}
.es-example {
  background: var(--bg-2); border: 1px solid var(--border-subtle);
  border-radius: 12px; padding: 16px 18px;
  transition: border-color 0.2s, transform 0.2s;
}
.es-example:hover { border-color: var(--gold-dim); transform: translateY(-1px); }
.es-ex-label { font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--gold); margin-bottom: 6px; font-weight: 600; }
.es-ex-title { font-size: 14px; font-weight: 600; color: var(--text); margin-bottom: 4px; letter-spacing: -0.005em; }
.es-ex-body { font-size: 12px; color: var(--muted); line-height: 1.5; }
.es-cta { margin-top: 32px; padding: 14px 28px; font-size: 14px; }
@media (max-width: 760px) {
  .empty-state-card { padding: 32px 22px !important; }
  .es-headline { font-size: 22px; }
  .es-quote { font-size: 14px; padding: 14px 20px; }
  .es-examples { grid-template-columns: 1fr; }
}


/* "What Fairway builds for you" section */
.wfb-section, .demo-preview-section { margin-top: 56px; }
.wfb-eyebrow {
  font-size: 10px; letter-spacing: 0.32em; text-transform: uppercase;
  color: var(--gold); font-weight: 600; margin-bottom: 12px; text-align: center;
}
.wfb-title {
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 28px; font-weight: 700; line-height: 1.18;
  letter-spacing: -0.015em; color: var(--text);
  text-align: center; margin-bottom: 28px;
}
.wfb-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.wfb-card {
  background: linear-gradient(180deg, var(--panel) 0%, var(--bg-2) 100%);
  border: 1px solid var(--gold-dim); border-radius: 14px;
  padding: 28px 24px; text-align: center;
  transition: transform 0.2s, border-color 0.2s, box-shadow 0.2s;
}
.wfb-card:hover { transform: translateY(-2px); border-color: var(--gold); box-shadow: 0 12px 30px rgba(201,169,97,0.12); }
.wfb-card .fg-icon { width: 44px !important; height: 44px !important; margin: 0 auto 14px; }
.wfb-card-title {
  font-size: 16px; font-weight: 600; color: var(--text);
  margin-bottom: 8px; letter-spacing: -0.005em;
  font-family: Georgia, serif;
}
.wfb-card-body { font-size: 13px; line-height: 1.55; color: var(--muted); }

/* Demo Rivalry preview card on dashboard */
.demo-preview-card {
  background:
    radial-gradient(circle at 0% 0%, rgba(201,169,97,0.1) 0%, transparent 50%),
    radial-gradient(circle at 100% 100%, rgba(166,69,69,0.08) 0%, transparent 50%),
    linear-gradient(180deg, var(--panel) 0%, var(--bg-2) 100%);
  border: 1px solid var(--gold-dim); border-radius: 16px;
  padding: 32px 28px; cursor: pointer;
  transition: transform 0.2s, border-color 0.2s, box-shadow 0.2s;
  position: relative; overflow: hidden;
}
.demo-preview-card::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px;
  background: linear-gradient(90deg, var(--gold), var(--tension), var(--gold));
  opacity: 0.6;
}
.demo-preview-card:hover { transform: translateY(-2px); border-color: var(--gold); box-shadow: 0 16px 40px rgba(0,0,0,0.3); }
.dpc-tag {
  font-size: 10px; letter-spacing: 0.28em; text-transform: uppercase;
  color: var(--gold); font-weight: 600; margin-bottom: 14px; text-align: center;
}
.dpc-matchup {
  display: flex; align-items: baseline; justify-content: center; gap: 16px;
  font-family: Georgia, serif; font-size: 30px; font-weight: 700;
  letter-spacing: -0.01em; color: var(--text-2); margin-bottom: 16px;
}
.dpc-name.leading { color: var(--gold); }
.dpc-vs { font-size: 16px; color: var(--muted-2); font-weight: 400; letter-spacing: 0.08em; }
.dpc-score-row {
  display: flex; align-items: center; justify-content: center; gap: 18px;
  margin-bottom: 14px;
}
.dpc-score { font-size: 56px; font-weight: 700; line-height: 1; font-variant-numeric: tabular-nums; letter-spacing: -0.02em; }
.dpc-score.win { color: var(--gold); }
.dpc-score.loss { color: var(--muted); }
.dpc-sep { font-size: 28px; color: var(--muted-2); }
.dpc-story {
  font-family: Georgia, serif; font-style: italic;
  text-align: center; font-size: 14px; color: var(--text-2);
  margin-bottom: 18px; line-height: 1.5; max-width: 480px; margin-left: auto; margin-right: auto;
}
.dpc-cta-row { text-align: center; }
.dpc-cta {
  font-size: 12px; color: var(--gold); letter-spacing: 0.16em;
  text-transform: uppercase; font-weight: 600;
}
@media (max-width: 760px) {
  .wfb-grid { grid-template-columns: 1fr; }
  .wfb-title { font-size: 22px; }
  .demo-preview-card { padding: 22px 18px; }
  .dpc-matchup { font-size: 22px; gap: 10px; }
  .dpc-score { font-size: 42px; }
}


/* Narrative block — sports-commentator insights */
.narrative-block {
  background: linear-gradient(180deg, var(--panel) 0%, var(--bg-2) 100%);
  border: 1px solid var(--gold-dim); border-radius: 14px;
  padding: 20px 22px; margin: 20px 0;
  position: relative; overflow: hidden;
}
.narrative-block::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px;
  background: linear-gradient(90deg, transparent, var(--gold), transparent);
}
.narrative-label { font-size: 10px; letter-spacing: 0.32em; text-transform: uppercase; color: var(--gold); font-weight: 600; margin-bottom: 14px; }
.narrative-list { list-style: none; padding: 0; margin: 0; }
.narrative-list li { display: flex; align-items: center; gap: 12px; padding: 10px 0; border-bottom: 1px dashed var(--border-subtle); font-size: 13px; line-height: 1.5; color: var(--text-2); font-family: Georgia, serif; }
.narrative-list li:last-child { border-bottom: none; }
.narrative-icon { flex-shrink: 0; width: 22px; height: 22px; display: inline-flex; }
.narrative-text { flex: 1; }

/* Athlete profile card */
.athlete-card {
  background: linear-gradient(180deg, var(--panel) 0%, var(--bg-2) 100%);
  border: 1px solid var(--gold-dim); border-radius: 18px;
  padding: 32px 28px; position: relative; overflow: hidden;
  margin-bottom: 24px;
}
.athlete-card::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, transparent, var(--gold), transparent);
}
.athlete-eyebrow { font-size: 10px; letter-spacing: 0.36em; text-transform: uppercase; color: var(--gold); font-weight: 600; margin-bottom: 10px; }
.athlete-name { font-family: Georgia, serif; font-size: 38px; font-weight: 700; letter-spacing: -0.02em; line-height: 1.05; margin-bottom: 6px; color: var(--text); }
.athlete-archetype { display: inline-flex; align-items: center; gap: 10px; padding: 8px 14px; border-radius: 999px; background: rgba(201,169,97,0.1); border: 1px solid var(--gold-dim); font-size: 12px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--gold); font-weight: 600; margin-bottom: 20px; }
.athlete-archetype-icon { font-size: 16px; line-height: 1; }
.athlete-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; border-top: 1px solid var(--border-subtle); padding-top: 22px; margin-top: 18px; }
.athlete-stat { text-align: center; padding: 0 12px; border-right: 1px solid var(--border-subtle); }
.athlete-stat:last-child { border-right: none; }
.athlete-stat-value { font-size: 30px; font-weight: 700; color: var(--text); letter-spacing: -0.02em; font-variant-numeric: tabular-nums; font-family: Georgia, serif; line-height: 1; margin-bottom: 6px; }
.athlete-stat-value.accent { color: var(--gold); }
.athlete-stat-label { font-size: 9px; letter-spacing: 0.24em; text-transform: uppercase; color: var(--muted); font-weight: 600; }
.athlete-traits { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 18px; }
.athlete-trait { background: var(--bg-2); border: 1px solid var(--border-subtle); border-radius: 999px; padding: 6px 14px; font-size: 11px; color: var(--text-2); }
.athlete-trait strong { color: var(--gold); }
@media (max-width: 760px) {
  .athlete-card { padding: 24px 18px; }
  .athlete-name { font-size: 28px; }
  .athlete-stats { grid-template-columns: repeat(2, 1fr); gap: 18px 0; }
  .athlete-stat:nth-child(2n) { border-right: none; }
  .athlete-stat:nth-child(1), .athlete-stat:nth-child(2) { border-bottom: 1px solid var(--border-subtle); padding-bottom: 18px; margin-bottom: 18px; }
  .athlete-stat-value { font-size: 24px; }
}

/* Cinematic rivalry detail */
.cine-rivalry {
  background: radial-gradient(circle at 50% 0%, rgba(201,169,97,0.12) 0%, transparent 50%), linear-gradient(180deg, var(--panel) 0%, var(--bg-2) 100%);
  border: 1px solid var(--gold-dim); border-radius: 18px;
  padding: 36px 32px 28px; position: relative; overflow: hidden;
  margin-bottom: 24px;
}
.cine-rivalry::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, var(--accent-2), var(--gold), var(--tension));
}
.cine-meta { font-size: 10px; letter-spacing: 0.32em; text-transform: uppercase; color: var(--gold); font-weight: 600; text-align: center; margin-bottom: 18px; }
.cine-matchup { display: flex; align-items: baseline; justify-content: center; gap: 16px; font-family: Georgia, serif; font-size: 36px; font-weight: 700; letter-spacing: -0.015em; margin-bottom: 18px; flex-wrap: wrap; }
.cine-matchup .me { color: var(--gold); }
.cine-matchup .them { color: var(--text-2); }
.cine-matchup.losing .me { color: var(--text-2); }
.cine-matchup.losing .them { color: var(--gold); }
.cine-vs { font-size: 18px; color: var(--muted-2); font-weight: 400; letter-spacing: 0.1em; }
.cine-score-row { display: flex; align-items: center; justify-content: center; gap: 22px; margin-bottom: 18px; }
.cine-score { font-size: 72px; font-weight: 700; line-height: 1; font-variant-numeric: tabular-nums; letter-spacing: -0.02em; font-family: Georgia, serif; color: var(--text); }
.cine-score.win { color: var(--gold); text-shadow: 0 4px 24px rgba(201,169,97,0.3); }
.cine-score.loss { color: var(--muted); }
.cine-sep { font-size: 32px; color: var(--muted-2); font-weight: 300; }
.cine-tagline { text-align: center; font-family: Georgia, serif; font-style: italic; font-size: 15px; color: var(--text-2); max-width: 480px; margin: 0 auto 22px; line-height: 1.5; }
.cine-divider { height: 1px; background: var(--border-subtle); margin: 24px 0; }
.cine-section-label { font-size: 10px; letter-spacing: 0.28em; text-transform: uppercase; color: var(--gold); font-weight: 600; margin-bottom: 14px; }
.cine-section-title { font-family: Georgia, serif; font-size: 20px; font-weight: 600; color: var(--text); margin-bottom: 12px; letter-spacing: -0.005em; }
.last-battle-card { background: var(--bg-2); border: 1px solid var(--border-subtle); border-radius: 12px; padding: 18px 22px; margin-bottom: 22px; }
.last-battle-course { font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--muted); margin-bottom: 8px; }
.last-battle-story { font-family: Georgia, serif; font-size: 15px; color: var(--text); line-height: 1.55; margin-bottom: 12px; }
.last-battle-scores { display: flex; gap: 18px; align-items: baseline; font-variant-numeric: tabular-nums; }
.last-battle-scores .lb-num { font-size: 22px; font-weight: 700; font-family: Georgia, serif; }
.last-battle-scores .lb-num.win { color: var(--gold); }
.last-battle-scores .lb-num.loss { color: var(--muted); }

@media (max-width: 760px) {
  .cine-rivalry { padding: 24px 18px; }
  .cine-matchup { font-size: 24px; gap: 10px; }
  .cine-score { font-size: 56px; }
}


.weather-autofill-btn {
  float: right;
  background: rgba(201,169,97,0.1);
  border: 1px solid var(--gold-dim);
  color: var(--gold);
  border-radius: 999px;
  padding: 2px 10px;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.06em;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s;
  font-family: inherit;
  min-height: 20px;
}
.weather-autofill-btn:hover { background: rgba(201,169,97,0.2); border-color: var(--gold); }
.weather-autofill-btn:disabled { opacity: 0.5; cursor: wait; }


.weather-autofill-cta {
  display: flex; align-items: center; gap: 12px;
  width: 100%; padding: 14px 18px;
  background: linear-gradient(135deg, rgba(201,169,97,0.12), rgba(201,169,97,0.06));
  border: 1px solid var(--gold-dim);
  border-radius: 12px;
  color: var(--gold);
  font-size: 14px; font-weight: 600;
  font-family: inherit;
  cursor: pointer;
  letter-spacing: -0.005em;
  transition: border-color 0.15s, background 0.15s, transform 0.15s;
  min-height: 50px;
}
.weather-autofill-cta:hover {
  border-color: var(--gold);
  background: linear-gradient(135deg, rgba(201,169,97,0.18), rgba(201,169,97,0.08));
  transform: translateY(-1px);
}
.weather-autofill-cta span { flex: 1; text-align: left; }
.weather-autofill-cta:disabled { opacity: 0.6; cursor: wait; transform: none; }
.weather-or-divider {
  text-align: center; margin: 14px 0 10px;
  font-size: 10px; letter-spacing: 0.24em; text-transform: uppercase;
  color: var(--muted-2); position: relative;
}
.weather-or-divider::before, .weather-or-divider::after {
  content: ''; position: absolute; top: 50%; width: calc(50% - 60px);
  height: 1px; background: var(--border-subtle);
}
.weather-or-divider::before { left: 0; }
.weather-or-divider::after { right: 0; }

/* ===================== FGL SEASON TAB ===================== */
.tab-fgl { font-weight: 800 !important; letter-spacing: 0.08em; }
.tab-fgl.active { color: var(--gold-bright) !important; }

.fgl-hero {
  text-align: center; padding: 28px 20px 24px; margin-bottom: 22px;
  background:
    radial-gradient(120% 90% at 50% -10%, rgba(201,169,97,0.12), transparent 60%),
    linear-gradient(180deg, var(--panel) 0%, var(--bg-2) 100%);
  border: 1px solid var(--gold-dim); border-radius: 18px; position: relative; overflow: hidden;
}
.fgl-eyebrow { font-size: 10px; letter-spacing: 0.32em; color: var(--gold-dim); text-transform: uppercase; }
.fgl-title {
  font-size: clamp(30px, 8vw, 46px); line-height: 1; margin: 8px 0 10px;
  background: linear-gradient(180deg, #f0eee5, var(--gold) 70%, var(--gold-dim));
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
  letter-spacing: -0.02em;
}
.fgl-sub { color: var(--muted); font-size: 13px; max-width: 460px; margin: 0 auto; line-height: 1.55; }
.fgl-years { display: flex; gap: 6px; justify-content: center; margin-top: 14px; flex-wrap: wrap; }
.fgl-year-btn {
  background: var(--panel-2); border: 1px solid var(--border); color: var(--muted);
  padding: 5px 14px; border-radius: 999px; font-size: 12px; font-weight: 600; cursor: pointer;
}
.fgl-year-btn.active { border-color: var(--gold); color: var(--gold-bright); background: rgba(201,169,97,0.1); }
.fgl-hero-stats {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin: 20px auto 16px; max-width: 460px;
}
.fgl-hs-val { font-size: 20px; font-weight: 800; color: var(--gold-bright); }
.fgl-hs-lab { font-size: 9px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted-2); margin-top: 2px; }
.fgl-progress { height: 5px; background: var(--panel-2); border-radius: 999px; overflow: hidden; max-width: 460px; margin: 0 auto; }
.fgl-progress-fill { height: 100%; background: linear-gradient(90deg, var(--gold-dim), var(--gold-bright)); border-radius: 999px; }
.fgl-progress-lab { font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--muted-2); margin-top: 8px; }

/* Podium */
.fgl-podium { display: flex; align-items: flex-end; justify-content: center; gap: 10px; margin-bottom: 22px; }
.fgl-pod {
  flex: 1; max-width: 130px; text-align: center; padding: 14px 8px 0;
  background: linear-gradient(180deg, var(--panel) 0%, var(--bg-2) 100%);
  border: 1px solid var(--border); border-radius: 14px 14px 0 0; position: relative;
}
.fgl-pod.me { border-color: var(--gold); }
.fgl-pod-1 .fgl-pod-bar { height: 54px; }
.fgl-pod-2 .fgl-pod-bar { height: 36px; }
.fgl-pod-3 .fgl-pod-bar { height: 24px; }
.fgl-pod-bar { background: linear-gradient(180deg, rgba(201,169,97,0.18), transparent); border-radius: 8px 8px 0 0; margin-top: 12px; }
.fgl-pod-1 { transform: translateY(-12px); border-color: var(--gold); }
.fgl-pod-medal {
  width: 26px; height: 26px; border-radius: 999px; margin: 0 auto 8px; font-size: 12px; font-weight: 800;
  display: flex; align-items: center; justify-content: center; color: #060d0a;
}
.fgl-pod-medal.gold { background: linear-gradient(180deg, #e8c97a, #c9a961); }
.fgl-pod-medal.silver { background: linear-gradient(180deg, #f0eee5, #cdc9be); }
.fgl-pod-medal.bronze { background: linear-gradient(180deg, #d8a878, #a9794f); }
.fgl-pod-avatar {
  width: 42px; height: 42px; border-radius: 999px; margin: 0 auto 6px;
  background: var(--panel-2); border: 1px solid var(--gold-dim);
  display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 14px; color: var(--gold-bright);
}
.fgl-pod-name { font-size: 12px; font-weight: 700; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fgl-pod-pts { font-size: 18px; font-weight: 800; color: var(--gold-bright); margin-top: 2px; }
.fgl-pod-pts span { font-size: 10px; color: var(--muted-2); font-weight: 600; margin-left: 2px; }

/* Board */
.fgl-board { background: linear-gradient(180deg, var(--panel) 0%, var(--bg-2) 100%); border: 1px solid var(--border); border-radius: 16px; overflow: hidden; }
.fgl-board-head {
  padding: 14px 16px; font-size: 12px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted);
  border-bottom: 1px solid var(--border); display: flex; justify-content: space-between; align-items: baseline;
}
.fgl-board-head span { font-size: 10px; font-weight: 500; text-transform: none; letter-spacing: 0; color: var(--muted-2); }
.fgl-row {
  display: flex; align-items: center; gap: 12px; padding: 12px 16px; cursor: pointer;
  border-bottom: 1px solid var(--border); transition: background .15s;
}
.fgl-row:hover { background: var(--panel-2); }
.fgl-row.me { background: rgba(201,169,97,0.07); }
.fgl-row.me .fgl-row-name { color: var(--gold-bright); }
.fgl-rank { width: 22px; text-align: center; font-weight: 800; font-size: 15px; color: var(--muted); }
.fgl-row.me .fgl-rank { color: var(--gold); }
.fgl-row-avatar {
  width: 38px; height: 38px; border-radius: 999px; flex-shrink: 0;
  background: var(--panel-2); border: 1px solid var(--gold-dim);
  display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 13px; color: var(--gold-bright);
}
.fgl-row-main { flex: 1; min-width: 0; }
.fgl-row-name { font-size: 15px; font-weight: 700; color: var(--text); display: flex; align-items: center; gap: 8px; }
.fgl-prov { font-size: 9px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted-2); border: 1px solid var(--border); border-radius: 4px; padding: 1px 5px; font-weight: 600; }
.fgl-row-meta { font-size: 11px; color: var(--muted-2); margin-top: 2px; }
.fgl-trend { font-size: 12px; font-weight: 700; }
.fgl-trend.up { color: #6fae87; }
.fgl-trend.down { color: #c97a7a; }
.fgl-trend.flat { color: var(--muted-2); }
.fgl-row-pts { font-size: 20px; font-weight: 800; color: var(--gold-bright); text-align: right; min-width: 60px; }
.fgl-row-pts span { display: block; font-size: 9px; color: var(--muted-2); font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; }
.fgl-breakdown { background: var(--bg); border-bottom: 1px solid var(--border); padding: 12px 16px; }
.fgl-bd-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }
.fgl-bd-item { display: flex; justify-content: space-between; font-size: 12px; color: var(--muted); padding: 6px 10px; background: var(--panel); border-radius: 8px; }
.fgl-bd-item strong { color: var(--text); }
.fgl-bd-item.total { grid-column: 1 / -1; border: 1px solid var(--gold-dim); }
.fgl-bd-item.total strong { color: var(--gold-bright); }

/* Empty + tip + explainer */
.fgl-empty { text-align: center; padding: 40px 24px; background: linear-gradient(135deg, rgba(201,169,97,0.06), rgba(109,168,136,0.04)); border: 1px dashed var(--gold-dim); border-radius: 16px; }
.fgl-empty-icon { width: 72px; height: 72px; margin: 0 auto 14px; display: flex; align-items: center; justify-content: center; border-radius: 16px; background: rgba(13,24,19,0.6); border: 1px solid var(--gold-dim); }
.fgl-empty h3 { font-size: 20px; color: var(--text); margin-bottom: 10px; letter-spacing: -0.01em; text-transform: none; }
.fgl-empty p { color: var(--muted); font-size: 13px; max-width: 420px; margin: 0 auto 18px; line-height: 1.6; }
.fgl-empty-cta { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.fgl-tip { margin-top: 14px; padding: 12px 16px; font-size: 12px; color: var(--muted); background: var(--panel); border: 1px solid var(--border); border-radius: 12px; text-align: center; }
.fgl-explain { margin-top: 18px; background: var(--panel); border: 1px solid var(--border); border-radius: 12px; overflow: hidden; }
.fgl-explain summary { padding: 14px 16px; cursor: pointer; font-size: 13px; font-weight: 700; color: var(--text); list-style: none; }
.fgl-explain summary::-webkit-details-marker { display: none; }
.fgl-explain summary::after { content: '＋'; float: right; color: var(--gold-dim); }
.fgl-explain[open] summary::after { content: '−'; }
.fgl-explain-body { padding: 0 16px 16px; font-size: 13px; color: var(--muted); line-height: 1.6; }
.fgl-explain-body ul { margin: 10px 0; padding-left: 18px; }
.fgl-explain-body li { margin-bottom: 6px; }
.fgl-explain-note { font-size: 12px; color: var(--muted-2); font-style: italic; margin-top: 6px; }

/* ===================== AI CADDIE ===================== */
.caddie-fab {
  position: fixed; left: 18px; bottom: 22px; z-index: 55;
  width: 54px; height: 54px; border-radius: 999px; border: 1px solid var(--gold);
  background: linear-gradient(180deg, var(--panel-2), var(--bg-2));
  box-shadow: 0 6px 20px rgba(0,0,0,0.4), 0 0 0 1px rgba(201,169,97,0.3);
  cursor: pointer; display: inline-flex; align-items: center; justify-content: center;
  padding-bottom: env(safe-area-inset-bottom, 0);
}
.caddie-fab:hover { transform: translateY(-1px); }
.caddie-fab-icon { font-size: 22px; line-height: 1; } .caddie-fab-svg { width: 32px; height: 32px; }
.caddie-overlay {
  position: fixed; inset: 0; z-index: 1500; background: rgba(3,7,5,0.6);
  backdrop-filter: blur(4px); display: flex; align-items: flex-end; justify-content: center;
}
.caddie-panel {
  width: 100%; max-width: 480px; height: min(80vh, 640px);
  background: linear-gradient(180deg, var(--panel) 0%, var(--bg) 100%);
  border: 1px solid var(--gold-dim); border-bottom: none;
  border-radius: 20px 20px 0 0; display: flex; flex-direction: column; overflow: hidden;
  animation: caddieUp .22s ease;
}
@keyframes caddieUp { from { transform: translateY(30px); opacity: 0 } to { transform: translateY(0); opacity: 1 } }
.caddie-head { display: flex; align-items: center; justify-content: space-between; padding: 16px; border-bottom: 1px solid var(--border); }
.caddie-head-id { display: flex; align-items: center; gap: 10px; }
.caddie-avatar { width: 40px; height: 40px; border-radius: 999px; background: linear-gradient(180deg, #e8c97a, #c9a961); display: flex; align-items: center; justify-content: center; font-size: 20px; }
.caddie-name { font-weight: 800; font-size: 15px; color: var(--text); }
.caddie-status { font-size: 11px; color: var(--gold-dim); }
.caddie-close { background: none; border: none; color: var(--muted); font-size: 18px; cursor: pointer; padding: 6px; }
.caddie-messages { flex: 1; overflow-y: auto; padding: 16px; display: flex; flex-direction: column; gap: 12px; }
.caddie-msg { max-width: 84%; padding: 11px 14px; border-radius: 14px; font-size: 14px; line-height: 1.5; }
.caddie-msg.bot { align-self: flex-start; background: var(--panel-2); border: 1px solid var(--border); color: var(--text); border-bottom-left-radius: 4px; }
.caddie-msg.user { align-self: flex-end; background: linear-gradient(180deg, #d8b975, #c9a961); color: #1a1408; font-weight: 500; border-bottom-right-radius: 4px; }
.caddie-msg.bot strong { color: var(--gold-bright); }
.caddie-msg.bot .cd-stat { color: var(--gold-bright); font-weight: 700; }
.caddie-chips { display: flex; gap: 8px; padding: 0 16px 10px; flex-wrap: wrap; }
.caddie-chip { background: var(--panel-2); border: 1px solid var(--gold-dim); color: var(--gold); border-radius: 999px; padding: 7px 13px; font-size: 12px; font-weight: 600; cursor: pointer; white-space: nowrap; }
.caddie-chip:hover { background: rgba(201,169,97,0.12); }
.caddie-input-row { display: flex; gap: 8px; padding: 12px 16px calc(12px + env(safe-area-inset-bottom, 0)); border-top: 1px solid var(--border); }
.caddie-input { flex: 1; background: var(--panel-2); border: 1px solid var(--border); border-radius: 12px; padding: 13px 14px; color: var(--text); font-size: 15px; font-family: inherit; -webkit-appearance: none; }
.caddie-input:focus { outline: none; border-color: var(--gold); }
.caddie-send { width: 46px; border-radius: 12px; border: none; background: linear-gradient(180deg, #d8b975, #c9a961); color: #1a1408; font-size: 20px; font-weight: 800; cursor: pointer; }
@media (max-width: 640px) { .caddie-fab { width: 48px; height: 48px; left: 14px; bottom: 18px; } .caddie-fab-icon { font-size: 19px; } }

/* ===================== TEAM RIVALRY / RYDER CUP ===================== */
.te-list { display: grid; gap: 10px; }
.te-card { background: var(--panel-2); border: 1px solid var(--border); border-radius: 12px; padding: 12px 14px; cursor: pointer; }
.te-card:hover { border-color: var(--gold-dim); }
.te-card-name { font-weight: 700; font-size: 14px; color: var(--text); }
.te-card-score { display: flex; gap: 8px; align-items: center; margin-top: 4px; font-size: 13px; color: var(--muted); }
.te-card-score .lead { color: var(--gold-bright); font-weight: 700; }
.te-dash { color: var(--muted-2); }
.te-card-meta { font-size: 11px; color: var(--muted-2); margin-top: 4px; }
.te-scoreboard { display: flex; align-items: center; justify-content: space-between; gap: 12px; background: linear-gradient(180deg, var(--panel), var(--bg-2)); border: 1px solid var(--gold-dim); border-radius: 14px; padding: 18px 16px; margin-bottom: 14px; }
.te-team { flex: 1; text-align: center; opacity: 0.85; }
.te-team.lead { opacity: 1; }
.te-team-name { font-size: 12px; color: var(--muted); font-weight: 600; text-transform: uppercase; letter-spacing: 0.06em; }
.te-team-score { font-size: 38px; font-weight: 800; color: var(--text); line-height: 1; margin-top: 6px; }
.te-team.lead .te-team-score { color: var(--gold-bright); }
.te-vs { color: var(--muted-2); font-size: 20px; font-weight: 700; }
.te-matches { display: grid; gap: 8px; }
.te-match { background: var(--panel-2); border: 1px solid var(--border); border-radius: 10px; padding: 10px 12px; }
.te-match-label { font-size: 13px; color: var(--text); margin-bottom: 8px; }
.te-match-btns { display: flex; gap: 6px; }
.te-res { flex: 1; padding: 8px 6px; border-radius: 8px; border: 1px solid var(--border); background: var(--bg); color: var(--muted); font-size: 12px; font-weight: 600; cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.te-res.on { background: linear-gradient(180deg, #d8b975, #c9a961); color: #1a1408; border-color: var(--gold); }

/* ===================== MOBILE "MORE" TAB MENU ===================== */
.tabs-more { display: none; }
.more-menu {
  display: none; position: fixed; inset: 0; z-index: 2500;
  background: linear-gradient(180deg, var(--bg) 0%, var(--bg-2) 100%);
  overflow-y: auto; padding: env(safe-area-inset-top, 24px) 16px 24px;
  -webkit-overflow-scrolling: touch;
}
.more-menu.open { display: block; animation: moreSlide .22s ease; }
@keyframes moreSlide { from { transform: translateY(-12px); opacity: 0 } to { transform: translateY(0); opacity: 1 } }
.more-menu-head { display: flex; justify-content: space-between; align-items: center; padding: 6px 4px 14px; border-bottom: 1px solid var(--border); margin-bottom: 12px; }
.more-menu-title { font-size: 11px; letter-spacing: 0.32em; color: var(--gold-dim); text-transform: uppercase; font-weight: 800; }
.more-menu-close { background: none; border: none; color: var(--muted); font-size: 22px; cursor: pointer; padding: 6px 10px; }
.more-menu.open { display: block; }
.more-menu .more-items { display: grid; gap: 8px; max-width: 480px; margin: 0 auto; }
.more-menu .more-items button {
  display: block; width: 100%; text-align: left; background: var(--panel-2); border: 1px solid var(--border);
  color: var(--text); font-size: 16px; padding: 18px 20px; cursor: pointer; font-family: inherit;
  border-radius: 12px; font-weight: 600; letter-spacing: 0.04em;
}
.more-menu .more-items button:hover { border-color: var(--gold-dim); }
.more-menu .more-items button.active { background: linear-gradient(180deg, rgba(201,169,97,0.16), var(--panel-2)); border-color: var(--gold); color: var(--gold-bright); }
@media (max-width: 640px) {
  .tab-secondary { display: none !important; }
  .tabs-more { display: inline-flex; align-items: center; }
  .tabs-more.has-active { color: var(--gold-bright); }
}

/* ===================== INVITE THE GANG ===================== */
.invite-hero { text-align: center; padding: 26px 20px; margin-bottom: 18px;
  background: radial-gradient(120% 90% at 50% -10%, rgba(201,169,97,0.12), transparent 60%), linear-gradient(180deg, var(--panel) 0%, var(--bg-2) 100%);
  border: 1px solid var(--gold-dim); border-radius: 18px; }
.invite-hero-eyebrow { font-size: 10px; letter-spacing: 0.32em; color: var(--gold-dim); text-transform: uppercase; }
.invite-hero-title { font-size: clamp(24px, 6vw, 34px); margin: 6px 0 8px; color: var(--text); letter-spacing: -0.02em; }
.invite-hero-sub { color: var(--muted); font-size: 13px; max-width: 460px; margin: 0 auto 14px; line-height: 1.5; }
.invite-hero-actions { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.invite-link-row { display: flex; gap: 8px; align-items: stretch; margin-top: 8px; }
.invite-link-input { flex: 1; background: var(--panel-2); border: 1px solid var(--border); border-radius: 10px; color: var(--text); font-size: 12px; padding: 11px 12px; font-family: Georgia, 'Times New Roman', serif; overflow: hidden; text-overflow: ellipsis; }
.invite-btn-row { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; }
.invite-btn-row .btn { flex: 1; min-width: 110px; }
.invite-qr-wrap { display: flex; justify-content: center; margin-top: 16px; padding: 14px; background: white; border-radius: 12px; }
.invite-qr-wrap img { display: block; width: 180px; height: 180px; }
.invite-step { display: flex; gap: 10px; margin-top: 14px; align-items: flex-start; }
.invite-step-num { width: 22px; height: 22px; border-radius: 999px; background: var(--gold); color: #1a1408; font-weight: 800; font-size: 12px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; margin-top: 1px; }
.invite-step-text { font-size: 13px; color: var(--muted); line-height: 1.5; }

/* ===================== WEEKLY RECAP STRIPE ===================== */
.week-recap { display: flex; align-items: center; gap: 12px; padding: 12px 14px; background: linear-gradient(90deg, rgba(201,169,97,0.08), rgba(201,169,97,0.02));
  border: 1px solid var(--gold-dim); border-radius: 14px; margin-bottom: 16px; cursor: pointer; }
.week-recap-icon { font-size: 22px; flex-shrink: 0; }
.week-recap-main { flex: 1; min-width: 0; }
.week-recap-eyebrow { font-size: 9px; letter-spacing: 0.18em; color: var(--gold-dim); text-transform: uppercase; }
.week-recap-headline { font-size: 14px; font-weight: 700; color: var(--text); margin-top: 2px; }
.week-recap-sub { font-size: 12px; color: var(--muted); margin-top: 1px; }
.week-recap-arrow { color: var(--gold); font-size: 18px; flex-shrink: 0; }

/* ===================== QUICK "LOG AS LAST" ===================== */
.quick-log-card { background: linear-gradient(180deg, rgba(201,169,97,0.08) 0%, var(--bg-2) 100%);
  border: 1px solid var(--gold-dim); border-radius: 14px; padding: 16px; margin-bottom: 18px; }
.quick-log-eyebrow { font-size: 10px; letter-spacing: 0.18em; color: var(--gold-dim); text-transform: uppercase; }
.quick-log-title { font-size: 15px; font-weight: 700; color: var(--text); margin: 4px 0; }
.quick-log-meta { font-size: 12px; color: var(--muted); margin-bottom: 10px; }
.quick-log-actions { display: flex; gap: 8px; flex-wrap: wrap; }

/* ===================== FGL v2 — drama cards, last5, how-it-works ===================== */
.drama-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 10px; margin: 14px 0 18px; }
.drama-card { display: flex; gap: 12px; padding: 12px 14px; background: linear-gradient(135deg, rgba(201,169,97,0.08), rgba(13,28,21,0.4)); border: 1px solid var(--gold-dim); border-radius: 12px; align-items: flex-start; }
.drama-icon { font-size: 20px; flex-shrink: 0; }
.drama-eyebrow { font-size: 9px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--gold-dim); }
.drama-text { font-size: 13px; color: var(--text); margin-top: 3px; line-height: 1.4; }
.drama-text strong { color: var(--gold-bright); }

.fgl-wdl { color: var(--text); font-weight: 700; }
.fgl-last5 { display: inline-flex; gap: 2px; vertical-align: middle; margin: 0 4px; }
.last5 { display: inline-flex; align-items: center; justify-content: center; width: 16px; height: 16px; border-radius: 4px; font-size: 10px; font-weight: 800; color: #1a1408; }
.last5.W { background: linear-gradient(180deg, #d8b975, #c9a961); }
.last5.D { background: var(--muted-2); color: var(--text); }
.last5.L { background: #c97a7a; color: #1a0606; }
.last5.none { background: transparent; color: var(--muted-2); width: auto; font-size: 11px; }

.fgl-explain-card { margin-top: 18px; padding: 18px 18px 22px; background: linear-gradient(180deg, var(--panel), var(--bg-2)); border: 1px solid var(--gold-dim); border-radius: 14px; text-align: center; }
.fgl-explain-headline { font-family: Georgia, serif; font-style: italic; font-size: 15px; line-height: 1.5; color: var(--text); margin-bottom: 14px; }

/* ===================== HEADER BACKGROUND (cinematic backdrop) ===================== */
.header-bg {
  position: absolute; top: 0; left: 0; right: 0; height: 360px;
  background-image: url('header-bg.jpg');
  background-size: cover; background-position: center top; background-repeat: no-repeat;
  z-index: 0; pointer-events: none; opacity: 0.85;
  mask-image: linear-gradient(180deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0.95) 55%, rgba(0,0,0,0.4) 80%, rgba(0,0,0,0) 100%);
  -webkit-mask-image: linear-gradient(180deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0.95) 55%, rgba(0,0,0,0.4) 80%, rgba(0,0,0,0) 100%);
}
/* Ensure header + tabs sit above the backdrop */
header, .tabs-wrap, .dropdown-menu, .profile-chip, #main, main, section { position: relative; z-index: 1; }
@media (max-width: 640px) {
  .header-bg {
    height: 260px; opacity: 0.95;
    background-position: center 15%;
    background-size: 160% auto;
    mask-image: linear-gradient(180deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0.95) 55%, rgba(0,0,0,0.6) 80%, rgba(0,0,0,0) 100%);
    -webkit-mask-image: linear-gradient(180deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0.95) 55%, rgba(0,0,0,0.6) 80%, rgba(0,0,0,0) 100%);
  }
}

.how-row { margin-top: 14px; }
.how-h { font-size: 10px; letter-spacing: 0.18em; color: var(--gold-dim); text-transform: uppercase; margin-bottom: 8px; }
.how-grid { display: grid; gap: 8px; }
.how-pill { background: var(--panel-2); border: 1px solid var(--border); border-radius: 10px; padding: 10px 12px; }
.how-pill strong { display: block; color: var(--gold-bright); font-size: 13px; margin-bottom: 2px; }
.how-pill span { font-size: 12px; color: var(--muted); }
.how-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.how-table td { padding: 7px 10px; border-bottom: 1px solid var(--border); color: var(--muted); }
.how-table td:last-child { text-align: right; font-weight: 700; color: var(--gold-bright); }
.how-table tr:last-child td { border-bottom: none; }

/* ===================== NEW ROUND FORM v2 ===================== */
.rnd-row { display: grid; grid-template-columns: 2fr 1fr; gap: 12px; margin-bottom: 10px; }
.rnd-row-3 { grid-template-columns: 1fr 1fr 1fr; }
.rnd-course-field { min-width: 0; }
.chip-btn { background: var(--panel-2); border: 1px solid var(--gold-dim); color: var(--gold); border-radius: 999px; padding: 2px 10px; font-size: 11px; font-weight: 600; cursor: pointer; float: right; margin-left: 6px; font-family: inherit; }
.chip-btn:hover { background: rgba(201,169,97,0.12); }

.rnd-type-wrap { margin: 14px 0 12px; padding: 12px; background: linear-gradient(180deg, var(--panel-2), transparent); border: 1px solid var(--gold-dim); border-radius: 12px; }
.rnd-type-label { font-size: 10px; letter-spacing: 0.22em; color: var(--gold-dim); text-transform: uppercase; margin-bottom: 8px; }
.rnd-type-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.rnd-type-btn { background: var(--panel); border: 1px solid var(--border); border-radius: 10px; padding: 12px 8px; cursor: pointer; text-align: center; font-family: inherit; color: var(--text); transition: border-color .15s, background .15s; }
.rnd-type-btn:hover { border-color: var(--gold-dim); }
.rnd-type-btn.active { border-color: var(--gold); background: linear-gradient(180deg, rgba(201,169,97,0.1), var(--panel)); }
.rnd-type-icon { font-size: 18px; line-height: 1; margin-bottom: 4px; }
.rnd-type-name { font-size: 13px; font-weight: 800; letter-spacing: 0.04em; }
.rnd-type-btn.active .rnd-type-name { color: var(--gold-bright); }
.rnd-type-desc { font-size: 10px; color: var(--muted-2); margin-top: 2px; }
.rnd-type-help { display: block; text-align: center; margin-top: 8px; font-size: 11px; }

.rnd-weather-wrap { margin: 10px 0; padding: 12px; background: var(--panel-2); border: 1px solid var(--border); border-radius: 12px; }
.rnd-weather-btn { width: 100%; display: flex; gap: 14px; align-items: center; background: linear-gradient(180deg, rgba(201,169,97,0.1), var(--panel)); border: 1px solid var(--gold-dim); border-radius: 10px; padding: 14px 16px; cursor: pointer; color: var(--text); font-family: inherit; text-align: left; }
.rnd-weather-btn:hover { background: linear-gradient(180deg, rgba(201,169,97,0.18), var(--panel)); }
.rnd-weather-btn.done { border-color: #6fae87; background: linear-gradient(180deg, rgba(111,174,135,0.1), var(--panel)); }
.rnd-weather-icon { font-size: 24px; flex-shrink: 0; }
.rnd-weather-title { font-size: 14px; font-weight: 700; color: var(--gold-bright); }
.rnd-weather-btn.done .rnd-weather-title { color: #6fae87; }
.rnd-weather-sub { font-size: 12px; color: var(--muted); margin-top: 2px; }
.rnd-weather-alt { display: flex; gap: 8px; margin-top: 8px; justify-content: center; }
.rnd-weather-skip { background: none; border: none; color: var(--muted); font-size: 12px; cursor: pointer; padding: 4px 8px; text-decoration: underline; font-family: inherit; }
.rnd-weather-skip:hover { color: var(--gold); }
.rnd-weather-manual { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--border); }

.rnd-cond { margin: 8px 0; background: var(--panel); border: 1px solid var(--border); border-radius: 10px; }
.rnd-cond summary { padding: 10px 14px; cursor: pointer; font-size: 13px; font-weight: 600; color: var(--text); list-style: none; }
.rnd-cond summary::-webkit-details-marker { display: none; }
.rnd-cond summary::after { content: '＋'; float: right; color: var(--gold-dim); }
.rnd-cond[open] summary::after { content: '−'; }
.rnd-cond summary span { font-weight: 400; color: var(--muted); font-size: 11px; margin-left: 6px; }
.rnd-cond > .rnd-row { padding: 0 14px 14px; }

@media (max-width: 640px) {
  .rnd-row, .rnd-row-3 { grid-template-columns: 1fr; }
  .rnd-row-3 { grid-template-columns: 1fr 1fr; }
  .rnd-type-name { font-size: 12px; }
  .rnd-type-desc { display: none; }
}

/* ===================== MATCH MODE ===================== */
.mm-overlay { position: fixed; inset: 0; z-index: 1800; background: linear-gradient(180deg, #020604 0%, #060d0a 100%); display: flex; align-items: stretch; justify-content: center; overflow-y: auto; animation: mmFadeIn .25s ease; }
@keyframes mmFadeIn { from { opacity: 0 } to { opacity: 1 } }
.mm-shell { width: 100%; max-width: 560px; padding: env(safe-area-inset-top, 16px) 16px env(safe-area-inset-bottom, 24px); display: flex; flex-direction: column; gap: 14px; }
.mm-topbar { display: flex; align-items: center; justify-content: space-between; padding: 8px 4px; }
.mm-close { background: none; border: none; color: var(--muted); font-size: 22px; cursor: pointer; padding: 6px 10px; }
.mm-title { font-size: 11px; letter-spacing: 0.32em; color: var(--gold-dim); font-weight: 800; }
.mm-finish { background: linear-gradient(180deg, #d8b975, #c9a961); color: #1a1408; border: none; border-radius: 999px; padding: 8px 16px; font-size: 13px; font-weight: 800; cursor: pointer; font-family: inherit; }

.mm-scoreboard { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 8px; padding: 14px 12px; background: linear-gradient(180deg, var(--panel), var(--bg-2)); border: 1px solid var(--gold-dim); border-radius: 16px; }
.mm-side { text-align: center; }
.mm-avatar { width: 52px; height: 52px; border-radius: 999px; margin: 0 auto 4px; background: var(--panel-2); border: 2px solid var(--gold-dim); display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 18px; color: var(--gold-bright); }
.mm-side.me .mm-avatar { border-color: var(--gold); }
.mm-name { font-size: 12px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 120px; margin: 0 auto; }
.mm-holes-won { font-size: 38px; font-weight: 800; color: var(--text); line-height: 1; margin-top: 4px; }
.mm-side.me .mm-holes-won { color: var(--gold-bright); }
.mm-holes-lab { font-size: 9px; letter-spacing: 0.16em; color: var(--muted-2); text-transform: uppercase; }
.mm-vs { text-align: center; padding: 0 8px; }
.mm-status { font-size: 13px; font-weight: 800; color: var(--gold-bright); letter-spacing: 0.04em; }
.mm-thru { font-size: 10px; letter-spacing: 0.12em; color: var(--muted-2); text-transform: uppercase; margin-top: 4px; }
.mm-progress { height: 4px; background: var(--panel-2); border-radius: 999px; overflow: hidden; }
.mm-progress-fill { height: 100%; background: linear-gradient(90deg, var(--gold-dim), var(--gold-bright)); width: 0; transition: width .25s; }

.mm-hole-card { background: linear-gradient(180deg, var(--panel), var(--bg-2)); border: 1px solid var(--border); border-radius: 18px; padding: 18px; }
.mm-hole-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.mm-nav-btn { width: 40px; height: 40px; border-radius: 999px; background: var(--panel-2); border: 1px solid var(--border); color: var(--gold); font-size: 22px; cursor: pointer; font-family: inherit; }
.mm-nav-btn:hover { border-color: var(--gold-dim); }
.mm-hole-center { text-align: center; flex: 1; }
.mm-hole-num { font-size: 11px; letter-spacing: 0.22em; color: var(--gold-dim); }
.mm-hole-par { font-size: 14px; color: var(--muted); margin-top: 2px; }
.mm-hole-par span { color: var(--text); font-weight: 700; }
.mm-hole-tags { margin-top: 6px; display: flex; gap: 6px; justify-content: center; }
.mm-tag { font-size: 9px; letter-spacing: 0.14em; padding: 3px 8px; border-radius: 999px; font-weight: 800; }
.mm-tag.mm-double { background: rgba(201,169,97,0.18); color: var(--gold-bright); border: 1px solid var(--gold-dim); }
.mm-tag.mm-press { background: rgba(201,122,122,0.18); color: #f0a5a5; border: 1px solid #8a3f3f; }

.mm-commentator { display: flex; gap: 10px; margin: 14px 0; padding: 12px 14px; background: rgba(201,169,97,0.06); border: 1px solid var(--gold-dim); border-radius: 12px; }
.mm-comm-icon { font-size: 18px; flex-shrink: 0; }
.mm-comm-text { font-family: Georgia, serif; font-style: italic; font-size: 13px; color: var(--text); line-height: 1.5; }
.mm-comm-text strong { color: var(--gold-bright); font-style: normal; }

.mm-quick-label { font-size: 10px; letter-spacing: 0.22em; color: var(--gold-dim); text-transform: uppercase; text-align: center; margin-bottom: 10px; }
.mm-pick { display: grid; grid-template-columns: 1fr auto 1fr; gap: 8px; }
.mm-pick-btn { background: var(--panel-2); border: 1px solid var(--border); border-radius: 12px; padding: 14px 10px; cursor: pointer; color: var(--text); font-family: inherit; font-size: 14px; font-weight: 700; }
.mm-pick-btn.halve { padding: 14px 14px; font-size: 13px; color: var(--muted); }
.mm-pick-btn:hover { border-color: var(--gold-dim); }
.mm-pick-btn.me.on { background: linear-gradient(180deg, #d8b975, #c9a961); color: #1a1408; border-color: var(--gold); }
.mm-pick-btn.opp.on { background: linear-gradient(180deg, #c97a7a, #8a3f3f); color: #1a0606; border-color: #c97a7a; }
.mm-pick-btn.halve.on { background: var(--panel-2); border-color: var(--gold-dim); color: var(--text); }
.mm-pick-name { display: block; font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.mm-advanced { margin-top: 14px; background: var(--panel-2); border: 1px solid var(--border); border-radius: 10px; }
.mm-advanced summary { padding: 10px 14px; cursor: pointer; font-size: 12px; font-weight: 600; color: var(--muted); list-style: none; }
.mm-advanced summary::-webkit-details-marker { display: none; }
.mm-advanced summary span { font-weight: 400; font-size: 11px; color: var(--muted-2); margin-left: 6px; }
.mm-advanced summary::after { content: '＋'; float: right; color: var(--gold-dim); }
.mm-advanced[open] summary::after { content: '−'; }
.mm-scores { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 0 14px 12px; }
.mm-score-field { display: flex; flex-direction: column; gap: 6px; }
.mm-score-field span { font-size: 11px; color: var(--muted); letter-spacing: 0.08em; }
.mm-score-stepper { display: flex; gap: 6px; align-items: center; }
.mm-score-stepper button { width: 32px; height: 32px; border-radius: 8px; background: var(--panel); border: 1px solid var(--border); color: var(--gold); font-size: 16px; cursor: pointer; font-family: inherit; }
.mm-score-stepper input { flex: 1; text-align: center; background: var(--panel); border: 1px solid var(--border); border-radius: 8px; color: var(--text); padding: 7px; font-size: 16px; font-weight: 700; font-family: inherit; }
.mm-adv-row { display: flex; flex-direction: column; gap: 6px; padding: 0 14px 14px; }
.mm-toggle { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--muted); cursor: pointer; }
.mm-toggle input { accent-color: var(--gold); }

.mm-spectator { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 14px; background: var(--panel); border: 1px dashed var(--gold-dim); border-radius: 12px; }
.mm-spec-btn { background: none; border: 1px solid var(--gold-dim); color: var(--gold-bright); padding: 8px 14px; border-radius: 999px; font-size: 12px; font-weight: 700; cursor: pointer; font-family: inherit; }
.mm-spec-hint { font-size: 11px; color: var(--muted-2); }

.mm-entry { display: flex; gap: 12px; align-items: center; margin: 14px 0; padding: 14px 16px; background: linear-gradient(135deg, rgba(201,169,97,0.1), rgba(13,28,21,0.5)); border: 1px solid var(--gold-dim); border-radius: 14px; }
.mm-entry-icon { font-size: 26px; flex-shrink: 0; }
.mm-entry-title { font-size: 14px; font-weight: 800; color: var(--gold-bright); letter-spacing: 0.04em; }
.mm-entry-sub { font-size: 12px; color: var(--muted); margin-top: 3px; line-height: 1.4; }
.mm-entry-body { flex: 1; min-width: 0; }

/* Friend-invite modal — email / SMS / link tabs */
.fm-invite-row { margin-top: 14px; padding: 12px; background: var(--panel-2); border: 1px solid var(--gold-dim); border-radius: 12px; }
.fm-invite-tabs { display: flex; gap: 4px; margin-bottom: 12px; background: var(--bg-2); border-radius: 8px; padding: 3px; }
.fm-tab { flex: 1; background: none; border: none; color: var(--muted); padding: 8px 10px; border-radius: 6px; font-size: 12px; font-weight: 700; cursor: pointer; font-family: inherit; }
.fm-tab.active { background: linear-gradient(180deg, #d8b975, #c9a961); color: #1a1408; }
.fm-hint { font-size: 11px; color: var(--muted); margin-top: 6px; line-height: 1.5; }
.fm-hint strong { color: var(--gold-bright); }

/* ===================== CLUBHOUSE WELCOME ===================== */
.clubhouse-welcome { text-align: center; padding: 4px 0; }
.cw-eyebrow { font-size: 10px; letter-spacing: 0.32em; color: var(--gold-dim); text-transform: uppercase; }
.cw-title { font-size: clamp(32px, 9vw, 44px); margin: 6px 0 8px; background: linear-gradient(180deg, #f0eee5, var(--gold) 70%, var(--gold-dim)); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; letter-spacing: -0.02em; }
.cw-sub { color: var(--muted); font-size: 13px; margin-bottom: 18px; }
.cw-grid { display: grid; grid-template-columns: 1fr; gap: 10px; margin: 0 auto 18px; max-width: 360px; text-align: left; }
.cw-item { display: flex; gap: 12px; align-items: center; padding: 11px 13px; background: var(--panel-2); border: 1px solid var(--border); border-radius: 12px; }
.cw-num { width: 28px; height: 28px; border-radius: 999px; background: linear-gradient(180deg, #e8c97a, #c9a961); color: #1a1408; font-weight: 800; display: flex; align-items: center; justify-content: center; font-size: 13px; flex-shrink: 0; }
.cw-item strong { color: var(--text); font-size: 14px; }
.cw-d { font-size: 12px; color: var(--muted-2); margin-top: 1px; }
.cw-icon { width: 22px; height: 22px; color: var(--gold); flex-shrink: 0; margin-right: 4px; }
.cw-item { gap: 10px; }

/* Insights empty hero — icon-led, almost no copy */
.ins-empty-hero { padding: 24px 16px; text-align: center; }
.ins-empty-eyebrow { font-size: 10px; letter-spacing: 0.32em; color: var(--gold-dim); text-transform: uppercase; }
.ins-empty-h { font-size: clamp(22px, 5vw, 28px); margin: 8px 0 6px; color: var(--text); letter-spacing: -0.01em; text-transform: none; }
.ins-empty-sub { color: var(--muted); font-size: 13px; margin: 0 auto 24px; max-width: 320px; }
.ins-empty-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; max-width: 460px; margin: 0 auto; }
.ins-empty-card { padding: 18px 10px; background: var(--panel); border: 1px solid var(--gold-dim); border-radius: 14px; display: flex; flex-direction: column; align-items: center; gap: 8px; color: var(--gold); transition: border-color .15s; }
.ins-empty-card svg { width: 26px; height: 26px; }
.ins-empty-label { font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); font-weight: 700; }

/* Profile v3 — clean, sectioned */
.profile-shell { max-width: 640px; margin: 0 auto; }
.pp-panel { margin-bottom: 16px; padding: 18px; }
.pp-eyebrow { font-size: 10px; letter-spacing: 0.32em; color: var(--gold-dim); text-transform: uppercase; }
.pp-h { font-size: 18px; margin: 4px 0 4px; letter-spacing: -0.01em; text-transform: none; }
.pp-avatar-row { display:flex; gap:14px; align-items:center; padding:10px 0; }
.pp-avatar-preview { width:48px; height:48px; border-radius:12px; background: var(--panel-2); border: 1px solid var(--gold-dim); display:flex; align-items:center; justify-content:center; font-size:24px; flex-shrink:0; }
.pp-avatar-picker { display:flex; gap:6px; flex-wrap:wrap; }
.pp-account-info { margin: 12px 0; }
.pp-status { padding: 12px 14px; background: var(--panel-2); border: 1px solid var(--border); border-radius: 10px; display:flex; gap:12px; align-items:flex-start; font-size:13px; line-height:1.55; }
.pp-status.synced { border-color: var(--gold-dim); background: linear-gradient(135deg, rgba(201,169,97,0.07), var(--panel-2)); }
.pp-status.local { color: var(--muted); }
.pp-status.synced strong { color: var(--gold-bright); }
.pp-status-icon { width:30px; height:30px; border-radius:999px; background:#1e3326; color:#6fae87; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.pp-status-d { font-size:11px; color: var(--muted-2); margin-top:2px; }
.pp-action-row { display:flex; gap:8px; flex-wrap:wrap; margin:14px 0; }
.pp-action-row .btn { flex:1; min-width:140px; }
.pp-danger { margin-top:14px; background: rgba(201,122,122,0.04); border:1px solid rgba(201,122,122,0.3); border-radius:10px; }
.pp-danger summary { padding:10px 14px; cursor:pointer; font-size:12px; color:#c97a7a; font-weight:700; letter-spacing:0.06em; list-style:none; text-transform:uppercase; }
.pp-danger summary::-webkit-details-marker { display:none; }
.pp-danger > p, .pp-danger > button { margin: 0 14px 14px; }

/* FGL mega hero — the year IS the headline */
.fgl-mega-hero { text-align:center; padding: 36px 18px 28px; margin-bottom: 18px;
  background: radial-gradient(140% 100% at 50% -10%, rgba(201,169,97,0.18), transparent 60%), linear-gradient(180deg, var(--panel) 0%, var(--bg-2) 100%);
  border: 1px solid var(--gold-dim); border-radius: 22px; position: relative; overflow: hidden;
}
.fgl-mega-eyebrow { font-size: 11px; letter-spacing: 0.38em; color: var(--gold-dim); text-transform: uppercase; margin-bottom: 4px; }
.fgl-mega-year { font-size: clamp(68px, 22vw, 132px); line-height: 0.95; margin: 0; letter-spacing: -0.04em; font-weight: 800;
  background: linear-gradient(180deg, #f0eee5, var(--gold) 50%, var(--gold-dim) 100%);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
  font-family: Georgia, 'Times New Roman', serif;
}
.fgl-mega-sub { font-size: clamp(14px, 4vw, 20px); letter-spacing: 0.42em; color: var(--gold-bright); margin-top: -4px; font-weight: 700; }
.fgl-league-pill { margin: 20px auto 12px; max-width: 420px; padding: 12px 14px; background: var(--panel-2); border: 1px solid var(--gold-dim); border-radius: 14px; display: flex; align-items: center; justify-content: space-between; gap: 10px; text-align: left; }
.fgl-league-name { font-weight: 700; color: var(--text); font-size: 14px; }
.fgl-league-code { font-size: 11px; color: var(--muted); letter-spacing: 0.06em; margin-top: 2px; }
.fgl-league-code strong { color: var(--gold-bright); font-family: Georgia, 'Times New Roman', serif; letter-spacing: 0.2em; }
.fgl-league-cta { display: flex; gap: 10px; justify-content: center; margin: 18px 0 12px; flex-wrap: wrap; }
.fgl-mega-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; max-width: 360px; margin: 18px auto 6px; }

/* League invite — big code card */
.lg-code-card { text-align:center; padding: 22px 14px; background: linear-gradient(180deg, rgba(201,169,97,0.12), var(--panel-2)); border: 1px solid var(--gold-dim); border-radius: 16px; }
.lg-code-eyebrow { font-size: 10px; letter-spacing: 0.32em; color: var(--gold-dim); }
.lg-code-big { font-family: Georgia, 'Times New Roman', serif; font-size: clamp(36px, 11vw, 56px); font-weight: 800; letter-spacing: 0.3em; color: var(--gold-bright); margin-top: 6px; }
.lg-members-head { margin: 18px 0 8px; font-size: 11px; letter-spacing: 0.22em; color: var(--gold-dim); text-transform: uppercase; }
.lg-members { display: grid; gap: 6px; }
.lg-member { display: flex; justify-content: space-between; padding: 10px 12px; background: var(--panel-2); border: 1px solid var(--border); border-radius: 10px; font-size: 13px; color: var(--text); }
.lg-member.pending { opacity: 0.65; }
.lg-role { font-size: 11px; color: var(--muted); }

/* Rivalry — manual standings card */
.rms-card { margin: 14px 0; padding: 16px 16px 14px; background: linear-gradient(180deg, var(--panel), var(--bg-2)); border: 1px solid var(--gold-dim); border-radius: 16px; }
.rms-head { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 12px; }
.rms-eyebrow { font-size: 10px; letter-spacing: 0.28em; color: var(--gold-dim); text-transform: uppercase; }
.rms-help { font-size: 10px; color: var(--muted-2); letter-spacing: 0.04em; }
.rms-empty { text-align: center; padding: 6px 0 4px; }
.rms-empty p { color: var(--muted); font-size: 13px; max-width: 360px; margin: 0 auto 12px; line-height: 1.5; }
.rms-score { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 16px; }
.rms-side { text-align: center; opacity: 0.85; }
.rms-side.lead { opacity: 1; }
.rms-name { font-size: 12px; color: var(--muted); font-weight: 600; text-transform: uppercase; letter-spacing: 0.06em; }
.rms-val { font-size: 48px; font-weight: 800; color: var(--text); line-height: 1; margin-top: 4px; }
.rms-side.lead .rms-val { color: var(--gold-bright); }
.rms-vs { color: var(--muted-2); font-size: 16px; font-weight: 700; letter-spacing: 0.18em; }
.rms-meta { text-align: center; font-size: 11px; color: var(--muted-2); margin-top: 10px; }
.rms-pending { margin-top: 14px; padding: 12px 14px; background: rgba(201,169,97,0.08); border: 1px solid var(--gold-dim); border-radius: 12px; }
.rms-pending-eyebrow { font-size: 10px; letter-spacing: 0.22em; color: var(--gold-bright); text-transform: uppercase; margin-bottom: 6px; }
.rms-pending-text { font-size: 13px; color: var(--text); line-height: 1.5; margin-bottom: 10px; }
.rms-pending-text strong { color: var(--gold-bright); }
.rms-pending-actions { display: flex; gap: 8px; }
.rms-pending-actions .btn { flex: 1; }
.rms-actions { display: flex; gap: 8px; justify-content: center; margin-top: 12px; flex-wrap: wrap; }
.rms-input-row { display: grid; grid-template-columns: 1fr auto 1fr; gap: 10px; align-items: center; }
.rms-input-field { display: flex; flex-direction: column; gap: 6px; text-align: center; }
.rms-input-field span { font-size: 11px; color: var(--muted); letter-spacing: 0.06em; }
.rms-input-field input { width: 100%; text-align: center; font-size: 36px; font-weight: 800; padding: 14px 8px; background: var(--panel-2); border: 1px solid var(--gold-dim); border-radius: 12px; color: var(--gold-bright); font-family: inherit; }
.rms-input-dash { font-size: 28px; color: var(--muted-2); font-weight: 800; padding-top: 18px; }
.rms-history { display: grid; gap: 8px; max-height: 60vh; overflow: auto; }
.rms-history-row { display: flex; justify-content: space-between; padding: 10px 12px; background: var(--panel-2); border: 1px solid var(--border); border-radius: 8px; font-size: 13px; color: var(--text); }
.rms-history-row strong { color: var(--gold-bright); }
.rms-history-d { font-size: 11px; color: var(--muted-2); }

/* Challenges — small discreet strip + cards */
.ch-strip { display: flex; gap: 12px; align-items: center; padding: 10px 14px; margin: 10px 0; background: var(--panel-2); border: 1px solid var(--border); border-radius: 12px; cursor: pointer; transition: border-color .15s; }
.ch-strip:hover { border-color: var(--gold-dim); }
.ch-strip-icon { width: 26px; height: 26px; color: var(--gold); flex-shrink: 0; }
.ch-strip-icon svg { width: 100%; height: 100%; }
.ch-strip-body { flex: 1; }
.ch-strip-title { font-size: 13px; font-weight: 700; color: var(--text); letter-spacing: 0.04em; }
.ch-strip-sub { font-size: 11px; color: var(--muted); margin-top: 2px; }
.ch-strip-cta { font-size: 12px; color: var(--gold-bright); font-weight: 700; }
.ch-section-h { font-size: 10px; letter-spacing: 0.22em; color: var(--gold-dim); text-transform: uppercase; margin: 14px 0 8px; }
.ch-card { padding: 12px 14px; background: var(--panel-2); border: 1px solid var(--border); border-radius: 12px; margin-bottom: 8px; }
.ch-card.completed { opacity: 0.7; }
.ch-card.active { border-color: var(--gold-dim); }
.ch-card.awaiting_result { border-color: var(--gold-bright); background: rgba(201,169,97,0.06); }
.ch-card-head { display: flex; justify-content: space-between; gap: 8px; align-items: baseline; }
.ch-card-name { font-size: 14px; font-weight: 700; color: var(--text); }
.ch-card-status { font-size: 11px; color: var(--gold-bright); font-weight: 700; letter-spacing: 0.04em; }
.ch-card-meta { font-size: 11px; color: var(--muted); margin-top: 4px; }
.ch-progress { margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--border); }
.ch-progress-row { display: flex; justify-content: space-between; font-size: 13px; color: var(--text); margin: 4px 0; }
.ch-progress-row strong { color: var(--gold-bright); }
.ch-leader { text-align: center; font-size: 11px; color: var(--gold-bright); margin-top: 6px; font-weight: 700; }
.ch-pending-row { margin-top: 10px; padding: 10px 0 0; border-top: 1px solid var(--border); display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.ch-pending-text { font-size: 12px; color: var(--muted); flex: 1; min-width: 180px; }
.ch-pending-text strong { color: var(--gold-bright); }
.ch-resolve-row { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 6px; }
.ch-res-btn { padding: 14px 6px; font-size: 12px; font-weight: 700; }
.ch-res-btn.on { background: linear-gradient(180deg, #d8b975, #c9a961); color: #1a1408; border-color: var(--gold); }


/* Caddie drop-in tips */
.cd-drop { position: fixed; left: 14px; right: 14px; bottom: calc(80px + env(safe-area-inset-bottom, 0)); max-width: 480px; margin: 0 auto; z-index: 1700;
  background: linear-gradient(180deg, var(--panel), var(--bg-2)); border: 1px solid var(--gold); border-radius: 14px;
  box-shadow: 0 14px 40px rgba(0,0,0,0.5), 0 0 0 1px rgba(201,169,97,0.3);
  display: flex; gap: 12px; align-items: flex-start; padding: 12px 14px; animation: cdDropIn .35s ease; }
@keyframes cdDropIn { from { transform: translateY(24px); opacity: 0 } to { transform: translateY(0); opacity: 1 } }
.cd-drop-av { width: 42px; height: 42px; border-radius: 999px; background: linear-gradient(180deg, #e8c97a, #c9a961); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.cd-drop-body { flex: 1; min-width: 0; }
.cd-drop-name { font-size: 10px; letter-spacing: 0.22em; color: var(--gold-dim); text-transform: uppercase; font-weight: 700; }
.cd-drop-text { font-size: 13px; color: var(--text); line-height: 1.5; margin-top: 3px; }
.cd-drop-text strong { color: var(--gold-bright); }
.cd-drop-close { background: none; border: none; color: var(--muted-2); font-size: 16px; cursor: pointer; padding: 4px 6px; align-self: flex-start; }
.cd-drop-close:hover { color: var(--text); }

/* Caddie mute button */
.caddie-mute { background: none; border: none; color: var(--muted); font-size: 16px; cursor: pointer; padding: 6px 8px; margin-right: 4px; opacity: 0.7; }
.caddie-mute:hover { opacity: 1; }

/* ROUND WIZARD — 3 steps */
.rwz-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 18px; gap: 8px; }
.rwz-back { min-width: 64px; }
.rwz-progress { display: flex; align-items: center; gap: 4px; flex: 1; justify-content: center; }
.rwz-dot { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.rwz-dot > span { width: 28px; height: 28px; border-radius: 999px; background: var(--panel-2); border: 1px solid var(--border); color: var(--muted); font-weight: 800; font-size: 13px; display: flex; align-items: center; justify-content: center; }
.rwz-dot.active > span { background: linear-gradient(180deg, #d8b975, #c9a961); color: #1a1408; border-color: var(--gold); }
.rwz-dot.done > span { background: #1e3326; color: #6fae87; border-color: #2a4a36; }
.rwz-dot-label { font-size: 9px; color: var(--muted-2); letter-spacing: 0.08em; text-transform: uppercase; }
.rwz-dot.active .rwz-dot-label { color: var(--gold-bright); }
.rwz-line { flex: 1; max-width: 30px; height: 1px; background: var(--border); }
.rwz-step-title { font-size: 11px; letter-spacing: 0.22em; color: var(--gold-dim); text-transform: uppercase; margin-bottom: 16px; text-align: center; }
.rwz-next-btn { width: 100%; padding: 16px; font-weight: 800; font-size: 14px; letter-spacing: 0.06em; margin-top: 18px; }

/* Step 1 friends grid */
.rwz-friends-wrap { margin: 14px 0 0; padding: 14px; background: var(--panel); border: 1px solid var(--border); border-radius: 14px; }
.rwz-friends-label { font-size: 10px; letter-spacing: 0.24em; color: var(--gold-dim); text-transform: uppercase; margin-bottom: 12px; text-align: center; }
.rwz-friends-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 8px; }
.rwz-fcard { background: var(--panel-2); border: 1px solid var(--border); border-radius: 12px; padding: 12px 6px; cursor: pointer; font-family: inherit; color: var(--text); display: flex; flex-direction: column; align-items: center; gap: 6px; transition: border-color .15s, background .15s; }
.rwz-fcard:hover { border-color: var(--gold-dim); }
.rwz-fcard.on { border-color: var(--gold); background: linear-gradient(180deg, rgba(201,169,97,0.16), var(--panel-2)); }
.rwz-fcard-av { width: 40px; height: 40px; border-radius: 999px; background: var(--bg-2); border: 1px solid var(--gold-dim); display: flex; align-items: center; justify-content: center; font-weight: 800; color: var(--gold-bright); font-size: 14px; }
.rwz-fcard.on .rwz-fcard-av { background: linear-gradient(180deg, #d8b975, #c9a961); color: #1a1408; }
.rwz-fcard-av.plus { background: transparent; color: var(--gold-bright); border-style: dashed; font-size: 22px; font-weight: 400; }
.rwz-fcard-av.solo-av { background: transparent; border-color: var(--gold-dim); color: var(--gold-bright); padding: 4px; }
.rwz-solo-svg { width: 22px; height: 22px; }
.rwz-fcard.on .rwz-fcard-av.solo-av { background: transparent; color: #1a1408; border-color: var(--gold); }
.rwz-fcard-name { font-size: 11px; color: var(--muted); font-weight: 600; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width: 100%; }
.rwz-fcard.on .rwz-fcard-name { color: var(--gold-bright); }
@media (max-width: 480px) {
  .rwz-friends-grid { grid-template-columns: repeat(auto-fit, minmax(100px, 1fr)); }
}

/* Step 3 — score view toggle + scorecard */
.rwz-hbh-toggle-row { display: flex; gap: 6px; background: var(--panel-2); padding: 4px; border-radius: 10px; margin-bottom: 14px; border: 1px solid var(--border); }
.rwz-view-btn { flex: 1; background: none; border: none; color: var(--muted); padding: 9px; border-radius: 7px; font-size: 13px; font-weight: 700; cursor: pointer; font-family: inherit; }
.rwz-view-btn.active { background: linear-gradient(180deg, #d8b975, #c9a961); color: #1a1408; }
.rwz-scorecard { margin-top: 14px; }
.rwz-sc-grid { background: var(--panel-2); border: 1px solid var(--border); border-radius: 10px; overflow: hidden; }
/* Center the Hole Winner / HBH scorecard, fixed-width columns (#74) */
.rwz-sc-grid.winnerN { width: fit-content; max-width: 100%; margin: 0 auto; overflow-x: auto; }
.rwz-sc-row.winnerN, .rwz-sc-head.winnerN { width: fit-content; }

.rwz-sc-head { display: grid; grid-template-columns: 60px 1fr 1fr 100px; padding: 10px 12px; background: var(--bg-2); border-bottom: 1px solid var(--border); font-size: 11px; letter-spacing: 0.08em; color: var(--gold-dim); text-transform: uppercase; }
.rwz-sc-row { display: grid; grid-template-columns: 60px 1fr 1fr 100px; padding: 8px 12px; border-bottom: 1px solid var(--border); align-items: center; }
.rwz-sc-row:last-child { border-bottom: none; }
.rwz-sc-row:nth-child(11) { border-top: 2px solid var(--gold-dim); }  /* halfway divider AFTER hole 9 */
.rwz-sc-cell { font-size: 13px; color: var(--text); }
.rwz-sc-cell.hole { font-weight: 800; color: var(--gold-bright); }
.rwz-sc-input { width: 100%; padding: 6px 8px; background: var(--bg-2); border: 1px solid var(--border); border-radius: 6px; color: var(--text); text-align: center; font-size: 14px; font-weight: 700; font-family: inherit; }
.rwz-sc-input:focus { border-color: var(--gold); outline: none; }


.rnd-weather-extra { margin: 10px 0; background: var(--panel); border: 1px solid var(--border); border-radius: 10px; }
.rnd-weather-extra summary { padding: 10px 14px; cursor: pointer; font-size: 12px; font-weight: 700; color: var(--muted); list-style: none; }
.rnd-weather-extra summary::-webkit-details-marker { display: none; }
.rnd-weather-extra summary span { font-weight: 400; color: var(--muted-2); margin-left: 6px; }
.rnd-weather-extra summary::after { content: '＋'; float: right; color: var(--gold-dim); }
.rnd-weather-extra[open] summary::after { content: '−'; }
.rnd-weather-extra > .rnd-row { padding: 0 14px 14px; }

/* Inline weather (legacy class kept) */
.rnd-weather-inline { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 10px 0; }
.rnd-weather-inline .rnd-weather-link { background: var(--panel-2); border: 1px solid var(--border); border-radius: 8px; padding: 8px 12px; color: var(--gold-bright); cursor: pointer; font-family: inherit; font-size: 12px; font-weight: 600; }
.rnd-weather-inline .rnd-weather-link:hover { border-color: var(--gold-dim); }
.rnd-weather-inline .rnd-weather-status { font-size: 11px; color: var(--muted-2); flex-basis: 100%; }

/* Clubhouse guide */
.cg-card { position: relative; padding: 18px 18px 16px; margin: 0 0 18px; background: linear-gradient(180deg, var(--panel), var(--bg-2)); border: 1px solid var(--gold-dim); border-radius: 16px; }
.cg-close { position: absolute; top: 10px; right: 10px; background: none; border: none; color: var(--muted-2); font-size: 16px; cursor: pointer; padding: 4px 8px; }
.cg-close:hover { color: var(--text); }
.cg-eyebrow { font-size: 10px; letter-spacing: 0.32em; color: var(--gold-dim); text-transform: uppercase; }
.cg-title { font-size: 18px; margin: 4px 0 4px; letter-spacing: -0.01em; }
.cg-sub { color: var(--muted); font-size: 13px; margin: 0 0 14px; line-height: 1.5; }
.cg-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }
.cg-item { display: flex; gap: 10px; align-items: center; padding: 10px 12px; background: var(--panel-2); border: 1px solid var(--border); border-radius: 10px; }
.cg-icon { width: 20px; height: 20px; color: var(--gold); flex-shrink: 0; }
.cg-item strong { font-size: 12px; color: var(--text); display: block; }
.cg-d { font-size: 10px; color: var(--muted-2); margin-top: 1px; line-height: 1.3; }
@media (max-width: 480px) { .cg-grid { grid-template-columns: 1fr; gap: 6px; } }

/* League success banner */
.lg-success-banner { display: flex; gap: 12px; align-items: center; padding: 14px; background: linear-gradient(135deg, rgba(111,174,135,0.12), rgba(13,28,21,0.5)); border: 1px solid #2a4a36; border-radius: 12px; margin-bottom: 16px; }
.lg-success-icon { font-size: 28px; }
.lg-success-banner strong { color: #6fae87; font-size: 15px; }

/* Clubhouse preview cards (insights + trophies) */
.ch-preview-card { padding: 16px 16px 14px; margin: 14px 0 0; background: linear-gradient(180deg, var(--panel), var(--bg-2)); border: 1px solid var(--gold-dim); border-radius: 16px; }
.ch-preview-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 14px; }
.ch-preview-eyebrow { font-size: 10px; letter-spacing: 0.28em; color: var(--gold-dim); text-transform: uppercase; font-weight: 700; }
.ch-preview-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.ch-prev-stat { padding: 12px 8px; background: var(--panel-2); border: 1px solid var(--border); border-radius: 10px; text-align: center; }
.ch-prev-val { font-size: 22px; font-weight: 800; color: var(--gold-bright); line-height: 1; }
.ch-prev-lab { font-size: 10px; color: var(--muted-2); margin-top: 4px; letter-spacing: 0.08em; text-transform: uppercase; }
.ch-trophy-progress { height: 6px; background: var(--panel-2); border-radius: 999px; overflow: hidden; margin-bottom: 12px; }
.ch-trophy-fill { height: 100%; background: linear-gradient(90deg, var(--gold-dim), var(--gold-bright)); border-radius: 999px; }
.ch-trophy-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }
.ch-trophy { padding: 10px 12px; background: var(--panel-2); border: 1px solid var(--border); border-radius: 10px; }
.ch-trophy.bronze { border-color: #8a5430; }
.ch-trophy.silver { border-color: #aab1b8; }
.ch-trophy.gold { border-color: var(--gold-dim); background: linear-gradient(180deg, rgba(201,169,97,0.08), var(--panel-2)); }
.ch-trophy.platinum { border-color: #c4d4dc; background: linear-gradient(180deg, rgba(196,212,220,0.06), var(--panel-2)); }
.ch-trophy.rainbow { border-color: transparent; background: linear-gradient(135deg, rgba(255,150,150,0.1), rgba(150,255,200,0.1), rgba(150,200,255,0.1)); box-shadow: 0 0 0 1px rgba(201,169,97,0.4); }
.ch-trophy.locked { opacity: 0.45; }
.ch-trophy-icon { font-size: 18px; }
.ch-trophy-name { font-size: 12px; font-weight: 800; color: var(--text); margin-top: 4px; }
.ch-trophy.gold .ch-trophy-name, .ch-trophy.platinum .ch-trophy-name, .ch-trophy.rainbow .ch-trophy-name { color: var(--gold-bright); }
.ch-trophy-d { font-size: 10px; color: var(--muted-2); margin-top: 2px; line-height: 1.3; }
.ch-trophy-complete { margin-top: 12px; padding: 12px; text-align: center; background: linear-gradient(135deg, rgba(255,200,100,0.12), rgba(150,200,255,0.08)); border: 1px solid var(--gold); border-radius: 10px; color: var(--gold-bright); font-weight: 800; font-size: 13px; }

/* League management modal */
.lm-row { display: flex; gap: 10px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--border); }
.lm-row:last-of-type { border-bottom: none; }
.lm-label { font-size: 11px; letter-spacing: 0.22em; color: var(--gold-dim); text-transform: uppercase; width: 70px; flex-shrink: 0; }
.lm-val { font-size: 13px; color: var(--text); flex: 1; }
.lm-code { font-family: Georgia, 'Times New Roman', serif; font-size: 16px; font-weight: 800; color: var(--gold-bright); letter-spacing: 0.18em; }
.lm-period { display: flex; gap: 6px; align-items: center; flex: 1; }
.lm-period input { background: var(--panel-2); border: 1px solid var(--border); border-radius: 8px; color: var(--text); padding: 6px 8px; font-family: inherit; font-size: 13px; }
.lm-dash { color: var(--muted-2); }
.lm-section-h { font-size: 10px; letter-spacing: 0.22em; color: var(--gold-dim); text-transform: uppercase; margin: 16px 0 8px; }
.lm-members { display: grid; gap: 6px; max-height: 30vh; overflow: auto; }
.lm-member { display: flex; align-items: center; gap: 10px; padding: 8px 12px; background: var(--panel-2); border: 1px solid var(--border); border-radius: 8px; }
.lm-member.pending { opacity: 0.7; }
.lm-member-av { width: 32px; height: 32px; border-radius: 999px; background: var(--bg-2); border: 1px solid var(--gold-dim); display: flex; align-items: center; justify-content: center; font-weight: 800; color: var(--gold-bright); font-size: 13px; flex-shrink: 0; }
.lm-member-name { flex: 1; font-size: 13px; color: var(--text); }
.lm-member-role { font-size: 10px; color: var(--muted-2); }
.lm-add-row { display: flex; gap: 6px; margin: 8px 0; }
.lm-add-row select { background: var(--panel-2); border: 1px solid var(--border); border-radius: 8px; color: var(--text); padding: 8px; font-family: inherit; font-size: 13px; }
.lm-hint { font-size: 11px; color: var(--muted-2); margin-top: 4px; }


/* === Clubhouse-shaped gold frame + inner card === */
.ch-house-wrap { position: relative; margin: 14px 0 0; padding: 0 4px; }
.ch-house-svg { display: block; width: 100%; max-width: 480px; margin: 0 auto -6px; filter: drop-shadow(0 4px 10px rgba(201,169,97,0.18)); position: relative; z-index: 1; }
.ch-house-card { background: linear-gradient(180deg, rgba(11,22,18,0.95), rgba(7,15,12,0.95)); border: 1px solid rgba(201,169,97,0.35); border-radius: 0 0 16px 16px; padding: 22px 20px 24px; text-align: center; margin-top: -3px; position: relative; z-index: 0; }
.ch-house-eyebrow { font-size: 10px; letter-spacing: 0.34em; color: var(--gold-dim); text-transform: uppercase; font-weight: 700; margin-bottom: 8px; }
.ch-house-cta-title { font-family: Georgia, serif; font-size: clamp(20px, 4.6vw, 26px); margin: 4px 0 8px; color: var(--text); letter-spacing: -0.01em; }
.ch-house-cta-body { font-size: 13px; color: var(--muted); line-height: 1.55; max-width: 360px; margin: 0 auto 18px; }
.ch-house-actions { display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; }
.ch-house-actions .btn { padding: 12px 18px; font-weight: 600; }

/* === Demo wall === */
.ch-wall-eyebrow { font-size: 10px; letter-spacing: 0.34em; color: var(--gold-dim); text-transform: uppercase; font-weight: 700; margin: 22px 0 10px; text-align: center; }
.ch-wall-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 6px; }
.ch-wall-tile { background: linear-gradient(160deg, rgba(201,169,97,0.12), rgba(201,169,97,0.025) 60%, rgba(7,15,11,0.4)); border: 1px solid rgba(201,169,97,0.30); border-radius: 12px; padding: 12px 14px; box-shadow: inset 0 1px 0 rgba(247,236,192,0.07), 0 2px 10px rgba(0,0,0,0.25); }
.ch-wall-tile.wide { grid-column: 1 / -1; }
.ch-wall-eyebrow-s { font-size: 9.5px; letter-spacing: 0.22em; color: var(--gold-dim); text-transform: uppercase; font-weight: 700; margin-bottom: 6px; }
.ch-wall-num { font-family: Georgia, serif; font-size: 26px; font-weight: 700; color: var(--gold-bright); line-height: 1.05; }
.ch-wall-num-s { font-family: Georgia, serif; font-size: 18px; font-weight: 700; color: var(--gold-bright); line-height: 1.1; }
.ch-wall-sub { font-size: 11px; color: var(--muted); margin-top: 4px; }
.ch-wall-row { display: flex; align-items: center; gap: 10px; padding: 6px 0; font-size: 12.5px; color: var(--text); }
.ch-wall-line { color: var(--muted); }
.ch-wall-dot { width: 22px; height: 22px; border-radius: 5px; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; font-size: 11px; flex-shrink: 0; }
.ch-wall-dot.w { background: rgba(111,174,135,0.20); color: #6fae87; border: 1px solid rgba(111,174,135,0.3); }
.ch-wall-dot.l { background: rgba(201,122,122,0.15); color: #c97a7a; border: 1px solid rgba(201,122,122,0.3); }
.ch-wall-trophies { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
.ch-wall-trophy { background: rgba(201,169,97,0.10); border: 1px solid rgba(201,169,97,0.30); color: var(--gold-bright); font-size: 11.5px; padding: 5px 10px; border-radius: 999px; font-weight: 500; }
.ch-wall-footnote { font-size: 11px; color: var(--muted-2); text-align: center; margin: 12px 0 0; font-style: italic; }

/* === Demo wall — muted/grey, no EXAMPLE label === */
.ch-demo { position: relative; margin-top: 16px; }
.ch-demo .ch-wall-grid { opacity: 0.72; filter: saturate(0.45); }
.ch-demo .ch-wall-num, .ch-demo .ch-wall-num-s { color: var(--muted) !important; -webkit-text-fill-color: var(--muted); }
.ch-demo .ch-wall-eyebrow-s, .ch-demo .ch-wall-sub, .ch-demo .ch-wall-line, .ch-demo .ch-wall-trophy { color: var(--muted-2); }
.ch-demo .ch-wall-dot { opacity: 0.6; }
@media (max-width: 480px) {
  .ch-wall-grid { grid-template-columns: 1fr 1fr; gap: 6px; margin-bottom: 4px; }
  .ch-wall-tile { padding: 7px 8px; border-radius: 9px; }
  .ch-wall-num { font-size: 17px; line-height: 1; }
  .ch-wall-num-s { font-size: 13px; line-height: 1; }
  .ch-wall-eyebrow-s { font-size: 8px; letter-spacing: 0.12em; margin-bottom: 3px; }
  .ch-wall-sub { font-size: 9px; margin-top: 2px; }
  .ch-wall-eyebrow { margin: 14px 0 7px; }
  .ch-wall-row { font-size: 11px; padding: 3px 0; gap: 7px; }
  .ch-wall-dot { width: 18px; height: 18px; font-size: 10px; }
  .ch-wall-trophy { font-size: 10px; padding: 3px 7px; }
}

/* Clubhouse legacy section header */
.ch-legacy-header { text-align: center; margin: 22px 0 12px; }
.ch-legacy-eyebrow { font-size: 10px; letter-spacing: 0.32em; color: var(--gold-dim); text-transform: uppercase; }
.ch-legacy-title { font-size: clamp(20px, 5vw, 26px); margin: 4px 0 0; letter-spacing: -0.01em; background: linear-gradient(180deg, #f0eee5, var(--gold) 70%, var(--gold-dim)); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; font-family: Georgia, serif; }

@media (max-width: 480px) { .ch-preview-grid { grid-template-columns: 1fr 1fr; } .ch-trophy-grid { grid-template-columns: 1fr; } }

/* ============================================================
   CLUBHOUSE FRAME — premium gold outline shaped like a clubhouse
   ============================================================ */
.clubhouse-frame { position: relative; margin: 30px 0 0;
  border: none; border-radius: 14px;
  background: transparent;
  box-shadow: none;
  padding: 34px 4px 8px; }
.clubhouse-sign {
  position: absolute; top: 10px; left: 50%; transform: translate(-50%, -50%);
  display: flex; align-items: center; gap: 12px; z-index: 2; white-space: nowrap;
  padding: 6px 22px; border: none; border-radius: 10px; background: transparent;
  box-shadow: none;
}
.clubhouse-sign::before, .clubhouse-sign::after {
  content: ""; width: 5px; height: 5px; flex: none; transform: rotate(45deg);
  background: var(--gold); box-shadow: 0 0 6px rgba(201,169,97,0.6);
}
.clubhouse-sign span {
  font-family: Georgia, 'Times New Roman', serif; font-weight: 700;
  font-size: clamp(15px, 4.2vw, 22px); letter-spacing: 0.30em; padding-left: 0.30em;
  background: linear-gradient(180deg, #f7ecc0, var(--gold) 58%, #8a7340);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
@media (max-width: 480px) { .clubhouse-frame { padding: 30px 11px 18px; } .clubhouse-sign { padding: 7px 18px; gap: 9px; } }

/* Clubhouse empty-state CTA */
.ch-cta { text-align: center; padding: 4px 4px 6px; }
.ch-cta-title { font-family: Georgia, serif; font-size: clamp(19px, 4.4vw, 25px); margin: 2px 0 14px; color: var(--text); letter-spacing: -0.01em; }
.ch-cta-actions { display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; margin-bottom: 14px; }
.ch-cta-actions .btn { padding: 12px 18px; font-weight: 700; }
.ch-cta-body { font-size: 13px; color: var(--muted); line-height: 1.55; max-width: 380px; margin: 0 auto; }

/* Clubhouse quick-nav (landing-page hub) */
.ch-qn { margin: 22px 0 6px; }
.ch-qn-eyebrow { font-size: 10px; letter-spacing: 0.32em; color: var(--gold-dim); text-transform: uppercase; font-weight: 700; text-align: center; margin-bottom: 12px; }
.ch-qn-feat { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 10px; }
.ch-qn-feat button { display: flex; align-items: center; gap: 11px; padding: 14px 16px; border-radius: 12px;
  background: linear-gradient(180deg, rgba(201,169,97,0.14), rgba(201,169,97,0.03));
  border: 1px solid var(--gold-dim); color: var(--text); font-weight: 700; font-size: 14px;
  font-family: inherit; cursor: pointer; text-align: left; transition: border-color .12s, transform .12s; }
.ch-qn-feat button:hover { border-color: var(--gold); transform: translateY(-1px); }
.ch-qn-feat .ch-qn-i { color: var(--gold-bright); width: 26px; height: 26px; flex-shrink: 0; }
.ch-qn-feat .ch-qn-sub { display: block; font-size: 11px; font-weight: 500; color: var(--muted); margin-top: 1px; }
.ch-qn-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 8px; }
@media (max-width: 700px) { .ch-qn-grid { grid-template-columns: repeat(3, 1fr); } }
.ch-qn-grid button { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 12px 4px;
  border-radius: 11px; background: var(--panel-2); border: 1px solid var(--border); color: var(--muted);
  font-size: 11px; font-weight: 600; font-family: inherit; cursor: pointer; transition: border-color .12s, color .12s; }
.ch-qn-grid button:hover { border-color: var(--gold-dim); color: var(--text); }
.ch-qn-grid .ch-qn-i { color: var(--gold); width: 22px; height: 22px; }
@media (max-width: 480px) { .ch-qn-grid { grid-template-columns: repeat(3, 1fr); } .ch-qn-feat { grid-template-columns: 1fr; } }
.ch-qn-grid button { position: relative; }
.ch-navbadge { position: absolute; top: 5px; right: 7px; min-width: 16px; height: 16px; padding: 0 4px; border-radius: 9px; background: var(--gold,#c9a961); color: #1a1408; font-size: 10px; font-weight: 800; display: inline-flex; align-items: center; justify-content: center; line-height: 1; }






/* Empty board: highlight your row */
.fgl-empty-row.me-row { display: flex; gap: 12px; align-items: center; opacity: 0.95; color: var(--gold-bright); border-bottom: 1px solid var(--gold-dim); }
.fgl-empty-row.me-row .rank { font-weight: 800; }
.fgl-empty-row.me-row .me-name { flex: 1; font-weight: 700; font-size: 14px; }
.fgl-empty-row.me-row .me-meta { font-size: 12px; color: var(--muted); }


@media (min-width: 640px) {
  .ins-empty-grid { grid-template-columns: repeat(3, 1fr); }
}

.cw-cta { min-width: 180px; padding: 14px 28px; font-weight: 800; letter-spacing: 0.04em; }

/* FGL board empty-state shell — shows what the board will look like with a "no one yet" overlay */
.fgl-board-empty { position: relative; }
.fgl-empty-shell { position: relative; min-height: 280px; }
.fgl-empty-row { padding: 16px 16px; border-bottom: 1px solid var(--border); color: var(--muted-2); font-weight: 800; font-size: 15px; opacity: 0.35; }
.fgl-empty-row:last-of-type { border-bottom: none; }
.fgl-empty-overlay { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 20px; background: radial-gradient(ellipse at center, rgba(6,13,10,0.85) 0%, rgba(6,13,10,0.95) 70%); }
.fgl-empty-eyebrow { font-size: 10px; letter-spacing: 0.32em; color: var(--gold-dim); text-transform: uppercase; margin-bottom: 8px; }
.fgl-empty-h { font-size: 18px; color: var(--text); margin: 0 0 8px; letter-spacing: -0.01em; text-transform: none; }
.fgl-empty-p { color: var(--muted); font-size: 13px; max-width: 320px; margin: 0; line-height: 1.5; }


/* Rival picker rows (used by rwzAddFriend modal) */
.rwz-pick-list { display: grid; gap: 6px; max-height: 50vh; overflow-y: auto; margin-bottom: 14px; }
.rwz-pick-row { display: flex; align-items: center; gap: 12px; padding: 12px 14px; background: var(--panel-2); border: 1px solid var(--border); border-radius: 12px; cursor: pointer; font-family: inherit; color: var(--text); transition: border-color .12s, background .12s; }
.rwz-pick-row:hover { border-color: var(--gold-dim); background: linear-gradient(180deg, rgba(201,169,97,0.08), var(--panel-2)); }
.rwz-pick-av { width: 36px; height: 36px; border-radius: 999px; background: var(--bg-2); border: 1px solid var(--gold-dim); display: flex; align-items: center; justify-content: center; font-weight: 800; color: var(--gold-bright); font-size: 13px; flex-shrink: 0; }
.rwz-pick-name { flex: 1; font-size: 14px; font-weight: 600; text-align: left; }
.rwz-pick-hcp { color: var(--muted-2); font-weight: 400; font-size: 12px; }
.rwz-pick-arrow { color: var(--gold-dim); }
.rwz-pick-actions { margin-top: 6px; }

/* Rivalry preview card */
.rv-preview-card { padding: 24px 18px; background: linear-gradient(135deg, rgba(201,169,97,0.08), rgba(13,28,21,0.5)); border: 1px solid var(--gold-dim); border-radius: 18px; text-align: center; }
.rv-preview-eyebrow { font-size: 10px; letter-spacing: 0.32em; color: var(--gold-dim); text-transform: uppercase; margin-bottom: 14px; }
.rv-preview-row { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 14px; margin-bottom: 18px; }
.rv-preview-side { text-align: center; }
.rv-preview-side.dim { opacity: 0.5; }
.rv-preview-name { font-family: Georgia, 'Times New Roman', serif; font-size: clamp(15px, 4vw, 22px); letter-spacing: -0.01em; color: var(--text); line-height: 1.15; font-weight: 700; }
.rv-preview-side.dim .rv-preview-name { color: var(--muted-2); font-size: clamp(13px, 3vw, 16px); }
.rv-preview-stat { font-size: 22px; color: var(--gold-bright); font-weight: 800; margin-top: 4px; }
.rv-preview-vs { font-size: 14px; color: var(--gold-dim); letter-spacing: 0.2em; font-weight: 800; }
.rv-preview-hint { color: var(--muted); font-size: 12px; max-width: 360px; margin: 0 auto 16px; line-height: 1.5; }




/* Scorecard variants (winner + hbh) + zoom modal */
.rwz-sc-row { display: grid; cursor: pointer; }
.rwz-sc-grid.hbh .rwz-sc-row, .rwz-sc-grid.hbh .rwz-sc-head.hbh { grid-template-columns: 50px 1fr 1fr 90px 30px; }
.rwz-sc-grid.winner .rwz-sc-row, .rwz-sc-grid.winner .rwz-sc-head.winner { grid-template-columns: 50px 1fr 2fr 30px; }
.rwz-sc-row:hover { background: var(--panel-2); }
.win-cell { display: flex; gap: 4px; }
.rwz-win-mini { flex: 1; background: var(--panel-2); border: 1px solid var(--border); border-radius: 6px; padding: 6px 4px; font-size: 11px; cursor: pointer; font-family: inherit; color: var(--muted); }
.rwz-win-mini.on { background: linear-gradient(180deg, #d8b975, #c9a961); border-color: var(--gold); color: #1a1408; font-weight: 800; }
.zoom-cell { color: var(--gold-dim); text-align: center; font-size: 14px; }

.rwz-zoom { display: grid; grid-template-columns: 56px 1fr 56px; gap: 8px; align-items: center; padding: 6px 0 0; }
.rwz-zoom-nav { width: 56px; height: 56px; border-radius: 999px; background: var(--panel-2); border: 1px solid var(--border); color: var(--gold); font-size: 28px; cursor: pointer; font-family: inherit; }
.rwz-zoom-nav:hover:not(:disabled) { border-color: var(--gold-dim); }
.rwz-zoom-nav:disabled { opacity: 0.3; cursor: not-allowed; }
.rwz-zoom-main { text-align: center; }
.rwz-zoom-num { font-size: 11px; letter-spacing: 0.32em; color: var(--gold-dim); }
.rwz-zoom-par { font-size: 14px; color: var(--muted); margin: 4px 0 14px; }
.rwz-zoom-score { display: flex; align-items: center; justify-content: center; gap: 16px; margin-bottom: 14px; }
.rwz-zoom-step { width: 56px; height: 56px; border-radius: 999px; background: var(--panel-2); border: 1px solid var(--gold-dim); color: var(--gold-bright); font-size: 28px; cursor: pointer; font-family: inherit; }
.rwz-zoom-val { font-size: 64px; font-weight: 800; color: var(--gold-bright); min-width: 80px; }
.rwz-zoom-quick { display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; margin-top: 8px; }
.rwz-zoom-quick button { background: var(--panel-2); border: 1px solid var(--border); border-radius: 8px; padding: 10px 4px; font-size: 11px; cursor: pointer; font-family: inherit; color: var(--muted); }
.rwz-zoom-quick button:hover { border-color: var(--gold-dim); color: var(--text); }
.rwz-zoom-pick { display: grid; gap: 8px; }
.rwz-zoom-btn { padding: 18px; background: var(--panel-2); border: 1px solid var(--border); border-radius: 12px; font-size: 15px; font-weight: 700; cursor: pointer; font-family: inherit; color: var(--text); }
.rwz-zoom-btn.on { background: linear-gradient(180deg, #d8b975, #c9a961); border-color: var(--gold); color: #1a1408; }
.rwz-zoom-btn.half { font-size: 14px; color: var(--muted); }


/* Per-player total inputs */
.rwz-totals { display: grid; gap: 10px; max-width: 480px; margin: 0 auto; }
.rwz-total-row { display: flex; align-items: center; gap: 14px; padding: 14px 16px; background: var(--panel-2); border: 1px solid var(--border); border-radius: 12px; }
.rwz-total-name { flex: 1; font-size: 15px; font-weight: 700; color: var(--text); }
.rwz-total-input { width: 90px; padding: 10px 12px; background: var(--bg-2); border: 1px solid var(--gold-dim); border-radius: 10px; color: var(--gold-bright); font-size: 22px; font-weight: 800; text-align: center; font-family: inherit; }
.rwz-total-input:focus { outline: none; border-color: var(--gold); }


/* Stroke dots on scorecard */
.rwz-stroke-dots { color: var(--gold-bright); font-size: 10px; letter-spacing: -1px; margin-left: 4px; }

/* Score summary modal */
.rss-modal { text-align: center; padding: 8px 0; }
.rss-title { margin: 14px 0 4px; font-size: 18px; color: var(--text); font-weight: 600; }
.rss-big { font-family: Georgia, serif; font-size: 64px; font-weight: 800; color: var(--gold-bright); line-height: 1; letter-spacing: -0.02em; display: inline-block; margin: 0 6px; vertical-align: middle; }
.rss-rel { font-size: 13px; color: var(--muted); margin-bottom: 18px; }
.rss-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(80px, 1fr)); gap: 8px; max-width: 380px; margin: 0 auto; }
.rss-stat { padding: 12px 6px; background: var(--panel-2); border: 1px solid var(--gold-dim); border-radius: 10px; }
.rss-val { font-size: 22px; font-weight: 800; color: var(--gold-bright); }
.rss-lab { font-size: 10px; color: var(--muted-2); letter-spacing: 0.12em; text-transform: uppercase; margin-top: 4px; }
.rss-course { font-size: 12px; color: var(--muted); margin-top: 16px; }

/* HC import accordion */
.pp-hc-import { background: var(--panel-2); border: 1px solid var(--gold-dim); border-radius: 10px; margin: 14px 0; }
.pp-hc-import summary { padding: 12px 14px; cursor: pointer; font-size: 13px; font-weight: 700; color: var(--gold-bright); list-style: none; }
.pp-hc-import summary::-webkit-details-marker { display: none; }
.pp-hc-import summary span { font-weight: 400; color: var(--muted); }
.pp-hc-import summary::after { content: '＋'; float: right; color: var(--gold-dim); }
.pp-hc-import[open] summary::after { content: '−'; }

/* Per-player conditions tabs */
.rpp-tabs { display: flex; flex-wrap: wrap; gap: 6px; padding: 8px 14px 4px; }
.rpp-tab { background: var(--panel-2); border: 1px solid var(--border); color: var(--muted); padding: 7px 10px; border-radius: 999px; cursor: pointer; font-family: inherit; display: inline-flex; align-items: center; justify-content: center; gap: 6px; font-size: 12px; flex: 1 1 0; min-width: 92px; }
.rpp-tab:hover { border-color: var(--gold-dim); color: var(--text); }
.rpp-tab.on { background: linear-gradient(180deg, rgba(201,169,97,0.18), var(--panel-2)); border-color: var(--gold); color: var(--gold-bright); }
.rpp-av { width: 22px; height: 22px; border-radius: 999px; background: var(--bg-2); border: 1px solid var(--gold-dim); display: inline-flex; align-items: center; justify-content: center; font-weight: 800; font-size: 10px; color: var(--gold-bright); }
.rpp-tab.on .rpp-av { background: linear-gradient(180deg, #d8b975, #c9a961); color: #1a1408; border-color: var(--gold); }
.rpp-name { white-space: nowrap; }
.rpp-active-label { font-size: 11px; color: var(--gold-dim); letter-spacing: 0.18em; text-transform: uppercase; padding: 4px 14px 8px; }



/* Integrated dropdown — chip group becomes a collapsed pill that expands on tap */
.rnd-dd-wrap { background: var(--panel-2); border: 1px solid var(--border); border-radius: 12px; padding: 4px; transition: border-color .15s; }
.rnd-dd-wrap.open { border-color: var(--gold-dim); }
.rnd-dd-trigger { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 14px; background: none; border: none; color: var(--text); font-family: inherit; font-size: 14px; cursor: pointer; }
.rnd-dd-val { font-weight: 700; color: var(--gold-bright); }
.rnd-dd-chev { color: var(--gold-dim); transition: transform .18s; }
.rnd-dd-wrap.open .rnd-dd-chev { transform: rotate(180deg); }
.rnd-dd-options { display: none !important; flex-wrap: wrap; gap: 6px; padding: 4px 8px 10px !important; border-top: 1px solid var(--border); margin-top: 4px; }
.rnd-dd-wrap.open .rnd-dd-options { display: flex !important; }

/* Chip groups — tap-friendly mobile UX, replaces native selects */
.rnd-chip-row { display: flex; flex-wrap: wrap; gap: 6px; padding: 4px 0; }
.rnd-chip { background: var(--panel-2); border: 1px solid var(--border); color: var(--muted); padding: 9px 13px; border-radius: 999px; font-family: inherit; font-size: 13px; font-weight: 600; cursor: pointer; min-height: 38px; transition: border-color .12s, background .12s, color .12s; }
.rnd-chip:hover { border-color: var(--gold-dim); color: var(--text); }
.rnd-chip.on { background: linear-gradient(180deg, #d8b975, #c9a961); border-color: var(--gold); color: #1a1408; }
.rnd-hidden-select { display: none; }
.rnd-row-2 { grid-template-columns: 1fr 1fr; }
@media (max-width: 480px) {
  .rnd-row-2 { grid-template-columns: 1fr; }
  .rnd-chip { padding: 10px 14px; font-size: 14px; }
}


/* New Round v3 — Ranked/Casual + score-types + tightened weather */
.rnd-rank-wrap { margin: 0 0 14px; padding: 14px; background: linear-gradient(180deg, var(--panel-2), transparent); border: 1px solid var(--gold-dim); border-radius: 14px; }
.rnd-rank-label { font-size: 10px; letter-spacing: 0.24em; color: var(--gold-dim); text-transform: uppercase; margin-bottom: 10px; text-align: center; }
.rnd-rank-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.rnd-rank-btn { background: var(--panel); border: 1px solid var(--border); border-radius: 12px; padding: 16px 12px; cursor: pointer; text-align: center; font-family: inherit; color: var(--text); transition: border-color .15s, background .15s; }
.rnd-rank-btn:hover { border-color: var(--gold-dim); }
.rnd-rank-btn.active { border-color: var(--gold); background: linear-gradient(180deg, rgba(201,169,97,0.14), var(--panel)); }
.rnd-rank-svg { width: 28px; height: 28px; margin-bottom: 6px; color: var(--gold-dim); }
.rnd-rank-btn.active .rnd-rank-svg { color: var(--gold-bright); }
.rnd-rank-name { font-size: 14px; font-weight: 800; letter-spacing: 0.08em; }
.rnd-rank-btn.active .rnd-rank-name { color: var(--gold-bright); }
.rnd-rank-desc { font-size: 11px; color: var(--muted-2); margin-top: 4px; line-height: 1.3; }

.rnd-row-4 { grid-template-columns: repeat(4, 1fr); }

.rnd-weather-compact { padding: 10px 12px !important; }
.rnd-weather-line { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; font-size: 12px; color: var(--muted); }
.rnd-weather-label { font-weight: 700; color: var(--text); letter-spacing: 0.06em; margin-right: 4px; }
.rnd-weather-link { background: none; border: none; color: var(--gold-bright); padding: 0; font-size: 12px; cursor: pointer; font-family: inherit; text-decoration: underline; text-underline-offset: 3px; }
.rnd-weather-link:hover { color: var(--gold); }
.rnd-weather-sep { color: var(--muted-2); }
.rnd-weather-status { font-size: 11px; color: var(--muted-2); margin-top: 6px; }

.rnd-score-wrap { margin: 14px 0; padding: 14px; background: var(--panel); border: 1px solid var(--border); border-radius: 14px; }
.rnd-score-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 12px; }
.rnd-score-btn { background: var(--panel-2); border: 1px solid var(--border); border-radius: 10px; padding: 12px 10px; cursor: pointer; text-align: left; font-family: inherit; color: var(--text); transition: border-color .15s, background .15s; }
.rnd-score-btn:hover { border-color: var(--gold-dim); }
.rnd-score-btn.active { border-color: var(--gold); background: linear-gradient(180deg, rgba(201,169,97,0.1), var(--panel-2)); }
.rnd-score-name { font-size: 13px; font-weight: 800; letter-spacing: 0.02em; }
.rnd-score-btn.active .rnd-score-name { color: var(--gold-bright); }
.rnd-score-desc { font-size: 11px; color: var(--muted-2); margin-top: 3px; line-height: 1.4; }
/* HC toggle — slim, text-led pill */
.rnd-hcp-slim { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 8px 4px 8px 4px; cursor: pointer; font-size: 13px; color: var(--text); }
.rnd-hcp-text { flex: 1; display: flex; flex-direction: column; gap: 2px; }
.rnd-hcp-text strong { font-size: 14px; color: var(--text); font-weight: 700; letter-spacing: 0.01em; }
.rnd-hcp-sub { font-size: 11px; color: var(--muted); line-height: 1.4; }
.rnd-hcp-switch { position: relative; width: 42px; height: 24px; flex-shrink: 0; }
.rnd-hcp-switch input { position: absolute; opacity: 0; width: 100%; height: 100%; cursor: pointer; margin: 0; }
.rnd-hcp-track { position: absolute; inset: 0; background: var(--panel-2); border: 1px solid var(--border); border-radius: 999px; transition: background .15s, border-color .15s; }
.rnd-hcp-track::after { content: ''; position: absolute; left: 2px; top: 2px; width: 18px; height: 18px; border-radius: 999px; background: var(--muted-2); transition: transform .18s, background .15s; }
.rnd-hcp-switch input:checked + .rnd-hcp-track { background: linear-gradient(180deg, #d8b975, #c9a961); border-color: var(--gold); }
.rnd-hcp-switch input:checked + .rnd-hcp-track::after { transform: translateX(18px); background: #1a1408; }
.rnd-hcp-slim.locked { opacity: 0.85; cursor: not-allowed; }
.rnd-hcp-slim.locked .rnd-hcp-switch { pointer-events: none; }
@media (max-width: 640px) {
  .rnd-row-4 { grid-template-columns: 1fr 1fr; }
  .rnd-rank-desc { display: none; }
  .rnd-score-grid { grid-template-columns: 1fr; }
}





/* Spectator overlay */
.spec-overlay { position: fixed; inset: 0; z-index: 1900; background: rgba(3,7,5,0.7); backdrop-filter: blur(4px); display: flex; align-items: flex-end; justify-content: center; }
.spec-card { width: 100%; max-width: 480px; background: linear-gradient(180deg, var(--panel), var(--bg)); border: 1px solid var(--gold-dim); border-bottom: none; border-radius: 20px 20px 0 0; padding: 20px; animation: caddieUp .22s ease; }
.spec-link-row { display: flex; gap: 8px; margin-bottom: 14px; }
.spec-status { display: flex; gap: 12px; align-items: center; padding: 12px 14px; background: var(--panel-2); border: 1px solid var(--border); border-radius: 12px; }
.spec-status-dot { width: 10px; height: 10px; border-radius: 999px; background: var(--gold); animation: pulse 1.8s infinite; flex-shrink: 0; }
@keyframes pulse { 0%, 100% { opacity: 0.4; transform: scale(0.9) } 50% { opacity: 1; transform: scale(1.1) } }
.spec-status-title { font-size: 13px; font-weight: 700; color: var(--text); }
.spec-status-sub { font-size: 11px; color: var(--muted-2); margin-top: 2px; }

@media (max-width: 640px) {
  .mm-shell { padding: 8px 12px env(safe-area-inset-bottom, 16px); gap: 10px; }
  .mm-holes-won { font-size: 32px; }
  .mm-avatar { width: 44px; height: 44px; font-size: 16px; }
  .mm-hole-card { padding: 14px; }
  .mm-spec-hint { display: none; }
}



/* === Avatars + player card (wave C) === */
.fr-av { border-radius: 999px; overflow: hidden; }
.fr-av svg { width: 100%; height: 100%; display: block; }
#profile-avatar { display: grid; place-items: center; padding: 0; background: transparent; overflow: hidden; }
.fr-av-pick { background: var(--panel-2); border: 1px solid var(--border); border-radius: 12px; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; }
.fr-av-pick.selected { border-color: var(--gold); box-shadow: 0 0 0 1px var(--gold); }
.player-card { text-align: center; padding: 6px 4px 2px; }
.pc-avatar { width: 96px; height: 96px; margin: 0 auto 12px; }
.pc-name { font-family: Georgia, serif; font-size: 24px; color: var(--text); line-height: 1.1; }
.pc-club { color: var(--muted); font-size: 12px; margin-top: 3px; }
.pc-stats { display: flex; justify-content: center; gap: 26px; margin: 16px 0 6px; }
.pc-stat-v { font-family: Georgia, serif; font-size: 24px; color: var(--gold-bright); line-height: 1; }
.pc-stat-l { font-size: 9px; letter-spacing: 0.16em; color: var(--gold-dim); text-transform: uppercase; margin-top: 4px; }
.pc-bio { color: var(--muted); font-size: 13px; line-height: 1.5; max-width: 320px; margin: 10px auto 0; }
.pc-foot { font-size: 10px; color: var(--muted-2); margin-top: 10px; }
.pc-actions { display: flex; gap: 8px; margin-top: 16px; }
.pc-switch { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; margin-top: 12px; border-top: 1px solid var(--border); padding-top: 12px; }
.pc-switch-btn { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; background: var(--panel-2); border: 1px solid var(--border); border-radius: 999px; color: var(--text); font-family: inherit; font-size: 13px; cursor: pointer; }
.pc-switch-btn:hover { border-color: var(--gold-dim); }


/* === Trophy detail modal + gold icons (wave D) === */
.tcard-mark svg { display: block; margin: 0 auto; }
.trophy-detail { text-align: center; padding: 4px 2px 2px; }
.td-icon { width: 64px; height: 64px; margin: 0 auto 10px; display: flex; align-items: center; justify-content: center; }
.td-title { font-family: Georgia, serif; font-size: 22px; color: var(--text); }
.td-rarity { font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 700; margin-top: 4px; }
.td-cat { font-size: 11px; color: var(--muted); margin: 6px 0 14px; }
.td-tiers { display: flex; flex-direction: column; gap: 6px; text-align: left; }
.td-tier { display: grid; grid-template-columns: 12px 62px 1fr auto; align-items: center; gap: 8px; padding: 8px 10px; background: var(--panel-2); border: 1px solid var(--border); border-radius: 8px; opacity: 0.55; }
.td-tier.on { opacity: 1; border-color: var(--gold-dim); }
.td-dot { width: 10px; height: 10px; border-radius: 50%; }
.td-tier-l { font-size: 10.5px; font-weight: 800; letter-spacing: 0.05em; text-transform: uppercase; }
.td-tier-d { font-size: 11px; color: var(--muted); }
.td-tier-s { font-size: 12px; color: var(--gold-bright); font-weight: 700; }


/* === Batch 1: nav/profil/clubhouse polish === */
/* Profile = fixed round avatar top-right, always visible */
.profile-chip { position: fixed !important; top: 12px; right: 14px; z-index: 1400; width: 46px; height: 46px; padding: 0; border-radius: 50%; background: var(--panel); border: 1px solid var(--gold-dim); box-shadow: 0 3px 12px rgba(0,0,0,0.45); display: inline-flex; align-items: center; justify-content: center; overflow: hidden; cursor: pointer; }
.profile-chip:hover { border-color: var(--gold); }
.profile-chip #profile-avatar { width: 44px; height: 44px; display: inline-flex; }
.header-right { padding-right: 58px; }

/* Clubhouse demo caption (replaces EXAMPLE badge) */
.ch-demo-cap { font-size: 11.5px; color: var(--muted-2); text-align: center; margin-bottom: 12px; font-style: italic; }

/* Premium 'trophy wall' sheen on clubhouse frame */
.clubhouse-frame::before { content: ""; position: absolute; inset: 0; border-radius: 14px; pointer-events: none; z-index: 0; background: radial-gradient(130% 70% at 50% -15%, rgba(201,169,97,0.16), transparent 62%); }
.clubhouse-frame > * { position: relative; z-index: 1; }

/* Player-card traits */
.pc-traits { display: flex; flex-direction: column; gap: 6px; margin: 14px 0 4px; text-align: left; }
.pc-trait { display: flex; justify-content: space-between; align-items: center; padding: 8px 12px; background: var(--panel-2); border: 1px solid var(--border); border-radius: 8px; }
.pc-trait-l { font-size: 11px; color: var(--muted); letter-spacing: 0.04em; }
.pc-trait-v { font-size: 13px; font-weight: 700; color: var(--gold-bright); }


/* === Batch 2: Rivalry dashboard + FGL intro === */
.rv-dash { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; margin-bottom: 8px; }
.rv-dash-stat { background: linear-gradient(180deg, rgba(5,18,14,0.58), rgba(3,12,10,0.42)); border: 1px solid rgba(207,166,83,0.42); border-radius: 12px; padding: 12px 8px; text-align: center; }
.rv-dash-stat.rv-dash-primary { border-color: rgba(207,166,83,0.62); background: linear-gradient(180deg, rgba(201,169,97,0.14), rgba(3,12,10,0.42)); }
.rv-dash-primary .rv-dash-v { font-size: 26px; }
.rv-dash-v { font-family: Georgia, serif; font-size: 24px; color: var(--gold-bright); line-height: 1; }
.rv-dash-l { font-size: 9.5px; letter-spacing: 0.16em; color: #d9c9a2; text-transform: uppercase; font-weight: 700; margin-top: 5px; text-shadow: 0 1px 4px rgba(0,0,0,0.85); }
.rv-dash-hint { text-align: center; font-size: 12px; color: var(--muted); margin-bottom: 16px; }
.fgl-intro { max-width: 560px; margin: 16px auto 4px; text-align: center; }
.fgl-intro-lead { font-size: 14px; color: var(--text); line-height: 1.55; }
.fgl-intro-formats { display: flex; flex-wrap: wrap; gap: 7px; justify-content: center; margin: 12px 0; }
.fgl-fmt { font-size: 11.5px; color: var(--gold-bright); background: rgba(201,169,97,0.10); border: 1px solid var(--gold-dim); border-radius: 999px; padding: 5px 12px; font-weight: 600; }
.fgl-intro-why { font-size: 12.5px; color: var(--muted); line-height: 1.5; }
@media (max-width: 480px) { .rv-dash-v { font-size: 20px; } .rv-dash-l { font-size: 8.5px; } }


/* === Season create: format picker === */
.lg-format { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.lg-fmt-btn { display: flex; flex-direction: column; gap: 2px; align-items: flex-start; text-align: left; padding: 10px 12px; background: var(--panel-2); border: 1px solid var(--border); border-radius: 10px; color: var(--text); font-family: inherit; font-weight: 700; font-size: 13px; cursor: pointer; }
.lg-fmt-btn small { font-weight: 400; font-size: 10px; color: var(--muted); }
.lg-fmt-btn.selected { border-color: var(--gold); background: linear-gradient(180deg, rgba(201,169,97,0.14), var(--panel-2)); color: var(--gold-bright); }
.lg-fmt-btn.selected small { color: var(--gold-dim); }


/* ===== Batch A: overlap/z-index + header balance + quicknav + language ===== */
/* Hero golfers a touch more visible */
.header-bg { opacity: 0.95; }
/* Nudge logo/name + chip down for balance */
header { padding-top: 16px; }
/* Profile chip: fixed, follows scroll, always on top of content (now a direct <body> child) */
.profile-chip { position: fixed !important; top: 20px; right: 16px; z-index: 4000 !important; width: 46px; height: 46px; }
/* Global overlay tiers — menus/modals/overlays above the chip, chip above all content */
#modal-bg, .modal-bg { z-index: 9500 !important; }
.more-menu { z-index: 9600 !important; }
.dropdown-menu, #profile-menu { z-index: 9000 !important; }
.mm-overlay, .wl-overlay, #caddie-overlay, .caddie-overlay { z-index: 9400 !important; }
.toast, .toast-large { z-index: 9700 !important; }
/* Clubhouse quick buttons: smaller, elegant shortcuts (not big boxes) */
.ch-qn { margin: 16px 0 6px; }
.ch-qn-grid { gap: 6px; }
.ch-qn-grid button { padding: 9px 4px; border-radius: 9px; font-size: 10px; gap: 4px; }
.ch-qn-grid .ch-qn-i { width: 18px; height: 18px; }
.ch-qn-feat button { padding: 11px 13px; font-size: 13px; }
.ch-qn-feat .ch-qn-i { width: 22px; height: 22px; }
.ch-qn-eyebrow { margin-bottom: 9px; }
/* Profile-card language row */
.pc-lang { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 10px; padding: 8px 12px; background: var(--panel-2); border: 1px solid var(--border); border-radius: 10px; }
.pc-lang-l { font-size: 12px; color: var(--muted); }
.pc-lang-sel { background: var(--bg-2); border: 1px solid var(--border); border-radius: 8px; color: var(--text); padding: 6px 8px; font-family: inherit; font-size: 13px; max-width: 55%; }


/* ===== Batch B: Tee Off page — 4 across, smaller cards, Other wide ===== */
.gk-grid-teeoff { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.gk-grid-teeoff .gk-card { padding: 14px 10px; min-height: 0; }
.gk-grid-teeoff .gk-card .gk-icon-svg { width: 30px; height: 30px; margin-bottom: 6px; }
.gk-grid-teeoff .gk-title { font-size: 14px; }
.gk-grid-teeoff .gk-desc { font-size: 10.5px; line-height: 1.35; }
/* Tee Off choices must stack vertically on mobile — not cramped horizontal (#88) */
@media (max-width: 700px) {
  .gk-grid-teeoff { grid-template-columns: 1fr; }
  .rnd-type-grid { grid-template-columns: 1fr; }
}
.gk-grid-teeoff .gk-card-wide { grid-column: 1 / -1; flex-direction: row; align-items: center; text-align: left; gap: 14px; padding: 14px 16px; }
.gk-grid-teeoff .gk-card-wide .gk-icon-svg { margin-bottom: 0; flex-shrink: 0; }
.gk-grid-teeoff .gk-card-wide .gk-desc { margin: 2px 0 0; }
@media (max-width: 560px) { .gk-grid-teeoff { grid-template-columns: repeat(2, 1fr); } }


/* Caddie notification bell (real icon, clear on/off state) */
.caddie-mute { color: var(--gold); background: none; border: none; cursor: pointer; padding: 6px; display: inline-flex; align-items: center; justify-content: center; border-radius: 8px; }
.caddie-mute:hover { background: rgba(201,169,97,0.12); }
.caddie-mute svg { display: block; }
.caddie-mute.muted { color: var(--muted-2); }


/* ===== FGL format picker cards ===== */
.fgl-formats { max-width: 600px; margin: 18px auto 6px; }
.fgl-formats-eyebrow { text-align: center; font-size: 10px; letter-spacing: 0.28em; color: var(--gold-dim); text-transform: uppercase; font-weight: 700; margin-bottom: 12px; }
.fgl-formats-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.fgl-fmt-card { display: flex; flex-direction: column; gap: 3px; align-items: flex-start; text-align: left; padding: 12px 11px; background: linear-gradient(180deg, rgba(201,169,97,0.10), var(--panel-2)); border: 1px solid var(--gold-dim); border-radius: 12px; color: var(--text); font-family: inherit; cursor: pointer; transition: border-color .12s, transform .12s; }
.fgl-fmt-card:hover { border-color: var(--gold); transform: translateY(-1px); }
.fgl-fmt-card-t { font-weight: 800; font-size: 13px; color: var(--gold-bright); }
.fgl-fmt-card-d { font-size: 10px; color: var(--muted); line-height: 1.3; }
@media (max-width: 620px) { .fgl-formats-grid { grid-template-columns: repeat(2, 1fr); } }


/* ===== Rivalry restructure: search/sort + accordion cards ===== */
.rv-bar { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-bottom: 12px; }
.rv-search { flex: 1; min-width: 150px; background: linear-gradient(180deg, rgba(5,18,14,0.50), rgba(3,12,10,0.36)); border: 1px solid rgba(207,166,83,0.35); border-radius: 999px; color: var(--text); padding: 9px 14px; font-family: inherit; font-size: 13px; backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); }
.rv-sort { display: flex; gap: 4px; flex-wrap: wrap; }
.rv-sort-btn { background: linear-gradient(180deg, rgba(5,18,14,0.50), rgba(3,12,10,0.36)); border: 1px solid rgba(207,166,83,0.28); border-radius: 999px; color: var(--muted); padding: 7px 12px; font-size: 11px; font-weight: 600; cursor: pointer; font-family: inherit; }
.rv-sort-btn.on { border-color: var(--gold); color: var(--gold-bright); background: linear-gradient(180deg, rgba(201,169,97,0.22), rgba(3,12,10,0.42)); }
.rv-card { background: var(--panel-2); border: 1px solid var(--border); border-radius: 12px; margin-bottom: 8px; overflow: hidden; transition: border-color .12s; }
.rv-card.fav, .rv-card.expanded { border-color: var(--gold-dim); }
.rv-card-head { display: flex; align-items: center; gap: 10px; padding: 12px 14px; cursor: pointer; }
.rv-fav { background: none; border: none; color: var(--gold); font-size: 17px; cursor: pointer; padding: 0; line-height: 1; flex-shrink: 0; }
.rv-card-main { flex: 1; min-width: 0; }
.rv-card-title { font-size: 14px; font-weight: 700; color: var(--text); }
.rv-vs { color: var(--gold-dim); font-weight: 400; font-size: 12px; }
.rv-card-sub { font-size: 11.5px; color: var(--muted); margin-top: 2px; }
.rv-pending { font-size: 9px; padding: 2px 7px; border-radius: 999px; background: rgba(201,169,97,0.14); color: var(--gold); text-transform: uppercase; letter-spacing: 0.08em; font-weight: 700; margin-left: 6px; }
.rv-chev { color: var(--gold-dim); transition: transform .15s; flex-shrink: 0; }
.rv-card.expanded .rv-chev { transform: rotate(180deg); }
.rv-card-body { padding: 0 14px 14px; }
.rv-exp-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 12px; }
.rv-exp-cell { background: var(--bg-2); border: 1px solid var(--border); border-radius: 10px; padding: 10px; text-align: center; }
.rv-exp-v { font-family: Georgia, serif; font-size: 18px; color: var(--gold-bright); line-height: 1; }
.rv-exp-l { font-size: 9px; letter-spacing: 0.12em; color: var(--gold-dim); text-transform: uppercase; margin-top: 4px; }
.rv-recent-h { font-size: 10px; letter-spacing: 0.18em; color: var(--gold-dim); text-transform: uppercase; font-weight: 700; margin-bottom: 6px; }
.rv-recent-row { display: grid; grid-template-columns: 22px 1fr auto; align-items: center; gap: 10px; padding: 5px 0; font-size: 12.5px; color: var(--muted); border-bottom: 1px solid var(--border); }
.rv-recent-row:last-child { border-bottom: none; }
.rv-rdot { width: 20px; height: 20px; border-radius: 5px; display: inline-flex; align-items: center; justify-content: center; font-size: 10px; font-weight: 700; background: var(--panel); color: var(--muted); }
.rv-rdot.w { background: rgba(111,174,135,0.2); color: #6fae87; }
.rv-rdot.l { background: rgba(201,122,122,0.15); color: #c97a7a; }
.rv-rsc { color: var(--text); font-weight: 600; }
.rv-exp-actions { display: flex; gap: 8px; margin: 12px 0 8px; flex-wrap: wrap; }
.rv-exp-actions .btn { flex: 1; }
.rv-people { display: flex; gap: 8px; }
.rv-person { flex: 1; background: var(--bg-2); border: 1px solid var(--border); border-radius: 8px; color: var(--text); padding: 8px; font-family: inherit; font-size: 12px; cursor: pointer; }
.rv-person:hover { border-color: var(--gold-dim); }


/* ===== Present as a centered mobile-app column on all screens ===== */
.app { max-width: 460px; margin: 0 auto; padding: 20px 16px calc(90px + env(safe-area-inset-bottom, 0px)); }
/* Subtle app-stage so the empty sides look intentional */
body { background:
  radial-gradient(120% 80% at 50% 0%, rgba(201,169,97,0.05), transparent 55%),
  var(--bg); }
.app { box-shadow: 0 0 70px rgba(0,0,0,0.55); }
/* Profile chip sits at the column's right edge (not the viewport edge), still follows scroll */
.profile-chip { right: max(14px, calc(50% - 216px)) !important; top: 18px; }
/* Force multi-column grids to phone layouts so nothing cramps in the narrow column */
.gk-grid-teeoff { grid-template-columns: repeat(2, 1fr) !important; }
.fgl-formats-grid { grid-template-columns: repeat(2, 1fr) !important; }
.ch-qn-grid { grid-template-columns: repeat(3, 1fr) !important; }
.ch-wall-grid { grid-template-columns: 1fr 1fr !important; }


/* ===== Responsive: mobile style that expands to fit the screen ===== */
.app { max-width: 1040px !important; padding: 26px 22px calc(90px + env(safe-area-inset-bottom, 0px)); }
@media (max-width: 560px) { .app { padding: 16px 14px calc(80px + env(safe-area-inset-bottom, 0px)); } }
.profile-chip { right: max(14px, calc(50% - 506px)) !important; top: 18px; width: 52px !important; height: 52px !important; }
.profile-chip #profile-avatar { width: 50px !important; height: 50px !important; }
/* Grids expand with the screen, collapse on mobile */
.gk-grid-teeoff { grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)) !important; }
.fgl-formats-grid { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)) !important; }
.ch-qn-grid { grid-template-columns: repeat(auto-fit, minmax(96px, 1fr)) !important; }
.ch-wall-grid { grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)) !important; }
.rv-exp-stats { grid-template-columns: repeat(auto-fit, minmax(90px, 1fr)); }
/* FGL "what do you want to create" header */
.fgl-create-h { font-family: Georgia, serif; font-size: clamp(22px, 5vw, 30px); color: var(--text); margin: 6px 0 8px; line-height: 1.15; }
.fgl-create-sub { color: var(--muted); font-size: 13px; max-width: 420px; margin: 0 auto; line-height: 1.5; }


/* ===== Back to Clubhouse + Rivals list ===== */
#back-clubhouse { position: fixed; top: 18px; left: max(14px, calc(50% - 506px)); z-index: 4000; background: var(--panel); border: 1px solid var(--gold-dim); color: var(--gold-bright); border-radius: 999px; padding: 8px 14px; font-size: 12px; font-weight: 700; cursor: pointer; font-family: inherit; box-shadow: 0 3px 12px rgba(0,0,0,0.45); }
#back-clubhouse:hover { border-color: var(--gold); }
.rival-list { display: flex; flex-direction: column; gap: 8px; }
.rival-row { display: flex; align-items: center; gap: 12px; padding: 11px 14px; background: var(--panel-2); border: 1px solid var(--border); border-radius: 12px; cursor: pointer; transition: border-color .12s; }
.rival-row:hover { border-color: var(--gold-dim); }
.rival-row.example { opacity: 0.55; cursor: default; }
.rival-av { width: 38px; height: 38px; flex-shrink: 0; display: inline-flex; }
.rival-av svg { width: 100%; height: 100%; }
.rival-main { flex: 1; min-width: 0; }
.rival-name { font-size: 14px; font-weight: 700; color: var(--text); }
.rival-sub { font-size: 11.5px; color: var(--muted); margin-top: 2px; }
.rival-chev { color: var(--gold-dim); font-size: 18px; flex-shrink: 0; }


/* ===== Perfect centering + bigger always-visible chip + boxes fill the row ===== */
html { scrollbar-gutter: stable both-edges; }
.profile-chip { width: 60px !important; height: 60px !important; top: 16px; }
.profile-chip #profile-avatar { width: 56px !important; height: 56px !important; display: inline-flex; }
.profile-chip #profile-avatar svg, .profile-chip .fr-av { width: 100% !important; height: 100% !important; }
/* Flex-fill: boxes expand to fill the row, no empty gaps */
.ch-wall-grid, .fgl-formats-grid, .ch-qn-grid, .gk-grid-teeoff { display: flex !important; flex-wrap: wrap; gap: 8px; }
.ch-wall-grid > .ch-wall-tile { flex: 1 1 150px; }
.ch-wall-grid > .ch-wall-tile.wide { flex-basis: 100%; }
.fgl-formats-grid > .fgl-fmt-card { flex: 1 1 150px; }
.ch-qn-grid > button { flex: 1 1 96px; }
.gk-grid-teeoff > .gk-card { flex: 1 1 140px; }
.gk-grid-teeoff > .gk-card-wide { flex-basis: 100%; }


/* ===== Center nav tabs + THE CLUBHOUSE sign content ===== */
.tabs { justify-content: center !important; }
.clubhouse-sign { justify-content: center !important; text-align: center !important; }
.clubhouse-sign > * { margin-left: auto; margin-right: auto; text-align: center !important; }


/* ===== Richer rivalry stats (expand + example + full story) ===== */
.rv-exp-stats { display: grid !important; grid-template-columns: repeat(auto-fit, minmax(66px, 1fr)); gap: 8px; }
.rv-narrative { font-size: 13px; line-height: 1.5; color: #ece8da; background: rgba(201,169,97,0.09); border: 1px solid rgba(201,169,97,0.28); border-radius: 10px; padding: 10px 12px; margin: 10px 0; }
.rv-avg-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: 12px; color: var(--muted-2, #9a937f); margin: 10px 0; }
.rv-avg-row b { color: var(--gold-bright, #e1c47e); font-size: 14px; }
.rv-form-dots { display: inline-flex; gap: 4px; }
.rv-fdot { width: 19px; height: 19px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 10px; font-weight: 700; background: rgba(255,255,255,0.08); color: var(--muted-2, #9a937f); }
.rv-fdot.w { background: rgba(126,181,154,0.28); color: #abe2ca; }
.rv-fdot.l { background: rgba(201,90,90,0.24); color: #e7a6a6; }
.rv-records { margin: 10px 0; display: flex; flex-direction: column; gap: 2px; }
.rv-rec-row { display: flex; justify-content: space-between; font-size: 12.5px; padding: 6px 0; border-bottom: 1px solid rgba(255,255,255,0.06); }
.rv-rec-l { color: var(--muted-2, #9a937f); }
.rv-rec-v { color: #ece8da; font-weight: 600; }
.rv-rmar { color: var(--muted-2, #9a937f); font-size: 11px; font-weight: 700; margin-left: 5px; }
/* Full story modal */
.rv-fs { max-height: 80vh; overflow-y: auto; text-align: left; }
.rv-fs-eyebrow { font-size: 11px; letter-spacing: 2px; color: var(--gold, #c9a961); font-weight: 700; }
.rv-fs-title { margin: 4px 0 10px; font-size: 22px; }
.rv-fs-lead { font-size: 14px; line-height: 1.6; color: #cfc9b6; margin-bottom: 14px; }
.rv-fs-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(88px, 1fr)); gap: 8px; margin-bottom: 16px; }
.rv-fs-cell { background: rgba(255,255,255,0.04); border: 1px solid rgba(201,169,97,0.2); border-radius: 10px; padding: 11px 8px; text-align: center; }
.rv-fs-v { font-size: 20px; font-weight: 700; color: var(--gold-bright, #e1c47e); }
.rv-fs-l { font-size: 9.5px; color: var(--muted-2, #9a937f); margin-top: 3px; text-transform: uppercase; letter-spacing: 0.5px; }
.rv-fs-note { font-size: 12px; color: var(--muted-2, #9a937f); margin-top: 14px; line-height: 1.55; }


/* ===== Catalog house-style gold icons ===== */
.gm-ico { display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; border-radius:9px; background: radial-gradient(circle at 50% 35%, rgba(201,169,97,0.20), rgba(201,169,97,0.05)); border:1px solid rgba(201,169,97,0.32); color: var(--gold-bright,#e1c47e); flex-shrink:0; }
.gm-ico svg { width:21px; height:21px; }
.gm-item-icon { font-size:0 !important; }

/* ===== Tee Off: gold selection ring (solo + rivals) ===== */
.rwz-fcard.on { border-color: var(--gold) !important; box-shadow: 0 0 0 2px var(--gold), 0 0 14px rgba(201,169,97,0.35) !important; background: linear-gradient(180deg, rgba(201,169,97,0.18), var(--panel-2)) !important; }
.rwz-fcard.solo.on .rwz-fcard-av.solo-av { background: linear-gradient(180deg,#d8b975,#c9a961) !important; color:#1a1408 !important; border-color: var(--gold) !important; }

/* ===== Clubhouse transparent (see through to page background) ===== */
.clubhouse-frame { background: transparent !important; box-shadow: none !important; }

/* ===== Rivalry clarity: verdict headline + tidy grids that always fill ===== */
.rv-verdict { text-align:center; padding:4px 0 12px; }
.rv-verdict-big { font-size:23px; font-weight:800; color:var(--gold-bright,#e1c47e); letter-spacing:0.4px; }
.rv-verdict-sub { font-size:12.5px; color:#cfc9b6; margin-top:4px; line-height:1.45; }
.rv-exp-stats { display:grid !important; grid-template-columns:repeat(2,1fr) !important; gap:8px; }
@media (min-width:520px){ .rv-exp-stats { grid-template-columns:repeat(4,1fr) !important; } }
.rv-fs-grid { grid-template-columns:repeat(2,1fr) !important; }
@media (min-width:520px){ .rv-fs-grid { grid-template-columns:repeat(4,1fr) !important; } }
.rv-dim-h { font-size:11px; letter-spacing:1.5px; color:var(--gold,#c9a961); font-weight:700; text-transform:uppercase; margin:14px 0 6px; }
.rv-dims { display:flex; flex-wrap:wrap; gap:6px; }
.rv-dim { flex:1 1 130px; background:rgba(255,255,255,0.04); border:1px solid rgba(201,169,97,0.16); border-radius:9px; padding:8px 10px; display:flex; flex-direction:column; gap:2px; }
.rv-dim-l { font-size:10px; color:var(--muted-2,#9a937f); text-transform:uppercase; letter-spacing:0.4px; }
.rv-dim-v { font-size:13.5px; font-weight:700; color:#ece8da; }
.rv-dim-note { font-size:11px; color:var(--muted-2,#9a937f); margin-top:8px; line-height:1.45; }


/* ===== FGL format paywall box ===== */
.fgl-lock { display:flex; align-items:center; gap:10px; background:rgba(201,169,97,0.10); border:1px solid rgba(201,169,97,0.30); border-radius:10px; padding:11px 13px; font-size:12.5px; color:#cfc9b6; line-height:1.45; }
.fgl-lock svg { width:18px; height:18px; flex-shrink:0; color:var(--gold-bright,#e1c47e); }
.fgl-lock strong { color:var(--gold-bright,#e1c47e); }


/* ===== Who-won (hole points) running tally ===== */
.rwz-sc-points { display:flex; align-items:center; justify-content:space-between; gap:8px; background:linear-gradient(180deg, rgba(201,169,97,0.16), rgba(201,169,97,0.05)); border:1px solid rgba(201,169,97,0.30); border-radius:10px; padding:10px 14px; margin-bottom:10px; font-size:13px; color:#ece8da; }
.rwz-sc-points b { color:var(--gold-bright,#e1c47e); font-size:18px; font-weight:800; margin:0 4px; }
.rwz-sc-pts-mid { font-size:10.5px; letter-spacing:0.5px; text-transform:uppercase; color:var(--muted-2,#9a937f); text-align:center; flex:1; }


/* ===== Full Story dimension sections ===== */
.rv-fs-sub { font-size:11.5px; font-weight:700; color:#cfc9b6; margin:11px 0 5px; }
.rv-fs .rv-dims { margin-bottom:2px; }
.rv-fs .rv-dim-h { margin-top:18px; }


/* ===== Adjustments 19 June (batch 1) ===== */
.profile-chip { top: 58px !important; }
.clubhouse-sign { background: rgba(10,18,13,0.30) !important; backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); box-shadow: 0 3px 16px rgba(0,0,0,0.25), inset 0 0 0 1px rgba(201,169,97,0.25) !important; }
.clubhouse-sign::before, .clubhouse-sign::after { background: transparent !important; }
.app input[type=number], .app input[type=text], .app input[type=date], .app input[type=time], .app input[type=email], .app select, .app textarea,
.rwz-sc-input, .rwz-total-input, .rwz-net-input, .field input, .field select, .field textarea {
  background: rgba(13,25,19,0.85) !important;
  border: 1px solid var(--gold-dim, #7a6740) !important;
  color: var(--text, #f0f4f1) !important;
  border-radius: 10px !important;
  font-family: inherit !important;
}
.app input:focus, .app select:focus, .app textarea:focus,
.rwz-sc-input:focus, .rwz-total-input:focus, .field input:focus {
  border-color: var(--gold, #c9a961) !important;
  box-shadow: 0 0 0 2px rgba(201,169,97,0.25) !important;
  outline: none !important;
}
.app input::placeholder, .app textarea::placeholder { color: rgba(240,244,241,0.35) !important; }


/* ===== Profile card — narrower, exclusive, Rivalry ID ===== */
.player-card { max-width: 340px !important; margin: 0 auto; }
.pc-rid { font-size: 11px; letter-spacing: 1.5px; color: var(--muted-2,#9a937f); margin: 3px 0 1px; text-transform: uppercase; }
.pc-rid b { color: var(--gold-bright,#e1c47e); font-size: 15px; letter-spacing: 2px; margin-left: 2px; }
.pc-stat-v { font-variant-numeric: tabular-nums; }
.player-card .pc-actions .btn { padding: 11px 10px; }


/* ===== Rarest trophy highlight ===== */
.rarest-trophy { background: linear-gradient(180deg, rgba(201,169,97,0.12), rgba(201,169,97,0.03)); border:1px solid rgba(201,169,97,0.3); border-radius:14px; padding:16px 18px; }
.rarest-eyebrow { font-size:11px; letter-spacing:2px; color:var(--gold,#c9a961); font-weight:700; margin-bottom:10px; }
.rarest-row { display:flex; align-items:center; gap:16px; }
.rarest-ic { flex:0 0 auto; width:58px; height:58px; display:inline-flex; align-items:center; justify-content:center; }
.rarest-ic svg { width:58px; height:58px; }
.rarest-name { font-size:18px; font-weight:800; color:#f0ece0; }
.rarest-desc { font-size:12.5px; color:var(--muted-1,#cfc9b6); margin-top:2px; line-height:1.4; }
.rarest-tier { font-size:10.5px; letter-spacing:1.5px; color:var(--gold-bright,#e1c47e); font-weight:700; margin-top:6px; }


/* ===== Hole Winner with score inputs ===== */
.rwz-sc-head.winner2, .rwz-sc-row.winner2 { display:grid !important; grid-template-columns: 34px 48px 1fr 1fr 54px; align-items:center; gap:6px; }
.win-in { width:100%; text-align:center; padding:7px 2px !important; }
.win-res { text-align:center; font-weight:800; font-size:12px; }
.win-res.w { color:#abe2ca; } .win-res.l { color:#e7a6a6; } .win-res.h { color:var(--gold-bright,#e1c47e); }


/* ===== Scan scorecard button ===== */
.rwz-scan-btn { display:flex; align-items:center; justify-content:center; gap:8px; width:100%; padding:11px; margin-bottom:12px; background:rgba(201,169,97,0.08); border:1px dashed var(--gold-dim,#7a6740); border-radius:10px; color:var(--gold-bright,#e1c47e); font-family:inherit; font-size:13px; font-weight:600; cursor:pointer; }
.rwz-scan-btn svg { width:18px; height:18px; }
.rwz-scan-btn:hover { border-color:var(--gold,#c9a961); }


/* ===== Stakes at round start ===== */
.rwz-stakes-wrap { margin-top: 18px; }
.rwz-stake-row { display:flex; flex-wrap:wrap; gap:7px; margin-top:8px; }
.stake-chip { padding:8px 14px; background:rgba(13,25,19,0.7); border:1px solid var(--gold-dim,#7a6740); border-radius:999px; color:var(--text,#f0f4f1); font-family:inherit; font-size:12.5px; font-weight:600; cursor:pointer; }
.stake-chip.on { background:linear-gradient(180deg,#d8b975,#c9a961); color:#1a1408; border-color:var(--gold,#c9a961); }


/* ===== Handicap importer ===== */
.hci-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:6px 12px; max-height:46vh; overflow-y:auto; padding:2px; }
.hci-row { display:flex; align-items:center; gap:8px; }
.hci-n { width:22px; text-align:right; color:var(--muted-2,#9a937f); font-size:12px; }
.hci-in { flex:1; min-width:0; }
.hci-result { text-align:center; margin-top:14px; }
.hci-idx { font-size:38px; font-weight:800; color:var(--gold-bright,#e1c47e); line-height:1; }
.hci-idx-l { font-size:12px; color:var(--muted-1,#cfc9b6); margin-top:6px; }


/* ===== Play-with-handicap badge in scorecard ===== */
.rwz-hc-badge { display:flex; align-items:center; gap:7px; background:rgba(126,181,154,0.14); border:1px solid rgba(126,181,154,0.4); color:#a9e0c8; border-radius:9px; padding:8px 12px; font-size:12px; font-weight:600; margin-bottom:10px; }
.rwz-hc-badge svg { width:15px; height:15px; flex-shrink:0; }


/* ===== Add rival search ===== */
.ar-note { color:var(--muted-2,#9a937f); font-size:12.5px; line-height:1.5; padding:4px 2px; }
#ar-results .rival-row { margin-bottom:6px; }


/* ===== Active rounds (live spectator) ===== */
#ch-active-rounds { margin-bottom: 14px; }
.ch-active-h { font-size:11px; letter-spacing:1.5px; color:var(--gold,#c9a961); font-weight:700; text-transform:uppercase; margin:0 0 6px; }
.ch-active-card { display:flex; align-items:center; gap:10px; width:100%; text-align:left; padding:12px 14px; background:linear-gradient(180deg, rgba(126,181,154,0.12), rgba(126,181,154,0.03)); border:1px solid rgba(126,181,154,0.35); border-radius:12px; color:var(--text,#f0f4f1); font-family:inherit; cursor:pointer; margin-bottom:6px; }
.ch-live-dot { width:9px; height:9px; border-radius:50%; background:#7ee0b0; box-shadow:0 0 0 0 rgba(126,224,176,0.6); animation:chLivePulse 1.6s infinite; flex-shrink:0; }
@keyframes chLivePulse { 0%{box-shadow:0 0 0 0 rgba(126,224,176,0.5);} 70%{box-shadow:0 0 0 8px rgba(126,224,176,0);} 100%{box-shadow:0 0 0 0 rgba(126,224,176,0);} }
.ch-active-main { flex:1; }
.ch-active-name { font-weight:700; font-size:14px; }
.ch-active-sub { font-size:12px; color:var(--muted-2,#9a937f); }
.ch-live-badge { display:inline-block; padding:6px 16px; border-radius:999px; background:rgba(126,224,176,0.15); border:1px solid rgba(126,224,176,0.5); color:#a9e0c8; font-weight:800; font-size:12px; letter-spacing:1px; }


/* ===== Minigame catalog — smaller boxes, flex-fill, gold heading ===== */
.gm-list { display:flex !important; flex-wrap:wrap; gap:7px; }
.gm-list .gm-item { flex:1 1 150px; padding:9px 11px !important; }
.gm-item-title { font-size:13px !important; }
.gm-item-desc { font-size:11px !important; }
.gm-ico { width:30px !important; height:30px !important; }
.gm-ico svg { width:18px !important; height:18px !important; }
.gm-gold-head { flex-basis:100%; width:100%; font-size:11px; letter-spacing:1.2px; color:var(--gold-bright,#e1c47e); font-weight:700; text-transform:uppercase; margin-bottom:2px; }


/* ===== Header — brand lower ===== */
header .brand { margin-top: 34px; }
@media (max-width:480px){ header .brand { margin-top: 22px; } }


/* ===== Hole-set selector + HC extra strokes ===== */
.rwz-hsel { display:flex; gap:6px; margin-bottom:10px; flex-wrap:wrap; }
.hs-btn { flex:1 1 auto; padding:8px 10px; background:rgba(13,25,19,0.7); border:1px solid var(--gold-dim,#7a6740); border-radius:9px; color:var(--text,#f0f4f1); font-family:inherit; font-size:12.5px; font-weight:600; cursor:pointer; }
.hs-btn.on { background:linear-gradient(180deg,#d8b975,#c9a961); color:#1a1408; border-color:var(--gold,#c9a961); }
.rwz-hcustom { display:flex; flex-wrap:wrap; gap:5px; margin-bottom:10px; }
.hc-num { width:32px; height:32px; padding:0; background:rgba(13,25,19,0.7); border:1px solid var(--gold-dim,#7a6740); border-radius:8px; color:var(--muted-1,#cfc9b6); font-family:inherit; font-size:12px; font-weight:600; cursor:pointer; }
.hc-num.on { background:rgba(201,169,97,0.25); border-color:var(--gold,#c9a961); color:var(--gold-bright,#e1c47e); }
.rwz-hc-extra { color:var(--gold-bright,#e1c47e); font-weight:700; font-size:11px; margin-left:3px; }


/* ===== Hole Winner — dim players without a score ===== */
.win-in:placeholder-shown { opacity: 0.5; }
.win-in:focus { opacity: 1; }


/* ===== Stakes row in rival/player card ===== */
.pc-stake-row { display:flex; align-items:center; justify-content:space-between; gap:8px; background:rgba(201,169,97,0.08); border:1px solid rgba(201,169,97,0.25); border-radius:10px; padding:9px 12px; margin:10px 0 2px; font-size:12.5px; color:#ece8da; }
.pc-stake-row b { color:var(--gold-bright,#e1c47e); }


/* ===== Tee Off — wide date, lighter section labels ===== */
#r-date-row #r-date { width: 100%; }
.rnd-rank-label, .rwz-step-title { font-weight: 500 !important; letter-spacing: 0.3px; }


/* 3-step Tee Off: keep screens + nav, only the one-hole stepper is gone */
#r-hbh-wizard { display: none !important; }
.rwz-step-title { font-weight: 400 !important; }
#r-form-golf summary, .rnd-cond summary, .rnd-weather-extra summary, .rwz-stakes-wrap summary { font-weight: 400 !important; }


/* ===== Hole Winner multi-player scorecard ===== */
.rwz-sc-head.winnerN, .rwz-sc-row.winnerN { display:grid !important; align-items:center; gap:6px; }
.rwz-sc-head.winnerN > div { font-size:10.5px; text-align:center; color:var(--muted-2,#9a937f); overflow:hidden; text-overflow:ellipsis; }
.win-in { width:100%; text-align:center; padding:7px 2px !important; }
.win-in.win-cell-on { border-color:var(--gold,#c9a961) !important; background:rgba(201,169,97,0.20) !important; color:var(--gold-bright,#e1c47e) !important; font-weight:700; }


/* Hide Wizard/Full-scorecard view toggle; per-player winner cells */
#rwz-hbh-toggle-row { display: none !important; }
.rwz-sc-head.winnerN > div { font-size: 9.5px !important; }
.win-pcell { display:flex; align-items:center; justify-content:center; gap:3px; }
.win-pcell .rwz-hc-extra { font-size:11px; background:none; border-radius:0; padding:0; }

/* HC overview modal (#93) */
.hco { text-align:center; }
.hco-idx { font-size:48px; font-weight:800; color:var(--gold-bright,#e1c47e); line-height:1; margin:6px 0 4px; }
.hco-idx-sub { font-size:12px; color:var(--muted,#aaa); margin-bottom:14px; }
.hco-chips { display:flex; gap:8px; margin:0 0 14px; }
.hco-chip { flex:1; border:1px solid var(--border); border-radius:10px; padding:10px 4px; background:var(--panel-2); }
.hco-chip-v { font-size:18px; font-weight:800; color:var(--text,#fff); }
.hco-chip-l { font-size:10px; text-transform:uppercase; letter-spacing:0.04em; color:var(--muted,#aaa); }
.hco-rounds-h { text-align:left; font-size:11px; letter-spacing:0.06em; text-transform:uppercase; color:var(--gold-dim,#7a6740); margin:6px 0 8px; }
.hco-rounds { text-align:left; max-height:280px; overflow-y:auto; }
.hco-row { display:grid; grid-template-columns:70px 1fr 38px 46px; gap:6px; align-items:center; padding:7px 4px; border-bottom:1px solid var(--border); font-size:12px; color:var(--muted,#aaa); }
.hco-row.counts { color:var(--text,#fff); }
.hco-row.counts .hco-row-diff { color:var(--gold-bright,#e1c47e); font-weight:800; }
.hco-row-total { text-align:right; }
.hco-row-diff { text-align:right; font-weight:700; }
/* Rival profile = mini clubhouse wall (#91) */
.rival-wall-eyebrow { font-size:11px; letter-spacing:0.08em; text-transform:uppercase; color:var(--gold-dim,#7a6740); margin:14px 0 8px; text-align:center; }
.ch-wall-grid.rival-wall { grid-template-columns:repeat(3, 1fr); gap:8px; }
.rival-wall .ch-wall-tile { padding:12px 8px; }
.rival-wall .ch-wall-num { font-size:22px; }
@media (max-width:480px){ .ch-wall-grid.rival-wall { grid-template-columns:repeat(2,1fr); } }

/* Clubhouse stat boxes — Rounds/Rivals/Courses/Trophies/HC (#85) */
.ch-stats-row { display:grid; grid-template-columns:repeat(5, 1fr); gap:7px; margin:2px 0 14px; }
.ch-stat-box { display:flex; flex-direction:column; align-items:center; gap:3px; padding:11px 3px; border:1px solid var(--gold-dim,#7a6740); border-radius:12px; background:linear-gradient(180deg, rgba(201,169,97,0.08), rgba(201,169,97,0.02)); cursor:pointer; min-width:0; }
.ch-stat-box:active { background:rgba(201,169,97,0.16); }
.ch-stat-box .ch-qn-i { width:19px; height:19px; color:var(--gold,#c9a961); }
.ch-stat-v { font-size:19px; font-weight:800; color:var(--text,#fff); line-height:1; }
.ch-stat-l { font-size:9.5px; letter-spacing:0.03em; text-transform:uppercase; color:var(--muted,#aaa); }
/* expand the clubhouse wall — bigger, more presence */
.ch-wall-eyebrow { margin-top:2px; }
.ch-wall-grid { gap:10px; }
.ch-wall-tile { padding:15px 13px; }
.ch-wall-num { font-size:30px; }
.ch-wall-num-s { font-size:19px; }

/* Clubhouse Approvals box + sent rows + 3-day rule (#81/#82) */
.dash-approvals-box { display:flex; align-items:center; gap:12px; width:100%; text-align:left; cursor:pointer; margin:0 0 12px; padding:13px 15px; border:1px solid var(--gold-dim,#7a6740); border-radius:14px; background:linear-gradient(180deg, rgba(201,169,97,0.10), rgba(201,169,97,0.03)); color:var(--text,#fff); }
.dash-approvals-box:active { background:rgba(201,169,97,0.16); }
.dab-ic { width:34px; height:34px; flex:0 0 34px; display:flex; align-items:center; justify-content:center; border-radius:10px; background:rgba(201,169,97,0.14); color:var(--gold-bright,#e1c47e); }
.dab-ic svg { width:19px; height:19px; }
.dab-main { display:flex; flex-direction:column; flex:1; min-width:0; }
.dab-title { font-weight:800; font-size:15px; color:var(--gold-bright,#e1c47e); }
.dab-sub { font-size:12px; color:var(--muted,#aaa); }
.dab-badge { flex:0 0 auto; min-width:24px; height:24px; padding:0 7px; display:inline-flex; align-items:center; justify-content:center; border-radius:12px; background:var(--gold,#c9a961); color:#1a1408; font-weight:800; font-size:13px; }
.dab-chev { color:var(--gold-dim,#7a6740); font-size:22px; line-height:1; }
.approvals-rule { font-size:12px; color:var(--muted,#aaa); background:rgba(201,169,97,0.06); border:1px solid var(--border); border-radius:8px; padding:8px 10px; margin:0 0 12px; }
.approvals-rule b { color:var(--gold-bright,#e1c47e); }
.approvals-sent-h { font-size:11px; letter-spacing:0.08em; text-transform:uppercase; color:var(--gold-dim,#7a6740); margin:16px 0 8px; }
.approval-sent-row { display:flex; align-items:center; gap:9px; font-size:13px; color:var(--muted,#aaa); padding:7px 2px; }
.approval-sent-row b { color:var(--text,#fff); }
.asr-dot { width:7px; height:7px; border-radius:50%; background:var(--gold-dim,#7a6740); flex:0 0 7px; }

/* Approvals tab + nav badge (#70-72) */
.approvals-badge { display:inline-flex; align-items:center; justify-content:center; min-width:16px; height:16px; padding:0 4px; margin-left:5px; border-radius:9px; background:var(--gold,#c9a961); color:#1a1408; font-size:10px; font-weight:800; vertical-align:middle; }
.approval-card { border:1px solid var(--gold-dim,#7a6740); border-radius:12px; padding:14px 16px; margin-bottom:12px; background:rgba(201,169,97,0.05); }
.approval-head { font-size:13px; color:var(--muted,#aaa); margin-bottom:6px; }
.approval-score { font-size:18px; color:var(--text,#fff); margin-bottom:12px; }
.approval-score b { color:var(--gold-bright,#e1c47e); }
.approval-actions { display:flex; gap:8px; }
.approval-actions .btn-small { flex:1; }

/* Score/par steppers — start at par, adjust with +/- (#66) */
.rwz-step { display:flex; align-items:center; justify-content:center; gap:3px; }
/* FIX: wizard step containers collide with the +/- stepper class; force vertical block layout (was rendering ROUND TYPE | PLAYED WITH | Next horizontally and pushing Next off-screen on mobile) */
#rwz-step-1, #rwz-step-2, #rwz-step-3 { display:block; align-items:initial; justify-content:initial; gap:0; }

.rwz-step-btn { width:20px; height:26px; border:1px solid var(--gold-dim,#7a6740); background:rgba(201,169,97,0.08); color:var(--gold,#c9a961); border-radius:6px; font-size:16px; line-height:1; font-weight:800; cursor:pointer; padding:0; -webkit-appearance:none; }
.rwz-step-btn:active { background:rgba(201,169,97,0.28); }
.rwz-step-btn.sm { width:17px; height:22px; font-size:12px; }
.rwz-step-val { min-width:18px; text-align:center; font-size:17px; font-weight:800; color:var(--text,#fff); }
.rwz-step-val.dim { color:var(--muted-2,#6f6f6f); font-weight:500; }
.rwz-step-val.win-cell-on { color:var(--gold-bright,#e1c47e); }
.par-step .rwz-step-val { font-size:14px; font-weight:600; color:var(--muted,#aaa); min-width:14px; }
.rwz-sc-parcell .par-step { gap:2px; }

/* Hole Winner points bar — horizontal, gold, over the scorecard (#64) */
.rwz-sc-stat { display:flex; gap:18px; justify-content:center; align-items:baseline; margin:0 0 10px; flex-wrap:wrap; position:sticky; top:0; z-index:6; background:#0a0f0c; padding:10px 0 8px; border-bottom:1px solid var(--border); }
.rwz-sc-statcol { display:flex; flex-direction:column; align-items:center; gap:1px; }
.rwz-sc-statname { font-size:11px; letter-spacing:0.05em; text-transform:uppercase; color:var(--gold-dim,#7a6740); }
.rwz-sc-statpts { color:var(--gold,#c9a961); font-size:12px; }
.rwz-sc-statpts b { font-size:22px; font-weight:800; color:var(--gold-bright,#e1c47e); margin-right:3px; }

.win-pcell .win-in { max-width:46px; }


/* Uniform Tee Off group summaries — all match Temperature & wind (muted, not bold) */
.rnd-cond summary, .rnd-weather-extra summary, #r-form-golf details summary {
  font-weight: 400 !important;
  color: var(--muted) !important;
  font-size: 12px !important;
}
.rnd-cond summary span, .rnd-weather-extra summary span, #r-form-golf details summary span {
  color: var(--muted-2) !important;
}


/* Round summary — played-to per player */
.rss-playedto { margin-top:14px; background:rgba(255,255,255,0.04); border:1px solid rgba(201,169,97,0.18); border-radius:10px; padding:10px 14px; }
.rss-pt-h { font-size:11px; letter-spacing:1px; text-transform:uppercase; color:var(--gold,#c9a961); font-weight:700; margin-bottom:6px; text-align:center; }
.rss-pt-row { display:flex; justify-content:space-between; font-size:13px; padding:4px 0; border-bottom:1px solid rgba(255,255,255,0.05); }
.rss-pt-row b { color:var(--gold-bright,#e1c47e); }


/* Edit profile — hide the read-only player card (only show editable fields) */
#profile-summary { display: none !important; }


/* Caddie always-visible + smaller panel */
.caddie-fab { z-index: 9999 !important; bottom: 90px !important; }
@media (max-width: 640px) {
  .caddie-fab { width: 50px !important; height: 50px !important; left: 14px; bottom: 96px !important; }
  .caddie-panel { height: min(58vh, 440px) !important; }
}


/* Caddie chips single row + scrollable messages */
.caddie-chips { flex-wrap: nowrap !important; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
.caddie-chips::-webkit-scrollbar { display: none; }
.caddie-chips .caddie-chip { flex: 0 0 auto; }
.caddie-messages { -webkit-overflow-scrolling: touch; overscroll-behavior: contain; }


/* Detailed install instructions */
.install-steps { margin:0; padding:0; list-style:none; counter-reset:ist; }
.install-steps li { position:relative; padding:11px 0 11px 40px; font-size:14px; line-height:1.55; color:var(--text,#f0f4f1); border-bottom:1px solid rgba(255,255,255,0.06); counter-increment:ist; }
.install-steps li:last-child { border-bottom:none; }
.install-steps li::before { content:counter(ist); position:absolute; left:0; top:10px; width:26px; height:26px; border-radius:50%; background:linear-gradient(180deg,#d8b975,#c9a961); color:#1a1408; font-weight:800; font-size:13px; display:flex; align-items:center; justify-content:center; }
.install-steps li strong { color:var(--gold-bright,#e1c47e); }
.install-note { font-size:12.5px; color:var(--muted,#9a937f); line-height:1.5; margin-top:12px; background:rgba(201,169,97,0.08); border:1px solid rgba(201,169,97,0.25); border-radius:10px; padding:10px 12px; }


/* Install coach — arrow points to the browser menu */
.install-coach { position:fixed; inset:0; z-index:99999; background:rgba(3,7,5,0.85); display:flex; align-items:center; justify-content:center; padding:20px; }
.ic-arrow { position:fixed; font-size:52px; line-height:1; color:var(--gold-bright,#e1c47e); text-shadow:0 2px 14px rgba(0,0,0,0.7); pointer-events:none; font-weight:900; }
.ic-arrow.up { animation:icUp 0.9s ease-in-out infinite; }
.ic-arrow.down { animation:icDown 0.9s ease-in-out infinite; }
@keyframes icUp { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-14px)} }
@keyframes icDown { 0%,100%{transform:translateY(0)} 50%{transform:translateY(14px)} }
.ic-card { background:linear-gradient(180deg,var(--panel,#0d1913),var(--bg,#060d0a)); border:1px solid var(--gold,#c9a961); border-radius:16px; padding:18px; max-width:360px; width:100%; box-shadow:0 12px 44px rgba(0,0,0,0.55); }
.ic-card h2 { font-size:18px; }

/* Hide developer/admin/technical surfaces from normal users (dev-mode = rivalry 000-001) */
body:not(.dev-mode) .dev-only { display:none !important; }

/* Course-data completeness note (missing CR / par on round start) */
.course-data-note { margin:8px 0 4px; padding:10px 12px; border:1px solid var(--gold-dim); border-radius:10px; background:rgba(201,169,97,0.06); font-size:12.5px; }
.cdn-row { display:flex; flex-wrap:wrap; align-items:center; gap:8px 12px; margin:3px 0; }
.cdn-warn { color:var(--gold-bright); font-weight:600; }
.cdn-controls { display:inline-flex; align-items:center; gap:6px; flex-wrap:wrap; color:var(--muted); }
.cdn-controls input { width:72px; padding:6px 8px; border-radius:8px; border:1px solid var(--border,#25352c); background:rgba(255,255,255,0.04); color:var(--text); font-size:13px; }
.cdn-controls input#cdn-slope, .cdn-controls input#cdn-par { width:64px; }
.cdn-hint { color:var(--muted-2); font-size:11.5px; flex-basis:100%; }
.course-data-note .btn-small { padding:6px 12px; font-size:12px; }

/* Editable par-per-hole cell in the Hole Winner / Hole by Hole scorecard */
.rwz-sc-parcell { padding:0 2px; }
.rwz-sc-parin { width:100%; max-width:42px; text-align:center; padding:4px 2px; border:1px solid var(--border,#25352c); border-radius:6px; background:rgba(255,255,255,0.04); color:var(--text-2); font-size:12px; -moz-appearance:textfield; }
.rwz-sc-parin::-webkit-outer-spin-button, .rwz-sc-parin::-webkit-inner-spin-button { -webkit-appearance:none; margin:0; }
.rwz-sc-parin:focus { border-color:var(--gold); color:var(--text); outline:none; }

/* ============ Welcome screen used as the public landing page ============ */
.wl-overlay { z-index: 9000 !important; }   /* above app chrome, below auth modal (9500) */
body.wl-showing #mobile-fab,
body.wl-showing #caddie-fab,
body.wl-showing .caddie-overlay,
body.wl-showing #profile-chip,
body.wl-showing #pwa-install-banner,
body.wl-showing #pwa-ios-sheet,
body.wl-showing #install-coach { display: none !important; }

/* Fit the whole landing on a single mobile screen (no scroll) */
@media (max-width: 640px) {
  .wl-content { min-height: 100svh; display: flex; flex-direction: column; justify-content: center;
    padding: 16px 20px calc(16px + env(safe-area-inset-bottom)); }
  .wl-logo { width: 120px !important; height: 120px !important; margin: 0 auto 8px !important; }
  .wl-brand { font-size: 29px !important; margin-bottom: 3px !important; }
  .wl-brand-sub { font-size: 9.5px !important; letter-spacing: 0.24em !important; margin-bottom: 12px !important; }
  .wl-headline { font-size: 25px !important; margin-bottom: 8px !important; }
  .wl-body { font-size: 12.5px !important; margin-bottom: 12px !important; }
  .wl-pillars { display: grid !important; grid-template-columns: repeat(3, 1fr) !important; gap: 7px !important; margin-bottom: 14px !important; }
  .wl-pillar { padding: 9px 5px !important; border-radius: 10px !important; }
  .wl-pillar-title { font-size: 10px !important; letter-spacing: 0.16em !important; margin-bottom: 3px !important; }
  .wl-pillar-sub { font-size: 8px !important; letter-spacing: 0.02em !important; }
  .wl-form { margin-bottom: 8px !important; }
  .wl-input { padding: 12px 16px !important; margin-bottom: 9px !important; font-size: 15px !important; }
  .wl-cta-primary { padding: 13px !important; }
  .wl-cta-demo { margin-top: 9px !important; }
  .wl-cta-tertiary { padding: 7px !important; font-size: 13px !important; }
  .wl-badges { margin-top: 10px !important; }
  .wl-badge { font-size: 10.5px !important; }
}

/* #106 — per-player total strokes + over/under (net when playing with HC) under the points */
.rwz-sc-stattot { font-size: 11px; color: var(--gold-dim); font-weight: 600; margin-top: 2px; letter-spacing: 0.02em; }
.rwz-sc-statcol { display: flex; flex-direction: column; align-items: center; gap: 1px; }

/* #103 — give the multi-player scorecard more room: near full-bleed on mobile */
@media (max-width: 700px) {
  #r-hbh-scorecard { width: calc(100vw - 16px); max-width: calc(100vw - 16px); margin-left: calc(50% - 50vw + 8px); margin-right: calc(50% - 50vw + 8px); }
  .rwz-sc-grid.winnerN { width: 100%; max-width: 100%; margin: 0; }
}

/* ===================== SETUP PLAYER SLOTS (#107/#108) ===================== */
.rwz-players-wrap { margin: 14px 0 4px; }
.rwz-players-label { font-size: 11px; letter-spacing: 0.22em; color: var(--gold-dim); text-transform: uppercase; font-weight: 600; margin-bottom: 8px; }
.rwz-players-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.rwz-pslot { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; min-height: 92px; padding: 12px 8px; border-radius: 12px; border: 1px solid rgba(201,169,97,0.28); background: linear-gradient(160deg, rgba(201,169,97,0.10), rgba(201,169,97,0.02) 60%, rgba(7,15,11,0.4)); font-family: inherit; color: var(--text); text-align: center; }
.rwz-pslot.you { border-color: var(--gold); box-shadow: inset 0 0 0 1px rgba(201,169,97,0.25); }
.rwz-pslot.add { border-style: dashed; border-color: var(--gold-dim); background: rgba(201,169,97,0.04); cursor: pointer; }
.rwz-pslot.add:active { background: rgba(201,169,97,0.10); }
.rwz-pslot-av { width: 38px; height: 38px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; font-weight: 800; font-size: 14px; color: #1a1408; background: linear-gradient(180deg, #d8b975, #c9a961); border: 1px solid var(--gold); }
.rwz-pslot-av.plus { background: rgba(201,169,97,0.12); color: var(--gold-bright); border: 1px solid var(--gold-dim); font-size: 22px; font-weight: 400; }
.rwz-pslot-name { font-size: 13px; font-weight: 700; color: var(--gold-bright); }
.rwz-pslot-hc { font-size: 10px; letter-spacing: 0.04em; color: var(--muted); text-transform: uppercase; }
.rwz-pslot-hcedit { font-size: 10px; letter-spacing: 0.06em; color: var(--muted); text-transform: uppercase; display: inline-flex; align-items: center; gap: 4px; }
.rwz-pslot-hcedit input { width: 46px; padding: 3px 5px; font-size: 12px; text-align: center; border: 1px solid var(--gold-dim); border-radius: 6px; background: var(--bg-2); color: var(--gold-bright); font-family: inherit; }
.rwz-pslot-hcedit input:focus { border-color: var(--gold); outline: none; }
.rwz-pslot-x { position: absolute; top: 5px; right: 6px; width: 20px; height: 20px; border-radius: 999px; border: 1px solid var(--border); background: rgba(0,0,0,0.35); color: var(--muted); font-size: 14px; line-height: 1; cursor: pointer; padding: 0; }
.rwz-pslot-x:hover { color: var(--tension); border-color: var(--tension); }

/* #108 — Round Type a touch smaller now that it shares step 1 */
#rwz-step-1 .rnd-rank-btn { padding: 11px 8px; }
#rwz-step-1 .rnd-rank-svg { width: 24px; height: 24px; }
#rwz-step-1 .rnd-rank-name { font-size: 12px; }
#rwz-step-1 .rnd-rank-desc { font-size: 10px; }
.rnd-score-wrap-setup { margin-top: 16px; }

/* #111 — scorecard text scales down as more players join */
.rwz-sc-grid.winnerN[data-pc="3"] .rwz-step-val { font-size: 15px; }
.rwz-sc-grid.winnerN[data-pc="4"] .rwz-step-val { font-size: 13px; }
.rwz-sc-grid.winnerN[data-pc="4"] .rwz-step-btn { width: 17px; height: 22px; font-size: 13px; }
.rwz-sc-grid.winnerN[data-pc="4"] .rwz-hc-extra { font-size: 8px; }
.rwz-sc-grid.winnerN[data-pc="4"] .rwz-sc-head > div { font-size: 9px; }

/* ===================== CLUBHOUSE NEW STATS LAYOUT (#112) ===================== */
.ch-season-record { background: linear-gradient(160deg, rgba(201,169,97,0.16), rgba(201,169,97,0.04) 60%, rgba(7,15,11,0.5)); border: 1px solid rgba(201,169,97,0.40); border-radius: 14px; padding: 16px 18px; margin-bottom: 12px; text-align: center; box-shadow: inset 0 1px 0 rgba(247,236,192,0.08), 0 4px 16px rgba(0,0,0,0.3); }
.ch-sr-label { font-size: 10.5px; letter-spacing: 0.26em; color: var(--gold-dim); text-transform: uppercase; font-weight: 700; }
.ch-sr-value { font-family: Georgia, serif; font-size: 40px; font-weight: 700; color: var(--gold-bright); line-height: 1.1; margin: 4px 0 2px; }
.ch-sr-sub { font-size: 11.5px; color: var(--muted); }
.ch-stat3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 6px; }
.ch-stat3 .ch-wall-tile { padding: 10px 8px; text-align: center; }
.ch-stat3 .ch-wall-eyebrow-s { font-size: 8px; letter-spacing: 0.12em; }
.ch-stat3 .ch-wall-num-s { font-size: 15px; }
.ch-stat3 .ch-wall-sub { font-size: 9px; }
.ch-wall-tile.ch-tap { cursor: pointer; }
.ch-wall-tile.ch-tap:active { background: linear-gradient(160deg, rgba(201,169,97,0.20), rgba(201,169,97,0.05)); }
@media (max-width: 380px) { .ch-stat3 { gap: 6px; } .ch-stat3 .ch-wall-num-s { font-size: 13px; } }

/* ===================== HC GRAPHICAL VIEW (#113) ===================== */
.hco-chart { margin: 12px 0 14px; background: linear-gradient(180deg, rgba(201,169,97,0.05), rgba(7,15,11,0.3)); border: 1px solid rgba(201,169,97,0.20); border-radius: 12px; padding: 10px 8px 8px; }
.hco-chart-cap { font-size: 9.5px; color: var(--muted-2); text-align: center; letter-spacing: 0.04em; margin-top: 4px; }
.hco-chart-empty { font-size: 12px; color: var(--muted); text-align: center; padding: 18px 0; }

/* ===================== PROFILE CARD (#114) ===================== */
.pc-cardified { text-align: left; }
.pc-head { display: flex; align-items: center; gap: 12px; padding: 4px 0 14px; }
.pc-avatar-sm { width: 64px; height: 64px; flex: none; }
.pc-head-meta { flex: 1; min-width: 0; }
.pc-cardified .pc-name { font-size: 20px; font-weight: 700; margin: 0 0 6px; text-align: left; }
.pc-headline { display: flex; flex-wrap: wrap; gap: 6px; }
.pc-hc-chip { font-size: 11px; font-weight: 700; letter-spacing: 0.04em; color: #1a1408; background: linear-gradient(180deg, #d8b975, #c9a961); border-radius: 999px; padding: 3px 10px; }
.pc-club-chip { font-size: 11px; color: var(--gold-bright); background: rgba(201,169,97,0.12); border: 1px solid rgba(201,169,97,0.3); border-radius: 999px; padding: 3px 10px; }
.pc-club-chip.muted { color: var(--muted-2); border-color: var(--border); background: transparent; }
.pc-mini-grid { margin-bottom: 4px; }

/* ===================== ROUND DETAIL — result + tee-off (#115) ===================== */
.ro-result { text-align: center; border-radius: 12px; padding: 14px; margin-bottom: 12px; border: 1px solid var(--border); background: var(--bg-2); }
.ro-result.win { border-color: rgba(126,181,154,0.45); background: linear-gradient(180deg, rgba(126,181,154,0.12), rgba(7,15,11,0.3)); }
.ro-result.loss { border-color: rgba(201,122,122,0.40); background: linear-gradient(180deg, rgba(201,122,122,0.10), rgba(7,15,11,0.3)); }
.ro-result.tie { border-color: rgba(201,169,97,0.40); }
.ro-result-label { font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--muted-2); }
.ro-result-score { font-family: Georgia, serif; font-size: 34px; font-weight: 700; color: var(--gold-bright); line-height: 1.1; margin: 2px 0; }
.ro-result-score span { color: var(--muted); margin: 0 6px; font-size: 26px; }
.ro-result-sub { font-size: 12px; color: var(--text); }
.ro-teeoff { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; margin-bottom: 14px; }
.ro-chip { font-size: 11px; color: var(--gold-bright); background: rgba(201,169,97,0.10); border: 1px solid rgba(201,169,97,0.28); border-radius: 999px; padding: 4px 11px; }

/* ============================================================
   THE FEED (#116/#117)
   ============================================================ */
.feed-head { margin: 6px 0 12px; }
.feed-title { font-family: Georgia, serif; font-size: 26px; font-weight: 700; color: var(--gold-bright); }
.feed-sub { font-size: 12.5px; color: var(--muted); margin-top: 2px; }
.feed-filters { display: flex; gap: 7px; overflow-x: auto; padding: 2px 0 10px; -webkit-overflow-scrolling: touch; }
.feed-filter { flex: none; background: var(--panel-2); border: 1px solid var(--border); color: var(--muted); border-radius: 999px; padding: 6px 14px; font-size: 12.5px; font-family: inherit; cursor: pointer; white-space: nowrap; }
.feed-filter.on { background: linear-gradient(180deg, rgba(201,169,97,0.18), var(--panel-2)); border-color: var(--gold); color: var(--gold-bright); font-weight: 600; }
.feed-list { display: flex; flex-direction: column; gap: 12px; }
.feed-card { background: linear-gradient(165deg, rgba(201,169,97,0.07), rgba(7,15,11,0.5) 70%); border: 1px solid rgba(201,169,97,0.22); border-radius: 14px; padding: 14px; cursor: pointer; box-shadow: 0 2px 10px rgba(0,0,0,0.25); transition: border-color .15s; }
.feed-card:active { border-color: rgba(201,169,97,0.5); }
.feed-card-live { border-color: rgba(126,181,154,0.5); background: linear-gradient(165deg, rgba(126,181,154,0.12), rgba(7,15,11,0.55) 70%); }
.feed-card-top { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.feed-av { width: 38px; height: 38px; flex: none; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; font-weight: 800; font-size: 14px; color: #1a1408; background: linear-gradient(180deg, #d8b975, #c9a961); border: 1px solid var(--gold); }
.feed-av.live { background: linear-gradient(180deg, #8fd0b0, #6fae87); border-color: #6fae87; }
.feed-card-head { flex: 1; min-width: 0; }
.feed-type { font-size: 9.5px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--gold-dim); font-weight: 700; }
.feed-type.live { color: #8fd0b0; display: inline-flex; align-items: center; gap: 5px; }
.feed-when { font-size: 11px; color: var(--muted-2); margin-top: 1px; }
.feed-live-dot { width: 7px; height: 7px; border-radius: 999px; background: #6fae87; display: inline-block; box-shadow: 0 0 0 0 rgba(111,174,135,0.6); animation: feedpulse 1.6s infinite; }
@keyframes feedpulse { 0% { box-shadow: 0 0 0 0 rgba(111,174,135,0.5); } 70% { box-shadow: 0 0 0 7px rgba(111,174,135,0); } 100% { box-shadow: 0 0 0 0 rgba(111,174,135,0); } }
.feed-score { font-family: Georgia, serif; font-size: 22px; font-weight: 700; color: var(--gold-bright); margin-left: auto; }
.feed-score.win { color: #8fd0b0; } .feed-score.loss { color: #d49a9a; }
.feed-line { font-size: 14px; color: var(--text); line-height: 1.45; }
.feed-line b { color: var(--gold-bright); font-weight: 700; }
.feed-meta { font-size: 12px; color: var(--muted); margin-top: 3px; }
.feed-trophy-pill { display: inline-flex; align-items: center; gap: 6px; margin-top: 8px; font-size: 12px; color: var(--gold-bright); background: rgba(201,169,97,0.12); border: 1px solid rgba(201,169,97,0.3); border-radius: 999px; padding: 4px 11px; }
.feed-follow-btn { margin-top: 10px; width: 100%; background: rgba(126,181,154,0.14); border: 1px solid rgba(126,181,154,0.4); color: #8fd0b0; border-radius: 10px; padding: 9px; font-family: inherit; font-weight: 700; font-size: 13px; cursor: pointer; }
.feed-reactbar { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 10px; padding-top: 10px; border-top: 1px solid rgba(201,169,97,0.12); }
.feed-react-chip, .feed-react-add { display: inline-flex; align-items: center; gap: 4px; background: var(--panel-2); border: 1px solid var(--border); color: var(--muted); border-radius: 999px; padding: 4px 10px; font-size: 12px; font-family: inherit; cursor: pointer; }
.feed-react-chip.on { background: rgba(201,169,97,0.14); border-color: var(--gold-dim); color: var(--gold-bright); }
.feed-react-add { color: var(--gold-dim); }
.feed-react-svg { display: block; }
.feed-react-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; }
.feed-react-pick { display: flex; flex-direction: column; align-items: center; gap: 5px; background: var(--panel-2); border: 1px solid var(--border); border-radius: 12px; padding: 12px 6px; color: var(--gold-bright); font-family: inherit; font-size: 10px; cursor: pointer; }
.feed-react-pick:active { background: rgba(201,169,97,0.16); border-color: var(--gold); }
.feed-react-pick span { color: var(--muted); }
.feed-comments { margin-top: 8px; display: flex; flex-direction: column; gap: 5px; }
.feed-comment { font-size: 12.5px; color: var(--text); line-height: 1.4; }
.feed-comment b { color: var(--gold-bright); }
.feed-comment-list { display: flex; flex-direction: column; gap: 6px; max-height: 180px; overflow-y: auto; margin-bottom: 10px; }
.feed-quick { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
.feed-quick-chip { font-size: 11.5px; background: var(--panel-2); border: 1px solid var(--border); color: var(--muted); border-radius: 999px; padding: 5px 11px; font-family: inherit; cursor: pointer; }
.feed-comment-input { width: 100%; padding: 12px 14px; background: var(--bg-2); border: 1px solid var(--gold-dim); border-radius: 10px; color: var(--text); font-family: inherit; font-size: 14px; }
.feed-empty { text-align: center; padding: 50px 20px; }
.feed-empty-icon { color: var(--gold-dim); margin-bottom: 14px; display: flex; justify-content: center; }
.feed-empty-title { font-family: Georgia, serif; font-size: 19px; color: var(--gold-bright); line-height: 1.4; max-width: 300px; margin: 0 auto 8px; }
.feed-empty-sub { font-size: 13px; color: var(--muted); max-width: 300px; margin: 0 auto 18px; line-height: 1.5; }
.feed-empty-actions { display: flex; gap: 10px; justify-content: center; }

/* ===================== WELCOME SWIPE CAROUSEL (#118) ===================== */
.wl-swipe-wrap { margin: 8px 0 14px; }
.wl-swipe { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; -webkit-overflow-scrolling: touch; gap: 0; scrollbar-width: none; }
.wl-swipe::-webkit-scrollbar { display: none; }
.wl-slide { flex: 0 0 100%; scroll-snap-align: center; display: flex; flex-direction: column; align-items: center; text-align: center; padding: 10px 14px 4px; }
.wl-slide-ic { color: var(--gold); width: 46px; height: 46px; margin-bottom: 12px; }
.wl-slide-ic svg { width: 100%; height: 100%; }
.wl-slide-h { font-family: Georgia, serif; font-size: 22px; font-weight: 700; color: var(--gold-bright); margin-bottom: 8px; }
.wl-slide-t { font-size: 14px; color: var(--muted); line-height: 1.55; max-width: 340px; }
.wl-dots { display: flex; justify-content: center; gap: 8px; margin-top: 14px; }
.wl-dots span { width: 8px; height: 8px; border-radius: 999px; background: rgba(201,169,97,0.25); cursor: pointer; transition: all .2s; }
.wl-dots span.on { background: var(--gold-bright); width: 22px; }
@media (max-width: 700px) {
  .wl-swipe-wrap { display: block !important; }
  .wl-slide-h { font-size: 20px; }
  .wl-slide-t { font-size: 13px; }
  .wl-slide-ic { width: 40px; height: 40px; }
}

/* ===================== STICKY HEADER NAV (#120) ===================== */
.tabs-wrap { position: sticky !important; top: 0; z-index: 3500; background: var(--bg); margin-bottom: 16px !important; padding-top: 8px; }


/* ===================== BOX GRIDS FILL THE ROW — NO EMPTY SLOTS (#122) ===================== */
.ch-stat3 { display: flex !important; flex-wrap: wrap; gap: 8px; }
.ch-stat3 > .ch-wall-tile { flex: 1 1 28%; min-width: 92px; }
.ch-qn-grid { display: flex !important; flex-wrap: wrap; gap: 8px; }
.ch-qn-grid > button { flex: 1 1 28%; min-width: 92px; }
.pc-mini-grid { display: flex !important; flex-wrap: wrap; gap: 8px; }
.pc-mini-grid > .ch-wall-tile { flex: 1 1 28%; min-width: 84px; }

/* ===================== WELCOME MARKETING REEL MOCKUPS (#124) ===================== */
.wl-swipe-wrap { margin: 10px 0 12px; }
.wl-slide { min-height: 184px; justify-content: flex-start; }
.wl-mock { width: 100%; max-width: 320px; margin: 0 auto 14px; background: linear-gradient(165deg, rgba(201,169,97,0.10), rgba(7,15,11,0.55) 75%); border: 1px solid rgba(201,169,97,0.3); border-radius: 14px; padding: 14px; box-shadow: inset 0 1px 0 rgba(247,236,192,0.07), 0 6px 18px rgba(0,0,0,0.35); }
/* VS card */
.wl-mock-vs { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.wl-vs-side { display: flex; flex-direction: column; align-items: center; gap: 5px; flex: 1; }
.wl-vs-av { width: 44px; height: 44px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; font-weight: 800; font-size: 13px; color: #1a1408; background: linear-gradient(180deg, #d8b975, #c9a961); border: 1px solid var(--gold); }
.wl-vs-av.rival { background: linear-gradient(180deg, #8fd0b0, #6fae87); border-color: #6fae87; }
.wl-vs-name { font-size: 12px; color: var(--gold-bright); font-weight: 600; }
.wl-vs-mid { display: flex; flex-direction: column; align-items: center; }
.wl-vs-score { font-family: Georgia, serif; font-size: 30px; font-weight: 700; color: var(--gold-bright); line-height: 1; }
.wl-vs-score span { color: var(--muted); margin: 0 4px; font-size: 22px; }
.wl-vs-lbl { font-size: 8px; letter-spacing: 0.2em; color: var(--muted-2); margin-top: 2px; }
/* Clubhouse tiles */
.wl-mock-club { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; }
.wl-mock-tile { background: rgba(201,169,97,0.08); border: 1px solid rgba(201,169,97,0.22); border-radius: 9px; padding: 8px 4px; text-align: center; display: flex; flex-direction: column; gap: 2px; }
.wl-mock-k { font-size: 7.5px; letter-spacing: 0.12em; color: var(--gold-dim); }
.wl-mock-v { font-family: Georgia, serif; font-size: 16px; font-weight: 700; color: var(--gold-bright); }
/* Hole-winner card */
.wl-mock-pts { display: flex; align-items: center; justify-content: center; gap: 6px; padding: 8px; margin-bottom: 8px; border-radius: 9px; background: linear-gradient(180deg, rgba(201,169,97,0.18), rgba(201,169,97,0.04)); border: 1px solid rgba(201,169,97,0.3); }
.wl-mock-pts b { font-family: Georgia, serif; font-size: 22px; color: var(--gold-bright); }
.wl-mock-pts span { font-size: 10px; color: var(--muted); }
.wl-mock-pts i { color: var(--muted-2); font-style: normal; }
.wl-mock-row { display: grid; grid-template-columns: 28px 1fr 1fr; gap: 6px; align-items: center; padding: 4px 6px; border-top: 1px solid rgba(201,169,97,0.1); font-size: 13px; }
.wl-mock-row span { color: var(--gold-bright); font-weight: 800; }
.wl-mock-row em { font-style: normal; text-align: center; color: var(--muted); }
.wl-mock-row em.win { color: var(--gold-bright); font-weight: 800; background: rgba(201,169,97,0.16); border-radius: 5px; }
/* Betting */
.wl-mock-bet { text-align: center; }
.wl-bet-row { display: flex; gap: 7px; justify-content: center; margin-bottom: 12px; }
.wl-bet-chip { font-size: 12px; padding: 7px 14px; border-radius: 999px; border: 1px solid var(--border); color: var(--muted); }
.wl-bet-chip.on { background: linear-gradient(180deg, rgba(201,169,97,0.2), rgba(201,169,97,0.05)); border-color: var(--gold); color: var(--gold-bright); font-weight: 700; }
.wl-bet-line { font-size: 13px; color: var(--gold-bright); font-style: italic; }

/* #123 — form a touch lower + slimmer fields, still one screen */
.wl-form { margin-top: 6px; }
@media (max-width: 700px) {
  .wl-input { padding: 10px 16px !important; margin-bottom: 8px !important; font-size: 14.5px !important; }
  .wl-slide { min-height: 168px !important; }
  .wl-cta-primary { padding: 12px !important; }
}

/* #131 — bigger Roster title */
.rv-roster-title { font-size: 26px !important; font-family: Georgia, serif; color: var(--gold-bright); margin: 2px 0 4px; }

/* ===================== CLUBHOUSE TROPHY HERO (#127) ===================== */
.ch-trophy-hero { display: flex; align-items: center; gap: 14px; padding: 14px 16px; margin-bottom: 12px; border-radius: 14px; border: 1px solid rgba(201,169,97,0.4); background: linear-gradient(135deg, rgba(201,169,97,0.18), rgba(201,169,97,0.04) 60%, rgba(7,15,11,0.5)); box-shadow: inset 0 1px 0 rgba(247,236,192,0.1), 0 6px 18px rgba(0,0,0,0.32); }
.ch-trophy-ic { width: 54px; height: 54px; flex: none; display: inline-flex; align-items: center; justify-content: center; }
.ch-trophy-ic svg { width: 100%; height: 100%; }
.ch-trophy-meta { min-width: 0; flex: 1; }
.ch-trophy-eyebrow { font-size: 9px; letter-spacing: 0.2em; color: var(--gold-dim); text-transform: uppercase; font-weight: 700; }
.ch-trophy-name { font-family: Georgia, serif; font-size: 20px; font-weight: 700; color: var(--gold-bright); line-height: 1.1; margin: 2px 0 3px; }
.ch-trophy-desc { font-size: 11.5px; color: var(--muted); line-height: 1.4; }

/* ===================== GLOBAL COMPACT — pull content up (#130) ===================== */
header { padding-top: 10px !important; }
.tabs-wrap { margin-bottom: 10px !important; }
.clubhouse-frame { padding-top: 14px !important; margin-top: 8px !important; }
#tab-dashboard, #tab-round, #tab-rivalry, #tab-feed, #tab-fgl, #tab-rounds, #tab-trophies, #tab-friends, #tab-profile, #tab-settings, #tab-stats, #tab-insights { padding-top: 0 !important; }
.section-header { margin-top: 4px !important; }

/* #128 — match leader banner on the scorecard */
.rwz-sc-lead { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:9px 14px; margin-bottom:10px; border-radius:10px; border:1px solid rgba(201,169,97,0.3); background:linear-gradient(180deg, rgba(201,169,97,0.16), rgba(201,169,97,0.04)); }
.rwz-sc-lead.win { border-color:rgba(126,181,154,0.45); background:linear-gradient(180deg, rgba(126,181,154,0.16), rgba(7,15,11,0.2)); }
.rwz-sc-lead.loss { border-color:rgba(201,122,122,0.4); background:linear-gradient(180deg, rgba(201,122,122,0.12), rgba(7,15,11,0.2)); }
.rwz-sc-lead-txt { font-family:Georgia,serif; font-size:17px; font-weight:700; color:var(--gold-bright); }
.rwz-sc-lead.win .rwz-sc-lead-txt { color:#8fd0b0; } .rwz-sc-lead.loss .rwz-sc-lead-txt { color:#d49a9a; }
.rwz-sc-lead-sub { font-size:11px; color:var(--muted-2); letter-spacing:0.04em; text-transform:uppercase; }

/* #129 — keep all tabs on one row */
nav.tabs { flex-wrap: nowrap !important; overflow-x: auto; scrollbar-width: none; }
nav.tabs::-webkit-scrollbar { display: none; }

/* #132 — Build rivalries preview (last 3 + highlight) on the landing slide */
.wl-rivprev { width: 100%; max-width: 320px; margin: 8px auto 0; }
.wl-rivprev-row { display: flex; align-items: center; justify-content: center; gap: 6px; font-size: 12px; color: var(--muted); }
.wl-rivprev-row span { font-size: 9px; letter-spacing: 0.18em; color: var(--gold-dim); margin-right: 4px; }
.wl-rivprev-row em { font-style: normal; width: 22px; height: 22px; border-radius: 6px; display: inline-flex; align-items: center; justify-content: center; font-weight: 800; font-size: 11px; }
.wl-rivprev-row em.win { background: rgba(126,181,154,0.2); color: #8fd0b0; border: 1px solid rgba(126,181,154,0.4); }
.wl-rivprev-row em.loss { background: rgba(201,122,122,0.15); color: #d49a9a; border: 1px solid rgba(201,122,122,0.35); }
.wl-rivprev-hi { text-align: center; font-size: 11px; color: var(--gold-bright); margin-top: 7px; }

/* #134 — tabs: fit all on one centered row, no clipping, pulled up */
nav.tabs { justify-content: center !important; padding-right: 0 !important; }
.tabs-wrap { padding-top: 2px !important; margin-bottom: 8px !important; }
header { padding-bottom: 0 !important; }
@media (max-width: 700px) {
  nav.tabs button { padding: 9px 8px !important; font-size: 12px !important; letter-spacing: 0.02em !important; }
}
@media (max-width: 380px) {
  nav.tabs button { padding: 8px 6px !important; font-size: 11px !important; }
}

/* ===================== #135 — uniform clubhouse stat boxes ===================== */
.ch-stat3 .ch-wall-tile { display: flex; flex-direction: column; min-height: 78px; }
.ch-stat3 .ch-wall-eyebrow-s { font-size: 8px; }
.ch-stat3 .ch-wall-num-s { font-size: 15px; line-height: 1.15; }
.ch-stat3 .ch-wall-sub { margin-top: auto; font-size: 9px; }

/* ===================== #137/#138 — sticky score line ===================== */
.rwz-sc-stat { position: sticky; top: 44px; z-index: 30; display: flex; gap: 8px; padding: 8px 2px 10px; background: var(--bg); }
.rwz-sc-statcol { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 8px 6px; border-radius: 11px; border: 1px solid transparent; text-align: center; }
.rwz-sc-statcol.me { border-color: var(--gold); background: linear-gradient(180deg, rgba(201,169,97,0.16), rgba(201,169,97,0.03)); box-shadow: inset 0 0 0 1px rgba(201,169,97,0.25); }
.rwz-sc-statname { font-size: 11px; color: var(--gold-bright); font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.rwz-sc-stathead b { font-family: Georgia, serif; font-weight: 700; color: var(--gold-bright); line-height: 1; }
.rwz-sc-stat.is-match .rwz-sc-stathead b { font-size: 26px; }
.rwz-sc-stathead i { font-size: 10px; font-style: normal; color: var(--muted); margin-left: 3px; }
.rwz-sc-stathead.big b { font-size: 32px; }
.rwz-sc-stattot { font-size: 11px; color: var(--muted); }
.rwz-sc-stathc { font-size: 9.5px; color: var(--gold-dim); letter-spacing: 0.02em; text-transform: uppercase; }
/* responsive to player count */
.rwz-sc-stat[data-pc="1"] .rwz-sc-stathead.big b { font-size: 44px; }
.rwz-sc-stat[data-pc="1"] .rwz-sc-statcol { padding: 12px 10px; }
.rwz-sc-stat[data-pc="3"] .rwz-sc-stathead b { font-size: 22px; }
.rwz-sc-stat[data-pc="3"] .rwz-sc-stathead.big b { font-size: 26px; }
.rwz-sc-stat[data-pc="4"] .rwz-sc-stathead b { font-size: 19px; }
.rwz-sc-stat[data-pc="4"] .rwz-sc-stathead.big b { font-size: 22px; }
.rwz-sc-stat[data-pc="4"] .rwz-sc-statname { font-size: 9.5px; }
.rwz-sc-stat[data-pc="4"] .rwz-sc-stattot { font-size: 9px; }
.rwz-sc-stat[data-pc="4"] .rwz-sc-stathc { font-size: 8px; }

/* #139 — hole-set selector in Setup */
.rwz-holeset-wrap { margin: 16px 0 6px; }

/* ===================== #141/#142 — landing mock additions ===================== */
.wl-owes { font-size: 11px; color: #8fd0b0; margin-top: 6px; }
.wl-owes.center { text-align: center; }
.wl-mock-club2 { grid-template-columns: repeat(2, 1fr) !important; }
.wl-mock-v.sm { font-size: 13px; line-height: 1.2; }
/* Match Play scorecard mock — mirrors the real sticky score line */
.wl-scoreline { display: flex; gap: 8px; margin-bottom: 10px; }
.wl-sl-col { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 1px; padding: 8px 6px; border-radius: 10px; border: 1px solid transparent; }
.wl-sl-col.me { border-color: var(--gold); background: linear-gradient(180deg, rgba(201,169,97,0.16), rgba(201,169,97,0.03)); }
.wl-sl-name { font-size: 11px; color: var(--gold-bright); font-weight: 700; }
.wl-sl-pts { font-family: Georgia, serif; font-size: 24px; font-weight: 700; color: var(--gold-bright); line-height: 1; }
.wl-sl-pts i { font-size: 9px; font-style: normal; color: var(--muted); margin-left: 2px; }
.wl-sl-sub { font-size: 9.5px; color: var(--muted); }
.wl-mock-row.head { border-top: none; }
.wl-mock-row.head span, .wl-mock-row.head em { color: var(--gold-dim); font-size: 8px; letter-spacing: 0.1em; font-weight: 700; }
.wl-mock-row { grid-template-columns: 28px 1fr 1fr 1fr; }
.wl-bet-amount { font-size: 13px; color: var(--gold-bright); margin-bottom: 6px; }
.wl-bet-amount span { font-family: Georgia, serif; font-size: 18px; font-weight: 700; }

/* FIX: tabs must be transparent and in normal flow (no opaque black sticky bar) */
.tabs-wrap { position: relative !important; top: auto !important; background: transparent !important; z-index: 2 !important; padding-top: 0 !important; margin-bottom: 10px !important; }
nav.tabs { background: transparent !important; }

/* ===================== LANDING — Build Rivalries gold frame + boxes (#144) ===================== */
.wl-goldframe { width: 100%; max-width: 340px; margin: 0 auto 14px; border: 1.5px solid var(--gold); border-radius: 16px; padding: 14px; background: linear-gradient(165deg, rgba(201,169,97,0.12), rgba(7,15,11,0.55) 75%); box-shadow: inset 0 1px 0 rgba(247,236,192,0.08), 0 6px 18px rgba(0,0,0,0.35); }
.wl-mock-vs.nb { border: none; background: transparent; box-shadow: none; padding: 0 0 12px; margin: 0; }
.wl-rivgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; margin: 4px 0 10px; padding-top: 10px; border-top: 1px solid rgba(201,169,97,0.18); }
.wl-rivbox { background: rgba(201,169,97,0.08); border: 1px solid rgba(201,169,97,0.22); border-radius: 9px; padding: 7px 8px; display: flex; flex-direction: column; gap: 2px; text-align: center; }
.wl-rivbox-k { font-size: 8px; letter-spacing: 0.14em; color: var(--gold-dim); text-transform: uppercase; }
.wl-rivbox-v { font-family: Georgia, serif; font-size: 16px; font-weight: 700; color: var(--gold-bright); }

/* #146 — Minigames subline */
.wl-minigames-sub { text-align: center; font-size: 12px; color: var(--gold-bright); letter-spacing: 0.08em; margin: 2px 0 6px; }

/* #145 — betting friends + owes in GOLD everywhere */
.wl-owes, .wl-owes.center { color: var(--gold-bright) !important; }
.wl-bet-friends { margin-top: 10px; display: flex; flex-direction: column; gap: 6px; }
.wl-bet-friend { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 12.5px; padding: 6px 10px; border-radius: 8px; background: rgba(201,169,97,0.06); border: 1px solid rgba(201,169,97,0.18); }
.wl-bet-fn { color: var(--text); font-weight: 600; }
.wl-bet-friend .wl-owes { color: var(--gold-bright) !important; font-size: 12px; }

/* #145 — what you owe / stakes shown in gold everywhere (not other colors) */
.pc-stake-row b, .pc-stake-row, .stakes-list li b, .stakes-amount, .stake-owe { color: var(--gold-bright) !important; }

/* #155 — Tee Off + Roster headings sized to match The Feed title (26px) */
#r-kind-panel h2 { font-size: 26px !important; }
.rwz-step-title { font-size: 12px; }

/* #152 — feed round card: course on top, name + score rows (net/gross), adapts to players */
.feed-course { font-size: 11px; letter-spacing: 0.04em; color: var(--gold-dim); text-transform: uppercase; margin: 2px 0 8px; }
.feed-players { display: flex; flex-direction: column; gap: 5px; }
.feed-prow { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 7px 11px; border-radius: 9px; background: rgba(201,169,97,0.05); border: 1px solid rgba(201,169,97,0.14); }
.feed-prow.me { border-color: var(--gold); background: linear-gradient(180deg, rgba(201,169,97,0.14), rgba(201,169,97,0.03)); }
.feed-pname { font-size: 14px; font-weight: 700; color: var(--gold-bright); }
.feed-pscore { font-family: Georgia, serif; font-size: 17px; font-weight: 700; color: var(--text); }
.feed-pnet { font-family: Georgia, serif; font-size: 11px; color: var(--muted); font-weight: 400; }
.feed-players[data-pc="3"] .feed-pname, .feed-players[data-pc="4"] .feed-pname { font-size: 12.5px; }
.feed-players[data-pc="4"] .feed-prow { padding: 5px 9px; }
.feed-players[data-pc="4"] .feed-pscore { font-size: 15px; }

/* #154 — Approvals segment + bets ledger */
.appr-seg { display: flex; gap: 8px; margin: 4px 0 14px; }
.appr-seg-btn { flex: 1; padding: 9px 12px; border-radius: 999px; border: 1px solid var(--border); background: var(--panel-2); color: var(--muted); font-family: inherit; font-size: 13px; font-weight: 700; cursor: pointer; }
.appr-seg-btn.on { background: linear-gradient(180deg, rgba(201,169,97,0.18), var(--panel-2)); border-color: var(--gold); color: var(--gold-bright); }
.bet-card { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 14px; margin-bottom: 8px; border-radius: 12px; border: 1px solid rgba(201,169,97,0.22); background: linear-gradient(160deg, rgba(201,169,97,0.08), rgba(7,15,11,0.4)); cursor: pointer; }
.bet-card.paid { opacity: 0.6; }
.bet-rival { font-size: 14px; font-weight: 700; color: var(--gold-bright); }
.bet-sub { font-size: 11px; color: var(--muted); margin-top: 2px; }
.bet-right { text-align: right; display: flex; flex-direction: column; align-items: flex-end; gap: 5px; }
.bet-owe { font-size: 12.5px; color: var(--gold-bright) !important; font-weight: 600; }
.bet-mark { font-size: 11px; padding: 4px 10px; border-radius: 999px; border: 1px solid var(--gold-dim); background: rgba(201,169,97,0.1); color: var(--gold-bright); font-family: inherit; cursor: pointer; }
.bet-paidtag { font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--accent, #7eb59a); }

/* ===================== VALUES WHITE + BIGGER (#159/#160/#161) ===================== */
/* Clubhouse stat values + season record + trophy name → white, larger */
.ch-wall-num, .ch-wall-num-s, .ch-sr-value, .ch-trophy-name { color: #ffffff !important; }
.ch-sr-value { font-size: 46px !important; }
.ch-stat3 .ch-wall-num-s { font-size: 18px !important; }
.ch-trophy-name { color: #ffffff !important; font-size: 21px !important; }
/* Roster + FGL values white */
.rv-dash-v { color: #ffffff !important; }
.fgl-rank, .fgl-pts, .fgl-row-pts, .fgl-points, .fgl-stat-v, .fgl-row-pts b { color: #ffffff !important; }
/* Feed: player names + line names + Follow live → white */
.feed-pname, .feed-line b { color: #ffffff !important; }
.feed-follow-btn { color: #ffffff !important; }

/* ===================== HEADINGS = 26px (Tee Off / League like Roster/Feed) (#163) ===================== */
#r-kind-panel h2, .fgl-create-h, #tab-fgl .section-title, #tab-fgl h1, #tab-fgl h2.fgl-create-h { font-size: 26px !important; }

/* ===================== LANDING fits one screen (#157) ===================== */
@media (max-width: 700px) {
  .wl-content { padding-top: 6px !important; }
  .wl-logo { width: 96px !important; height: 96px !important; margin: 0 auto 4px !important; }
  .wl-brand { font-size: 30px !important; margin-bottom: 2px !important; }
  .wl-brand-sub { margin-bottom: 8px !important; }
  .wl-slide { min-height: 150px !important; }
  .wl-proof { margin: 2px 0 8px !important; }
  .wl-badges { margin-top: 8px !important; }
}

/* #158 — landing clubhouse mock: Record full-width, 2x2, Crown Jewel full-width */
.wl-mock-clubv2 { display: block; }
.wl-cm-record { text-align: center; padding: 8px; border-radius: 10px; background: linear-gradient(180deg, rgba(201,169,97,0.18), rgba(201,169,97,0.04)); border: 1px solid rgba(201,169,97,0.3); margin-bottom: 8px; }
.wl-cm-k { display: block; font-size: 8px; letter-spacing: 0.16em; color: var(--gold-dim); text-transform: uppercase; }
.wl-cm-rec { font-family: Georgia, serif; font-size: 26px; font-weight: 700; color: #fff; }
.wl-cm-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; margin-bottom: 8px; }
.wl-cm-jewel { text-align: center; padding: 9px 8px; border-radius: 10px; background: linear-gradient(135deg, rgba(201,169,97,0.16), rgba(7,15,11,0.4)); border: 1px solid rgba(201,169,97,0.3); display: flex; flex-direction: column; gap: 2px; }
.wl-cm-jewel-name { font-family: Georgia, serif; font-size: 17px; font-weight: 700; color: #fff; }
.wl-cm-jewel-desc { font-size: 9.5px; color: var(--muted); }
/* landing mock values white (clubhouse consistency) */
.wl-mock-v { color: #ffffff !important; }

/* ===================== AVATAR PICKER (profile) + golfer logos ===================== */
#p-avatar-picker { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; margin-top: 10px; }
.p-av-opt { aspect-ratio: 1; width: 100%; border-radius: 12px; border: 1px solid var(--border); background: rgba(201,169,97,0.05); padding: 8px; cursor: pointer; display: grid; place-items: center; }
.p-av-opt img { width: 100%; height: 100%; object-fit: contain; object-position: center; display: block; }
.p-av-opt.on { border-color: var(--gold); background: linear-gradient(180deg, rgba(201,169,97,0.18), rgba(201,169,97,0.04)); box-shadow: inset 0 0 0 1px rgba(201,169,97,0.3); }
.fr-av img, .pc-avatar img, .feed-av img { object-fit: contain; }
/* landing VS card: golfer logo images instead of initials */
.wl-vs-av.img { background: transparent !important; border: none !important; width: 56px; height: 56px; padding: 0; }
.wl-vs-av.img img { width: 100%; height: 100%; object-fit: contain; }

/* #166 — rivalry card expand tappable on mobile */
.rv-card-head { cursor: pointer; -webkit-tap-highlight-color: rgba(201,169,97,0.15); touch-action: manipulation; }
.rv-card-head * { pointer-events: none; }
.rv-card-head .rv-fav { pointer-events: auto; }

/* #167 — FGL coming soon */
.fgl-soon { text-align: center; padding: 48px 22px; }
.fgl-soon-ic { color: var(--gold); width: 56px; height: 56px; margin: 0 auto 16px; }
.fgl-soon-ic svg { width: 100%; height: 100%; }
.fgl-soon-title { font-family: Georgia, serif; font-size: 26px; font-weight: 700; color: var(--gold-bright); }
.fgl-soon-sub { font-size: 13px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--gold-dim); margin-top: 4px; }
.fgl-soon-p { font-size: 14px; color: var(--muted); max-width: 320px; margin: 16px auto 0; line-height: 1.55; }
.fgl-dev-btn { margin-top: 20px; }

/* #165 — keep the same comfortable column on wider desktops */
@media (min-width: 1000px) { .app { padding-left: 22px; padding-right: 22px; } }

/* Pull the tab bar up toward the header's upper line; content below follows (desktop) */
@media (min-width: 701px) {
  header { padding-bottom: 4px !important; margin-bottom: 2px !important; }
  .tabs-wrap { margin-top: -10px !important; margin-bottom: 6px !important; }
  .header-bg { height: 300px; }
}

/* ===================== #171 — make device-specific tweaks universal (mobile + web) ===================== */
/* Tabs pulled up toward the header line on ALL widths (was desktop-only) */
header { padding-bottom: 4px !important; margin-bottom: 2px !important; }
.tabs-wrap { margin-top: -10px !important; position: relative !important; background: transparent !important; }
/* Tabs centered & fit — no horizontal clip ("ub house") on any device */
.tabs-wrap .tabs, .tabs-wrap > div { justify-content: center; }
.tabs { flex-wrap: nowrap; justify-content: center; }
/* Multi-player scorecard near full-bleed on web too (fills the column) */
#r-hbh-scorecard { width: 100%; max-width: 100%; }
.rwz-sc-grid.winnerN { width: 100%; max-width: 100%; margin: 0; }
@media (min-width: 701px) {
  #r-hbh-scorecard { margin-left: -8px; margin-right: -8px; width: calc(100% + 16px); max-width: calc(100% + 16px); }
}

/* ===================== #172 — Rivalry + Feed: Tee Off centered heading + less gold/more white ===================== */
.teeoff-pagehead { text-align: center; padding: 12px 0 4px; }
.teeoff-eyebrow { font-size: 11px; color: var(--gold-dim); letter-spacing: 0.24em; text-transform: uppercase; margin-bottom: 6px; }
.teeoff-pagetitle { margin: 0 0 6px 0; font-family: Georgia, serif; font-size: 26px; font-weight: 700; color: #fff; }
.teeoff-pagesub { color: var(--muted); font-size: 13px; margin: 0 0 4px; }
/* less gold, more white across Rivalry + Feed */
#tab-rivalry .rv-card-name, #tab-rivalry .rv-name, #tab-rivalry .rv-dash-v,
#tab-feed .feed-name, #tab-feed .feed-card-title, #tab-feed .feed-score { color: #fff !important; }
#tab-rivalry .section-title, #tab-feed .feed-title { color: #fff !important; }

/* ===================== #173 — profile avatar picker row ===================== */
.p-avatar-row { display: flex; align-items: center; gap: 12px; margin-top: 8px; }
.p-avatar-preview { width: 64px; height: 64px; border-radius: 50%; overflow: hidden; flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--gold-dim); background: rgba(201,169,97,0.06); }
.p-avatar-preview img { width: 100%; height: 100%; object-fit: contain; object-position: center; display: block; }
.p-avatar-hint { font-size: 12px; color: var(--muted); }
.p-upload-btn { display: inline-flex; align-items: center; justify-content: center; gap: 7px; }
.p-upload-btn .p-cam-ic { width: 16px; height: 16px; flex: 0 0 auto; color: var(--gold-bright, #e1c47e); display: inline-block; }
.p-upload-btn .p-cam-ic svg { width: 100%; height: 100%; display: block; }

/* ===================== #174 + interrupt — landing: header-bg backdrop, transparent logos, gold-frame CTA, compact boxes ===================== */
/* Man-in-white teeing off photo as the landing backdrop (same as the app header) */
.wl-overlay {
  background:
    radial-gradient(ellipse at 50% 0%, rgba(201,169,97,0.10) 0%, transparent 50%),
    linear-gradient(180deg, rgba(6,13,10,0.86) 0%, rgba(3,8,6,0.94) 60%, rgba(3,8,6,0.98) 100%),
    url('header-bg.jpg') center top / cover no-repeat fixed !important;
}
/* Transparent VS logos (no card/box behind the golfer art) */
.wl-vs-av.img, .wl-vs-av.img.rival { background: transparent !important; border: none !important; box-shadow: none !important; }
.wl-vs-av.img img { width: 100%; height: 100%; object-fit: contain; }
/* "Take a look first" styled exactly like the email/password input boxes — no underline */
.wl-cta-goldframe { width: 100%; padding: 16px 18px !important; margin-top: 0 !important; margin-bottom: 14px; background: rgba(13, 24, 19, 0.6) !important; border: 1px solid rgba(201,169,97,0.22) !important; border-radius: 12px !important; color: var(--text) !important; font-size: 15px !important; font-weight: 500 !important; text-decoration: none !important; }
.wl-cta-goldframe:hover { color: var(--text) !important; border-color: var(--gold) !important; text-decoration: none !important; }
/* Slightly smaller scroll boxes so the whole landing fits (CTA still visible) */
.wl-slide { min-height: 132px !important; }
.wl-mock { transform: scale(0.94); transform-origin: top center; }
.wl-slide-h { font-size: 16px !important; margin-top: 6px !important; }
.wl-slide-t { font-size: 12px !important; }
@media (max-width: 700px) {
  .wl-slide { min-height: 122px !important; }
  .wl-mock { transform: scale(0.9); }
}

/* ===================== #176 — Caddie image (transparent the-caddie.png) ===================== */
img.caddie-fab-svg { width: 40px !important; height: 40px !important; object-fit: contain; }
.caddie-avatar { background: linear-gradient(180deg, var(--panel-2), var(--bg-2)) !important; overflow: hidden; }
.caddie-avatar img { width: 100%; height: 100%; object-fit: contain; padding: 3px; }

/* ===================== #178 — landing clubhouse mock: fuller stat set ===================== */
.wl-mock-s { display: block; font-size: 7.5px; letter-spacing: 0.04em; color: var(--muted-2); margin-top: 1px; text-transform: none; }
.wl-cm-grid { grid-template-columns: 1fr 1fr; gap: 5px; }
.wl-mock-tile { padding: 6px 6px; }
.wl-mock-tile .wl-mock-k { font-size: 7.5px; }
.wl-mock-tile .wl-mock-v { font-size: 15px; }

/* ===================== #177 — HC chart: curved, per-round HC + dates, scrollable (mobile + web) ===================== */
.hco-chart-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; padding-bottom: 4px; scrollbar-width: thin; }
.hco-chart-scroll svg { display: block; }
.hco-chart-cap { font-size: 11px; color: var(--muted-2); text-align: center; margin-top: 6px; line-height: 1.4; }

/* ===================== #179 — Player Insights modal ===================== */
.adv-ins { max-width: 460px; }
.adv-row { padding: 11px 0; border-bottom: 1px solid var(--border); }
.adv-row:last-of-type { border-bottom: none; }
.adv-row-top { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.adv-label { font-size: 13px; font-weight: 600; color: var(--text); }
.adv-val { font-family: Georgia, serif; font-size: 16px; font-weight: 700; color: var(--gold-bright); white-space: nowrap; text-align: right; }
.adv-explain { font-size: 11.5px; color: var(--muted); line-height: 1.45; margin-top: 3px; }

/* ===================== landing batch — fill screen, bigger proof, wide scorecard, stakes+feed duo ===================== */
/* Landing stretches to full viewport; "Built for golfers" sits low and a touch larger */
.wl-content { min-height: 100svh; display: flex; flex-direction: column; }
.wl-swipe-wrap { flex: 1 1 auto; display: flex; flex-direction: column; justify-content: center; }
.wl-proof { font-size: 14.5px !important; color: var(--text-2) !important; margin: 14px 0 12px !important; }

/* Scorecard mock fills the whole slide width (stays inside the scroll zone) */
.wl-mock-card { width: 100% !important; max-width: 100% !important; }
.wl-mock-card .wl-mock-row { font-size: 13.5px; }

/* 8-box rival grid stays 2-up and compact */
.wl-rivgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.wl-rivbox { padding: 7px 9px; }

/* Stakes + live feed: two boxes side by side on one slide */
.wl-duo { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; align-items: start; }
.wl-duo-col { display: flex; flex-direction: column; gap: 6px; }
.wl-duo-cap { font-size: 9.5px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--gold-dim); text-align: center; }
.wl-mock-feed { display: flex; flex-direction: column; gap: 6px; padding: 10px; }
.wl-feed-item { display: flex; flex-direction: column; gap: 1px; padding: 7px 8px; border-radius: 9px; background: rgba(201,169,97,0.06); border: 1px solid rgba(201,169,97,0.14); }
.wl-feed-item.live { border-color: rgba(126,181,154,0.4); background: rgba(126,181,154,0.08); }
.wl-feed-live { font-size: 8px; font-weight: 800; letter-spacing: 0.1em; color: #7eb59a; }
.wl-feed-name { font-size: 11px; font-weight: 600; color: #fff; }
.wl-feed-sub { font-size: 9px; color: var(--muted); }
.wl-bet-friend .wl-bet-fn { font-size: 11px; }

/* ===================== clubhouse compact + bigger sign + tee-off scorecard fixes ===================== */
/* Compact stat boxes so the whole clubhouse fits one screen (shorter, not narrower) */
.ch-season-record { padding: 8px 16px !important; margin-bottom: 8px !important; }
.ch-season-record .ch-sr-value { line-height: 1.05; }
.ch-trophy-hero { padding: 9px 14px !important; margin-bottom: 8px !important; }
.ch-stat3 { gap: 7px !important; }
.ch-wall-tile { padding: 8px 11px !important; }
.ch-stat3 .ch-wall-sub { margin-top: 0 !important; }

/* The Clubhouse sign — a touch larger (+2) */
.clubhouse-sign span { font-size: clamp(17px, 4.6vw, 24px) !important; }

/* ===== Tee Off scorecard: fill the page, adapt to player count ===== */
.rwz-sc-grid, .rwz-sc-grid.winnerN { width: 100% !important; max-width: 100% !important; margin: 0 !important; }
.rwz-sc-row.winnerN, .rwz-sc-head.winnerN { width: 100% !important; }

/* Each player's score = gold ring, transparent behind (no big black bar) */
.rwz-sc-stat { background: transparent !important; }
.rwz-sc-statcol { border-color: var(--gold) !important; background: linear-gradient(180deg, rgba(201,169,97,0.10), rgba(201,169,97,0.02)) !important; box-shadow: inset 0 0 0 1px rgba(201,169,97,0.22) !important; backdrop-filter: blur(2px); }
.rwz-sc-statcol.me { background: linear-gradient(180deg, rgba(201,169,97,0.18), rgba(201,169,97,0.04)) !important; box-shadow: inset 0 0 0 1px rgba(201,169,97,0.32) !important; }

/* ===== Setup: narrower Ranked/Casual, smaller player slots, 4-up row ===== */
.rnd-rank-grid { gap: 8px; max-width: 360px; margin-left: auto; margin-right: auto; }
.rnd-rank-btn { padding: 11px 9px !important; }
.rnd-rank-btn .rnd-rank-svg { width: 22px; height: 22px; }
.rnd-rank-desc { font-size: 10px !important; line-height: 1.3; color: var(--muted); }
.rwz-players-grid { grid-template-columns: repeat(4, 1fr) !important; gap: 6px !important; }
.rwz-pslot { min-height: 70px !important; padding: 8px 5px !important; gap: 3px !important; border-radius: 10px !important; }
.rwz-pslot .rwz-pslot-name { font-size: 11px; }
.rwz-pslot .rwz-pslot-hc { font-size: 8.5px; }
.rwz-pslot-av { width: 28px; height: 28px; font-size: 12px; }

/* ===================== landing refinements (screenshots) ===================== */
/* Stakes + live feed stacked vertically, each full width */
.wl-stackduo { display: flex; flex-direction: column; gap: 6px; }
.wl-stackduo .wl-mock-bet, .wl-stackduo .wl-mock-feed { width: 100%; max-width: 100%; }
.wl-stackduo .wl-bet-row { justify-content: center; }
.wl-stackduo .wl-feed-item { padding: 9px 12px; }
.wl-stackduo .wl-feed-name { font-size: 12.5px; }
.wl-stackduo .wl-feed-sub { font-size: 10px; }

/* Scorecard mock: white numbers except totals (pts) and the higher (.hi) scores; fill the slide */
.wl-mock-card { width: 100% !important; max-width: 100% !important; display: flex; flex-direction: column; }
.wl-mock-card .wl-mock-row em { color: #fff; }                 /* default white */
.wl-mock-card .wl-mock-row.head em, .wl-mock-card .wl-mock-row.head span { color: var(--gold-dim); }
.wl-mock-card .wl-mock-row em.win { color: var(--gold-bright); background: rgba(201,169,97,0.18); border-radius: 5px; font-weight: 800; }
.wl-mock-card .wl-mock-row em.hi { color: #e7a6a6; }            /* higher (worse) score = not white */
.wl-mock-card .wl-mock-row { padding: 6px 6px; }               /* taller rows so it fills down */

/* ===================== clubhouse: fit one screen (shorter cards) ===================== */
.clubhouse-frame { padding-top: 26px !important; padding-bottom: 12px !important; }
.ch-qn-grid button { padding: 9px 6px !important; }
.ch-qn-grid button .ch-qn-i { width: 22px !important; height: 22px !important; }
.ch-season-record { padding: 6px 16px !important; margin-bottom: 6px !important; }
.ch-season-record .ch-sr-label { font-size: 9.5px !important; }
.ch-season-record .ch-sr-value { font-size: 34px !important; }
.ch-season-record .ch-sr-sub { font-size: 10px !important; }
.ch-stat3 { gap: 6px !important; margin-bottom: 6px !important; }
.ch-wall-tile { padding: 6px 9px !important; }
.ch-wall-tile .ch-wall-eyebrow-s { font-size: 8px !important; }
.ch-wall-tile .ch-wall-num-s { font-size: 17px !important; }
.ch-wall-tile .ch-wall-sub { font-size: 8.5px !important; }
.ch-trophy-hero { padding: 7px 12px !important; margin-bottom: 0 !important; }
.ch-trophy-hero .ch-trophy-ic { width: 34px !important; height: 34px !important; }

/* When an active round box is present, shrink the wall cards even more so it all fits */
.clubhouse-frame:has(#ch-resume-round) .ch-season-record,
.clubhouse-frame:has(#ch-active-rounds) .ch-season-record { padding: 5px 14px !important; }
.clubhouse-frame:has(#ch-resume-round) .ch-season-record .ch-sr-value,
.clubhouse-frame:has(#ch-active-rounds) .ch-season-record .ch-sr-value { font-size: 28px !important; }
.clubhouse-frame:has(#ch-resume-round) .ch-wall-tile,
.clubhouse-frame:has(#ch-active-rounds) .ch-wall-tile { padding: 5px 8px !important; }
.clubhouse-frame:has(#ch-resume-round) .ch-wall-num-s,
.clubhouse-frame:has(#ch-active-rounds) .ch-wall-num-s { font-size: 15px !important; }
.clubhouse-frame:has(#ch-resume-round) .ch-trophy-hero,
.clubhouse-frame:has(#ch-active-rounds) .ch-trophy-hero { padding: 5px 10px !important; }
.ch-active-card { padding: 8px 12px !important; }

/* ===================== scorecard: fill width for any player count ===================== */
.rwz-sc-grid, .rwz-sc-grid.winnerN { width: 100% !important; max-width: 100% !important; margin: 0 !important; overflow-x: visible !important; }
.rwz-sc-head.winnerN, .rwz-sc-row.winnerN { width: 100% !important; }
/* steppers: capped + centered inside each (now flexible) cell — balanced, never empty-looking */
.rwz-sc-row.winnerN .win-pcell { width: 100%; }
.rwz-sc-row.winnerN .win-pcell .rwz-step { width: 100%; max-width: 150px; margin: 0 auto; justify-content: space-between; }
.rwz-sc-row.winnerN .win-pcell .rwz-step .rwz-step-btn { flex: 0 0 auto; }
.rwz-sc-row.winnerN .rwz-sc-parcell .par-step { width: 100%; max-width: 90px; margin: 0 auto; justify-content: space-between; }
/* the sticky score-stat boxes also span full width */
.rwz-sc-stat { width: 100%; }
.rwz-sc-statcol { flex: 1 1 0; }

/* ===================== landing scorecard mock: white numbers (except totals + higher score) ===================== */
.wl-mock-row:not(.head) span { color: #ffffff !important; }
.wl-mock-row em { color: #ffffff !important; }
.wl-mock-row em.win { color: var(--gold-bright) !important; background: rgba(201,169,97,0.18); border-radius: 5px; font-weight: 800; }
.wl-mock-row em.hi { color: #d49a9a !important; }   /* higher (worse) score — not white */
.wl-mock-card { display: flex; flex-direction: column; }
.wl-mock-card .wl-mock-row { padding: 6px 6px; }

/* ===================== clubhouse: fit one screen; squeeze more when an active round shows ===================== */
.clubhouse-frame { padding-top: 26px !important; padding-bottom: 14px !important; }
.ch-qn-grid button { padding: 9px 6px !important; }
.ch-season-record { padding: 7px 16px !important; margin-bottom: 7px !important; }
.ch-season-record .ch-sr-label { font-size: 9px; }
.ch-season-record .ch-sr-sub { font-size: 10px; }
.ch-wall-tile { padding: 7px 10px !important; }
.ch-stat3 { gap: 6px !important; }
.ch-trophy-hero { padding: 8px 13px !important; margin-bottom: 6px !important; }
/* when an active/resume round card is present, squeeze the rest a notch more */
.clubhouse-frame:has(#ch-resume-round) .ch-season-record,
.clubhouse-frame:has(#ch-active-rounds) .ch-season-record { padding: 5px 14px !important; margin-bottom: 5px !important; }
.clubhouse-frame:has(#ch-resume-round) .ch-wall-tile,
.clubhouse-frame:has(#ch-active-rounds) .ch-wall-tile { padding: 5px 9px !important; }
.clubhouse-frame:has(#ch-resume-round) .ch-trophy-hero,
.clubhouse-frame:has(#ch-active-rounds) .ch-trophy-hero { padding: 6px 12px !important; margin-bottom: 4px !important; }
.clubhouse-frame:has(#ch-resume-round) .ch-qn-grid button,
.clubhouse-frame:has(#ch-active-rounds) .ch-qn-grid button { padding: 7px 6px !important; }

/* ===================== guest rival (zero-friction add) ===================== */
.ar-guest-divider { display: flex; align-items: center; gap: 10px; margin: 18px 0 12px; }
.ar-guest-divider::before, .ar-guest-divider::after { content: ""; flex: 1; height: 1px; background: rgba(201,169,97,0.22); }
.ar-guest-divider span { font-size: 10.5px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--gold-dim); white-space: nowrap; }
.rv-guest { display: inline-block; font-size: 9px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; color: #1a1408; background: linear-gradient(180deg,#e1c47e,#c9a961); border-radius: 6px; padding: 1px 6px; vertical-align: middle; margin-left: 6px; }
.rv-invite-btn { flex: none; background: linear-gradient(180deg,#d8b975,#c9a961); color: #1a1408; border: none; border-radius: 999px; padding: 6px 14px; font-size: 12px; font-weight: 700; font-family: inherit; cursor: pointer; }
.rv-invite-btn:active { transform: translateY(1px); }

/* ===================== MOBILE: clubhouse must fit one screen — shrink header + boxes ===================== */
@media (max-width: 700px) {
  header { padding-top: 6px !important; padding-bottom: 0 !important; }
  header .brand { margin-top: 6px !important; gap: 10px !important; }
  header .brand .monogram { width: 38px !important; height: 38px !important; }
  header .brand-text h1 { font-size: 16px !important; letter-spacing: 0.12em !important; }
  header .brand-text .tagline { font-size: 8px !important; letter-spacing: 0.16em !important; }
  .header-bg { height: 150px !important; }
  .tabs-wrap { margin-top: -2px !important; margin-bottom: 4px !important; }
  .clubhouse-frame { padding: 18px 11px 10px !important; }
  .clubhouse-sign { top: 7px !important; }
  .clubhouse-sign span { font-size: 18px !important; }
  .ch-qn-grid { gap: 7px !important; }
  .ch-qn-grid button { padding: 7px 5px !important; }
  .ch-qn-i { width: 20px !important; height: 20px !important; margin-bottom: 3px !important; }
  .ch-season-record { padding: 6px 14px !important; margin-bottom: 6px !important; }
  .ch-season-record .ch-sr-value { font-size: 30px !important; line-height: 1 !important; }
  .ch-season-record .ch-sr-label { font-size: 8.5px !important; }
  .ch-season-record .ch-sr-sub { font-size: 10px !important; }
  .ch-stat3 { gap: 5px !important; }
  .ch-wall-tile { padding: 5px 9px !important; }
  .ch-wall-num-s { font-size: 15px !important; }
  .ch-wall-eyebrow-s { font-size: 8px !important; }
  .ch-wall-sub { font-size: 8.5px !important; }
  .ch-trophy-hero { padding: 6px 12px !important; margin-bottom: 4px !important; }
  .ch-trophy-name { font-size: 16px !important; }
  .ch-trophy-desc, .ch-trophy-eyebrow { font-size: 8.5px !important; }
}

/* ===================== scorecard stepper — fills cell, proportional to player count ===================== */
.rwz-sc-row.winnerN .win-pcell { width: 100%; }
.rwz-sc-row.winnerN .win-pcell .rwz-step { width: 100% !important; max-width: none !important; margin: 0 !important; justify-content: space-evenly !important; }
.rwz-sc-grid.winnerN[data-pc="1"] .win-pcell .rwz-step-btn { width: 46px !important; height: 46px !important; font-size: 24px !important; }
.rwz-sc-grid.winnerN[data-pc="1"] .win-pcell .rwz-step-val { font-size: 30px !important; min-width: 44px !important; }
.rwz-sc-grid.winnerN[data-pc="2"] .win-pcell .rwz-step-btn { width: 36px !important; height: 40px !important; font-size: 20px !important; }
.rwz-sc-grid.winnerN[data-pc="2"] .win-pcell .rwz-step-val { font-size: 22px !important; min-width: 28px !important; }
.rwz-sc-grid.winnerN[data-pc="3"] .win-pcell .rwz-step-btn { width: 28px !important; height: 32px !important; font-size: 17px !important; }
.rwz-sc-grid.winnerN[data-pc="3"] .win-pcell .rwz-step-val { font-size: 17px !important; }
.rwz-sc-grid.winnerN[data-pc="4"] .win-pcell .rwz-step-btn { width: 22px !important; height: 28px !important; font-size: 14px !important; }
.rwz-sc-grid.winnerN[data-pc="4"] .win-pcell .rwz-step-val { font-size: 14px !important; }

/* ===================== landing: white sub + one-line proof ===================== */
.wl-brand-sub { color: #ffffff !important; }
.wl-proof { white-space: nowrap !important; font-size: clamp(9.5px, 3vw, 13px) !important; letter-spacing: 0 !important; overflow: hidden; text-overflow: ellipsis; }

/* ===================== CLUBHOUSE v2 — mockup layout ===================== */
/* Background slot behind THE CLUBHOUSE (drop your image into clubhouse-bg.jpg) */
.clubhouse-frame { position: relative; overflow: hidden; }
.clubhouse-bg {
  position: absolute; top: 0; left: 0; right: 0; height: 230px; z-index: 0; pointer-events: none;
  background-image: url('clubhouse-bg.jpg?v=16'); background-size: cover; background-position: center;
  opacity: 0.5;
  -webkit-mask-image: linear-gradient(180deg, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.5) 60%, rgba(0,0,0,0) 100%);
  mask-image: linear-gradient(180deg, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.5) 60%, rgba(0,0,0,0) 100%);
}
.clubhouse-frame > *:not(.clubhouse-bg) { position: relative; z-index: 1; }
/* Crest (crown + FR laurel) above the sign */
.clubhouse-crest { width: 92px; margin: 6px auto 2px; }
.clubhouse-crest svg { width: 100%; height: auto; display: block; filter: drop-shadow(0 2px 6px rgba(0,0,0,0.5)); }

/* Combined top card: Record (left) + 6 nav boxes 3x2 (right) */
.ch-top-card {
  display: grid; grid-template-columns: 0.85fr 1.25fr; gap: 16px; align-items: center;
  padding: 16px 18px; margin-bottom: 12px; border-radius: 16px;
  border: 1px solid rgba(201,169,97,0.32);
  background: linear-gradient(160deg, rgba(201,169,97,0.10), rgba(201,169,97,0.02) 60%, rgba(7,15,11,0.5));
  box-shadow: inset 0 1px 0 rgba(247,236,192,0.07), 0 6px 18px rgba(0,0,0,0.3);
}
.ch-top-record { text-align: center; }
.ch-top-record .ch-sr-label { font-size: 10px; letter-spacing: 0.18em; color: var(--gold-dim); text-transform: uppercase; }
.ch-top-record .ch-sr-value { font-family: Georgia, serif; font-size: 52px; font-weight: 700; color: #fff; line-height: 1.02; margin: 2px 0; }
.ch-top-record .ch-sr-sub { font-size: 11px; color: var(--muted); line-height: 1.4; }
.ch-top-card .ch-qn { margin: 0; }
.ch-top-card .ch-qn-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.ch-top-card .ch-qn-grid button { border-left: 1px solid rgba(201,169,97,0.12); }
.ch-top-card .ch-qn-grid button { background: transparent; border: none; }

/* Owned Course — round logo slot (drop course logos later) */
.ch-wall-tile.owned-course { display: flex; align-items: center; gap: 12px; text-align: left; }
.ch-course-logo { flex: none; width: 52px; height: 52px; border-radius: 50%; overflow: hidden; border: 2px solid var(--gold); background: rgba(201,169,97,0.08); display: inline-flex; align-items: center; justify-content: center; }
.ch-course-logo img { width: 100%; height: 100%; object-fit: cover; }

/* Crown Jewel — faint crown watermark */
.ch-trophy-hero { position: relative; overflow: hidden; }
.ch-trophy-hero::after {
  content: ""; position: absolute; right: 14px; top: 50%; transform: translateY(-50%);
  width: 90px; height: 90px; opacity: 0.10; pointer-events: none;
  background: no-repeat center/contain url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><path d='M20 70 L15 35 L35 52 L50 25 L65 52 L85 35 L80 70 Z' fill='%23c9a961'/></svg>");
}

@media (max-width: 700px) {
  .ch-top-card { grid-template-columns: 0.8fr 1.3fr; gap: 12px; padding: 12px 14px; }
  .ch-top-record .ch-sr-value { font-size: 40px; }
  .clubhouse-crest { width: 72px; }
  .ch-top-card .ch-qn-grid { gap: 6px; }
}

/* ============================================================
   THE CLUBHOUSE — premium redesign (immersive, not dashboard)
   ============================================================ */
/* 3. Dark green base with faint texture + depth */
body { background-color: #111f17 !important; }
body::before {
  content: ""; position: fixed; inset: 0; z-index: -2; pointer-events: none;
  background:
    radial-gradient(1200px 600px at 50% -10%, rgba(201,171,89,0.06), transparent 60%),
    radial-gradient(900px 500px at 50% 110%, rgba(126,181,154,0.04), transparent 60%),
    #07130E;
}

/* 1. Hero banner — bright, warm, fades seamlessly DOWN into the dark green */
.clubhouse-frame { background: transparent !important; border: none !important; box-shadow: none !important; padding: 0 0 10px !important; overflow: visible !important; }
.clubhouse-bg {
  position: absolute; top: 0; left: 50%; transform: translateX(-50%);
  width: 100vw; height: 300px; z-index: 0; pointer-events: none;
  background-image: url('clubhouse-bg.jpg?v=16'); background-size: cover; background-position: center 35%;
  opacity: 0.95; will-change: transform;
  -webkit-mask-image: linear-gradient(180deg, rgba(0,0,0,1) 0%, rgba(0,0,0,1) 55%, rgba(0,0,0,0.55) 82%, rgba(0,0,0,0) 100%);
  mask-image: linear-gradient(180deg, rgba(0,0,0,1) 0%, rgba(0,0,0,1) 55%, rgba(0,0,0,0.55) 82%, rgba(0,0,0,0) 100%);
}
.clubhouse-bg::after { /* only a faint black gradient at the very bottom */
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, transparent 60%, rgba(3,8,6,0.55) 100%);
}

/* 2. THE CLUBHOUSE — sits at the bottom of the hero, elegant serif, airy, light glow */
.clubhouse-sign { position: relative !important; top: auto !important; left: auto !important; transform: none !important;
  margin: 232px auto 22px !important; padding: 0 !important; background: none !important; box-shadow: none !important; display: block !important; text-align: center; z-index: 2; }
.clubhouse-sign::before, .clubhouse-sign::after { display: none !important; }
.clubhouse-sign span {
  font-family: Georgia, 'Times New Roman', serif !important; font-weight: 700 !important;
  font-size: clamp(30px, 8vw, 46px) !important; letter-spacing: 0.14em !important;
  background: none !important; -webkit-text-fill-color: #f3ead2 !important; color: #f3ead2 !important;
  text-shadow: 0 0 22px rgba(201,171,89,0.35), 0 2px 10px rgba(0,0,0,0.6) !important;
}

/* 4. Cards = brass plate / leather panel / inset cabinet door */
.ch-record-card, .ch-wall-tile, .ch-trophy-hero, .ch-stat3 .ch-wall-tile {
  background: rgba(18,22,19,0.75) !important;
  border: 1px solid rgba(201,171,89,0.22) !important;
  border-radius: 18px !important;
  box-shadow: inset 0 1px 0 rgba(247,236,192,0.05), inset 0 0 24px rgba(0,0,0,0.35), 0 14px 34px rgba(0,0,0,0.42), 0 0 0 1px rgba(201,171,89,0.04) !important;
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
}

/* 6. Record this season — first card, nearly double height, big score, no icons */
.ch-record-card { text-align: center; padding: 30px 22px !important; margin-bottom: 16px; cursor: pointer; }
.ch-rc-label { font-size: 11px; letter-spacing: 0.26em; text-transform: uppercase; color: var(--gold-dim); }
.ch-rc-value { font-family: Georgia, serif; font-size: 72px; font-weight: 700; color: #ffffff; line-height: 1.02; margin: 8px 0 6px; text-shadow: 0 2px 16px rgba(0,0,0,0.5); }
.ch-rc-sub { font-size: 13px; color: #b6b1a3; letter-spacing: 0.02em; }

/* 7. Quick buttons — minimal premium, icon + tiny text, lots of air (Apple, not admin) */
.ch-qn { margin: 4px 0 18px !important; }
.ch-qn-grid { display: flex !important; justify-content: space-between !important; gap: 4px !important; padding: 4px 2px; }
.ch-qn-grid button {
  flex: 1 1 0; min-width: 0; background: transparent !important; border: none !important; box-shadow: none !important;
  display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 8px 2px !important; color: #cfc9ba; cursor: pointer;
  border-radius: 12px; transition: background 0.15s, transform 0.1s;
}
.ch-qn-grid button:active { background: rgba(201,171,89,0.10) !important; transform: scale(0.96); }
.ch-qn-grid button .ch-qn-i, .ch-qn-grid button svg { width: 23px !important; height: 23px !important; margin: 0 !important; color: var(--gold) !important; stroke: var(--gold) !important; }
.ch-qn-grid button span { font-size: 9.5px !important; letter-spacing: 0.05em; color: #9a9486; text-transform: none; }

/* 5. Grid — much more air */
.ch-stat3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px !important; margin-bottom: 16px; }
.ch-wall-tile { padding: 16px 14px !important; text-align: center; }
.ch-wall-eyebrow-s { font-size: 9.5px !important; letter-spacing: 0.16em; color: var(--gold-dim) !important; text-transform: uppercase; }
.ch-wall-num-s { font-size: 22px !important; color: #ffffff !important; font-family: Georgia, serif; font-weight: 700; margin: 5px 0 3px; }
.ch-wall-sub { font-size: 10px !important; color: #8f897b !important; }

/* 9. Latest Achievement card (was Crown Jewel) */
.ch-trophy-hero { display: flex; align-items: center; gap: 16px; padding: 16px 18px !important; margin-top: 4px; }
.ch-trophy-hero::after { display: none !important; }
.ch-trophy-ic { width: 56px; height: 56px; flex: none; }
.ch-trophy-eyebrow { font-size: 10px !important; letter-spacing: 0.16em; color: var(--gold-dim) !important; }
.ch-trophy-name { font-family: Georgia, serif; font-size: 22px !important; color: #fff !important; font-weight: 700; }
.ch-trophy-desc { font-size: 11px !important; color: #8f897b !important; }

/* 10/11. air + soft floating shadow handled above; keep app column comfortable */
#tab-dashboard { padding-top: 0; }

@media (max-width: 700px) {
  .clubhouse-bg { height: 260px; }
  .clubhouse-sign { margin-top: 196px !important; }
  .ch-record-card { padding: 24px 18px !important; }
  .ch-rc-value { font-size: 58px; }
  .ch-stat3 { gap: 10px !important; }
  .ch-wall-tile { padding: 12px 10px !important; }
}

/* Profile chip — up in the top-right corner, clear of the tabs */
.profile-chip { top: 10px !important; right: 12px !important; z-index: 5000 !important; }
@media (max-width: 700px) { .profile-chip { top: 8px !important; right: 10px !important; width: 40px !important; height: 40px !important; } }

/* ============================================================
   THE CLUBHOUSE v3 — match reference (crest + combined card), premium polish
   Overrides the hero-banner direction. Warm gold, off-white, dark-green panels.
   ============================================================ */
:root { --fr-gold: #c9ab59; --fr-gold-bright: #e6cf8a; --fr-offwhite: #f1e8d2; --fr-border: rgba(201,171,89,0.22); }

/* Backdrop: faint warm interior, NOT a bright hero; fades down into the green */
.clubhouse-bg {
  position: absolute !important; top: 0 !important; left: 50% !important; transform: translateX(-50%) translateY(-40px) !important;
  width: 100vw !important; height: 500px !important; opacity: 0.30 !important; background-position: center top !important;
  -webkit-mask-image: linear-gradient(180deg, rgba(0,0,0,0.85) 0%, rgba(0,0,0,0.45) 45%, rgba(0,0,0,0) 100%) !important;
  mask-image: linear-gradient(180deg, rgba(0,0,0,0.85) 0%, rgba(0,0,0,0.45) 45%, rgba(0,0,0,0) 100%) !important;
}
.clubhouse-bg::after { display: none !important; }

/* Crest: gold wreath + FR logo inside */
.clubhouse-crest { position: relative; width: 88px; height: 80px; margin: 20px auto 4px !important; z-index: 2; }
.ch-crest-wreath { position: absolute; inset: 0; width: 100%; height: 100%; filter: drop-shadow(0 2px 8px rgba(0,0,0,0.55)); }
.ch-crest-logo { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -46%); width: 34px; height: 34px; object-fit: contain; filter: drop-shadow(0 1px 3px rgba(0,0,0,0.5)); }

/* THE CLUBHOUSE — centered under crest, elegant serif, warm glow */
.clubhouse-sign { position: relative !important; top: auto !important; left: auto !important; transform: none !important;
  margin: 0 auto 2px !important; padding: 0 !important; background: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; box-shadow: none !important; display: block !important; text-align: center; z-index: 2; }
.clubhouse-sign::before, .clubhouse-sign::after { display: none !important; }
.clubhouse-sign span {
  font-family: Georgia, 'Times New Roman', serif !important; font-weight: 700 !important;
  font-size: clamp(27px, 7.2vw, 42px) !important; letter-spacing: 0.16em !important; padding-left: 0.16em !important;
  background: none !important; -webkit-text-fill-color: var(--fr-offwhite) !important; color: var(--fr-offwhite) !important;
  text-shadow: 0 0 20px rgba(201,171,89,0.30), 0 2px 10px rgba(0,0,0,0.55) !important;
}
.clubhouse-divider { text-align: center; color: var(--fr-gold); font-size: 9px; letter-spacing: 0.4em; margin: 4px 0 22px; opacity: 0.55; z-index: 2; position: relative; }

/* Combined top card: Record (left) + nav 3x2 (right) */
.ch-top-card {
  display: grid; grid-template-columns: 0.82fr 1.28fr; gap: 16px; align-items: center;
  padding: 22px 20px; margin-bottom: 18px; border-radius: 20px; border: 1px solid var(--fr-border);
  background: linear-gradient(160deg, rgba(22,34,25,0.92), rgba(10,18,13,0.94));
  box-shadow: inset 0 1px 0 rgba(247,236,192,0.05), 0 20px 44px rgba(0,0,0,0.45);
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
}
.ch-top-record { text-align: center; border-right: 1px solid rgba(201,171,89,0.14); padding-right: 12px; }
.ch-rc-label { font-size: 10px; letter-spacing: 0.24em; text-transform: uppercase; color: var(--fr-gold); }
.ch-rc-value { font-family: Georgia, serif; font-size: 50px; font-weight: 700; color: var(--fr-offwhite); line-height: 1.02; margin: 5px 0; text-shadow: 0 2px 14px rgba(0,0,0,0.45); }
.ch-rc-sub { font-size: 10.5px; color: #a7a08f; line-height: 1.4; }
.ch-top-card .ch-qn { margin: 0 !important; }
.ch-top-card .ch-qn-grid { display: grid !important; grid-template-columns: repeat(3, 1fr) !important; gap: 6px !important; padding: 0 !important; }
.ch-top-card .ch-qn-grid button { flex: none !important; background: transparent !important; border: none !important; box-shadow: none !important; display: flex; flex-direction: column; align-items: center; gap: 5px; padding: 9px 4px !important; border-radius: 12px; }
.ch-top-card .ch-qn-grid button:active { background: rgba(201,171,89,0.10) !important; }
.ch-top-card .ch-qn-grid button .ch-qn-i, .ch-top-card .ch-qn-grid button svg { width: 22px !important; height: 22px !important; margin: 0 !important; color: var(--fr-gold) !important; stroke: var(--fr-gold) !important; }
.ch-top-card .ch-qn-grid button span { font-size: 10px !important; letter-spacing: 0.02em; color: #cfc7b4 !important; text-transform: none; }

/* Stat tiles — dark green gradient panels, warm gold edge, soft float */
.ch-stat3 { gap: 12px !important; }
.ch-wall-tile, .ch-stat3 .ch-wall-tile {
  background: linear-gradient(160deg, rgba(22,34,25,0.9), rgba(10,18,13,0.92)) !important;
  border: 1px solid rgba(201,171,89,0.18) !important; border-radius: 16px !important;
  box-shadow: inset 0 1px 0 rgba(247,236,192,0.04), 0 14px 30px rgba(0,0,0,0.4) !important; padding: 15px 12px !important;
}
.ch-wall-num-s { color: var(--fr-offwhite) !important; }
.ch-wall-eyebrow-s { color: var(--fr-gold) !important; }

/* Latest Achievement panel */
.ch-trophy-hero {
  background: linear-gradient(160deg, rgba(22,34,25,0.92), rgba(10,18,13,0.94)) !important;
  border: 1px solid var(--fr-border) !important; border-radius: 18px !important;
  box-shadow: inset 0 1px 0 rgba(247,236,192,0.04), 0 16px 36px rgba(0,0,0,0.42) !important;
}
.ch-trophy-name { color: var(--fr-offwhite) !important; }
.ch-trophy-eyebrow { color: var(--fr-gold) !important; }

/* Active tab — thin gold line with soft glow, animated */
.tabs button { position: relative; transition: color 0.25s ease; }
.tabs button.active { color: var(--fr-gold-bright) !important; border-bottom: none !important; }
.tabs button::after { content: ""; position: absolute; left: 50%; right: 50%; bottom: -5px; height: 2px; border-radius: 2px;
  background: linear-gradient(90deg, transparent, var(--fr-gold-bright), transparent); box-shadow: 0 0 8px rgba(201,171,89,0.55);
  opacity: 0; transition: left 0.28s ease, right 0.28s ease, opacity 0.28s ease; }
.tabs button.active::after { left: 12%; right: 12%; opacity: 1; }

@media (max-width: 700px) {
  .clubhouse-bg { height: 360px !important; }
  .clubhouse-crest { width: 74px; height: 68px; margin-top: 14px !important; }
  .ch-crest-logo { width: 28px; height: 28px; }
  .ch-top-card { grid-template-columns: 0.8fr 1.3fr; gap: 12px; padding: 18px 15px; }
  .ch-rc-value { font-size: 42px; }
}

/* ============================================================
   Clubhouse v3.1 — richer gold, glinting borders, compact boxes
   ============================================================ */
:root { --fr-gold: #d4b15e; --fr-gold-bright: #f0d489; --fr-border: rgba(212,178,94,0.34); }

/* Glinting gradient border on every panel (catches light at the corners) */
.ch-top-card, .ch-wall-tile, .ch-stat3 .ch-wall-tile, .ch-trophy-hero { position: relative; }
.ch-top-card::before, .ch-wall-tile::before, .ch-trophy-hero::before {
  content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1px; pointer-events: none; z-index: 0;
  background: linear-gradient(135deg, rgba(240,212,137,0.75), rgba(201,171,89,0.06) 38%, rgba(201,171,89,0.06) 62%, rgba(240,212,137,0.55));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
}
.ch-top-card > *, .ch-wall-tile > *, .ch-trophy-hero > * { position: relative; z-index: 1; }

/* Text stays prominent (slightly larger), gold a touch more golden */
.ch-wall-num-s { font-size: 24px !important; color: var(--fr-offwhite) !important; }
.ch-wall-eyebrow-s { font-size: 10.5px !important; letter-spacing: 0.14em; color: var(--fr-gold) !important; }
.ch-wall-sub { font-size: 10.5px !important; }
.ch-rc-value { font-size: 54px !important; }
.ch-rc-label, .ch-trophy-eyebrow { color: var(--fr-gold) !important; }

/* MUCH smaller boxes so the whole clubhouse fits with room to spare */
@media (max-width: 700px) {
  .header-bg { height: 130px !important; }
  .clubhouse-bg { height: 250px !important; }
  .clubhouse-crest { width: 62px; height: 56px; margin: 8px auto 2px !important; }
  .ch-crest-logo { width: 23px; height: 23px; }
  .clubhouse-sign span { font-size: 30px !important; letter-spacing: 0.14em !important; }
  .clubhouse-divider { margin: 2px 0 12px !important; }
  .ch-top-card { padding: 13px 14px !important; margin-bottom: 11px !important; gap: 11px; }
  .ch-rc-value { font-size: 42px !important; margin: 2px 0 !important; }
  .ch-rc-label { font-size: 9px !important; }
  .ch-rc-sub { font-size: 9.5px !important; }
  .ch-top-card .ch-qn-grid { gap: 5px !important; }
  .ch-top-card .ch-qn-grid button { padding: 6px 3px !important; gap: 4px; }
  .ch-top-card .ch-qn-grid button span { font-size: 9.5px !important; }
  .ch-top-card .ch-qn-grid button .ch-qn-i, .ch-top-card .ch-qn-grid button svg { width: 20px !important; height: 20px !important; }
  .ch-stat3 { gap: 8px !important; }
  .ch-wall-tile { padding: 10px 9px !important; }
  .ch-wall-num-s { font-size: 22px !important; margin: 2px 0 1px !important; }
  .ch-wall-eyebrow-s { font-size: 9.5px !important; }
  .ch-wall-sub { font-size: 9.5px !important; }
  .ch-trophy-hero { padding: 10px 13px !important; }
  .ch-trophy-ic { width: 46px; height: 46px; }
  .ch-trophy-name { font-size: 19px !important; }
}

/* ============================================================
   Header → plain dark green (no golf image), tab divider line, gold active glow
   ============================================================ */
/* Remove the golf-course header image entirely — header sits on the dark green */
.header-bg { display: none !important; }
header { background: transparent !important; }

/* A single divider line UNDER the tabs (not above) */
.tabs-wrap { border-top: none !important; border-bottom: 1px solid rgba(212,178,94,0.22) !important; box-shadow: none !important; }
.tabs { border-bottom: none !important; }

/* Active tab: golden glow line under the selected tab */
.tabs button.active { color: var(--fr-gold-bright) !important; }
.tabs button::after {
  content: ""; position: absolute; left: 50%; right: 50%; bottom: -1px; height: 2px; border-radius: 2px;
  background: linear-gradient(90deg, transparent, var(--fr-gold-bright), transparent);
  box-shadow: 0 0 10px rgba(240,212,137,0.7), 0 0 4px rgba(240,212,137,0.9);
  opacity: 0; transition: left 0.28s ease, right 0.28s ease, opacity 0.28s ease;
}
.tabs button.active::after { left: 10%; right: 10%; opacity: 1; }

/* New crest logo (Clubhouse logo.png — already has crown + laurel + FR) */
.clubhouse-crest { position: relative; width: 96px; height: 96px; margin: 14px auto 2px !important; z-index: 2; }
.ch-crest-logo { width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 3px 10px rgba(0,0,0,0.55)); position: static; transform: none; }
@media (max-width: 700px) { .clubhouse-crest { width: 76px; height: 76px; margin-top: 8px !important; } }

/* ============================================================
   Clubhouse v3.2 — antique champagne 18K gold, shine, line under title, tight fit
   ============================================================ */
:root {
  --fr-gold: #c2a868;          /* champagne 18K */
  --fr-gold-bright: #e3d0a0;   /* highlight */
  --fr-gold-deep: #9c8348;     /* shadow / icons a touch darker */
  --fr-border: rgba(194,168,104,0.30);
  --fr-offwhite: #efe7d4;
}

/* THE CLUBHOUSE — brushed champagne gold with soft reflection (not neon) */
.clubhouse-sign span {
  background: linear-gradient(180deg, #efe0b8 0%, #d2b87e 42%, #b69a5b 70%, #9c8348 100%) !important;
  -webkit-background-clip: text !important; background-clip: text !important;
  -webkit-text-fill-color: transparent !important; color: transparent !important;
  text-shadow: 0 1px 10px rgba(0,0,0,0.45) !important;
}

/* Line UNDER THE CLUBHOUSE — thin champagne rule with a centre diamond */
.clubhouse-divider { display: flex !important; align-items: center; justify-content: center; gap: 12px; max-width: 260px; margin: 6px auto 16px !important; color: var(--fr-gold); font-size: 9px; letter-spacing: 0; opacity: 1; }
.clubhouse-divider::before, .clubhouse-divider::after { content: ""; flex: 1; height: 1px; background: linear-gradient(90deg, transparent, rgba(194,168,104,0.65), transparent); }

/* Active tab — glossy champagne shine that sweeps */
@keyframes frSheen { 0% { background-position: -160% 0; } 100% { background-position: 160% 0; } }
.tabs button.active::after {
  left: 8% !important; right: 8% !important; opacity: 1 !important; height: 2.5px !important; bottom: -1px !important;
  background: linear-gradient(90deg, transparent 5%, #d6bd84 30%, #fbf3da 50%, #d6bd84 70%, transparent 95%) !important;
  background-size: 200% 100% !important; animation: frSheen 3.2s ease-in-out infinite;
  box-shadow: 0 0 12px rgba(231,208,160,0.75), 0 0 4px rgba(255,250,235,0.7) !important;
}

/* Logo: soft metallic reflection, no strong glow */
.ch-crest-logo { filter: drop-shadow(0 2px 8px rgba(0,0,0,0.5)) saturate(1.05) !important; }

/* Icons — same metal, a touch darker than the logo */
.ch-qn-grid button .ch-qn-i, .ch-qn-grid button svg { color: var(--fr-gold-deep) !important; stroke: var(--fr-gold-deep) !important; }

/* Text hierarchy: headings champagne, numbers pure white, small text light grey */
.ch-rc-value, .ch-wall-num-s, .ch-trophy-name { color: #ffffff !important; }
.ch-rc-sub, .ch-wall-sub { color: #b6b0a0 !important; }
.ch-rc-label, .ch-wall-eyebrow-s, .ch-trophy-eyebrow { color: var(--fr-gold) !important; }

/* Borders 1–1.5px, very faint inner glow (no neon) */
.ch-top-card, .ch-wall-tile, .ch-trophy-hero { border-width: 1px !important; box-shadow: inset 0 0 14px rgba(194,168,104,0.05), 0 14px 32px rgba(0,0,0,0.42) !important; }

/* ---- Hard compaction so ALL boxes fit with extra room (for an active round) ---- */
@media (max-width: 700px) {
  header { padding-top: 4px !important; }
  header .brand { margin-top: 4px !important; }
  .tabs-wrap { margin-top: 0 !important; margin-bottom: 4px !important; }
  .clubhouse-bg { height: 190px !important; }
  .clubhouse-crest { width: 56px !important; height: 56px !important; margin: 6px auto 0 !important; }
  .clubhouse-sign span { font-size: 25px !important; letter-spacing: 0.12em !important; }
  .clubhouse-divider { margin: 3px auto 9px !important; }
  .ch-top-card { padding: 10px 12px !important; margin-bottom: 8px !important; gap: 10px; }
  .ch-rc-value { font-size: 36px !important; margin: 1px 0 !important; }
  .ch-rc-label { font-size: 8.5px !important; }
  .ch-rc-sub { font-size: 9px !important; }
  .ch-top-card .ch-qn-grid { gap: 4px !important; }
  .ch-top-card .ch-qn-grid button { padding: 4px 2px !important; gap: 3px; }
  .ch-top-card .ch-qn-grid button .ch-qn-i, .ch-top-card .ch-qn-grid button svg { width: 18px !important; height: 18px !important; }
  .ch-top-card .ch-qn-grid button span { font-size: 8.5px !important; }
  .ch-stat3 { gap: 7px !important; margin-bottom: 8px !important; }
  .ch-wall-tile { padding: 8px 8px !important; }
  .ch-wall-num-s { font-size: 19px !important; margin: 1px 0 0 !important; }
  .ch-wall-eyebrow-s { font-size: 8.5px !important; }
  .ch-wall-sub { font-size: 8.5px !important; }
  .ch-trophy-hero { padding: 8px 11px !important; margin-top: 2px; }
  .ch-trophy-ic { width: 40px; height: 40px; }
  .ch-trophy-name { font-size: 17px !important; }
}

/* Profile chip — a touch larger */
.profile-chip { width: 52px !important; height: 52px !important; }
.profile-chip #profile-avatar { width: 50px !important; height: 50px !important; }
@media (max-width: 700px) { .profile-chip { width: 46px !important; height: 46px !important; } .profile-chip #profile-avatar { width: 44px !important; height: 44px !important; } }

/* ============================================================
   Clubhouse interior backdrop — visible at top, darkens progressively downward
   ============================================================ */
.clubhouse-bg {
  height: 620px !important; opacity: 1 !important;
  background-image:
    linear-gradient(180deg, rgba(7,19,14,0.10) 0%, rgba(7,19,14,0.38) 38%, rgba(7,19,14,0.80) 66%, rgba(7,19,14,0.97) 86%, #07130E 100%),
    url('clubhouse-bg.jpg?v=16') !important;
  background-size: cover, cover !important;
  background-position: center top, center 12% !important;
  background-repeat: no-repeat, no-repeat !important;
  -webkit-mask-image: none !important; mask-image: none !important;
}
.clubhouse-bg::after { display: none !important; }
@media (max-width: 700px) { .clubhouse-bg { height: 500px !important; } }

/* ============================================================
   TEE OFF — premium entry (hero + 2x2 photo cards + Continue)
   ============================================================ */
.teeoff-entry { background: transparent !important; border: none !important; box-shadow: none !important; padding: 0 0 14px !important; }
/* Hero banner */
.teeoff-hero { position: relative; text-align: center; padding: 18px 0 6px; margin: 0 -18px 18px; min-height: 320px; display: flex; flex-direction: column; justify-content: flex-end; }
.teeoff-hero-bg { position: absolute; inset: 0; z-index: 0;
  background-image: linear-gradient(180deg, rgba(7,19,14,0.10) 0%, rgba(7,19,14,0.30) 45%, rgba(7,19,14,0.82) 80%, #07130E 100%), url('teeoff-hero.jpg');
  background-color: #0e1a13; background-size: cover, cover; background-position: center, center 30%; background-repeat: no-repeat;
}
.teeoff-hero > *:not(.teeoff-hero-bg) { position: relative; z-index: 1; }
.teeoff-hero-title { font-family: Georgia, 'Times New Roman', serif; font-weight: 700; font-size: clamp(48px, 16vw, 96px); letter-spacing: 0.08em; margin: 0;
  background: linear-gradient(180deg, #efe0b8 0%, #d2b87e 45%, #b69a5b 72%, #9c8348 100%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent;
  text-shadow: 0 2px 16px rgba(0,0,0,0.5); }
.teeoff-hero-divider { display: flex; align-items: center; justify-content: center; gap: 12px; max-width: 280px; margin: 4px auto 8px; color: var(--fr-gold); font-size: 10px; }
.teeoff-hero-divider::before, .teeoff-hero-divider::after { content: ""; flex: 1; height: 1px; background: linear-gradient(90deg, transparent, rgba(194,168,104,0.6), transparent); }
.teeoff-hero-sub { color: #cfc7b4; font-size: 15px; letter-spacing: 0.02em; margin: 0 0 6px; }

/* 2x2 photo cards */
.teeoff-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.teeoff-card { position: relative; display: flex; flex-direction: column; padding: 0; overflow: hidden; cursor: pointer; text-align: center;
  background: linear-gradient(160deg, rgba(22,34,25,0.92), rgba(10,18,13,0.95)); border: 1px solid var(--fr-border); border-radius: 18px;
  box-shadow: inset 0 1px 0 rgba(247,236,192,0.05), 0 16px 36px rgba(0,0,0,0.42); font-family: inherit; color: var(--fr-offwhite); transition: border-color .18s, box-shadow .18s, transform .12s; }
.teeoff-card.sel { border-color: var(--fr-gold-bright); box-shadow: inset 0 0 0 1px rgba(227,208,160,0.5), 0 0 18px rgba(201,171,89,0.28), 0 18px 40px rgba(0,0,0,0.45); }
.teeoff-card:active { transform: scale(0.985); }
.teeoff-card-photo { height: 116px; width: 100%; background-color: #14241a; background-size: cover; background-position: center;
  -webkit-mask-image: linear-gradient(180deg, #000 60%, transparent 100%); mask-image: linear-gradient(180deg, #000 60%, transparent 100%); }
.teeoff-card-photo.golf { background-image: url('teeoff-golf.jpg'); }
.teeoff-card-photo.sim { background-image: url('teeoff-sim.jpg'); }
.teeoff-card-photo.challenge { background-image: url('teeoff-challenge.jpg'); }
.teeoff-card-photo.custom { background-image: url('teeoff-custom.jpg'); }
.teeoff-card-body { padding: 4px 14px 18px; margin-top: -14px; }
.teeoff-card-icon { display: inline-flex; color: var(--fr-gold); }
.teeoff-card-icon svg { width: 30px; height: 30px; }
.teeoff-card-title { font-family: Georgia, serif; font-size: 19px; font-weight: 700; color: var(--fr-offwhite); margin: 6px 0 4px; }
.teeoff-card-desc { font-size: 12px; color: #a7a08f; line-height: 1.45; }

/* CONTINUE */
.teeoff-continue { width: 100%; margin-top: 18px; padding: 17px; border: none; border-radius: 14px; cursor: pointer; font-family: Georgia, serif; font-weight: 700; font-size: 15px; letter-spacing: 0.22em; color: #2a2110;
  background: linear-gradient(180deg, #f0dca2 0%, #d4b15e 50%, #b6924a 100%); box-shadow: 0 12px 30px rgba(180,146,74,0.28), inset 0 1px 0 rgba(255,248,225,0.6); }
.teeoff-continue:active { transform: translateY(1px); }

@media (max-width: 700px) {
  .teeoff-hero { min-height: 280px; margin: 0 -14px 16px; }
  .teeoff-cards { gap: 12px; }
  .teeoff-card-photo { height: 100px; }
  .teeoff-card-title { font-size: 17px; }
}

/* Clubhouse image meets the tab line directly (no dark gap) */
.tabs-wrap { margin-bottom: 0 !important; }
#tab-dashboard { margin-top: 0 !important; padding-top: 0 !important; }
.clubhouse-frame { margin-top: 0 !important; }
.clubhouse-bg { top: 0 !important; }
@media (max-width: 700px) { #tab-dashboard, .clubhouse-frame { margin-top: 0 !important; } }

/* Close the remaining 14px gap — image starts exactly at the tab line */
.clubhouse-bg { top: -14px !important; }

/* ============================================================
   Tee Off — hero meets the tab line + squarer/shorter cards (fit one screen)
   ============================================================ */
#tab-round { margin-top: 0 !important; padding-top: 0 !important; }
.teeoff-hero { margin: -14px -18px 14px !important; min-height: 250px; }
.teeoff-hero-bg { background-position: center, center 22% !important; }
.teeoff-cards { gap: 12px !important; }
.teeoff-card-photo { height: 96px !important; }
.teeoff-card-body { padding: 2px 12px 13px !important; margin-top: -12px !important; }
.teeoff-card-icon svg { width: 27px; height: 27px; }
.teeoff-card-title { font-size: 17px !important; margin: 4px 0 3px !important; }
.teeoff-card-desc { font-size: 11px !important; }
.teeoff-continue { margin-top: 14px !important; }

@media (max-width: 700px) {
  .teeoff-hero { margin: -14px -14px 12px !important; min-height: 200px; }
  .teeoff-hero-title { font-size: 52px !important; }
  .teeoff-hero-sub { font-size: 13px !important; }
  .teeoff-cards { gap: 10px !important; }
  .teeoff-card-photo { height: 80px !important; }
  .teeoff-card-body { padding: 2px 10px 11px !important; }
  .teeoff-card-icon svg { width: 24px; height: 24px; }
  .teeoff-card-title { font-size: 15px !important; }
  .teeoff-card-desc { font-size: 10.5px !important; line-height: 1.4; }
  .teeoff-continue { padding: 15px !important; margin-top: 12px !important; font-size: 14px !important; }
}

/* Header + tabs are opaque green above the image — image can never bleed over the gold line */
header, .tabs-wrap { background-color: #07130E !important; position: relative !important; z-index: 30 !important; }
.clubhouse-bg { top: -18px !important; }
.teeoff-hero { margin-top: -18px !important; }

/* ============================================================
   Cache-bust image URLs (defeat stale PWA/browser cache) + thinner titles
   ============================================================ */
.clubhouse-bg {
  background-image:
    linear-gradient(180deg, rgba(7,19,14,0.10) 0%, rgba(7,19,14,0.38) 38%, rgba(7,19,14,0.80) 66%, rgba(7,19,14,0.97) 86%, #07130E 100%),
    url('clubhouse-bg.jpg?v=16') !important;
}
.teeoff-hero-bg {
  background-image:
    linear-gradient(180deg, rgba(7,19,14,0.10) 0%, rgba(7,19,14,0.30) 45%, rgba(7,19,14,0.82) 80%, #07130E 100%),
    url('teeoff-hero.jpg?v=3') !important;
}
.teeoff-card-photo.golf { background-image: url('teeoff-golf.jpg?v=3') !important; }
.teeoff-card-photo.sim { background-image: url('teeoff-sim.jpg?v=3') !important; }
.teeoff-card-photo.challenge { background-image: url('teeoff-challenge.jpg?v=3') !important; }
.teeoff-card-photo.custom { background-image: url('teeoff-custom.jpg?v=3') !important; }

/* Thinner, more elegant serif for the big titles */
.teeoff-hero-title, .clubhouse-sign span { font-weight: 400 !important; letter-spacing: 0.1em !important; }

/* Header + tab green spans full viewport width (edge to edge), seamless with the green above */
header, .tabs-wrap { box-shadow: none !important; }
header::before, .tabs-wrap::before {
  content: ""; position: absolute; top: 0; bottom: 0; left: 50%; transform: translateX(-50%);
  width: 100vw; background: #07130E; z-index: -1; pointer-events: none;
}

/* ============================================================
   Tee Off cards = full composed images (no overlaid icon/text → no doubles)
   ============================================================ */
.teeoff-card { padding: 0 !important; overflow: hidden !important; background: transparent !important; border: 1px solid var(--fr-border) !important; }
.teeoff-card-img { width: 100% !important; height: auto !important; display: block !important; border-radius: 17px; }
.teeoff-card.sel { border-color: var(--fr-gold-bright) !important; box-shadow: 0 0 16px rgba(201,171,89,0.30), 0 14px 30px rgba(0,0,0,0.45) !important; }

/* ============================================================
   Background sits BEHIND the (transparent) header — edge to edge, more course, seamless
   ============================================================ */
header, .tabs-wrap { background-color: transparent !important; position: relative !important; z-index: 2 !important; }
header::before, .tabs-wrap::before { display: none !important; }
.clubhouse-bg, .teeoff-hero-bg {
  position: fixed !important; top: 0 !important; left: 0 !important; transform: none !important;
  width: 100vw !important; height: 470px !important; z-index: 0 !important;
}
.clubhouse-bg { background-position: center 55% !important; }
.teeoff-hero-bg { background-position: center 50% !important; }
/* keep clubhouse + tee-off content above the fixed image */
.clubhouse-frame > *:not(.clubhouse-bg), .ch-top-card, .ch-stat3, .ch-trophy-hero,
.teeoff-hero > *:not(.teeoff-hero-bg), .teeoff-cards, .teeoff-continue { position: relative; z-index: 1; }
.teeoff-hero { min-height: 240px; }

/* ============================================================
   Header region = card-green veil @80% over the image; clubhouse cards @85%
   ============================================================ */
.clubhouse-bg {
  background-image:
    linear-gradient(180deg, rgba(22,34,25,0.70) 0%, rgba(22,34,25,0.70) 46%, rgba(7,19,14,0.32) 60%, rgba(7,19,14,0.86) 82%, #07130E 100%),
    url('clubhouse-bg.jpg?v=16') !important;
}
.teeoff-hero-bg {
  background-image:
    linear-gradient(180deg, rgba(22,34,25,0.70) 0%, rgba(22,34,25,0.70) 40%, rgba(7,19,14,0.32) 56%, rgba(7,19,14,0.86) 82%, #07130E 100%),
    url('teeoff-hero.jpg?v=4') !important;
}
/* Clubhouse boxes ~85% opacity (a little transparent) */
.ch-top-card, .ch-wall-tile, .ch-stat3 .ch-wall-tile, .ch-trophy-hero {
  background: linear-gradient(160deg, rgba(22,34,25,0.75), rgba(10,18,13,0.85)) !important;
}

/* ============================================================
   Header green-veil only on top band, remove line above tabs,
   full-height background behind everything, boxes 15% transparent
   ============================================================ */
/* 1. Remove the divider line above the tabs */
header { border-bottom: none !important; }

/* 2. Background image behind the WHOLE clubhouse; green 80% veil only on the header band */
.clubhouse-bg {
  height: 100vh !important; min-height: 760px !important;
  background-image:
    linear-gradient(180deg,
      rgba(22,34,25,0.70) 0%,
      rgba(22,34,25,0.70) 30%,     /* header + tab band: card-green @80% */
      rgba(7,19,14,0.40) 42%,      /* just below the line: course shows */
      rgba(7,19,14,0.52) 100%),    /* light wash so boxes/text stay readable, image still shows */
    url('clubhouse-bg.jpg?v=16') !important;
  background-size: cover, cover !important;
  background-position: center, center 42% !important;
  opacity: 1 !important;
}

/* 3. Clubhouse boxes = 15% transparent (85% opacity) — image faintly shows through */
.ch-top-card, .ch-wall-tile, .ch-stat3 .ch-wall-tile, .ch-trophy-hero {
  background: rgba(18,27,20,0.85) !important;
  backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}

/* ============================================================
   Header band green veil (85%) only; full-width gold line; clear image below
   ============================================================ */
header, .tabs-wrap { background: transparent !important; position: relative !important; z-index: 2 !important; }
header { margin-bottom: 0 !important; }
.tabs-wrap { margin-top: 0 !important; border-bottom: none !important; }
/* full-width green 85% veil covering exactly the header + tab band */
header::before, .tabs-wrap::before {
  content: "" !important; display: block !important; position: absolute; top: 0; bottom: 0; left: 50%;
  transform: translateX(-50%); width: 100vw; background: rgba(22,34,25,0.75); z-index: -1; pointer-events: none; opacity: 1 !important;
}
/* full-width gold line at the bottom of the tab bar */
.tabs-wrap::after {
  content: "" !important; display: block !important; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%);
  width: 100vw; height: 1.5px; z-index: 1; pointer-events: none; opacity: 1 !important;
  background: linear-gradient(90deg, rgba(212,178,94,0.18), rgba(212,178,94,0.55) 50%, rgba(212,178,94,0.18));
}
/* Background image: clear, no veil below the header */
.clubhouse-bg { background-image: url('clubhouse-bg.jpg?v=16') !important; }

/* Lock scroll on the main Clubhouse / Tee Off screens (released when you tap in) */
body.fr-noscroll { overflow: hidden !important; height: 100dvh !important; }
/* Pull Tee Off up so CONTINUE clears the bottom of the screen */
@media (max-width: 700px) {
  .teeoff-hero { min-height: 168px !important; margin-top: -18px !important; }
  .teeoff-hero-title { font-size: 46px !important; }
  .teeoff-cards { gap: 9px !important; }
  .teeoff-continue { margin-top: 10px !important; padding: 13px !important; }
}

/* ============================================================
   CLEAN: veil lives on the background image only — 85% header band + 15% below.
   Header/tabs transparent; full-width gold line under tabs.
   ============================================================ */
/* kill the conflicting header/tab veil pseudos */
header::before, .tabs-wrap::before { display: none !important; }
header, .tabs-wrap { background: transparent !important; position: relative !important; z-index: 2 !important; }
.tabs-wrap { border-bottom: none !important; }
/* full-width gold line under the tabs (explicitly reset old scroll-shadow props) */
.tabs-wrap::after {
  content: "" !important; display: block !important;
  position: absolute !important; top: auto !important; right: auto !important; bottom: 0 !important; left: 50% !important;
  transform: translateX(-50%) !important; width: 100vw !important; height: 1.5px !important;
  z-index: 3 !important; opacity: 1 !important; pointer-events: none;
  background: linear-gradient(90deg, rgba(212,178,94,0.18), rgba(212,178,94,0.55) 50%, rgba(212,178,94,0.18)) !important;
}
/* both backgrounds: fixed full-height, full-width; 85% header band → 15% veil below */
.clubhouse-bg, .teeoff-hero-bg {
  position: fixed !important; top: 0 !important; left: 0 !important; transform: none !important;
  width: 100vw !important; height: 100vh !important; min-height: 760px !important; z-index: 0 !important; opacity: 1 !important;
  background-size: cover, cover !important; background-repeat: no-repeat, no-repeat !important;
}
.clubhouse-bg {
  background-image:
    linear-gradient(180deg, rgba(22,34,25,0.75) 0%, rgba(22,34,25,0.75) 32%, rgba(7,19,14,0.15) 35%, rgba(7,19,14,0.15) 100%),
    url('clubhouse-bg.jpg?v=16') !important;
  background-position: center, center 42% !important;
}
.teeoff-hero-bg {
  background-image:
    linear-gradient(180deg, rgba(22,34,25,0.75) 0%, rgba(22,34,25,0.75) 32%, rgba(7,19,14,0.15) 35%, rgba(7,19,14,0.15) 100%),
    url('teeoff-hero.jpg?v=4') !important;
  background-position: center, center 45% !important;
}

/* Veil stop tied EXACTLY to the tab line (JS sets --fr-headerline) */
.clubhouse-bg {
  background-image:
    linear-gradient(180deg,
      rgba(22,34,25,0.75) 0,
      rgba(22,34,25,0.75) var(--fr-headerline, 250px),
      rgba(7,19,14,0.15) calc(var(--fr-headerline, 250px) + 4px),
      rgba(7,19,14,0.15) 100%),
    url('clubhouse-bg.jpg?v=16') !important;
}
.teeoff-hero-bg {
  background-image:
    linear-gradient(180deg,
      rgba(22,34,25,0.75) 0,
      rgba(22,34,25,0.75) var(--fr-headerline, 250px),
      rgba(7,19,14,0.15) calc(var(--fr-headerline, 250px) + 4px),
      rgba(7,19,14,0.15) 100%),
    url('teeoff-hero.jpg?v=4') !important;
}

/* Caddie circle lower — sits below the Best Achievement box, clear of the cards */
.caddie-fab { bottom: 14px !important; }
@media (max-width: 700px) { .caddie-fab { bottom: 14px !important; left: 12px !important; } }

/* ============================================================
   Veil below the line = 5%; bigger THE CLUBHOUSE; remove crest logo
   ============================================================ */
/* 5% veil below the tab line (was 15%) */
.clubhouse-bg {
  background-image:
    linear-gradient(180deg, rgba(22,34,25,0.75) 0, rgba(22,34,25,0.75) var(--fr-headerline,250px),
      rgba(7,19,14,0.05) calc(var(--fr-headerline,250px) + 4px), rgba(7,19,14,0.05) 100%),
    url('clubhouse-bg.jpg?v=16') !important;
}
.teeoff-hero-bg {
  background-image:
    linear-gradient(180deg, rgba(22,34,25,0.75) 0, rgba(22,34,25,0.75) var(--fr-headerline,250px),
      rgba(7,19,14,0.05) calc(var(--fr-headerline,250px) + 4px), rgba(7,19,14,0.05) 100%),
    url('teeoff-hero.jpg?v=4') !important;
}
/* THE CLUBHOUSE — three sizes larger */
.clubhouse-sign span { font-size: clamp(42px, 12vw, 62px) !important; }
@media (max-width: 700px) { .clubhouse-sign span { font-size: 44px !important; } }
/* remove the emblem/logo above THE CLUBHOUSE */
.clubhouse-crest { display: none !important; }

/* TEE OFF divider = same line+diamond as THE CLUBHOUSE */
.teeoff-hero-divider {
  display: flex !important; align-items: center; justify-content: center; gap: 12px;
  max-width: 260px; margin: 6px auto 14px !important; color: var(--fr-gold); font-size: 9px;
}
.teeoff-hero-divider::before, .teeoff-hero-divider::after {
  content: ""; flex: 1; height: 1px; background: linear-gradient(90deg, transparent, rgba(194,168,104,0.65), transparent);
}

/* ============================================================
   EXACT veil: 85% green band = exactly the header+tab elements (to the line),
   image carries a uniform 5% veil below. No JS measurement.
   ============================================================ */
/* image: uniform 5% veil everywhere */
.clubhouse-bg {
  background-image: linear-gradient(rgba(7,19,14,0.05), rgba(7,19,14,0.05)), url('clubhouse-bg.jpg?v=16') !important;
}
.teeoff-hero-bg {
  background-image: linear-gradient(rgba(7,19,14,0.05), rgba(7,19,14,0.05)), url('teeoff-hero.jpg?v=4') !important;
}
/* header + tab band: full-width 85% green veil tied to the elements (ends exactly at the line) */
header, .tabs-wrap { background: transparent !important; position: relative !important; z-index: 2 !important; }
header { margin-bottom: 0 !important; }
.tabs-wrap { margin-top: 0 !important; border-bottom: none !important; }
header::before, .tabs-wrap::before {
  content: "" !important; display: block !important;
  position: absolute !important; top: 0 !important; bottom: 0 !important; left: 50% !important; right: auto !important;
  transform: translateX(-50%) !important; width: 100vw !important; background: rgba(22,34,25,0.75) !important;
  z-index: -1 !important; opacity: 1 !important; pointer-events: none;
}

/* ============================================================
   Global premium backdrop behind ALL tabs (5% veil) — under the header band
   ============================================================ */
body::after {
  content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background-image: linear-gradient(rgba(7,19,14,0.05), rgba(7,19,14,0.05)), url('clubhouse-bg.jpg?v=16');
  background-size: cover, cover; background-position: center, center 42%; background-repeat: no-repeat, no-repeat;
}
/* tab sections stay transparent so the backdrop shows through on every tab */
#tab-rivalry, #tab-feed, #tab-fgl, #tab-trophies, #tab-rounds, #tab-friends, #tab-approvals, #tab-profile, #tab-insights, #tab-stats, .app, main, #main { background: transparent !important; }

/* ============================================================
   DEFINITIVE: green header band (top → gold line) + green 5% veil below, all tabs
   ============================================================ */
/* Global backdrop on every tab: image + green 5% veil */
body::after {
  content: "" !important; position: fixed !important; inset: 0 !important; z-index: -1 !important; pointer-events: none !important;
  background-image: linear-gradient(rgba(22,34,25,0.05), rgba(22,34,25,0.05)), url('clubhouse-bg.jpg?v=16') !important;
  background-size: cover, cover !important; background-position: center, center 42% !important; background-repeat: no-repeat, no-repeat !important;
}
/* per-tab images also carry the same green 5% veil */
.clubhouse-bg { background-image: linear-gradient(rgba(22,34,25,0.05), rgba(22,34,25,0.05)), url('clubhouse-bg.jpg?v=16') !important; }
.teeoff-hero-bg { background-image: linear-gradient(rgba(22,34,25,0.05), rgba(22,34,25,0.05)), url('teeoff-hero.jpg?v=4') !important; }

/* Header band: green 85%, from the very TOP of the screen down to the gold line */
header, .tabs-wrap { background: transparent !important; position: relative !important; z-index: 2 !important; }
header { margin-bottom: 0 !important; }
.tabs-wrap { margin-top: 0 !important; border-bottom: none !important; }
header::before {
  content: "" !important; display: block !important; position: absolute !important;
  top: -400px !important; bottom: 0 !important; left: 50% !important; right: auto !important;
  transform: translateX(-50%) !important; width: 100vw !important; background: rgba(22,34,25,0.75) !important;
  z-index: -1 !important; opacity: 1 !important; pointer-events: none;
}
.tabs-wrap::before {
  content: "" !important; display: block !important; position: absolute !important;
  top: 0 !important; bottom: 0 !important; left: 50% !important; right: auto !important;
  transform: translateX(-50%) !important; width: 100vw !important; background: rgba(22,34,25,0.75) !important;
  z-index: -1 !important; opacity: 1 !important; pointer-events: none;
}

/* THE CLUBHOUSE down 1.5 sizes (was too big) */
.clubhouse-sign span { font-size: clamp(36px, 10vw, 54px) !important; }
@media (max-width: 700px) { .clubhouse-sign span { font-size: 37px !important; } }

/* ============================================================
   Rivalry card v2 — matches the mockup (H2H + HCs + recent results + open button)
   ============================================================ */
.rv-card { position: relative; background: rgba(18,27,20,0.88); border: 1px solid var(--fr-border); border-radius: 18px; padding: 16px 16px 14px; margin-bottom: 14px; box-shadow: inset 0 1px 0 rgba(247,236,192,0.05), 0 14px 32px rgba(0,0,0,0.4); }
.rv-card .rv-fav { position: absolute; top: 12px; left: 12px; background: none; border: none; color: var(--fr-gold); font-size: 16px; cursor: pointer; z-index: 2; }
.rv-card-top { display: grid; grid-template-columns: 52px 1fr auto auto; align-items: center; gap: 12px; cursor: pointer; padding-left: 18px; }
.rv-card-av { width: 52px; height: 52px; border-radius: 50%; overflow: hidden; border: 1px solid var(--fr-gold-dim); display: inline-flex; flex: none; }
.rv-card-av img { width: 100%; height: 100%; object-fit: cover; }
.rv-card-title { font-family: Georgia, serif; font-size: 17px; font-weight: 700; color: var(--fr-offwhite); line-height: 1.2; }
.rv-card-title .rv-vs { color: var(--fr-gold); font-style: italic; font-weight: 400; font-size: 14px; }
.rv-card-sub { font-size: 12.5px; color: #c8c1ae; margin-top: 3px; }
.rv-card-sub2 { font-size: 11px; color: #8f897b; margin-top: 1px; }
.rv-card-rounds { text-align: right; line-height: 1.1; }
.rv-card-rounds b { font-family: Georgia, serif; font-size: 18px; color: var(--fr-offwhite); display: block; }
.rv-card-rounds span { font-size: 8px; letter-spacing: 0.12em; color: var(--fr-gold-dim); text-transform: uppercase; }
.rv-open-chev { font-size: 22px; color: var(--fr-gold-dim); padding-left: 4px; }

/* head-to-head box */
.rv-h2h { margin-top: 14px; border: 1px solid rgba(201,171,89,0.2); border-radius: 14px; padding: 12px 14px; background: rgba(7,15,11,0.35); }
.rv-h2h-h, .rv-results-h { text-align: center; font-size: 10px; letter-spacing: 0.18em; color: var(--fr-gold); text-transform: uppercase; }
.rv-h2h-row { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 8px; margin-top: 8px; }
.rv-h2h-side { text-align: center; }
.rv-h2h-name { font-size: 11px; letter-spacing: 0.06em; color: var(--fr-gold); text-transform: uppercase; }
.rv-h2h-hc { font-family: Georgia, serif; font-size: 22px; font-weight: 700; color: var(--fr-offwhite); margin-top: 2px; }
.rv-h2h-hcl { font-size: 8.5px; letter-spacing: 0.1em; color: #8f897b; }
.rv-h2h-mid { text-align: center; }
.rv-h2h-score { font-family: Georgia, serif; font-size: 30px; font-weight: 700; color: #fff; line-height: 1; }
.rv-h2h-lbl { font-size: 9px; letter-spacing: 0.16em; color: var(--fr-gold); text-transform: uppercase; }

/* recent results */
.rv-results { margin-top: 12px; border-top: 1px solid rgba(201,171,89,0.14); padding-top: 10px; }
.rv-results-h { margin-bottom: 8px; }
.rv-res-row { display: grid; grid-template-columns: 64px 1fr auto 1fr 14px; align-items: center; gap: 8px; padding: 6px 2px; cursor: pointer; border-radius: 8px; }
.rv-res-row:active { background: rgba(201,171,89,0.08); }
.rv-res-date { font-size: 11px; color: #8f897b; }
.rv-res-w { font-size: 12.5px; color: var(--fr-offwhite); text-align: left; }
.rv-res-l { font-size: 12.5px; color: #a7a08f; text-align: right; }
.rv-res-badge { font-size: 11px; font-weight: 800; color: #1f1808; background: linear-gradient(180deg,#e6cf8a,#c9a961); border-radius: 6px; padding: 2px 8px; white-space: nowrap; }
.rv-res-chev { color: var(--fr-gold-dim); font-size: 15px; text-align: right; }
.rv-res-empty { font-size: 12px; color: #8f897b; text-align: center; padding: 8px 0; }

.rv-full-btn { width: 100%; margin-top: 12px; padding: 11px; border: 1px solid rgba(201,171,89,0.3); border-radius: 11px; background: rgba(201,171,89,0.08); color: var(--fr-gold-bright); font-family: inherit; font-weight: 700; font-size: 13px; letter-spacing: 0.04em; cursor: pointer; }
.rv-full-btn:active { background: rgba(201,171,89,0.16); }

/* ============================================================
   Header = clean opaque green (untouched by veil); 5% veil only on the backgrounds below
   ============================================================ */
header::before, .tabs-wrap::before { background: rgba(22,34,25,0.75) !important; }   /* header band back to exactly how it was before the bg instruction */
/* (body::after keeps the image + 5% green veil for the backgrounds below the header) */

/* Pull the clubhouse content down ~1 cm (logo removed lifted everything) */
.clubhouse-sign { margin-top: 40px !important; }
@media (max-width: 700px) { .clubhouse-sign { margin-top: 40px !important; } }

/* THE CLUBHOUSE — 0.5 smaller */
.clubhouse-sign span { font-size: clamp(33px, 9vw, 50px) !important; }
@media (max-width: 700px) { .clubhouse-sign span { font-size: 34px !important; } }

/* ============================================================
   Tee Off divider = byte-identical to THE CLUBHOUSE divider (incl. mobile)
   ============================================================ */
.teeoff-hero-divider { display: flex !important; align-items: center; justify-content: center; gap: 12px; max-width: 260px; margin: 6px auto 16px !important; color: var(--fr-gold); font-size: 9px; letter-spacing: 0; opacity: 1; }
.teeoff-hero-divider::before, .teeoff-hero-divider::after { content: ""; flex: 1; height: 1px; background: linear-gradient(90deg, transparent, rgba(194,168,104,0.65), transparent); }
@media (max-width: 700px) { .teeoff-hero-divider { margin: 3px auto 9px !important; } }

/* ============================================================
   Background veil — make it actually VISIBLE (5% was imperceptible over the photo).
   Green tint, applied to the global backdrop + per-tab images, below the header only.
   ============================================================ */
body::after { background-image: linear-gradient(rgba(22,34,25,0.15), rgba(22,34,25,0.15)), url('clubhouse-bg.jpg?v=16') !important; }
.clubhouse-bg { background-image: linear-gradient(rgba(22,34,25,0.15), rgba(22,34,25,0.15)), url('clubhouse-bg.jpg?v=16') !important; }
.teeoff-hero-bg { background-image: linear-gradient(rgba(22,34,25,0.15), rgba(22,34,25,0.15)), url('teeoff-hero.jpg?v=4') !important; }

/* DIAGNOSTIC: background veil bumped to 95% to confirm the new version is actually loading */
body::after { background-image: linear-gradient(rgba(22,34,25,0.95), rgba(22,34,25,0.95)), url('clubhouse-bg.jpg?v=16') !important; }
.clubhouse-bg { background-image: linear-gradient(rgba(22,34,25,0.95), rgba(22,34,25,0.95)), url('clubhouse-bg.jpg?v=16') !important; }
.teeoff-hero-bg { background-image: linear-gradient(rgba(22,34,25,0.95), rgba(22,34,25,0.95)), url('teeoff-hero.jpg?v=4') !important; }

/* Background veil set to 25% (background shows through 75%) */
body::after { background-image: linear-gradient(rgba(22,34,25,0.25), rgba(22,34,25,0.25)), url('clubhouse-bg.jpg?v=16') !important; }
.clubhouse-bg { background-image: linear-gradient(rgba(22,34,25,0.25), rgba(22,34,25,0.25)), url('clubhouse-bg.jpg?v=16') !important; }
.teeoff-hero-bg { background-image: linear-gradient(rgba(22,34,25,0.25), rgba(22,34,25,0.25)), url('teeoff-hero.jpg?v=4') !important; }

/* Background veil set to 40% */
body::after { background-image: linear-gradient(rgba(22,34,25,0.40), rgba(22,34,25,0.40)), url('clubhouse-bg.jpg?v=16') !important; }
.clubhouse-bg { background-image: linear-gradient(rgba(22,34,25,0.40), rgba(22,34,25,0.40)), url('clubhouse-bg.jpg?v=16') !important; }
.teeoff-hero-bg { background-image: linear-gradient(rgba(22,34,25,0.40), rgba(22,34,25,0.40)), url('teeoff-hero.jpg?v=4') !important; }

/* Background veil OFF — image shows 100% */
body::after { background-image: url('clubhouse-bg.jpg?v=16') !important; }
.clubhouse-bg { background-image: url('clubhouse-bg.jpg?v=16') !important; }
.teeoff-hero-bg { background-image: url('teeoff-hero.jpg?v=4') !important; }

/* THE CLUBHOUSE up 0.25 cm (40px -> 30px) */
.clubhouse-sign { margin-top: 30px !important; }
@media (max-width: 700px) { .clubhouse-sign { margin-top: 30px !important; } }

/* ============================================================
   RIVALRY — premium redesign (full-bleed hero bg + compact cards)
   ============================================================ */
#tab-rivalry { position: relative; }
#tab-rivalry > *:not(.rivalry-hero-bg) { position: relative; z-index: 1; }
.rivalry-hero-bg {
  position: fixed; inset: 0; z-index: 0; pointer-events: none;
  background: #07130E url('rivalry-bg.jpg?v=9') center top / cover no-repeat;
}
.rivalry-hero { padding: 4px 2px 12px; text-align: left; }
.rivalry-hero-title {
  font-family: Georgia, 'Times New Roman', serif; font-weight: 400; letter-spacing: 0.1em;
  font-size: clamp(40px, 13vw, 72px); margin: 0; line-height: 1;
  background: linear-gradient(180deg, #efe0b8 0%, #d2b87e 48%, #b69a5b 72%, #9c8348 100%);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent;
  text-shadow: 0 2px 18px rgba(0,0,0,0.55);
}
.rivalry-hero-sub { color: #d8cfb9; font-size: 14px; letter-spacing: 0.02em; line-height: 1.45; margin: 10px 0 0; text-shadow: 0 1px 7px rgba(0,0,0,0.65); }

/* compact Spotify-style rival cards */
.rv-card2 { background: linear-gradient(180deg, rgba(5,18,14,0.58), rgba(3,12,10,0.42)); border: 1px solid rgba(207,166,83,0.40); border-radius: 14px; margin-bottom: 9px; overflow: hidden; }
.rv-card2.fav { border-color: rgba(201,171,89,0.42); }
.rv-c2-row { display: grid; grid-template-columns: 44px minmax(0,1fr) auto auto; align-items: center; gap: 11px; padding: 10px 12px; cursor: pointer; }
.rv-c2-av { width: 44px; height: 44px; border-radius: 50%; overflow: hidden; border: 1px solid var(--fr-gold-dim); display: inline-flex; flex: none; }
.rv-c2-av img, .rv-c2-av svg { width: 100%; height: 100%; object-fit: cover; }
.rv-c2-main { min-width: 0; }
.rv-c2-title { font-family: Georgia, serif; font-size: 15.5px; color: var(--fr-offwhite); line-height: 1.15; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rv-c2-title .rv-vs { color: var(--fr-gold); font-style: italic; font-size: 12.5px; }
.rv-c2-meta { font-size: 11px; color: #9a9483; margin-top: 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rv-c2-meta i { color: var(--fr-gold-dim); font-style: normal; margin: 0 3px; }
.rv-c2-h2h { font-weight: 800; color: var(--fr-gold-bright); margin-right: 3px; }
.rv-c2-h2h.lead { color: #7ddb9e; } .rv-c2-h2h.behind { color: #e0a0a0; } .rv-c2-h2h.level { color: var(--fr-gold-bright); }
.rv-c2-tag { color: var(--fr-gold); font-style: italic; }
.rv-card2 .rv-fav { background: none; border: none; color: var(--fr-gold-dim); font-size: 16px; cursor: pointer; padding: 2px 2px; line-height: 1; }
.rv-card2.fav .rv-fav { color: var(--fr-gold); }
.rv-c2-chev { font-size: 20px; color: var(--fr-gold-dim); transition: transform 0.2s ease; }
.rv-card2.expanded .rv-c2-chev { transform: rotate(90deg); }
.rv-c2-body { padding: 4px 14px 14px; border-top: 1px solid rgba(201,171,89,0.12); }

/* stat boxes a touch more glassy on the live bg */
#tab-rivalry .rv-dash { background: rgba(10,17,13,0.6); backdrop-filter: blur(7px); }

/* ============================================================
   Tee Off divider — visible lines on the bright hero photo
   ============================================================ */
.teeoff-hero-divider { text-shadow: 0 1px 3px rgba(0,0,0,0.65) !important; }
.teeoff-hero-divider::before, .teeoff-hero-divider::after { height: 1.5px !important; background: linear-gradient(90deg, transparent, rgba(233,210,160,0.95) 22%, rgba(233,210,160,0.95) 78%, transparent) !important; box-shadow: 0 1px 2px rgba(0,0,0,0.55) !important; }

/* Tee Off divider REAL FIX: in the flex-column hero, margin:auto made it shrink to the
   diamond (31px) so the flex:1 lines had width:0. Force an explicit width so lines show. */
.teeoff-hero-divider { width: 240px !important; max-width: 80% !important; }

/* Remove The Caddie button and the Log round floating button */
#caddie-fab, .caddie-fab, #mobile-fab, .mobile-fab { display: none !important; }

/* ============================================================
   QA batch: perf, desktop frame, cropped rivalry bg
   ============================================================ */
/* #7 perf: drop expensive blur on Rivalry (janky on mobile) */
.rv-card2, #tab-rivalry .rv-dash { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
.rv-card2 { background: linear-gradient(180deg, rgba(5,18,14,0.58), rgba(3,12,10,0.42)) !important; }

/* #9 cropped rivalry background (faux header removed) */
.rivalry-hero-bg { background: #07130E url('rivalry-bg.jpg?v=9') center top / cover no-repeat !important; }

/* #8 desktop: rich backdrop instead of dead black gutters + framed column */
@media (min-width: 1041px) {
  html, body { background: radial-gradient(130% 90% at 50% 0%, #16241b 0%, #111c14 60%, #0f1611 100%) fixed !important; }
  .app { border-left: 1px solid rgba(201,171,89,0.10) !important; border-right: 1px solid rgba(201,171,89,0.10) !important; box-shadow: 0 0 140px rgba(0,0,0,0.55) !important; }
}

/* ============================================================
   Clubhouse plate background — THE CLUBHOUSE sits on the FR plate, under the logo
   (image: FR plate ~7% height, empty plate band ~11–16%)
   ============================================================ */
.clubhouse-frame { position: relative !important; }
.clubhouse-bg {
  position: relative !important;
  height: 54vw !important; max-height: 250px !important; min-height: 150px !important;
  background-image: url('clubhouse-bg.jpg?v=16') !important;
  background-position: top center !important; background-size: cover !important;
  background-repeat: no-repeat !important;
  border-radius: 16px !important; margin-bottom: 6px !important;
}
.clubhouse-sign {
  position: absolute !important; top: 23vw !important; left: 0 !important; right: 0 !important;
  margin: 0 !important; z-index: 4 !important; text-align: center !important; pointer-events: none !important;
}
.clubhouse-sign span { font-size: 25px !important; letter-spacing: 0.14em !important; }
.clubhouse-divider { display: none !important; }
/* global faded backdrop on every tab uses the same room */
body::after { background-image: url('clubhouse-bg.jpg?v=16') !important; }
@media (min-width: 701px) {
  .clubhouse-bg { height: 210px !important; max-height: 210px !important; }
  .clubhouse-sign { top: 92px !important; }
  .clubhouse-sign span { font-size: 30px !important; }
}

/* ============================================================
   Clubhouse: WHOLE image as a backdrop that runs down behind the content
   (plate at top with THE CLUBHOUSE on it, room/window/sofas continue downward)
   ============================================================ */
.clubhouse-frame {
  position: relative !important;
  background-image: url('clubhouse-bg.jpg?v=16') !important;
  background-position: top center !important;
  background-size: 100% auto !important;
  background-repeat: no-repeat !important;
}
.clubhouse-bg { display: none !important; }
.clubhouse-frame > *:not(.clubhouse-bg) { position: relative !important; z-index: 1 !important; }
/* THE CLUBHOUSE on the plate — 26% of frame width lands under the FR logo on every screen size */
.clubhouse-sign { position: static !important; top: auto !important; margin: 26% auto 10px !important; }
.clubhouse-sign span { font-size: 25px !important; }
@media (min-width: 701px) {
  .clubhouse-sign { position: static !important; top: auto !important; margin: 26% auto 10px !important; }
  .clubhouse-sign span { font-size: 30px !important; }
}

/* Clubhouse backdrop edge-to-edge (kill the green side gutters; cancel .app padding) */
.clubhouse-frame { margin-left: -14px !important; margin-right: -14px !important; padding-left: 14px !important; padding-right: 14px !important; }
@media (min-width: 561px)  { .clubhouse-frame { margin-left: -16px !important; margin-right: -16px !important; padding-left: 16px !important; padding-right: 16px !important; } }
@media (min-width: 1041px) { .clubhouse-frame { margin-left: -22px !important; margin-right: -22px !important; padding-left: 22px !important; padding-right: 22px !important; } }

/* Remove THE CLUBHOUSE text + let the backdrop reach all the way up to the header
   (the title's margin-top was collapsing out of the frame and leaving a green band) */
.clubhouse-sign { display: none !important; }
.clubhouse-frame { padding-top: 10px !important; }

/* Clubhouse: fill the screen height — distribute the 3 stat blocks so the bottom
   (Par Streak) sits ~0.25 cm above the screen edge; backdrop bleeds past the bottom */
#tab-dashboard { display: flex !important; flex-direction: column !important; min-height: calc(100dvh - 118px) !important; }
#tab-dashboard .clubhouse-frame { flex: 1 1 auto !important; display: flex !important; flex-direction: column !important; }
#tab-dashboard #dash-quick-strip { flex: 0 0 auto !important; }
#tab-dashboard #dash-clubhouse-tail { flex: 1 1 auto !important; display: flex !important; flex-direction: column !important; justify-content: space-between !important; }
@media (min-width: 701px) { #tab-dashboard { min-height: calc(100dvh - 222px) !important; } }

/* Compact boxes again (revert the flex space-between fill) + scrolling on; lift bottom box ~0.5cm */
body.fr-noscroll { overflow: auto !important; height: auto !important; }
#tab-dashboard { display: block !important; min-height: 0 !important; }
#tab-dashboard .clubhouse-frame { display: block !important; }
#tab-dashboard #dash-clubhouse-tail { display: block !important; justify-content: normal !important; }
#tab-dashboard .ch-trophy-hero { margin-bottom: 19px !important; }

/* ============================================================
   Clubhouse FINAL: fixed full-screen room backdrop (covers everything, no green
   possible) + boxes compact and bottom-aligned to just touch the edge
   ============================================================ */
.clubhouse-bg {
  display: block !important;
  position: fixed !important; inset: 0 !important; z-index: 0 !important; pointer-events: none !important;
  background-color: #0d1812 !important;
  background-image: url('clubhouse-bg.jpg?v=16') !important;
  background-position: center var(--fr-headerline, 110px) !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
  height: auto !important; max-height: none !important; min-height: 0 !important; border-radius: 0 !important; margin: 0 !important;
}
.clubhouse-frame { background: none !important; position: relative !important; display: block !important; margin: 0 !important; padding: 0 !important; }
.clubhouse-frame > *:not(.clubhouse-bg) { position: relative !important; z-index: 1 !important; }
#tab-dashboard { display: flex !important; flex-direction: column !important; justify-content: flex-end !important; min-height: calc(100dvh - var(--fr-headerline, 110px)) !important; }
#tab-dashboard #dash-clubhouse-tail { display: block !important; }
#tab-dashboard .ch-trophy-hero { margin-bottom: 6px !important; }

/* New clubhouse image (FR plate + THE CLUBHOUSE baked in) — cache-bust to v6 */
.clubhouse-bg { background-image: url('clubhouse-bg.jpg?v=16') !important; }
body::after { background-image: url('clubhouse-bg.jpg?v=16') !important; }

/* FIX: keep #tab-dashboard hidden on other tabs (the flex !important above was
   overriding the inline display:none, leaving Clubhouse on top of every tab) */
#tab-dashboard[style*="none"] { display: none !important; }

/* FIX: stop the clubhouse frame from stretching (leftover flex:1 made the boxes
   sit at the top); flex:0 0 auto lets justify-content:flex-end bottom-align them */
#tab-dashboard .clubhouse-frame { flex: 0 0 auto !important; }

/* ============================================================
   RIVALRY redesign v3 — narrow black premium rival cards
   ============================================================ */
.rv-card2 {
  background: linear-gradient(180deg, rgba(5,18,14,0.58), rgba(3,12,10,0.42)) !important;
  border: 1px solid rgba(201,171,89,0.30) !important;
  border-radius: 12px !important;
  margin-bottom: 8px !important;
  overflow: hidden !important;
  box-shadow: 0 0 14px rgba(201,171,89,0.06), 0 4px 14px rgba(0,0,0,0.55), inset 0 1px 0 rgba(247,236,192,0.04) !important;
  backdrop-filter: none !important;
}
.rv-card2.fav { border-color: rgba(201,171,89,0.55) !important; box-shadow: 0 0 18px rgba(201,171,89,0.12), 0 4px 14px rgba(0,0,0,0.55) !important; }
.rv-c2-row { display: grid !important; grid-template-columns: 40px minmax(0,1fr) auto auto !important; align-items: center !important; gap: 9px !important; padding: 9px 13px !important; cursor: pointer !important; }
/* Rivalkortet viser avatar igjen (redesign 2026-07-23). */
.rv-c2-av { display: inline-flex !important; width: 40px !important; height: 40px !important; }
.rv-c2-main { min-width: 0 !important; }
.rv-c2-title { font-family: Georgia, 'Times New Roman', serif !important; font-size: 13px !important; color: #f3ecdf !important; line-height: 1.2 !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; letter-spacing: 0.01em !important; }
.rv-c2-title .rv-vs { color: var(--fr-gold) !important; font-style: italic !important; font-size: 10.5px !important; margin: 0 2px !important; }
.rv-c2-meta { font-size: 10.5px !important; color: #948e7e !important; margin-top: 2px !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; }
.rv-c2-meta i { font-style: normal !important; color: var(--fr-gold-dim) !important; margin: 0 5px !important; }
.rv-c2-meta b { font-weight: 800; color: var(--fr-gold-bright); }
.rv-c2-meta.lead b { color: #7ddb9e; }
.rv-c2-meta.behind b { color: #e0a0a0; }
.rv-c2-meta.level b { color: var(--fr-gold-bright); }
.rv-card2 .rv-fav { background: none !important; border: none !important; color: var(--fr-gold-dim) !important; font-size: 14px !important; cursor: pointer !important; padding: 2px !important; line-height: 1 !important; }
.rv-card2.fav .rv-fav { color: var(--fr-gold) !important; }
.rv-c2-chev { font-size: 18px !important; color: var(--fr-gold-dim) !important; transition: transform 0.2s ease !important; }
.rv-card2.expanded .rv-c2-chev { transform: rotate(90deg) !important; }
.rv-c2-body { padding: 2px 13px 13px !important; border-top: 1px solid rgba(201,171,89,0.12) !important; }

/* placeholder / empty-state card */
.rv-placeholder { border-style: dashed !important; border-color: rgba(201,171,89,0.38) !important; background: rgba(7,8,10,0.6) !important; }
.rv-placeholder .rv-tbd { color: var(--fr-gold) !important; font-style: italic !important; }
.rv-placeholder .rv-cta { color: var(--fr-gold-bright) !important; }
.rv-placeholder .rv-plus { font-size: 20px !important; color: var(--fr-gold) !important; }

/* trophies row in the expanded card */
.rv-trophs { display: flex !important; flex-wrap: wrap !important; gap: 6px !important; margin: 4px 0 8px !important; }
.rv-troph-chip { font-size: 10.5px !important; color: #1f1808 !important; background: linear-gradient(180deg,#e6cf8a,#c9a961) !important; border-radius: 7px !important; padding: 3px 9px !important; font-weight: 700 !important; white-space: nowrap !important; }

/* Insights modal */
.rv-ins-eyebrow { text-align: center; font-size: 10px; letter-spacing: 0.22em; color: var(--fr-gold); text-transform: uppercase; }
.rv-ins-title { text-align: center; font-family: Georgia, serif; font-size: 19px; margin: 4px 0 14px; color: var(--fr-offwhite); font-weight: 400; }
.rv-ins-title .rv-vs { color: var(--fr-gold); font-style: italic; font-size: 15px; }

/* ============================================================
   FEED redesign — compact scorecard on every round card
   ============================================================ */
.feed-course2 { font-size: 10.5px; color: var(--fr-gold); letter-spacing: 0.06em; text-transform: uppercase; margin-top: 3px; }
.feed-vs { font-family: Georgia, 'Times New Roman', serif; font-size: 15px; color: var(--fr-offwhite); margin-top: 3px; line-height: 1.2; }
.feed-vsx { color: var(--fr-gold); font-style: italic; font-size: 12px; margin: 0 2px; }
.feed-status { font-size: 12.5px; color: #cfc8b6; margin-top: 3px; font-weight: 600; letter-spacing: 0.01em; }
.feed-status.win { color: #7ddb9e; }
.feed-status.loss { color: #e0a0a0; }
.feed-status.live { color: #f3ecdf; }

.fsc { margin: 9px 0 4px; display: flex; flex-direction: column; gap: 7px; }
.fsc-grid { display: grid; gap: 2px 1px; align-items: center; }
.fsc-grid > span { font-size: 10.5px; text-align: center; line-height: 1.55; color: #cfc8b6; padding: 1px 0; min-width: 0; }
.fsc-lbl { font-size: 8.5px !important; letter-spacing: 0.04em; color: var(--fr-gold) !important; text-align: left !important; font-weight: 700; text-transform: uppercase; }
.fsc-lbl.fsc-n { color: #e9e2cf !important; }
.fsc-h { color: #8a8474 !important; font-size: 8.5px !important; }
.fsc-c { background: rgba(255,255,255,0.035); border-radius: 3px; color: #e3dcc9; }
.fsc-c.b { color: #1f1808; background: linear-gradient(180deg,#e6cf8a,#c9a961); font-weight: 800; }
.fsc-c.p { color: #cfc8b6; }
.fsc-c.bo { color: #c4bdab; }
.fsc-c.db { color: #e0a0a0; }
.fsc-tot { color: var(--fr-gold-bright) !important; font-weight: 700; }
.fsc-empty { font-size: 11px; color: #8a8474; padding: 8px 0 4px; text-align: center; }

.feed-cta { width: 100%; margin-top: 9px; padding: 9px; border: 1px solid rgba(201,171,89,0.3); border-radius: 10px; background: rgba(201,171,89,0.08); color: var(--fr-gold-bright); font-family: inherit; font-weight: 700; font-size: 12px; letter-spacing: 0.03em; cursor: pointer; }
.feed-cta:active { background: rgba(201,171,89,0.16); }
.feed-card .feed-type.live { color: #f3ecdf; }

/* PWA: stop pull-to-refresh / overscroll bounce (it was sliding content under the
   screen and reloading the app back to Clubhouse on the installed home-screen app) */
html, body { overscroll-behavior: none !important; overscroll-behavior-y: none !important; }

/* Tee Off: deeper/darker gold on the TEE OFF title + divider lines for better contrast */
.teeoff-hero-title {
  background: linear-gradient(180deg, #cba858 0%, #b08d3f 48%, #8a6a2c 100%) !important;
  -webkit-background-clip: text !important; background-clip: text !important;
  -webkit-text-fill-color: transparent !important; color: transparent !important;
}
.teeoff-hero-divider { color: #a9863f !important; }
.teeoff-hero-divider::before, .teeoff-hero-divider::after {
  background: linear-gradient(90deg, transparent, #a9863f 22%, #a9863f 78%, transparent) !important;
}

/* ============================================================
   TEE OFF FLOW (Setup / Course / Score) — Tee Off backdrop + translucent boxes
   ============================================================ */
#r-form-golf, #r-form-golfmini, #r-form-minigame, #r-form-other { position: relative; }
#r-form-golf::before, #r-form-golfmini::before, #r-form-minigame::before, #r-form-other::before {
  content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background: #07130E url('teeoff-hero.jpg?v=4') center top / cover no-repeat;
}
/* translucent boxes */
#r-form-golf .field, #r-form-golf .rnd-row, #r-form-golf details, #r-form-golf .rwz-players-wrap,
#r-form-golf .rwz-holeset-wrap, #r-form-golf .rnd-hcp-slim, #r-form-golf .rnd-score-btn {
  background: rgba(8,13,10,0.62) !important; backdrop-filter: blur(2px);
}
#r-form-golf input, #r-form-golf select, #r-form-golf textarea { background: rgba(6,10,8,0.55) !important; }
/* remove the big green box behind the score choices */
#r-form-golf .rnd-score-wrap, #r-form-golf .rnd-score-wrap-setup { background: transparent !important; border: none !important; box-shadow: none !important; padding: 0 !important; }
.rwz-scan-btn { display: none !important; }
#rwz-step-1 { font-size: 0.95em; }

/* SCORE step — premium full-width scorecard with a gold border */
#r-input-hbh, #rwz-totals-host { width: 100% !important; }
#r-form-golf .rwz-sc-card, #r-form-golf .hbh-scorecard, #r-form-golf #rwz-card-host {
  border: 1.5px solid rgba(201,171,89,0.55) !important; border-radius: 14px !important;
  box-shadow: 0 0 18px rgba(201,171,89,0.12), 0 10px 30px rgba(0,0,0,0.5) !important;
  background: rgba(6,10,8,0.66) !important; padding: 10px !important;
}

/* ============================================================
   FGL = Coming soon image only
   ============================================================ */
.fgl-coming-img { display: block; width: 100%; height: auto; border-radius: 14px; }

/* ============================================================
   RIVALRY expanded — 4 key stat boxes + premium "See whole rivalry"
   ============================================================ */
.rv-exp-stats.rv4 { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 10px 0 12px; }
.rv-exp-stats.rv4 .rv-exp-cell { background: linear-gradient(180deg, rgba(5,18,14,0.50), rgba(3,12,10,0.36)); border: 1px solid rgba(207,166,83,0.30); border-radius: 11px; padding: 9px 8px; text-align: center; }
.rv-exp-stats.rv4 .rv-exp-v { font-family: Georgia, serif; font-size: 16px; color: #fff; line-height: 1.12; }
.rv-exp-stats.rv4 .rv-exp-l { font-size: 9px; letter-spacing: 0.07em; color: var(--fr-gold); text-transform: uppercase; margin-top: 3px; }
.rv-card2.expanded .rv-c2-title { font-size: 12px !important; }
.rv-card2.expanded .rv-c2-meta { font-size: 10px !important; }

.rv-whole-btn { width: 100%; padding: 12px; border: 1px solid rgba(201,171,89,0.5); border-radius: 12px; background: linear-gradient(180deg, rgba(201,171,89,0.20), rgba(201,171,89,0.06)); color: var(--fr-gold-bright); font-family: inherit; font-weight: 800; font-size: 12.5px; letter-spacing: 0.07em; text-transform: uppercase; cursor: pointer; box-shadow: 0 0 16px rgba(201,171,89,0.10), inset 0 1px 0 rgba(247,236,192,0.08); }
.rv-whole-btn:active { background: rgba(201,171,89,0.24); }

/* See whole rivalry — premium gold modal */
.rv-whole { border: 1px solid rgba(201,171,89,0.28); border-radius: 14px; padding: 14px 12px; background: linear-gradient(180deg, rgba(201,171,89,0.05), rgba(7,12,9,0.0)); }
.rv-whole-eyebrow { text-align: center; font-size: 10px; letter-spacing: 0.24em; color: var(--fr-gold); text-transform: uppercase; }
.rv-whole-title { text-align: center; font-family: Georgia, serif; font-size: 20px; font-weight: 400; color: var(--fr-offwhite); margin: 5px 0 2px; }
.rv-whole-title .rv-vs { color: var(--fr-gold); font-style: italic; font-size: 15px; }
.rv-whole-verdict { text-align: center; font-size: 13px; color: var(--fr-gold-bright); margin-bottom: 12px; font-weight: 600; }

/* ============================================================
   FEED — completed result white; only live status is coloured (light blue)
   ============================================================ */
.feed-status { color: #f3ecdf !important; }
.feed-status.live { color: #7ec8e3 !important; }
.feed-card .feed-type.live { color: #7ec8e3 !important; }
.feed-live-dot { background: #7ec8e3 !important; }

/* Approvals notification — clear red alert badge over the icon */
.ch-navbadge { background: #d64545 !important; color: #fff !important; min-width: 17px !important; height: 17px !important; font-size: 10.5px !important; font-weight: 800 !important; box-shadow: 0 0 0 2px rgba(8,12,9,0.92), 0 0 9px rgba(214,69,69,0.6) !important; top: 4px !important; right: 6px !important; }

/* ============================================================
   BATCH: FGL/Feed/Rivalry backdrops + Tee Off compaction + course-search fix
   ============================================================ */

/* FGL — selve bildet blir fullskjerms fast bakgrunn bak den transparente globale
   headeren (samme monster som Feed/Rivalry sine faste bakgrunner). Ingen
   side-spesifikk headerflate; forskjellen mellom sidene starter under headeren. */
#tab-fgl { overflow: visible !important; position: relative !important; }
.fgl-coming-img { position: fixed !important; inset: 0 !important; width: 100vw !important; max-width: 100vw !important; height: 100lvh !important; object-fit: cover !important; object-position: center top !important; margin: 0 !important; border-radius: 0 !important; display: block !important; z-index: 0 !important; pointer-events: none !important; }
#fgl-root { min-height: 45dvh; }

/* FEED — full-bleed background image + 95% opaque cards + a little air below the gold line */
#tab-feed { position: relative !important; }
#tab-feed > * { position: relative !important; z-index: 1 !important; }
#tab-feed::before { content: "" !important; position: fixed !important; inset: 0 !important; z-index: 0 !important; pointer-events: none !important; background: #07130E url('feed-bg.jpg?v=3') center top / cover no-repeat !important; }
#tab-feed #feed-filters { margin-top: 6px !important; }
.feed-card { background: rgba(9,14,11,0.95) !important; backdrop-filter: none !important; }

/* RIVALRY — remove big title + subtitle; background covers the full screen, trophy up under header */
.rivalry-hero, .rivalry-hero-title, .rivalry-hero-sub { display: none !important; }
.rivalry-hero-bg { position: fixed !important; inset: 0 !important; min-height: 100dvh !important; background: #07130E url('rivalry-bg.jpg?v=9') center top / cover no-repeat !important; }
#tab-rivalry { padding-top: 8px !important; }

/* ============================================================
   TEE OFF flow — green box down + 90% opaque + compact; FIX course dropdown
   ============================================================ */
#r-form-golf, #r-form-golfmini, #r-form-minigame, #r-form-other {
  margin-top: 10px !important;
  background: rgba(10,18,13,0.90) !important;
  padding: 12px 12px 16px !important;
}
/* fields transparent (sit on the green panel) — REMOVES the blur stacking-context that broke course search */
#r-form-golf .field, #r-form-golf .rnd-row, #r-form-golf details, #r-form-golf .rwz-players-wrap,
#r-form-golf .rwz-holeset-wrap, #r-form-golf .rnd-hcp-slim {
  background: transparent !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}
#r-form-golf .rnd-score-btn { background: rgba(6,10,8,0.5) !important; backdrop-filter: none !important; }
#r-form-golf input, #r-form-golf select, #r-form-golf textarea { background: rgba(6,10,8,0.6) !important; backdrop-filter: none !important; }
/* compaction so Set up / Course / Score fit one screen */
#r-form-golf .rwz-step-title { margin: 2px 0 8px !important; font-size: 17px !important; }
#r-form-golf .field { margin-bottom: 8px !important; }
#r-form-golf .rnd-row { margin-bottom: 8px !important; }
#r-form-golf .rnd-score-btn { padding: 8px 11px !important; }
#r-form-golf .rnd-score-desc { font-size: 10px !important; line-height: 1.25 !important; }
#r-form-golf .rwz-players-wrap, #r-form-golf .rwz-holeset-wrap, #r-form-golf .rnd-score-wrap { margin-bottom: 8px !important; }
#r-form-golf .rwz-next-btn { margin-top: 8px !important; }

/* COURSE SEARCH FIX — keep the search field + dropdown above the translucent siblings */
#r-form-golf .rnd-course-field, #r-form-golf .course-search-wrap, .course-search-wrap { position: relative !important; z-index: 40 !important; }
.course-suggestions, #r-course-suggestions { z-index: 2000 !important; }

/* ============ FEED v2 — mockup-redesign ============ */
.feed-filt-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#e1c47e;box-shadow:0 0 6px #e1c47e;vertical-align:middle;margin-left:2px}
.feed-card2{position:relative;z-index:1;background:rgba(14,17,15,.5);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);border:1px solid rgba(201,169,97,.22);border-radius:16px;padding:14px 14px 12px;margin:0 0 14px;box-shadow:0 10px 30px rgba(0,0,0,.4)}
.feed-card2.live{border-color:rgba(225,196,126,.5);box-shadow:0 0 0 1px rgba(225,196,126,.25),0 10px 30px rgba(0,0,0,.45)}
.feed-head2{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
.feed-head-l{min-width:0}
.feed-typ2{display:flex;align-items:center;gap:6px;font-size:10.5px;font-weight:800;letter-spacing:.12em;color:#c9a961;text-transform:uppercase}
.feed-typ2.live{color:#e1c47e}
.feed-typ-ic{width:14px;height:14px;flex:0 0 auto}
.feed-crs2{font-size:15px;font-weight:700;color:#f3ead2;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:200px}
.feed-tm2{font-size:11px;color:#8a8576;margin-top:2px}
.feed-head-r{text-align:right;flex:0 0 auto}
.feed-badge2{display:inline-block;font-size:10px;font-weight:800;letter-spacing:.08em;padding:3px 8px;border-radius:999px}
.feed-badge2.live{color:#1a1407;background:linear-gradient(180deg,#e9d28c,#c9a961)}
.feed-badge2.final{color:#cdbf9c;background:rgba(201,169,97,.14);border:1px solid rgba(201,169,97,.3)}
.feed-rsub2{font-size:11.5px;color:#b9b09a;margin-top:4px;font-weight:600}
.feed-rsub2.live{color:#e1c47e}
.feed-rsub2.good{color:#7eb59a}
.feed-players2{display:flex;align-items:center;gap:10px;margin:12px 0 4px}
.feed-players2.solo{justify-content:flex-start}
.feed-pl2{display:flex;align-items:center;gap:9px;min-width:0;flex:1}
.feed-players2.solo .feed-pl2{flex:0 1 auto}
.feed-pl2:last-child{justify-content:flex-end;text-align:right}
.feed-pl2:last-child .feed-pl2-m{order:-1}
.feed-pl2:last-child .feed-av2{order:1}
.feed-av2{width:34px;height:34px;border-radius:50%;flex:0 0 auto;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:800;color:#1a1407;background:linear-gradient(180deg,#e4c97a,#c9a961);border:1px solid rgba(255,255,255,.25)}
.feed-pn2{font-size:13.5px;font-weight:700;color:#ece3cd;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.feed-ps2{font-size:12.5px;color:#b9b09a;font-weight:700;margin-top:1px}
.feed-ps2.win{color:#7eb59a}
.feed-vs2{flex:0 0 auto;font-size:11px;font-weight:800;color:#8a8576;letter-spacing:.05em}
/* scorecard */
.fsc2-wrap{overflow-x:auto;margin:10px -2px 2px;padding-bottom:2px;-webkit-overflow-scrolling:touch}
.fsc2{display:grid;gap:0;min-width:max-content;font-variant-numeric:tabular-nums}
.fsc2-lbl{font-size:9.5px;font-weight:800;letter-spacing:.04em;color:#8a8576;display:flex;align-items:center;padding-left:2px;text-transform:uppercase;position:sticky;left:0;background:rgba(14,17,15,.97);z-index:2}
.fsc2-nm{color:#cdbf9c}
.fsc2-c{height:22px;display:flex;align-items:center;justify-content:center;font-size:10px;color:#cfc7b2}
.fsc2-hd{color:#8a8576;font-weight:800;font-size:9px;letter-spacing:.03em}
.fsc2-sum{color:#e1c47e;font-weight:800}
.fsc2-s{width:18px;height:18px;display:flex;align-items:center;justify-content:center;border-radius:50%;font-size:10px;font-weight:700;color:#e7dec8}
.fsc2-s.b{border:1.5px solid #7eb59a;color:#9ad4ba}
.fsc2-s.o{border:1.5px solid rgba(214,120,120,.85);color:#e0a0a0}
.fsc2-s.o2{border:1.5px solid rgba(214,120,120,.85);background:rgba(214,120,120,.18);color:#eaa6a6}
.fsc2-empty{font-size:11.5px;color:#8a8576;padding:10px 2px 4px}
/* footer */
.feed-foot2{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:12px;padding-top:11px;border-top:1px solid rgba(201,169,97,.14)}
.feed-foot-l{display:flex;align-items:center;gap:14px}
.feed-foot-btn{background:none;border:none;display:flex;align-items:center;gap:5px;color:#9d977f;font-size:12px;font-weight:600;cursor:pointer;padding:0}
.feed-foot-btn:hover{color:#e1c47e}
.feed-foot-btn .feed-react-svg{vertical-align:middle}
.feed-cta2{background:linear-gradient(180deg,#e4c97a,#c9a961);color:#1a1407;border:none;border-radius:999px;padding:8px 16px;font-size:12.5px;font-weight:800;letter-spacing:.02em;cursor:pointer;flex:0 0 auto}
.feed-cta2:hover{filter:brightness(1.06)}
.feed-trophy-pill{display:inline-flex;align-items:center;gap:6px;margin-top:8px;padding:5px 11px;border-radius:999px;background:rgba(201,169,97,.13);border:1px solid rgba(201,169,97,.3);color:#e1c47e;font-size:12px;font-weight:700}

/* ===== FEED v2 scorecard — premium rebuild (overrides earlier .fsc2 rules) ===== */
.feed-card2 .fsc2-wrap{all:unset}
.fsc2-box{margin:11px auto 3px;width:100%;box-sizing:border-box;background:rgba(255,255,255,.018);border:1px solid rgba(201,169,97,.4);border-radius:12px;padding:9px 8px;overflow:hidden}
.fsc2{display:grid;width:100%;gap:1px 0;align-items:center;font-variant-numeric:tabular-nums;--fsc-fs:9.5px}
.fsc2-lbl,.fsc2-c{font-size:var(--fsc-fs);line-height:1;height:17px;display:flex;align-items:center;justify-content:center;min-width:0}
.fsc2-lbl{justify-content:flex-start;font-weight:800;letter-spacing:.02em;color:#cdbf9c;padding-right:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fsc2-nm{color:#e7dec8}
.fsc2-hd{color:#9a937e;font-weight:800}
.fsc2-lbl.fsc2-hd{color:#9a937e}
.fsc2-c{color:#d8d0bb;font-weight:600;position:relative}
.fsc2-sum{color:#e1c47e !important;font-weight:800}
.fsc2 .fsc2-c.fsc2-sum,.fsc2 .fsc2-hd.fsc2-sum{color:#e1c47e}
.fsc2-s{width:15px;height:15px;display:flex;align-items:center;justify-content:center;border-radius:50%;font-style:normal;font-size:var(--fsc-fs);font-weight:700;color:#e7dec8;box-sizing:border-box}
.fsc2-s.p{color:#d8d0bb}
.fsc2-s.b{border:1.3px solid #7eb59a;color:#9fd8be}
.fsc2-s.o{border:1.3px solid rgba(211,128,128,.9);color:#e2a6a6}
.fsc2-s.o2{border:1.3px solid rgba(211,128,128,.95);background:rgba(211,128,128,.16);color:#ecaaaa}
/* gold separator above first player row */
.fsc2-empty{font-size:11px;color:#8a8576;padding:7px 2px 3px;text-align:center}

/* ===== Feed card players row — responsive, one line, ellipsis ===== */
.feed-pl2{min-width:0}
.feed-pl2-m{min-width:0;overflow:hidden}
.feed-pn2{font-size:12.5px;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.feed-ps2{font-size:11.5px;white-space:nowrap}
.feed-vs2{flex:0 0 auto;padding:0 2px}
.feed-av2{width:30px;height:30px;font-size:11px}
.feed-crs2{font-size:14px;max-width:46vw}
@media (max-width:380px){
  .feed-pn2{font-size:11.5px}
  .feed-av2{width:27px;height:27px}
  .fsc2{--fsc-fs:8.7px}
}


/* ============================================================
   Tee Off scorecard (rwz) — premium: centered, transparent,
   gold frame, consistent type. Verified live on real component.
   ============================================================ */
.rwz-scorecard { margin: 12px auto 0; width: 100% !important; box-sizing: border-box; }
.rwz-sc-grid.winnerN {
  width: 100% !important; max-width: 560px !important; margin: 0 auto !important; box-sizing: border-box;
  background: rgba(255,255,255,0.02) !important;
  border: 1px solid rgba(201,169,97,0.42) !important; border-radius: 12px !important; overflow: hidden !important;
}
.rwz-sc-stat { width: 100% !important; max-width: 560px !important; margin: 0 auto 10px !important; box-sizing: border-box; }
.rwz-sc-head.winnerN, .rwz-sc-row.winnerN {
  width: 100% !important; gap: 3px !important; padding: 5px 9px !important; box-sizing: border-box !important;
}
.rwz-sc-head.winnerN > div { font-size: 10px !important; color: #9a937f !important; }
.rwz-sc-cell { font-size: 13px !important; }
.rwz-sc-cell.hole { font-size: 13px !important; color: #e1c47e !important; font-weight: 700 !important; }
.rwz-step-val { font-size: 14px !important; font-weight: 700 !important; min-width: 16px !important; }
.par-step .rwz-step-val { font-size: 14px !important; font-weight: 600 !important; color: #cfc7b2 !important; }
.rwz-sc-grid.winnerN[data-pc="3"] .rwz-step-val,
.rwz-sc-grid.winnerN[data-pc="4"] .rwz-step-val { font-size: 13px !important; }
.rwz-step-btn { width: 18px !important; height: 24px !important; font-size: 14px !important; }
.rwz-step-btn.sm { width: 15px !important; height: 20px !important; }
.rwz-sc-grid.winnerN[data-pc="4"] .rwz-step-btn { width: 15px !important; }
.rwz-sc-row.winnerN:nth-child(11) { border-top: 2px solid rgba(201,169,97,0.35) !important; }

/* Corner profile icon: gold ring around it */
.profile-chip {
  background: rgba(8,14,11,0.55) !important;
  border: 2px solid var(--gold, #c9a961) !important;
  box-shadow: 0 0 0 1px rgba(201,169,97,0.25), 0 3px 12px rgba(0,0,0,0.45) !important;
  border-radius: 50% !important;
  overflow: hidden !important;
}
.profile-chip #profile-avatar, .profile-chip .profile-avatar { background: transparent !important; border-radius: 50% !important; }
.profile-chip #profile-avatar img, .profile-chip .profile-avatar img { background: transparent !important; border-radius: 50% !important; }

/* Feed clean-up: gold lead emphasis (no green/red), plain scores, breathing room under gold line */
.feed-ps2.lead { color: #e1c47e !important; font-weight: 800 !important; }
#tab-feed .feed-list { margin-top: 11px; }

/* Rivalry expanded card grids: 3 exciting boxes (first open) + rich whole-rivalry grid */
.rv-exp-stats.rv3 { display: grid !important; grid-template-columns: repeat(3, 1fr) !important; gap: 8px; margin: 10px 0 12px; }
.rv-exp-stats.rv2col { display: grid !important; grid-template-columns: repeat(2, 1fr) !important; gap: 8px; margin: 10px 0 14px; }
@media (min-width: 520px) { .rv-exp-stats.rv2col { grid-template-columns: repeat(3, 1fr) !important; } }
.rv-exp-stats.rv3 .rv-exp-cell, .rv-exp-stats.rv2col .rv-exp-cell { background: linear-gradient(180deg, rgba(5,18,14,0.50), rgba(3,12,10,0.36)); border: 1px solid rgba(207,166,83,0.28); border-radius: 10px; padding: 10px 8px; text-align: center; }
.rv-exp-stats.rv3 .rv-exp-v, .rv-exp-stats.rv2col .rv-exp-v { font-family: Georgia, serif; font-size: 15px; color: #fff; line-height: 1.14; }
.rv-exp-stats.rv3 .rv-exp-l, .rv-exp-stats.rv2col .rv-exp-l { font-size: 8.5px; letter-spacing: 0.06em; color: var(--fr-gold, #c9ab59); text-transform: uppercase; margin-top: 3px; }


/* Scorecard fill — reinforce the whole container chain (bulletproof) */
#r-input-hbh, #r-input-total, #r-hbh-scorecard { width: 100% !important; max-width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; box-sizing: border-box !important; }
#r-hbh-scorecard .rwz-sc-grid.winnerN,
.rwz-scorecard .rwz-sc-grid.winnerN { width: 100% !important; margin-left: auto !important; margin-right: auto !important; }

/* Rivalry Insights — sections, story, bets line */
.rv-sec-h { font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--fr-gold, #c9ab59); font-weight: 800; margin: 16px 0 8px; padding-bottom: 5px; border-bottom: 1px solid rgba(201,171,89,0.18); }
.rv-dims { display: flex; flex-direction: column; gap: 5px; margin: 2px 0 4px; }
.rv-dims .rv-dim { flex: 0 0 auto !important; width: 100%; display: flex !important; flex-direction: row !important; justify-content: space-between; align-items: center; gap: 10px; background: rgba(7,12,9,0.5); border: 1px solid rgba(201,171,89,0.12); border-radius: 9px; padding: 8px 11px; }
.rv-dims .rv-dim-l { font-size: 12px !important; color: #cfc7b4 !important; text-transform: none !important; letter-spacing: 0 !important; }
.rv-dims .rv-dim-v { font-size: 12px !important; color: #fff !important; font-weight: 700; text-align: right; white-space: nowrap; }
.rv-dim-l { font-size: 12px; color: #cfc7b4; }
.rv-dim-v { font-size: 12px; color: #fff; font-weight: 700; text-align: right; white-space: nowrap; }
.rv-dim-note { font-size: 12px; color: #9a937f; line-height: 1.5; background: rgba(7,12,9,0.5); border: 1px dashed rgba(201,171,89,0.2); border-radius: 9px; padding: 10px 12px; }
.rv-bets-line { display: flex; align-items: center; gap: 7px; font-size: 12.5px; color: #ece3cd; font-weight: 600; background: rgba(201,171,89,0.08); border: 1px solid rgba(201,171,89,0.2); border-radius: 10px; padding: 8px 11px; margin: 2px 0 10px; }
.rv-bets-ic { font-size: 14px; }
.rv-story { display: flex; flex-direction: column; gap: 8px; }
.rv-story-h { color: var(--fr-gold-bright, #e6cf8a) !important; }
.rv-story-line { font-family: Georgia, serif; font-style: italic; font-size: 14px; line-height: 1.5; color: #f1e8d2; background: linear-gradient(160deg, rgba(201,171,89,0.10), rgba(201,171,89,0.03)); border-left: 2px solid var(--fr-gold, #c9ab59); border-radius: 0 10px 10px 0; padding: 10px 13px; }

/* SCORECARD PATCH 2026-07-24: sirkelringene rundt scoreverdier er FJERNET.
   Tall bruker samme grunnfarge, baseline og typografi som ovrige scorekortverdier. */
.rwz-sc-grid.winnerN { overflow-x: auto !important; overflow-y: visible !important; }

/* ============================================================
   DESKTOP = MOBILE VIEW — render the app in a centered phone-width
   column on any screen wider than a phone, so web matches mobile.
   ============================================================ */
@media (min-width: 481px) {
  html, body { background: #0e1812 !important; }
  .app {
    max-width: 430px !important; width: 430px !important; margin: 0 auto !important;
    position: relative !important; overflow: clip !important; min-height: 100dvh;
    box-shadow: 0 0 0 1px rgba(201,169,97,0.15), 0 24px 90px rgba(0,0,0,0.7) !important;
  }
  /* keep all full-bleed backgrounds / veils / the gold line inside the phone column */
  .clubhouse-bg, .teeoff-hero-bg, #tab-feed::before,
  header::before, header::after, .tabs-wrap::before, .tabs-wrap::after,
  .fgl-coming-img, body::after, body::before {
    left: 50% !important; right: auto !important;
    width: 430px !important; max-width: 430px !important;
    transform: translateX(-50%) !important;
    margin-left: 0 !important; margin-right: 0 !important;
  }
  /* corner profile button sits at the column's top-right */
  .profile-chip { right: calc(50% - 215px + 10px) !important; }
}

/* FIX: Tee Off scorecard stepper was spread edge-to-edge (space-evenly on a too-wide
   column). Make it a tight, centered −[n]+ control, and center the columns. */
.rwz-sc-row.winnerN .win-pcell .rwz-step {
  width: auto !important; max-width: 132px !important; margin: 0 auto !important;
  justify-content: center !important; gap: 9px !important;
}
.rwz-sc-row.winnerN .rwz-sc-parcell .par-step {
  width: auto !important; max-width: 96px !important; margin: 0 auto !important;
  justify-content: center !important; gap: 5px !important;
}
.rwz-sc-head.winnerN, .rwz-sc-row.winnerN { justify-content: center !important; }

/* Feed scorecard: circles (green under par, red over par) + horizontal scroll for all holes */
.fsc2-box { overflow-x: auto !important; -webkit-overflow-scrolling: touch; }
.fsc2 { width: max-content !important; min-width: 100%; }
.fsc2-s { width: 18px !important; height: 18px !important; min-width: 18px; }
.fsc2-s.p { border: 1.4px solid transparent !important; color: #d8d0bb !important; }
.fsc2-s.b { border: 1.4px solid #5dcaa5 !important; color: #a6e0c8 !important; }
.fsc2-s.o { border: 1.4px solid #d67878 !important; color: #ecaaaa !important; }
.fsc2-s.o2 { border: 1.4px solid #d67878 !important; background: rgba(214,120,120,0.16) !important; color: #ecaaaa !important; }

/* Clubhouse bg: window positioned behind the header, plate just under the gold line */
.clubhouse-bg, body::after { background-size: auto 165% !important; background-position: center 26% !important; }

/* ============================================================
   ROOT-CAUSE LAYOUT FIXES + clubhouse/feed/rivalry/header
   ============================================================ */

/* 1) Nothing may ever extend past the screen width (kills full-bleed overflow,
      stops gold lines / 100vw elements from sticking out left or right). */
html, body { overflow-x: clip !important; max-width: 100% !important; }

/* 2) Clubhouse bg: less zoom, window behind the header, plate under the gold line */
.clubhouse-bg, body::after { background-size: auto 150% !important; background-position: center 38% !important; }

/* 3) Feed scorecard: the left label column (HOLE / PAR / player names) must be
      SOLID + pinned, so horizontal scrolling never shows the background through text */
.fsc2-lbl {
  position: sticky !important; left: 0 !important; z-index: 4 !important;
  background: #0e1410 !important; padding-right: 6px !important;
}
.fsc2-box { background: rgba(14,20,16,0.96) !important; }

/* 4) Header brand logo a little bigger */
header .brand .monogram { width: 58px !important; height: 58px !important; }

/* 5) Profile icon: thin gold ring (house style) */
.profile-chip { border: 1.5px solid var(--gold, #c9a961) !important; box-shadow: 0 0 0 1px rgba(201,169,97,0.2), 0 3px 12px rgba(0,0,0,0.4) !important; }


/* Rivalry bg: new image, starts at top behind header, full width, fades to black at the bottom */
.rivalry-hero-bg {
  position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; bottom: auto !important;
  width: 100% !important; height: 1100px !important; min-height: 0 !important; transform: none !important; z-index: 0 !important;
  background: #000 url('rivalry-bg.jpg?v=9') top center / 100% auto no-repeat !important;
  background-color: #000 !important;
}
/* Svart plate fjernet (korrigering 2026-07-23): bakgrunnsbildet skal synes. */
#tab-rivalry { background: transparent !important; }
#tab-rivalry > *:not(.rivalry-hero-bg) { position: relative !important; z-index: 1 !important; }

/* Gold-line dividers must match the CONTENT width, never stick out past the boxes.
   (They were sized to the full column incl. app padding → overhang on both sides.) */
.tabs-wrap::after {
  left: 0 !important; right: 0 !important; width: 100% !important; max-width: 100% !important;
  transform: none !important; margin-left: 0 !important; margin-right: 0 !important;
}

/* Scorecard: smaller score + ± buttons so they don't fill the whole card */
.rwz-sc-grid.winnerN[data-pc="1"] .win-pcell .rwz-step-btn { width: 32px !important; height: 32px !important; font-size: 17px !important; }
.rwz-sc-grid.winnerN[data-pc="1"] .win-pcell .rwz-step-val { font-size: 18px !important; min-width: 30px !important; }
.rwz-sc-grid.winnerN[data-pc="1"] .rwz-step-val.set { width: 30px !important; height: 30px !important; min-width: 30px !important; }
.rwz-sc-grid.winnerN[data-pc="2"] .win-pcell .rwz-step-btn { width: 27px !important; height: 29px !important; font-size: 15px !important; }
.rwz-sc-grid.winnerN[data-pc="2"] .win-pcell .rwz-step-val { font-size: 15px !important; }
.rwz-sc-grid.winnerN[data-pc="2"] .rwz-step-val.set { width: 25px !important; height: 25px !important; min-width: 25px !important; }
.rwz-step-val[onclick] { cursor: pointer; }

/* Clubhouse bg: image starts at the very top of the screen (behind header), least zoom */
.clubhouse-bg, body::after { background-size: cover !important; background-position: center top !important; }


/* Match Play: "match won — play it out?" banner */
.rwz-match-won { margin: 0 0 10px; padding: 12px 14px; border-radius: 12px; text-align: center;
  background: linear-gradient(160deg, rgba(201,169,97,0.22), rgba(201,169,97,0.06)); border: 1px solid rgba(201,169,97,0.45);
  box-shadow: 0 0 18px rgba(201,169,97,0.12); }
.rwz-mw-title { font-family: Georgia, serif; font-weight: 800; font-size: 15px; color: #f1e8d2; letter-spacing: 0.01em; }
.rwz-mw-sub { font-size: 12.5px; color: #cfc7b2; margin-top: 3px; }
.rwz-mw-actions { display: flex; gap: 8px; margin-top: 10px; }
.rwz-mw-btn { flex: 1; padding: 9px 10px; border-radius: 10px; font-family: inherit; font-weight: 800; font-size: 12.5px; cursor: pointer; border: 1px solid rgba(201,169,97,0.4); }
.rwz-mw-btn.play { background: linear-gradient(180deg, #e4c97a, #c9a961); color: #1a1407; border: none; }
.rwz-mw-btn.done { background: rgba(255,255,255,0.04); color: #cfc7b2; }

.rwz-sc-hcnote { text-align:center; font-size:10.5px; color: var(--muted); letter-spacing:0.02em; margin:6px 0 2px; opacity:0.85; }

/* Nassau — three-match standings + dimmed back 9 */
.rwz-nassau-bar { margin: 4px auto 10px; max-width: 560px; background: rgba(201,169,97,0.06); border: 1px solid rgba(201,169,97,0.30); border-radius: 12px; padding: 8px 10px 10px; }
.rwz-nassau-title { text-align:center; font-size:10px; letter-spacing:0.18em; color: var(--gold); opacity:0.9; margin-bottom:7px; }
.rwz-nassau-cells { display:grid; grid-template-columns: 1fr 1fr 1fr; gap:7px; }
.rwz-nas-cell { display:flex; flex-direction:column; align-items:center; gap:3px; padding:7px 4px; background: rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.06); border-radius:9px; text-align:center; }
.rwz-nas-cell.me { border-color: rgba(126,181,154,0.45); background: rgba(126,181,154,0.10); }
.rwz-nas-cell.opp { border-color: rgba(166,69,69,0.40); background: rgba(166,69,69,0.10); }
.rwz-nas-cell.as { border-color: rgba(201,169,97,0.40); }
.rwz-nas-cell.locked { opacity:0.5; }
.rwz-nas-lbl { font-size:9.5px; letter-spacing:0.10em; text-transform:uppercase; color: var(--muted); }
.rwz-nas-val { font-size:12.5px; font-weight:700; color: var(--text); }
.rwz-sc-row.nassau-dim { opacity:0.34; pointer-events:none; filter:grayscale(0.3); }

/* Team Play — assignment + team standings */
.rwz-team-assign { display:flex; align-items:center; justify-content:center; gap:12px; margin:10px auto 4px; max-width:560px; flex-wrap:wrap; }
.rwz-ta-row { display:flex; align-items:center; gap:8px; }
.rwz-ta-tag { font-size:9.5px; letter-spacing:0.12em; font-weight:700; padding:3px 8px; border-radius:6px; }
.rwz-ta-tag.a { color:#0f1611; background: var(--accent-bright); }
.rwz-ta-tag.b { color:#1a0e0e; background: var(--tension-bright); }
.rwz-ta-names { font-size:13px; color: var(--text); font-weight:600; }
.rwz-ta-vs { font-size:11px; color: var(--muted); letter-spacing:0.1em; }
.rwz-team-cells { display:flex; align-items:center; justify-content:center; gap:12px; }
.rwz-tb-cell { flex:1; display:flex; flex-direction:column; align-items:center; gap:2px; padding:8px 6px; background: rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.07); border-radius:10px; }
.rwz-tb-cell.lead { border-color: rgba(201,169,97,0.55); background: rgba(201,169,97,0.10); }
.rwz-tb-n { font-size:11px; color: var(--text-2); font-weight:600; text-align:center; }
.rwz-tb-v { font-size:20px; font-weight:800; color: var(--text); }
.rwz-tb-vs { font-size:13px; color: var(--muted); }
#rwz-team-format-grid .rnd-score-btn.active { border-color: var(--gold) !important; }

/* ===== Batch: rivalry bg full, feed gold result, gold ring, box height, setup compaction, team chips ===== */
/* 5) Rivalry background: stretch from top (behind header) all the way down */
.rivalry-hero-bg { position:fixed !important; top:0 !important; left:0 !important; right:0 !important; bottom:0 !important; width:100% !important; height:100% !important; min-height:100dvh !important; transform:none !important; z-index:0 !important; background:linear-gradient(180deg, rgba(0,0,0,0) 18%, rgba(0,0,0,0.18) 42%, rgba(0,0,0,0.5) 62%, rgba(0,0,0,0.82) 78%, #000 90%), #000 url('rivalry-bg.jpg?v=9') center top / cover no-repeat !important; }
@media (min-width:481px){ .rivalry-hero-bg { left:50% !important; right:auto !important; width:430px !important; transform:translateX(-50%) !important; } }
#tab-rivalry { position:relative !important; background:transparent !important; }

/* 7) Feed match result — bigger, shiny gold */
.feed-rsub2.winline { font-size:16px !important; font-weight:800 !important; background:linear-gradient(180deg,#f7e6ad 0%,#e1c47e 40%,#c9a961 60%,#8a7340 100%) !important; -webkit-background-clip:text !important; background-clip:text !important; -webkit-text-fill-color:transparent !important; color:#e1c47e; letter-spacing:0.01em; line-height:1.15; }

/* 9) Scorecard numbers neutral; hole winner gets a gold ring */
.rwz-sc-grid .rwz-step-val.hole-win { border-color: var(--gold,#c9a961) !important; box-shadow: 0 0 0 2px var(--gold,#c9a961), 0 0 10px rgba(201,169,97,0.45) !important; color: var(--gold-bright,#e1c47e) !important; }

/* 10) Clubhouse stat boxes 0.4cm taller when there is no resume round */
body:not(.ch-has-resume) #tab-dashboard .ch-wall-tile { padding-top:calc(10px + 0.4cm/2) !important; padding-bottom:calc(10px + 0.4cm/2) !important; }

/* 4) Tee Off setup — tighter so it fits one screen (all formats) */
#rwz-step-1 .rwz-step-title { margin-bottom:8px !important; }
#rwz-step-1 .rnd-rank-label { margin:8px 0 6px !important; }
.rnd-score-wrap-setup { margin:8px 0 !important; }
.rnd-score-wrap-setup .rnd-score-grid { gap:7px !important; }
.rnd-score-wrap-setup .rnd-score-btn { padding:9px 11px !important; }
.rnd-score-wrap-setup .rnd-score-desc { font-size:11px !important; line-height:1.35 !important; }
.rwz-holeset-wrap { margin-top:8px !important; }
.rwz-players-grid { gap:8px !important; }
.rnd-hcp-slim { margin-top:8px !important; }

/* 2) Team colour chips on player cards */
.rwz-pslot { position:relative; }
.rwz-team-chip { position:absolute; top:6px; left:6px; width:22px; height:22px; border-radius:50%; border:1.5px solid rgba(255,255,255,0.25); font-size:11px; font-weight:800; color:#fff; cursor:pointer; z-index:4; display:flex; align-items:center; justify-content:center; padding:0; }
.rwz-team-chip.a { background:#c25a5a; }
.rwz-team-chip.b { background:#5a9276; }

/* J) Gold line under header stretches to the column edges (break out of app's 22px padding) */
.tabs-wrap::after { left:-22px !important; right:-22px !important; width:calc(100% + 44px) !important; max-width:none !important; transform:none !important; margin-left:0 !important; margin-right:0 !important; }
/* H) Feed scorecard: hole winner gets a gold ring (colours kept) */
.fsc2-s.hole-win { box-shadow:0 0 0 2px var(--gold,#c9a961), 0 0 7px rgba(201,169,97,0.5) !important; border-radius:50% !important; }

/* Feed card restructured: centered headline, meta row, score sub-line, gold scorecard frame */
.feed-headline2 { text-align:center; font-size:20px; font-weight:800; line-height:1.15; margin:2px 0 10px; background:linear-gradient(180deg,#f7e6ad 0%,#e1c47e 40%,#c9a961 62%,#8a7340 100%); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:#e1c47e; }
.feed-headline2.team { font-size:15px; }
.feed-meta2 { display:flex; justify-content:space-between; align-items:flex-start; gap:10px; margin-bottom:10px; }
.feed-meta-l .feed-crs2 { font-size:13px; color:var(--text); font-weight:600; }
.feed-meta-l .feed-tm2 { font-size:11px; color:var(--muted); margin-top:1px; }
.feed-meta-r { font-size:10px; letter-spacing:0.13em; color:var(--gold,#c9a961); text-transform:uppercase; font-weight:700; text-align:right; padding-top:2px; white-space:nowrap; }
.feed-pssub2 { font-size:10.5px; color:var(--muted); margin-top:2px; letter-spacing:0.02em; }
.feed-card2 .fsc2-box { border:1px solid rgba(201,169,97,0.55) !important; border-radius:12px !important; padding:8px !important; box-shadow:0 0 0 1px rgba(201,169,97,0.12) inset; }

/* Bets — premium gold */
.rnd-bets { border:1px solid rgba(201,169,97,0.35) !important; border-radius:12px; background:linear-gradient(180deg, rgba(201,169,97,0.08), rgba(201,169,97,0.02)); padding:0 10px; margin-top:8px; }
.rnd-bets > summary { color: var(--gold-bright,#e1c47e) !important; font-weight:700; letter-spacing:0.02em; }
.rnd-bets > summary span { color: var(--gold-dim,#7a6740) !important; }
/* Tee Off Course step — tighter so Setup + Course fit one screen */
#rwz-step-2 .rnd-row { margin-bottom:8px !important; }
#rwz-step-2 .rnd-cond, #rwz-step-2 details { margin:6px 0 !important; }
#rwz-step-2 .rnd-cond > summary { padding:7px 0 !important; }
#rwz-step-2 .rwz-step-title { margin-bottom:8px !important; }
#r-cart-wrap { padding:9px 12px !important; }

/* ===== Premium pass: avatars, scorecard uniformity, modals, trophies ===== */
/* Avatars — solid dark fill so each shows ONE figure, no see-through/bleed */
.fr-av { background: radial-gradient(circle at 50% 40%, #16241b, #0b130e) !important; }
.fr-av img, .pc-avatar img, .feed-av img, .p-av-opt img { object-fit: contain !important; object-position: center !important; }
.pc-avatar, .profile-chip #profile-avatar { background: radial-gradient(circle at 50% 40%, #16241b, #0b130e) !important; overflow: hidden; border-radius: 50%; }
.p-av-opt { background: radial-gradient(circle at 50% 40%, #16241b, #0b130e) !important; border-radius: 50% !important; overflow: hidden; display: grid !important; place-items: center !important; padding: 8px !important; }

/* Scorecard — uniform sizes when solo (was oversized), content stays inside cells */
.rwz-sc-cell { overflow: hidden; }
.rwz-sc-grid.winnerN[data-pc="1"] .win-pcell .rwz-step-btn { width: 34px !important; height: 34px !important; font-size: 18px !important; }
.rwz-sc-grid.winnerN[data-pc="1"] .win-pcell .rwz-step-val { font-size: 18px !important; min-width: 30px !important; }
.rwz-sc-grid.winnerN[data-pc="1"] .par-step .rwz-step-val { font-size: 18px !important; }
.rwz-sc-grid.winnerN[data-pc="1"] .rwz-sc-cell.hole { font-size: 18px !important; }
.rwz-sc-stat[data-pc="1"] .rwz-sc-stathead.big b { font-size: 34px !important; }

/* Premium modal — lightly transparent, dark, gold border */
.modal { background: rgba(13,20,15,0.93) !important; border: 1px solid rgba(201,169,97,0.42) !important; box-shadow: 0 24px 70px rgba(0,0,0,0.6), 0 0 0 1px rgba(201,169,97,0.10) inset !important; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); border-radius: 18px !important; }
.modal-bg { background: rgba(3,8,5,0.62) !important; -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px); }

/* Trophies — dark transparent premium tiles */
#tab-trophies .trophy-card, #tab-trophies .tr-card, .trophy-tile { background: rgba(13,20,15,0.66) !important; border: 1px solid rgba(201,169,97,0.22) !important; }
#tab-trophies .trophy-card.locked, .trophy-tile.locked { opacity: 0.55; }

/* Breakscore — 4 premium horizontal bars */
.bs-card { padding: 12px 14px !important; }
.breakscore { display:flex; flex-direction:column; gap:8px; }
.bs-title { font-size:10px; letter-spacing:0.18em; color:var(--gold,#c9a961); font-weight:700; margin-bottom:2px; }
.bs-row { display:grid; grid-template-columns: 62px 1fr 26px; align-items:center; gap:9px; }
.bs-lbl { font-size:11.5px; color:var(--text-2,#cfd8d3); font-weight:600; white-space:nowrap; }
.bs-bar { height:9px; border-radius:6px; background:rgba(255,255,255,0.06); overflow:hidden; box-shadow: inset 0 0 0 1px rgba(201,169,97,0.14); }
.bs-fill { display:block; height:100%; border-radius:6px; background:linear-gradient(90deg,#8a7340,#c9a961 55%,#f2dd9c); box-shadow:0 0 8px rgba(201,169,97,0.4); }
.bs-cnt { font-size:14px; font-weight:800; color:var(--gold-bright,#e1c47e); text-align:right; }
.bs-empty { font-size:11px; color:var(--muted); margin-top:2px; }

.hco-edit-link { display:inline-block; margin:2px auto 6px; background:none; border:none; color:var(--gold,#c9a961); font-size:12px; text-decoration:underline; cursor:pointer; font-family:inherit; }

/* Profile photo cropper */
.pc-crop-stage { position:relative; width:240px; height:240px; max-width:70vw; max-height:70vw; margin:14px auto 0; border-radius:50%; overflow:hidden; background:#0b130e; touch-action:none; cursor:grab; }
.pc-crop-stage:active { cursor:grabbing; }
.pc-crop-stage img { position:absolute; left:50%; top:50%; user-select:none; -webkit-user-drag:none; }
.pc-crop-ring { position:absolute; inset:0; border-radius:50%; box-shadow: inset 0 0 0 2px rgba(201,169,97,0.75); pointer-events:none; }
#pc-crop-zoom { accent-color: var(--gold,#c9a961); }

/* Rounds — premium clean card-rows + Trophies premium tiles */
#tab-rounds table { border-collapse: separate !important; border-spacing: 0 6px !important; }
#tab-rounds thead th { color: var(--gold,#c9a961) !important; font-size:10px !important; letter-spacing:0.12em !important; text-transform:uppercase !important; border:none !important; }
#tab-rounds tbody tr.row-clickable td { background: rgba(13,20,15,0.6) !important; border-top:1px solid rgba(201,169,97,0.14) !important; border-bottom:1px solid rgba(201,169,97,0.14) !important; padding:12px 10px !important; }
#tab-rounds tbody tr.row-clickable td:first-child { border-left:1px solid rgba(201,169,97,0.14) !important; border-radius:10px 0 0 10px !important; }
#tab-rounds tbody tr.row-clickable td:last-child { border-right:1px solid rgba(201,169,97,0.14) !important; border-radius:0 10px 10px 0 !important; }
#tab-rounds tbody tr.row-clickable:active td { background: rgba(201,169,97,0.10) !important; }
.trophy-card { background: rgba(13,20,15,0.62) !important; border:1px solid rgba(201,169,97,0.22) !important; border-radius:14px !important; }
.trophy-card.earned { box-shadow: 0 0 0 1px rgba(201,169,97,0.18) inset, 0 8px 22px rgba(0,0,0,0.35) !important; }
.trophy-card.locked { opacity:0.5 !important; }

/* Breakscore card on Clubhouse (replaces Current Form) */
.ch-bs-wrap { margin-top:10px; padding:14px 16px; border-radius:16px;
  background:linear-gradient(160deg, rgba(28,40,34,0.72), rgba(14,22,18,0.72));
  border:1px solid rgba(201,169,97,0.28); box-shadow:0 2px 14px rgba(0,0,0,0.28); }
.ch-bs-wrap .breakscore { gap:9px; }
.ch-bs-wrap .bs-row { display:flex; align-items:center; gap:10px; }
.ch-bs-wrap .bs-lbl { font-size:11px; letter-spacing:0.06em; color:var(--muted,#9aa); min-width:62px; }
.ch-bs-wrap .bs-bar { flex:1; height:9px; border-radius:6px; background:rgba(255,255,255,0.07); overflow:hidden; }
.ch-bs-wrap .bs-cnt { font-size:12px; color:var(--gold-bright,#e1c47e); min-width:20px; text-align:right; font-weight:600; }

/* ===== Premium iOS/Android "Add to Home Screen" coach (transparent glass) ===== */
.install-coach {
  background: rgba(6,11,8,0.44) !important;
  -webkit-backdrop-filter: blur(14px) saturate(1.05);
  backdrop-filter: blur(14px) saturate(1.05);
  padding: 22px !important;
}
.ic-card.ic-premium {
  background: linear-gradient(165deg, rgba(32,45,37,0.78), rgba(12,20,16,0.82)) !important;
  -webkit-backdrop-filter: blur(24px) saturate(1.15);
  backdrop-filter: blur(24px) saturate(1.15);
  border: 1px solid rgba(201,169,97,0.40) !important;
  border-radius: 22px !important;
  padding: 20px 20px 18px !important;
  max-width: 372px !important;
  box-shadow: 0 24px 70px rgba(0,0,0,0.55), inset 0 1px 0 rgba(247,236,192,0.14) !important;
}
.ic-head { display:flex; align-items:center; gap:13px; margin-bottom:12px; }
.ic-appicon {
  width:52px; height:52px; border-radius:14px; flex:0 0 auto;
  background:#000; display:flex; align-items:center; justify-content:center; overflow:hidden;
  border:1px solid rgba(201,169,97,0.45); box-shadow:0 4px 16px rgba(0,0,0,0.45);
}
.ic-appicon img { width:100%; height:100%; object-fit:cover; }
.ic-eyebrow { font-size:10px; letter-spacing:0.20em; color:var(--gold,#c9a961); font-weight:700; margin-bottom:3px; }
.ic-card .ic-title { margin:0 !important; font-size:19px; line-height:1.2; color:var(--text,#f4efe4); }
.ic-sub { margin:0 0 6px; font-size:13.5px; line-height:1.5; color:var(--muted,#b9b39c); }
.ic-steps { margin-top:6px !important; }
.ic-steps li { padding-top:12px; padding-bottom:12px; }
.ic-glyph {
  width:19px; height:19px; vertical-align:-4px; margin:0 2px;
  color:var(--gold-bright,#e1c47e);
  display:inline-block; padding:2px; border-radius:6px;
  background:rgba(201,169,97,0.14); box-shadow:inset 0 0 0 1px rgba(201,169,97,0.30);
}
.ic-done { border-radius:13px !important; font-size:15px !important; letter-spacing:0.02em; }

/* ===== Clubhouse restructure: Record full-width -> summary -> nav row -> 8 tiles 4x2 -> breakscore ===== */
.ch-top-card { display:block !important; grid-template-columns:none !important; padding:12px 14px !important; }
.ch-top-record { text-align:center; padding:2px 0; }
.ch-rc-label { font-size:11px; letter-spacing:0.24em; text-transform:uppercase; color:var(--gold-dim,#7a6740); }
.ch-rc-value { font-family:Georgia,serif; font-size:50px; font-weight:700; color:#fff; line-height:1.02; margin:2px 0; }
.ch-rc-sub { font-size:12px; color:var(--muted,#b9b39c); }
.ch-summary { text-align:center; font-size:12.5px; line-height:1.5; color:var(--muted,#b9b39c); margin:9px auto 14px; max-width:340px; }
/* nav choices all on one row (Rounds .. HC) */
.ch-top-card .ch-qn { margin:0 !important; }
.ch-top-card .ch-qn-grid { display:grid !important; grid-template-columns:repeat(6,1fr) !important; gap:6px !important; }
.ch-top-card .ch-qn-grid button { flex:none !important; padding:9px 2px !important; font-size:9.5px !important; gap:4px !important; }
.ch-top-card .ch-qn-grid .ch-qn-i { width:18px !important; height:18px !important; }
@media (max-width:400px){ .ch-top-card .ch-qn-grid { gap:4px !important; } .ch-top-card .ch-qn-grid button { font-size:8.5px !important; padding:8px 1px !important; } }
/* 8 stat tiles: 4 per row, 2 rows */
.ch-stat4 { display:grid !important; grid-template-columns:repeat(4,1fr) !important; gap:7px !important; }
.ch-stat4 .ch-wall-tile { padding:9px 5px !important; }
.ch-stat4 .ch-wall-eyebrow-s { font-size:7.5px !important; letter-spacing:0.08em !important; }
.ch-stat4 .ch-wall-num-s { font-size:14px !important; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ch-stat4 .ch-wall-sub { font-size:8px !important; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
@media (max-width:360px){ .ch-stat4 .ch-wall-num-s { font-size:12.5px !important; } }

/* ===== Android/Samsung sharpness parity ===== */
/* System font stack renders far crisper on Android than serif fallback (headings keep explicit Georgia) */
body { font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; text-rendering: optimizeLegibility; }
/* Heavier weight on small + gold text so it stays crisp on Android */
.ch-rc-label, .ch-rc-sub, .ch-wall-eyebrow-s, .ch-wall-sub, .section-eyebrow, .stat-label,
.ic-eyebrow, .bs-lbl, .bs-title, .ch-summary, .eyebrow, .card-eyebrow { font-weight: 500 !important; }
.ch-wall-num-s, .bs-cnt { font-weight: 600 !important; }
/* Reduce heavy blur/transparency over text (grey/muddy on Samsung) — more solid surfaces */
.ic-card.ic-premium { -webkit-backdrop-filter: blur(10px) !important; backdrop-filter: blur(10px) !important;
  background: linear-gradient(165deg, rgba(26,38,31,0.94), rgba(10,17,13,0.96)) !important; }
.install-coach { -webkit-backdrop-filter: blur(6px) !important; backdrop-filter: blur(6px) !important;
  background: rgba(6,11,8,0.62) !important; }
.modal { -webkit-backdrop-filter: blur(6px) !important; backdrop-filter: blur(6px) !important; background: rgba(13,20,15,0.97) !important; }

/* ===== Tee Off: no hero text, 4 bigger cards fill the screen ===== */
.teeoff-entry { display:flex; flex-direction:column; }
.teeoff-cards { flex:1; grid-auto-rows: 1fr; align-content: stretch; gap:10px !important; }
.teeoff-card { height:100% !important; min-height:0; }
.teeoff-card-img { height:100% !important; width:100% !important; object-fit: cover !important; object-position:center; border-radius:16px !important; }
.teeoff-continue { margin-top:12px !important; flex:0 0 auto; }

/* ===== Clubhouse 8 stat tiles: 4 per row must FIT within screen ===== */
.ch-stat4 { grid-template-columns: repeat(4, minmax(0,1fr)) !important; gap:5px !important; }
.ch-stat4 .ch-wall-tile { min-width:0 !important; padding:8px 4px !important; }
.ch-stat4 .ch-wall-num-s { font-size:13px !important; }
.ch-stat4 .ch-wall-eyebrow-s { font-size:7px !important; letter-spacing:0.04em !important; }
.ch-stat4 .ch-wall-sub { font-size:7.5px !important; }
@media (max-width:360px){ .ch-stat4 { gap:4px !important; } .ch-stat4 .ch-wall-num-s { font-size:12px !important; } }

/* ===== Scorecard — aktivt hull, delt talltypografi, kompakt oppsummering ===== */
/* Delt typografi: samme talltype = samme storrelse/vekt/linjehoyde overalt */
.rwz-scorecard .rwz-sc-cell.hole, .rwz-scorecard .rwz-step-val, .rwz-scorecard .rwz-sc-ro,
.rwz-scorecard .rwz-sc-parro, .rwz-sc-stathead b, .rwz-sc-stattot, .rwz-hc-extra,
.rwz-sc-stathc { font-variant-numeric: tabular-nums; }
.rwz-scorecard .rwz-sc-cell.hole { font-size: 13px; font-weight: 600; line-height: 1.2; }
.rwz-scorecard .rwz-sc-parro { font-size: 12.5px; font-weight: 500; line-height: 1.2; color: #cfc9ba; }
.rwz-scorecard .rwz-sc-ro { display: inline-block; min-width: 24px; text-align: center; font-size: 14px; font-weight: 600; line-height: 1.25; color: #efe9da; }
.rwz-scorecard .rwz-sc-ro.unset { color: #8b877b; font-weight: 400; }
.rwz-scorecard .rwz-step-val { font-size: 14px; font-weight: 600; line-height: 1.25; }
/* Inaktive rader er kompakte og klikkbare */
.rwz-sc-row { min-height: 30px; cursor: pointer; }
.rwz-sc-row.rwz-active { cursor: default; }
/* Aktiv rad: Fairway-uttrykk — tydelig gullkant + svak gyllen flate, markant hullnummer */
.rwz-sc-row.rwz-active {
  position: relative; border-radius: 8px;
  background: linear-gradient(180deg, rgba(201,169,97,0.16), rgba(201,169,97,0.05));
  box-shadow: inset 0 0 0 1px rgba(212,178,94,0.6), 0 0 10px rgba(201,169,97,0.10);
}
.rwz-sc-row.rwz-active .rwz-sc-cell.hole { color: var(--gold-bright, #e1c47e); font-weight: 700; }
.rwz-sc-row.rwz-active .rwz-step-val { color: #f7f2e6; }
.rwz-sc-row:not(.rwz-active):focus-visible { outline: 2px solid var(--gold, #c9a961); outline-offset: -2px; border-radius: 8px; }
/* Aktiv rad: steppere skal fa plass i smale kolonner (3-4 spillere) */
.rwz-sc-row.rwz-active .rwz-step { display: inline-flex; align-items: center; justify-content: center; max-width: 100%; }
.rwz-sc-grid[data-pc="3"] .rwz-sc-row.rwz-active .win-pcell .rwz-step,
.rwz-sc-grid[data-pc="4"] .rwz-sc-row.rwz-active .win-pcell .rwz-step { gap: 2px !important; }
.rwz-sc-grid[data-pc="3"] .rwz-sc-row.rwz-active .win-pcell .rwz-step > *,
.rwz-sc-grid[data-pc="4"] .rwz-sc-row.rwz-active .win-pcell .rwz-step > * { margin: 0 !important; }
.rwz-sc-grid[data-pc="3"] .rwz-sc-row.rwz-active .win-pcell .rwz-step-btn,
.rwz-sc-grid[data-pc="4"] .rwz-sc-row.rwz-active .win-pcell .rwz-step-btn { width: 18px !important; min-width: 18px !important; height: 24px !important; padding: 0 !important; box-sizing: border-box !important; }
.rwz-sc-grid[data-pc="3"] .rwz-sc-row.rwz-active .win-pcell .rwz-step-val,
.rwz-sc-grid[data-pc="4"] .rwz-sc-row.rwz-active .win-pcell .rwz-step-val { min-width: 18px !important; }
.rwz-sc-row.rwz-active .win-pcell { overflow: visible; }
.rwz-sc-grid[data-pc="3"] .rwz-sc-row.rwz-active .par-step,
.rwz-sc-grid[data-pc="4"] .rwz-sc-row.rwz-active .par-step { gap: 1px !important; }
.rwz-sc-grid[data-pc="3"] .rwz-sc-row.rwz-active .par-step > *,
.rwz-sc-grid[data-pc="4"] .rwz-sc-row.rwz-active .par-step > * { margin: 0 !important; }
.rwz-sc-grid[data-pc="3"] .rwz-sc-row.rwz-active .par-step .rwz-step-btn.sm,
.rwz-sc-grid[data-pc="4"] .rwz-sc-row.rwz-active .par-step .rwz-step-btn.sm { width: 13px !important; min-width: 13px !important; height: 22px !important; padding: 0 !important; box-sizing: border-box !important; }
.rwz-sc-grid[data-pc="3"] .rwz-sc-head > div, .rwz-sc-grid[data-pc="4"] .rwz-sc-head > div { font-size: 9.5px; letter-spacing: 0.02em; overflow: hidden; }

/* SOLO-oppsummering: ett kompakt kort — navn, stor total, en metriclinje */
.rwz-sc-stat.rwz-solo { display: block !important; text-align: center; padding: 10px 12px 9px !important; margin: 2px 0 6px !important; }
.rwz-solo-name { font-size: 12.5px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: #efe9da; }
.rwz-solo-total { font-family: 'Playfair Display', Georgia, serif; font-size: clamp(40px, 11vw, 48px); font-weight: 600; line-height: 0.95; color: #f7f2e6; font-variant-numeric: tabular-nums; margin: 2px 0 3px; }
.rwz-solo-metrics { font-size: 11.5px; font-weight: 500; line-height: 1; color: #cfc9ba; font-variant-numeric: tabular-nums; display: flex; align-items: center; justify-content: center; flex-wrap: wrap; }
.rwz-solo-sep { margin: 0 7px; color: rgba(207,166,83,0.55); }
.rwz-solo-playing { color: var(--gold-bright, #e1c47e); display: inline-flex; align-items: center; gap: 4px; }
.rwz-est-info-btn { background: none; border: 0; padding: 0 2px; color: var(--gold, #c9a961); font-size: 12px; line-height: 1; cursor: pointer; }
.rwz-est-info-btn:focus-visible { outline: 2px solid var(--gold, #c9a961); outline-offset: 2px; border-radius: 50%; }
.rwz-est-info { margin-top: 7px; font-size: 10.5px; line-height: 1.45; color: #b9b3a4; border-top: 1px solid rgba(207,166,83,0.16); padding-top: 6px; text-align: center; }
/* Steg 3 starter rett under stegindikatoren (overskriften er fjernet) */
#rwz-step-3 > #r-input-total, #rwz-step-3 > #r-input-hbh { margin-top: 6px !important; }
/* BETS: fire typer pa EN rad + kompakte valgte bets */
.bet-type-grid { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 6px !important; }
.bet-type-grid .stake-chip { width: 100%; min-width: 0; padding: 8px 4px !important; font-size: 12px !important; white-space: nowrap; text-align: center; }
.bet-type-grid .stake-chip:disabled { opacity: 0.45; cursor: default; }
.rwz-bet-solo { margin-top: 7px; font-size: 11px; color: #b9b3a4; text-align: center; }
.rwz-bet-list { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.rwz-bet-list:empty { display: none; }
.rwz-bet-chip { display: inline-flex; align-items: center; gap: 7px; border: 1px solid rgba(207,166,83,0.45); border-radius: 999px; padding: 5px 6px 5px 11px; background: rgba(201,169,97,0.10); cursor: pointer; }
.rwz-bet-txt { font-size: 11.5px; font-weight: 600; color: #efe9da; white-space: nowrap; }
.rwz-bet-txt i { font-style: italic; color: var(--gold, #c9a961); font-size: 10px; margin: 0 1px; }
.rwz-bet-x { width: 18px; height: 18px; border-radius: 50%; border: 1px solid rgba(207,166,83,0.4); background: none; color: var(--gold-bright, #e1c47e); font-size: 12px; line-height: 1; cursor: pointer; display: inline-grid; place-items: center; padding: 0; }
.rwz-bet-m-title { font-size: 12px; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; color: var(--gold-bright, #e1c47e); margin-bottom: 10px; }
.rwz-bet-opps { display: flex; flex-direction: column; gap: 7px; }
.rwz-bet-opp { width: 100%; text-align: left; border: 1px solid rgba(207,166,83,0.30) !important; }
.rwz-bet-opp.on { border-color: var(--gold) !important; background: rgba(201,169,97,0.16) !important; color: var(--gold-bright, #e1c47e) !important; }
.rwz-bet-m-err { margin-top: 8px; font-size: 11.5px; color: #d6a2a2; }

/* Ekspandert aktiv rad (3-4 spillere): en tydelig rad per spiller */
.rwz-sc-row.rwz-exp { display: block !important; padding: 8px 10px 6px; }
.rwz-exp-head { display: flex; align-items: center; gap: 7px; padding: 0 2px 6px; border-bottom: 1px solid rgba(207,166,83,0.18); margin-bottom: 4px; }
.rwz-exp-hole { font-size: 12px; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; color: var(--gold-bright, #e1c47e); }
.rwz-exp-dot { color: rgba(207,166,83,0.6); }
.rwz-exp-parbtn { background: none; border: 0; padding: 2px 4px; font-family: inherit; font-size: 12px; font-weight: 700; letter-spacing: 0.10em; text-transform: uppercase; color: #d8d2c2; cursor: pointer; }
.rwz-exp-editpar { margin-left: auto; background: rgba(201,169,97,0.08); border: 1px solid rgba(207,166,83,0.30); border-radius: 999px; color: var(--gold, #c9a961); font-family: inherit; font-size: 10px; font-weight: 600; padding: 4px 10px; cursor: pointer; }
.rwz-exp-head .par-step { margin-left: 2px; }
.rwz-exp-prow { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 5px 2px; }
/* Handicapslag som egen fast kolonne — aldri klippet av navnets ellipsis */
.rwz-exp-hcx { flex: 0 0 26px; text-align: left; font-size: 12px; font-weight: 700; color: var(--gold-bright, #e1c47e); }
.rwz-exp-hcx-empty::before { content: ''; }
.rwz-exp-prow + .rwz-exp-prow { border-top: 1px solid rgba(207,166,83,0.10); }
.rwz-exp-name { flex: 1 1 auto; min-width: 0; text-align: left; font-size: 13px; font-weight: 600; color: #efe9da; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rwz-exp-step { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 10px; }
.rwz-exp-step .rwz-step-btn { width: 38px !important; min-width: 38px !important; height: 32px !important; font-size: 17px; }
.rwz-exp-step .rwz-step-val { min-width: 26px; font-size: 16px !important; }
/* Spillerkortene: identisk hoyde og delt hierarki (navn > total > gross/net > Playing to) */
.rwz-sc-stat { align-items: stretch !important; }
.rwz-sc-statcol { display: flex; flex-direction: column; align-items: center; justify-content: flex-start; }
.rwz-sc-statnet { font-size: 10px; color: #cfc9ba; font-variant-numeric: tabular-nums; }
.rwz-sc-stathc { font-size: 9px !important; color: var(--gold, #c9a961); margin-top: 1px; }
/* Kompakt oppsummering over tabellen */
.rwz-sc-stat { padding: 6px 8px !important; margin: 6px 0 4px !important; gap: 6px !important; }
.rwz-sc-stat .rwz-sc-statname { font-size: 10px !important; }
.rwz-sc-stat .rwz-sc-stathead b { font-size: 17px !important; line-height: 1.05 !important; }
.rwz-sc-stat .rwz-sc-stattot { font-size: 10px !important; }
.rwz-sc-stat .rwz-sc-stathc { font-size: 9px !important; }
.rwz-sc-hcnote { margin: 2px 0 4px !important; font-size: 9.5px !important; }
/* Full scroll: siste rad + lagringsknapper skal kunne loftes over systemomradet */
#rwz-step-3 { padding-bottom: calc(14px + env(safe-area-inset-bottom, 0px)); }

/* Feed: markering av dyplenket post fra Clubhouse-stripen */
.feed-card2.feed-hl { outline: 2px solid rgba(212,178,94,0.85); outline-offset: 2px; box-shadow: 0 0 18px rgba(212,178,94,0.35); transition: box-shadow 0.4s ease; }

/* ===== Rivalry-redesign — periodevelger, featured rivalry, rivalkort, CTA ===== */
/* Lesbarhet over lyse himmelpartier i bakgrunnsbildet */
.rv-period { text-shadow: 0 1px 5px rgba(0,0,0,0.9); }
.rv-dash-hint { color: #cfc9ba; text-shadow: 0 1px 4px rgba(0,0,0,0.8); }


.rv-period { display: flex; align-items: center; justify-content: center; gap: 10px; margin: 2px 0 12px; }
.rv-p-btn { background: none; border: 0; padding: 6px 4px; font-family: inherit; font-size: 12px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: #e6e0d1; cursor: pointer; border-bottom: 2px solid transparent; text-shadow: 0 1px 5px rgba(0,0,0,0.9), 0 0 12px rgba(0,0,0,0.6); }
.rv-p-btn.on { color: var(--gold-bright, #e1c47e); border-bottom-color: #F2B70E; }
.rv-p-sep { color: rgba(207,166,83,0.5); font-size: 12px; }
.rv-featured { position: relative; border: 1px solid rgba(207,166,83,0.55); border-radius: 16px; padding: 14px 14px 12px; margin: 0 0 12px; text-align: center; cursor: pointer; background: linear-gradient(180deg, rgba(201,169,97,0.13), rgba(3,12,10,0.42)); box-shadow: 0 0 18px rgba(201,169,97,0.10), inset 0 1px 0 rgba(247,236,192,0.08); }
.rv-featured:focus-visible { outline: 2px solid var(--gold, #c9a961); outline-offset: 2px; }
.rv-f-eyebrow { font-size: 9.5px; letter-spacing: 0.24em; text-transform: uppercase; color: var(--gold, #c9a961); }
.rv-f-title { font-family: 'Playfair Display', Georgia, serif; font-size: 21px; color: #f3efeb; margin: 6px 0 8px; letter-spacing: 0.03em; }
.rv-f-title span { color: var(--gold, #c9a961); font-style: italic; font-size: 14px; }
.rv-f-recs { display: flex; justify-content: center; gap: 26px; margin-bottom: 7px; }
.rv-f-rec { display: flex; flex-direction: column; gap: 2px; }
.rv-f-rec .l { font-size: 8.5px; letter-spacing: 0.18em; text-transform: uppercase; color: #9a9483; }
.rv-f-rec b { font-family: Georgia, serif; font-size: 21px; color: var(--gold-bright, #e1c47e); font-variant-numeric: tabular-nums; }
.rv-f-verdict { font-size: 12.5px; font-weight: 700; color: #f3efeb; }
.rv-f-last { font-size: 10.5px; color: #9a9483; margin-top: 3px; }
.rv-av-ini { width: 100%; height: 100%; display: grid; place-items: center; font-size: 15px; font-weight: 700; color: var(--gold-bright, #e1c47e); background: radial-gradient(circle at 50% 40%, #16241b, #0b130e); }
.rv-c2-av { position: relative; }
.rv-live-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: #7ec8e3; box-shadow: 0 0 6px rgba(126,200,227,0.8); }
.rv-live-dot.av { position: absolute; right: 1px; bottom: 1px; border: 2px solid #0b130e; width: 10px; height: 10px; }
.rv-c2-badges { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 4px; }
.rv-badge { font-size: 8px; font-weight: 800; letter-spacing: 0.12em; color: var(--gold-bright, #e1c47e); border: 1px solid rgba(207,166,83,0.5); border-radius: 999px; padding: 2px 7px; text-transform: uppercase; }
.rv-badge.live { color: #7ec8e3; border-color: rgba(126,200,227,0.55); }
.rv-badge.wait { color: #e8c88a; border-color: rgba(232,200,138,0.5); }
.rv-newcta { border-style: dashed !important; border-color: rgba(207,166,83,0.55) !important; cursor: pointer; }
.rv-newcta .rv-c2-row { grid-template-columns: minmax(0,1fr) auto !important; }
.rv-nc-title { font-size: 13px; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; color: var(--gold-bright, #e1c47e); }
.rv-nc-sub { font-size: 11.5px; color: #b9b3a4; margin-top: 3px; }
.rv-newcta .rv-plus { font-size: 24px; color: var(--gold, #c9a961); }

/* ===== Course & Conditions — kombinert dato/tid, kompakt vaer, per-spiller-forhold ===== */
.rwz-dt-wrap { position: relative; }
.rwz-dt-display { width: 100%; box-sizing: border-box; padding: 10px 12px; border: 1px solid rgba(201,169,97,0.35); border-radius: 10px; background: rgba(10,16,12,0.72); color: var(--fr-offwhite, #f3efeb); font-size: 14px; font-weight: 600; letter-spacing: 0.01em; }
.rwz-dt-native { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; border: 0; padding: 0; margin: 0; }
.rwc-box, .rpc-box, #rwz-step-2 .rnd-bets {
  background: linear-gradient(180deg, rgba(5,18,14,0.50), rgba(3,12,10,0.36)) !important;
  border: 1px solid rgba(207,166,83,0.30) !important;
  border-radius: 12px !important;
}
.rwc-box { padding: 8px 10px !important; }
.rwc-row { display: flex; align-items: center; gap: 10px; }
.rwc-get { flex: 1 1 auto; margin: 0 !important; width: auto !important; }
.rwc-manual-link { flex: 0 0 auto; background: rgba(201,169,97,0.10); border: 1px solid rgba(207,166,83,0.35); border-radius: 999px; color: var(--gold-bright, #e1c47e); font-size: 11.5px; font-weight: 600; cursor: pointer; padding: 7px 12px; }
.rwc-status { margin-top: 6px; font-size: 12.5px; color: #d8d2c2; }
.rwc-status.ok { color: var(--gold-bright, #e1c47e); font-weight: 600; }
.rwc-status.err { color: #d6a2a2; }
.rwc-manual { margin-top: 8px; }
.rpc-box { padding: 8px 10px !important; }
.rpc-row { border-bottom: 1px solid rgba(207,166,83,0.14); }
.rpc-title { font-size: 10.5px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--gold, #c9a961); margin-bottom: 6px; }
.rpc-row { display: flex; align-items: center; gap: 8px; padding: 5px 0; border-bottom: 1px solid rgba(201,169,97,0.10); }
.rpc-row:last-child { border-bottom: 0; }
.rpc-name { flex: 1 1 auto; min-width: 0; font-size: 13px; font-weight: 600; color: #f3efeb; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rpc-cb { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 5px; cursor: pointer; padding: 4px 0; }
.rpc-cb input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.rpc-mark { width: 16px; height: 16px; border: 1.5px solid rgba(201,169,97,0.55); border-radius: 4px; display: inline-block; position: relative; background: rgba(10,16,12,0.6); }
.rpc-cb input:checked + .rpc-mark { background: linear-gradient(180deg, #e1c47e, #c9a961); border-color: #e1c47e; }
.rpc-cb input:checked + .rpc-mark::after { content: ""; position: absolute; left: 4.5px; top: 1.5px; width: 4px; height: 8px; border: solid #0a0f0c; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.rpc-cb input:focus-visible + .rpc-mark { outline: 2px solid var(--gold, #c9a961); outline-offset: 2px; }
.rpc-lbl { font-size: 11.5px; color: #cfc9ba; }
/* Adaptiv tetthet: 4 spillere = tettere rader, fortsatt trykkbart */
#r-player-conditions[data-pc="3"] .rpc-row, #r-player-conditions[data-pc="4"] .rpc-row { padding: 3px 0; }
#r-player-conditions[data-pc="4"] .rpc-lbl { font-size: 10.5px; }
#r-player-conditions[data-pc="4"] .rpc-name { font-size: 12.5px; }
/* Kompakt Bets */
.rnd-bets summary { padding: 6px 0 !important; }
.rnd-bets .rwz-stakes-wrap { margin-top: 4px !important; }

/* ===== Tee Off Setup/Course: compress vertical space so it fits one screen ===== */
#r-form-golf .rwz-head { margin-bottom:10px !important; }
#r-form-golf .rwz-step-title { margin-bottom:8px !important; }
#r-form-golf .panel, #r-form-golf > .rwz-step { padding-top:6px !important; }
#r-form-golf details, #r-form-golf .rnd-cond, #r-form-golf .rwz-stakes-wrap, #r-form-golf .rnd-weather-extra { margin-top:7px !important; }
#r-form-golf .rnd-section, #r-form-golf .form-group { margin-bottom:9px !important; }

/* ===== Tee Off: restore background (was inside removed hero) + push cards 0.5cm below the gold line, centered ===== */
.teeoff-entry {
  position: relative !important;
  background-color: #0e1a13 !important;
  background-image: linear-gradient(180deg, rgba(7,19,14,0.22) 0%, rgba(7,19,14,0.45) 55%, rgba(7,19,14,0.80) 100%), url('teeoff-hero.jpg?v=4') !important;
  background-size: cover, cover !important;
  background-position: center, center 28% !important;
  background-repeat: no-repeat !important;
  margin: 0 -18px !important;
  padding: 19px 18px 16px !important;
  border-radius: 0 !important;
  display: flex; flex-direction: column;
}
.teeoff-entry > * { position: relative; z-index: 1; }
.teeoff-cards { min-height: calc(100dvh - 240px) !important; }
@media (max-width: 480px){ .teeoff-entry { margin: 0 -14px !important; padding: 19px 14px 14px !important; } }

/* ===== Tee Off: hoyden styres na av ETT autoritativt oppsett lenger ned ===== */

/* Tee Off: tapping a box opens setup directly — CONTINUE no longer needed */
.teeoff-continue { display: none !important; }

/* ===== Tee Off: fixed full-screen background behind the header + boxes fill the whole screen ===== */
.teeoff-entry::before {
  content:""; position:fixed; inset:0; z-index:0; pointer-events:none;
  background-color:#0e1a13;
  background-image: linear-gradient(180deg, rgba(7,19,14,0.10) 0%, rgba(7,19,14,0.40) 55%, rgba(7,19,14,0.80) 100%), url('teeoff-hero.jpg?v=4');
  background-size: cover, cover; background-position: center, center 26%; background-repeat:no-repeat;
}
.teeoff-entry {
  background: transparent !important; background-image: none !important;
  margin: 0 !important; padding: 8px 2px calc(8px + env(safe-area-inset-bottom, 0px)) !important; border-radius: 0 !important;
  /* Autoritativ hoyde: 100dvh - headerbunn (114) - 8px luft nederst */
  height: calc(100dvh - 122px - env(safe-area-inset-bottom, 0px)) !important;
  min-height: calc(100dvh - 122px - env(safe-area-inset-bottom, 0px)) !important;
  display: flex; flex-direction: column;
}
.teeoff-entry > * { position: relative; z-index: 1; }
.teeoff-cards {
  flex: 1 1 auto !important; min-height: 0 !important;
  grid-auto-rows: 1fr !important; align-content: stretch !important; gap: 10px !important;
}
.teeoff-card { height: 100% !important; min-height: 0 !important; }
.teeoff-card-img { height: 100% !important; width: 100% !important; object-fit: cover !important; }

/* ===== Clubhouse premium dashboard (PNG/WebP boxes + overlaid dynamic text) ===== */
#tab-dashboard .clubhouse-crest, #tab-dashboard .clubhouse-sign, #tab-dashboard .clubhouse-divider { display:none !important; }
#tab-dashboard .clubhouse-frame { padding:0 !important; }
#dash-clubhouse-tail { padding:0 !important; margin:0 !important; }
.chd { position:relative; width:100%; aspect-ratio:1024/1321; container-type:inline-size; margin:0 auto; z-index:1; }
.chd-box { position:absolute; background-size:100% 100%; background-repeat:no-repeat; }
.chd-box.ch-tap { cursor:pointer; }
.chd-box.ch-tap:active { filter:brightness(1.08); }
/* Native <button> for the Clubhouse V3 nav icons (4B-2 a11y): visual parity with the former <div>.
   Scoped to button.chd-box only — no global button reset. */
button.chd-box {
  -webkit-appearance:none; appearance:none;
  margin:0; padding:0; border:0;
  background-color:transparent;
  color:inherit; font:inherit; line-height:normal; text-align:inherit;
}
button.chd-box:focus-visible { outline:2px solid var(--gold); outline-offset:2px; border-radius:6px; }
.chd-tx { position:absolute; left:0; right:0; text-align:center; transform:translateY(-50%); line-height:1; text-shadow:0 2px 6px rgba(0,0,0,.55); pointer-events:none; }
.chd-serif { font-family:'Playfair Display',Georgia,serif; font-weight:600; color:#F3EFEB; }
.chd-lab { font-family:'Inter',system-ui,sans-serif; font-weight:400; color:#FBFBFA; opacity:.85; }
.chd-lab.chd-tier { color:#FAE188; opacity:1; }
.chd-gold { font-family:'Playfair Display',Georgia,serif; font-weight:700; color:#EAD1A1; text-shadow:0 0 12px rgba(250,225,140,.35),0 2px 6px rgba(0,0,0,.5); }
.chd-hcnav { font-family:'Inter',system-ui,sans-serif; font-weight:500; color:#F9E38A; }
.chd-badge { position:absolute; top:7%; right:5%; width:21%; aspect-ratio:1; border-radius:50%;
  background:linear-gradient(180deg,#F1D488,#C9A050); color:#3A2E14; font-family:'Inter',sans-serif; font-weight:600;
  display:flex; align-items:center; justify-content:center; font-size:2.3cqw; box-shadow:0 2px 6px rgba(0,0,0,.5); }
.chd .bs-row { position:absolute; left:0; right:0; height:0; }
.chd .bs-lab { position:absolute; top:50%; transform:translateY(-50%); font-family:'Inter',sans-serif; font-weight:400; color:#F8F6F5; text-align:right; text-shadow:0 1px 4px rgba(0,0,0,.5); }
.chd .bs-track { position:absolute; top:50%; transform:translateY(-50%); height:1.7cqw; max-height:17px; border-radius:99px; background:#0C1513; border:1px solid #3A3527; overflow:hidden; }
.chd .bs-fill { height:100%; border-radius:99px; background:linear-gradient(90deg,#A5803F,#FBE1A1); box-shadow:0 0 8px rgba(250,225,140,.45),inset 0 1px 0 rgba(255,255,255,.35); }
.chd .bs-num { position:absolute; top:50%; transform:translateY(-50%); font-family:'Inter',sans-serif; font-weight:500; color:#FAE188; text-align:right; text-shadow:0 0 8px rgba(250,225,140,.3); }
.chd-mtr { position:absolute; left:0; right:0; top:98.6%; text-align:center; font-family:'Inter',sans-serif; font-weight:600; letter-spacing:.26em; font-size:1.66cqw; color:#FAE188; text-shadow:0 0 10px rgba(250,225,140,.3); }
.chd-mtr b { color:#c9a050; margin:0 8px; font-weight:400; }

/* Clubhouse dashboard: room image becomes a dimmed backdrop (not a tall block pushing the boxes down) */
#tab-dashboard .clubhouse-frame { position:relative !important; padding:0 !important; margin:0 !important; min-height:0 !important; background:#0a0806 !important; overflow:hidden !important; border-radius:0 !important; }
#tab-dashboard .clubhouse-bg { position:absolute !important; inset:0 !important; top:0 !important; left:0 !important; right:0 !important; bottom:0 !important; width:100% !important; height:100% !important; transform:none !important; opacity:.42 !important; z-index:0 !important; background-position:center top !important; background-size:cover !important; }
#tab-dashboard .clubhouse-bg::after { display:none !important; }
#dash-clubhouse-tail { position:relative !important; z-index:1 !important; padding:0 !important; margin:0 !important; }
#dash-quick-strip { display:none !important; }

/* Clubhouse dashboard: sit at TOP under header (section had flex-end from old layout) + room backdrop visible + boxes slightly transparent */
#tab-dashboard { justify-content: flex-start !important; min-height: 0 !important; }
#tab-dashboard .clubhouse-bg { opacity: .82 !important; }
.chd-box { opacity: .93; }

/* Rivalry dash: fully opaque boxes so no background text/remnants shows through (#5) */
#tab-rivalry .rv-dash { background: transparent !important; -webkit-backdrop-filter:none !important; backdrop-filter:none !important; border-radius:14px; }
#tab-rivalry .rv-dash-stat { background: linear-gradient(180deg, rgba(5,18,14,0.58), rgba(3,12,10,0.42)) !important; }

/* ===== #3 Scorecard: fill width + scale by player count (solo optimised) ===== */
.rwz-sc-grid.winnerN { width:100% !important; max-width:100% !important; margin:0 !important; }
.rwz-sc-head.winnerN, .rwz-sc-row.winnerN { width:100% !important; }
.rwz-sc-grid[data-pc="1"] .rwz-sc-row input, .rwz-sc-grid[data-pc="1"] .rwz-sc-row .rwz-step-val,
.rwz-sc-grid[data-pc="1"] .rwz-sc-input { font-size:clamp(18px,7vw,28px) !important; }
.rwz-sc-grid[data-pc="1"] .rwz-sc-cell.hole { font-size:clamp(14px,4.5vw,20px) !important; }
.rwz-sc-grid[data-pc="2"] .rwz-sc-row input, .rwz-sc-grid[data-pc="2"] .rwz-sc-input, .rwz-sc-grid[data-pc="2"] .rwz-sc-row .rwz-step-val { font-size:clamp(15px,4.8vw,22px) !important; }
.rwz-sc-grid[data-pc="3"] .rwz-sc-row input, .rwz-sc-grid[data-pc="3"] .rwz-sc-input, .rwz-sc-grid[data-pc="3"] .rwz-sc-row .rwz-step-val { font-size:clamp(13px,3.8vw,18px) !important; }
.rwz-sc-grid[data-pc="4"] .rwz-sc-row input, .rwz-sc-grid[data-pc="4"] .rwz-sc-input, .rwz-sc-grid[data-pc="4"] .rwz-sc-row .rwz-step-val { font-size:clamp(11px,3vw,15px) !important; }
.rwz-sc-stat[data-pc="1"] { justify-content:center !important; }
.rwz-sc-stat[data-pc="1"] .rwz-sc-statcol { min-width:56% !important; }
/* match-decided banner tucked under the score */
.rwz-match-won { margin:10px 0 6px; }

/* ===== #1/#2 Tee Off + Setup/Course: responsive, fit any phone without scroll ===== */
.teeoff-cards { min-height:0 !important; grid-template-columns:1fr 1fr !important; grid-template-rows:1fr 1fr !important; }
.teeoff-card { min-height:0 !important; overflow:hidden; border-radius:16px; }
.teeoff-card-img { object-position:center 30% !important; }
#r-form-golf { font-size:clamp(12.5px,3.6vw,15px); }
#r-form-golf .rwz-step-title { margin-bottom:clamp(6px,1.6vw,10px) !important; }
#r-form-golf .rnd-players-grid, #r-form-golf .player-cards, #r-form-golf .gk-grid-teeoff { gap:clamp(5px,1.6vw,9px) !important; }
#r-form-golf details, #r-form-golf .rnd-cond, #r-form-golf .rwz-stakes-wrap, #r-form-golf .rnd-weather-extra { margin-top:clamp(6px,1.6vw,9px) !important; }
#r-form-golf .rnd-section, #r-form-golf .form-group { margin-bottom:clamp(6px,1.8vw,10px) !important; }

/* === Clubhouse dashboard v2 — new UI-assets, fill screen (top 0.4cm under header, bottom 0.4cm above screen end, stretch to sides) === */
#tab-dashboard { display:flex !important; flex-direction:column !important; justify-content:flex-start !important; min-height:calc(100dvh - var(--fr-headerline,110px)) !important; }
#tab-dashboard .clubhouse-frame { flex:1 1 auto !important; display:flex !important; flex-direction:column !important; min-height:0 !important; }
#tab-dashboard #dash-quick-strip { flex:0 0 auto !important; }
#tab-dashboard #dash-clubhouse-tail { flex:1 1 auto !important; display:flex !important; flex-direction:column !important; min-height:0 !important; justify-content:flex-start !important; }
#dash-clubhouse-tail .chd { aspect-ratio:auto !important; flex:1 1 auto !important; height:auto !important; min-height:0 !important; margin:0.4cm 0 0.4cm !important; }
/* transparency now baked into the PNG/WebP alpha — keep box element fully opaque so overlays stay crisp */
#tab-dashboard .chd-box { opacity:1 !important; }

/* === Clubhouse background: full-bleed behind header, to all edges (v2 fix) === */
#tab-dashboard .clubhouse-bg { position:fixed !important; left:50% !important; transform:translateX(-50%) !important; top:0 !important; right:auto !important; bottom:auto !important; width:min(100vw,430px) !important; height:100dvh !important; z-index:-1 !important; opacity:.82 !important; background-size:cover !important; background-position:center center !important; }
#tab-dashboard .clubhouse-frame { background:transparent !important; }

/* === Clubhouse background: reach true bottom (100lvh) + soft fade so no hard edge/baked text shows === */
#tab-dashboard .clubhouse-bg {
  height: 100lvh !important;
  -webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 86%, transparent 100%) !important;
  mask-image: linear-gradient(to bottom, #000 0%, #000 86%, transparent 100%) !important;
}

/* === One-screen fit: kill legacy bottom-nav padding (80px on body + .app) on Clubhouse & Tee Off === */
/* Verified on Galaxy S24 Ultra (412×883): removes 160px phantom scroll → dashboard overflow 0. */
body[data-tab="dashboard"], body[data-tab="round"] { padding-bottom: 0 !important; }
body[data-tab="dashboard"] .app, body[data-tab="round"] .app { padding-bottom: 0 !important; }

/* === Today's Challenge box (Clubhouse) — premium dark glass + gold frame, target icon left === */
.chd-box.chd-tc {
  display:flex; align-items:center; gap:3.2cqw; padding:0 4cqw;
  background: linear-gradient(180deg, rgba(20,22,18,0.86), rgba(10,12,9,0.90));
  border:1px solid rgba(201,169,97,0.55); border-radius:3.4cqw;
  box-shadow: inset 0 1px 0 rgba(247,236,192,0.10), 0 6px 18px rgba(0,0,0,0.35);
  -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px);
}
.chd-tc-ic { flex:0 0 auto; width:7.5cqw; height:7.5cqw; color:#EAD1A1; display:flex; align-items:center; justify-content:center; filter:drop-shadow(0 0 6px rgba(234,209,161,0.25)); }
.chd-tc-ic svg { width:100%; height:100%; }
.chd-tc-body { display:flex; flex-direction:column; justify-content:center; line-height:1.15; min-width:0; }
.chd-tc-body b { font-family:'Playfair Display',Georgia,serif; font-weight:600; color:#F3EFEB; font-size:3.1cqw; letter-spacing:.01em; }
.chd-tc-body span { font-family:'Inter',system-ui,sans-serif; font-weight:400; color:#C9C3B4; font-size:2.2cqw; margin-top:.3cqw; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.chd-tc-body:empty { display:none; }

/* === Clubhouse: dim backdrop so the gold-framed boxes read crisp (match reference) === */
#tab-dashboard .clubhouse-bg { opacity: .42 !important; }

/* === Header: remove profile icon (per new Header reference) === */
#profile-chip, #profile-avatar, .profile-avatar { display: none !important; }

/* ============================================================
   Header = Header.png banner (consistent on ALL tabs, profile icon removed)
   Background locked to the mobile screen. No scroll on Clubhouse / Tee Off.
   ============================================================ */
header {
  aspect-ratio: 853 / 168 !important;
  width: 100% !important; height: auto !important; min-height: 0 !important;
  padding: 0 !important; margin: 0 !important; border: 0 !important; border-radius: 0 !important;
  background: #07100b url('header-logo.png?v=1') left center / cover no-repeat !important;
  display: block !important; box-shadow: none !important;
}
header .brand, header .header-right { display: none !important; }
/* Tabs strip: consistent dark backdrop on every tab so header looks identical everywhere */
.tabs-wrap { background: linear-gradient(180deg, rgba(9,11,9,0.94), rgba(11,14,11,0.97)) !important; }

/* Background image locked to the mobile screen (full width + height, hardcoded) */
#tab-dashboard .clubhouse-bg {
  position: fixed !important; left: 50% !important; transform: translateX(-50%) !important;
  top: 0 !important; bottom: 0 !important; right: auto !important;
  width: min(100vw, 430px) !important; height: 100lvh !important;
  background-size: cover !important; background-position: center center !important;
  z-index: -1 !important; opacity: .42 !important;
}

/* No scroll on Clubhouse or Tee Off — content is locked to one screen */
body[data-tab="dashboard"], body[data-tab="round"] { overflow: hidden !important; }
#tab-dashboard, #tab-round { overflow: hidden !important; }
html:has(#tab-dashboard:not([style*="none"])), html:has(#tab-round:not([style*="none"])) { overflow: hidden !important; }

/* ============================================================
   RESET: fully transparent header (logo + Fairway Rivalry + tabs over the background).
   Only the Bakgrunn image is active as background. Boxes removed for now.
   ============================================================ */
header {
  background: transparent !important;
  aspect-ratio: auto !important; height: auto !important; min-height: 0 !important;
  padding: 16px 16px 6px !important; box-shadow: none !important; border: 0 !important;
}
header .brand { display: flex !important; }
header .header-right, #profile-chip { display: none !important; }
.tabs-wrap { background: transparent !important; }
/* hide any legacy secondary header/crest/sign */
.clubhouse-crest, .clubhouse-sign, .clubhouse-divider { display: none !important; }

/* Bakgrunn = the one active background, filling the mobile screen exactly, clearly visible */
#tab-dashboard .clubhouse-bg {
  position: fixed !important; left: 50% !important; transform: translateX(-50%) !important;
  top: 0 !important; bottom: 0 !important; right: auto !important;
  width: min(100vw, 430px) !important; height: 100lvh !important;
  background-size: cover !important; background-position: center center !important;
  opacity: .9 !important; z-index: -1 !important;
  -webkit-mask-image: none !important; mask-image: none !important;
}

/* Build-version badge (diagnostic) */
#fgl-build-badge { position: fixed !important; right: 6px; bottom: 5px; z-index: 2147483647;
  font: 600 9px/1 system-ui, -apple-system, sans-serif; letter-spacing: .04em;
  color: rgba(201,169,97,.6); background: rgba(0,0,0,.3); padding: 2px 6px; border-radius: 6px;
  pointer-events: none; }

/* No-scroll safeguard that does NOT clip tab backgrounds (overflow only on html/body) */
#tab-dashboard, #tab-round { overflow: visible !important; }
body[data-tab="dashboard"], body[data-tab="round"], html[data-fgltab="dashboard"], html[data-fgltab="round"] { overflow: hidden !important; }

/* ============================================================
   HEADER = Header.png exactly (gold active tab + gold underline, NO green)
   ============================================================ */
.brand-text h1 {
  background: linear-gradient(180deg, #F7EAAE 0%, #E6C97C 45%, #C9A24A 100%) !important;
  -webkit-background-clip: text !important; background-clip: text !important;
  -webkit-text-fill-color: transparent !important; color: #E0BE6E !important;
  font-family: 'Playfair Display', Georgia, 'Times New Roman', serif !important; font-weight: 700 !important;
}
.brand-text .tagline { color: #FFFFFF !important; opacity: .92 !important; }
nav.tabs button { color: #ECE7DA !important; font-weight: 600 !important; }
nav.tabs button:hover { color: #FFFFFF !important; }
nav.tabs button.active { color: #F3D879 !important; border-bottom-color: #F2B70E !important; }
.tab-fgl.active, .tabs-more.has-active { color: #F3D879 !important; }

/* ============================================================
   FLOW TO ANY SCREEN (hardcoded, no guessed pixel heights).
   dvh = the ACTUAL visible screen height on any phone. Background = whole image, zoomed out to fit.
   ============================================================ */
#tab-dashboard .clubhouse-bg {
  position: fixed !important; left: 50% !important; transform: translateX(-50%) !important;
  top: 0 !important; bottom: 0 !important; right: auto !important;
  width: min(100vw, 430px) !important; height: 100dvh !important;
  background-color: #0a0d09 !important;
  background-size: contain !important;          /* zoom OUT — full image fits any screen, no crop */
  background-position: center center !important;
  background-repeat: no-repeat !important;
  opacity: 1 !important; z-index: -1 !important;
  -webkit-mask-image: none !important; mask-image: none !important;
}


/* ============================================================
   DASHBOARD V2 (Bokser V3) — exact-proportion boxes, contain-fit.
   The .chd keeps the Dashboard V2 aspect ratio (853/1515) and scales
   to fit the available screen (width OR height limited) — no distortion,
   no crop, no scroll. Overrides the earlier stretch-to-fill rule.
   ============================================================ */
#tab-dashboard #dash-clubhouse-tail {
  display:flex !important; flex-direction:column !important;
  justify-content:center !important; align-items:center !important;
  min-height:0 !important; padding:0 6px !important;
}
#dash-clubhouse-tail .chd {
  aspect-ratio: 853 / 1515 !important;
  width: min(100%, calc((100dvh - var(--fr-headerline, 132px) - 10px) * 853 / 1515)) !important;
  height: auto !important;
  max-height: calc(100dvh - var(--fr-headerline, 132px) - 6px) !important;
  min-height: 0 !important;
  flex: 0 0 auto !important;
  margin: 0 auto !important;
}
/* boxes are backgrounds sized to their slot (slot aspect == image aspect => no distortion) */
#tab-dashboard .chd-box { opacity:1 !important; background-size:100% 100% !important; background-repeat:no-repeat !important; }

/* Today's Challenge (V3 frame already drawn) — overlay title+text after the baked target icon */
.chd-box.chd-tcv3 { display:block !important; background-color:transparent !important; border:0 !important; box-shadow:none !important; -webkit-backdrop-filter:none !important; backdrop-filter:none !important; padding:0 !important; }
.chd-box.chd-tcv3 .chd-tc-body { position:absolute !important; left:12.5% !important; right:9% !important; top:0 !important; height:100% !important; display:flex !important; flex-direction:column !important; justify-content:center !important; line-height:1.12 !important; }
.chd-box.chd-tcv3 .chd-tc-body b { font-family:'Inter',system-ui,sans-serif !important; font-weight:700 !important; letter-spacing:.14em !important; text-transform:uppercase !important; color:#E7C97C !important; font-size:2.0cqw !important; }
.chd-box.chd-tcv3 .chd-tc-body span { font-family:'Inter',system-ui,sans-serif !important; font-weight:400 !important; color:#EDE7DA !important; font-size:2.35cqw !important; margin-top:.4cqw !important; white-space:nowrap !important; overflow:hidden !important; text-overflow:ellipsis !important; }

/* Breakscore left-aligned "Under N" labels + "rounds" */
.chd .bs-lab.bs-lab-l { text-align:left !important; right:auto !important; color:#EDE7DA !important; white-space:nowrap !important; }

/* Profile avatar top-right (Dashboard V2) — re-shown */
#profile-chip { display:inline-flex !important; position:fixed !important; top:12px !important; right:14px !important; z-index:4000 !important; width:44px !important; height:44px !important; }
#profile-chip #profile-avatar, #profile-chip .profile-avatar { display:inline-flex !important; }

/* Nav tabs = Dashboard V2 (icon above label + gold underline on active).
   Stack icon over label WITHOUT forcing button display — otherwise the
   hidden tabs (Rounds/Insights/Stats/…) with inline display:none would leak in. */
nav.tabs button[data-tab] .tab-ic { display:block; margin:0 auto 2px; width:21px; height:21px; }
nav.tabs button[data-tab] .tab-ic svg { width:100%; height:100%; display:block; }
nav.tabs button[data-tab] .tab-lbl { display:block; font-size:11px; letter-spacing:.02em; text-align:center; line-height:1.1; }

/* ============================================================
   FIX (Mathias): header 100% transparent (kill green veils),
   Bakgrunn fills the screen, build badge hidden.
   ============================================================ */
/* 1) Remove the dark-green veil pseudo-elements over header + tab strip */
header::before, .tabs-wrap::before { display:none !important; content:none !important; background:transparent !important; }
header, .tabs-wrap { background:transparent !important; }

/* 2) Dashboard background = the Bakgrunn image, filling the whole screen (cover), no green tint */
body[data-tab="dashboard"]::after { display:none !important; }
#tab-dashboard .clubhouse-bg {
  position:fixed !important; left:50% !important; transform:translateX(-50%) !important;
  top:0 !important; bottom:0 !important; right:auto !important;
  width:min(100vw,430px) !important; height:100dvh !important;
  background-image:url('clubhouse-bg.jpg?v=16') !important;
  background-size:cover !important; background-position:center center !important; background-repeat:no-repeat !important;
  background-color:#0a0d09 !important;
  opacity:1 !important; z-index:-1 !important;
  -webkit-mask-image:none !important; mask-image:none !important;
}

/* 3) Hide the diagnostic build badge (was showing on the background) */
#fgl-build-badge { display:none !important; }

/* 4) Today's Challenge message may wrap to 2 short lines (e.g. the no-active-rounds copy) */
.chd-box.chd-tcv3 .chd-tc-body span { white-space:normal !important; overflow:visible !important; text-overflow:clip !important; line-height:1.12 !important; }


/* Build version: hidden on the background everywhere, visible ONLY on the Settings tab
   (so cache/version can still be checked on the phone without cluttering the clubhouse). */
#fgl-build-badge { display:none !important; }
body[data-tab="settings"] #fgl-build-badge { display:block !important; }

/* ============================================================================
   GLOBAL HEADER — konsolidert kontraktlag (2026-07-22)
   Én delt headerimplementasjon med felles høydevariabler for ALLE faner.
   Total headerhøyde (ekskl. safe area) = brand-rad + nav-rad = 68 + 56 = 124px.
   Safe area håndteres separat via env(safe-area-inset-top).
   Sideinnhold begynner konsekvent 8px etter nav-raden (margin på .tabs-wrap).
   Ingen side-spesifikke offsets. Se docs/app-machine + oppdrag 2026-07-22.
   ============================================================================ */
:root {
  --fr-hdr-brand-h: 68px;   /* merkevarerad (logo + profilikon) */
  --fr-hdr-nav-h: 56px;     /* navigasjonsrad */
  --fr-hdr-pad-x: 12px;     /* felles horisontal padding mot skjermkant */
  --fr-hdr-gap-below: 8px;  /* avstand fra nav-rad til sideinnhold */
}

/* Mobil: ikke reserver desktop-scrollbar-gutter (smalnet innholdet med 2×15px
   i testmiljø/desktop; mobile nettlesere har overlay-scrollbar = ingen effekt). */
@media (max-width: 600px) {
  html { scrollbar-gutter: auto !important; }
  .app { padding-left: var(--fr-hdr-pad-x) !important; padding-right: var(--fr-hdr-pad-x) !important; padding-top: 0 !important; }
}

/* --- Brand-rad (øverste rad): logo/wordmark venstre, profilikon høyre --- */
header[data-testid="app-header"] {
  display: flex !important; align-items: center !important; justify-content: flex-start !important;
  box-sizing: border-box !important;
  height: calc(var(--fr-hdr-brand-h) + env(safe-area-inset-top, 0px)) !important;
  min-height: 0 !important; aspect-ratio: auto !important;
  padding: env(safe-area-inset-top, 0px) 0 0 0 !important; margin: 0 !important;
  border: 0 !important; box-shadow: none !important; background: transparent !important;
}
header[data-testid="app-header"] .brand {
  display: flex !important; align-items: center !important; gap: 12px !important;
  margin: 0 !important; height: 100% !important; min-width: 0 !important;
}
header[data-testid="app-header"] .brand .monogram {
  width: 44px !important; height: 44px !important; flex: 0 0 44px !important; margin: 0 !important;
}
header[data-testid="app-header"] .brand-text h1 {
  font-size: 17px !important; letter-spacing: 0.14em !important; line-height: 1 !important; margin: 0 !important;
}
header[data-testid="app-header"] .brand-text .tagline {
  font-size: 8px !important; letter-spacing: 0.16em !important; margin-top: 5px !important; white-space: nowrap !important;
}
header[data-testid="app-header"] .brand-text .brand-sub { display: none !important; }
header[data-testid="app-header"] .header-right { display: none !important; padding: 0 !important; }

/* Profilikon høyre: eksisterende chip/asset, 40px, vertikalt sentrert i brand-raden */
#profile-chip {
  display: inline-flex !important; position: fixed !important;
  top: calc(env(safe-area-inset-top, 0px) + 14px) !important;  /* (68 - 40) / 2 */
  right: var(--fr-hdr-pad-x) !important;
  width: 40px !important; height: 40px !important; z-index: 4000 !important;
}

/* --- Nav-rad: ekte fem-kolonners grid over hele innholdsbredden --- */
.tabs-wrap {
  position: relative !important; top: auto !important;
  height: var(--fr-hdr-nav-h) !important;
  margin: 0 0 var(--fr-hdr-gap-below) 0 !important; padding: 0 !important;
  background: transparent !important; border: 0 !important; box-shadow: none !important;
}
.tabs-wrap::before, .tabs-wrap::after { display: none !important; content: none !important; }
nav#tabs {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 0 !important; height: 100% !important; width: 100% !important;
  padding: 0 !important; margin: 0 !important; border: 0 !important;
  overflow: visible !important; background: transparent !important;
}
/* Kun synlige faneknapper (inline display:none holder de skjulte ute av gridet). */
nav#tabs > button[data-tab]:not([style*="none"]) {
  display: flex !important; flex-direction: column !important;
  align-items: center !important; justify-content: center !important;
  gap: 4px !important;
}
nav#tabs > button[data-tab] {
  box-sizing: border-box !important; position: relative !important;
  width: 100% !important; height: 100% !important; min-height: 44px !important;
  margin: 0 !important; padding: 0 !important; border: 0 !important;
  white-space: nowrap !important; letter-spacing: 0.02em !important;
  font-size: 13px !important; line-height: 1.1 !important;
}
nav#tabs > button[data-tab] .tab-ic {
  display: flex !important; align-items: center !important; justify-content: center !important;
  width: 25px !important; height: 25px !important; margin: 0 !important; flex: 0 0 25px !important;
}
nav#tabs > button[data-tab] .tab-ic svg { width: 100% !important; height: 100% !important; display: block !important; }
nav#tabs > button[data-tab] .tab-lbl {
  display: block !important; font-size: 13px !important; line-height: 1.1 !important;
  letter-spacing: 0.02em !important; text-align: center !important;
}
.tabs-more { display: none !important; }

/* --- Aktiv-indikator: KUN på valgt fane. Ingen fullbredde-gullstrek. --- */
nav#tabs > button[data-tab] { border-bottom: 0 !important; }
nav#tabs > button[data-tab]::after { content: none !important; display: none !important; animation: none !important; }
nav#tabs > button[data-tab].active::after {
  content: "" !important; display: block !important; position: absolute !important;
  left: 50% !important; right: auto !important; transform: translateX(-50%) !important;
  bottom: 2px !important; width: 58px !important; height: 2px !important; border-radius: 2px !important;
  background: linear-gradient(90deg, rgba(242,183,14,0), #F2B70E 22%, #F3D879 50%, #F2B70E 78%, rgba(242,183,14,0)) !important;
  box-shadow: 0 0 8px rgba(240,212,137,0.55) !important;
  opacity: 1 !important; animation: none !important; transition: none !important;
}

/* ============================================================================
   CLUBHOUSE — layoutkorreksjon (2026-07-22)
   Full innholdsbredde (12px sidepadding via .app), ekte grid i naturlig flyt.
   12-kolonners grid: record/challenge/breakscore = full bredde, nav = span 2
   (6 per rad), stat = span 3 (4 per rad). Kortgap 6px; seksjonsgap 8px
   (row-gap 6 + 2px margin-top på ny seksjon). Ingen contain-fit-skalering.
   Kortproporsjoner ligger nær de bakte bildenes naturlige aspekt for å unngå
   forvrengning av rammer/motiv (avvik fra spek-tall er dokumentert i rapport).
   ============================================================================ */
:root {
  --chd-gap-card: 6px;      /* avstand mellom kort i samme grid */
  --chd-gap-extra: 2px;     /* + row-gap 6 = 8px seksjonsavstand */
  --chd-val-y: 54%;         /* felles vertikal forankring for hovedverdier */
  --value-offset-y: 0px;    /* kortspesifikk finjustering (maks ±8px) */
}

/* Container: naturlig dokumentflyt, full innholdsbredde, ingen skalering */
#tab-dashboard { display: block !important; min-height: 0 !important; }
#tab-dashboard #dash-clubhouse-tail {
  display: block !important; padding: 0 !important; margin: 0 !important;
  flex: none !important; min-height: 0 !important;
}
#dash-clubhouse-tail .chd {
  display: grid !important;
  grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
  column-gap: var(--chd-gap-card) !important; row-gap: var(--chd-gap-card) !important;
  aspect-ratio: auto !important; width: 100% !important; max-width: none !important;
  height: auto !important; max-height: none !important; min-height: 0 !important;
  margin: 0 !important; padding: 0 0 10px 0 !important; flex: none !important;
  position: relative !important;
}

/* Kortene er nå vanlige grid-børn i flyt — ikke absolutt posisjonerte */
#dash-clubhouse-tail .chd > .chd-box {
  position: relative !important; left: auto !important; top: auto !important;
  align-self: start !important; width: 100% !important;
  background-size: 100% 100% !important; background-repeat: no-repeat !important;
}

/* REBUILD 2026-07-24: grid-tildeling for den nye kortarkitekturen
   (record 1 / challenge 1 / latest 1 / nav 3 / statrow 2 / breakscore 1 = 9). */
#dash-clubhouse-tail .chd > .chd-c-record { grid-column: 1 / -1 !important; }

/* Active Round / Today's Challenge — kompakt stripe, full bredde, 48px (UENDRET) */
#dash-clubhouse-tail .chd > .chd-c-challenge {
  grid-column: 1 / -1 !important; height: 48px !important; aspect-ratio: auto !important;
  margin-top: var(--chd-gap-extra) !important;
}

/* Tre nav-kort på én rad — identiske kolonner (span 4 av 12) */
#dash-clubhouse-tail .chd > .chd-c-nav {
  grid-column: span 4 !important; aspect-ratio: auto !important;
  margin-top: var(--chd-gap-extra) !important;
}

/* To statrader — én sammenhengende boks per rad, tre interne seksjoner */
#dash-clubhouse-tail .chd > .chd-c-statrow {
  grid-column: 1 / -1 !important;
  margin-top: var(--chd-gap-extra) !important;
}

/* Breakscore — full bredde, nær bildets naturlige 799×260 */
#dash-clubhouse-tail .chd > .chd-c-breakscore {
  grid-column: 1 / -1 !important; aspect-ratio: 799 / 260 !important;
  margin-top: var(--chd-gap-extra) !important;
}


/* --- Today's Challenge-stripen: ikon venstre, tekst midt, pil høyre --- */
.chd-box.chd-tcv3 .chd-tc-body b { font-size: clamp(10.5px, 2.9vw, 11.5px) !important; }
.chd-box.chd-tcv3 .chd-tc-body span { font-size: clamp(12px, 3.3vw, 13px) !important; line-height: 1.15 !important; }
.chd-box.chd-tcv3 .chd-tc-body {
  display: flex !important; flex-direction: column !important; justify-content: center !important;
  overflow: hidden !important;
}

/* --- Breakscore: faste lesbare størrelser (før: cqw) --- */
.chd .bs-lab { font-size: clamp(10.5px, 2.9vw, 11.5px) !important; }
.chd .bs-lab.bs-lab-unit { font-size: clamp(9.5px, 2.6vw, 10.5px) !important; opacity: .7; }
.chd .bs-num { font-size: clamp(10.5px, 2.9vw, 11.5px) !important; }
.chd .bs-track { height: 7px !important; }
.chd-badge { font-size: 10px !important; }

/* Scroll-policy (adaptiv, jf. kontraktens beslutning #1): på referanse-
   viewportene får hele Clubhouse plass uten scroll; på lavere skjermer
   tillates naturlig vertikal scroll i stedet for skalering/klipping. */
body[data-tab="dashboard"] { overflow-y: auto !important; overflow-x: hidden !important; }
html:has(#tab-dashboard:not([style*="none"])) { overflow-y: auto !important; overflow-x: hidden !important; }
#tab-dashboard { overflow: visible !important; }

/* --- Finjustering (runde 2) --- */
/* Wordmark ~176px bred (spek: 165–180) — behold Playfair-gullgradienten */
header[data-testid="app-header"] .brand-text h1 { font-size: 16px !important; letter-spacing: 0.05em !important; }
/* Wordmark i samme gull som FR-logoen (subtil gradient, ikke skarp gul) */
header[data-testid="app-header"] .brand-text h1 {
  background: linear-gradient(180deg, #f4d77d 0%, #d4a63c 55%, #9b681c 100%) !important;
  -webkit-background-clip: text !important; background-clip: text !important;
  -webkit-text-fill-color: transparent !important; color: transparent !important;
}

/* Challenge-stripen: tekst avkortes på én linje innenfor 48px-høyden */
.chd-box.chd-tcv3 .chd-tc-body b,
.chd-box.chd-tcv3 .chd-tc-body span {
  display: block !important; white-space: nowrap !important;
  overflow: hidden !important; text-overflow: ellipsis !important; max-width: 100% !important;
}
.chd-box.chd-tcv3 .chd-tc-body span { margin-top: 2px !important; }

/* Skjult PWA-oppdateringstoast skal være HELT utenfor skjermen (før: 2–3px
   + skygge stakk ned øverst på alle faner). Påvirker ikke .show-tilstanden. */
.pwa-update-toast:not(.show) { visibility: hidden !important; }



/* (REBUILD 2026-07-24: .chd-vgroup-nullstillingen fjernet — utgått markup.) */

/* ============================================================================
   ITERASJON 2 (2026-07-22) — lavere header + kompakt Clubhouse.
   Overstyrer verdiene fra det konsoliderte laget over (senere i kaskaden).
   Header: 58 + 48 = 106px (ekskl. safe area). Clubhouse: cover-beskjæring —
   bildene tilpasses kortene, kortene styres ikke av bildenes proporsjoner.
   ============================================================================ */
:root {
  --fr-hdr-brand-h: 58px;
  --fr-hdr-nav-h: 48px;
  --fr-hdr-pad-x: 12px;
  --fr-hdr-gap-below: 8px;
}

/* Brand-rad: mindre logo + mindre profilikon, vertikalt sentrert */
header[data-testid="app-header"] .brand .monogram { width: 40px !important; height: 40px !important; flex: 0 0 40px !important; }
header[data-testid="app-header"] .brand { gap: 11px !important; }
header[data-testid="app-header"] .brand-text h1 { font-size: 15px !important; letter-spacing: 0.05em !important; }
header[data-testid="app-header"] .brand-text .tagline { font-size: 7.5px !important; letter-spacing: 0.14em !important; margin-top: 4px !important; }
#profile-chip {
  width: 34px !important; height: 34px !important;
  top: calc(env(safe-area-inset-top, 0px) + 12px) !important;  /* (58 − 34) / 2 */
}

/* Nav-rad 48px: ikonboks 24, etikett 12/500, gap 3 — aktiv ikke fetere */
nav#tabs > button[data-tab] { gap: 3px !important; font-weight: 500 !important; }
nav#tabs > button[data-tab] .tab-ic { width: 24px !important; height: 24px !important; flex: 0 0 24px !important; }
nav#tabs > button[data-tab] .tab-lbl { font-size: 12px !important; font-weight: 500 !important; }
nav#tabs > button[data-tab].active { font-weight: 500 !important; }
nav#tabs > button[data-tab].active .tab-lbl { font-weight: 500 !important; }
/* Kort gullindikator 48×2, avrundet */
nav#tabs > button[data-tab].active::after { width: 48px !important; border-radius: 999px !important; }

/* ============================================================================
   CLUBHOUSE BOX REBUILD (2026-07-24) — AUTORITATIVT KORTLAG.
   Erstatter de gamle record-/nav-/statkortreglene (iterasjon 2/3). Felles
   designfamilie: mørk subtilt transparent flate (samme gradient som den
   godkjente Challenge-flaten), CSS-gullramme via ::after-regelen over,
   radius var(--chd-card-radius), konsistent spacing (--chd-gap-card).
   ============================================================================ */
:root {
  --chd-surface: linear-gradient(180deg, rgba(20,22,18,0.86), rgba(10,12,9,0.90));
  --chd-lab-gold: #d4b15e;
  --chd-divider: rgba(207, 166, 83, 0.30);
}
#dash-clubhouse-tail .chd > .chd-c-nav,
#dash-clubhouse-tail .chd > .chd-c-statrow {
  background: var(--chd-surface) !important;
}

/* --- Record This Season: ETT sammenhengende full-bleed hero-bilde ---
   (premium-pass 2026-07-24). Ingen sonedeling, ingen sidepaneler, ingen smal
   bildekolonne. Tekstblokken star venstrejustert, resultatet star hoyre pa
   bildets naturlige morke trekrone-omrade. Bak tekst og resultat ligger KUN
   bildets egne piksler: transparent bakgrunn, ingen backdrop-filter/filter/
   blend/gradient/pseudo-lag — kun en kontrollert skygge pa selve teksten. */
#dash-clubhouse-tail .chd > .chd-c-record {
  aspect-ratio: 936 / 389 !important; height: auto !important;
  background-size: cover !important; background-position: center center !important;
  display: flex !important; align-items: stretch !important;
  justify-content: space-between; gap: 8px;
  padding: 12px 16px !important; text-align: left !important;
}
.chd-rec-copy {
  flex: 0 1 auto; min-width: 0; max-width: clamp(96px, 30vw, 136px);
  align-self: center; display: flex; flex-direction: column; gap: 7px;
}
.chd-rec-eyebrow {
  font-family: 'Inter', system-ui, sans-serif; font-weight: 700;
  font-size: clamp(10px, 2.8vw, 11px); line-height: 1.5; letter-spacing: 0.14em;
  text-transform: uppercase; color: #EFD48D;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.65);
}
.chd-rec-context {
  font-family: 'Inter', system-ui, sans-serif; font-weight: 400;
  font-size: clamp(11px, 3vw, 12px); line-height: 1.3; color: #DDD6C6;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.65);
}
.chd-rec-score {
  flex: 0 0 auto; align-self: flex-start; margin-top: clamp(8px, 2.6vw, 14px);
  display: flex; flex-direction: column; align-items: flex-end;
  background: transparent; -webkit-backdrop-filter: none; backdrop-filter: none;
  filter: none; mix-blend-mode: normal;
}
.chd-rec-val {
  font-family: 'Playfair Display', Georgia, serif; font-weight: 500;
  font-size: clamp(40px, 13vw, 54px); line-height: 0.95; letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums; text-align: right; white-space: nowrap;
  color: #EFDCA9; text-shadow: 0 2px 6px rgba(0, 0, 0, 0.55);
}
/* Brede resultater (12–10): kontrollert nedskalering — fortsatt sidens storste verdi */
.chd-rec-score--long .chd-rec-val { font-size: clamp(28px, 8.4vw, 34px); }
.chd-rec-rule {
  width: clamp(36px, 11vw, 52px); height: 2px; margin: 8px 0 0 auto;
  border-radius: 999px; background: var(--gold, #c9a961);
}
.chd-sr-main:focus-visible, .chd-sr-link:focus-visible {
  outline: 2px solid var(--gold); outline-offset: 2px; border-radius: 6px; }

/* --- Tre navkort: originalt ikon (beskåret over den bakte etiketten) + serif-label --- */
#dash-clubhouse-tail .chd > .chd-c-nav {
  height: 92px !important;
  display: flex !important; flex-direction: column; align-items: center;
  justify-content: center; gap: 7px; padding: 8px 4px !important;
}
/* Transparente originalikoner (nav-*-icon.webp = ikonglyfen keyet ut av den gamle
   morke firkantflaten) — ikonet ligger direkte pa kortflaten, ingen bilderamme. */
.chd-nav-ic {
  width: 46px; height: 40px; flex: 0 0 auto;
  background-size: contain; background-position: center; background-repeat: no-repeat;
  background-color: transparent;
}
.chd-nav-lbl {
  font-size: clamp(13px, 3.6vw, 15px) !important; font-weight: 600 !important;
  line-height: 1.1; max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

/* --- Statrader: én boks, tre seksjoner med diskrete delere (ikke topp/bunn) --- */
#dash-clubhouse-tail .chd > .chd-c-statrow {
  display: flex !important; align-items: stretch; padding: 12px 4px !important;
  position: relative !important;
}
.chd-sr-sec {
  flex: 1 1 0; min-width: 0; position: relative;
  display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 2px 6px;
}
/* Rad 1: LOWEST PLAYED HC er radens lengste etikett — seksjonen får proporsjonalt
   mer plass (HANDICAP tilsvarende mindre) slik at ingen etikett klippes. */
.chd-sr1 .chd-sr-sec:nth-child(1) { flex-grow: 1.18; }
.chd-sr1 .chd-sr-sec:nth-child(2) { flex-grow: 0.82; }
.chd-sr-sec + .chd-sr-sec::before {
  content: ""; position: absolute; left: 0; top: 12%; bottom: 12%; width: 1px;
  background: linear-gradient(180deg, transparent, var(--chd-divider) 30%, var(--chd-divider) 70%, transparent);
}
.chd-sr-bg {
  position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background-size: cover; background-repeat: no-repeat; opacity: 0.32; border-radius: 8px;
}
.chd-sr-bg--l { background-position: left bottom;
  -webkit-mask-image: linear-gradient(90deg, #000 55%, transparent 100%);
  mask-image: linear-gradient(90deg, #000 55%, transparent 100%); }
.chd-sr-bg--r { background-position: right bottom;
  -webkit-mask-image: linear-gradient(270deg, #000 55%, transparent 100%);
  mask-image: linear-gradient(270deg, #000 55%, transparent 100%); }
.chd-sr-main {
  -webkit-appearance: none; appearance: none; margin: 0; padding: 0; border: 0;
  background: transparent; color: inherit; font: inherit; cursor: pointer;
  position: relative; z-index: 1; width: 100%; min-width: 0;
  display: flex; flex-direction: column; align-items: center; gap: 6px;
}
.chd-sr-lab {
  font-family: 'Inter', system-ui, sans-serif; font-weight: 600;
  font-size: clamp(8.5px, 2.35vw, 9.5px); line-height: 1.1; letter-spacing: 0.09em;
  text-transform: uppercase; color: var(--chd-lab-gold);
  max-width: 100%; white-space: nowrap; overflow: visible;
}
.chd-sr-val {
  font-size: clamp(24px, 6.6vw, 27px) !important; font-weight: 600 !important;
  line-height: 1.05; color: #F3EDDC; font-variant-numeric: tabular-nums; white-space: nowrap;
}
.chd-sr-link {
  -webkit-appearance: none; appearance: none; margin: 0; border: 0; cursor: pointer;
  position: relative; z-index: 1; background: transparent; padding: 3px 4px 0;
  font: 500 clamp(10.5px, 2.9vw, 11.5px)/1.2 'Inter', system-ui, sans-serif;
  color: #EDE7DA; opacity: 0.88;
}
/* Rad 2: originalillustrasjon + navn/verdi + sekundærtekst */
.chd-sr-row { display: flex; align-items: center; gap: 8px; min-width: 0; max-width: 100%; }
.chd-sr-ill {
  flex: 0 0 38px; width: 38px; height: 38px; border-radius: 50%;
  background-size: cover; background-repeat: no-repeat;
  border: 1px solid rgba(207, 166, 83, 0.5);
}
.chd-sr-ill--free { border-radius: 8px; border: 0; }
.chd-sr-txt { min-width: 0; display: flex; flex-direction: column; gap: 2px; text-align: left; }
.chd-sr-name {
  font-size: clamp(13px, 3.6vw, 15px) !important; line-height: 1.18; color: #F3EFEB;
  max-width: 100%; overflow: hidden;
  /* Inntil to linjer (premium-pass): trophy-/banenavn klippes ikke unodvendig med … */
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;
}
/* Tomtilstander: bevisste, rolige — aldri stor dominerende tekst. Illustrasjonen
   skjules i tomtilstand slik at teksten far full bredde og aldri klippes. */
.chd-sr-name--empty {
  font-family: 'Inter', system-ui, sans-serif !important; font-weight: 500 !important;
  font-size: clamp(11px, 3vw, 12px) !important; color: #B9B3A4 !important;
  letter-spacing: 0.02em; white-space: nowrap;
}
.chd-sr-row--empty .chd-sr-ill { display: none; }
.chd-sr-row--empty { justify-content: center; }
.chd-sr-sub {
  font-family: 'Inter', system-ui, sans-serif; font-weight: 400;
  font-size: clamp(9.5px, 2.6vw, 10.5px); line-height: 1.25; color: #C9C3B4;
  max-width: 100%; overflow: hidden;
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;
}
/* Rad 2: sekundærtekst kan bruke tre linjer — tomtilstandene vises uten …-klipp */
.chd-sr2 .chd-sr-sub { -webkit-line-clamp: 3; }
.chd-sr2 .chd-sr-main { gap: 7px; }

/* Active Round / Challenge: kompakt 40px-stripe, bleed i bunn av assetet beskjæres */
#dash-clubhouse-tail .chd > .chd-c-challenge {
  height: 40px !important; min-height: 40px !important; max-height: 42px !important;
  background-size: cover !important; background-position: left center !important;
}
.chd-box.chd-tcv3 .chd-tc-body b { font-size: clamp(10px, 2.8vw, 11px) !important; }
.chd-box.chd-tcv3 .chd-tc-body span { font-size: clamp(11px, 3vw, 12px) !important; margin-top: 1px !important; }

/* (REBUILD 2026-07-24: de gamle 56px-navkort- og 5/6-statkortreglene er fjernet —
   navkort og statrader defineres nå autoritativt i rebuild-laget over.) */
.chd .chd-bg {
  position: absolute; inset: 0; border-radius: inherit;
  background-size: cover; background-repeat: no-repeat;
  /* Transparens ligger naa i assetenes alfakanal (morke flater ~0.75,
     innhold/ikoner ~1.0) - laget selv renders pa full opacity. */
  opacity: 1; z-index: 0; pointer-events: none;
}
#dash-clubhouse-tail .chd > .chd-c-breakscore > .chd-bg { background-position: center top; }
/* Innholdet ligger over bakgrunnslaget (rammen ::after ligger øverst, z 100) */
.chd > .chd-c-breakscore .bs-row { z-index: 2; }


/* Breakscore: betydelig lavere — 4/1, cover forankret i topp (tittel + ball) */
#dash-clubhouse-tail .chd > .chd-c-breakscore {
  aspect-ratio: 4 / 1 !important;
  background: transparent !important;
}
.chd .bs-lab { font-size: clamp(9.5px, 2.6vw, 10.5px) !important; }
.chd .bs-lab.bs-lab-unit { font-size: clamp(8.5px, 2.3vw, 9.5px) !important; }
.chd .bs-num { font-size: clamp(9.5px, 2.6vw, 10.5px) !important; }
.chd .bs-track { height: 5px !important; }

/* --- Iterasjon 2, finjustering --- */
/* Profilikonet: avataren fyller chipen (34px) uten intern beskjæring */
#profile-chip .profile-avatar, #profile-chip #profile-avatar {
  width: 100% !important; height: 100% !important; display: inline-flex !important;
}
/* (REBUILD 2026-07-24: gamle 58px-navkort- og record-val-top-regler fjernet.) */

/* ============================================================================
   ITERASJON 3 (2026-07-22) — komplette CSS-gullrammer, felles tekstblokk i
   statkortene (DOM-titler, v4-assets uten bakte titler), Breakscore-tall og
   sveipbar Active/Live Rounds-stripe. Autoritativt Clubhouse-lag; overstyrer
   eldre regler lenger opp (en opprydding av eldre lag tas etter visuell
   godkjenning, jf. App Machine-notatet).
   ============================================================================ */

/* --- 1) Ekte CSS-gullramme på ALLE Clubhouse-kort (frikoblet fra bildene) --- */
:root { --chd-gold-border: rgba(207, 166, 83, 0.58); --chd-card-radius: 10px; }
#dash-clubhouse-tail .chd > .chd-box {
  border-radius: var(--chd-card-radius) !important; overflow: hidden !important;
  isolation: isolate !important;
}
/* Én autoritativ ramme: fullt rektangel (inset 0.5px), over alle innholdslag.
   MERK: ingen left/right/width-overstyringer her — det var nettopp slike
   auto-verdier som tidligere kollapset rammen til én venstrestripe. */
#dash-clubhouse-tail .chd > .chd-box::after {
  content: "" !important; position: absolute !important; inset: 0.5px !important;
  box-sizing: border-box !important;
  border: 1px solid var(--chd-gold-border) !important;
  border-radius: calc(var(--chd-card-radius) - 0.5px) !important;
  pointer-events: none !important; z-index: 100 !important;
}
.chd-badge { z-index: 6; }

/* (REBUILD 2026-07-24: statkort-tekstblokken (.chd-vgroup/.chd-stat-title/
   .chd-val/.chd-val--num) og HC-ringen er fjernet — de 8 enkeltstatkortene er
   erstattet av to statrader (.chd-c-statrow) definert i rebuild-laget over.) */


/* --- 5) Breakscore: antall med korrekt mellomrom og entall/flertall --- */
.chd .bs-cnt {
  position: absolute; top: 50%; transform: translateY(-50%);
  left: 78%; right: 3.5%; text-align: right;
  font-family: 'Inter', sans-serif; font-weight: 400;
  font-size: clamp(9.5px, 2.6vw, 10.5px); color: #EDE7DA; opacity: .85;
  text-shadow: 0 1px 4px rgba(0,0,0,.5); white-space: nowrap;
}
.chd .bs-cnt b { font-weight: 500; color: #FAE188; text-shadow: 0 0 8px rgba(250,225,140,.3); }

/* --- 6+7) Active/Live Rounds: sveipbar stripe, én synlig om gangen --- */
.chd-c-challenge { cursor: default; }
.chd-strip {
  position: absolute; inset: 0; z-index: 3;
  display: flex; overflow-x: auto; overflow-y: hidden;
  scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch;
  scrollbar-width: none; overscroll-behavior-x: contain; touch-action: pan-x pan-y;
}
.chd-strip::-webkit-scrollbar { display: none; }
.chd-strip-item {
  flex: 0 0 100%; min-width: 100%; scroll-snap-align: start; scroll-snap-stop: always;
  display: flex; flex-direction: column; justify-content: center; align-items: flex-start;
  padding: 0 9% 0 13%; text-align: left; cursor: pointer;
  appearance: none; background: transparent; border: 0; color: inherit; font: inherit;
}
.chd-strip-item b {
  font-family: 'Inter', system-ui, sans-serif; font-weight: 700;
  font-size: clamp(10px, 2.8vw, 11px); line-height: 1.1;
  letter-spacing: .12em; text-transform: uppercase; color: #E7C97C;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%;
}
.chd-strip-item span {
  font-family: 'Inter', system-ui, sans-serif; font-weight: 400;
  font-size: clamp(11px, 3vw, 12px); line-height: 1.15; margin-top: 2px; color: #EDE7DA;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%;
}
.chd-strip-item:focus-visible { outline: 2px solid var(--gold, #c9a961); outline-offset: -3px; border-radius: 8px; }
.chd-strip-dots {
  position: absolute; left: 50%; transform: translateX(-50%); bottom: 3px;
  display: flex; gap: 4px; z-index: 6; pointer-events: none;
}
.chd-strip-dots i {
  width: 4px; height: 4px; border-radius: 50%;
  background: rgba(231, 201, 124, 0.32);
}
.chd-strip-dots i.on { background: #E7C97C; }

/* Strip-innholdet er ekte vertikalt sentrert (ikon/tekst/pil pa samme midtlinje) */
.chd-strip-item { padding-bottom: 0 !important; }
/* .bs-cnt bærer også det kontraktfestede .bs-num-ankeret; .bs-cnt-oppsettet gjelder */
.chd .bs-cnt.bs-num { left: 78%; right: 3.5%; width: auto; font-weight: 400; color: #EDE7DA; }


/* ===== SOLO SCORECARD (godkjent referanse 2026-07-23) — AUTORITATIV =====
   5 kolonner: HOLE | PAR | EXTRA | SCORE | RESULT. Kun aktiv rad har -/+;
   EXTRA = score relativt til par; RESULT = Bogey/Par/Double/Triple/Birdie/Eagle/Other;
   OUT/IN/TOTAL-oppsummeringsrader nederst. Gjelder KUN data-pc="1" (solo). */
.rwz-sc-head.rwz-shead > div { text-align: center; overflow: visible; }
.rwz-sc-row.rwz-srow .rwz-sc-cell { display: flex; align-items: center; justify-content: center; min-width: 0; overflow: hidden; }
.rwz-sc-row.rwz-srow { min-height: 34px; }
.rwz-sc-grid.winnerN[data-pc="1"] .rwz-srow .rwz-sc-cell.hole { font-size: 13px !important; font-weight: 600; }
.rwz-sc-grid.winnerN[data-pc="1"] .rwz-srow .rwz-sc-parro { font-size: 12.5px; }
.rwz-sc-grid.winnerN[data-pc="1"] .rwz-srow .par-step .rwz-step-val { font-size: 13px !important; }
/* EXTRA-kolonnen: relativt-til-par, dempet fargefamilie som resten av scorecardet */
.rwz-sextra { font-size: 12px; font-weight: 500; color: #8b877b; font-variant-numeric: tabular-nums; }
/* RESULT-kolonnen: tekstetikett, dempet — farge folger scoreLabelClass-familien */
.rwz-sres { font-size: 11.5px; font-weight: 500; letter-spacing: 0.02em; color: #8b877b; white-space: nowrap; }
.rwz-sres.rss-par { color: #cfc9ba; }
.rwz-sres.rss-birdie, .rwz-sres.rss-elite { color: #a6e0c8; }
.rwz-sres.rss-bogey { color: #d8c9a5; }
.rwz-sres.rss-double, .rwz-sres.rss-high { color: #e0a8a8; }
/* Aktiv rads stepper i SCORE-kolonnen (kompakt, sentrert, uendret markup-familie) */
.rwz-sc-row.rwz-srow.rwz-active .rwz-sscore .rwz-step { width: 100%; max-width: 128px; margin: 0 auto; justify-content: space-between; }
.rwz-sc-row.rwz-srow.rwz-active .rwz-sscore .rwz-step-btn { width: 32px !important; min-width: 32px; height: 32px !important; font-size: 17px !important; }
.rwz-sc-row.rwz-srow.rwz-active .rwz-sscore .rwz-step-val { font-size: 17px !important; min-width: 28px !important; }
.rwz-sc-grid.winnerN[data-pc="1"] .rwz-srow.rwz-active .rwz-step-val.set { width: 28px !important; height: 28px !important; min-width: 28px !important; }
/* OUT / IN / TOTAL — ryddige oppsummeringsrader, ikke klikkbare */
.rwz-sc-row.rwz-ssum { cursor: default; background: rgba(201,169,97,0.05); border-top: 1px solid rgba(201,169,97,0.22); }
.rwz-sc-row.rwz-ssum:hover { background: rgba(201,169,97,0.05); }
.rwz-sc-row.rwz-ssum .rwz-ssum-lbl { font-size: 9.5px; font-weight: 700; letter-spacing: 0.04em; color: var(--gold, #c9a961); white-space: nowrap; overflow: visible !important; }
.rwz-sc-row.rwz-ssum .rwz-ssum-num { font-size: 13px; font-weight: 600; color: #efe9da; font-variant-numeric: tabular-nums; }
.rwz-sc-row.rwz-ssum .rwz-ssum-dash { font-size: 12px; color: #6f6a5e; }
.rwz-sc-row.rwz-ssum.rwz-ssum-total { background: rgba(201,169,97,0.10); border-top: 1px solid rgba(201,169,97,0.40); }
.rwz-sc-row.rwz-ssum.rwz-ssum-total .rwz-ssum-num { color: var(--gold-bright, #e1c47e); font-weight: 700; }

/* ===== DEL 1+2 (2026-07-23): Android edge-to-edge, safe areas og global scrollarkitektur — AUTORITATIV =====
   Hvorfor forrige losning ikke virket: env(safe-area-inset-*) er 0 i vanlig Chrome-fane pa Android
   (nettleseren handterer selv systemfeltene) og blir forst ikke-null i edge-to-edge (Chrome 135+
   gestnavigasjon / installert WebAPK pa Android 15). Padding basert pa env() var derfor usynlig pa
   enheter uten edge-to-edge, og der edge-to-edge VAR aktivt gikk bakgrunnen ikke helt ut fordi
   html/body manglet sammenhengende bakgrunn. Referanse: developer.chrome.com/docs/css-ui/edge-to-edge */
:root {
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-right: env(safe-area-inset-right, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --safe-left: env(safe-area-inset-left, 0px);
  /* Chrome 135+: maks-verdien av bottom-inset — stabil scroll-slutt uansett dynamisk chin */
  --safe-bottom-max: env(safe-area-max-inset-bottom, env(safe-area-inset-bottom, 0px));
  --app-background: #060d0a;
}
/* 1.2: EN sammenhengende appbakgrunn pa skallnivaene — gar helt til skjermkanten bak systemfeltene */
html, body { min-height: 100%; background: var(--app-background); }
body { min-height: 100vh; min-height: 100dvh; }
/* 1.4: aldri 100vh alene pa mobil */
.app { min-height: 100vh; min-height: 100dvh; }

/* 2.1: Global header star ALLTID fast overst — brand-raden og fanene er TO koordinerte
   sticky-elementer (ingen wrapper, sa 4A-strukturkontrakten "direct child" bestar).
   Transparente i toppstilling (godkjent referanse); dekkende mork flate forst nar
   brukeren har scrollet, slik at innhold aldri er lesbart gjennom headeren. */
.app > header {
  position: sticky !important; top: 0 !important; z-index: 3501 !important;
  padding-top: var(--safe-top);
  transition: background-color 0.25s ease;
  background-color: rgba(6, 13, 10, 0) !important;
}
.app > .tabs-wrap {
  position: sticky !important; top: var(--fr-header-h, 64px) !important; z-index: 3500 !important;
  transition: background-color 0.25s ease;
  background: rgba(6, 13, 10, 0) !important;
  margin-bottom: 10px !important; padding-top: 4px;
}
body.fr-scrolled .app > header,
body.fr-scrolled .app > .tabs-wrap {
  background-color: rgba(6, 13, 10, 0.94) !important;
  background-image: none !important;
}
body.fr-scrolled .app > .tabs-wrap { box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35); }

/* 2.3: scroll-slutt — siste interaktive element skal kunne scrolles helt over Androids systemomrade */
.app { padding-bottom: calc(90px + var(--safe-bottom-max)) !important; }
@media (max-width: 560px) { .app { padding-bottom: calc(80px + var(--safe-bottom-max)) !important; } }

/* Faste bunnkontroller og bottom sheets: over gestomradet, uten permanent hoy stripe */
.cd-drop { bottom: calc(80px + var(--safe-bottom-max)) !important; }
.modal { max-height: calc(100dvh - 24px - var(--safe-top) - var(--safe-bottom)); overflow-y: auto; }

/* DEL 3: Course & Conditions — kompakt som standard, naturlig dokumentscroll nar innhold
   ekspanderer (manuelt vaer, bets-veldere). Ingen hoydelas som klipper innhold. */
#rwz-step-2 { padding-bottom: calc(24px + var(--safe-bottom-max)); }
#rwz-step-3 { padding-bottom: 0 !important; }

/* ===== DEL 4 (2026-07-23, KORRIGERT 2026-07-24): Scorecard intern scrolling — AUTORITATIV =====
   Scrolleren er nå selve rad-gridet (.rwz-sc-grid, hoyde satt av rwzFitScorecardViewport).
   Scan + scoreoppsummering + kolonneheader star fast OVER scrolleren, Cancel/Save under.
   Radene BEGYNNER under oppsummeringen — derfor trengs ingen maskering, og den gamle
   svarte flaten (solide box-shadow-barer pa .rwz-sc-stat) er FJERNET. */
#rwz-step-3 { min-height: 0; min-width: 0; overscroll-behavior-y: contain; }
#rwz-step-3 > #r-input-hbh { padding-bottom: 0; }
#rwz-step-3 .rwz-scorecard, #rwz-step-3 #r-hbh-scorecard { overflow: visible !important; }
#rwz-step-3 .rwz-sc-grid, #rwz-step-3 .rwz-sc-grid.winnerN {
  overflow-y: auto !important; overflow-x: hidden !important;
  overscroll-behavior-y: contain; min-height: 0;
}
/* Kompakt scoreoppsummering — KUN det avrundede kortet har flate og gullramme.
   Omradet rundt er transparent (ingen plate, ingen pseudo-lag, ingen skygge-barer). */
#rwz-step-3 .rwz-sc-stat { position: static; z-index: auto; margin-top: 0 !important;
  /* SCORECARD PATCH: 20 % transparent BAKGRUNN (alpha 0.8) — aldri opacity pa boksen,
     sa tekst/tall/ikoner beholder full opasitet. */
  background: rgba(4, 11, 9, 0.8) !important;
  /* Gullring pa oppsummeringen — samme rammefamilie som scorecard-tabellen (godkjent 2026-07-24) */
  border: 1px solid rgba(201, 169, 97, 0.45) !important; border-radius: 12px !important;
  box-shadow: none !important; }
#rwz-step-3 .rwz-sc-stat::before, #rwz-step-3 .rwz-sc-stat::after { content: none !important; }
/* Kolonneheaderen (HOLE|PAR|EXTRA|SCORE|RESULT / HOLE|PAR|navn) star fast overst i
   rad-scrolleren. Nesten opak sort/morkegronn flate med diskret gullkant. */
#rwz-step-3 .rwz-sc-head, #rwz-step-3 .rwz-sc-head.winnerN {
  position: sticky; top: 0; z-index: 30; isolation: isolate;
  background: rgb(3, 9, 7) !important;
  border-bottom: 1px solid rgba(201,169,97,0.38) !important;
  box-shadow: 0 6px 14px rgba(0,0,0,0.35);
}
/* Spillernavn i kolonneheader: fornavn skal vises KOMPLETT (aldri "Mariu…") */
#rwz-step-3 .rwz-sc-head.winnerN > div { overflow: visible; text-overflow: clip; white-space: nowrap; min-width: 0; }

/* ===== DEL 6 (2026-07-23): Rivalry — kompakt W/L-linje pa rivalkortet ===== */
.rv-c2-wl { margin-top: 3px; font-size: 10px; font-weight: 600; letter-spacing: 0.10em;
  color: var(--gold, #c9a961); font-variant-numeric: tabular-nums; }

/* ===== DEL 9 (2026-07-23): Match Play-segmentbar ===== */
.rwz-mp-bar { margin: 8px 0 10px; padding: 10px 12px; border-radius: 12px;
  background: linear-gradient(180deg, rgba(5,18,14,0.58), rgba(3,12,10,0.42));
  border: 1px solid rgba(201,169,97,0.30); }
.rwz-mp-title { font-size: 10px; letter-spacing: 0.18em; color: var(--gold, #c9a961); font-weight: 700; margin-bottom: 6px; }
.rwz-mp-seg { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; padding: 3px 0; }
.rwz-mp-seg .l { font-size: 10.5px; letter-spacing: 0.06em; text-transform: uppercase; color: #b9b3a4; }
.rwz-mp-seg b { font-size: 12.5px; color: #efe9da; font-weight: 600; }
.rwz-mp-seg.active b { color: var(--gold-bright, #e1c47e); }
.rwz-mp-seg i { font-size: 10px; color: var(--gold, #c9a961); font-style: normal; white-space: nowrap; }
.rwz-mp-note { margin-top: 4px; font-size: 11px; color: #b9b3a4; }
.rwz-mp-actions { display: flex; gap: 8px; margin-top: 8px; }
.rwz-mp-actions .rwz-mw-btn { flex: 1; }

/* ===== DEL 2/3 (2026-07-23): Tee Off-fanen ma kunne scrolle vertikalt ved ekspandert innhold.
   Tidligere "single-screen"-las (overflow: hidden pa body/html for data-tab="round") blokkerte
   legitim scrolling nar manuelt vaer/bets-veldere apnes pa Course & Conditions. Kompakte steg
   fyller uansett ikke hoyden, sa det finnes ingen scrollbar i normaltilstand. */
body[data-tab="round"] { overflow-y: auto !important; overflow-x: hidden !important; }
html:has(#tab-round:not([style*="none"])), html[data-fgltab="round"] { overflow-y: auto !important; overflow-x: hidden !important; }


/* ===== 2026-07-24: luft mellom global nav og forste sideinnhold (funn: '+ New rivalry' la i headeren) ===== */
#tab-rivalry { padding-top: 12px; }
#tab-feed { padding-top: 10px; }
#tab-fgl { padding-top: 8px; }


/* ===== SCORECARD PATCH 2026-07-24 — setup-chips, statuslinjer, statbar ===== */
/* Fem spilleformer som kompakte chips (Stableford forst) — aldri hoye kort. */
#r-form-golf .rnd-score-chips { display: flex !important; flex-wrap: wrap; gap: 6px !important; margin-bottom: 10px !important; grid-template-columns: none !important; }
#r-form-golf .rnd-score-chips .rnd-score-btn { flex: 1 1 auto; padding: 8px 12px !important; text-align: center; border-radius: 999px; min-height: 36px; }
#r-form-golf .rnd-score-chips .rnd-score-name { font-size: 12.5px; font-weight: 700; white-space: nowrap; }
/* Kompakt felles matchstatuslinje (Match Play / flerveis poengstatus). */
.rwz-mp-bar.rwz-mp-slim { padding: 6px 10px; text-align: center; }
.rwz-mp-bar.rwz-mp-slim b { font-size: 12.5px; letter-spacing: 0.04em; color: var(--gold-bright, #e1c47e); }
/* Solo Stableford: diskret "pts"-suffiks etter hovedverdien. */
.rwz-solo-pts { font-size: 15px; font-weight: 600; color: #cfc9ba; letter-spacing: 0.05em; }
/* Statbar: hovedverdi + enhet ("6 strokes" / "12 pts") pa samme linje. */
.rwz-sc-stathead i { font-size: 10px; font-style: normal; color: var(--muted, #9a937f); margin-left: 3px; }
/* Sluttvisning: modus-overskrift */
.rss-mode-headline { font-size: 21px; line-height: 1.25; }


/* ============================================================
   CLUBHOUSE V4 (MASTER TASK 2026-07-24)
   Ny mork V4-bakgrunn + bokser gjenskapt fra raakuttene som responsive
   HTML/CSS-komponenter i normal flyt (vertical-content). Delte avatarer.
   ============================================================ */
/* --- Delt avatarkomponent: foto -> ellers genererte initialer --- */
.fr-av { display:inline-flex; align-items:center; justify-content:center; vertical-align:middle; border-radius:50%; overflow:hidden; flex:0 0 auto; }
.fr-av.fr-av-ini {
  background: radial-gradient(circle at 35% 30%, #16211a 0%, #0a120d 62%, #060b08 100%);
  border: 1px solid rgba(201,169,97,0.55);
  color: #f1e8d2; font-family: 'Playfair Display', Georgia, serif; font-weight: 600;
  letter-spacing: 0.04em; line-height: 1; text-align: center;
  box-shadow: 0 2px 6px rgba(0,0,0,0.45);
  -webkit-user-select: none; user-select: none;
}
.fr-av.fr-av-img { border: 1px solid rgba(201,169,97,0.45); box-shadow: 0 2px 6px rgba(0,0,0,0.45); }
.rv-c2-av .rv-av-ini, .feed-av-ini { font-family:'Playfair Display', Georgia, serif; }

/* --- Bakgrunn: den permanente Clubhouse-bakgrunnen (Bakgrunn.png = clubhouse-bg.jpg)
       beholdes bak HELE siden. V4 gjelder kun boksene, aldri sidebakgrunnen. --- */

/* --- V4-grid: normal flyt, boksene beholder raakuttenes proporsjoner --- */
#dash-clubhouse-tail .chd.chd-v4 {
  aspect-ratio: auto !important; width: 100% !important; max-height: none !important;
  display: flex !important; flex-direction: column !important; gap: 9px !important;
  margin: 6px 0 12px !important; container-type: inline-size;
}
.chd-v4 .chd-box { position: relative !important; inset: auto !important; width: 100% !important;
  border-radius: 14px; overflow: hidden; box-shadow: 0 10px 26px rgba(0,0,0,0.45);
  border: 1px solid rgba(201,169,97,0.42);
}
.chd-v4 .chd-box { background-size: cover !important; background-position: center !important; }

/* Record-hero: stadionbildet fra 01-raakuttet; tekst pa den morke venstresonen */
.chd-v4 .chd-c-record { aspect-ratio: 960/290 !important; display:block !important; }
.chd-v4 .chd-c-record .chd-rec-copy { position:absolute; left:5%; top:14%; display:flex; flex-direction:column; align-items:flex-start; text-align:left; }
.chd-v4 .chd-c-record .chd-rec-eyebrow { font-size: clamp(9px, 2.6cqw, 12px); letter-spacing: .16em; color: #E7C97C; font-weight: 700; }
.chd-v4 .chd-c-record .chd-rec-context { font-size: clamp(8px, 2.2cqw, 11px); color: #cfc9ba; margin-top: 2px; }
.chd-v4 .chd-c-record .chd-rec-score { position:absolute; left:5%; top:36%; right:auto; display:flex; flex-direction:column; align-items:flex-start; }
.chd-v4 .chd-c-record .chd-rec-val { font-family:'Playfair Display', Georgia, serif; font-weight:600; color:#f7f2e6; font-size: clamp(30px, 11cqw, 46px); line-height:1; text-shadow: 0 2px 10px rgba(0,0,0,0.65); }
.chd-v4 .chd-c-record .chd-rec-score--long .chd-rec-val { font-size: clamp(24px, 8.2cqw, 36px); }
.chd-v4 .chd-c-record .chd-rec-rule { display:block; width: 58%; height:1px; background: linear-gradient(90deg, rgba(201,169,97,0.85), rgba(201,169,97,0)); margin-top: 6px; }

/* Kompakt statusboks — mellom Record og Recent Rival Activity. Kun EN tilstand
   (hoyest prioritet) vises: ikon + tekst + chevron, bla/gronn state-aksent. */
.chd-v4 .chd-c-challenge { background: linear-gradient(180deg, rgba(6,12,9,0.82), rgba(3,8,6,0.86)) !important; min-height: 42px; display:block !important; }
.chd-v4 .chd-c-challenge .chd-strip { display:block; }
.chd-v4 .chd-strip-item { display:flex; flex-direction:row; align-items:center; gap:10px; width:100%; height:100%; background:transparent; border:0; color:inherit; text-align:left; padding: 7px 12px; cursor:pointer; min-height:42px; font-family:inherit; }
.chd-v4 .chd-strip-ic { flex:0 0 auto; width:20px; height:20px; display:flex; align-items:center; justify-content:center; filter: drop-shadow(0 0 5px rgba(0,0,0,0.4)); }
.chd-v4 .chd-strip-ic svg { width:100%; height:100%; }
.chd-v4 .chd-strip-txt { flex:1 1 auto; min-width:0; }
.chd-v4 .chd-strip-item b { display:block; font-size: 11.5px; letter-spacing:.1em; text-transform:uppercase; font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.chd-v4 .chd-strip-item span { display:block; font-size: 11.5px; color:#d8d2c2; margin-top:1px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.chd-v4 .chd-strip-chev { flex:0 0 auto; color:rgba(201,169,97,0.75); font-size:17px; line-height:1; }
/* State-aksenter: aktiv runde = bla; approval / start = gronn */
.chd-v4 .chd-strip-item.st-active .chd-strip-ic, .chd-v4 .chd-strip-item.st-active b { color:#7fb2e5; }
.chd-v4 .chd-strip-item.st-approval .chd-strip-ic, .chd-v4 .chd-strip-item.st-approval b { color:#7fd6a8; }
.chd-v4 .chd-strip-item.st-none .chd-strip-ic, .chd-v4 .chd-strip-item.st-none b { color:#7fd6a8; }
.chd-v4 .chd-strip-item.st-none b { white-space:normal; }

/* Recent Rival Activity — panel fra 03-raakuttet. KORRIGERINGSPASS: lavere boks,
   mindre semibold navn pa EN linje (bredere navneomrade, smalere gap rundt avatar). */
.chd-v4 .chd-c-activity { background: linear-gradient(180deg, rgba(7,11,9,0.88), rgba(3,7,5,0.9)) !important; padding: 8px 10px 8px; min-height: 104px; display:flex; flex-direction:column; }
.cha-head { display:flex; align-items:center; justify-content:space-between; margin: 0 2px 5px; }
.cha-title { font-size: 11px; letter-spacing:.16em; color:#E7C97C; font-weight:700; }
.cha-viewall { background:none; border:0; color:#E7C97C; font-size:12px; cursor:pointer; padding:2px 4px; font-family:inherit; }
.cha-row { display:flex; gap:0; overflow-x:auto; overscroll-behavior-x: contain; flex:1; scrollbar-width:none; }
.cha-row::-webkit-scrollbar { display:none; }
.cha-item { position:relative; flex: 0 0 34%; min-width: 130px; max-width: 176px; background:transparent; border:0; border-right:1px solid rgba(201,169,97,0.35); color:inherit; font-family:inherit; text-align:center; padding: 4px 4px 3px; cursor:pointer; display:flex; flex-direction:column; align-items:center; gap:1px; }
.cha-item:last-child { border-right:0; }
.cha-av { margin-bottom: 1px; }
.cha-name { font-size: 10.5px; font-weight: 600; color:#f3eee1; max-width: 100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; line-height:1.25; }
.cha-state { font-size: 11px; color:#cfc9ba; line-height:1.2; }
.cha-state.cha-live { color:#E7C97C; font-weight:800; letter-spacing:.12em; }
.cha-course { font-size: 9.5px; color:#98917f; max-width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; line-height:1.2; }
.cha-rel { position:absolute; top:2px; right:6px; font-size:11.5px; font-weight:700; font-variant-numeric:tabular-nums; }
.cha-rel.pos { color:#7fb2e5; }   /* positiv net = bla */
.cha-rel.neg { color:#7fd6a8; }   /* negativ net = gronn */
.cha-rel.even { color:#cfc9ba; }  /* jevnt = noytral */
.cha-empty { width:100%; text-align:center; align-self:center; color:#b7b09d; font-size:13px; padding: 16px 0; }
.cha-empty span { display:block; font-size:11px; color:#7d776a; margin-top:3px; }

/* Nav-chips: RIVALRIES / INSIGHTS / TROPHIES — horisontale piller fra 04-06 */
.chd-v4 .chd-c-nav { width: calc((100% - 16px) / 3) !important; aspect-ratio: 316/82 !important;
  display:inline-flex !important; align-items:center !important; justify-content:center !important; gap: 6cqw;
  background: linear-gradient(180deg, rgba(8,12,10,0.9), rgba(4,8,6,0.92)) !important; }
.chd-v4-navrow { display:flex; gap:8px; }
.chd-v4 .chd-c-nav .chd-nav-ic { width: 26%; aspect-ratio: 199/145; background-size:contain; background-repeat:no-repeat; background-position:center; }
.chd-v4 .chd-c-nav .chd-nav-lbl { font-family:'Inter',system-ui,sans-serif; font-size: clamp(9px, 3.4cqw, 13px); letter-spacing:.14em; color:#f3eee1; font-weight:600; }

/* Statrad 1: banestripen (statrow-course) som EN sammenhengende bakgrunn */
.chd-v4 .chd-sr1 { aspect-ratio: 960/170 !important; display:grid !important; grid-template-columns: 1fr 1fr 1fr; }
.chd-v4 .chd-sr1 .chd-sr-sec { position:relative; border-right:1px solid rgba(201,169,97,0.4); display:flex; flex-direction:column; }
.chd-v4 .chd-sr1 .chd-sr-sec:last-child { border-right:0; }
.chd-v4 .chd-sr1 .chd-sr-main { background:none; border:0; color:inherit; font-family:inherit; flex:1; display:flex; flex-direction:column; align-items:center; justify-content:flex-start; padding-top: 9%; cursor:pointer; }
.chd-v4 .chd-sr1 .chd-sr-lab { font-size: clamp(8px, 2.55cqw, 12px); letter-spacing:.14em; color:#E7C97C; font-weight:700; white-space:nowrap; }
.chd-v4 .chd-sr1 .chd-sr-val { font-family:'Playfair Display', Georgia, serif; font-size: clamp(20px, 6.6cqw, 30px); color:#f7f2e6; margin-top: 6%; text-shadow: 0 2px 8px rgba(0,0,0,0.6); }
.chd-v4 .chd-sr-link { position:absolute; bottom:5%; left:50%; transform:translateX(-50%); background:none; border:0; color:rgba(231,201,124,0.85); font-size: clamp(7px, 2cqw, 10px); letter-spacing:.06em; cursor:pointer; font-family:inherit; padding:2px 4px; }

/* Statrad 2: NEMESIS / OWNED COURSE / BEST TROPHY med V4-illustrasjoner */
.chd-v4 .chd-sr2 { aspect-ratio: 960/190 !important; display:grid !important; grid-template-columns: 1fr 1fr 1fr;
  background: linear-gradient(180deg, rgba(7,11,9,0.9), rgba(3,7,5,0.92)) !important; }
.chd-v4 .chd-sr2 .chd-sr-sec { position:relative; border-right:1px solid rgba(201,169,97,0.4); display:flex; }
.chd-v4 .chd-sr2 .chd-sr-sec:last-child { border-right:0; }
.chd-v4 .chd-sr2 .chd-sr-main { background:none; border:0; color:inherit; font-family:inherit; flex:1; display:flex; flex-direction:column; align-items:center; padding-top:7%; cursor:pointer; }
.chd-v4 .chd-sr2 .chd-sr-lab { font-size: clamp(8px, 2.55cqw, 12px); letter-spacing:.14em; color:#E7C97C; font-weight:700; white-space:nowrap; }
.chd-v4 .chd-sr2 .chd-sr-row { display:flex; flex-direction:column; align-items:center; gap:2px; margin-top:5%; }
.chd-v4 .chd-sr2 .chd-sr-ill { width: 34%; aspect-ratio:1; border-radius:50%; background-size:cover; border:1px solid rgba(201,169,97,0.5); }
.chd-v4 .chd-sr2 .chd-sr-ill--free { border-radius:8px; border:0; }
.chd-v4 .chd-sr2 .chd-sr-row--empty .chd-sr-ill { display:none; }
.chd-v4 .chd-sr2 .chd-sr-txt { display:flex; flex-direction:column; align-items:center; }
.chd-v4 .chd-sr2 .chd-sr-name { font-family:'Playfair Display', Georgia, serif; font-size: clamp(10px, 3cqw, 15px); color:#f7f2e6; text-align:center; line-height:1.15; max-width: 30cqw; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.chd-v4 .chd-sr2 .chd-sr-name--empty { color:#b7b09d; font-size: clamp(9px, 2.6cqw, 12.5px); }
.chd-v4 .chd-sr2 .chd-sr-sub { font-size: clamp(7px, 2cqw, 10px); color:#98917f; text-align:center; max-width:30cqw; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }

/* Breakscore: FR-ballen (v6) til venstre, DOM-rader til hoyre */
.chd-v4 .chd-c-breakscore { aspect-ratio: 787/248 !important; }
.chd-v4 .chd-c-breakscore .chd-bg { position:absolute; inset:0; background-size:cover; background-position:center; }
.chd-v4 .chd-c-breakscore .bs-row { position:absolute; height:12%; display:flex; align-items:center; }
.chd-v4 .bs-lab.bs-lab-l { position:absolute; font-size: clamp(9px, 2.9cqw, 14px); color:#EDE7DA !important; }
.chd-v4 .bs-track { position:absolute; height: 5px; background: rgba(255,255,255,0.10); border-radius: 3px; overflow:hidden; }
.chd-v4 .bs-fill { height:100%; background: linear-gradient(90deg, #8a7340, #e1c47e); border-radius:3px; }
.chd-v4 .bs-cnt { position:absolute; right:4%; font-size: clamp(9px, 2.7cqw, 13px); color:#cfc9ba; }
.chd-v4 .bs-cnt b { color:#E7C97C; font-weight:700; margin-right:3px; }

/* Nav-chip-raden: de tre nav-boksene ligger pa samme rad */
#dash-clubhouse-tail .chd.chd-v4 { flex-flow: column nowrap !important; }
.chd-v4 { --v4gap: 8px; }
.chd-v4 .chd-c-nav { align-self:auto; }
.chd-v4 > .chd-c-nav { margin-right: 0 !important; }
@supports (display: flex) {
  #dash-clubhouse-tail .chd.chd-v4 { flex-direction: row !important; flex-wrap: wrap !important; }
  .chd-v4 > .chd-box { flex: 0 0 100%; }
  .chd-v4 > .chd-c-nav { flex: 0 0 calc((100% - 16px) / 3) !important; }
}


/* --- V4 finjustering (runde 2) --- */
/* Header-chip: initialavatar synlig og sentrert i 44px-chippen */
#profile-chip #profile-avatar { display:inline-flex !important; align-items:center; justify-content:center; width:44px !important; height:44px !important; background:transparent !important; }
#profile-chip #profile-avatar .fr-av { width:40px !important; height:40px !important; }
/* Record: eyebrow pa en linje; verdien under konteksten uten overlapp */
.chd-v4 .chd-c-record .chd-rec-eyebrow { white-space: nowrap; }
.chd-v4 .chd-c-record .chd-rec-copy { top: 11% !important; }
.chd-v4 .chd-c-record .chd-rec-score { top: 42% !important; }
/* Nav-chips: tre pa samme rad (gap = 2 x 9px) */
.chd-v4 > .chd-c-nav { flex: 0 0 calc((100% - 18px) / 3) !important; width: calc((100% - 18px) / 3) !important; }
/* Statrad 1: litt hoyere boks + kontrollert typografi og lenkeplassering */
.chd-v4 .chd-sr1 { aspect-ratio: 960/188 !important; }
.chd-v4 .chd-sr1 .chd-sr-main { padding-top: 8% !important; justify-content:flex-start !important; }
.chd-v4 .chd-sr1 .chd-sr-val { font-size: clamp(17px, 5.4cqw, 26px) !important; margin-top: 4% !important; }
.chd-v4 .chd-sr-link { position:absolute !important; bottom: 4% !important; top:auto !important; left:50% !important; right:auto !important; transform:translateX(-50%) !important; width:auto !important; white-space:nowrap; }
/* Statrad 2: illustrasjon + tekst i rekke (ikon venstre, tekst hoyre) som i raakuttene */
.chd-v4 .chd-sr2 { aspect-ratio: 960/200 !important; }
.chd-v4 .chd-sr2 .chd-sr-main { padding-top: 6% !important; }
.chd-v4 .chd-sr2 .chd-sr-ill { width: 30% !important; }


/* --- V4 finjustering (runde 3) --- */
/* Statrad 1: verdi hoyt, lenker nederst uten kollisjon */
.chd-v4 .chd-sr1 .chd-sr-main { padding-top: 5.5% !important; }
.chd-v4 .chd-sr1 .chd-sr-val { margin-top: 1.5% !important; }
.chd-v4 .chd-sr-link { bottom: 2.5% !important; font-size: clamp(7px, 1.9cqw, 9.5px) !important; opacity:.9; }
/* Statrad 2: illustrasjon VENSTRE + tekst HOYRE i hver seksjon (fra raakuttene) */
.chd-v4 .chd-sr2 .chd-sr-row { flex-direction: row !important; align-items:center !important; gap: 5% !important; margin-top: 3% !important; width: 92%; }
.chd-v4 .chd-sr2 .chd-sr-ill { width: 27% !important; min-width: 26px; }
.chd-v4 .chd-sr2 .chd-sr-txt { align-items: flex-start !important; flex: 1; min-width: 0; }
.chd-v4 .chd-sr2 .chd-sr-name { text-align: left !important; max-width: 100% !important; }
.chd-v4 .chd-sr2 .chd-sr-sub { text-align: left !important; max-width: 100% !important; }
.chd-v4 .chd-sr2 .chd-sr-row--empty { justify-content: center; }
.chd-v4 .chd-sr2 .chd-sr-row--empty .chd-sr-txt { align-items: center !important; }
.chd-v4 .chd-sr2 .chd-sr-row--empty .chd-sr-name { text-align:center !important; }


/* ============================================================
   MASTER TASK 2026-07-24 — Insights / Handicap / Rivals / Rivalry Detail /
   CR-Slope-fallback (delt premium designsystem)
   ============================================================ */
/* Sirkulaer lukkeknapp oppe til hoyre (Insights + Handicap) */
.fr-modal-x { position:absolute; top:10px; right:10px; width:34px; height:34px; border-radius:50%;
  background: rgba(6,12,9,0.7); border:1px solid rgba(201,169,97,0.5); color:#e8dfc8; font-size:18px;
  line-height:1; display:inline-flex; align-items:center; justify-content:center; cursor:pointer; z-index:5; font-family:inherit; }
.adv-ins.adv-v4, .hco.hco-v4 { position:relative; }

/* --- PLAYER INSIGHTS (adv-v4): [ikon][tittel+forklaring][hvit verdi], IKKE klikkbar --- */
.adv-v4 .adv-h2 { margin: 2px 0 1px; font-size: 20px; }
.adv-v4 .adv-sub { color: var(--muted,#9a937f); font-size: 12.5px; margin: 0 0 12px; }
.adv-v4 .adv-row { display:flex; align-items:center; gap:11px; padding:10px 12px; margin-bottom:8px;
  background: linear-gradient(180deg, rgba(9,14,11,0.72), rgba(5,9,7,0.78));
  border: 1px solid rgba(201,169,97,0.32); border-radius: 12px; cursor: default; }
.adv-v4 .adv-row-top { display:contents; }
.adv-v4 .adv-ic { width:32px; height:32px; flex:0 0 32px; border-radius:50%; border:1px solid rgba(201,169,97,0.55);
  color: var(--gold,#c9a961); display:inline-flex; align-items:center; justify-content:center; }
.adv-v4 .adv-ic svg { width:17px; height:17px; }
.adv-v4 .adv-mid { flex:1; min-width:0; display:flex; flex-direction:column; gap:1px; }
.adv-v4 .adv-label { font-size:13px; font-weight:600; color:#f3eee1; }
.adv-v4 .adv-explain { font-size:11px; color:#98917f; line-height:1.35; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.adv-v4 .adv-val { flex:0 0 auto; max-width:42%; text-align:right; font-size:14px; font-weight:700; color:#ffffff; font-variant-numeric: tabular-nums; align-self:center; line-height:1.2; }

/* --- HANDICAP (hco-v4) --- */
.hco-v4 .hco-idx { font-family:'Playfair Display', Georgia, serif; font-size:52px; color:#ffffff; text-align:center; line-height:1; margin:6px 0 4px; }
.hco-v4 .hco-idx-sub { text-align:center; color:#9a937f; font-size:12px; }
.hco-v4 .hco-edit-link { display:block; margin: 6px auto 10px; background:none; border:0; color:var(--gold,#c9a961); font-size:12px; cursor:pointer; font-family:inherit; }
.hco-chart-v4 { margin: 2px 0 10px; border:1px solid rgba(201,169,97,0.25); border-radius:12px; padding:6px 4px 2px; background:rgba(5,9,7,0.55); }
.hco-v4 .hco-chips { display:flex; gap:8px; margin-bottom:12px; }
.hco-v4 .hco-chip { flex:1; text-align:center; background:rgba(8,13,10,0.7); border:1px solid rgba(201,169,97,0.3); border-radius:10px; padding:8px 4px; }
.hco-v4 .hco-chip-v { font-size:17px; font-weight:700; color:#ffffff; font-variant-numeric:tabular-nums; }
.hco-v4 .hco-chip-l { font-size:9px; letter-spacing:.12em; color:#9a937f; margin-top:2px; }
/* Kolonneoverskrifter + rader: DATE | COURSE | SCORE | PLAYED TO | VS HANDICAP pa delt grid */
.hco-v4 .hco-rounds-h { display:grid; grid-template-columns:56px 1fr 34px 46px 62px; gap:6px; font-size:8.5px; letter-spacing:.07em; color:var(--gold-dim,#7a6740); padding:0 4px 4px; border-bottom:1px solid rgba(201,169,97,0.25); }
.hco-v4 .hco-rounds.hco-rounds-open { max-height:none !important; overflow:visible !important; }
.hco-v4 .hco-row { grid-template-columns:56px 1fr 34px 46px 62px; }
.hco-v4 .hco-row-course { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; min-width:0; }
/* KORRIGERINGSPASS (7): delt skala + FAST referanselinje for gjeldende handicap.
   Bar-segmentet gar fra referansen til rundens Played to: bedre = gronn (venstre),
   darligere = varm (hoyre), likt = motes ved referansen. */
.hco-v4 .hco-row-bar { position:relative; height:7px; background:rgba(255,255,255,0.07); border-radius:3px; overflow:hidden; align-self:center; }
.hco-v4 .hco-bar-seg { position:absolute; top:1px; bottom:1px; border-radius:2px; }
.hco-v4 .hco-bar-seg.better { background:linear-gradient(90deg, rgba(127,214,168,0.85), rgba(127,214,168,0.45)); }
.hco-v4 .hco-bar-seg.worse { background:linear-gradient(90deg, rgba(217,152,122,0.45), rgba(217,152,122,0.85)); }
.hco-v4 .hco-bar-seg.equal { background:rgba(207,201,186,0.7); }
.hco-v4 .hco-bar-ref { position:absolute; top:-2px; bottom:-2px; width:1.5px; background:rgba(231,201,124,0.9); z-index:1; }
/* Gullmarkoren for "teller mot indeksen" er en SEPARAT indikator ved Played to-verdien */
.hco-v4 .hco-row-diff { position:relative; white-space:nowrap; }
.hco-v4 .hco-count-dot { display:inline-block; width:5px; height:5px; border-radius:50%; background:var(--gold-bright,#e1c47e); margin-left:3px; vertical-align:middle; box-shadow:0 0 4px rgba(225,196,126,0.6); }
.hco-v4 .hco-legend { margin-top:8px; font-size:10.5px; color:#9a937f; text-align:center; }
/* Tap/Enter-tooltip pa trendpunktene */
.hco-chart-v4 { position:relative; }
.hco-chart-v4 .hco-pt { cursor:pointer; outline:none; }
.hco-chart-v4 .hco-pt:focus-visible { stroke:var(--gold,#c9a961); stroke-width:1.5; }
.hco-tip.below { transform:translate(-50%, 12px); }
.hco-tip { position:absolute; transform:translate(-50%, calc(-100% - 10px)); background:rgba(6,10,8,0.97); border:1px solid rgba(201,169,97,0.55);
  border-radius:9px; padding:7px 10px; z-index:5; pointer-events:none; min-width:118px; text-align:left; box-shadow:0 8px 20px rgba(0,0,0,0.55); }
.hco-tip b { display:block; font-size:11px; color:var(--gold-bright,#e1c47e); }
.hco-tip span { display:block; font-size:10.5px; color:#d8d2c2; margin-top:1px; }
.hco-tip .hco-tip-pt { color:#ffffff; font-weight:700; }
.hco-tip i { display:block; font-style:normal; font-size:9.5px; margin-top:2px; color:#9a937f; }
.hco-tip i.yes { color:var(--gold-bright,#e1c47e); }
@media (max-width: 370px) {
  /* Smale skjermer: prioriter Course/Played to/Bar/Date — gross-score vike */
  .hco-v4 .hco-rounds-h, .hco-v4 .hco-row { grid-template-columns:50px 1fr 42px 56px; }
  .hco-v4 .hco-col-score, .hco-v4 .hco-row-total { display:none; }
}

/* --- RIVALS (rv-v4): delt premiumpanel over Clubhouse-bakgrunnen --- */
.rv-v4-panel { background: linear-gradient(180deg, rgba(7,12,9,0.66), rgba(4,8,6,0.72));
  border: 1px solid rgba(201,169,97,0.4); border-radius: 16px; padding: 14px 12px 16px; margin: 4px 0 14px;
  -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); box-shadow: 0 12px 30px rgba(0,0,0,0.45); }
.rv-v4-head { margin: 0 4px 10px; }
.rv-v4-title { font-family:'Playfair Display', Georgia, serif; font-size: 24px; color:#f5efdf; }
.rv-v4-sub { font-size: 12px; color:#9a937f; margin-top:1px; }
.rv-v4-empty { text-align:center; padding: 22px 8px 18px; }
.rv-v4-empty b { display:block; font-size:16px; color:#f3eee1; margin-bottom:5px; }
.rv-v4-empty span { font-size:12.5px; color:#9a937f; line-height:1.5; display:block; max-width:280px; margin:0 auto; }
.rv-addrival { display:block; width:100%; margin-top:10px; padding:13px; background:transparent;
  border:1px solid rgba(201,169,97,0.6); border-radius:12px; color:var(--gold-bright,#e1c47e);
  font-size:14px; font-weight:700; cursor:pointer; font-family:inherit; }
.rv-card2.rv-v4 { padding-bottom: 8px; }
.rv-v4 .rv-c2-hcp { font-size: 11.5px; color:#cfc9ba; margin-top:1px; }
.rv-v4 .rv-c2-chev { transition: transform .18s ease; }
.rv-v4 .rv-c2-chev.open { transform: rotate(90deg); }
.rv-v4 .rv-c2-meta2 { display:flex; justify-content:space-between; gap:10px; padding: 4px 12px 4px 12px; }
.rv-v4 .rv-m2 { display:flex; flex-direction:column; gap:1px; min-width:0; }
.rv-v4 .rv-m2 i { font-style:normal; font-size:9px; letter-spacing:.12em; color:var(--gold-dim,#7a6740); }
.rv-v4 .rv-m2 b { font-size:14px; font-weight:700; color:#ffffff; font-variant-numeric:tabular-nums; white-space:nowrap; }
.rv-v4 .rv-m2-r { text-align:right; align-items:flex-end; }

/* --- RIVALRY DETAIL (inline scouting report) --- */
/* KORRIGERINGSPASS 2026-07-24: Rivalry Detail som premium EN-SKJERMS overlaykort.
   Kompakte seksjoner uten tomrom; 4 like periodekort; 5 kompakte faktorkort. */
.rvd-overlay { position:fixed; inset:0; z-index:1200; background:rgba(2,5,4,0.74); -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px);
  display:flex; align-items:center; justify-content:center; padding: max(10px, env(safe-area-inset-top)) 10px max(10px, env(safe-area-inset-bottom)); }
.rvd-card { position:relative; width:min(100%, 430px); max-height:calc(100dvh - 20px); overflow-y:auto; overscroll-behavior:contain;
  background: linear-gradient(180deg, rgba(9,14,11,0.97), rgba(4,8,6,0.98)); border:1px solid rgba(201,169,97,0.5); border-radius:16px;
  padding: 12px 12px 12px; box-shadow: 0 18px 50px rgba(0,0,0,0.6); scrollbar-width:none; }
.rvd-card::-webkit-scrollbar { display:none; }
.rvd-card .fr-modal-x { position:absolute; top:8px; right:8px; z-index:2; }
.rv-detail-v4 { padding: 0 2px 2px; }
.rv-detail-v4 .rv-dt-head { display:flex; align-items:center; gap:8px; justify-content:space-between; margin: 2px 20px 6px; }
.rv-detail-v4 .rv-dt-names { flex:1; text-align:center; min-width:0; }
.rv-detail-v4 .rv-dt-names b { font-family:'Playfair Display', Georgia, serif; font-size:14px; color:#f5efdf; }
.rv-detail-v4 .rv-dt-names i { font-style:italic; color:var(--gold,#c9a961); margin:0 5px; font-size:11px; }
.rv-detail-v4 .rv-dt-verdict { font-size:11px; color:#cfc9ba; margin-top:2px; }
.rv-detail-v4 .rv-dt-rounds { display:flex; align-items:center; justify-content:center; gap:8px;
  background: linear-gradient(180deg, rgba(10,15,12,0.55), rgba(6,10,8,0.62)); border:1px solid rgba(201,169,97,0.3); border-radius:10px; padding:6px 10px; }
.rv-detail-v4 .rv-dt-rounds-l { font-size:9px; letter-spacing:.16em; color:var(--gold-dim,#8a7340); text-transform:uppercase; }
.rv-detail-v4 .rv-dt-rounds b { font-size:16px; font-weight:700; color:#fff; line-height:1; }
.rv-detail-v4 .rv-exp-stats.rv-dt-grid { display:grid !important; gap:5px; margin: 2px 0 0; }
.rv-detail-v4 .rv-exp-stats.rv2col.rv-dt-grid { grid-template-columns:1fr 1fr !important; }
.rv-detail-v4 .rv-exp-stats.rv3col.rv-dt-grid { grid-template-columns:repeat(3,1fr) !important; }
.rv-detail-v4 .rv-exp-stats.rv4col.rv-dt-grid { grid-template-columns:repeat(4,1fr) !important; }
.rv-detail-v4 .rv-exp-stats.rv5col.rv-dt-grid { grid-template-columns:repeat(5,1fr) !important; }
.rv-detail-v4 .rv-dt-grid .rv-exp-cell { background: linear-gradient(180deg, rgba(10,15,12,0.55), rgba(6,10,8,0.62));
  border:1px solid rgba(201,169,97,0.3); border-radius:9px; padding:6px 6px 5px; min-width:0; text-align:left; }
.rv-detail-v4 .rv-dt-grid .rv-exp-l { font-size:8px; letter-spacing:.09em; color:var(--gold-dim,#8a7340); text-transform:uppercase; line-height:1.25; margin-top:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.rv-detail-v4 .rv-dt-grid .rv-exp-v { font-family:'Inter',system-ui,sans-serif; font-size:13px; font-weight:700; color:#ffffff; margin-top:2px; line-height:1.18; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.rv-detail-v4 .rv-dt-grid .rv-exp-s { font-size:9.5px; color:#9a937f; margin-top:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.rv-detail-v4 .rv-sec-h { font-size:9.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--gold,#c9a961); margin: 8px 2px 4px; padding:0; border:0; font-weight:700; }
.rv-detail-v4 .rv-dt-grid.rv4col .rv-exp-cell, .rv-detail-v4 .rv-dt-grid.rv5col .rv-exp-cell { text-align:center; padding:5px 3px 4px; }
.rv-detail-v4 .rv-dt-grid.rv4col .rv-exp-l, .rv-detail-v4 .rv-dt-grid.rv5col .rv-exp-l { white-space:normal; font-size:7.5px; min-height:2.6em; display:flex; align-items:center; justify-content:center; text-align:center; }
.rv-detail-v4 .rv-dt-grid.rv4col .rv-exp-v, .rv-detail-v4 .rv-dt-grid.rv5col .rv-exp-v { font-size:12px; }
.rv-detail-v4 .rv-dt-grid.rv4col .rv-exp-s, .rv-detail-v4 .rv-dt-grid.rv5col .rv-exp-s { font-size:9px; }
.rv-detail-v4 .rv-dt-grid.rv3col .rv-exp-cell { text-align:center; }
.rv-detail-v4 .rv-dt-grid.rv3col .rv-exp-l { white-space:normal; min-height:2.4em; display:flex; align-items:center; justify-content:center; text-align:center; }
@media (max-width: 374px) {
  .rv-detail-v4 .rv-exp-stats.rv5col.rv-dt-grid { gap:3px; }
  .rv-detail-v4 .rv-dt-grid.rv5col .rv-exp-l { font-size:7px; }
}

/* --- CR/Slope-fallback: vanlig kompakt skjema (10.3) --- */
.cdn-form { background: rgba(8,13,10,0.6); border:1px solid rgba(201,169,97,0.3); border-radius:12px; padding:10px 12px; }
.cdn-msg { font-size:12.5px; color:#e8dfc8; line-height:1.45; }
.cdn-msg span { display:block; font-size:11.5px; color:#9a937f; }
.cdn-fields { display:flex; gap:8px; margin-top:8px; flex-wrap:wrap; }
.cdn-f { flex:1 1 120px; display:flex; flex-direction:column; gap:3px; }
.cdn-f span { font-size:10px; letter-spacing:.08em; color:var(--gold-dim,#8a7340); text-transform:uppercase; }
.cdn-f input { background:rgba(4,8,6,0.8); border:1px solid rgba(201,169,97,0.35); border-radius:8px; color:#fff; padding:8px 10px; font-size:14px; width:100%; box-sizing:border-box; }
.cdn-state { font-size:11px; color:#9a937f; margin-top:6px; min-height:14px; }


/* MASTER TASK: kun EN + Add rival-handling — toppknappen er fjernet fra Rivals */
#rv-new { display: none !important; }
/* Inline-ekspandert rivalkort skal ikke legge seg bak den faste headeren */
.rv-card2.rv-v4 { scroll-margin-top: calc(var(--fr-headerline, 132px) + 10px); }
/* Insights-tittel kolliderer ikke med lukkeknappen */
.adv-v4 .adv-h2 { padding-right: 44px; }
.hco-v4 .section-eyebrow { padding-right: 40px; }


/* --- V4 finjustering (runde 4): ID-spesifisitet mot premium-arven --- */
#dash-clubhouse-tail .chd.chd-v4 > .chd-box {
  border: 1px solid rgba(201,169,97,0.58) !important;
  position: relative !important; inset: auto !important;
  margin-top: 0 !important; grid-column: auto !important;
}
#dash-clubhouse-tail .chd.chd-v4 .chd-sr1,
#dash-clubhouse-tail .chd.chd-v4 .chd-sr2 {
  display: grid !important; grid-template-columns: 1fr 1fr 1fr !important;
}
#dash-clubhouse-tail .chd.chd-v4 .chd-sr1 .chd-sr-sec,
#dash-clubhouse-tail .chd.chd-v4 .chd-sr2 .chd-sr-sec { flex: none !important; width: auto !important; }
/* Padding i px/cqw (container) — aldri %-av-seksjonsbredde (ulik bredde ga ulik topplinje) */
#dash-clubhouse-tail .chd.chd-v4 .chd-sr1 .chd-sr-main { padding-top: clamp(6px, 1.9cqw, 11px) !important; }
#dash-clubhouse-tail .chd.chd-v4 .chd-sr2 .chd-sr-main { padding-top: clamp(6px, 1.7cqw, 10px) !important; }
#dash-clubhouse-tail .chd.chd-v4 .chd-sr1 .chd-sr-val { margin-top: clamp(2px, 1cqw, 6px) !important; }
/* Nav-chips: V4-pilleproporsjon (316/82), ikon + label pa rad */
#dash-clubhouse-tail .chd.chd-v4 > .chd-c-nav {
  height: auto !important; aspect-ratio: 316/82 !important;
  flex-direction: row !important; gap: 3cqw !important; padding: 0 2cqw !important;
  background: linear-gradient(180deg, rgba(8,12,10,0.9), rgba(4,8,6,0.92)) !important;
}
#dash-clubhouse-tail .chd.chd-v4 > .chd-c-nav .chd-nav-ic { width: 8.5cqw !important; height: auto !important; aspect-ratio: 199/145 !important; }


/* --- V4 finjustering (runde 5): etiketter klippes aldri --- */
.chd-v4 .chd-sr1 .chd-sr-lab, .chd-v4 .chd-sr2 .chd-sr-lab {
  letter-spacing: .06em !important; font-size: clamp(7.5px, 2.25cqw, 11px) !important;
  max-width: 100%; overflow: visible !important;
}


/* --- V4 finjustering (runde 6): nav-etiketter, statrad-lenker, rad-2-tekst --- */
#dash-clubhouse-tail .chd.chd-v4 > .chd-c-nav { gap: 2cqw !important; padding: 0 1.4cqw !important; }
.chd-v4 .chd-c-nav .chd-nav-lbl { font-size: clamp(8px, 2.7cqw, 12px) !important; letter-spacing: .08em !important; white-space: nowrap !important; overflow: visible !important; }
.chd-v4 .chd-c-nav .chd-nav-ic { flex: 0 0 auto; }
/* Statrad 1: hoyere boks — verdi og lenke pa hver sin linje */
.chd-v4 .chd-sr1 { aspect-ratio: 960/212 !important; }
#dash-clubhouse-tail .chd.chd-v4 .chd-sr1 .chd-sr-main { padding-top: clamp(7px, 2.2cqw, 13px) !important; }
.chd-v4 .chd-sr-link { bottom: 4% !important; }
/* Statrad 2: hoyere boks + tekst som aldri klippes */
.chd-v4 .chd-sr2 { aspect-ratio: 960/218 !important; }
.chd-v4 .chd-sr2 .chd-sr-ill { min-width: 30px !important; }
.chd-v4 .chd-sr2 .chd-sr-name { font-size: clamp(10px, 2.8cqw, 14px) !important; -webkit-line-clamp: 2 !important; }
.chd-v4 .chd-sr2 .chd-sr-sub { -webkit-line-clamp: 2 !important; }
.chd-v4 .chd-sr2 .chd-sr-row { margin-top: 2.5% !important; }

/* Statrad 1: verdien holder linjehoyde 1 og lenken ligger helt nederst */
.chd-v4 .chd-sr1 .chd-sr-val { line-height: 1 !important; }
.chd-v4 .chd-sr-link { bottom: 2% !important; }

/* ============================================================
   CLUBHOUSE CROPS (2026-07-25) — boksene ER raakuttene fra
   Clubhouse bokser/V4/raw-crops; Clubbhus.png er layoutfasiten.
   Mockup: 1023 bred, marg 15 (1.47%), innhold 987, gap ~15 (1.52%).
   Native proporsjoner via aspect-ratio = kuttets pikselmal.
   ============================================================ */
#dash-clubhouse-tail .chd.chdX {
  position: static !important; inset: auto !important;
  width: 100% !important; height: auto !important; max-height: none !important;
  aspect-ratio: auto !important; transform: none !important;
  display: flex !important; flex-direction: column !important;
  gap: 1.52cqw; margin: 0.4cqw 0 3cqw; padding: 0 !important;
  /* Fullbredde som Clubbhus.png: mockup-marg 1.47vw — trekk fra app-shellens 12px */
  margin-inline: clamp(-12px, calc(1.5vw - 12px), 0px);
  container-type: inline-size;
}
.chdX .chd-box {
  position: relative !important; inset: auto !important;
  width: 100% !important; height: auto !important;
  background-color: transparent !important;
  background-size: 100% 100% !important; background-position: center !important; background-repeat: no-repeat !important;
  border: 0 !important; border-radius: 1.55cqw; overflow: hidden;
  box-shadow: none !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important;
  padding: 0 !important; margin: 0 !important; display: block !important;
  container-type: inline-size;
}
.chdX .chd-box::before, .chdX .chd-box::after { content: none !important; }
/* Kuttenes native proporsjoner */
.chdX .chdx-hero { aspect-ratio: 987/314 !important; }
.chdX .chdx-activity { aspect-ratio: 987/275 !important; }
.chdX .chdx-strip { aspect-ratio: 987/194 !important; }
.chdX .chdx-strip2 { aspect-ratio: 987/202 !important; }
.chdX .chdx-breakscore { aspect-ratio: 987/185 !important; }
.chdX .chdx-nav-riv { aspect-ratio: 316/82 !important; }
.chdX .chdx-nav-ins { aspect-ratio: 309/82 !important; }
.chdX .chdx-nav-tro { aspect-ratio: 334/82 !important; }
/* Statusstripen (kun aktiv/approvals) beholder sitt V3-utseende */
.chdX .chd-c-challenge { aspect-ratio: 987/100 !important; background-size: 100% 100% !important; }
/* Navraden: eksakte mockup-bredder 316/309/334 med 14px-gap (1.42%) */
.chdX .chdx-navrow { display: flex; gap: 1.42%; width: 100%; }
.chdX .chdx-navrow .chdx-nav { flex: 0 0 auto; }
.chdX .chdx-nav-riv { width: 32.02% !important; }
.chdX .chdx-nav-ins { width: 31.31% !important; }
.chdX .chdx-nav-tro { width: 33.84% !important; }
/* Hero: dynamisk record pa den morke venstresonen (kun DOM-verdier — artwork bakt) */
.chdX .chdx-hero .chd-rec-copy { position:absolute; left:4.6%; top:9%; width:30%; display:flex; flex-direction:column; align-items:flex-start; text-align:left; }
.chdX .chdx-hero .chd-rec-eyebrow { font-size: clamp(8px, 2.4cqw, 12px); letter-spacing: .16em; color: #E7C97C; font-weight: 700; }
.chdX .chdx-hero .chd-rec-context { font-size: clamp(7.5px, 2.0cqw, 11px); color: #cfc9ba; margin-top: 0.6cqw; }
.chdX .chdx-hero .chd-rec-score { position:absolute; left:4.6%; top:47%; display:flex; flex-direction:column; align-items:flex-start; }
.chdX .chdx-hero .chd-rec-val { font-family:'Playfair Display', Georgia, serif; font-weight:600; color:#f7f2e6; font-size: clamp(26px, 10cqw, 46px); line-height:1; text-shadow: 0 2px 10px rgba(0,0,0,0.7); font-variant-numeric: tabular-nums; }
.chdX .chdx-hero .chd-rec-score--long .chd-rec-val { font-size: clamp(21px, 7.6cqw, 36px); }
.chdX .chdx-hero .chd-rec-rule { display:block; width: 60%; height:1px; background: linear-gradient(90deg, rgba(201,169,97,0.85), rgba(201,169,97,0)); margin-top: 1.6cqw; }
/* Aktivitet: elementer i de bakte slotene (headeren + delelinjene + View all er bakt) */
.chdX .chdx-activity .cxa-item { position:absolute; top:24%; bottom:6%; background:transparent; border:0; color:inherit; font-family:inherit; cursor:pointer; display:flex; flex-direction:column; align-items:center; justify-content:flex-start; gap:0.5cqw; padding:1cqw 0.6cqw 0; min-width:0; }
.chdX .cxa-av { flex:0 0 auto; }
.chdX .cxa-av .fr-av { width: 6cqw !important; height: 6cqw !important; font-size: 2.2cqw !important; }
.chdX .cxa-name { font-size: clamp(7px, 2.1cqw, 11px); font-weight:600; color:#f3eee1; max-width:96%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.chdX .cxa-state { font-size: clamp(6.5px, 2.0cqw, 10.5px); color:#cfc9ba; }
.chdX .cxa-state.cxa-live { color:#E7C97C; font-weight:800; letter-spacing:.12em; }
.chdX .cxa-course { font-size: clamp(6px, 1.8cqw, 9.5px); color:#98917f; max-width:96%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.chdX .cxa-rel { position:absolute; top:4%; right:6%; font-size: clamp(6.5px, 2.0cqw, 10.5px); font-weight:700; font-variant-numeric:tabular-nums; }
.chdX .cxa-rel.pos { color:#7fb2e5; }
.chdX .cxa-rel.neg { color:#7fd6a8; }
.chdX .cxa-rel.even { color:#cfc9ba; }
.chdX .cxa-empty { position:absolute; left:8%; right:8%; top:52%; transform:translateY(-50%); text-align:center; color:#b7b09d; font-size: clamp(8px, 2.6cqw, 13px); pointer-events:none; }
.chdX .cxa-viewall { position:absolute; top:0; right:0; width:18%; height:24%; background:transparent; border:0; cursor:pointer; }
/* Striper: usynlige seksjonsknapper over de bakte seksjonene + DOM-verdier */
.chdX .cxs-sec { position:absolute; top:0; bottom:0; background:transparent; border:0; color:inherit; font-family:inherit; cursor:pointer; padding:0; }
.chdX .cxs-1 { left:0; width:34.14%; }
.chdX .cxs-2 { left:34.14%; width:31.21%; }
.chdX .cxs-3 { left:65.35%; width:34.65%; }
.chdX .chd-sr-val { position:absolute; left:50%; top:56%; transform:translate(-50%,-50%); font-family:'Playfair Display', Georgia, serif; font-weight:600; color:#f5efdf; font-size: clamp(17px, 6.2cqw, 30px); line-height:1; font-variant-numeric: tabular-nums; text-shadow: 0 2px 8px rgba(0,0,0,0.6); }
.chdX .cxs-txt { position:absolute; left:5%; right:5%; bottom:4.5%; display:flex; flex-direction:column; gap:0.2cqw; align-items:center; text-align:center; }
.chdX .chd-sr-name { font-family:'Playfair Display', Georgia, serif; font-weight:600; color:#f3eee1; font-size: clamp(8.5px, 2.9cqw, 14px); line-height:1.15; max-width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; text-shadow: 0 1px 6px rgba(0,0,0,0.7); }
.chdX .chd-sr-sub { color:#b3ac99; font-size: clamp(6.5px, 2.1cqw, 10px); line-height:1.2; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; text-shadow: 0 1px 5px rgba(0,0,0,0.7); }
/* Nemesis-seksjonen: silhuetten er bakt til venstre — teksten holder seg mot hoyre */
.chdX .cxs-b.cxs-1 .cxs-txt { left:34%; right:3%; }
/* Breakscore: DOM-tracks + tellere over det patchede kuttet (tittel + Under-etiketter bakt) */
.chdX .chdx-breakscore .bs-row { position:absolute; left:0; right:0; transform:translateY(-50%); height:12%; }
.chdX .chdx-breakscore .bs-lab-sr { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
.chdX .chdx-breakscore .bs-track { position:absolute; left:47.5%; width:30%; top:50%; transform:translateY(-50%); height:38%; max-height:7px; min-height:4px; background:rgba(255,255,255,0.08); border-radius:99px; overflow:hidden; }
.chdX .chdx-breakscore .bs-fill { position:absolute; left:0; top:0; bottom:0; background:linear-gradient(90deg,#8a7340,#e1c47e); border-radius:99px; }
.chdX .chdx-breakscore .bs-cnt { position:absolute; left:79.5%; right:2%; top:50%; transform:translateY(-50%); text-align:left; font-size: clamp(8px, 2.5cqw, 13px); color:#EDE7DA; font-weight:400; }
.chdX .chdx-breakscore .bs-cnt b { color:#E7C97C; font-weight:700; margin-right:0.6cqw; }
/* Fokus-synlighet uten a forstyrre artworket */
.chdX button:focus-visible { outline: 2px solid var(--gold, #c9a961); outline-offset: -3px; border-radius: 8px; }

/* ============================================================
   FINAL CLUBHOUSE CORRECTION (2026-07-25)
   1) Statusboks (alltid rendret) mellom hero og aktivitet
   2) Sterkere gullramme paa nav-kortene (identisk styrke x3)
   4) Breakscore litt hoyere  5) Nemesis vertikalt sentrert
   7) Best Trophy: navn maks 2 linjer + rarity, uten klipp
   ============================================================ */
/* 1) Statusboks — premium morkt kort i V4-uttrykket. Tre tilstander via data-state. */
.chdX .chdx-status {
  aspect-ratio: auto !important;
  min-height: 14.6cqw;
  display: flex !important; align-items: center; gap: 3cqw;
  padding: 2.4cqw 3.2cqw !important;
  background: linear-gradient(135deg, rgba(24,30,26,0.92), rgba(11,15,12,0.94)) !important;
  border: 1px solid rgba(201,169,97,0.42) !important;
  border-radius: 1.55cqw;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.05), 0 2px 10px rgba(0,0,0,0.35) !important;
  cursor: pointer; text-align: left; color: #f3eee1; font-family: inherit;
}
.chdX .chdx-status .cxt-ic {
  flex: 0 0 auto; width: 9.6cqw; height: 9.6cqw; max-width: 42px; max-height: 42px;
  border-radius: 50%; display: flex; align-items: center; justify-content: center;
  border: 1px solid currentColor; opacity: 0.95;
  background: rgba(255,255,255,0.03);
}
.chdX .chdx-status .cxt-svg { width: 58%; height: 58%; }
.chdX .chdx-status .cxt-txt { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 0.5cqw; }
.chdX .chdx-status .cxt-eyebrow {
  font-size: clamp(8px, 2.35cqw, 11.5px); font-weight: 700; letter-spacing: 0.15em;
}
.chdX .chdx-status .cxt-sub {
  font-size: clamp(10px, 3.0cqw, 14px); color: #d9d3c2; line-height: 1.25;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.chdX .chdx-status .cxt-chev { flex: 0 0 auto; width: 4.2cqw; max-width: 18px; color: #8a7340; display: flex; }
.chdX .chdx-status .cxt-chev svg { width: 100%; height: auto; }
/* Tilstandsfarger: aktiv runde = blaa, approvals/start = gronn (ikon + eyebrow) */
.chdX .chdx-status[data-state="active"] .cxt-ic,
.chdX .chdx-status[data-state="active"] .cxt-eyebrow { color: #7fb2e5; }
.chdX .chdx-status[data-state="approvals"] .cxt-ic,
.chdX .chdx-status[data-state="approvals"] .cxt-eyebrow,
.chdX .chdx-status[data-state="empty"] .cxt-ic,
.chdX .chdx-status[data-state="empty"] .cxt-eyebrow { color: #7fd6a8; }

/* 2) Nav-kortene: tydelig ytre ramme + indre highlight + behersket glod — identisk paa alle tre.
   Ringen ligger som overlay over det bakte artworket og folger kortets radius. */
.chdX .chdx-nav { box-shadow: 0 0 9px rgba(201,169,97,0.20) !important; }
.chdX .chdx-nav::after {
  content: '' !important; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
  border: 1px solid rgba(231,201,124,0.62);
  box-shadow: inset 0 0 0 1px rgba(231,201,124,0.16), inset 0 0 7px rgba(201,169,97,0.12);
}

/* 4) Breakscore: litt hoyere boks (kuttet strekkes marginalt vertikalt) */
.chdX .chdx-breakscore { aspect-ratio: 987/205 !important; }

/* 5) Nemesis: tekstblokken vertikalt sentrert i sin tredjedel (under den bakte tittelen) */
.chdX .cxs-b.cxs-1 .cxs-txt { bottom: auto; top: 60%; transform: translateY(-50%); }

/* 7) Best Trophy: navnet kan bryte over maks 2 linjer, rarity under — sentrert, uten klipp */
.chdX .cxs-b.cxs-3 .chd-sr-name {
  white-space: normal; overflow-wrap: anywhere; text-overflow: clip;
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;
  font-size: clamp(7.5px, 2.55cqw, 12.5px); line-height: 1.14;
}
.chdX .cxs-b.cxs-3 .chd-sr-sub { white-space: normal; overflow-wrap: anywhere; }

/* 3) Rivals-oversikten (#tab-friends): premium liste i det delte panelet */
.rvl-list { display: flex; flex-direction: column; }
.rvl-row {
  display: flex; align-items: center; gap: 11px; width: 100%;
  padding: 12px 6px; cursor: pointer; position: relative;
  border-bottom: 1px solid rgba(201,169,97,0.14);
  background: transparent; border-left: 0; border-right: 0; border-top: 0;
  color: inherit; font-family: inherit; text-align: left;
}
.rvl-row:last-child { border-bottom: 0; }
.rvl-row:active { background: rgba(201,169,97,0.06); }
.rvl-av { position: relative; flex: 0 0 auto; }
.rvl-main { flex: 1 1 auto; min-width: 0; }
.rvl-name { font-weight: 600; font-size: 14.5px; color: #f3eee1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rvl-sub { font-size: 11.5px; color: var(--muted, #9a927e); margin-top: 2px; }
.rvl-right { flex: 0 0 auto; display: flex; flex-direction: column; align-items: flex-end; gap: 2px; }
.rvl-h2h i { font-style: normal; font-size: 8.5px; letter-spacing: 0.14em; color: #8a7340; font-weight: 700; margin-right: 5px; }
.rvl-h2h b { font-family: 'Playfair Display', Georgia, serif; font-weight: 600; font-size: 14px; color: #E7C97C; font-variant-numeric: tabular-nums; }
.rvl-last { font-size: 10.5px; color: var(--muted, #9a927e); }
.rvl-chev { flex: 0 0 auto; color: #8a7340; font-size: 20px; line-height: 1; padding-left: 2px; }
.rvl-row:focus-visible { outline: 2px solid var(--gold, #c9a961); outline-offset: -2px; border-radius: 8px; }

/* Rivals-siden ligger over Clubhouse-bakgrunnen (samme behandling som Rivalry-siden) */
#tab-friends { position: relative; }
#tab-friends::before {
  content: ''; position: fixed; inset: 0; z-index: 0; pointer-events: none;
  background:
    linear-gradient(180deg, rgba(0,0,0,0.08) 0%, rgba(0,0,0,0.3) 40%, rgba(0,0,0,0.62) 64%, rgba(2,6,4,0.9) 82%, #020604 94%),
    #07130E url('clubhouse-bg.jpg?v=16') center top / cover no-repeat;
}
#tab-friends > * { position: relative; z-index: 1; }

/* ============================================================
   OPPGAVE 2.2 (2026-07-25) — Android-systemfelter (navigasjonsfelt)
   Edge-to-edge PWA: systemfeltene henter farge fra sidens faktiske
   bakgrunnsfarge. Eksplisitt solid mork bakgrunnsfarge paa html/body
   (gradientene ligger som background-image over) + dark color-scheme,
   slik at navigasjonsfeltet alltid smelter sammen med appen.
   Innhold beskyttes av eksisterende env(safe-area-inset-bottom)-padding.
   ============================================================ */
:root { color-scheme: dark; }
html, body { background-color: var(--bg, #0e1913) !important; }

/* OPPGAVE 2.4 (FGL-bakgrunn under header) er TATT UT av denne deployen
   etter beskjed 2026-07-25 — FGL beholder fullskjermsbakgrunnen inntil videre. */

/* 5b) Nemesis: samme tekstbehandling som Best Trophy — navn kan bryte over 2 linjer,
   undertekst likesaa; aldri avkuttet "No nemesi…" */
.chdX .cxs-b.cxs-1 .chd-sr-name {
  white-space: normal; overflow-wrap: anywhere; text-overflow: clip;
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;
  font-size: clamp(7.5px, 2.55cqw, 12.5px); line-height: 1.14;
}
.chdX .cxs-b.cxs-1 .chd-sr-sub {
  white-space: normal; overflow-wrap: anywhere; text-overflow: clip;
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; line-height: 1.2;
}
