/* GolfX.Chat — ChatGPT-inspired theme.
   Light canvas, slate text, teal-green accent, system font stack. */

:root{
  --bg:        #ffffff;
  --bg-soft:   #f8f8f4;
  --bg-sunken: #eef0e8;
  --panel:     #ffffff;
  --text:      #000000;
  --text-dim:  #1a1a1a;
  --text-mute: #3d3d3d;
  --border:    #e3e5dd;
  --border-2:  #d4d8c9;
  --accent:    #467235;   /* golf green */
  --accent-d:  #283F24;   /* dark green */
  --accent-sf: #eef3e6;   /* soft green tint */
  --gold:      #FFBF00;   /* gold highlight */
  --gold-soft: #FFF78D;   /* light yellow */
  --under:     #10a37f;   /* under par (good) */
  --over:      #c0392b;   /* over par */
  --amber:     #b8860b;
  --radius:    12px;
  --wrap:      1080px;
  --mono:      'SF Mono', ui-monospace, 'JetBrains Mono', 'Menlo', monospace;
  --sans:      'Lato', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
}

*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; }
body{
  background:var(--bg);
  color:var(--text);
  font-family:var(--sans);
  font-weight:500;
  line-height:1.6;
  min-height:100vh;
  -webkit-font-smoothing:antialiased;
}
a{ color:inherit; text-decoration:none; }
.mono{ font-family:var(--mono); }
.wrap{ max-width:var(--wrap); margin:0 auto; padding:0 24px; }

h1,h2,h3{ font-weight:700; line-height:1.2; margin:0; letter-spacing:-.01em; }
h1{ font-size:clamp(28px,4vw,40px); }
h2{ font-size:clamp(20px,2.4vw,26px); }
h3{ font-size:18px; }
em{ color:var(--accent); font-style:normal; }

/* ---- Header ---- */
.site-head{
  position:sticky; top:0; z-index:50;
  background:rgba(255,255,255,.85); backdrop-filter:blur(10px);
  border-bottom:1px solid var(--border);
}
.head-inner{ display:flex; align-items:center; gap:24px; height:60px; }
.brand{ display:flex; align-items:center; gap:9px; color:var(--text); }
.brand-mark{ color:var(--accent); display:flex; }
.brand-name{ font-weight:600; font-size:19px; letter-spacing:-.02em; }
.brand-dot{ color:var(--accent); }
.site-nav{ display:flex; gap:22px; margin-left:8px; flex:1; }
.site-nav a{ color:var(--text-dim); font-size:14.5px; font-weight:500; transition:color .15s; }
.site-nav a:hover{ color:var(--text); }
.ask-btn{
  background:var(--accent); color:#fff; font-weight:500;
  padding:8px 16px; border-radius:8px; font-size:14px;
  transition:background .15s;
}
.ask-btn:hover{ background:var(--accent-d); }

/* ---- Hero ---- */
.hero{ padding:60px 0 20px; max-width:760px; }
.eyebrow{ color:var(--accent); font-size:13px; font-weight:600;
  text-transform:uppercase; letter-spacing:.08em; margin-bottom:14px; }
.eyebrow-sm{ color:var(--accent); font-size:12px; font-weight:600;
  text-transform:uppercase; letter-spacing:.06em; margin-bottom:8px; }
.hero .sub{ color:var(--text-dim); font-size:18px; margin-top:16px; max-width:620px; }

/* ---- Ask panel ---- */
.ask-panel{
  margin:26px 0 10px; padding:26px;
  background:var(--bg-soft);
  border:1px solid var(--border); border-radius:16px;
}
.ask-panel h2{ font-size:22px; }
.ask-panel .hint{ color:var(--text-dim); font-size:14px; margin:6px 0 16px; }
.ask-row{ display:flex; gap:10px; }
.ask-row input{
  flex:1; padding:14px 16px; font-size:16px; font-family:inherit;
  background:var(--bg); border:1px solid var(--border-2);
  border-radius:12px; color:var(--text);
}
.ask-row input:focus{ outline:none; border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-sf); }
.ask-row button{
  background:var(--accent); color:#fff; border:0; font-weight:500;
  padding:0 24px; border-radius:12px; cursor:pointer; font-size:15px;
}
.ask-row button:hover{ background:var(--accent-d); }
.ask-row button:disabled{ opacity:.6; cursor:default; }
.chips{ display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; }
.chip{
  font-size:13px; color:var(--text-dim); cursor:pointer; background:var(--bg);
  padding:7px 13px; border:1px solid var(--border-2); border-radius:999px;
  transition:border-color .15s, color .15s, background .15s;
}
.chip:hover{ border-color:var(--accent); color:var(--text); background:var(--accent-sf); }
.ask-answer{
  margin-top:0; max-height:0; overflow:hidden; opacity:0;
  transition:max-height .4s ease, opacity .3s ease, margin-top .3s ease;
  white-space:pre-wrap; color:var(--text); font-size:15px;
}
.ask-answer.show{ max-height:1200px; opacity:1; margin-top:18px;
  padding-top:18px; border-top:1px solid var(--border); }
.cursor{ display:inline-block; width:7px; height:16px; background:var(--accent);
  vertical-align:middle; animation:blink 1s steps(2) infinite; border-radius:1px; }
@keyframes blink{ 50%{ opacity:0; } }

/* ---- Layout helpers ---- */
.section{ margin:44px 0; }
.section-head{ display:flex; align-items:baseline; justify-content:space-between; margin-bottom:18px; }
.section-head a{ color:var(--accent); font-size:14px; font-weight:500; }
.grid{ display:grid; gap:16px; }
.grid-2{ grid-template-columns:repeat(2,1fr); }
.grid-3{ grid-template-columns:repeat(3,1fr); }
.grid-4{ grid-template-columns:repeat(4,1fr); }
.two-col{ display:grid; grid-template-columns:1.4fr .9fr; gap:34px; }
@media(max-width:860px){
  .grid-2,.grid-3,.grid-4,.two-col{ grid-template-columns:1fr; }
  .site-nav{ display:none; }
}

/* ---- Panels ---- */
.panel{
  background:var(--panel); border:1px solid var(--border);
  border-radius:var(--radius); padding:20px;
}
.panel-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
.badge{ font-size:11px; font-weight:600; text-transform:uppercase;
  letter-spacing:.04em; padding:3px 9px; border-radius:999px; }
.badge-live{ background:#fdecea; color:var(--over); }
.badge-up{ background:var(--accent-sf); color:var(--accent-d); }
.badge-done{ background:var(--bg-sunken); color:var(--text-dim); }

/* ---- Tables / boards ---- */
.board{ width:100%; border-collapse:collapse; }
.board th{ text-align:left; font-size:11px; font-weight:600;
  text-transform:uppercase; letter-spacing:.04em; color:var(--text-mute);
  padding:8px 10px; border-bottom:1px solid var(--border); }
.board td{ padding:11px 10px; border-bottom:1px solid var(--border); vertical-align:middle; }
.board tr:last-child td{ border-bottom:0; }
.pos{ font-family:var(--mono); font-weight:600; color:var(--text-dim); width:52px; }
.pos.p1{ color:var(--accent); }
.pl-name{ font-weight:600; color:var(--text); }
.pl-name:hover{ color:var(--accent); }
.pl-loc{ font-size:12px; color:var(--text-dim); }
.score-par{ font-family:var(--mono); font-weight:600; text-align:right; }
.score-par.under{ color:var(--under); }
.score-par.over{ color:var(--over); }
.score-par.even{ color:var(--text-dim); }
.source-line{ font-family:var(--mono); font-size:11px; color:var(--text-mute);
  padding-top:10px; margin-top:4px; }

/* ---- Rank list (compact) ---- */
.rank-item{ display:flex; align-items:center; gap:14px; padding:11px 0; border-bottom:1px solid var(--border); }
.rank-item:last-child{ border-bottom:0; }
.rank-num{ font-weight:600; font-size:18px; color:var(--accent); width:30px; text-align:center; }
.rank-meta{ flex:1; }
.rank-meta .n{ font-weight:600; color:var(--text); }
.rank-meta .n:hover{ color:var(--accent); }
.rank-meta .s{ font-size:12px; color:var(--text-dim); }
.rank-earn{ font-family:var(--mono); font-size:13px; color:var(--text-dim); }
.delta-up{ color:var(--under); font-weight:600; margin-left:6px; }
.delta-down{ color:var(--over); font-weight:600; margin-left:6px; }

/* ---- Player cards ---- */
.pcard{ display:block; background:var(--panel); border:1px solid var(--border);
  border-radius:var(--radius); padding:18px; transition:border-color .15s, box-shadow .15s; }
.pcard:hover{ border-color:var(--border-2); box-shadow:0 1px 6px rgba(0,0,0,.06); }
.ptop{ display:flex; align-items:center; gap:13px; }
.avatar{ width:46px; height:46px; border-radius:50%; background:var(--accent-sf);
  display:flex; align-items:center; justify-content:center;
  font-weight:600; font-size:20px; color:var(--accent-d); overflow:hidden; }
.avatar img{ width:100%; height:100%; object-fit:cover; }
.pname{ font-weight:600; }
.ploc{ font-size:13px; color:var(--text-dim); }
.pstats{ display:flex; gap:14px; margin-top:16px; padding-top:14px; border-top:1px solid var(--border); }
.pstats div{ flex:1; }
.pstats b{ display:block; font-family:var(--mono); font-size:18px; color:var(--text); }
.pstats span{ font-size:11px; text-transform:uppercase; letter-spacing:.03em; color:var(--text-mute); }

/* ---- Filters ---- */
.filters{ display:flex; flex-wrap:wrap; gap:12px; margin-bottom:26px; align-items:center; }
.filters input, .filters select{
  padding:10px 13px; font-family:inherit; font-size:14.5px;
  background:var(--bg); border:1px solid var(--border-2);
  border-radius:9px; color:var(--text);
}
.filters input{ flex:1; min-width:220px; }
.filters input:focus, .filters select:focus{ outline:none; border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-sf); }

/* ---- Page title ---- */
.page-title{ padding:40px 0 22px; }
.page-title p{ color:var(--text-dim); font-size:16px; margin-top:8px; max-width:640px; }

/* ---- Pills ---- */
.pill-link{ display:inline-block; padding:7px 14px; margin:0 6px 8px 0;
  border:1px solid var(--border-2); border-radius:999px; font-size:14px;
  color:var(--text-dim); background:var(--bg); transition:border-color .15s, color .15s, background .15s; }
.pill-link:hover{ border-color:var(--accent); color:var(--accent-d); background:var(--accent-sf); }
.pill-link.on{ background:var(--accent); color:#fff; border-color:var(--accent); }

/* ---- News ---- */
.news-item{ padding:16px 0; border-bottom:1px solid var(--border); }
.news-item:last-child{ border-bottom:0; }
.news-item .meta{ font-family:var(--mono); font-size:12px; color:var(--text-mute); margin-bottom:5px; }
.news-item h3{ font-size:18px; margin-bottom:6px; }
.news-item h3 a:hover{ color:var(--accent); }
.news-item p{ color:var(--text-dim); font-size:14px; margin:0; }

/* ---- AI summary box ---- */
.ai-summary{ background:var(--bg-soft);
  border:1px solid var(--border); border-left:3px solid var(--accent);
  border-radius:10px; padding:16px 18px; }
.ai-summary .tag{ font-size:11px; font-weight:600; text-transform:uppercase;
  letter-spacing:.06em; color:var(--accent-d); margin-bottom:8px; }

/* ---- Profile ---- */
.profile-head{ display:flex; align-items:center; gap:22px; flex-wrap:wrap; padding:40px 0 20px; }
.big-avatar{ width:88px; height:88px; border-radius:50%; background:var(--accent-sf);
  display:flex; align-items:center; justify-content:center;
  font-weight:600; font-size:40px; color:var(--accent-d); overflow:hidden; }
.big-avatar img{ width:100%; height:100%; object-fit:cover; }
.p-sub{ color:var(--text-dim); margin-top:6px; }
.fav-btn{ background:var(--bg); border:1px solid var(--border-2); color:var(--text);
  padding:10px 18px; border-radius:999px; cursor:pointer; font-family:inherit;
  font-size:14.5px; font-weight:500; transition:border-color .15s, background .15s; }
.fav-btn:hover{ border-color:var(--accent); }
.fav-btn.on{ background:var(--accent); color:#fff; border-color:var(--accent); }
.stat-strip{ display:grid; grid-template-columns:repeat(auto-fit,minmax(100px,1fr)); gap:1px;
  background:var(--border); border:1px solid var(--border);
  border-radius:var(--radius); overflow:hidden; margin:8px 0 30px; }
.stat-strip .cell{ background:var(--panel); padding:18px 16px; text-align:center; }
.stat-strip .v{ font-family:var(--mono); font-weight:600; font-size:24px; color:var(--text); }
.stat-strip .k{ font-size:11px; text-transform:uppercase; letter-spacing:.04em; color:var(--text-mute); margin-top:4px; }

/* ---- Regions ---- */
.region-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:16px; }
.region-card{ background:var(--panel); border:1px solid var(--border); border-radius:var(--radius);
  padding:22px; transition:border-color .15s, box-shadow .15s; }
.region-card:hover{ border-color:var(--border-2); box-shadow:0 1px 6px rgba(0,0,0,.06); }
.region-card h3{ display:flex; align-items:center; gap:8px; }
.region-card .flag{ font-size:22px; }
.region-card p{ color:var(--text-dim); font-size:14px; margin:10px 0 16px; }
.region-card .count{ font-family:var(--mono); font-size:13px; color:var(--accent-d); }

/* ---- Empty state ---- */
.empty{ background:var(--bg-soft); border:1px dashed var(--border-2); border-radius:var(--radius);
  padding:32px; text-align:center; color:var(--text-dim); }

/* ---- Footer ---- */
.site-foot{ border-top:1px solid var(--border); margin-top:56px; padding:38px 0; background:var(--bg-soft); }
.foot-inner{ display:grid; grid-template-columns:1fr 2fr; gap:34px; }
.foot-brand p{ color:var(--text-dim); font-size:14px; margin-top:6px; }
.foot-note p{ color:var(--text-dim); font-size:13px; margin:0 0 10px; }
.foot-links a:hover{ color:var(--accent); }
.foot-copy{ font-family:var(--mono); font-size:12px; color:var(--text-mute); }
@media(max-width:860px){ .foot-inner{ grid-template-columns:1fr; } }

/* ---- Admin form grids ---- */
.admin-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:14px 18px; }
.admin-grid label, .panel form label{
  display:flex; flex-direction:column; gap:6px; font-size:12px;
  text-transform:uppercase; letter-spacing:.04em; color:var(--text-dim); }
.admin-grid input, .admin-grid select, .panel form input, .panel form select, .admin-ta{
  background:var(--bg); border:1px solid var(--border-2); color:var(--text);
  padding:10px 12px; border-radius:9px; font:inherit; text-transform:none; letter-spacing:0; }
.admin-ta{ width:100%; box-sizing:border-box; resize:vertical; }
.admin-grid input:focus, .admin-grid select:focus, .admin-ta:focus{ outline:none; border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-sf); }

/* ---- Homepage: centered chat-style entry ---- */
.ask-home{
  min-height:calc(100vh - 60px - 120px);   /* header + footer allowance */
  display:flex; align-items:center; justify-content:center;
  padding:40px 0;
}
.ask-home-inner{ width:100%; max-width:640px; text-align:center; margin:0 auto; }
.ask-mark{ color:var(--accent); display:flex; justify-content:center; margin-bottom:18px; }
.ask-title{ font-size:32px; font-weight:600; letter-spacing:-.02em; }
.ask-sub{ color:var(--text-dim); font-size:16px; margin:12px auto 30px; max-width:520px; }

.ask-box{
  display:flex; align-items:center; gap:8px;
  background:var(--bg); border:1px solid var(--border-2);
  border-radius:26px; padding:8px 8px 8px 20px;
  box-shadow:0 2px 10px rgba(0,0,0,.05);
  transition:border-color .15s, box-shadow .15s;
}
.ask-box:focus-within{ border-color:var(--accent); box-shadow:0 0 0 4px var(--accent-sf); }
.ask-box input{
  flex:1; border:0; outline:none; background:transparent;
  font-family:inherit; font-size:16px; color:var(--text); padding:10px 0;
}
.ask-box button{
  flex:none; width:38px; height:38px; border:0; border-radius:50%;
  background:var(--accent); color:#fff; cursor:pointer;
  display:flex; align-items:center; justify-content:center; transition:background .15s;
}
.ask-box button:hover{ background:var(--accent-d); }
.ask-box button:disabled{ opacity:.5; cursor:default; }

.ask-examples{ display:flex; flex-wrap:wrap; gap:8px; justify-content:center; margin-top:20px; }
.ask-examples .example{
  font-family:inherit; font-size:13.5px; color:var(--text-dim); cursor:pointer;
  background:var(--bg); padding:8px 14px; border:1px solid var(--border-2); border-radius:999px;
  transition:border-color .15s, color .15s, background .15s;
}
.ask-examples .example:hover{ border-color:var(--accent); color:var(--text); background:var(--accent-sf); }

.ask-home .ask-answer{ text-align:left; margin-top:8px; }
.ask-home .ask-answer.show{ margin-top:26px; }

@media(max-width:600px){
  .ask-title{ font-size:26px; }
  .ask-home{ min-height:auto; padding:48px 0; }
}

/* ============================================================= */
/* App shell — ChatGPT-style sidebar + main                       */
/* ============================================================= */
:root{ --sidebar-w:264px; --sb-bg:#f7f7f8; --sb-border:#e5e5e5; }

.app{ display:block; min-height:100vh; }

/* Sidebar (drawer) */
.sidebar{
  background:var(--sb-bg); border-right:1px solid var(--sb-border);
  display:flex; flex-direction:column; overflow:hidden;
}
.sb-top{ display:flex; align-items:center; justify-content:space-between; padding:14px 14px 8px; }
.sb-brand{ display:flex; align-items:center; gap:8px; color:var(--text); }
.sb-brand .brand-name{ font-weight:700; font-size:17px; }
.sb-collapse, .tb-menu{ background:none; border:0; color:var(--text-dim); cursor:pointer; padding:6px; border-radius:8px; }
.sb-collapse:hover, .tb-menu:hover{ background:var(--bg-sunken); }
.sb-new{
  display:flex; align-items:center; gap:10px; margin:8px 12px 6px; padding:11px 14px;
  background:var(--bg); border:1px solid var(--border-2); border-radius:12px;
  font-weight:600; font-size:14.5px; color:var(--text); transition:background .15s, border-color .15s;
}
.sb-new:hover{ background:var(--accent-sf); border-color:var(--accent); color:var(--accent-d); }
.sb-nav{ display:flex; flex-direction:column; padding:6px 8px; gap:1px; }
.sb-link{ display:flex; align-items:center; gap:10px; padding:9px 12px; border-radius:9px;
  font-size:14px; color:var(--text-dim); font-weight:500; }
.sb-link:hover{ background:var(--bg-sunken); color:var(--text); }
.sb-ico{ width:18px; text-align:center; font-size:14px; }

.sb-recent{ flex:1; overflow-y:auto; padding:10px 8px; border-top:1px solid var(--sb-border); margin-top:6px; }
.sb-recent-head{ font-size:11px; text-transform:uppercase; letter-spacing:.06em; color:var(--text-mute);
  padding:4px 12px 8px; font-weight:600; }
.sb-chat{ display:flex; align-items:center; gap:9px; padding:8px 12px; border-radius:9px;
  font-size:13.5px; color:var(--text-dim); }
.sb-chat svg{ flex:none; color:var(--text-mute); }
.sb-chat span{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sb-chat:hover{ background:var(--bg-sunken); color:var(--text); }
.sb-chat.on{ background:var(--accent-sf); color:var(--accent-d); }
.sb-empty{ font-size:13px; color:var(--text-mute); padding:6px 12px; }

.sb-user{ border-top:1px solid var(--sb-border); padding:12px; }
.sb-user-row{ display:flex; align-items:center; gap:10px; }
.sb-avatar{ width:30px; height:30px; border-radius:50%; background:var(--accent); color:#fff;
  display:flex; align-items:center; justify-content:center; font-weight:700; font-size:14px; flex:none; }
.sb-user-name{ flex:1; font-size:14px; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sb-logout{ color:var(--text-mute); padding:4px; border-radius:7px; display:flex; }
.sb-logout:hover{ background:var(--bg-sunken); color:var(--over); }
.sb-login, .sb-signup{ display:block; text-align:center; padding:10px; border-radius:10px; font-weight:600; font-size:14px; }
.sb-login{ color:var(--text); border:1px solid var(--border-2); margin-bottom:8px; }
.sb-login:hover{ background:var(--bg-sunken); }
.sb-signup{ background:var(--accent); color:#fff; }
.sb-signup:hover{ background:var(--accent-d); }

/* Main column */
.main{ flex:1; min-width:0; display:flex; flex-direction:column; }

/* ---- FoxKies-style top nav (primary navigation) ---- */
.topnav{ display:flex; align-items:center; gap:20px; height:74px; padding:0 28px;
  border-bottom:1px solid var(--border); position:sticky; top:0; background:rgba(255,255,255,.94);
  backdrop-filter:blur(10px); z-index:40; }
.tn-menu{ background:none; border:0; color:var(--text); cursor:pointer; padding:6px; border-radius:8px; display:flex; }
.tn-menu:hover{ background:var(--bg-sunken); }
.tn-brand{ display:flex; align-items:center; }
.tn-brand img{ height:44px; width:auto; display:block; }
.tn-links{ display:flex; align-items:center; gap:36px; margin:0 auto; }
.tn-links a{ font-size:20px; font-weight:700; color:var(--text); letter-spacing:-.01em; }
.tn-links a:hover{ color:var(--accent-d); }
.tn-right{ display:flex; align-items:center; gap:14px; }
.tn-lang{ font-size:13px; font-weight:700; color:var(--text-dim); padding:6px 10px; border:1px solid var(--border-2); border-radius:8px; }
.tn-lang:hover{ border-color:var(--accent); color:var(--accent-d); }
.tn-icon{ display:flex; align-items:center; justify-content:center; width:44px; height:44px;
  border:1px solid var(--border-2); border-radius:10px; color:var(--text); }
.tn-icon:hover{ border-color:var(--accent); color:var(--accent-d); }
.tn-points{ display:flex; align-items:center; gap:6px; background:var(--text); color:#fff;
  padding:0 16px; height:44px; border-radius:10px; font-weight:800; font-size:15px; }
.tn-points:hover{ background:var(--accent-d); }
.tn-cta{ background:var(--accent); color:#fff; padding:11px 20px; border-radius:10px; font-weight:700; font-size:15px; }
.tn-cta:hover{ background:var(--accent-d); }

.content{ flex:1; width:100%; max-width:1040px; margin:0 auto; padding:24px; }

.mini-foot{ max-width:1040px; margin:40px auto 0; padding:20px 24px; border-top:1px solid var(--border);
  display:flex; flex-wrap:wrap; align-items:center; gap:8px; font-size:12.5px; color:var(--text-mute); }
.mini-foot a{ color:var(--text-dim); }
.mini-foot a:hover{ color:var(--accent); }
.mini-foot .dot{ color:var(--border-2); }
.mini-foot .mf-note{ flex-basis:100%; margin-top:4px; }

/* ---- Sidebar is now a DRAWER, closed by default on all sizes ---- */
.sidebar{ position:fixed; z-index:60; left:0; top:0; height:100vh; width:var(--sidebar-w);
  box-shadow:2px 0 24px rgba(0,0,0,.14); transition:transform .22s ease; }
body:not(.sb-open) .sidebar{ transform:translateX(-100%); }
body.sb-open .sidebar{ transform:translateX(0); }
.sb-backdrop{ position:fixed; inset:0; background:rgba(0,0,0,.4); z-index:55; }

@media(max-width:820px){
  .topnav{ height:62px; padding:0 16px; gap:12px; }
  .tn-brand img{ height:34px; }
  .tn-links{ display:none; }         /* mobile uses drawer + bottom nav */
  .content{ padding:18px; }
  .tn-cta{ padding:9px 14px; font-size:14px; }
  .tn-lang{ display:none; }
}

/* ============================================================= */
/* Auth pages                                                     */
/* ============================================================= */
.auth-wrap{ min-height:calc(100vh - 100px); display:flex; align-items:center; justify-content:center; padding:40px 0; }
.auth-card{ width:100%; max-width:400px; background:var(--panel); border:1px solid var(--border);
  border-radius:16px; padding:32px; box-shadow:0 2px 16px rgba(0,0,0,.05); }
.auth-card h1{ font-size:24px; }
.auth-sub{ color:var(--text-dim); font-size:14.5px; margin:8px 0 22px; }
.auth-form{ display:flex; flex-direction:column; gap:16px; }
.auth-form label{ display:flex; flex-direction:column; gap:6px; font-size:13px; color:var(--text-dim); font-weight:600; }
.auth-form .opt{ color:var(--text-mute); font-weight:400; }
.auth-form input{ padding:12px 14px; border:1px solid var(--border-2); border-radius:10px;
  font:inherit; font-size:16px; color:var(--text); background:var(--bg); }
.auth-form input:focus{ outline:none; border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-sf); }
.otp-input{ letter-spacing:.4em; text-align:center; font-size:22px !important; font-weight:600; }
.auth-btn{ background:var(--accent); color:#fff; border:0; padding:13px; border-radius:10px;
  font:inherit; font-weight:700; font-size:15px; cursor:pointer; margin-top:4px; }
.auth-btn:hover{ background:var(--accent-d); }
.auth-alt{ text-align:center; font-size:14px; color:var(--text-dim); margin:20px 0 0; }
.auth-alt a{ color:var(--accent-d); font-weight:600; }
.auth-err{ background:#fdecea; color:var(--over); border:1px solid #f5c6c0; border-radius:10px;
  padding:11px 14px; font-size:14px; margin-bottom:18px; }
.auth-dev{ background:var(--accent-sf); color:var(--accent-d); border:1px solid #b9e6d7; border-radius:10px;
  padding:11px 14px; font-size:14px; margin-bottom:18px; }
.auth-resend{ text-align:center; margin-top:14px; }
.linkbtn{ background:none; border:0; color:var(--accent-d); font:inherit; font-weight:600; cursor:pointer; font-size:14px; }
.linkbtn:hover{ text-decoration:underline; }

/* ============================================================= */
/* Chat cards (rendered inline in Ask GolfX answers)              */
/* ============================================================= */
.card{ border:1px solid var(--border); border-radius:14px; overflow:hidden; background:var(--panel);
  margin:12px 0; box-shadow:0 1px 4px rgba(0,0,0,.04); }
.card-player{ padding:0; }
.cp-head{ display:flex; align-items:center; gap:14px; padding:16px 18px; background:var(--bg-soft); border-bottom:1px solid var(--border); }
.cp-avatar{ width:52px; height:52px; border-radius:50%; background:var(--accent-sf); color:var(--accent-d);
  display:flex; align-items:center; justify-content:center; font-weight:700; font-size:22px; flex:none; }
.cp-id{ flex:1; min-width:0; }
.cp-name{ font-weight:700; font-size:18px; }
.cp-name a:hover{ color:var(--accent); }
.cp-meta{ font-size:13px; color:var(--text-dim); margin-top:2px; }
.cp-tag{ display:inline-block; font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:.03em;
  padding:2px 8px; border-radius:999px; background:var(--accent-sf); color:var(--accent-d); margin-left:6px; }
.cp-stats{ display:grid; grid-template-columns:repeat(auto-fit,minmax(72px,1fr)); gap:1px; background:var(--border); }
.cp-stat{ background:var(--panel); padding:14px 10px; text-align:center; }
.cp-stat .v{ font-family:var(--mono); font-weight:600; font-size:19px; color:var(--text); }
.cp-stat .k{ font-size:10.5px; text-transform:uppercase; letter-spacing:.03em; color:var(--text-mute); margin-top:3px; }
.cp-foot{ padding:10px 18px; font-size:12px; color:var(--text-mute); display:flex; justify-content:space-between; align-items:center; }
.cp-foot a{ color:var(--accent-d); font-weight:600; }

.card-board{ padding:0; }
.cb-head{ padding:14px 18px; font-weight:700; font-size:15px; border-bottom:1px solid var(--border); background:var(--bg-soft); }
.cb-row{ display:flex; align-items:center; gap:12px; padding:10px 18px; border-bottom:1px solid var(--border); font-size:14px; }
.cb-row:last-child{ border-bottom:0; }
.cb-pos{ font-family:var(--mono); font-weight:600; color:var(--text-dim); width:28px; }
.cb-pos.p1{ color:var(--accent); }
.cb-name{ flex:1; font-weight:600; }
.cb-name a:hover{ color:var(--accent); }
.cb-val{ font-family:var(--mono); font-size:13px; color:var(--text-dim); }
.cb-foot{ padding:10px 18px; font-size:12px; color:var(--text-mute); }
.cb-foot a{ color:var(--accent-d); font-weight:600; }

.card-list{ padding:8px 0; }
.cl-item{ display:flex; align-items:center; gap:10px; padding:9px 18px; font-size:14px; }
.cl-item:hover{ background:var(--bg-sunken); }
.cl-badge{ font-size:11px; color:var(--text-mute); font-family:var(--mono); }

/* ============================================================= */
/* Chat surface                                                   */
/* ============================================================= */
.chat{ display:flex; flex-direction:column; height:calc(100dvh - 74px); overflow:hidden; }
.main:has(.chat) .content{ max-width:100%; padding:0; display:flex; flex-direction:column; flex:1; min-height:0; }
.chat-scroll{ flex:1; overflow-y:auto; display:flex; flex-direction:column; min-height:0; }
.chat.has-messages .chat-scroll{ display:block; }
.chat-empty{ margin:auto !important; display:flex; flex-direction:column; align-items:center; }
.hero-input{ width:100%; max-width:640px; margin:8px auto 22px !important; }
.chat-bar{ display:none; }
.chat.has-messages .chat-empty{ display:none; }
.chat.has-messages .chat-bar{ display:block; }
.chat-messages{ max-width:760px; margin:0 auto; padding:24px 20px 40px; }

/* Empty state */
.chat-empty{ max-width:640px; margin:0 auto; padding:8vh 20px 0; text-align:center; }
.ce-mark{ color:var(--accent); display:flex; justify-content:center; margin-bottom:16px; }
.chat-empty h1{ font-size:30px; }
.ce-sub{ color:var(--text-dim); font-size:16px; margin:12px auto 28px; max-width:520px; }
.ce-examples{ display:flex; flex-wrap:wrap; gap:10px; justify-content:center; }
.ce-ex{ font-family:inherit; font-size:14px; color:var(--text-dim); cursor:pointer; background:var(--bg);
  padding:12px 16px; border:1px solid var(--border-2); border-radius:12px; text-align:left;
  transition:border-color .15s, background .15s, color .15s; }
.ce-ex:hover{ border-color:var(--accent); background:var(--accent-sf); color:var(--text); }

/* Messages */
.msg{ margin:18px 0; display:flex; }
.msg-user{ justify-content:flex-end; }
.msg-user .bubble{ background:var(--accent); color:#fff; padding:11px 16px; border-radius:16px 16px 4px 16px;
  max-width:80%; font-size:15px; line-height:1.5; white-space:pre-wrap; }
.msg-ai{ justify-content:flex-start; }
.msg-ai .ai-inner{ max-width:92%; }
.ai-text{ font-size:15px; line-height:1.6; color:var(--text); }
.card + .ai-text{ margin-top:10px; }

/* Typing dots */
.typing{ display:inline-flex; gap:4px; padding:8px 4px; }
.typing span{ width:7px; height:7px; border-radius:50%; background:var(--text-mute); animation:blink 1.2s infinite both; }
.typing span:nth-child(2){ animation-delay:.2s; }
.typing span:nth-child(3){ animation-delay:.4s; }
@keyframes blink{ 0%,80%,100%{ opacity:.25; } 40%{ opacity:1; } }

/* Input bar */
.chat-bar{ flex:none; border-top:1px solid var(--border); background:var(--bg); padding:14px 20px 10px; }
.chat-input{ max-width:760px; margin:0 auto; display:flex; align-items:flex-end; gap:8px;
  background:var(--bg); border:1px solid var(--border-2); border-radius:20px; padding:6px 6px 6px 18px;
  box-shadow:0 2px 10px rgba(0,0,0,.05); }
.chat-input:focus-within{ border-color:var(--accent); box-shadow:0 0 0 4px var(--accent-sf); }
.chat-input textarea{ flex:1; border:0; outline:none; resize:none; background:transparent; font-family:inherit;
  font-size:16px; line-height:1.45; color:var(--text); min-height:26px; max-height:160px; padding:9px 0;
  overflow-y:auto; }
.chat-input button{ flex:none; width:38px; height:38px; border:0; border-radius:50%; background:var(--accent);
  color:#fff; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:background .15s; }
.chat-input button:hover{ background:var(--accent-d); }
.chat-input button:disabled{ opacity:.5; cursor:default; }
.chat-hint{ max-width:760px; margin:8px auto 0; text-align:center; font-size:12px; color:var(--text-mute); }

/* Hide the mini-foot on the chat page (it has its own hint) */
.main:has(.chat) .mini-foot{ display:none; }

/* Artifacts */
.artifact-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:14px; }
.artifact-card{ background:var(--panel); border:1px solid var(--border); border-radius:12px; padding:16px;
  transition:border-color .15s, box-shadow .15s; }
.artifact-card:hover{ border-color:var(--accent); box-shadow:0 1px 6px rgba(0,0,0,.06); }
.ac-type{ font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:.04em; color:var(--accent-d); }
.ac-title{ font-weight:700; font-size:16px; margin:6px 0 4px; }
.ac-meta{ font-size:13px; color:var(--text-dim); }
.ac-foot{ font-size:12px; color:var(--text-mute); margin-top:10px; font-family:var(--mono); }

/* ============================================================= */
/* Richer player grid + pagination + sortable tables             */
/* ============================================================= */
.player-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(min(260px,100%),1fr)); gap:16px; }
.pcard2{ display:block; background:var(--panel); border:1px solid var(--border); border-radius:14px;
  padding:16px; transition:border-color .15s, box-shadow .15s, transform .15s; }
.pcard2:hover{ border-color:var(--accent); box-shadow:0 4px 16px rgba(0,0,0,.07); transform:translateY(-2px); }
.pc-top{ display:flex; align-items:center; gap:12px; }
.pc-top .avatar{ width:44px; height:44px; font-size:18px; }
.pc-id{ flex:1; min-width:0; }
.pc-id .pname{ font-weight:700; font-size:15px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.pc-id .ploc{ font-size:12.5px; color:var(--text-dim); }
.pc-world{ font-family:var(--mono); font-size:12px; font-weight:600; color:var(--accent-d);
  background:var(--accent-sf); padding:3px 8px; border-radius:999px; white-space:nowrap; }
.pc-tours{ display:flex; flex-wrap:wrap; gap:5px; margin:12px 0 4px; min-height:22px; }
.pc-tour{ font-size:11px; font-weight:600; color:var(--text-dim); background:var(--bg-sunken);
  padding:3px 8px; border-radius:6px; white-space:nowrap; }
.pc-stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin-top:12px; padding-top:12px;
  border-top:1px solid var(--border); }
.pc-stats div{ text-align:center; }
.pc-stats b{ display:block; font-family:var(--mono); font-size:14px; color:var(--text); font-weight:600; }
.pc-stats span{ font-size:10px; text-transform:uppercase; letter-spacing:.02em; color:var(--text-mute); }

/* Pagination */
.pagination{ display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin:26px 0; justify-content:center; }
.pg-btn{ min-width:38px; height:38px; padding:0 12px; display:inline-flex; align-items:center; justify-content:center;
  border:1px solid var(--border-2); border-radius:9px; font-size:14px; font-weight:600; color:var(--text-dim);
  background:var(--bg); transition:border-color .15s, background .15s, color .15s; }
a.pg-btn:hover{ border-color:var(--accent); color:var(--accent-d); background:var(--accent-sf); }
.pg-btn.on{ background:var(--accent); color:#fff; border-color:var(--accent); }
.pg-btn.disabled{ opacity:.4; }
.pg-btn.gap{ border:0; background:none; min-width:20px; }
.pg-count{ margin-left:10px; font-size:12.5px; color:var(--text-mute); font-family:var(--mono); }

/* Sortable table headers */
.rank-table th{ white-space:nowrap; }
.th-sort{ color:var(--text-dim); font-weight:600; }
.th-sort:hover{ color:var(--accent-d); }
.rank-table tbody tr:hover{ background:var(--bg-soft); }
.rank-table td{ padding:12px 12px; }
.rank-table .pos{ font-size:15px; }

/* ============================================================= */
/* Claim profile                                                  */
/* ============================================================= */
.profile-actions{ display:flex; flex-direction:column; gap:8px; align-items:stretch; }
.claim-btn{ display:inline-flex; align-items:center; gap:7px; justify-content:center;
  background:var(--accent-sf); color:var(--accent-d); border:1px solid transparent; cursor:pointer;
  font:inherit; font-weight:600; font-size:13.5px; padding:9px 14px; border-radius:10px; white-space:nowrap;
  transition:background .15s, border-color .15s; }
.claim-btn:hover{ background:var(--bg); border-color:var(--accent); }
.claimed-badge{ display:inline-flex; align-items:center; gap:3px; color:var(--accent-d); font-weight:700;
  background:var(--accent-sf); padding:2px 9px; border-radius:999px; font-size:12px; }

.claim-modal{ position:fixed; inset:0; background:rgba(15,20,25,.45); display:flex; align-items:center;
  justify-content:center; z-index:100; padding:20px; }
.claim-modal[hidden]{ display:none; }
.claim-box{ position:relative; background:var(--panel); border-radius:16px; padding:28px; max-width:440px; width:100%;
  box-shadow:0 12px 40px rgba(0,0,0,.2); }
.claim-box h3{ font-size:20px; margin:0 0 8px; }
.claim-close{ position:absolute; top:14px; right:16px; background:none; border:0; font-size:26px; line-height:1;
  color:var(--text-mute); cursor:pointer; }
.claim-close:hover{ color:var(--text); }
.claim-sub{ font-size:14px; color:var(--text-dim); margin:0 0 20px; line-height:1.55; }
.claim-label{ display:flex; flex-direction:column; gap:6px; font-size:13px; font-weight:600; color:var(--text-dim); margin-bottom:16px; }
.claim-label textarea{ padding:11px 13px; border:1px solid var(--border-2); border-radius:10px; font:inherit;
  font-size:15px; resize:vertical; color:var(--text); background:var(--bg); }
.claim-label textarea:focus{ outline:none; border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-sf); }
.claim-note{ font-size:12.5px; color:var(--text-mute); margin:12px 0 0; line-height:1.5; }
.claim-success{ background:var(--accent-sf); color:var(--accent-d); border-radius:10px; padding:16px;
  font-weight:600; font-size:14.5px; text-align:center; }

/* ============================================================= */
/* Mobile bottom nav                                              */
/* ============================================================= */
.mobile-nav{ display:none; }
@media(max-width:860px){
  .mobile-nav{
    display:flex; position:fixed; bottom:0; left:0; right:0; z-index:50;
    background:var(--bg); border-top:1px solid var(--border);
    padding:6px 4px calc(6px + env(safe-area-inset-bottom,0)); justify-content:space-around;
    box-shadow:0 -2px 12px rgba(0,0,0,.05);
  }
  .mobile-nav a{ display:flex; flex-direction:column; align-items:center; gap:2px; flex:1;
    font-size:10.5px; color:var(--text-dim); font-weight:600; padding:4px 2px; }
  .mobile-nav a:hover, .mobile-nav a.on{ color:var(--accent-d); }
  .mobile-nav .mn-ico{ font-size:19px; line-height:1; }
  /* keep content clear of the fixed bar + chat input */
  .content{ padding-bottom:70px; }
  .chat{ height:calc(100dvh - 62px); }  /* just the top nav; input padded above bottom nav */
  .content:has(.chat){ padding-bottom:0; }
  .chat-bar{ margin-bottom:0; padding:10px 12px calc(10px + 64px); background:var(--bg); }
  .chat-messages{ padding:16px 14px 24px; }
  .mini-foot{ margin-bottom:60px; }
}
@media(max-width:600px){
  .mini-foot{ flex-direction:column; align-items:flex-start; gap:6px; }
  .mini-foot .dot{ display:none; }
  .page-title h1{ font-size:24px; }
  .player-grid{ grid-template-columns:1fr; gap:12px; }
  .pc-stats{ gap:4px; }
  .region-grid{ grid-template-columns:1fr; }
}

/* ============================================================= */
/* News cards with images                                         */
/* ============================================================= */
.news-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); gap:18px; }
.news-card{ background:var(--panel); border:1px solid var(--border); border-radius:14px; overflow:hidden;
  display:flex; flex-direction:column; transition:border-color .15s, box-shadow .15s; }
.news-card:hover{ border-color:var(--accent); box-shadow:0 3px 14px rgba(0,0,0,.06); }
.nc-img{ display:block; aspect-ratio:16/9; overflow:hidden; background:var(--bg-sunken); }
.nc-img img{ width:100%; height:100%; object-fit:cover; transition:transform .3s; }
.news-card:hover .nc-img img{ transform:scale(1.03); }
.nc-body{ padding:18px; display:flex; flex-direction:column; flex:1; }
.nc-body h3{ font-size:16px; line-height:1.35; }

/* ============================================================= */
/* Podcasts                                                       */
/* ============================================================= */
.podcast-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:18px; }
.podcast-card{ display:flex; gap:14px; background:var(--panel); border:1px solid var(--border);
  border-radius:14px; padding:16px; transition:border-color .15s, box-shadow .15s; }
.podcast-card:hover{ border-color:var(--accent); box-shadow:0 3px 14px rgba(0,0,0,.06); }
.pod-art{ width:88px; height:88px; flex:none; border-radius:12px; overflow:hidden; background:var(--accent-sf);
  display:flex; align-items:center; justify-content:center; }
.pod-art img{ width:100%; height:100%; object-fit:cover; }
.pod-art .pod-ph{ font-size:34px; }
.pod-body{ flex:1; min-width:0; }
.pod-body h3{ font-size:16px; margin:0 0 2px; }
.pod-author{ font-size:12.5px; color:var(--text-dim); margin-bottom:6px; }
.pod-desc{ font-size:13px; color:var(--text-dim); line-height:1.45; margin:0 0 10px; }
.pod-latest{ font-size:12.5px; color:var(--text); margin-bottom:10px; }
.pod-latest .pod-dot{ color:var(--accent); font-size:9px; vertical-align:middle; }
.pod-latest .pod-when{ color:var(--text-mute); margin-left:4px; }
.pod-links{ display:flex; gap:8px; flex-wrap:wrap; }
@media(max-width:600px){
  .news-grid, .podcast-grid{ grid-template-columns:1fr; }
  .podcast-card{ flex-direction:column; }
  .pod-art{ width:100%; height:160px; }
}

/* Photo credit + upload field */
.photo-credit{ font-size:11.5px; color:var(--text-mute); margin:-18px 0 24px; }
.claim-label input[type=file]{ font-size:13px; padding:8px 0; border:0; }

/* ============================================================= */
/* YouTube video channels                                         */
/* ============================================================= */
.yt-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(340px,1fr)); gap:20px; }
.yt-card{ background:var(--panel); border:1px solid var(--border); border-radius:14px; overflow:hidden;
  transition:border-color .15s, box-shadow .15s; }
.yt-card:hover{ border-color:var(--accent); box-shadow:0 4px 18px rgba(0,0,0,.08); }
.yt-lead{ display:block; }
.yt-thumb{ position:relative; aspect-ratio:16/9; background:#000; overflow:hidden; }
.yt-thumb img{ width:100%; height:100%; object-fit:cover; }
.yt-thumb .yt-ph{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  color:#fff; font-size:40px; background:var(--accent-d); }
.yt-thumb .yt-play{ position:absolute; inset:0; margin:auto; width:56px; height:56px; border-radius:50%;
  background:rgba(0,0,0,.6); color:#fff; display:flex; align-items:center; justify-content:center;
  font-size:22px; padding-left:4px; transition:background .15s, transform .15s; }
.yt-card:hover .yt-play{ background:#e11; transform:scale(1.08); }
.yt-body{ padding:16px; }
.yt-body h3{ font-size:16px; margin:0 0 6px; }
.yt-latest{ display:block; font-size:14px; color:var(--text); font-weight:600; line-height:1.35; }
.yt-latest:hover{ color:var(--accent-d); }
.yt-when{ font-size:12px; color:var(--text-mute); margin-top:3px; font-family:var(--mono); }
.yt-more{ display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:12px; }
.yt-more-item{ display:flex; gap:7px; align-items:center; }
.yt-more-item img{ width:52px; height:30px; object-fit:cover; border-radius:5px; flex:none; }
.yt-more-item span{ font-size:11.5px; color:var(--text-dim); line-height:1.25;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.yt-more-item:hover span{ color:var(--text); }
@media(max-width:600px){ .yt-grid{ grid-template-columns:1fr; } }

/* ============================================================= */
/* Professional player profile hero                               */
/* ============================================================= */
.pro-hero{ position:relative; border-radius:18px; overflow:hidden; margin-bottom:26px;
  border:1px solid var(--border); background:var(--panel); }
.pro-hero-bg{ position:absolute; inset:0; background-size:cover; background-position:center top;
  filter:blur(30px) saturate(1.3); opacity:.28; transform:scale(1.2); }
.pro-hero.no-photo .pro-hero-bg{ background:linear-gradient(135deg, var(--accent-sf), transparent); opacity:1; }
.pro-hero-inner{ position:relative; display:flex; gap:24px; align-items:flex-end; padding:28px;
  background:linear-gradient(180deg, transparent, rgba(255,255,255,.55)); }
.pro-photo{ width:150px; height:150px; flex:none; border-radius:16px; overflow:hidden;
  background:var(--accent-sf); box-shadow:0 8px 28px rgba(0,0,0,.18); border:3px solid var(--panel);
  display:flex; align-items:center; justify-content:center; }
.pro-photo img{ width:100%; height:100%; object-fit:cover; }
.pro-initial{ font-size:64px; font-weight:700; color:var(--accent-d); }
.pro-id{ flex:1; min-width:0; padding-bottom:4px; }
.pro-badges{ display:flex; flex-wrap:wrap; gap:6px; margin-bottom:10px; }
.pro-tour{ font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.04em;
  background:var(--accent); color:#fff; padding:3px 10px; border-radius:999px; }
.pro-id h1{ font-size:34px; line-height:1.05; letter-spacing:-.02em; margin:0 0 8px; }
.pro-sub{ font-size:14.5px; color:var(--text-dim); margin-bottom:16px; }
.pro-actions{ display:flex; gap:10px; flex-wrap:wrap; }

/* Refined stat strip */
.stat-strip{ display:grid; grid-template-columns:repeat(auto-fit,minmax(90px,1fr)); gap:1px;
  background:var(--border); border:1px solid var(--border); border-radius:14px; overflow:hidden; margin-bottom:30px; }
.stat-strip .cell{ background:var(--panel); padding:18px 12px; text-align:center; }
.stat-strip .cell .v{ font-family:var(--mono); font-weight:700; font-size:22px; color:var(--text); }
.stat-strip .cell .k{ font-size:10.5px; text-transform:uppercase; letter-spacing:.04em; color:var(--text-mute); margin-top:4px; }

@media(max-width:700px){
  .pro-hero-inner{ flex-direction:column; align-items:flex-start; gap:16px; padding:20px; }
  .pro-photo{ width:110px; height:110px; }
  .pro-id h1{ font-size:26px; }
}

/* ============================================================= */
/* Free-usage gate                                                */
/* ============================================================= */
.gate-msg{ display:flex; justify-content:center; margin:20px 0; }
.gate-card{ background:var(--panel); border:1px solid var(--border); border-radius:16px;
  padding:28px 26px; max-width:440px; text-align:center; box-shadow:0 4px 20px rgba(0,0,0,.06); }
.gate-ico{ font-size:34px; margin-bottom:10px; }
.gate-text{ font-size:15px; color:var(--text); line-height:1.55; margin-bottom:18px; }
.gate-actions{ display:flex; gap:10px; justify-content:center; flex-wrap:wrap; }
.gate-banner{ background:var(--accent-sf); color:var(--accent-d); border-radius:10px;
  padding:12px 14px; font-size:13.5px; font-weight:600; margin-bottom:16px; line-height:1.45; }

/* ============================================================= */
/* MinJun mascot animations                                       */
/* ============================================================= */
.minjun{ display:block; }
.minjun .mj-body{ transform-origin:210px 250px; animation:mjBreathe 3s ease-in-out infinite; }
.minjun .mj-tail{ transform-origin:303px 266px; animation:mjTail 1.3s ease-in-out infinite; }
.minjun .mj-ear-left{ transform-origin:156px 122px; animation:mjEarL 5s ease-in-out infinite; }
.minjun .mj-ear-right{ transform-origin:264px 122px; animation:mjEarR 5s ease-in-out infinite; }
.minjun .mj-eye{ transform-box:fill-box; transform-origin:center; animation:mjBlink 4.8s ease-in-out infinite; }
.minjun .mj-cheek{ animation:mjCheek 2.7s ease-in-out infinite; }
.minjun .mj-head{ transform-origin:210px 205px; animation:mjHead 3.8s ease-in-out infinite; }
.minjun .mj-sparkle{ transform-box:fill-box; transform-origin:center; animation:mjSparkle 2.2s ease-in-out infinite; }
.minjun .mj-sparkle.two{ animation-delay:.7s; }
.minjun .mj-sparkle.three{ animation-delay:1.2s; }
@keyframes mjBreathe{ 0%,100%{transform:translateY(0) scale(1)} 50%{transform:translateY(3px) scale(1.012)} }
@keyframes mjHead{ 0%,100%{transform:rotate(0) translateY(0)} 50%{transform:rotate(-1.2deg) translateY(1px)} }
@keyframes mjTail{ 0%,100%{transform:rotate(-5deg)} 50%{transform:rotate(12deg)} }
@keyframes mjEarL{ 0%,82%,100%{transform:rotate(0)} 86%{transform:rotate(-7deg)} 90%{transform:rotate(2deg)} }
@keyframes mjEarR{ 0%,82%,100%{transform:rotate(0)} 86%{transform:rotate(6deg)} 90%{transform:rotate(-2deg)} }
@keyframes mjBlink{ 0%,44%,48%,100%{transform:scaleY(1)} 46%{transform:scaleY(.08)} }
@keyframes mjCheek{ 0%,100%{opacity:.48} 50%{opacity:.8} }
@keyframes mjSparkle{ 0%,100%{transform:scale(.75) rotate(0);opacity:.25} 50%{transform:scale(1.15) rotate(20deg);opacity:1} }
@media(prefers-reduced-motion:reduce){ .minjun *{ animation:none !important; } }

/* ============================================================= */
/* MinJun homepage hero (FoxKies-style)                           */
/* ============================================================= */
.mj-hero{ display:flex; justify-content:center; margin-bottom:8px; }
.mj-title{ font-size:44px; font-weight:900; letter-spacing:-.02em; text-align:center; margin:6px 0 14px; color:var(--text); }
.chat-empty .ce-sub{ max-width:560px; margin:0 auto 26px; text-align:center; font-size:16px; color:var(--text-dim); line-height:1.5; }
.mj-disclaimer{ margin-top:20px; font-size:13px; color:var(--text-mute); text-align:center; }
.mj-disclaimer a{ color:var(--text-dim); text-decoration:underline; }
@media(max-width:600px){ .mj-title{ font-size:32px; } .chat-empty .ce-sub{ font-size:15px; } }

/* Brand logo image */
.brand-logo{ height:38px; width:auto; display:block; }
@media(max-width:860px){ .brand-logo{ height:32px; } }

/* ============================================================= */
/* Membership / pricing                                           */
/* ============================================================= */
.pricing-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(270px,1fr)); gap:20px; margin-bottom:30px; align-items:start; }
.price-card{ position:relative; background:var(--panel); border:1px solid var(--border); border-radius:18px;
  padding:26px 22px; display:flex; flex-direction:column; }
.price-card.is-featured{ border-color:var(--accent); box-shadow:0 8px 30px rgba(16,163,127,.14); }
.price-flag{ position:absolute; top:-11px; left:22px; background:var(--accent); color:#fff; font-size:11px;
  font-weight:700; text-transform:uppercase; letter-spacing:.04em; padding:4px 12px; border-radius:999px; }
.price-name{ font-size:13px; font-weight:900; letter-spacing:.08em; color:var(--accent-d); margin-bottom:10px; }
.price-amt{ font-size:30px; font-weight:900; letter-spacing:-.02em; color:var(--text); }
.price-per{ font-size:14px; font-weight:400; color:var(--text-mute); }
.price-tag{ font-size:13px; color:var(--text-dim); font-weight:600; margin:8px 0 12px; }
.price-blurb{ font-size:13.5px; color:var(--text-dim); line-height:1.5; margin:0 0 18px; min-height:44px; }
.price-cta{ display:block; text-align:center; padding:11px 16px; border-radius:10px; font-weight:700; font-size:14px;
  border:1px solid var(--border-2); color:var(--text); margin-bottom:20px; transition:background .15s,border-color .15s; }
.price-cta:hover{ border-color:var(--accent); }
.price-cta.primary{ background:var(--accent); color:#fff; border-color:transparent; }
.price-cta.primary:hover{ background:var(--accent-d); }
.price-feats{ list-style:none; padding:0; margin:0 0 18px; display:flex; flex-direction:column; gap:9px; }
.price-feats li{ display:flex; gap:9px; font-size:13.5px; color:var(--text); line-height:1.4; }
.pf-check{ color:var(--accent); font-weight:800; flex:none; }
.price-best{ font-size:12.5px; color:var(--text-dim); line-height:1.5; border-top:1px solid var(--border); padding-top:14px; margin-top:auto; }
.founding-banner{ display:flex; align-items:center; gap:20px; background:linear-gradient(135deg,var(--accent-sf),transparent);
  border:1px solid var(--accent); border-radius:18px; padding:24px 26px; margin-bottom:26px; flex-wrap:wrap; }
.founding-banner .fb-mark{ font-size:32px; color:var(--accent); }
.founding-banner h3{ margin:0 0 4px; font-size:19px; }
.founding-banner p{ margin:0; color:var(--text-dim); font-size:14px; }
.founding-banner .price-cta{ margin:0; white-space:nowrap; }
.membership-foot{ text-align:center; color:var(--text-dim); font-size:15px; padding:16px 0 8px; }
@media(max-width:600px){ .founding-banner{ flex-direction:column; text-align:center; align-items:stretch; } }

/* Points banner + packs */
.points-banner{ display:flex; gap:28px; align-items:center; background:var(--panel); border:1px solid var(--border);
  border-radius:14px; padding:16px 22px; margin-bottom:24px; flex-wrap:wrap; }
.pb-label{ display:block; font-size:11px; text-transform:uppercase; letter-spacing:.05em; color:var(--text-mute); }
.pb-value{ font-size:20px; font-weight:800; color:var(--text); }
.pack-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:16px; margin-bottom:30px; }
.pack-card{ background:var(--panel); border:1px solid var(--border); border-radius:14px; padding:22px; text-align:center; }
.pack-pts{ font-size:34px; font-weight:900; color:var(--accent-d); line-height:1; }
.pack-lbl{ font-size:12px; text-transform:uppercase; letter-spacing:.05em; color:var(--text-mute); margin-bottom:8px; }
.pack-price{ font-size:16px; font-weight:700; margin-bottom:14px; }
.pack-card .price-cta{ margin:0; }

/* Language toggle */
.sb-lang{ display:flex; gap:4px; padding:6px 8px; margin:4px 8px 0; }
.sb-lang a{ flex:1; text-align:center; font-size:12px; font-weight:700; padding:6px 4px; border-radius:8px;
  color:var(--text-mute); border:1px solid transparent; }
.sb-lang a.on{ background:var(--accent-sf); color:var(--accent-d); }
.sb-lang a:hover{ background:var(--bg-sunken); }

/* ============================================================= */
/* gxFeed — stories + TikTok-style vertical feed                  */
/* ============================================================= */
.stories-row{ display:flex; gap:16px; overflow-x:auto; padding:4px 2px 18px; margin-bottom:6px;
  scrollbar-width:none; }
.stories-row::-webkit-scrollbar{ display:none; }
.story{ flex:none; display:flex; flex-direction:column; align-items:center; gap:6px; width:72px; }
.story-ring{ width:68px; height:68px; border-radius:50%; padding:3px;
  background:linear-gradient(45deg, var(--gold), var(--accent) 60%, var(--accent-d));
  display:flex; align-items:center; justify-content:center; }
.story-img{ width:100%; height:100%; border-radius:50%; overflow:hidden; border:2px solid var(--panel); background:var(--bg-sunken); }
.story-img img{ width:100%; height:100%; object-fit:cover; }
.story-label{ font-size:11.5px; color:var(--text); font-weight:600; max-width:72px; overflow:hidden;
  text-overflow:ellipsis; white-space:nowrap; text-align:center; }

.feed-filters{ display:flex; gap:10px; flex-wrap:wrap; margin-bottom:22px; }
.feed-filter{ background:var(--panel); border:1px solid var(--border-2); border-radius:999px;
  padding:8px 18px; font-size:14px; font-weight:700; color:var(--text-dim); cursor:pointer; transition:all .15s; }
.feed-filter:hover{ border-color:var(--accent); color:var(--accent-d); }
.feed-filter.on{ background:var(--text); color:#fff; border-color:var(--text); }

/* Vertical TikTok-style stream: tall media cards with overlaid text */
.feed-stream{ display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:16px; }
.feed-post{ position:relative; display:block; border-radius:18px; overflow:hidden; aspect-ratio:9/12;
  background:var(--accent-d); box-shadow:0 3px 16px rgba(0,0,0,.10); transition:transform .18s, box-shadow .18s; }
.feed-post:hover{ transform:translateY(-3px); box-shadow:0 10px 30px rgba(0,0,0,.16); }
.fp-media{ position:absolute; inset:0; }
.fp-media img{ width:100%; height:100%; object-fit:cover; }
.fp-media.noimg{ display:flex; align-items:center; justify-content:center; }
.fp-media.fp-events{ background:linear-gradient(160deg,#5b8f45,#283F24); }
.fp-media.fp-news{ background:linear-gradient(160deg,#467235,#283F24); }
.fp-media.fp-podcasts{ background:linear-gradient(160deg,#c0392b,#7d1f16); }
.fp-media.fp-deals{ background:linear-gradient(160deg,var(--gold),#b8730a); }
.fp-emoji{ font-size:60px; opacity:.9; }
.fp-overlay{ position:absolute; left:0; right:0; bottom:0; padding:18px 16px 16px;
  background:linear-gradient(transparent, rgba(0,0,0,.82)); color:#fff; }
.fp-overlay h3{ font-size:16px; line-height:1.3; margin:8px 0 6px; color:#fff; }
.fp-meta{ font-size:12px; color:rgba(255,255,255,.85); }
.fc-badge{ display:inline-block; font-size:10.5px; font-weight:800; text-transform:uppercase; letter-spacing:.04em;
  padding:3px 10px; border-radius:999px; }
.fc-events{ background:var(--gold); color:#3a2a00; }
.fc-news{ background:#fff; color:var(--accent-d); }
.fc-podcasts{ background:#fff; color:#c0392b; }
.fc-deals{ background:#fff; color:#b8730a; }
@media(max-width:600px){ .feed-stream{ grid-template-columns:1fr 1fr; gap:10px; } .fp-overlay h3{ font-size:13px; } }

/* ============================================================= */
/* Advertising units                                              */
/* ============================================================= */
.feed-adslot, .news-adslot, .player-adslot{ margin:0 0 18px; }
.ad-unit{ position:relative; display:block; border:1px solid var(--border); border-radius:14px; overflow:hidden;
  background:var(--panel); transition:border-color .15s, box-shadow .15s; }
.ad-unit:hover{ border-color:var(--accent); box-shadow:0 3px 14px rgba(0,0,0,.07); }
.ad-tag{ position:absolute; top:8px; right:8px; background:rgba(0,0,0,.55); color:#fff; font-size:10px;
  font-weight:700; text-transform:uppercase; letter-spacing:.05em; padding:2px 7px; border-radius:5px; z-index:2; }
.ad-image img{ display:block; width:100%; height:auto; }
.ad-text{ padding:18px 20px; display:flex; flex-direction:column; gap:5px; }
.ad-text .ad-head{ font-size:16px; font-weight:800; color:var(--text); padding-right:40px; }
.ad-text .ad-body{ font-size:14px; color:var(--text-dim); }
.ad-text .ad-cta{ margin-top:6px; font-size:14px; font-weight:700; color:var(--accent-d); }

/* Sponsor portal */
.sponsor-auth{ min-height:100vh; display:flex; align-items:center; justify-content:center; padding:20px;
  background:var(--bg-soft); }
.sa-card{ background:var(--panel); border:1px solid var(--border); border-radius:18px; padding:34px;
  max-width:400px; width:100%; text-align:center; box-shadow:0 6px 30px rgba(0,0,0,.08); }
.sa-card h1{ font-size:24px; }
.sa-card .auth-form{ text-align:left; margin-top:18px; }
.sponsor-shell{ max-width:1040px; margin:0 auto; padding:0 24px 60px; }
.sp-head{ display:flex; align-items:center; justify-content:space-between; padding:18px 0; border-bottom:1px solid var(--border); margin-bottom:26px; }
.sp-head-right{ display:flex; align-items:center; gap:14px; font-weight:700; }
.sp-body h1{ font-size:28px; }
.spark{ display:flex; align-items:flex-end; gap:3px; height:120px; }
.spark-col{ flex:1; display:flex; align-items:flex-end; height:100%; }
.spark-bar{ width:100%; background:linear-gradient(var(--accent), var(--accent-d)); border-radius:3px 3px 0 0; min-height:2px; }

/* Admin form helpers */
.admin-grid2{ display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.admin-form{ display:flex; flex-direction:column; gap:12px; margin-top:14px; }
.admin-form label{ display:flex; flex-direction:column; gap:5px; font-size:13px; font-weight:600; color:var(--text-dim); }
.admin-form input, .admin-form select{ padding:9px 11px; border:1px solid var(--border-2); border-radius:9px;
  font:inherit; font-size:14px; color:var(--text); background:var(--bg); }
.admin-form .form-row{ display:flex; gap:10px; }
.admin-form .form-row label{ flex:1; }
.btn-primary{ background:var(--accent); color:#fff; border:0; padding:11px 18px; border-radius:10px;
  font-weight:700; font-size:14px; cursor:pointer; }
.btn-primary:hover{ background:var(--accent-d); }
.admin-msg{ background:var(--accent-sf); color:var(--accent-d); padding:12px 16px; border-radius:10px; margin-bottom:18px; font-weight:600; }
.admin-table-wrap{ overflow-x:auto; }
.admin-table{ width:100%; border-collapse:collapse; font-size:14px; }
.admin-table th{ text-align:left; font-size:11px; text-transform:uppercase; letter-spacing:.04em; color:var(--text-mute); padding:8px 10px; border-bottom:1px solid var(--border); }
.admin-table td{ padding:10px; border-bottom:1px solid var(--border); }
.badge-live{ background:var(--accent-sf); color:var(--accent-d); }
.badge-done{ background:var(--bg-sunken); color:var(--text-dim); }
.badge{ font-size:11px; font-weight:700; padding:3px 9px; border-radius:999px; }
@media(max-width:700px){ .admin-grid2{ grid-template-columns:1fr; } }

/* ============================================================= */
/* Premium features: lock, calendar, networking, weather, shop    */
/* ============================================================= */
.feature-lock{ text-align:center; padding:50px 24px; max-width:440px; margin:0 auto; }
.feature-lock .fl-ico{ font-size:44px; margin-bottom:10px; }
.feature-lock h2{ font-size:22px; margin-bottom:8px; }
.feature-lock p{ color:var(--text-dim); margin-bottom:20px; }

/* Calendar */
.cal-month{ margin-bottom:28px; }
.cal-month-title{ font-size:18px; margin-bottom:12px; padding-bottom:8px; border-bottom:2px solid var(--accent-sf); }
.cal-list{ display:flex; flex-direction:column; gap:8px; }
.cal-row{ display:flex; align-items:center; gap:16px; padding:14px 16px; border:1px solid var(--border);
  border-radius:12px; background:var(--panel); transition:border-color .15s, transform .15s; }
.cal-row:hover{ border-color:var(--accent); transform:translateX(3px); }
.cal-row.is-past{ opacity:.6; }
.cal-date{ display:flex; flex-direction:column; align-items:center; min-width:48px; }
.cal-day{ font-size:22px; font-weight:900; color:var(--accent-d); line-height:1; }
.cal-dow{ font-size:11px; text-transform:uppercase; color:var(--text-mute); }
.cal-info{ flex:1; min-width:0; }
.cal-name{ font-weight:700; font-size:15px; }
.cal-meta{ font-size:12.5px; color:var(--text-mute); margin-top:2px; }

/* Networking */
.net-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:16px; }
.net-card{ display:flex; gap:14px; padding:18px; border:1px solid var(--border); border-radius:14px; background:var(--panel); }
.net-avatar{ width:48px; height:48px; border-radius:50%; background:var(--accent-sf); color:var(--accent-d);
  display:flex; align-items:center; justify-content:center; font-weight:800; font-size:20px; flex:none; }
.net-name{ font-weight:700; display:flex; align-items:center; gap:8px; }
.net-bio{ font-size:13px; color:var(--text-dim); margin-top:4px; }

/* Weather + planner */
.planner-grid{ display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.weather-card{ display:flex; align-items:center; gap:18px; margin-top:16px; padding:16px; background:var(--accent-sf); border-radius:12px; }
.wc-temp{ font-size:40px; font-weight:900; color:var(--accent-d); }
.wc-city{ font-weight:700; font-size:16px; }
.wc-desc{ font-size:13px; color:var(--text-dim); }
.wc-verdict{ margin-top:12px; font-weight:600; color:var(--text); }
.planner-chips{ display:flex; flex-wrap:wrap; gap:8px; }
.planner-chips .ce-ex{ display:inline-block; }

/* Shop */
.shop-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:18px; }
.shop-card{ border:1px solid var(--border); border-radius:16px; overflow:hidden; background:var(--panel);
  display:flex; flex-direction:column; transition:border-color .15s, box-shadow .15s; }
.shop-card:hover{ border-color:var(--accent); box-shadow:0 4px 16px rgba(0,0,0,.07); }
.shop-img{ aspect-ratio:1; background:var(--bg-sunken); display:flex; align-items:center; justify-content:center; }
.shop-img img{ width:100%; height:100%; object-fit:cover; }
.shop-ph{ font-size:44px; }
.shop-body{ padding:16px; display:flex; flex-direction:column; gap:6px; flex:1; }
.shop-cat{ font-size:11px; text-transform:uppercase; letter-spacing:.04em; color:var(--accent-d); font-weight:700; }
.shop-body h3{ font-size:15px; }
.shop-desc{ font-size:13px; color:var(--text-dim); }
.shop-foot{ display:flex; align-items:center; justify-content:space-between; margin-top:auto; padding-top:10px; }
.shop-price{ font-weight:800; font-size:16px; }
.shop-buy{ padding:7px 16px; font-size:13px; }
@media(max-width:700px){ .planner-grid{ grid-template-columns:1fr; } }

/* ============================================================= */
/* Golf persona quiz                                              */
/* ============================================================= */
.persona-cta{ display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap;
  background:linear-gradient(135deg,var(--gold-soft),var(--accent-sf)); border:1px solid var(--accent);
  border-radius:16px; padding:20px 24px; margin-bottom:24px; }
.persona-cta .pc-left{ display:flex; align-items:center; gap:16px; }
.persona-cta .pc-emoji{ font-size:34px; }
.persona-cta h3{ margin:0 0 3px; font-size:17px; }
.persona-cta p{ margin:0; font-size:13.5px; color:var(--text-dim); }
.persona-cta .btn-primary{ white-space:nowrap; }

.persona-quiz{ display:flex; flex-direction:column; gap:22px; max-width:720px; }
.pq-block{ background:var(--panel); border:1px solid var(--border); border-radius:16px; padding:22px; }
.pq-q{ font-size:17px; font-weight:800; margin-bottom:14px; display:flex; align-items:center; gap:10px; }
.pq-num{ background:var(--accent); color:#fff; width:26px; height:26px; border-radius:50%; display:inline-flex;
  align-items:center; justify-content:center; font-size:14px; flex:none; }
.pq-options{ display:flex; flex-direction:column; gap:8px; }
.pq-opt{ display:flex; align-items:center; gap:11px; padding:12px 14px; border:1px solid var(--border-2);
  border-radius:11px; cursor:pointer; transition:border-color .12s, background .12s; font-size:14.5px; }
.pq-opt:hover{ border-color:var(--accent); background:var(--accent-sf); }
.pq-opt input{ accent-color:var(--accent); width:18px; height:18px; flex:none; }
.pq-opt input:checked + span{ font-weight:700; }

.persona-result{ text-align:center; max-width:520px; margin:20px auto; padding:40px 30px;
  background:linear-gradient(150deg,var(--accent-sf),var(--gold-soft)); border:1px solid var(--accent); border-radius:22px; }
.pr-badge{ display:inline-block; background:var(--accent-d); color:#fff; font-size:12px; font-weight:800;
  text-transform:uppercase; letter-spacing:.06em; padding:5px 16px; border-radius:999px; margin-bottom:14px; }
.persona-result h2{ font-size:34px; font-weight:900; margin:0 0 12px; color:var(--accent-d); }
.pr-blurb{ font-size:16px; color:var(--text); line-height:1.55; margin-bottom:26px; }
.pr-actions{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }
@media(max-width:600px){ .persona-cta{ flex-direction:column; align-items:stretch; text-align:center; } .persona-cta .pc-left{ flex-direction:column; } }

/* Jungian persona result extras */
.pr-axes{ display:flex; gap:10px; justify-content:center; flex-wrap:wrap; margin-bottom:18px; }
.pr-axis{ background:rgba(255,255,255,.7); border:1px solid var(--border-2); border-radius:999px;
  padding:6px 14px; font-size:13px; color:var(--text-dim); }
.pr-axis strong{ color:var(--accent-d); }
.pr-note{ font-size:12px; color:var(--text-mute); margin-bottom:22px; }

/* ============================================================= */
/* Sponsorship & patronage marketplace                            */
/* ============================================================= */
.spon-how{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:16px; margin-bottom:26px; }
.sh-item{ display:flex; gap:12px; align-items:flex-start; background:var(--panel); border:1px solid var(--border);
  border-radius:14px; padding:16px; }
.sh-num{ background:var(--accent); color:#fff; width:26px; height:26px; border-radius:50%; display:flex;
  align-items:center; justify-content:center; font-weight:800; font-size:13px; flex:none; }
.sh-item strong{ display:block; font-size:14.5px; margin-bottom:3px; }
.sh-item p{ margin:0; font-size:13px; color:var(--text-dim); }

.spon-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:18px; }
.spon-card{ background:var(--panel); border:1px solid var(--border); border-radius:16px; padding:20px;
  display:flex; flex-direction:column; gap:12px; }
.spon-card:hover{ border-color:var(--accent); }
.sc-top{ display:flex; gap:14px; align-items:center; }
.sc-photo{ width:56px; height:56px; border-radius:50%; overflow:hidden; background:var(--accent-sf);
  display:flex; align-items:center; justify-content:center; font-weight:900; color:var(--accent-d); font-size:22px; flex:none; }
.sc-photo img{ width:100%; height:100%; object-fit:cover; }
.spon-card h3{ margin:0; font-size:17px; }
.sc-meta{ font-size:12.5px; color:var(--text-mute); }
.sc-headline{ font-size:14px; color:var(--text-dim); margin:0; }
.sc-stats{ display:flex; gap:16px; border-top:1px solid var(--border); border-bottom:1px solid var(--border); padding:12px 0; }
.sc-stats .v{ display:block; font-weight:800; font-size:16px; color:var(--accent-d); }
.sc-stats .k{ font-size:11px; text-transform:uppercase; color:var(--text-mute); }

.spon-hero{ display:flex; gap:22px; align-items:center; margin-bottom:24px; flex-wrap:wrap; }
.sh-photo{ width:96px; height:96px; border-radius:50%; overflow:hidden; background:var(--accent-sf);
  display:flex; align-items:center; justify-content:center; font-size:38px; font-weight:900; color:var(--accent-d); flex:none; }
.sh-photo img{ width:100%; height:100%; object-fit:cover; }
.spon-hero h1{ margin:0 0 4px; }
.sh-meta{ color:var(--text-mute); font-size:14px; }
.sh-headline{ margin:8px 0 0; font-size:15px; color:var(--text-dim); }

.spon-cols{ display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.patron-tiers{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:12px; }
.patron-tier{ flex:1; min-width:80px; padding:12px 8px; border:1px solid var(--border-2); border-radius:11px;
  background:var(--panel); font-weight:800; font-size:15px; cursor:pointer; transition:all .15s; }
.patron-tier:hover{ border-color:var(--accent); background:var(--accent-sf); color:var(--accent-d); }
.patron-custom{ display:flex; gap:8px; }
.patron-custom input{ flex:1; padding:10px 12px; border:1px solid var(--border-2); border-radius:10px; font:inherit; }

.slot-list{ display:flex; flex-direction:column; gap:10px; }
.slot-row{ display:flex; justify-content:space-between; align-items:center; gap:14px; padding:14px;
  border:1px solid var(--border); border-radius:12px; }
.slot-row.is-taken{ opacity:.55; }
.slot-name{ font-weight:700; font-size:14.5px; }
.slot-desc{ font-size:12.5px; color:var(--text-dim); margin-top:2px; }
.slot-term{ font-size:11.5px; color:var(--text-mute); margin-top:2px; }
.slot-right{ display:flex; flex-direction:column; align-items:flex-end; gap:6px; }
.slot-price{ font-weight:800; font-size:16px; color:var(--accent-d); }
.slot-right .btn-primary{ padding:7px 14px; font-size:13px; }

.backer-wall{ display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:12px; }
.backer{ background:var(--panel); border:1px solid var(--border); border-radius:12px; padding:14px; font-size:13.5px; }
.bk-badge{ display:inline-block; background:var(--accent-sf); color:var(--accent-d); font-size:10.5px; font-weight:800;
  text-transform:uppercase; padding:2px 8px; border-radius:999px; margin-right:6px; }
.bk-badge.is-sponsor{ background:var(--gold); color:#3a2a00; }
.bk-amt{ float:right; font-weight:800; color:var(--accent-d); }
.bk-msg{ margin:6px 0 0; color:var(--text-dim); font-size:12.5px; }

.spon-fees{ margin-top:30px; padding:20px 22px; background:var(--bg-soft); border-radius:14px; }
.spon-fees h3{ margin:0 0 8px; font-size:16px; }
.spon-fees p{ margin:0; font-size:13.5px; color:var(--text-dim); line-height:1.6; }
@media(max-width:760px){ .spon-cols{ grid-template-columns:1fr; } }

.support-cta{ display:block; text-align:center; background:linear-gradient(135deg,var(--gold),var(--accent));
  color:#fff; font-weight:800; padding:14px 20px; border-radius:14px; margin:0 0 18px; font-size:15px; }
.support-cta:hover{ filter:brightness(1.05); color:#fff; }

/* ============================================================= */
/* Voice agent                                                    */
/* ============================================================= */
.mic-btn{ background:transparent; border:0; color:var(--text-mute); cursor:pointer; padding:8px;
  border-radius:50%; display:flex; align-items:center; justify-content:center; transition:all .15s; flex:none; }
.mic-btn:hover{ background:var(--accent-sf); color:var(--accent-d); }

.voice-panel{ position:fixed; inset:0; background:rgba(255,255,255,.97); backdrop-filter:blur(14px);
  z-index:200; display:none; align-items:center; justify-content:center; }
.voice-panel.open{ display:flex; }
.voice-inner{ display:flex; flex-direction:column; align-items:center; gap:26px; }

/* The orb: idle / listening / thinking / speaking */
.voice-orb{ width:190px; height:190px; border-radius:50%; cursor:pointer;
  background:radial-gradient(circle at 35% 30%, #ffffff 0%, var(--gold-soft) 28%, var(--accent) 72%, var(--accent-d) 100%);
  box-shadow:0 12px 60px rgba(70,114,53,.35);
  transition:transform .12s ease-out, box-shadow .3s ease; }
/* Listening: scale is driven live by mic volume in JS, so only glow here. */
.voice-orb.listening{ animation:orbGlow 1.8s ease-in-out infinite; }
.voice-orb.thinking{ animation:orbSpin 3.5s linear infinite, orbBreathe 2s ease-in-out infinite; }
.voice-orb.speaking{ animation:orbSpeak .7s ease-in-out infinite; }
@keyframes orbGlow{ 0%,100%{ box-shadow:0 12px 60px rgba(70,114,53,.35);} 50%{ box-shadow:0 16px 90px rgba(255,191,0,.55);} }
@keyframes orbBreathe{ 0%,100%{ transform:scale(1);} 50%{ transform:scale(1.04);} }
@keyframes orbSpin{ from{ filter:hue-rotate(0deg);} to{ filter:hue-rotate(40deg);} }
@keyframes orbSpeak{ 0%,100%{ transform:scale(1) translateY(0);} 25%{ transform:scale(1.05) translateY(-4px);} 60%{ transform:scale(.98) translateY(2px);} }

.voice-hint{ font-size:13.5px; color:var(--text-mute); margin-top:-14px; }

.voice-label{ font-size:17px; font-weight:700; color:var(--text-dim); min-height:24px; }
.voice-actions{ display:flex; align-items:center; gap:14px; }
.voice-close{ width:46px; height:46px; border-radius:50%; border:1px solid var(--border-2);
  background:var(--panel); color:var(--text); font-size:17px; cursor:pointer; }
.voice-close:hover{ border-color:var(--accent); }
@media(prefers-reduced-motion:reduce){ .voice-orb{ animation:none !important; } }
@media(max-width:600px){ .voice-orb{ width:150px; height:150px; } }

/* ============================================================= */
/* v2 interface — persistent sidebar + clean topbar               */
/* ============================================================= */
.app{ display:flex; min-height:100vh; }

/* ---- Sidebar ---- */
.sidebar{ width:272px; flex:none; position:sticky; top:0; height:100vh;
  background:var(--bg); border-right:1px solid var(--border);
  display:flex; flex-direction:column; padding:18px 14px; overflow-y:auto; transform:none !important; box-shadow:none; }
.sb-head{ display:flex; align-items:flex-start; justify-content:space-between; padding:0 6px 16px; }
.sb-brand{ display:block; }
.sb-wordmark{ display:block; font-size:23px; font-weight:900; letter-spacing:-.02em; color:var(--text); line-height:1.1; }
.sb-dot{ color:var(--accent); }
.sb-tagline{ display:block; font-size:8.5px; letter-spacing:.14em; color:var(--text-mute); font-weight:700; margin-top:2px; }
.sb-collapse{ background:none; border:0; color:var(--text-mute); cursor:pointer; padding:4px; border-radius:6px; }
.sb-collapse:hover{ background:var(--bg-sunken); color:var(--text); }

.sb-new{ display:flex; align-items:center; gap:10px; border:1px solid var(--border-2); border-radius:12px;
  padding:12px 14px; font-weight:700; font-size:14.5px; color:var(--text); margin-bottom:16px; }
.sb-new:hover{ border-color:var(--accent); background:var(--accent-sf); }
.sb-new span{ flex:1; }
.sb-kbd{ font-size:11px; color:var(--text-mute); background:var(--bg-sunken); border-radius:5px; padding:2px 6px; font-family:inherit; }

.sb-nav{ display:flex; flex-direction:column; gap:1px; }
.sb-link{ display:flex; align-items:center; gap:12px; padding:9px 12px; border-radius:9px;
  font-size:14.5px; color:var(--text-dim); font-weight:600; }
.sb-link:hover{ background:var(--bg-sunken); color:var(--text); }
.sb-link.on{ background:var(--accent-sf); color:var(--accent-d); }
.sb-ic{ font-size:15px; width:20px; text-align:center; flex:none; opacity:.9; }
.sb-sep{ height:1px; background:var(--border); margin:12px 6px; }

/* Plan card */
.sb-plan{ margin-top:auto; border:1px solid var(--border); border-radius:14px; padding:16px; }
.sp-title{ display:flex; align-items:center; gap:7px; font-weight:800; font-size:14.5px; margin-bottom:3px; }
.sp-gem{ color:var(--accent); }
.sp-quota{ font-size:12.5px; color:var(--text-mute); margin-bottom:12px; }
.sp-label{ font-size:12.5px; color:var(--text-dim); }
.sp-count{ font-size:27px; font-weight:900; color:var(--accent-d); line-height:1.1; }
.sp-bar{ height:5px; background:var(--bg-sunken); border-radius:999px; overflow:hidden; margin:8px 0 14px; }
.sp-bar span{ display:block; height:100%; background:var(--accent); border-radius:999px; }
.sp-btn{ display:block; text-align:center; border:1px solid var(--border-2); border-radius:10px;
  padding:9px; font-size:13.5px; font-weight:700; color:var(--text); }
.sp-btn:hover{ border-color:var(--accent); color:var(--accent-d); }

/* ---- Topbar ---- */
.topnav{ display:flex; align-items:center; gap:12px; height:72px; padding:0 28px;
  background:var(--bg); border-bottom:0; position:sticky; top:0; z-index:40; }
.tn-menu{ display:none; background:none; border:0; color:var(--text); cursor:pointer; padding:6px; }
.tn-spacer{ flex:1; }
.tn-right{ display:flex; align-items:center; gap:12px; }
.tn-lang{ border:1px solid var(--border-2); border-radius:10px; padding:9px 16px;
  font-size:13.5px; font-weight:700; color:var(--text); }
.tn-lang:hover{ border-color:var(--accent); color:var(--accent-d); }
.tn-bell{ position:relative; display:flex; align-items:center; justify-content:center;
  width:40px; height:40px; color:var(--text-dim); }
.tn-bell:hover{ color:var(--accent-d); }
.tn-dot{ position:absolute; top:7px; right:8px; width:8px; height:8px; border-radius:50%;
  background:var(--accent); border:2px solid var(--bg); }
.tn-acct{ position:relative; }
.tn-acct-btn{ display:flex; align-items:center; gap:8px; background:var(--bg);
  border:1px solid var(--border-2); border-radius:999px; padding:10px 18px;
  font-size:14px; font-weight:700; color:var(--text); cursor:pointer; font-family:inherit; }
.tn-acct-btn:hover{ border-color:var(--accent); }
.tn-menu-drop{ display:none; position:absolute; right:0; top:calc(100% + 8px); min-width:180px;
  background:var(--panel); border:1px solid var(--border); border-radius:12px; padding:6px;
  box-shadow:0 8px 30px rgba(0,0,0,.10); z-index:60; }
.tn-menu-drop.open{ display:block; }
.tn-menu-drop a{ display:block; padding:9px 12px; border-radius:8px; font-size:14px; color:var(--text); }
.tn-menu-drop a:hover{ background:var(--bg-sunken); }

/* ---- Hero ---- */
.mj-title{ font-size:38px; font-weight:900; letter-spacing:-.02em; text-align:center; margin:0 0 10px; }
.mj-name{ color:var(--accent); }
.chat-empty .ce-sub{ font-size:16px; color:var(--text-dim); margin-bottom:28px; }

/* Bigger input with actions bottom-right */
.hero-input{ position:relative; display:block !important; width:100%; max-width:860px;
  border:1px solid var(--border-2); border-radius:16px; padding:18px 18px 56px; box-shadow:none; }
.hero-input textarea{ width:100%; border:0; outline:none; resize:none; background:transparent;
  font-family:inherit; font-size:16px; line-height:1.5; color:var(--text); min-height:46px; max-height:200px; }
.ci-actions{ position:absolute; right:14px; bottom:12px; display:flex; align-items:center; gap:8px; }
.attach-btn{ background:none; border:0; color:var(--text-mute); cursor:pointer; padding:8px;
  border-radius:50%; display:flex; }
.attach-btn:hover{ background:var(--bg-sunken); color:var(--accent-d); }
.send-btn{ width:42px; height:42px; border-radius:50%; background:var(--accent); color:#fff;
  border:0; cursor:pointer; display:flex; align-items:center; justify-content:center; }
.send-btn:hover{ background:var(--accent-d); }
.send-btn:disabled{ opacity:.5; cursor:default; }

.ce-examples{ display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin-top:22px; }
.ce-ex{ background:var(--bg); border:1px solid var(--border-2); border-radius:999px;
  padding:11px 20px; font-size:14px; color:var(--text); cursor:pointer; font-family:inherit; }
.ce-ex:hover{ border-color:var(--accent); color:var(--accent-d); }
.ce-more{ display:flex; align-items:center; gap:7px; color:var(--text-dim); }

.chat-hint{ font-size:13px; color:var(--text-mute); }

/* ---- Responsive: sidebar becomes a drawer on small screens ---- */
@media(max-width:960px){
  .sidebar{ position:fixed; z-index:60; left:0; top:0; height:100vh;
    transform:translateX(-100%) !important; transition:transform .22s ease; box-shadow:2px 0 24px rgba(0,0,0,.14); }
  body.sb-open .sidebar{ transform:translateX(0) !important; }
  .tn-menu{ display:flex; }
  .topnav{ height:62px; padding:0 16px; }
  .mj-title{ font-size:27px; }
  .hero-input{ padding:16px 16px 54px; }
  .tn-lang{ display:none; }
}

/* FAQ / help */
.faq-list{ display:flex; flex-direction:column; gap:10px; max-width:780px; }
.faq{ border:1px solid var(--border); border-radius:12px; padding:16px 18px; background:var(--panel); }
.faq summary{ font-weight:700; font-size:15px; cursor:pointer; list-style:none; }
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::before{ content:'+'; color:var(--accent); font-weight:900; margin-right:10px; }
.faq[open] summary::before{ content:'−'; }
.faq p{ margin:12px 0 0; color:var(--text-dim); font-size:14px; line-height:1.6; }

/* Language picker */
.tn-langwrap{ position:relative; }
.tn-lang{ display:flex; align-items:center; gap:7px; background:var(--bg);
  border:1px solid var(--border-2); border-radius:10px; padding:9px 14px;
  font-size:13.5px; font-weight:700; color:var(--text); cursor:pointer; font-family:inherit; }
.tn-lang:hover{ border-color:var(--accent); color:var(--accent-d); }
#langMenu{ right:0; min-width:170px; max-height:340px; overflow-y:auto; }
#langMenu a.is-on{ background:var(--accent-sf); color:var(--accent-d); font-weight:700; }

/* ============================================================= */
/* Rewards: floating button, modal, quests, daily spin            */
/* ============================================================= */
.rw-fab{ position:fixed; right:22px; bottom:22px; width:56px; height:56px; border-radius:50%;
  background:linear-gradient(140deg,var(--gold),var(--accent)); color:#fff; border:0; font-size:24px;
  cursor:pointer; box-shadow:0 6px 22px rgba(70,114,53,.35); z-index:150;
  display:flex; align-items:center; justify-content:center; transition:transform .15s; }
.rw-fab:hover{ transform:scale(1.08); }
.rw-badge{ position:absolute; top:-3px; right:-3px; min-width:22px; height:22px; border-radius:999px;
  background:#d33; color:#fff; font-size:12px; font-weight:800; display:flex; align-items:center;
  justify-content:center; padding:0 6px; border:2px solid var(--bg); }

.rw-overlay{ position:fixed; inset:0; background:rgba(20,25,18,.55); backdrop-filter:blur(3px);
  z-index:200; display:none; align-items:center; justify-content:center; padding:20px; }
.rw-overlay.open{ display:flex; }
.rw-modal{ background:var(--panel); border-radius:22px; padding:30px; max-width:480px; width:100%;
  max-height:88vh; overflow-y:auto; position:relative; box-shadow:0 20px 70px rgba(0,0,0,.28); }
.rw-x{ position:absolute; top:14px; right:16px; background:none; border:0; font-size:28px;
  color:var(--text-mute); cursor:pointer; line-height:1; }
.rw-x:hover{ color:var(--text); }
.rw-title{ font-size:25px; font-weight:900; margin:0 0 6px; }
.rw-sub{ color:var(--text-dim); font-size:14px; margin-bottom:18px; }
.rw-balance{ background:var(--accent-sf); color:var(--accent-d); border-radius:11px;
  padding:12px 16px; font-size:14.5px; margin-bottom:20px; }
.rw-balance strong{ font-size:17px; }
.rw-section{ margin-bottom:22px; }
.rw-section h3{ font-size:16px; margin-bottom:12px; }

.rw-wheel-wrap{ display:flex; align-items:center; gap:18px; }
.rw-wheel{ width:84px; height:84px; border-radius:50%; flex:none; font-size:38px;
  background:radial-gradient(circle at 35% 30%,#fff,var(--gold-soft) 40%,var(--accent) 100%);
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 6px 20px rgba(70,114,53,.3); }
.rw-wheel.spinning{ animation:rwSpin 1.4s cubic-bezier(.2,.7,.2,1); }
@keyframes rwSpin{ from{ transform:rotate(0);} to{ transform:rotate(1440deg);} }
.rw-spin-side{ flex:1; }
.rw-streak{ font-size:13.5px; color:var(--text-dim); margin-bottom:9px; }
.rw-spin-side .btn-primary{ width:100%; }
.rw-spin-side .btn-primary:disabled{ opacity:.55; cursor:default; }
.rw-result{ margin-top:12px; text-align:center; font-size:15px; color:var(--accent-d); min-height:22px; }

.rw-quests{ display:flex; flex-direction:column; gap:7px; }
.rw-quest{ display:flex; align-items:center; gap:11px; padding:11px 13px;
  border:1px solid var(--border); border-radius:11px; font-size:14px; }
.rw-quest.is-done{ background:var(--accent-sf); border-color:transparent; }
.rw-qlabel{ flex:1; }
.rw-qpts{ font-weight:800; color:var(--accent-d); font-size:13px; }
.rw-loading{ color:var(--text-mute); font-size:14px; }

.rw-toast{ position:fixed; left:50%; bottom:34px; transform:translate(-50%,20px);
  background:var(--accent-d); color:#fff; padding:13px 22px; border-radius:999px;
  font-weight:700; font-size:14.5px; z-index:300; opacity:0; transition:all .3s;
  box-shadow:0 8px 26px rgba(0,0,0,.25); }
.rw-toast.show{ opacity:1; transform:translate(-50%,0); }
@media(max-width:600px){ .rw-fab{ right:16px; bottom:80px; } .rw-modal{ padding:24px 20px; } }

/* Data freshness notice */
.freshness-note{ background:var(--accent-sf); color:var(--accent-d); border-radius:10px;
  padding:11px 16px; font-size:13.5px; margin-bottom:18px; }
.freshness-note.is-stale{ background:#fff6e0; color:#7a5a00; border:1px solid #f0d488; }

/* Historical import progress */
.hist-progress{ margin-top:16px; }
.hp-bar{ height:8px; background:var(--bg-sunken); border-radius:999px; overflow:hidden; }
.hp-bar span{ display:block; height:100%; width:0; background:var(--accent); border-radius:999px; transition:width .25s; }
.hp-text{ font-size:13px; color:var(--text-dim); margin-top:8px; }
.hist-log{ margin-top:14px; max-height:180px; overflow-y:auto; font-size:12.5px;
  color:var(--text-mute); font-family:ui-monospace,SFMono-Regular,Menlo,monospace; line-height:1.6; }

/* ============================================================= */
/* Strokes gained                                                 */
/* ============================================================= */
.sg-panel{ padding:22px; }
.sg-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:18px; }
.sg-cell.is-total{ grid-column:1/-1; border-top:1px solid var(--border); padding-top:16px; }
.sg-label{ font-size:12px; text-transform:uppercase; letter-spacing:.04em; color:var(--text-mute); margin-bottom:4px; }
.sg-value{ font-size:22px; font-weight:900; line-height:1.1; }
.sg-cell.is-total .sg-value{ font-size:28px; }
.sg-value.sg-pos, .score-par.sg-pos{ color:var(--under, #2f7a2f); }
.sg-value.sg-neg, .score-par.sg-neg{ color:var(--over, #b23b3b); }
.sg-track{ height:4px; background:var(--bg-sunken); border-radius:999px; margin-top:7px; overflow:hidden; }
.sg-track span{ display:block; height:100%; border-radius:999px; background:var(--text-mute); }
.sg-track span.sg-pos{ background:var(--under, #2f7a2f); }
.sg-track span.sg-neg{ background:var(--over, #b23b3b); }
.sg-foot{ margin-top:18px; padding-top:14px; border-top:1px solid var(--border);
  font-size:12.5px; color:var(--text-mute); line-height:1.6; }

.sg-tabs{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:14px; }
.sg-tab{ border:1px solid var(--border-2); border-radius:999px; padding:9px 17px;
  font-size:13.5px; font-weight:600; color:var(--text-dim); }
.sg-tab:hover{ border-color:var(--accent); color:var(--accent-d); }
.sg-tab.on{ background:var(--accent); border-color:var(--accent); color:#fff; }
.sg-seasons{ display:flex; gap:6px; flex-wrap:wrap; margin-bottom:18px; }
.sg-season{ font-size:12.5px; color:var(--text-mute); padding:5px 11px; border-radius:8px; }
.sg-season:hover{ background:var(--bg-sunken); color:var(--text); }
.sg-season.on{ background:var(--accent-sf); color:var(--accent-d); font-weight:700; }

/* ============================================================= */
/* Social feed — single-column stream of post cards               */
/* ============================================================= */
.feed-stream{ display:flex; flex-direction:column; gap:16px; max-width:620px; margin:0 auto; }

.post{ background:var(--panel); border:1px solid var(--border); border-radius:16px;
  overflow:hidden; transition:box-shadow .18s; }
.post:hover{ box-shadow:0 4px 18px rgba(0,0,0,.06); }

/* header: avatar + author + time */
.post-head{ display:flex; align-items:center; gap:11px; padding:14px 16px 10px; }
.post-avatar{ width:42px; height:42px; border-radius:50%; flex:none; display:flex;
  align-items:center; justify-content:center; font-size:20px; background:var(--bg-sunken); }
.pav-events{ background:linear-gradient(140deg,#e8f3e0,#cfe6c0); }
.pav-news{ background:linear-gradient(140deg,#e4eefb,#cfe0f5); }
.pav-podcasts{ background:linear-gradient(140deg,#f3e6f8,#e4cff0); }
.pav-deals{ background:linear-gradient(140deg,#fdf0d9,#f7dfb0); }
.post-who{ min-width:0; flex:1; }
.post-author{ font-weight:800; font-size:14.5px; display:flex; align-items:center;
  gap:8px; flex-wrap:wrap; line-height:1.3; }
.post-badge{ font-size:10.5px; font-weight:700; text-transform:uppercase;
  letter-spacing:.04em; padding:2px 8px; border-radius:999px; }
.post-time{ font-size:12.5px; color:var(--text-mute); margin-top:2px; }

/* body */
.post-body{ display:block; padding:0 16px 14px; color:inherit; }
.post-title{ font-size:16.5px; font-weight:700; line-height:1.4; margin:0; }
.post-text + .post-title, .post-title + .post-text{ margin-top:6px; }
.post-body:hover .post-title{ color:var(--accent-d); }
.post-text{ font-size:14px; color:var(--text-dim); line-height:1.6; margin:0 0 10px; }
.post-media{ margin:10px -16px 0; background:var(--bg-sunken); }
.post-media img{ width:100%; max-height:420px; object-fit:cover; display:block; }

/* engagement counts */
.post-stats{ display:flex; align-items:center; justify-content:space-between;
  padding:0 16px; font-size:12.5px; color:var(--text-mute); gap:12px; }
/* Only take up space when a count is actually visible. :empty won't match here
   because the element holds whitespace and hidden spans, so drive it from a class. */
.post-stats:not(.has-stats){ display:none; }
.post-stats.has-stats{ display:flex; padding:9px 16px 0; }
.ps-heart{ color:#e0245e; }
.post-stats:empty{ display:none; }

/* action bar */
.post-actions{ display:flex; border-top:1px solid var(--border); margin-top:0; }
.pa-btn{ flex:1; background:none; border:0; padding:11px 6px; font-family:inherit;
  font-size:13.5px; font-weight:600; color:var(--text-dim); cursor:pointer;
  display:flex; align-items:center; justify-content:center; gap:7px; transition:background .15s; }
.pa-btn:hover{ background:var(--bg-sunken); }
.pa-ic{ font-size:15px; }
.pa-like.on{ color:#e0245e; }
.pa-like.on .pa-ic{ color:#e0245e; }
.pa-btn.pop .pa-ic{ animation:paPop .32s ease; }
@keyframes paPop{ 0%{transform:scale(1)} 45%{transform:scale(1.45)} 100%{transform:scale(1)} }

/* comments */
.post-comments{ border-top:1px solid var(--border); padding:12px 16px 14px;
  background:var(--bg-sunken); }
.pc-item{ display:flex; gap:9px; margin-bottom:10px; }
.pc-avatar{ width:30px; height:30px; border-radius:50%; flex:none; background:var(--accent);
  color:#fff; font-size:11.5px; font-weight:800; display:flex; align-items:center; justify-content:center; }
.pc-bubble{ background:var(--panel); border-radius:14px; padding:9px 13px; flex:1; min-width:0; }
.pc-name{ font-size:12.5px; font-weight:800; }
.pc-ago{ font-weight:500; color:var(--text-mute); font-size:11.5px; margin-left:4px; }
.pc-body{ font-size:13.5px; line-height:1.55; margin-top:2px; word-wrap:break-word; }
.pc-empty{ font-size:13px; color:var(--text-mute); padding:4px 0 8px; }
.pc-compose{ display:flex; gap:9px; align-items:center; }
.pc-input{ flex:1; border:1px solid var(--border-2); border-radius:999px; padding:9px 15px;
  font-family:inherit; font-size:13.5px; background:var(--panel); color:var(--text); }
.pc-input:focus{ outline:none; border-color:var(--accent); }
.pc-login{ font-size:13px; color:var(--text-mute); }
.pc-login a{ color:var(--accent-d); font-weight:700; }

.feed-adslot{ max-width:620px; margin:0 auto; }
@media(max-width:680px){
  .feed-stream, .feed-adslot{ max-width:100%; }
  .post{ border-radius:12px; }
  .post-media{ margin:10px -16px 0; }
}

/* ============================================================= */
/* Community: listings, equipment, coaches, networking            */
/* ============================================================= */
.lk-tabs{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:18px; }
.lk-tab{ display:flex; align-items:center; gap:7px; border:1px solid var(--border-2);
  border-radius:999px; padding:9px 16px; font-size:13.5px; font-weight:600; color:var(--text-dim); }
.lk-tab:hover{ border-color:var(--accent); color:var(--accent-d); }
.lk-tab.on{ background:var(--accent); border-color:var(--accent); color:#fff; }

.lst-filters{ display:flex; gap:10px; flex-wrap:wrap; margin-bottom:18px; }
.lst-filters input[type=search], .lst-filters select, .lst-filters input[type=text]{
  border:1px solid var(--border-2); border-radius:10px; padding:10px 14px;
  font-family:inherit; font-size:14px; background:var(--panel); color:var(--text); }
.lst-filters input[type=search]{ flex:1; min-width:180px; }
.lst-filters input:focus, .lst-filters select:focus{ outline:none; border-color:var(--accent); }
.lst-count{ font-size:13px; color:var(--text-mute); margin-bottom:14px; }

.lst-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(270px,1fr)); gap:18px; }
.lst-card{ display:block; background:var(--panel); border:1px solid var(--border);
  border-radius:16px; overflow:hidden; transition:transform .15s, box-shadow .15s; color:inherit; }
.lst-card:hover{ transform:translateY(-3px); box-shadow:0 10px 26px rgba(0,0,0,.10); }
.lc-media{ height:150px; background:var(--bg-sunken); }
.lc-media img{ width:100%; height:100%; object-fit:cover; display:block; }
.lc-media.noimg{ display:flex; align-items:center; justify-content:center; font-size:40px; }
.lc-trip{ background:linear-gradient(140deg,#dceaf7,#b9d6ee); }
.lc-league{ background:linear-gradient(140deg,#e6f2dc,#c8e3b2); }
.lc-scramble{ background:linear-gradient(140deg,#e0f0e6,#bcdcc8); }
.lc-lesson{ background:linear-gradient(140deg,#fdf0d9,#f6dcae); }
.lc-event{ background:linear-gradient(140deg,#f2e4f8,#dfc4ee); }
.lc-body{ padding:15px 16px 16px; position:relative; }
.lc-flag{ position:absolute; top:-30px; left:14px; background:var(--gold); color:#3a2c00;
  font-size:10.5px; font-weight:800; text-transform:uppercase; letter-spacing:.05em;
  padding:4px 10px; border-radius:999px; }
.lc-body h3{ font-size:16px; font-weight:800; line-height:1.35; margin:0 0 8px; }
.lc-meta{ display:flex; flex-direction:column; gap:3px; font-size:12.5px; color:var(--text-mute); }
.lc-sum{ font-size:13.5px; color:var(--text-dim); line-height:1.55; margin:9px 0 0; }
.lc-foot{ display:flex; align-items:center; gap:10px; margin-top:12px; padding-top:11px;
  border-top:1px solid var(--border); font-size:13px; }
.lc-price{ font-weight:800; color:var(--accent-d); }
.lc-interest{ color:var(--text-mute); font-size:12.5px; }
.lc-full{ margin-left:auto; background:#fdeaea; color:#b23b3b; font-size:11px;
  font-weight:700; padding:3px 9px; border-radius:999px; }

/* Listing detail */
.ld-wrap{ display:grid; grid-template-columns:1fr 320px; gap:26px; align-items:start; }
.ld-hero{ border-radius:16px; overflow:hidden; margin-bottom:18px; background:var(--bg-sunken); }
.ld-hero img{ width:100%; max-height:340px; object-fit:cover; display:block; }
.ld-title{ font-size:30px; font-weight:900; line-height:1.2; margin:0 0 18px; }
.ld-facts{ display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:16px; padding:18px; background:var(--panel); border:1px solid var(--border);
  border-radius:14px; margin-bottom:20px; }
.ld-facts div{ display:flex; flex-direction:column; gap:3px; }
.ld-facts span{ font-size:11.5px; text-transform:uppercase; letter-spacing:.04em; color:var(--text-mute); }
.ld-facts b{ font-size:14.5px; }
.ld-summary{ font-size:16px; line-height:1.7; color:var(--text-dim); margin-bottom:16px; }
.ld-desc{ font-size:14.5px; line-height:1.8; }
.ld-count{ font-size:14px; color:var(--text-dim); }
.ld-count strong{ font-size:22px; color:var(--text); display:block; }
.ld-rel{ display:block; padding:9px 0; border-bottom:1px solid var(--border); color:inherit; }
.ld-rel:last-child{ border-bottom:0; }
.ld-rel b{ display:block; font-size:13.5px; font-weight:700; }
.ld-rel span{ font-size:12px; color:var(--text-mute); }
.ld-rel:hover b{ color:var(--accent-d); }
@media(max-width:900px){ .ld-wrap{ grid-template-columns:1fr; } }

/* Equipment */
.eq-bar{ display:flex; gap:12px; align-items:flex-end; flex-wrap:wrap; margin-bottom:16px; }
.eq-bar label{ display:flex; flex-direction:column; gap:5px; font-size:12.5px;
  font-weight:600; color:var(--text-dim); }
.eq-bar input, .eq-bar select{ border:1px solid var(--border-2); border-radius:10px;
  padding:10px 14px; font-family:inherit; font-size:14px; background:var(--panel); color:var(--text); }
.eq-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:18px; }
.eq-card{ background:var(--panel); border:1px solid var(--border); border-radius:14px; overflow:hidden; }
.eq-media{ height:150px; background:var(--bg-sunken); display:flex; align-items:center; justify-content:center; }
.eq-media img{ width:100%; height:100%; object-fit:contain; padding:12px; }
.eq-media.noimg span{ font-size:38px; }
.eq-body{ padding:14px 16px 16px; }
.eq-cat{ font-size:11px; text-transform:uppercase; letter-spacing:.05em; color:var(--text-mute); }
.eq-body h3{ font-size:15px; font-weight:800; margin:4px 0 7px; line-height:1.35; }
.eq-best{ font-size:12.5px; color:var(--accent-d); background:var(--accent-sf);
  display:inline-block; padding:3px 9px; border-radius:999px; margin-bottom:8px; }
.eq-sum{ font-size:13px; color:var(--text-dim); line-height:1.55; margin:0 0 10px; }
.eq-foot{ display:flex; align-items:center; gap:10px; font-size:13.5px; }
.eq-price{ font-weight:800; }
.eq-rating{ color:var(--gold-d, #a8860b); font-weight:700; }
.eq-buy{ display:block; text-align:center; margin-top:11px; }

/* Coaches */
.coach-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:18px; }
.coach-card{ background:var(--panel); border:1px solid var(--border); border-radius:14px; padding:18px; }
.cc-top{ display:flex; gap:13px; align-items:center; margin-bottom:12px; }
.cc-photo{ width:52px; height:52px; border-radius:50%; object-fit:cover; flex:none; }
.cc-ini{ background:var(--accent); color:#fff; display:flex; align-items:center;
  justify-content:center; font-weight:800; font-size:17px; }
.cc-top h3{ font-size:15.5px; font-weight:800; margin:0; }
.cc-verified{ color:var(--accent); font-size:13px; }
.cc-loc{ font-size:12.5px; color:var(--text-mute); margin-top:2px; }
.cc-tags{ display:flex; gap:6px; flex-wrap:wrap; margin-bottom:10px; }
.cc-tag{ background:var(--bg-sunken); font-size:11.5px; padding:3px 9px; border-radius:999px; color:var(--text-dim); }
.cc-cred{ font-size:12.5px; color:var(--text-mute); line-height:1.5; margin-bottom:12px; }
.cc-foot{ display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding-top:12px; border-top:1px solid var(--border); }
.cc-rate{ font-weight:800; font-size:14px; color:var(--accent-d); }

/* Networking extras */
.net-form-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:14px; }
.net-role{ font-size:13.5px; color:var(--text-dim); font-weight:600; margin-top:2px; }
.net-chips{ display:flex; gap:6px; flex-wrap:wrap; margin:8px 0; }
.net-chip{ background:var(--bg-sunken); font-size:11.5px; padding:3px 9px;
  border-radius:999px; color:var(--text-dim); }
.net-seeking{ font-size:13px; color:var(--text-dim); line-height:1.55; margin:8px 0 0;
  padding-top:8px; border-top:1px solid var(--border); }
.net-li{ display:inline-block; margin-top:9px; font-size:12.5px; font-weight:700; color:var(--accent-d); }

.sb-sec{ font-size:10.5px; text-transform:uppercase; letter-spacing:.08em;
  color:var(--text-mute); font-weight:800; padding:14px 14px 6px; }

/* ============================================================= */
/* Composer + user-generated posts                                */
/* ============================================================= */
.composer{ max-width:620px; margin:0 auto 18px; background:var(--panel);
  border:1px solid var(--border); border-radius:16px; padding:16px; }
.cmp-signin{ text-align:center; font-size:14px; color:var(--text-dim); padding:20px; }
.cmp-signin a{ color:var(--accent-d); font-weight:700; }
.cmp-top{ display:flex; gap:11px; align-items:flex-start; }
.cmp-avatar{ width:42px; height:42px; border-radius:50%; flex:none; background:var(--accent);
  color:#fff; font-weight:800; font-size:15px; display:flex; align-items:center; justify-content:center; }
.cmp-top textarea{ flex:1; border:0; background:none; resize:none; font-family:inherit;
  font-size:15.5px; line-height:1.55; color:var(--text); padding:10px 0; min-height:46px; }
.cmp-top textarea:focus{ outline:none; }
.cmp-top textarea::placeholder{ color:var(--text-mute); }
.cmp-preview{ position:relative; margin:10px 0 0; border-radius:12px; overflow:hidden; }
.cmp-preview img{ width:100%; max-height:320px; object-fit:cover; display:block; }
.cmp-clear{ position:absolute; top:8px; right:8px; width:28px; height:28px; border-radius:50%;
  border:0; background:rgba(0,0,0,.6); color:#fff; font-size:18px; cursor:pointer; line-height:1; }
.cmp-video{ margin-top:10px; }
.cmp-video input{ width:100%; border:1px solid var(--border-2); border-radius:10px;
  padding:10px 14px; font-family:inherit; font-size:14px; background:var(--bg); color:var(--text); }
.cmp-video input:focus{ outline:none; border-color:var(--accent); }
.cmp-bar{ display:flex; align-items:center; gap:8px; margin-top:12px; padding-top:12px;
  border-top:1px solid var(--border); flex-wrap:wrap; }
.cmp-act{ display:inline-flex; align-items:center; gap:6px; background:none; border:0;
  font-family:inherit; font-size:13.5px; font-weight:600; color:var(--text-dim);
  cursor:pointer; padding:7px 11px; border-radius:9px; }
.cmp-act:hover{ background:var(--bg-sunken); color:var(--text); }
.cmp-as{ border:1px solid var(--border-2); border-radius:9px; padding:7px 11px;
  font-family:inherit; font-size:13px; background:var(--bg); color:var(--text); }
.cmp-send{ margin-left:auto; padding:9px 22px; }

/* UGC post treatment */
.post-ugc{ border-color:var(--border-2); }
.post-avatar-img{ object-fit:cover; }
.pav-member{ background:var(--accent); color:#fff; font-weight:800; font-size:15px; }
.post-verified{ color:var(--accent); font-size:13px; margin-left:2px; }
.post-body-ugc{ cursor:default; }
.post-usertext{ font-size:15px; line-height:1.6; margin:0 0 10px; white-space:pre-wrap; word-wrap:break-word; }
.post-video{ position:relative; padding-bottom:56.25%; height:0; margin:10px -16px 0; background:#000; }
.post-video iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }
.post-link{ display:inline-block; margin-top:9px; font-size:13px; color:var(--accent-d);
  background:var(--accent-sf); padding:6px 12px; border-radius:8px; font-weight:600; }
.post-menu{ background:none; border:0; color:var(--text-mute); font-size:20px; cursor:pointer;
  padding:2px 8px; border-radius:7px; line-height:1; align-self:flex-start; }
.post-menu:hover{ background:var(--bg-sunken); color:var(--text); }
.pa-report{ flex:0 0 auto !important; padding:11px 14px !important; }

/* Post moderation */
.mod-list{ display:flex; flex-direction:column; gap:14px; }
.mod-post{ background:var(--panel); border:1px solid var(--border); border-radius:14px; padding:18px; }
.mod-head{ display:flex; justify-content:space-between; align-items:center; gap:12px;
  flex-wrap:wrap; margin-bottom:10px; }
.mod-time{ font-size:12.5px; color:var(--text-mute); margin-left:8px; }
.mod-flags{ display:flex; gap:7px; align-items:center; }
.mod-report{ background:#fdeaea; color:#b23b3b; font-size:11.5px; font-weight:700;
  padding:3px 9px; border-radius:999px; }
.mod-body{ font-size:14px; line-height:1.6; margin:0 0 10px; }
.mod-media{ max-width:280px; max-height:200px; border-radius:10px; display:block; margin-bottom:10px; }
.mod-video{ font-size:13px; margin-bottom:10px; }
.mod-video a{ color:var(--accent-d); }
.mod-reasons{ font-size:12.5px; color:#b23b3b; background:#fdeaea; padding:8px 12px;
  border-radius:8px; margin-bottom:10px; }
.mod-actions{ display:flex; gap:8px; flex-wrap:wrap; padding-top:12px; border-top:1px solid var(--border); }
.mod-actions form{ margin:0; }

/* ============================================================= */
/* Inline SVG icons (replaces emoji)                              */
/* ============================================================= */
.gx-icon{ display:inline-block; vertical-align:-0.18em; flex:none; }
.gx-icon.is-filled{ fill:currentColor; }
/* Icons sitting next to text in buttons/links */
.pa-btn .gx-icon, .cmp-act .gx-icon, .pill-link .gx-icon{ vertical-align:-0.22em; }
.sb-ic .gx-icon{ vertical-align:-0.25em; }

/* ============================================================= */
/* Inline video player (podcasts / YouTube)                       */
/* ============================================================= */
.vid-overlay{ position:fixed; inset:0; background:rgba(12,16,10,.82); backdrop-filter:blur(4px);
  z-index:400; display:none; align-items:center; justify-content:center; padding:24px; }
.vid-overlay.open{ display:flex; }
.vid-box{ width:100%; max-width:960px; }
.vid-head{ display:flex; align-items:center; justify-content:space-between; gap:16px;
  margin-bottom:12px; color:#fff; }
.vid-title{ font-size:15.5px; font-weight:700; overflow:hidden; text-overflow:ellipsis;
  white-space:nowrap; }
.vid-x{ background:rgba(255,255,255,.14); border:0; color:#fff; width:38px; height:38px;
  border-radius:50%; cursor:pointer; display:flex; align-items:center; justify-content:center;
  flex:none; transition:background .15s; }
.vid-x:hover{ background:rgba(255,255,255,.28); }
.vid-frame{ position:relative; width:100%; aspect-ratio:16/9; background:#000;
  border-radius:14px; overflow:hidden; box-shadow:0 24px 70px rgba(0,0,0,.5); }
.vid-frame iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }

/* Buttons that used to be links need to look identical */
button.yt-lead{ display:block; width:100%; padding:0; border:0; background:none;
  cursor:pointer; font:inherit; text-align:left; }
button.yt-more-item{ border:0; background:none; font:inherit; cursor:pointer;
  text-align:left; width:100%; padding:0; color:inherit; }
button.yt-latest{ border:0; background:none; font:inherit; cursor:pointer; padding:0;
  text-align:left; color:var(--accent-d); font-weight:600; }
button.yt-latest:hover{ text-decoration:underline; }
.yt-thumb .gx-icon{ color:#fff; }
.yt-play{ display:flex; align-items:center; justify-content:center; }
@media(max-width:700px){
  .vid-overlay{ padding:14px; }
  .vid-title{ font-size:14px; }
}

/* Click-to-play video in the feed */
.post-video{ position:relative; width:100%; aspect-ratio:16/9; background:#000;
  margin-top:10px; border-radius:10px; overflow:hidden; }
.post-video iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }
.post-video.vid-lazy{ cursor:pointer; }
.vid-poster{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.vid-btn{ position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  width:62px; height:62px; border-radius:50%; background:rgba(0,0,0,.62); color:#fff;
  display:flex; align-items:center; justify-content:center; transition:background .15s, transform .15s; }
.post-video.vid-lazy:hover .vid-btn{ background:var(--accent); transform:translate(-50%,-50%) scale(1.08); }
.post-video.vid-lazy:focus{ outline:2px solid var(--accent); outline-offset:2px; }

/* ============================================================= */
/* Feed layout: centre column + right rail                        */
/* ============================================================= */
.feed-layout{ display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:22px;
  align-items:start; max-width:1000px; margin:0 auto; }
.feed-col{ min-width:0; }
.feed-col .feed-stream, .feed-col .composer, .feed-col .feed-adslot{ max-width:100%; }
.feed-rail{ position:sticky; top:84px; display:flex; flex-direction:column; gap:14px; }
@media(max-width:1080px){
  .feed-layout{ grid-template-columns:minmax(0,1fr); max-width:620px; }
  .feed-rail{ display:none; }
}

/* Stories */
.stories-card{ background:var(--panel); border:1px solid var(--border);
  border-radius:16px; padding:16px 6px 14px; margin-bottom:16px; }
.stories-row{ display:flex; gap:16px; overflow-x:auto; padding:0 12px 4px;
  scrollbar-width:none; }
.stories-row::-webkit-scrollbar{ display:none; }
.story{ flex:none; width:72px; text-align:center; color:inherit; }
.story-ring{ display:block; width:66px; height:66px; border-radius:50%; padding:2.5px;
  background:conic-gradient(from 160deg, var(--accent), var(--gold), var(--accent));
  margin:0 auto 7px; }
.story-img{ display:block; width:100%; height:100%; border-radius:50%; overflow:hidden;
  border:2.5px solid var(--panel); background:var(--bg-sunken); }
.story-img img{ width:100%; height:100%; object-fit:cover; display:block; }
.story-ini{ width:100%; height:100%; display:flex; align-items:center; justify-content:center;
  font-weight:800; font-size:19px; color:var(--accent-d); background:var(--accent-sf); }
.story-label{ display:block; font-size:11.5px; color:var(--text-dim); overflow:hidden;
  text-overflow:ellipsis; white-space:nowrap; }
.story:hover .story-label{ color:var(--accent-d); }

/* Composer quick actions */
.cmp-bar{ display:flex; align-items:center; gap:4px; flex-wrap:wrap;
  border-top:1px solid var(--border); padding-top:11px; margin-top:11px; }
.cmp-act{ display:inline-flex; align-items:center; gap:7px; background:none; border:0;
  padding:8px 11px; border-radius:9px; font-family:inherit; font-size:13px;
  font-weight:600; color:var(--text-dim); cursor:pointer; transition:background .15s; }
.cmp-act:hover{ background:var(--bg-sunken); color:var(--accent-d); }
.cmp-ask{ margin-left:auto; color:var(--accent-d); }
@media(max-width:620px){ .cmp-act span{ display:none; } .cmp-act{ padding:8px; } }

/* Right rail cards */
.rail-card{ background:var(--panel); border:1px solid var(--border);
  border-radius:14px; padding:16px; }
.rail-head{ display:flex; align-items:baseline; justify-content:space-between; margin-bottom:11px; }
.rail-head h3{ font-size:14.5px; font-weight:800; margin:0; }
.rail-head a{ font-size:12px; color:var(--accent-d); font-weight:600; }
.rail-row{ display:flex; align-items:center; gap:10px; padding:8px 0; color:inherit;
  border-bottom:1px solid var(--border); }
.rail-row:last-child{ border-bottom:0; padding-bottom:0; }
.rail-row:hover .rail-txt b{ color:var(--accent-d); }
.rail-ic{ width:30px; height:30px; border-radius:8px; background:var(--accent-sf);
  color:var(--accent-d); display:flex; align-items:center; justify-content:center; flex:none; }
.rail-txt{ flex:1; min-width:0; display:flex; flex-direction:column; gap:1px; }
.rail-txt b{ font-size:13px; font-weight:700; line-height:1.35;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.rail-txt small{ font-size:11.5px; color:var(--text-mute); }
.rail-live{ background:#fdeaea; color:#c62828; font-size:9.5px; font-weight:800;
  padding:3px 7px; border-radius:999px; letter-spacing:.04em; flex:none; }
.rail-date{ width:34px; flex:none; text-align:center; background:var(--bg-sunken);
  border-radius:8px; padding:4px 0; }
.rail-date em{ display:block; font-style:normal; font-size:9px; font-weight:800;
  color:var(--text-mute); letter-spacing:.05em; }
.rail-date b{ display:block; font-size:15px; font-weight:800; line-height:1.1; }
.rail-thumb{ width:46px; height:46px; border-radius:8px; object-fit:cover; flex:none; }
.rail-story .rail-txt b{ white-space:normal; font-size:12.5px;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.rail-av{ width:34px; height:34px; border-radius:50%; object-fit:cover; flex:none; }
.rail-ini{ background:var(--accent); color:#fff; display:flex; align-items:center;
  justify-content:center; font-size:12px; font-weight:800; }
.rail-add{ width:26px; height:26px; border-radius:7px; border:1px solid var(--border-2);
  display:flex; align-items:center; justify-content:center; color:var(--accent-d); flex:none; }
.rail-row:hover .rail-add{ background:var(--accent); border-color:var(--accent); color:#fff; }
.rail-course .rc-name{ font-size:14px; font-weight:800; }
.rail-course .rc-loc{ font-size:12.5px; color:var(--text-mute); margin-top:2px; }
.rail-course .rc-meta{ display:flex; gap:8px; flex-wrap:wrap; margin-top:9px; }
.rail-course .rc-meta span{ background:var(--bg-sunken); font-size:11.5px;
  padding:3px 9px; border-radius:999px; color:var(--text-dim); }

/* ============================================================= */
/* Feed loading: shimmer skeletons + progressive reveal           */
/* ============================================================= */
.feed-skeleton{ display:flex; flex-direction:column; gap:16px; }
.sk-post{ background:var(--panel); border:1px solid var(--border);
  border-radius:16px; padding:16px; }
.sk-head{ display:flex; align-items:center; gap:11px; margin-bottom:14px; }
.sk-lines{ flex:1; display:flex; flex-direction:column; gap:6px; }
.sk{ background:linear-gradient(90deg,
       var(--bg-sunken) 25%, rgba(0,0,0,.045) 37%, var(--bg-sunken) 63%);
  background-size:400% 100%; animation:shimmer 1.4s ease-in-out infinite;
  border-radius:6px; }
@keyframes shimmer{ 0%{ background-position:100% 50%; } 100%{ background-position:0 50%; } }
.sk-avatar{ width:42px; height:42px; border-radius:50%; flex:none; }
.sk-line{ height:11px; margin-bottom:8px; }
.sk-media{ height:170px; border-radius:10px; margin:12px 0; }
.sk-actions{ display:flex; gap:10px; padding-top:12px; border-top:1px solid var(--border); }
.sk-pill{ height:26px; flex:1; border-radius:8px; }

/* Posts below the fold start hidden, then fade in as they're revealed. */
.post-defer{ display:none !important; }
.feed-stream.is-loading{ display:none; }
.feed-stream .post{ animation:postIn .28s ease both; }
@keyframes postIn{ from{ opacity:0; transform:translateY(6px); } to{ opacity:1; transform:none; } }
.feed-sentinel{ height:1px; }

@media (prefers-reduced-motion: reduce){
  .sk{ animation:none; }
  .feed-stream .post{ animation:none; }
}
.post.filtered-out{ display:none !important; }

/* ============================================================= */
/* Sponsored text ad inside the assistant chat                    */
/* ============================================================= */
.chat-ad{ display:flex; justify-content:flex-start; margin:2px 0 14px; padding-left:46px; }
.ca-inner{ display:block; max-width:520px; background:var(--panel);
  border:1px solid var(--border); border-left:3px solid var(--gold);
  border-radius:12px; padding:13px 16px; color:inherit; transition:border-color .15s, transform .15s; }
.ca-inner:hover{ border-color:var(--accent); transform:translateY(-1px); }
.ca-tag{ display:inline-block; font-size:9.5px; font-weight:800; text-transform:uppercase;
  letter-spacing:.07em; color:var(--text-mute); background:var(--bg-sunken);
  padding:2px 7px; border-radius:999px; margin-bottom:7px; }
.ca-head{ display:block; font-size:14.5px; font-weight:700; line-height:1.4; }
.ca-body{ display:block; font-size:13px; color:var(--text-dim); line-height:1.55; margin-top:4px; }
.ca-cta{ display:inline-block; margin-top:9px; font-size:12.5px; font-weight:700;
  color:var(--accent-d); }
.ca-cta::after{ content:' →'; }
@media(max-width:620px){ .chat-ad{ padding-left:0; } }

/* Site-wide ad slot in the footer */
.global-adslot{ max-width:680px; margin:26px auto 6px; padding:0 4px; }
.global-adslot:empty{ display:none; }

/* Video ads */
.ad-video{ position:relative; }
.adv-frame{ position:relative; width:100%; aspect-ratio:16/9; background:#000;
  border-radius:12px; overflow:hidden; cursor:pointer; }
.adv-frame iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }
.adv-cap{ display:block; font-size:13.5px; font-weight:600; color:inherit;
  padding:9px 2px 0; line-height:1.5; }
.adv-cta{ color:var(--accent-d); font-weight:700; }

/* ============================================================= */
/* Consent banner + legal pages                                   */
/* ============================================================= */
.consent-wrap{ position:fixed; left:0; right:0; bottom:0; z-index:500; padding:16px;
  background:linear-gradient(to top, rgba(0,0,0,.14), transparent); }
.consent-card{ max-width:940px; margin:0 auto; background:var(--panel);
  border:1px solid var(--border-2); border-radius:16px; padding:20px 22px;
  box-shadow:0 18px 50px rgba(0,0,0,.20); display:flex; gap:22px;
  align-items:flex-start; flex-wrap:wrap; }
.consent-main{ flex:1; min-width:280px; }
.consent-card h3{ font-size:16px; font-weight:800; margin:0 0 7px; }
.consent-card p{ font-size:13.5px; line-height:1.65; color:var(--text-dim); margin:0; }
.consent-card p a{ color:var(--accent-d); font-weight:600; }
.consent-actions{ display:flex; gap:9px; align-items:center; flex-wrap:wrap; }
.consent-actions .btn-primary, .consent-actions .pill-link{ cursor:pointer; white-space:nowrap; }
.consent-cats{ margin-top:14px; display:flex; flex-direction:column; gap:11px;
  border-top:1px solid var(--border); padding-top:13px; }
.consent-cat{ display:flex; gap:10px; align-items:flex-start; cursor:pointer; }
.consent-cat input{ margin-top:3px; width:auto; flex:none; }
.consent-cat b{ display:block; font-size:13.5px; font-weight:700; }
.consent-cat small{ display:block; font-size:12.5px; color:var(--text-mute);
  line-height:1.55; margin-top:2px; }
@media(max-width:760px){
  .consent-card{ flex-direction:column; gap:14px; padding:18px; }
  .consent-actions{ width:100%; }
  .consent-actions button{ flex:1; }
}

/* A button that reads as a link */
.linkish{ background:none; border:0; padding:0; font:inherit; color:var(--accent-d);
  cursor:pointer; text-decoration:underline; }
.linkish:hover{ opacity:.8; }

/* Legal pages */
.legal{ max-width:780px; }
.legal h2{ font-size:18px; font-weight:800; margin:30px 0 10px;
  padding-top:18px; border-top:1px solid var(--border); }
.legal h2:first-of-type{ border-top:0; padding-top:0; }
.legal p, .legal li{ font-size:14.5px; line-height:1.8; color:var(--text-dim); }
.legal p{ margin-bottom:12px; }
.legal ul{ margin:0 0 14px 20px; }
.legal li{ margin-bottom:7px; }
.legal strong{ color:var(--text); }
.legal a{ color:var(--accent-d); font-weight:600; }
.legal-note{ background:var(--accent-sf); border-left:3px solid var(--accent);
  border-radius:10px; padding:14px 18px; margin:16px 0 22px; font-size:14px;
  line-height:1.7; color:var(--text-dim); }
.legal-table{ width:100%; border-collapse:collapse; margin:14px 0 20px; font-size:13.5px; }
.legal-table th{ text-align:left; font-size:11.5px; text-transform:uppercase;
  letter-spacing:.05em; color:var(--text-mute); padding:8px 12px 8px 0;
  border-bottom:1px solid var(--border-2); }
.legal-table td{ padding:10px 12px 10px 0; border-bottom:1px solid var(--border);
  vertical-align:top; color:var(--text-dim); line-height:1.6; }
.legal-table td:first-child{ font-weight:600; color:var(--text); white-space:nowrap; }
@media(max-width:620px){
  .legal-table td:first-child{ white-space:normal; }
  .legal-table{ font-size:12.5px; }
}

/* Trending Now: community posts */
.rail-trend .rail-txt b{ display:flex; align-items:center; gap:4px; }
.rt-tick{ color:var(--accent); display:inline-flex; }
.rt-snip{ white-space:normal; display:-webkit-box; -webkit-line-clamp:2;
  -webkit-box-orient:vertical; overflow:hidden; line-height:1.45; }
.rt-stats{ display:flex; align-items:center; gap:11px; margin-top:3px;
  color:var(--text-mute); font-size:11px; }
.rt-stats .gx-icon{ vertical-align:-0.15em; margin-right:2px; }

/* Briefly highlight a post arrived at from a Trending link */
.post-flash{ box-shadow:0 0 0 2px var(--accent); transition:box-shadow .4s; }

/* ============================================================= */
/* Scorecard capture + rounds + handicap                          */
/* ============================================================= */
.cap-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:16px; margin-bottom:22px; }
.cap-card{ background:var(--panel); border:1px solid var(--border); border-radius:16px;
  padding:26px 22px; text-align:center; color:inherit; display:block; }
.cap-primary{ border-color:var(--accent); box-shadow:0 4px 18px rgba(0,0,0,.05); }
.cap-ico{ width:62px; height:62px; border-radius:50%; background:var(--accent-sf);
  color:var(--accent-d); display:flex; align-items:center; justify-content:center;
  margin:0 auto 14px; }
.cap-card h3{ font-size:17px; font-weight:800; margin:0 0 7px; }
.cap-card p{ font-size:13.5px; color:var(--text-dim); line-height:1.6; margin:0 0 16px; }
.cap-btn{ display:inline-flex; align-items:center; gap:8px; cursor:pointer; }
.cap-hint{ font-size:12px; color:var(--text-mute); margin-top:12px; }
.cap-preview{ margin-top:14px; }
.cap-preview img{ width:100%; border-radius:12px; border:1px solid var(--border);
  max-height:280px; object-fit:contain; background:var(--bg-sunken); }

.round-form{ max-width:720px; }
.rf-sec{ font-size:15px; font-weight:800; margin:22px 0 12px;
  padding-top:16px; border-top:1px solid var(--border); }
.rf-sec:first-of-type{ border-top:0; padding-top:0; margin-top:0; }
.rf-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:14px; }
.rf-grid label, .round-form > label{ display:flex; flex-direction:column; gap:5px;
  font-size:12.5px; font-weight:600; color:var(--text-dim); }
.rf-grid input, .rf-grid select, .round-form textarea{ border:1px solid var(--border-2);
  border-radius:10px; padding:11px 13px; font-family:inherit; font-size:14.5px;
  background:var(--panel); color:var(--text); }
.rf-grid input:focus, .rf-grid select:focus{ outline:none; border-color:var(--accent); }
.rf-big input{ font-size:24px !important; font-weight:800; text-align:center; padding:12px !important; }
.rf-note{ display:flex; gap:9px; align-items:flex-start; background:var(--bg-sunken);
  border-radius:10px; padding:12px 15px; font-size:12.5px; color:var(--text-dim);
  line-height:1.6; margin-top:12px; }
.rf-note .gx-icon{ flex:none; margin-top:2px; }
.rf-details{ margin-top:16px; border:1px solid var(--border); border-radius:12px; padding:14px 16px; }
.rf-details summary{ cursor:pointer; font-size:14px; font-weight:700; }
.rf-details summary span{ font-weight:400; color:var(--text-mute); font-size:12.5px; }
.rf-details[open] summary{ margin-bottom:14px; }
.rf-card-shot{ margin-bottom:18px; }
.rf-card-shot img{ width:100%; max-height:260px; object-fit:contain; border-radius:12px;
  border:1px solid var(--border); background:var(--bg-sunken); }
.rf-card-shot span{ display:block; font-size:12px; color:var(--text-mute); margin-top:6px; }

.hole-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(78px,1fr)); gap:9px; }
.hole-cell{ display:flex; flex-direction:column; gap:3px; background:var(--bg-sunken);
  border-radius:9px; padding:7px 6px; }
.hc-no{ font-size:11px; font-weight:800; color:var(--text-mute); text-align:center; }
.hole-cell input{ border:1px solid var(--border-2); border-radius:6px; padding:5px;
  text-align:center; font-family:inherit; background:var(--panel); color:var(--text); }
.hc-str{ font-size:16px !important; font-weight:800; }
.hc-par, .hc-si{ font-size:11px !important; color:var(--text-mute); }
.hole-sum{ margin-top:12px; font-size:13px; color:var(--text-dim); }

.hcp-row{ display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr));
  gap:14px; margin-bottom:18px; }
.hcp-card{ background:var(--panel); border:1px solid var(--border); border-radius:14px;
  padding:18px; display:flex; flex-direction:column; gap:3px; }
.hcp-main{ border-color:var(--accent); background:var(--accent-sf); }
.hcp-label{ font-size:11.5px; text-transform:uppercase; letter-spacing:.05em;
  color:var(--text-mute); font-weight:700; }
.hcp-value{ font-size:30px; font-weight:900; line-height:1.1; }
.hcp-main .hcp-value{ color:var(--accent-d); }
.hcp-none{ color:var(--text-mute); }
.hcp-sub{ font-size:12px; color:var(--text-mute); }
.hcp-chart{ position:relative; }
.hcp-svg{ width:100%; height:70px; display:block; }
.hcp-chart-ends{ display:flex; justify-content:space-between; font-size:11.5px;
  color:var(--text-mute); margin-top:4px; }

.rounds-table td{ vertical-align:middle; }
.rounds-table form{ margin:0; }
.topar{ font-weight:700; }
.topar.good{ color:var(--accent-d); }
.rt-scan{ color:var(--text-mute); vertical-align:-0.1em; margin-left:3px; }
@media(max-width:620px){
  .hole-grid{ grid-template-columns:repeat(auto-fill,minmax(64px,1fr)); }
  .rounds-table th:nth-child(5), .rounds-table td:nth-child(5){ display:none; }
}