/* =========================================================================
   CuratedBets — public homepage (/) only.
   Premium "Intelligence Surface" (light) theme, ported from the CuratedBets
   design-system handoff tokens. Loaded ONLY by templates/landing.html, which
   does not extend base.html or load the global style.css, so this file cannot
   affect any other public/admin page and theirs cannot affect the homepage.
   No framework. The only JS is static/home-interactions.js — an optional,
   reduced-motion-aware on-load reveal (count-up to the REAL server value, bar /
   strength growth, preview-only demo pulse). It animates 0 -> the server value
   and never invents or fake-ticks data; the board is fully visible without it.
   ========================================================================= */

/* ---- Design tokens (canonical values from the handoff) ------------------ */
.cb-home {
  /* brand / accent */
  --cb-navy-900:#061522; --cb-navy-800:#0A1F33; --cb-navy-700:#0E2942;
  --cb-navy-600:#143654; --cb-navy-500:#1D496E; --cb-navy-400:#2E6395;
  --cb-blue-600:#1F6FD6; --cb-blue-500:#2E8BFF; --cb-blue-400:#4DA3FF;
  --cb-blue-300:#7CBEFF; --cb-blue-100:#DCEBFF; --cb-blue-50:#EEF5FF;
  --cb-gold-600:#A9863F;
  /* cool neutrals */
  --cb-white:#FFFFFF; --cb-gray-25:#F7F9FC; --cb-gray-50:#EFF3F8;
  --cb-gray-100:#E4EAF1; --cb-gray-200:#D2DCE7; --cb-gray-300:#B6C3D2;
  --cb-gray-400:#93A3B6; --cb-gray-500:#6E7F94; --cb-gray-600:#4E6178;
  --cb-gray-700:#344960; --cb-gray-800:#1E3149; --cb-gray-900:#0F2238;
  /* signal semantics */
  --cb-positive:#1FA968; --cb-positive-soft:#E3F6EC;
  --cb-info:#2E8BFF;     --cb-info-soft:#E6F0FF;
  --cb-weather:#1AA7C4;  --cb-weather-soft:#E0F5FA;
  --cb-caution:#D98A1A;  --cb-caution-soft:#FBEFDB;
  --cb-attention:#7B61D9;--cb-attention-soft:#EFEAFB;
  --cb-negative:#D85A37; --cb-negative-soft:#FBE8E1;
  /* surfaces / text */
  --surface-raised:#FFFFFF; --surface-sunken:var(--cb-gray-50);
  --surface-glass:rgba(255,255,255,0.62); --surface-frost:rgba(247,250,254,0.78);
  --border-hairline:var(--cb-gray-100); --border-soft:var(--cb-gray-200);
  --border-strong:var(--cb-gray-300);
  --text-strong:var(--cb-gray-900); --text-body:var(--cb-gray-700);
  --text-muted:var(--cb-gray-500); --text-faint:var(--cb-gray-400);
  --accent:var(--cb-blue-500); --accent-strong:var(--cb-blue-600);
  --accent-wash:var(--cb-blue-50);
  /* type */
  --font-display:'Archivo','Segoe UI',system-ui,sans-serif;
  --font-text:'Manrope','Segoe UI',system-ui,sans-serif;
  --font-mono:'JetBrains Mono',ui-monospace,'SFMono-Regular',monospace;
  --font-serif:'Spectral',Georgia,'Times New Roman',serif;
  /* radii / shadows / motion */
  --radius-sm:10px; --radius-md:14px; --radius-lg:18px; --radius-xl:24px; --radius-pill:999px;
  --shadow-xs:0 1px 2px rgba(15,34,56,.06);
  --shadow-sm:0 2px 6px rgba(15,34,56,.07);
  --shadow-md:0 6px 18px rgba(15,34,56,.08), 0 1px 3px rgba(15,34,56,.05);
  --shadow-lg:0 16px 40px rgba(15,34,56,.12), 0 2px 8px rgba(15,34,56,.06);
  --shadow-xl:0 28px 64px rgba(15,34,56,.16);
  --ease-out:cubic-bezier(.22,.61,.36,1); --dur:200ms;
  --shell:1180px;
}

.cb-home *,.cb-home *::before,.cb-home *::after{box-sizing:border-box;}

.cb-home{
  margin:0; min-height:100%;
  font-family:var(--font-text);
  font-size:15px; line-height:1.5; color:var(--text-body);
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  background:
    radial-gradient(58% 48% at 16% 9%,  rgba(176,208,255,0.34), transparent 60%),
    radial-gradient(52% 44% at 86% 15%, rgba(208,223,245,0.40), transparent 62%),
    radial-gradient(82% 60% at 50% 102%, rgba(220,236,255,0.50), transparent 72%),
    linear-gradient(180deg,#EFF3F9 0%,#E7EEF6 48%,#E0E9F3 100%);
  background-attachment:fixed;
}
.cb-home a{color:inherit; text-decoration:none;}
.cb-i{width:1em; height:1em; display:inline-block; vertical-align:-0.125em; flex:none;}

.cb-shell{width:100%; max-width:var(--shell); margin:0 auto; padding:0 24px;}
.cb-section{padding:64px 24px 0;}
.cb-eyebrow{
  font-family:var(--font-display); font-size:12px; font-weight:700;
  letter-spacing:.16em; text-transform:uppercase; color:var(--accent-strong); margin:0 0 9px;
}

/* ---- Thick-glass surface (sheen + reflection) -------------------------- */
.cb-glass{
  position:relative;
  background:linear-gradient(155deg, rgba(255,255,255,0.62) 0%, rgba(228,240,255,0.22) 50%, rgba(255,255,255,0.40) 100%);
  -webkit-backdrop-filter:blur(30px) saturate(1.7) brightness(1.06);
          backdrop-filter:blur(30px) saturate(1.7) brightness(1.06);
  border:1px solid rgba(255,255,255,0.88);
  border-radius:var(--radius-lg);
  box-shadow:
    0 26px 56px -22px rgba(60,100,165,0.40),
    inset 0 1.5px 0 rgba(255,255,255,0.98),
    inset 1.5px 0 0 rgba(255,255,255,0.5),
    inset 0 -2px 2px rgba(150,190,250,0.45),
    inset 0 -22px 36px rgba(150,190,250,0.16),
    0 0 0 1px rgba(150,190,255,0.16);
}
.cb-glass::before{
  content:''; position:absolute; inset:0; border-radius:inherit; pointer-events:none; opacity:.82;
  background:
    radial-gradient(58% 42% at 16% 10%, rgba(255,255,255,0.78), transparent 60%),
    linear-gradient(122deg, transparent 33%, rgba(255,255,255,0.42) 46%, transparent 55%);
}
.cb-glass > *{position:relative; z-index:1;}

/* White raised card (board panels, stat cards, step cards) */
.cb-raised{
  background:var(--surface-raised); border:1px solid var(--border-hairline);
  border-radius:var(--radius-lg); box-shadow:var(--shadow-md);
}

/* ---- Buttons ----------------------------------------------------------- */
.cb-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  height:42px; padding:0 18px; border-radius:var(--radius-md);
  font-family:var(--font-text); font-weight:700; font-size:14px; line-height:1;
  letter-spacing:-0.005em; cursor:pointer; border:1px solid transparent;
  transition:transform var(--dur) var(--ease-out), box-shadow var(--dur) var(--ease-out), background var(--dur) var(--ease-out);
}
.cb-btn-lg{height:54px; padding:0 28px; font-size:15.5px;}
.cb-btn::after{
  content:""; width:1.05em; height:1.05em; flex:none; background-color:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='m12 5 7 7-7 7'/%3E%3C/svg%3E") center/contain no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='m12 5 7 7-7 7'/%3E%3C/svg%3E") center/contain no-repeat;
  transition:transform var(--dur) var(--ease-out);
}
.cb-btn:hover::after{transform:translateX(2px);}
.cb-btn-primary{
  color:#fff; border-color:rgba(31,111,214,0.5);
  background:linear-gradient(180deg,#4FA6FF 0%,#2E8BFF 48%,#1F6FD6 100%);
  box-shadow:0 14px 28px -8px rgba(46,139,255,0.6), 0 2px 6px rgba(31,111,214,0.35), inset 0 1px 0 rgba(255,255,255,0.55);
}
.cb-btn-primary:hover{transform:translateY(-1px); box-shadow:0 18px 34px -8px rgba(46,139,255,0.7), 0 2px 6px rgba(31,111,214,0.4), inset 0 1px 0 rgba(255,255,255,0.6);}
.cb-btn-ghost{
  color:var(--text-strong); background:rgba(255,255,255,0.72);
  -webkit-backdrop-filter:blur(16px) saturate(1.4); backdrop-filter:blur(16px) saturate(1.4);
  border-color:rgba(255,255,255,0.95);
  box-shadow:0 12px 26px -12px rgba(70,110,170,0.4), inset 0 1px 0 rgba(255,255,255,0.95);
}
.cb-btn-ghost:hover{transform:translateY(-1px); border-color:var(--border-soft);}

/* ---- Top nav ----------------------------------------------------------- */
.cb-nav{
  position:sticky; top:0; z-index:40;
  background:var(--surface-frost);
  -webkit-backdrop-filter:blur(16px) saturate(1.5); backdrop-filter:blur(16px) saturate(1.5);
  border-bottom:1px solid var(--border-hairline);
}
.cb-nav-inner{display:flex; align-items:center; gap:24px; height:68px;}
.cb-nav-brand{display:inline-flex; align-items:center;}
.cb-nav-brand img{height:40px; width:auto; display:block;}
.cb-nav-links{display:flex; align-items:center; gap:26px; margin-left:14px;}
.cb-nav-links a{font-size:14px; font-weight:600; color:var(--text-body); transition:color var(--dur) var(--ease-out);}
.cb-nav-links a:hover{color:var(--accent-strong);}
.cb-nav-actions{display:flex; align-items:center; gap:10px; margin-left:auto;}
.cb-icon-btn{
  width:38px; height:38px; display:inline-flex; align-items:center; justify-content:center; flex:none;
  border-radius:var(--radius-md); border:1px solid var(--border-hairline);
  background:rgba(255,255,255,0.6); color:var(--text-muted); font-size:18px;
  padding:0; cursor:pointer; font-family:inherit;
  transition:background var(--dur) var(--ease-out), color var(--dur) var(--ease-out);
}
.cb-icon-btn:hover{background:var(--accent-wash); color:var(--accent-strong);}
.cb-avatar{
  width:38px; height:38px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; flex:none;
  background:var(--accent-wash); color:var(--accent-strong);
  font-family:var(--font-display); font-weight:800; font-size:13px;
  border:1px solid var(--border-soft); padding:0; cursor:pointer;
  transition:background var(--dur) var(--ease-out), color var(--dur) var(--ease-out);
}
.cb-avatar:hover{background:var(--cb-blue-100);}

/* ---- Nav player search (always-visible, mirrors public_base.html) ------- */
.cb-nav-search{display:inline-flex; align-items:center; gap:6px;}
.cb-nav-search-input{
  width:170px; max-width:40vw; padding:0 14px; height:38px; line-height:38px;
  border:1px solid var(--border-soft); border-radius:var(--radius-md);
  background:rgba(255,255,255,0.72); color:var(--text-strong);
  font-family:var(--font-text); font-size:14px;
  -webkit-backdrop-filter:blur(16px) saturate(1.4); backdrop-filter:blur(16px) saturate(1.4);
}
.cb-nav-search-input::placeholder{color:var(--text-faint);}
.cb-nav-search-input:focus{outline:none; border-color:var(--accent); box-shadow:0 0 0 3px var(--cb-blue-50);}

/* ---- Nav popovers (notifications / profile) ---------------------------- */
.cb-nav-pop-wrap{position:relative; display:inline-flex;}
.cb-nav-pop{
  position:absolute; top:calc(100% + 12px); right:0; z-index:60;
  width:264px; padding:16px; border-radius:var(--radius-lg);
  background:linear-gradient(155deg, rgba(255,255,255,0.96) 0%, rgba(238,245,255,0.92) 100%);
  -webkit-backdrop-filter:blur(24px) saturate(1.6); backdrop-filter:blur(24px) saturate(1.6);
  border:1px solid rgba(255,255,255,0.9);
  box-shadow:var(--shadow-lg), 0 0 0 1px rgba(150,190,255,0.16);
}
.cb-nav-pop::before{
  content:""; position:absolute; top:-6px; right:13px; width:12px; height:12px;
  background:inherit; border-left:1px solid rgba(255,255,255,0.9); border-top:1px solid rgba(255,255,255,0.9);
  transform:rotate(45deg);
}
.cb-nav-pop[hidden]{display:none;}
.cb-nav-pop:not([hidden]){animation:cb-pop-in 160ms var(--ease-out);}
@keyframes cb-pop-in{from{opacity:0; transform:translateY(-6px) scale(0.98);} to{opacity:1; transform:none;}}
.cb-nav-pop-title{font-family:var(--font-display); font-weight:700; font-size:14px; color:var(--text-strong); margin:0 0 6px;}
.cb-nav-pop-body{font-size:12.5px; line-height:1.5; color:var(--text-muted); margin:0;}
.cb-nav-pop-links{display:flex; gap:8px; margin-top:14px; padding-top:12px; border-top:1px solid var(--border-hairline);}
.cb-nav-pop-links a{
  flex:1; text-align:center; padding:8px 10px; border-radius:var(--radius-md);
  background:rgba(255,255,255,0.7); border:1px solid var(--border-hairline);
  font-size:12.5px; font-weight:700; color:var(--accent-strong);
  transition:background var(--dur) var(--ease-out), border-color var(--dur) var(--ease-out);
}
.cb-nav-pop-links a:hover{background:var(--accent-wash); border-color:var(--cb-blue-100);}

/* ---- Hero -------------------------------------------------------------- */
.cb-hero{position:relative; padding:40px 0 8px; overflow:visible;}
.cb-hero-glow{
  position:absolute; top:-60px; left:50%; width:820px; height:520px; transform:translateX(-50%);
  background:radial-gradient(closest-side, rgba(120,170,255,0.28), transparent 70%);
  filter:blur(8px); pointer-events:none; z-index:0;
}
.cb-hero-inner{position:relative; z-index:3; max-width:720px; margin:0 auto; text-align:center; padding:0 16px;}
.cb-hero-logo{display:flex; justify-content:center; margin-bottom:22px;}
.cb-hero-logo img{height:200px; width:auto; display:block; filter:drop-shadow(0 18px 30px rgba(60,100,165,0.22));}
.cb-hero-title{
  font-family:var(--font-serif); font-weight:500;
  font-size:clamp(26px,3.2vw,40px); line-height:1.07; letter-spacing:-0.015em;
  margin:0 0 18px; color:var(--text-strong); text-wrap:balance;
}
.cb-hero-lede{font-size:17.5px; line-height:1.6; color:var(--text-muted); max-width:500px; margin:0 auto 30px;}
.cb-hero-actions{display:flex; gap:14px; justify-content:center; flex-wrap:wrap;}
.cb-hero-note{
  display:inline-flex; align-items:center; gap:8px; justify-content:center;
  margin:32px auto 0; font-size:13.5px; color:var(--text-muted);
}
.cb-hero-note .cb-i{color:var(--accent); font-size:15px;}

/* feature cards */
.cb-feature-wrap{position:relative; z-index:3; max-width:1000px; margin:56px auto 0; padding:0 16px;}
.cb-feature-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:18px;}
.cb-feature{
  display:flex; flex-direction:column; align-items:center; text-align:center;
  min-height:200px; padding:34px 22px 28px; cursor:pointer;
  transition:transform var(--dur) var(--ease-out), box-shadow var(--dur) var(--ease-out);
}
.cb-feature:hover{transform:translateY(-6px);}
.cb-feature-medallion{
  width:62px; height:62px; margin-bottom:18px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:radial-gradient(circle at 36% 30%, rgba(255,255,255,0.95), rgba(46,139,255,0.14));
  border:1px solid rgba(255,255,255,0.9); color:var(--accent); font-size:26px;
  box-shadow:inset 0 1.5px 0 rgba(255,255,255,0.95), inset 0 -3px 7px rgba(46,139,255,0.18), 0 8px 16px -6px rgba(46,139,255,0.45);
  transition:transform var(--dur) var(--ease-out);
}
.cb-feature:hover .cb-feature-medallion{transform:scale(1.08);}
.cb-feature h3{font-family:var(--font-display); font-weight:700; font-size:17px; color:var(--text-strong); margin:0 0 7px;}
.cb-feature p{font-size:13px; color:var(--text-muted); line-height:1.5; max-width:170px; margin:0;}

/* ---- Section head ------------------------------------------------------ */
.cb-section-head{display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:22px;}
.cb-section-head.center{text-align:center;}
.cb-section-head.center .cb-head-text{margin:0 auto;}
.cb-section-head h2{font-family:var(--font-display); font-weight:800; font-size:clamp(26px,3vw,34px); letter-spacing:-0.02em; color:var(--text-strong); margin:0;}
.cb-section-sub{font-size:15px; color:var(--text-muted); margin:10px 0 0; max-width:560px;}
.cb-head-actions{display:flex; align-items:center; gap:12px; flex:none;}
.cb-preview-badge{
  display:inline-flex; align-items:center; gap:7px; padding:4px 10px; border-radius:var(--radius-pill);
  background:var(--cb-blue-50); color:var(--accent-strong); border:1px solid var(--cb-blue-100);
  font-family:var(--font-display); font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  margin-top:11px;
}
.cb-preview-badge::before{content:""; width:6px; height:6px; border-radius:50%; background:var(--accent);}
.cb-preview-note{
  display:inline-flex; align-items:center; gap:8px;
  margin:0 0 18px; padding:8px 14px; border-radius:var(--radius-pill);
  background:var(--cb-gray-50); border:1px solid var(--border-soft);
  color:var(--text-muted); font-size:12.5px;
}
.cb-preview-note::before{content:""; width:6px; height:6px; border-radius:50%; background:var(--accent); flex:none;}
.cb-tag-example{
  font-family:var(--font-display); font-size:9.5px; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  color:var(--text-faint); background:var(--cb-gray-50); border:1px solid var(--border-hairline);
  padding:2px 8px; border-radius:var(--radius-pill);
}

/* ---- Stat strip -------------------------------------------------------- */
.cb-stats{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-bottom:26px;}
.cb-stat{padding:18px 20px; transition:transform var(--dur) var(--ease-out), box-shadow var(--dur) var(--ease-out);}
.cb-stat:hover{transform:translateY(-3px); box-shadow:var(--shadow-lg);}
.cb-stat-top{display:flex; align-items:center; gap:9px; color:var(--text-muted); margin-bottom:12px;}
.cb-stat-top .cb-i{font-size:16px; color:var(--accent);}
.cb-stat-label{font-family:var(--font-display); font-size:12px; font-weight:700; letter-spacing:.04em; text-transform:uppercase;}
.cb-stat-num{font-family:var(--font-display); font-weight:800; font-variant-numeric:tabular-nums; letter-spacing:-0.02em; font-size:34px; line-height:1; color:var(--text-strong);}

/* ---- Board two-column -------------------------------------------------- */
.cb-board-grid{display:grid; grid-template-columns:1fr 1fr; gap:16px; align-items:start;}
.cb-board-side{display:flex; flex-direction:column; gap:16px;}
.cb-panel{padding:18px;}
.cb-panel-head{display:flex; align-items:center; justify-content:space-between; gap:10px; padding:6px 6px 14px;}
.cb-panel-title{display:flex; align-items:center; gap:9px; font-family:var(--font-display); font-size:12px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--text-muted); margin:0;}
.cb-panel-title .cb-i{font-size:15px;}
.cb-title-warm .cb-i{color:var(--cb-caution);}

/* leaders */
.cb-leaders{list-style:none; margin:0; padding:0;}
.cb-leader{display:flex; align-items:center; gap:13px; padding:11px 12px; border-radius:var(--radius-md); transition:background var(--dur) var(--ease-out), transform var(--dur) var(--ease-out);}
.cb-leader:hover{background:var(--surface-sunken); transform:translateY(-1px);}
.cb-leader-rank{width:18px; text-align:center; font-family:var(--font-display); font-weight:800; font-size:14px; color:var(--text-faint); flex:none;}
.cb-leader-av{
  width:38px; height:38px; border-radius:50%; flex:none; display:flex; align-items:center; justify-content:center;
  background:var(--accent-wash); color:var(--accent-strong); font-family:var(--font-display); font-weight:800; font-size:12.5px;
  border:1px solid var(--border-soft);
}
.cb-leader-body{flex:1; min-width:0;}
.cb-leader-name{display:block; font-weight:700; font-size:14.5px; color:var(--text-strong); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.cb-leader-name:hover{color:var(--accent-strong);}
.cb-leader-meta{font-size:11.5px; color:var(--text-muted);}
.cb-leader-meta em{font-style:normal; color:var(--text-faint);}
.cb-strength{display:inline-flex; align-items:flex-end; gap:2.5px; height:14px; margin-right:4px; flex:none;}
.cb-strength i{width:3.5px; border-radius:2px; background:var(--border-soft);}
.cb-strength i:nth-child(1){height:6px;} .cb-strength i:nth-child(2){height:8px;}
.cb-strength i:nth-child(3){height:10px;} .cb-strength i:nth-child(4){height:12px;} .cb-strength i:nth-child(5){height:14px;}
.cb-strength i.on{background:var(--accent);}
.cb-strength.t-info i.on{background:var(--cb-info);}
.cb-strength.t-positive i.on{background:var(--cb-positive);}
.cb-strength.t-caution i.on{background:var(--cb-caution);}
.cb-strength.t-neg i.on{background:var(--cb-negative);}
.cb-strength.t-attention i.on{background:var(--cb-attention);}
.cb-leader-metric{text-align:right; min-width:46px; flex:none;}
.cb-leader-metric b{display:block; font-family:var(--font-display); font-weight:800; font-variant-numeric:tabular-nums; font-size:18px; color:var(--cb-info);}
.cb-leader-metric span{font-size:10.5px; color:var(--text-faint);}
.cb-leader-flag{flex:none; font-size:11px; font-weight:700; color:#b45309; background:rgba(245,158,11,0.14); padding:3px 7px; border-radius:var(--radius-pill); white-space:nowrap;}
.cb-leader-foot{margin-top:8px;}

/* prop bars */
.cb-bars{list-style:none; margin:0; padding:0;}
.cb-bar-row{margin-bottom:14px;}
.cb-bar-row:last-child{margin-bottom:0;}
.cb-bar-head{display:flex; justify-content:space-between; align-items:baseline; margin-bottom:7px;}
.cb-bar-label{font-size:13.5px; font-weight:600; color:var(--text-body); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-right:10px;}
.cb-bar-value{font-family:var(--font-display); font-weight:800; font-size:14px; font-variant-numeric:tabular-nums; color:var(--text-strong);}
.cb-bar-track{height:8px; border-radius:var(--radius-pill); background:var(--cb-gray-100); overflow:hidden;}
.cb-bar-fill{display:block; height:100%; min-width:4px; border-radius:var(--radius-pill); background:var(--accent);}
.cb-bar-fill.t-info{background:var(--cb-info);} .cb-bar-fill.t-attention{background:var(--cb-attention);}
.cb-bar-fill.t-positive{background:var(--cb-positive);} .cb-bar-fill.t-caution{background:var(--cb-caution);}
.cb-bar-fill.t-weather{background:var(--cb-weather);}

/* cautions */
.cb-cautions{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px;}
.cb-caution{display:flex; gap:11px; padding:11px 12px; border-radius:var(--radius-md); background:var(--surface-sunken); border-left:3px solid var(--cb-caution);}
.cb-caution.neg{border-left-color:var(--cb-negative);}
.cb-caution-player{font-weight:700; font-size:13.5px; color:var(--text-strong);}
.cb-caution-player:hover{color:var(--accent-strong);}
.cb-caution-note{font-size:12px; color:var(--text-muted); margin-top:2px;}
.cb-empty{margin:0; padding:14px 6px; color:var(--text-muted); font-size:13.5px;}

/* Preview zero-state (no live data) — intentional, premium placeholders that
   never imply live data: no player names, empty strength meters, empty bars. */
.cb-leader-empty .cb-leader-av{background:var(--cb-gray-50); color:var(--text-faint); border-style:dashed;}
.cb-leader-empty .cb-leader-name{color:var(--text-faint); font-weight:600;}
.cb-leader-empty .cb-leader-meta{color:var(--text-faint);}
.cb-leader-empty .cb-leader-metric b{color:var(--text-faint);}
.cb-bar-fill-empty{min-width:0;}

/* ---- How it works ------------------------------------------------------ */
.cb-section-hiw{padding-top:88px;}
.cb-steps{display:grid; grid-template-columns:repeat(3,1fr); gap:18px;}
.cb-step{position:relative; padding:26px 24px; height:100%; transition:transform var(--dur) var(--ease-out), box-shadow var(--dur) var(--ease-out);}
.cb-step:hover{transform:translateY(-4px); box-shadow:var(--shadow-lg);}
.cb-step-top{display:flex; align-items:center; justify-content:space-between; margin-bottom:18px;}
.cb-step-icon{width:50px; height:50px; border-radius:var(--radius-md); display:flex; align-items:center; justify-content:center; font-size:22px;}
.cb-step-icon.t-info{background:color-mix(in srgb, var(--cb-info) 13%, transparent); color:var(--cb-info);}
.cb-step-icon.t-attention{background:color-mix(in srgb, var(--cb-attention) 13%, transparent); color:var(--cb-attention);}
.cb-step-icon.t-positive{background:color-mix(in srgb, var(--cb-positive) 13%, transparent); color:var(--cb-positive);}
.cb-step-num{font-family:var(--font-display); font-weight:800; font-size:38px; line-height:1; color:var(--border-soft); letter-spacing:-0.03em;}
.cb-step h3{font-family:var(--font-display); font-weight:700; font-size:19px; color:var(--text-strong); margin:0 0 9px;}
.cb-step p{font-size:14.5px; line-height:1.6; color:var(--text-muted); margin:0;}

/* ---- Founder strip (dark navy) ----------------------------------------- */
.cb-section-founder{padding-top:88px;}
.cb-founder{
  position:relative; overflow:hidden; border-radius:var(--radius-xl);
  padding:clamp(34px,5vw,56px); box-shadow:var(--shadow-xl);
  background:radial-gradient(120% 140% at 12% 0%, #103253 0%, #0A1F33 55%, #061522 100%);
}
.cb-founder-motif{position:absolute; inset:0; opacity:0.55; pointer-events:none;}
.cb-founder-grid{position:relative; z-index:2; display:grid; grid-template-columns:1.1fr 0.9fr; gap:40px; align-items:center;}
.cb-founder-pill{
  display:inline-flex; align-items:center; gap:7px; padding:5px 12px; border-radius:var(--radius-pill);
  background:rgba(46,139,255,0.16); color:#9CC6FF; font-size:11.5px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; margin-bottom:18px;
}
.cb-founder h2{font-family:var(--font-serif); font-weight:500; font-size:clamp(28px,3.4vw,40px); line-height:1.1; letter-spacing:-0.015em; color:#F2F8FF; margin:0 0 14px;}
.cb-founder-copy{font-size:15.5px; line-height:1.6; color:#C6D8EC; margin:0; max-width:440px;}
.cb-founder-card{display:flex; flex-direction:column; gap:12px; padding:22px; border-radius:var(--radius-lg); background:rgba(255,255,255,0.06); border:1px solid rgba(125,168,214,0.28);}
.cb-founder-card .cb-btn-primary{width:100%;}
.cb-founder-help{font-size:12px; color:#8AA2BD; text-align:center; margin:0;}

/* ---- Footer ------------------------------------------------------------ */
.cb-footer{margin-top:96px; border-top:1px solid var(--border-hairline); background:var(--surface-frost); -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px);}
.cb-footer-inner{max-width:var(--shell); margin:0 auto; padding:48px 24px 28px;}
.cb-footer-grid{display:grid; grid-template-columns:1.4fr repeat(3,1fr); gap:32px;}
.cb-footer-brand{display:flex; align-items:center; gap:10px; margin-bottom:14px;}
.cb-footer-brand img{height:28px;}
.home-footer-logo-frosted{
  display:block;
  width:min(220px, 100%);
  height:auto;
  border-radius:16px;
  object-fit:contain;
  opacity:0.9;
}
.cb-footer-word{font-family:var(--font-display); font-weight:800; font-size:18px; color:var(--text-strong);}
.cb-footer-word span{color:var(--accent-strong);}
.cb-footer-tag{font-size:13.5px; color:var(--text-muted); max-width:280px; margin:0; line-height:1.6;}
.cb-footer-soon{font-family:var(--font-mono); font-size:11px; color:var(--text-faint); letter-spacing:.04em; margin:16px 0 0;}
.cb-footer-col h4{font-family:var(--font-display); font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--text-faint); margin:0 0 14px;}
.cb-footer-col a{display:block; font-size:13.5px; color:var(--text-muted); margin-bottom:10px;}
.cb-footer-col a:hover{color:var(--accent-strong);}
.cb-footer-bar{display:flex; align-items:center; justify-content:space-between; gap:16px; margin-top:36px; padding-top:20px; border-top:1px solid var(--border-hairline); flex-wrap:wrap;}
.cb-footer-legal{display:flex; align-items:center; gap:8px; font-size:12.5px; color:var(--text-faint); margin:0; max-width:760px; line-height:1.6;}
.cb-footer-legal .cb-i{color:var(--cb-positive); font-size:14px; flex:none;}
.cb-footer-copy{font-size:12.5px; color:var(--text-faint);}

/* ---- Error banner ------------------------------------------------------ */
.cb-form-error{margin:18px 0 0; padding:12px 16px; border-radius:var(--radius-md); background:rgba(220,38,38,0.08); border:1px solid rgba(220,38,38,0.28); color:#b91c1c; font-size:13.5px;}

/* ---- Results Dashboard: inert coming-soon nav item + tooltip ---------- */
/* Looks like a nav link but is unavailable. NOT natively disabled, so it stays
   keyboard-focusable and the "Coming Soon" tooltip is discoverable; type=button
   with no handler makes it behaviorally inert (no navigation, no reload). */
.cb-nav-coming-soon{
  position:relative; -webkit-appearance:none; appearance:none; background:none; border:0;
  margin:0; padding:0; font-family:inherit; font-size:14px; font-weight:600;
  color:var(--text-body); opacity:.55; cursor:default;
  transition:opacity var(--dur) var(--ease-out);
}
.cb-nav-coming-soon:hover,.cb-nav-coming-soon:focus-visible{opacity:.82; outline:none;}
.cb-nav-coming-soon::after{
  content:attr(data-tooltip); position:absolute; top:calc(100% + 9px); left:50%;
  transform:translateX(-50%); padding:5px 10px; border-radius:8px; white-space:nowrap;
  background:var(--cb-navy-800); color:#fff; font-family:var(--font-display);
  font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  box-shadow:0 10px 24px -8px rgba(10,31,51,0.5);
  opacity:0; visibility:hidden; pointer-events:none;
  transition:opacity var(--dur) var(--ease-out); z-index:60;
}
.cb-nav-coming-soon:hover::after,.cb-nav-coming-soon:focus-visible::after{opacity:1; visibility:visible;}

/* ---- Email updates section (light glass; distinct from Founder Access) - */
.cb-email-card{display:grid; grid-template-columns:1fr 1fr; gap:32px; align-items:center; padding:32px 34px;}
.cb-email-copy h2{font-family:var(--font-display); font-weight:800; font-size:clamp(24px,2.6vw,30px); letter-spacing:-0.02em; color:var(--text-strong); margin:8px 0 10px;}
.cb-email-form{display:flex; flex-direction:column; gap:12px;}
.cb-field{display:flex; flex-direction:column; gap:6px;}
.cb-field-label{font-family:var(--font-display); font-size:12.5px; font-weight:700; color:var(--text-strong);}
.cb-field-opt{font-weight:600; color:var(--text-faint);}
.cb-email-form input[type=text],.cb-email-form input[type=email]{
  height:46px; padding:0 14px; border-radius:var(--radius-md); border:1px solid var(--border-soft);
  background:rgba(255,255,255,0.78); color:var(--text-strong); font-size:14.5px; width:100%;
}
.cb-email-form input::placeholder{color:var(--text-faint);}
.cb-email-form input:focus{outline:none; border-color:var(--accent); box-shadow:0 0 0 3px var(--cb-blue-50);}
.cb-check{display:flex; gap:9px; align-items:flex-start; font-size:12.5px; line-height:1.5; color:var(--text-muted);}
.cb-check input{margin-top:3px; flex:none;}
.cb-email-form .cb-btn-lg{margin-top:4px;}
.cb-email-micro{margin:2px 0 0; font-size:12px; color:var(--text-faint); text-align:center;}
.cb-email-micro a{color:var(--accent-strong); text-decoration:underline; text-underline-offset:2px;}
@media (max-width:760px){
  .cb-email-card{grid-template-columns:1fr; gap:20px; padding:26px 22px;}
}

/* ---- Board on-load reveal (progressive enhancement) -------------------- */
/* These rules ONLY take effect once home-interactions.js adds the gating
   classes below. Without JS — or under reduced-motion, where the script bails
   before adding them — the board renders in its final state immediately, so
   nothing is ever hidden behind animation. */
/* cb-anim-prep: the instant zero/start state (NO transition). The script forces
   a reflow here, then switches on cb-anim-run so the meters animate up. */
.cb-board-section.cb-anim-prep .cb-strength i{transform:scaleY(0); transform-origin:bottom center;}
/* cb-anim-run: enable the transitions and the final (full) state. */
.cb-board-section.cb-anim-run .cb-bar-fill{transition:width 900ms var(--ease-out);}
.cb-board-section.cb-anim-run .cb-strength i{
  transform:scaleY(1); transform-origin:bottom center;
  transition:transform 360ms var(--ease-out);
}
/* Equalizer-style stagger so each meter's bars rise in sequence. */
.cb-board-section.cb-anim-run .cb-strength i:nth-child(2){transition-delay:50ms;}
.cb-board-section.cb-anim-run .cb-strength i:nth-child(3){transition-delay:100ms;}
.cb-board-section.cb-anim-run .cb-strength i:nth-child(4){transition-delay:150ms;}
.cb-board-section.cb-anim-run .cb-strength i:nth-child(5){transition-delay:200ms;}

/* Preview-only "demo pulse": a gentle pulse on the already-labeled Preview Mode
   dot. Decorative sample-UI motion only — the script adds cb-demo-pulse solely
   in preview mode, never in live mode, and it never implies real-time data. */
@keyframes cb-demo-pulse{
  0%,100%{transform:scale(1); opacity:1;}
  50%{transform:scale(1.45); opacity:0.5;}
}
.cb-board-section.cb-demo-pulse .cb-preview-badge::before{
  animation:cb-demo-pulse 2.4s var(--ease-out) infinite;
}

/* ---- Responsive -------------------------------------------------------- */
@media (max-width:1080px){
  .cb-board-grid{grid-template-columns:1fr;}
}
@media (max-width:920px){
  .cb-nav-links{display:none;}
  .cb-feature-grid{grid-template-columns:repeat(2,1fr);}
  .cb-stats{grid-template-columns:repeat(2,1fr);}
  .cb-steps{grid-template-columns:1fr;}
  .cb-founder-grid{grid-template-columns:1fr;}
  .cb-footer-grid{grid-template-columns:1fr 1fr; row-gap:28px;}
  .cb-section-head{flex-direction:column; align-items:flex-start;}
}
@media (max-width:560px){
  .cb-feature-grid{grid-template-columns:1fr;}
  .cb-stats{grid-template-columns:1fr;}
  .cb-hero-logo img{height:150px;}
  .cb-nav-search-input{width:128px;}
  .cb-nav-pop{width:240px;}
}
@media (prefers-reduced-motion:reduce){
  .cb-home *,.cb-home *::before,.cb-home *::after{transition:none !important; animation:none !important;}
}