:root{--acct-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='black' d='M8 8.6a3.3 3.3 0 1 0 0-6.6 3.3 3.3 0 0 0 0 6.6Zm0 1.3c-2.9 0-5.3 1.6-5.3 3.5 0 .4.3.6.7.6h9.2c.4 0 .7-.2.7-.6 0-1.9-2.4-3.5-5.3-3.5Z'/%3E%3C/svg%3E");
  /* ── BRAND PALETTE ── */
  --black:#0C0B09;--black-mid:#131210;--black-card:#191714;--black-card2:#201E1A;
  --white:#F5F4F0;--green:#1B4D3E;--green-light:#5BBF85;--blue-mid:#5A8FA8;
  --gold:#C9A84C;--red:#D94848;--border:rgba(255,255,255,0.07);
  /* ── TYPOGRAPHY ── */
  --display:'Cormorant Garamond',Georgia,serif;
  --body:'DM Sans','Helvetica Neue',sans-serif;
  --mono:'Azeret Mono','Courier New',monospace;--num:'Azeret Mono','Courier New',monospace;
  /* ── SPACING ── */
  --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:24px;--space-6:32px;--space-7:48px;--space-8:64px;
  /* ── TYPE SCALE ── */
  --text-hero:clamp(32px,4vw,52px);--text-h2:clamp(20px,2.2vw,28px);--text-h3:16px;--text-body:14px;--text-small:12px;--text-micro:10px;
  /* ── LAYOUT ── */
  --nav-h:64px;--sidebar-w:224px;
  /* ── ELEVATION ── */
  --shadow-sm:0 1px 3px rgba(0,0,0,0.35),0 2px 8px rgba(0,0,0,0.2);
  --shadow-md:0 4px 16px rgba(0,0,0,0.4),0 1px 3px rgba(0,0,0,0.3);
  --shadow-lg:0 12px 40px rgba(0,0,0,0.5),0 4px 12px rgba(0,0,0,0.3);
  /* ── TRANSITIONS ── */
  --ease-out:cubic-bezier(0.22,1,0.36,1);
  --ease-in-out:cubic-bezier(0.4,0,0.2,1);
}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{font-family:var(--body);background:var(--black);color:var(--white);-webkit-font-smoothing:antialiased;overflow-x:hidden;min-height:100vh;}
a{color:inherit;text-decoration:none;}

/* ── NAV ── */
nav{position:fixed;top:0;left:0;right:0;z-index:200;height:64px;padding:0 48px;display:flex;align-items:center;background:rgba(10,10,10,0.92);backdrop-filter:blur(16px);border-bottom:1px solid rgba(255,255,255,0.06);}
.nav-logo{display:flex;align-items:center;gap:10px;}
.nav-logo svg{width:22px;height:22px;color:var(--white);}
.nav-wordmark{font-size:13px;font-weight:600;letter-spacing:.1em;color:var(--white);}
.nav-wordmark span{font-weight:300;opacity:.5;}
.nav-links{display:flex;align-items:center;gap:28px;margin-left:auto;}
.nav-links a{font-size:13px;font-weight:500;letter-spacing:.04em;color:rgba(250,250,250,.6);transition:color .2s;}
.nav-links a:hover{color:var(--white);}
.nav-links a.active{color:var(--gold);}
/* Was #9A7D1F — gold reads as mustard at button size. Gold stays a data-highlight colour;
   the brand green carries the CTA, matching the nav CTA on every other page. */
/* Pill rather than a rounded rectangle, in the lighter green so it reads as a live control
   rather than a block of brand colour. No arrow — the label already names a destination. */
.nav-pro-btn{display:inline-flex;align-items:center;gap:7px;background:rgba(91,191,133,0.12);
  border:1px solid rgba(91,191,133,0.42);color:var(--green-light)!important;padding:7px 16px;
  border-radius:999px;font-weight:600;font-size:13px;letter-spacing:0.01em;
  transition:background .18s,border-color .18s,color .18s,transform .15s;}
.nav-pro-btn:hover{background:rgba(91,191,133,0.2);border-color:var(--green-light);transform:translateY(-1px);}
.nav-pro-btn.is-pro{background:rgba(201,168,76,0.13);border-color:rgba(201,168,76,0.45);color:var(--gold)!important;}
.nav-pro-btn.is-pro:hover{background:rgba(201,168,76,0.2);border-color:var(--gold);}
.nav-pro-btn::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.8;flex-shrink:0;}

.hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;background:none;border:none;margin-left:auto;}
.hamburger span{display:block;width:22px;height:2px;background:var(--white);border-radius:2px;transition:all .3s;}
nav.open .hamburger span:nth-child(1){transform:translateY(7px) rotate(45deg);}
nav.open .hamburger span:nth-child(2){opacity:0;}
nav.open .hamburger span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
.drawer{position:fixed;top:64px;left:0;right:0;z-index:199;background:rgba(10,10,10,0.97);backdrop-filter:blur(20px);border-bottom:1px solid rgba(255,255,255,0.07);padding:12px 0 20px;display:flex;flex-direction:column;align-items:center;gap:4px;max-height:0;overflow:hidden;opacity:0;pointer-events:none;transition:max-height .35s,opacity .25s;}
.drawer.open{max-height:400px;opacity:1;pointer-events:auto;}
.drawer a{font-size:15px;font-weight:500;color:rgba(250,250,250,.7);padding:10px;width:100%;text-align:center;transition:color .2s;}
.drawer a:hover{color:var(--white);}
.drawer .nav-pro-btn{margin-top:8px;width:auto;padding:10px 32px;}

/* ── THEME TOGGLE ── */

/* ── GATE ── */
/* Starts below the fixed site nav — inset:0 put the brand mark underneath it. */
#gate{position:fixed;top:var(--nav-h);left:0;right:0;bottom:0;z-index:60;background:var(--black);overflow-y:auto;color-scheme:dark;}#gate.hidden{display:none;}
.gate-card{background:var(--black-card);border:1px solid rgba(201,168,76,0.2);border-radius:16px;padding:48px 44px;max-width:480px;width:100%;margin:0 auto;text-align:center;position:relative;overflow:hidden;}
/* (removed: gradient rule belonged to the old bordered gate card) */
.gate-badge{display:inline-block;font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:0.18em;text-transform:uppercase;color:var(--gold);background:rgba(201,168,76,0.1);border:1px solid rgba(201,168,76,0.25);padding:5px 14px;border-radius:20px;margin-bottom:24px;}
.gate-badge-trial{color:var(--green-light);background:rgba(91,191,133,0.1);border-color:rgba(91,191,133,0.25);}
.gate-title{font-family:var(--display);font-size:clamp(2rem,5vw,3rem);font-weight:500;font-style:italic;line-height:1.1;margin-bottom:12px;}
.gate-sub{font-size:14px;color:rgba(250,250,250,0.65);margin-bottom:28px;line-height:1.7;}
.gate-perks{list-style:none;text-align:left;margin-bottom:32px;display:flex;flex-direction:column;gap:10px;}
.gate-perks li{display:flex;align-items:flex-start;gap:10px;font-size:13px;color:rgba(250,250,250,0.6);line-height:1.5;}
.gate-perks li::before{content:'→';color:var(--gold);flex-shrink:0;font-weight:700;margin-top:1px;}
.gate-form{display:flex;flex-direction:column;gap:10px;margin-bottom:16px;}
.gate-input{background:rgba(255,255,255,0.07);border:1px solid rgba(255,255,255,0.12);border-radius:8px;padding:14px 18px;font-family:var(--body);font-size:14px;color:var(--white);outline:none;transition:border-color .2s;text-align:center;}
.gate-input:focus{border-color:rgba(201,168,76,0.5);}
.gate-input::placeholder{color:rgba(250,250,250,0.57);}
.gate-btn{background:var(--gold);color:var(--black);border:none;border-radius:8px;padding:14px;font-family:var(--body);font-size:14px;font-weight:700;cursor:pointer;transition:background .2s,transform .15s;letter-spacing:0.02em;}
.gate-btn:hover{background:#D4B45E;transform:translateY(-1px);}
.gate-btn:disabled{opacity:0.5;cursor:not-allowed;transform:none;}
.gate-error{font-size:13px;color:var(--red);margin-top:-4px;display:none;}
.gate-error.show{display:block;}
.gate-note{font-size:12px;color:rgba(250,250,250,0.51);line-height:1.6;}
.gate-note a{color:rgba(201,168,76,0.5);text-decoration:underline;}
.trial-chip{font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;background:rgba(91,191,133,0.1);color:var(--green-light);border:1px solid rgba(91,191,133,0.25);padding:2px 8px;border-radius:3px;margin-left:6px;}
.trial-expired-msg{font-size:13px;color:var(--gold);margin-top:10px;display:none;}
.trial-expired-msg.show{display:block;}/* Multi-step gate */
.gate-step{display:none;}
.gate-step.active{display:block;}
.gate-otp-input{font-family:var(--mono);font-size:22px;letter-spacing:0.4em;text-align:center;padding:16px 18px;}
.gate-pw-wrap{position:relative;}
.gate-pw-wrap .gate-input{padding-right:44px;text-align:left;}
.gate-pw-toggle{position:absolute;right:12px;top:50%;transform:translateY(-50%);background:none;border:none;color:rgba(250,250,250,0.57);cursor:pointer;padding:4px;display:flex;align-items:center;transition:color .2s;}
.gate-pw-toggle:hover{color:rgba(250,250,250,0.7);}
.gate-back{background:none;border:none;color:rgba(250,250,250,0.57);font-family:var(--body);font-size:12px;cursor:pointer;padding:0;margin-top:14px;transition:color .2s;display:inline-block;}
.gate-back:hover{color:rgba(250,250,250,0.7);}
.gate-sent-msg{font-size:13px;color:rgba(250,250,250,0.45);margin-bottom:18px;line-height:1.6;}
.gate-sent-msg strong{color:rgba(250,250,250,0.75);}
.gate-gift-banner{display:none;font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:0.14em;text-transform:uppercase;color:var(--green-light);background:rgba(91,191,133,0.08);border:1px solid rgba(91,191,133,0.2);padding:6px 14px;border-radius:20px;margin-bottom:20px;}
.gate-step-actions{display:flex;justify-content:space-between;align-items:center;margin-top:6px;}
/* ── PRO APP ── */
#proApp{display:none;padding-top:64px;min-height:100vh;}
#proApp.show{display:block;}

/* ── TOURNEY HEADER ── */
.tourney-head{background:var(--black-mid);border-bottom:1px solid var(--border);padding:22px 40px;}
.tourney-inner{max-width:1200px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;}
.tourney-label{font-family:var(--mono);font-size:11px;font-weight:600;color:var(--gold);letter-spacing:0.16em;text-transform:uppercase;margin-bottom:6px;}
.tourney-name{font-family:var(--display);font-size:clamp(26px,3vw,38px);font-weight:500;font-style:italic;letter-spacing:-0.01em;color:var(--white);}
.tourney-chips{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.t-chip{font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:0.12em;text-transform:uppercase;padding:4px 10px;border-radius:4px;}
.chip-g{color:var(--green-light);background:rgba(91,191,133,0.08);border:1px solid rgba(91,191,133,0.2);}
.chip-gold{color:var(--gold);background:rgba(201,168,76,0.08);border:1px solid rgba(201,168,76,0.18);}
.chip-b{color:var(--blue-mid);background:rgba(90,143,168,0.08);border:1px solid rgba(90,143,168,0.18);}
.user-chip{font-family:var(--mono);font-size:10px;color:rgba(250,250,250,0.56);display:flex;align-items:center;gap:6px;}
.signout-btn{background:none;border:1px solid rgba(255,255,255,0.1);border-radius:4px;padding:3px 8px;font-family:var(--mono);font-size:9px;color:rgba(250,250,250,0.56);cursor:pointer;transition:all .2s;}
.signout-btn:hover{border-color:rgba(250,250,250,0.25);color:rgba(250,250,250,0.6);}

/* Weights strip */
.weights-strip{background:rgba(255,255,255,0.02);border-bottom:1px solid rgba(255,255,255,0.04);padding:10px 40px;}
.weights-inner{max-width:1200px;margin:0 auto;display:flex;align-items:center;gap:24px;flex-wrap:wrap;}
.w-label{font-family:var(--mono);font-size:9px;color:rgba(250,250,250,0.54);letter-spacing:0.1em;}
.w-item{display:flex;align-items:center;gap:6px;}
.w-name{font-family:var(--mono);font-size:10px;color:rgba(250,250,250,0.64);letter-spacing:0.05em;}
.w-bar-outer{width:48px;height:4px;background:rgba(255,255,255,0.06);border-radius:2px;overflow:hidden;}
.w-bar-fill{height:100%;border-radius:2px;}
.w-pct{font-family:var(--mono);font-size:10px;color:rgba(250,250,250,0.57);}

/* ── TABS ── */
.pro-tabs{display:flex;gap:0;border-bottom:1px solid var(--border);padding:0 40px;background:var(--black);}
.pro-tab{padding:13px 20px;font-size:13px;font-weight:600;color:rgba(250,250,250,0.6);cursor:pointer;border:none;border-bottom:2px solid transparent;background:none;font-family:var(--body);letter-spacing:0.03em;transition:all .18s;white-space:nowrap;}
.pro-tab:hover{color:rgba(250,250,250,0.7);}
.pro-tab.active{color:var(--gold);border-bottom-color:var(--gold);}
.pro-subtabs{display:flex;gap:6px;flex-wrap:wrap;padding:14px 40px 0;background:var(--black);}
.pro-subtab{padding:7px 16px;font-size:12px;font-weight:600;color:rgba(250,250,250,0.64);cursor:pointer;border:1px solid var(--border);border-radius:20px;background:none;font-family:var(--body);letter-spacing:0.02em;transition:all .18s;white-space:nowrap;}
.pro-subtab:hover{color:rgba(250,250,250,0.75);border-color:rgba(255,255,255,0.15);}
.pro-subtab.active{color:var(--gold);border-color:rgba(201,168,76,0.4);background:rgba(201,168,76,0.08);}
.tab-content{display:none;max-width:1200px;margin:0 auto;padding:16px 40px 72px;}
.tab-content.active{display:block;}

/* ── OVERVIEW ── */
.dl-card{background:var(--black-card);border:1px solid var(--border);border-radius:14px;padding:var(--space-5);}
.ov-hero{margin-bottom:var(--space-6);}
.ov-hero-label{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:0.16em;text-transform:uppercase;color:var(--gold);margin-bottom:var(--space-2);}
.ov-hero-name{font-family:var(--display);font-size:var(--text-hero);font-style:italic;font-weight:500;letter-spacing:-0.01em;line-height:1.1;margin-bottom:var(--space-2);}
.ov-hero-meta{display:flex;gap:var(--space-3);flex-wrap:wrap;font-family:var(--mono);font-size:var(--text-small);color:rgba(250,250,250,0.64);}
.ov-meta-dot{opacity:0.4;}
.ov-section-label{font-family:var(--mono);font-size:13px;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;color:rgba(250,250,250,0.76);margin-bottom:var(--space-3);}
.ov-picks-section{margin-bottom:var(--space-6);}
.ov-record-strip{display:none;align-items:center;gap:var(--space-6);padding:var(--space-4) var(--space-5);background:var(--black-card);border:1px solid var(--border);border-radius:14px;margin-bottom:var(--space-6);flex-wrap:wrap;}
.ov-record-item{display:flex;flex-direction:column;gap:2px;}
.ov-record-val{font-family:var(--mono);font-size:var(--text-h3);font-weight:700;}
.ov-record-val.pos{color:var(--green-light);}
.ov-record-val.neg{color:var(--red);}
.ov-record-lbl{font-family:var(--mono);font-size:var(--text-micro);letter-spacing:0.12em;text-transform:uppercase;color:rgba(250,250,250,0.6);}
.ov-record-cta{margin-left:auto;font-family:var(--mono);font-size:var(--text-micro);font-weight:700;letter-spacing:0.1em;text-transform:uppercase;color:var(--gold);cursor:pointer;white-space:nowrap;}
.ov-record-cta:hover{text-decoration:underline;}
.ov-quick-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:var(--space-5);}
.ov-quick-list{display:flex;flex-direction:column;gap:0;}
.ov-quick-row{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);padding:var(--space-2) 0;border-bottom:1px solid rgba(255,255,255,0.04);}
.ov-quick-row:last-child{border-bottom:none;}
.ov-quick-player{font-size:var(--text-body);font-weight:500;}
.ov-quick-sub{font-size:var(--text-small);color:rgba(250,250,250,0.57);margin-left:6px;}
.ov-quick-val{font-family:var(--mono);font-size:var(--text-small);white-space:nowrap;}
.ov-quick-cta{display:inline-block;margin-top:var(--space-4);font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:0.09em;text-transform:uppercase;color:var(--gold);cursor:pointer;}
.ov-quick-cta:hover{text-decoration:underline;}

/* ── LOADING ── */
.loading-msg{text-align:center;padding:60px 20px;color:rgba(250,250,250,0.54);font-family:var(--mono);font-size:12px;letter-spacing:0.06em;}
.spin{display:inline-block;width:18px;height:18px;border:2px solid rgba(201,168,76,0.2);border-top-color:var(--gold);border-radius:50%;animation:spin .7s linear infinite;margin-bottom:12px;}
@keyframes spin{to{transform:rotate(360deg);}}

/* ── COURSE FIT SEARCH ── */
.cf-search-wrap{display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
.cf-search-inner{position:relative;flex:1;max-width:320px;}
.cf-search-icon{position:absolute;left:11px;top:50%;transform:translateY(-50%);width:14px;height:14px;color:rgba(250,250,250,0.57);pointer-events:none;}
.cf-search-input{width:100%;background:var(--black-card);border:1px solid var(--border);border-radius:8px;padding:9px 32px 9px 32px;font-family:var(--body);font-size:13px;color:var(--white);outline:none;transition:border-color .2s;}
.cf-search-input:focus{border-color:rgba(201,168,76,0.4);}
.cf-search-input::placeholder{color:rgba(250,250,250,0.52);}
.cf-search-clear{position:absolute;right:10px;top:50%;transform:translateY(-50%);background:none;border:none;color:rgba(250,250,250,0.57);font-size:16px;cursor:pointer;padding:2px 4px;line-height:1;transition:color .15s;}
.cf-search-clear:hover{color:rgba(250,250,250,0.7);}
.cf-search-count{font-family:var(--mono);font-size:10px;color:rgba(250,250,250,0.54);white-space:nowrap;}
/* ── COURSE FIT TABLE ── */
.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;}
#cfTable,#vfTable,#liveTable,#muTable,#dfsTable,#accContent{overflow-x:auto;-webkit-overflow-scrolling:touch;}
.cf-table-wrap>div:last-child{border-bottom:none;}
.drawer-sg-fill.pos{background:var(--green-light);}
.drawer-sg-fill.neg{background:var(--red);}
.drawer-sg-val.pos{color:var(--green-light);}
.drawer-sg-val.neg{color:var(--red);}
.drawer-sg-val.zero{color:rgba(250,250,250,0.51);}
.value-badge{display:inline-block;font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;padding:3px 8px;border-radius:4px;text-align:center;}
.vbadge-strong{background:rgba(91,191,133,0.12);color:var(--green-light);border:1px solid rgba(91,191,133,0.25);}
.vbadge-moderate{background:rgba(201,168,76,0.1);color:var(--gold);border:1px solid rgba(201,168,76,0.2);}
.vbadge-none{background:rgba(255,255,255,0.04);color:rgba(250,250,250,0.54);border:1px solid rgba(255,255,255,0.07);}
.vbadge-loss{background:rgba(217,72,72,0.1);color:var(--red);border:1px solid rgba(217,72,72,0.22);}

/* ── DIVOT LAB SCORE ── */
/* ── COURSE HISTORY PANEL ── */
.cfhp-header{font-family:var(--mono);font-size:9px;font-weight:600;letter-spacing:0.14em;text-transform:uppercase;color:rgba(250,250,250,0.52);margin-bottom:10px;}
.cfhp-years{display:flex;gap:10px;flex-wrap:wrap;}
.cfhp-year{background:rgba(255,255,255,0.02);border:1px solid rgba(255,255,255,0.06);border-radius:8px;padding:9px 14px;min-width:80px;}
.cfhp-yr{font-family:var(--mono);font-size:9px;color:rgba(250,250,250,0.56);margin-bottom:5px;letter-spacing:0.05em;}
.cfhp-fin{font-family:var(--mono);font-size:17px;font-weight:500;}
.cfhp-fin.top10{color:#EBD289;}
.cfhp-fin.top20{color:var(--green-light);}
.cfhp-fin.made{color:rgba(250,250,250,0.57);}
.cfhp-fin.cut{color:rgba(201,106,90,0.85);}
.cfhp-fin.none,.cfhp-fin.mc{color:rgba(250,250,250,0.4);}
.cfhp-none{font-size:12px;color:rgba(250,250,250,0.52);padding:2px 0;}
/* Venue under the year, shown only when that year was played somewhere else. Naming it is
   what stops a Caves Valley result reading as a Bellerive one. */
.cfhp-venue{font-family:var(--mono);font-size:8.5px;line-height:1.35;letter-spacing:0.03em;
  color:rgba(250,250,250,0.42);margin-top:5px;max-width:104px;}
.cfhp-year.cfhp-same{border-color:rgba(91,191,133,0.22);background:rgba(91,191,133,0.05);}
.cfhp-note{font-family:var(--body);font-size:11.5px;line-height:1.5;color:rgba(250,250,250,0.5);
  margin:-4px 0 11px;}
/* ── LINE MOVEMENT ── */
.move-badge{font-family:var(--mono);font-size:9px;font-weight:700;margin-left:4px;vertical-align:middle;}
.move-up{color:var(--green-light);}
.move-dn{color:var(--red);}

/* ── TOOLTIPS ── */

/* Position leftward when near right edge */

/* ── PLAYER HOVER CARD ── */

.pc-name{font-family:var(--display);font-size:17px;font-weight:600;font-style:italic;color:var(--white);line-height:1.1;margin-bottom:2px;}
.pc-country{font-family:var(--mono);font-size:10px;color:rgba(250,250,250,0.56);letter-spacing:0.08em;margin-bottom:12px;}
.pc-fit-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;padding-bottom:12px;border-bottom:1px solid rgba(255,255,255,0.06);}
.pc-fit-label{font-family:var(--mono);font-size:9px;color:rgba(250,250,250,0.57);letter-spacing:0.1em;text-transform:uppercase;}
.pc-fit-score{font-family:var(--mono);font-size:26px;font-weight:500;color:var(--green-light);}
.pc-sg-row{display:flex;align-items:center;gap:6px;margin-bottom:5px;}
.pc-sg-lbl{font-family:var(--mono);font-size:9px;color:rgba(250,250,250,0.54);width:30px;flex-shrink:0;}
.pc-sg-track{flex:1;height:3px;background:rgba(255,255,255,0.06);border-radius:2px;overflow:hidden;}
.pc-sg-fill{height:100%;border-radius:2px;}
.pc-sg-val{font-family:var(--mono);font-size:9px;width:32px;text-align:right;flex-shrink:0;}
.pc-odds-row{margin-top:10px;padding-top:10px;border-top:1px solid rgba(255,255,255,0.05);display:flex;justify-content:space-between;align-items:center;}
.pc-odds-label{font-family:var(--mono);font-size:9px;color:rgba(250,250,250,0.56);letter-spacing:0.08em;}
.pc-odds-val{font-family:var(--mono);font-size:13px;color:var(--gold);}
.pc-odds-book{font-family:var(--mono);font-size:9px;color:rgba(250,250,250,0.52);}

/* ── PLAYER DETAIL DRAWER ── */
.player-drawer-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.5);opacity:0;pointer-events:none;transition:opacity .25s;z-index:450;}
.player-drawer-overlay.show{opacity:1;pointer-events:auto;}
.player-drawer{position:fixed;top:0;right:0;bottom:0;width:420px;max-width:100vw;background:var(--black-card);border-left:1px solid var(--border);z-index:460;transform:translateX(100%);transition:transform .3s ease;overflow-y:auto;overflow-x:hidden;box-shadow:-12px 0 40px rgba(0,0,0,0.4);}
.player-drawer.show{transform:translateX(0);}
.drawer-close{position:absolute;top:var(--space-4);right:var(--space-4);background:none;border:none;font-size:28px;line-height:1;color:rgba(250,250,250,0.64);cursor:pointer;transition:color .15s;}
.drawer-close:hover{color:rgba(250,250,250,0.8);}
.drawer-content{padding:var(--space-7) var(--space-5) var(--space-6);}
.drawer-avatar-header{ display:flex;align-items:center;gap:14px;margin-bottom:16px; }
.drawer-avatar-header .p-avatar{ flex-shrink:0; }
.drawer-name{font-family:var(--display);font-size:var(--text-h2);font-weight:600;font-style:italic;color:var(--white);line-height:1.1;}
.drawer-meta{font-family:var(--mono);font-size:var(--text-micro);color:rgba(250,250,250,0.56);letter-spacing:0.08em;margin-top:4px;}
.drawer-scores{display:flex;gap:var(--space-5);margin:var(--space-5) 0 var(--space-6);padding-bottom:var(--space-5);border-bottom:1px solid var(--border);}
.drawer-score-box{flex:1;text-align:center;}
.drawer-score-val{font-family:var(--mono);font-size:32px;font-weight:500;color:var(--green-light);line-height:1;}
.drawer-score-val.dim{color:rgba(250,250,250,0.51);}
.drawer-score-lbl{font-family:var(--mono);font-size:var(--text-micro);letter-spacing:0.1em;text-transform:uppercase;color:rgba(250,250,250,0.57);margin-top:6px;}
.drawer-section{margin-bottom:var(--space-6);}
.drawer-section-label{font-family:var(--mono);font-size:var(--text-micro);font-weight:700;letter-spacing:0.16em;text-transform:uppercase;color:rgba(250,250,250,0.6);margin-bottom:var(--space-3);}
.drawer-sg-row{display:flex;align-items:center;gap:10px;margin-bottom:8px;}
.drawer-sg-lbl{font-family:var(--mono);font-size:10px;color:rgba(250,250,250,0.64);width:88px;flex-shrink:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.drawer-sg-track{flex:1;height:5px;background:rgba(255,255,255,0.06);border-radius:3px;overflow:hidden;}
.drawer-sg-fill{height:100%;border-radius:3px;}
.drawer-sg-val{font-family:var(--mono);font-size:11px;width:42px;text-align:right;flex-shrink:0;}
.drawer-loading{font-size:12px;color:rgba(250,250,250,0.57);padding:4px 0;}
.drawer-recent-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:7px 0;border-bottom:1px solid rgba(255,255,255,0.04);}
.drawer-recent-row:last-child{border-bottom:none;}
.drawer-recent-info{min-width:0;flex:1;}
.drawer-recent-event{font-size:12px;color:rgba(250,250,250,0.75);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.drawer-recent-date{font-family:var(--mono);font-size:9px;color:rgba(250,250,250,0.54);margin-top:2px;}
.drawer-recent-finish{font-family:var(--mono);font-size:13px;font-weight:600;flex-shrink:0;}
.drawer-recent-finish.top10{color:#EBD289;}
.drawer-recent-finish.top20{color:var(--green-light);}
.drawer-recent-finish.made{color:rgba(250,250,250,0.57);}
.drawer-recent-finish.cut{color:rgba(201,106,90,0.85);}
.drawer-recent-finish.none{color:rgba(250,250,250,0.4);}
.drawer-recent-empty{font-size:12px;color:rgba(250,250,250,0.57);padding:4px 0;}
.drawer-compare-row{display:flex;gap:10px;}
.drawer-compare-row select{flex:1;background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.1);border-radius:7px;padding:9px 12px;font-family:var(--body);font-size:13px;color:var(--white);outline:none;cursor:pointer;}
.drawer-compare-row select option{background:var(--black-card);}

#drawerCompareResult{margin-top:var(--space-5);}

/* ── VALUE FINDER TAB ── */
.vf-toolbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;flex-wrap:wrap;gap:12px;}
.vf-filters{display:flex;gap:8px;flex-wrap:wrap;}
.vf-toggle{display:flex;align-items:center;gap:8px;font-size:12px;color:rgba(250,250,250,0.64);cursor:pointer;user-select:none;}
.vf-toggle input{width:32px;height:18px;appearance:none;background:rgba(255,255,255,0.1);border-radius:9px;position:relative;cursor:pointer;transition:background .2s;flex-shrink:0;}
.vf-toggle input:checked{background:var(--green-light);}
.vf-toggle input::after{content:'';position:absolute;top:3px;left:3px;width:12px;height:12px;background:#fff;border-radius:50%;transition:left .2s;}
.vf-toggle input:checked::after{left:17px;}
.vf-freshness{display:flex;gap:16px;flex-wrap:wrap;font-family:var(--mono);font-size:10px;letter-spacing:0.04em;margin:-6px 0 14px;}
.vf-freshness .live-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--green-light);margin-right:5px;vertical-align:middle;animation:liveDotPulse 2s ease-in-out infinite;}
@keyframes liveDotPulse{0%,100%{opacity:1;}50%{opacity:.35;}}
.vf-live-tag{display:inline-block;font-family:var(--mono);font-size:8px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;color:var(--green-light);background:rgba(91,191,133,0.12);border-radius:3px;padding:1px 4px;margin-left:4px;vertical-align:middle;}
/* Data status bar - which event, what phase, how fresh */
.dl-status-bar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;background:var(--card,#161614);border:1px solid rgba(255,255,255,0.07);border-radius:10px;padding:10px 16px;margin:0 0 18px;font-family:var(--mono);font-size:10.5px;letter-spacing:0.03em;}
.dl-status-event{display:flex;align-items:center;gap:8px;font-size:11.5px;font-weight:600;color:rgba(250,250,250,0.85);}
.dl-status-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0;}
.dl-status-dot.live{background:var(--green-light);animation:liveDotPulse 2s ease-in-out infinite;}
.dl-status-dot.pre{background:var(--gold,#C9A84C);}
.dl-status-dot.post{background:rgba(250,250,250,0.3);}
/* Between rounds: the event is live, but no shots are being hit — same colour, no pulse. */
.dl-status-dot.between{background:var(--green-light);opacity:0.55;}
.dl-status-dot.off{background:var(--blue-mid,#5A8FA8);}
.dl-status-phase{font-size:9px;font-weight:700;letter-spacing:0.12em;text-transform:uppercase;color:rgba(250,250,250,0.6);}
.dl-status-chips{display:flex;gap:12px;flex-wrap:wrap;margin-left:auto;color:rgba(250,250,250,0.6);}
.dl-status-chips b{color:rgba(250,250,250,0.6);font-weight:500;}
.dl-status-note{width:100%;font-family:var(--body);font-size:11.5px;color:rgba(250,250,250,0.45);line-height:1.5;}
.dl-status-warn{color:#D98548;font-weight:600;}@media(max-width:900px){.dl-status-bar{gap:8px;padding:10px 14px;}.dl-status-chips{margin-left:0;}}

/* Practice Library (Improve zone) */
.pr-filters{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:18px;}
.pr-pill{font-family:var(--mono);font-size:11px;letter-spacing:0.05em;padding:7px 14px;border-radius:20px;border:1px solid var(--border);background:transparent;color:rgba(250,250,250,0.55);cursor:pointer;transition:all .15s;}
.pr-pill:hover{border-color:rgba(91,191,133,0.35);}
.pr-pill.active{background:var(--green);border-color:var(--green);color:#fff;}
.pr-select{font-family:var(--mono);font-size:11px;padding:7px 10px;border-radius:8px;border:1px solid var(--border);background:var(--black-card);color:rgba(250,250,250,0.75);}
.pr-count{font-family:var(--mono);font-size:10.5px;color:rgba(250,250,250,0.57);margin-left:auto;}
.pr-drill{background:var(--black-card);border:1px solid var(--border);border-radius:12px;margin-bottom:10px;overflow:hidden;}
.pr-drill-head{display:flex;align-items:center;gap:12px;width:100%;text-align:left;padding:15px 18px;background:none;border:none;cursor:pointer;color:inherit;}
.pr-drill-name{font-size:14.5px;font-weight:600;color:rgba(250,250,250,0.9);}
.pr-drill-cat{font-family:var(--mono);font-size:9px;font-weight:600;letter-spacing:0.1em;text-transform:uppercase;color:var(--green-light);background:rgba(91,191,133,0.1);border-radius:4px;padding:2px 7px;}
.pr-drill-time{font-family:var(--mono);font-size:10px;color:rgba(250,250,250,0.6);margin-left:auto;white-space:nowrap;}
.pr-chevron{width:14px;height:14px;flex-shrink:0;transition:transform .2s;color:rgba(250,250,250,0.57);}
.pr-drill.open .pr-chevron{transform:rotate(180deg);}
.pr-drill-body{display:none;padding:0 18px 18px;}
.pr-drill.open .pr-drill-body{display:block;}
.pr-meta{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:12px;}
.pr-meta span{font-family:var(--mono);font-size:10.5px;color:rgba(250,250,250,0.64);}
.pr-meta b{color:rgba(250,250,250,0.7);font-weight:500;}
.pr-desc{font-size:13px;line-height:1.65;color:rgba(250,250,250,0.55);margin-bottom:14px;}
.pr-steps{margin:0 0 14px 18px;padding:0;}
.pr-steps li{font-size:12.5px;line-height:1.6;color:rgba(250,250,250,0.5);margin-bottom:5px;}
.pr-bench{font-size:12px;line-height:1.6;color:var(--gold);background:rgba(201,168,76,0.07);border:1px solid rgba(201,168,76,0.18);border-radius:8px;padding:10px 14px;margin-bottom:14px;}
.pr-bench b{font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:0.12em;text-transform:uppercase;display:block;margin-bottom:4px;}
.pr-diagram{width:100%;max-width:460px;color:var(--white);}
.pr-bands{margin-bottom:14px;}
.pr-band-row{display:flex;gap:10px;font-size:12px;line-height:1.6;padding:5px 0;border-bottom:1px solid rgba(255,255,255,0.04);}
.pr-band-row:last-child{border-bottom:none;}
.pr-band-tag{font-family:var(--mono);font-size:9.5px;font-weight:600;letter-spacing:0.06em;color:rgba(250,250,250,0.6);min-width:52px;padding-top:2px;text-transform:uppercase;}
.pr-band-val{color:rgba(250,250,250,0.55);}
.pr-band-row.active .pr-band-tag{color:var(--gold);}
.pr-band-row.active .pr-band-val{color:var(--gold);}
.pr-prog{font-size:12px;line-height:1.65;color:rgba(250,250,250,0.5);border-left:2px solid rgba(91,191,133,0.35);padding:2px 0 2px 12px;margin-bottom:14px;}
.pr-prog b{font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:0.12em;text-transform:uppercase;color:var(--green-light);display:block;margin-bottom:3px;}
.pr-fault{font-size:12px;line-height:1.65;color:rgba(250,250,250,0.5);background:rgba(217,133,72,0.05);border:1px solid rgba(217,133,72,0.15);border-radius:8px;padding:10px 14px;margin-bottom:14px;}
.pr-fault b{font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:0.12em;text-transform:uppercase;color:#D98548;display:block;margin-bottom:3px;}
.pr-fault .fx{color:rgba(250,250,250,0.65);}
/* Course weights transparency card */

.cw-bar.model{background:var(--green-light);opacity:0.85;}
.cw-bar.data{background:var(--blue-mid);opacity:0.7;}

.odds-notice{display:none;font-size:12px;line-height:1.6;color:#D98548;background:rgba(217,133,72,0.06);border:1px solid rgba(217,133,72,0.18);border-radius:10px;padding:11px 15px;margin:0 0 16px;}
.odds-notice b{font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:0.12em;text-transform:uppercase;display:block;margin-bottom:3px;}

.cw-nums b{color:rgba(250,250,250,0.8);font-weight:600;}

/* Quality sub-value inside the Course Fit cell (Phase 0.5 two-axis model) */
/* Quality holds two values in one grid cell — the mobile reflow maps grid areas by
   nth-child, so a second cell here would shift every area after it. */
.cf-quality{font-family:var(--mono);text-align:center;display:flex;flex-direction:column;align-items:center;gap:2px;line-height:1;}
/* No validated fit signal at this venue */

.cf-nofit p{font-size:12.5px;line-height:1.6;color:rgba(250,250,250,0.62);margin:0 0 8px;}
.cf-nofit strong{color:rgba(250,250,250,0.9);}
.cf-nofit a{font-family:var(--mono);font-size:9.5px;font-weight:600;letter-spacing:0.1em;text-transform:uppercase;color:var(--blue-mid,#5A8FA8);text-decoration:none;}
.cf-nofit a:hover{color:var(--gold);}
/* Account panel (Workstream 3) */
.acct-overlay{position:fixed;inset:0;z-index:400;background:rgba(0,0,0,0.6);backdrop-filter:blur(4px);display:none;align-items:center;justify-content:center;padding:20px;}
.acct-overlay.open{display:flex;}
.acct-card{background:var(--black-card);border:1px solid var(--border);border-radius:16px;padding:28px;max-width:460px;width:100%;max-height:90vh;overflow-y:auto;}
.acct-title{font-family:var(--display);font-size:1.6rem;font-weight:600;margin-bottom:4px;}
.acct-sub{font-size:12.5px;color:rgba(250,250,250,0.64);margin-bottom:22px;}
.acct-row{display:flex;justify-content:space-between;align-items:baseline;gap:14px;padding:11px 0;border-bottom:1px solid rgba(255,255,255,0.05);}
.acct-row:last-of-type{border-bottom:none;}
.acct-k{font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:0.1em;text-transform:uppercase;color:rgba(250,250,250,0.6);}
.acct-v{font-size:13.5px;color:rgba(250,250,250,0.85);text-align:right;}
.acct-badge{display:inline-block;font-family:var(--mono);font-size:9.5px;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;border-radius:4px;padding:3px 8px;}
.acct-badge.subscriber{background:rgba(201,168,76,0.14);color:var(--gold);}
.acct-badge.trial,.acct-badge.gifted{background:rgba(91,191,133,0.12);color:var(--green-light);}
.acct-badge.free{background:rgba(255,255,255,0.07);color:rgba(250,250,250,0.55);}
.acct-actions{display:flex;flex-direction:column;gap:9px;margin-top:22px;}
.acct-btn{display:block;width:100%;text-align:center;padding:12px;border-radius:8px;font-size:13.5px;font-weight:600;cursor:pointer;border:1px solid var(--border);background:transparent;color:rgba(250,250,250,0.8);transition:all .15s;font-family:var(--body);}
.acct-btn:hover{border-color:rgba(91,191,133,0.4);color:var(--white);}
.acct-btn.primary{background:var(--gold);border-color:var(--gold);color:#0A0A0A;}
.acct-btn.primary:hover{background:#D4B45E;color:#0A0A0A;}
.acct-note{font-size:11.5px;color:rgba(250,250,250,0.57);line-height:1.6;margin-top:14px;}
.psb-account{display:flex;align-items:center;gap:8px;width:100%;background:rgba(255,255,255,0.04);border:1px solid var(--border);border-radius:7px;color:rgba(250,250,250,0.82);font-family:var(--body);font-size:12.5px;font-weight:500;letter-spacing:0;text-transform:none;cursor:pointer;padding:9px 11px;text-align:left;transition:background .15s,border-color .15s,color .15s;margin-bottom:12px;}
.psb-account::before{content:"";width:15px;height:15px;flex-shrink:0;background:currentColor;opacity:.75;-webkit-mask:var(--acct-icon) center/contain no-repeat;mask:var(--acct-icon) center/contain no-repeat;}
.psb-account::after{content:"\2192";margin-left:auto;opacity:.45;font-size:13px;}
.psb-account:hover{background:rgba(201,168,76,0.10);border-color:rgba(201,168,76,0.42);color:var(--gold);}
.psb-account:hover::after{opacity:.9;}
.psb-account:focus-visible{outline:2px solid var(--gold);outline-offset:2px;}
/* Account panel — self-service sections */
.acct-sec{margin-top:20px;padding-top:18px;border-top:1px solid rgba(255,255,255,0.07);}
.acct-sec-title{font-family:var(--mono);font-size:9.5px;font-weight:700;letter-spacing:0.12em;text-transform:uppercase;color:rgba(250,250,250,0.64);margin-bottom:10px;}
.acct-ref{display:flex;gap:8px;align-items:stretch;}
.acct-ref input{flex:1;min-width:0;background:rgba(255,255,255,0.05);border:1px solid var(--border);border-radius:7px;padding:9px 11px;font-family:var(--mono);font-size:11.5px;color:rgba(250,250,250,0.8);}
.acct-copy{background:var(--green);border:none;color:#fff;border-radius:7px;padding:9px 15px;font-size:12px;font-weight:600;cursor:pointer;white-space:nowrap;font-family:var(--body);}
.acct-copy:hover{background:#236b4f;}
.acct-form{display:none;flex-direction:column;gap:8px;margin-top:10px;}
.acct-form.open{display:flex;}
.acct-form input{background:rgba(255,255,255,0.05);border:1px solid var(--border);border-radius:7px;padding:10px 12px;font-family:var(--body);font-size:13px;color:var(--white);}
.acct-msg{font-size:12px;margin-top:8px;line-height:1.5;}
.acct-msg.ok{color:var(--green-light);}
.acct-msg.err{color:#D98548;}
.acct-danger{color:#D98548;border-color:rgba(217,133,72,0.3);}
.acct-danger:hover{border-color:rgba(217,133,72,0.6);color:#D98548;}
/* Gate live preview — show the product working before asking for anything */
/* Split-screen auth. Both rails are full height, so a short proof panel can never leave
   the form stranded the way the old align-items:start grid did. */
.gate-split{display:grid;grid-template-columns:1.02fr 0.98fr;gap:0;min-height:calc(100vh - var(--nav-h));}
/* Both columns start at the SAME baseline. Centring them independently is what left the form
   floating low beside a tall rail — the single biggest complaint about the previous gate. */
.gate-aside,.gate-panel{padding:clamp(36px,5.5vh,68px) clamp(28px,4vw,56px) 40px;}
.gate-aside{position:relative;border-right:1px solid var(--border);background:linear-gradient(165deg,rgba(27,77,62,0.15) 0%,rgba(10,10,10,0) 52%),radial-gradient(ellipse 74% 56% at 18% 14%,rgba(201,168,76,0.085) 0%,transparent 64%);overflow:hidden;}
.gate-pitch{font-family:var(--display);font-size:clamp(32px,3.3vw,46px);line-height:1.08;font-weight:500;color:var(--white);margin:0;letter-spacing:-0.015em;text-wrap:balance;}
.gate-pitch-sub{font-size:13.5px;line-height:1.68;color:rgba(250,250,250,0.5);margin:0;max-width:48ch;}
.gate-aside-inner{max-width:490px;margin-left:auto;display:flex;flex-direction:column;gap:22px;}
.gate-panel{display:flex;justify-content:flex-start;align-items:flex-start;}
.gate-card{width:100%;max-width:404px;margin-right:auto;background:none;border:none;border-radius:0;padding:0;box-shadow:none;}

.gate-trust{display:flex;flex-wrap:wrap;gap:6px 22px;font-size:11.5px;color:rgba(250,250,250,0.62);}
.gate-trust b{font-family:var(--mono);font-size:13px;font-weight:500;color:rgba(250,250,250,0.72);margin-right:4px;}

.gate-below{border-top:1px solid var(--border);padding:26px clamp(28px,4vw,56px) 40px;background:rgba(255,255,255,0.012);}
.gate-below-label{max-width:760px;margin:0 auto 14px;font-family:var(--mono);font-size:9.5px;font-weight:600;letter-spacing:0.14em;text-transform:uppercase;color:rgba(250,250,250,0.6);}
.gate-below .gate-tiers{max-width:760px;margin:0 auto;}
@media(max-width:940px){
  .gate-split{grid-template-columns:1fr;min-height:0;}
  .gate-aside{order:2;border-right:none;border-top:1px solid var(--border);}
  .gate-panel{order:1;padding-bottom:26px;}
  .gate-card{margin:0 auto;}
  .gate-aside-inner{margin:0 auto;}
}
/* Left-aligned: a form reads as a form. The italic display face was fine for a landing
   panel but looks like marketing sitting above an email field. */
/* Intent switch. Stating sign-in vs sign-up up front is what every modern auth page does;
   the backend still checks the address either way, so picking the wrong tab is recoverable. */
.gate-tabs{display:grid;grid-template-columns:1fr 1fr;gap:4px;background:rgba(255,255,255,0.045);border:1px solid var(--border);border-radius:9px;padding:4px;margin-bottom:26px;}
.gate-tab{background:none;border:none;border-radius:6px;padding:9px 10px;font-family:var(--body);font-size:13px;font-weight:600;color:rgba(250,250,250,0.5);cursor:pointer;transition:background .15s,color .15s;}
.gate-tab:hover{color:rgba(250,250,250,0.8);}
.gate-tab.active{background:rgba(255,255,255,0.1);color:var(--white);}
.gate-tab:focus-visible{outline:2px solid var(--gold);outline-offset:2px;}.gate-card,.gate-card .gate-title,.gate-card .gate-sub{text-align:left;}
.gate-card .gate-title{font-family:var(--display);font-size:clamp(26px,2.4vw,32px);font-style:normal;font-weight:500;letter-spacing:-0.01em;margin-bottom:9px;}
.gate-card .gate-sub{font-size:13.5px;color:rgba(250,250,250,0.5);margin-bottom:24px;line-height:1.6;}
.gate-card .gate-badge{margin-bottom:18px;}
.gate-card .gate-input{text-align:left;}
.gate-card .gate-otp-input{text-align:center;letter-spacing:0.34em;font-family:var(--mono);}
.gate-card .gate-step-actions{display:flex;justify-content:space-between;gap:12px;}

/* Tier cards sit on the wide rail now, so they get room to read as a comparison. */
.gate-tiers{margin:0;gap:14px;}
.gate-tier{padding:16px 16px 15px;background:rgba(255,255,255,0.02);}
.gate-tier li{font-size:12px;color:rgba(250,250,250,0.58);}
.gate-aside .gate-proof{display:none;position:relative;background:linear-gradient(168deg,var(--black-card) 0%,rgba(22,22,20,0.72) 100%);border:1px solid var(--border);border-radius:16px;overflow:hidden;box-shadow:0 1px 0 rgba(255,255,255,0.035) inset,0 18px 44px -28px rgba(0,0,0,0.9);}
.gate-proof::after{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(120% 70% at 50% -18%,rgba(201,168,76,0.10),transparent 62%);}
.gate-proof-head{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap;padding:13px 16px;border-bottom:1px solid rgba(255,255,255,0.05);}
.gate-proof-label{font-family:var(--mono);font-size:8.5px;font-weight:600;letter-spacing:0.16em;text-transform:uppercase;color:var(--gold);}
.gate-proof-event{font-size:13px;font-weight:600;color:var(--white);}
.gate-proof-course{font-family:var(--mono);font-size:10px;color:rgba(250,250,250,0.6);}
.gate-proof-foot{padding:11px 16px;border-top:1px solid rgba(255,255,255,0.05);font-size:11px;line-height:1.5;color:rgba(250,250,250,0.61);}

/* Shared reveal. Rows arrive on a stagger driven by --i. */
@keyframes gpIn{from{opacity:0;transform:translateY(7px);}to{opacity:1;transform:none;}}
@keyframes gpBar{from{transform:scaleX(0);}to{transform:scaleX(var(--w,1));}}
.gp-anim{animation:gpIn .5s cubic-bezier(.22,.68,.28,1) backwards;animation-delay:calc(var(--i,0)*62ms);}

/* ── Mode: ranked list ─────────────────────────────────────────── */
.gate-prow{display:grid;grid-template-columns:20px 22px 1fr auto;gap:10px;align-items:center;padding:9px 16px;border-bottom:1px solid rgba(255,255,255,0.035);}
.gate-prow:last-of-type{border-bottom:none;}
.gate-prank{font-family:var(--mono);font-size:10.5px;color:rgba(250,250,250,0.54);}
.gate-pname{font-size:13px;color:rgba(250,250,250,0.88);}
.gate-pval{font-family:var(--mono);font-size:14px;font-weight:500;color:var(--green-light);font-variant-numeric:tabular-nums;}

/* ── Mode: guess first ─────────────────────────────────────────── */
.gp-ask{padding:15px 16px 6px;font-size:13.5px;line-height:1.5;color:rgba(250,250,250,0.82);}
.gp-ask b{color:var(--white);font-weight:600;}
.gp-opts{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:10px 16px 15px;}
.gp-opt{display:flex;align-items:center;gap:9px;padding:9px 11px;background:rgba(255,255,255,0.032);border:1px solid var(--border);border-radius:10px;cursor:pointer;text-align:left;font-family:var(--body);font-size:12.5px;color:rgba(250,250,250,0.86);transition:border-color .18s,background .18s,transform .18s;}
.gp-opt:hover{border-color:rgba(201,168,76,0.5);background:rgba(201,168,76,0.07);transform:translateY(-1px);}
.gp-opt:focus-visible{outline:2px solid var(--gold);outline-offset:2px;}
.gp-opt img,.gp-opt .gp-av{width:26px;height:26px;border-radius:50%;flex-shrink:0;object-fit:cover;background:rgba(255,255,255,0.07);}
.gp-opt.right{border-color:var(--green-light);background:rgba(91,191,133,0.12);}
.gp-opt.wrong{opacity:.4;}
.gp-verdict{padding:12px 16px;font-size:13px;line-height:1.55;color:rgba(250,250,250,0.72);border-top:1px solid rgba(255,255,255,0.05);}
.gp-verdict b{color:var(--gold);}

/* ── Mode: one player unpacked ─────────────────────────────────── */
.gp-player{display:flex;align-items:center;gap:11px;padding:14px 16px 11px;}
.gp-player img,.gp-player .gp-av{width:40px;height:40px;border-radius:50%;object-fit:cover;background:rgba(255,255,255,0.07);}
.gp-pmeta{display:flex;flex-direction:column;gap:2px;}
.gp-pname{font-size:15px;font-weight:600;color:var(--white);}
.gp-psub{font-family:var(--mono);font-size:10px;letter-spacing:0.05em;color:rgba(250,250,250,0.62);}
.gp-bars{padding:2px 16px 13px;display:flex;flex-direction:column;gap:9px;}
.gp-bar{display:grid;grid-template-columns:34px 1fr 48px;gap:10px;align-items:center;}
.gp-bl{font-family:var(--mono);font-size:9px;letter-spacing:0.1em;text-transform:uppercase;color:rgba(250,250,250,0.6);}
.gp-btrack{height:6px;border-radius:3px;background:rgba(255,255,255,0.06);overflow:hidden;}
.gp-bfill{display:block;width:100%;height:100%;border-radius:3px;transform-origin:left center;animation:gpBar .82s cubic-bezier(.2,.75,.3,1) both;animation-delay:calc(var(--i,0)*88ms + 150ms);}
.gp-bv{font-family:var(--mono);font-size:11.5px;text-align:right;font-variant-numeric:tabular-nums;}

/* ── Mode: live ────────────────────────────────────────────────── */
.gp-live-dot{width:6px;height:6px;border-radius:50%;background:var(--green-light);display:inline-block;margin-right:5px;animation:gpPulse 1.9s ease-in-out infinite;}
@keyframes gpPulse{0%,100%{opacity:1;}50%{opacity:.28;}}
.gate-prow .gp-thru{font-family:var(--mono);font-size:9.5px;color:rgba(250,250,250,0.57);}

@media(prefers-reduced-motion:reduce){
  .gp-anim,.gp-bfill{animation:none;}
  .gp-bfill{transform:scaleX(var(--w,1));}
  .gp-live-dot{animation:none;}
  .gp-opt{transition:none;}
}
/* Locked premium tab state for free-tier accounts */
.tab-lock{max-width:520px;margin:60px auto;text-align:center;background:var(--black-card);border:1px solid rgba(201,168,76,0.22);border-radius:16px;padding:34px 28px;}
.tab-lock-eyebrow{font-family:var(--mono);font-size:9.5px;font-weight:700;letter-spacing:0.14em;text-transform:uppercase;color:var(--gold);margin-bottom:12px;}
.tab-lock h3{font-family:var(--display);font-size:1.5rem;font-weight:600;margin-bottom:10px;}
.tab-lock p{font-size:13px;line-height:1.7;color:rgba(250,250,250,0.5);margin-bottom:20px;}
.tab-lock a{display:inline-block;background:var(--gold);color:#0A0A0A;border-radius:8px;padding:12px 26px;font-size:13.5px;font-weight:700;}
@media(max-width:980px){.pg-grid{grid-template-columns:1fr;}}
@media(max-width:760px){.pg-cards{grid-template-columns:1fr;}}
/* Skeleton loaders — mirror the final row shape so content arrival causes no layout shift */
.sk-wrap{padding:4px 0;}
.sk-row{display:flex;align-items:center;gap:14px;padding:13px 20px;border-bottom:1px solid rgba(255,255,255,0.04);}
.sk-row:last-child{border-bottom:none;}
.sk-bar{height:10px;border-radius:4px;background:linear-gradient(90deg,rgba(255,255,255,0.05) 25%,rgba(255,255,255,0.10) 37%,rgba(255,255,255,0.05) 63%);background-size:400% 100%;animation:skShimmer 1.4s ease infinite;}
.sk-rank{width:18px;flex-shrink:0;}
.sk-name{flex:1;max-width:190px;}
.sk-num{width:38px;flex-shrink:0;margin-left:auto;}
.sk-num+.sk-num{margin-left:0;}
.sk-dot{width:26px;height:26px;border-radius:50%;flex-shrink:0;background:linear-gradient(90deg,rgba(255,255,255,0.05) 25%,rgba(255,255,255,0.10) 37%,rgba(255,255,255,0.05) 63%);background-size:400% 100%;animation:skShimmer 1.4s ease infinite;}
@keyframes skShimmer{0%{background-position:100% 50%;}100%{background-position:0 50%;}}
@media(prefers-reduced-motion:reduce){.sk-bar,.sk-dot{animation:none;}}
/* Model changelog (Track Record tab) */
.cl-entry{display:grid;grid-template-columns:92px 1fr;gap:16px;padding:16px 0;border-bottom:1px solid var(--border);}
.cl-entry:last-child{border-bottom:none;}
.cl-date{font-family:var(--mono);font-size:10.5px;color:rgba(250,250,250,0.6);padding-top:2px;}
.cl-title{font-size:13.5px;font-weight:600;color:rgba(250,250,250,0.85);margin-bottom:6px;}
.cl-title.miss{color:#D98548;}
.cl-body{font-size:12.5px;line-height:1.65;color:rgba(250,250,250,0.5);}
@media(max-width:600px){.cl-entry{grid-template-columns:1fr;gap:4px;}}
/* Today at the Lab (Overview strip) */
.tf-strip{display:flex;align-items:center;gap:14px;flex-wrap:wrap;background:var(--black-card);border:1px solid var(--border);border-radius:12px;padding:14px 18px;margin-bottom:18px;}
.tf-text{font-size:12.5px;line-height:1.6;color:rgba(250,250,250,0.55);flex:1;min-width:220px;}
.tf-text b{color:rgba(250,250,250,0.85);font-weight:600;}
.tf-chips{display:flex;gap:8px;flex-wrap:wrap;}
.tf-chip{font-family:var(--mono);font-size:10.5px;letter-spacing:0.05em;padding:7px 13px;border-radius:7px;border:1px solid rgba(91,191,133,0.3);background:rgba(91,191,133,0.08);color:var(--green-light);cursor:pointer;transition:all .15s;}
.tf-chip:hover{background:rgba(91,191,133,0.16);}.vf-th{cursor:pointer;user-select:none;}
.vf-th:hover{color:rgba(250,250,250,0.7);}
.vf-th.sorted{color:var(--gold);}
.sort-arrow{font-size:9px;margin-left:3px;}
.vf-filter{background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.08);border-radius:20px;padding:5px 14px;font-size:12px;font-weight:600;color:rgba(250,250,250,0.64);cursor:pointer;transition:all .18s;font-family:var(--body);}
.vf-filter:hover{color:rgba(250,250,250,0.75);}
.vf-filter.active{background:rgba(201,168,76,0.1);border-color:rgba(201,168,76,0.28);color:var(--gold);}
.vf-table{background:var(--black-card);border:1px solid var(--border);border-radius:12px;overflow:hidden;min-width:580px;}
.vf-head{display:grid;grid-template-columns:1fr 90px 90px 90px 90px 90px;padding:11px 20px;border-bottom:1px solid var(--border);background:var(--black-card);position:sticky;top:0;z-index:2;}
/* Scrollable value-finder table */
/* No inner scroll: the board runs its full length and the page scrolls once. A nested
   scroller let you reach the bottom of the page with half the table unread. */
#vfTable{border-radius:12px;}
#vfTable::-webkit-scrollbar{width:5px;}
#vfTable::-webkit-scrollbar-track{background:transparent;}
#vfTable::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.1);border-radius:3px;}
#vfTable::-webkit-scrollbar-thumb:hover{background:rgba(91,191,133,0.35);}.vf-th{font-family:var(--mono);font-size:9px;font-weight:600;letter-spacing:0.14em;text-transform:uppercase;color:rgba(250,250,250,0.56);}
.vf-row{display:grid;grid-template-columns:1fr 90px 90px 90px 90px 90px;padding:13px 20px;border-bottom:1px solid rgba(255,255,255,0.04);align-items:center;transition:background .15s;cursor:pointer;}
.vf-row:hover{background:rgba(255,255,255,0.02);}
.vf-row:last-child{border-bottom:none;}
.vf-row.high{background:rgba(91,191,133,0.04);}
.vf-player{font-size:14px;font-weight:600;color:rgba(250,250,250,0.9);}
.vf-player-cell{display:flex;align-items:center;gap:10px;}
.vf-bet-badge{display:inline-block;font-family:var(--mono);font-size:9px;font-weight:600;letter-spacing:0.1em;padding:2px 7px;border-radius:3px;margin-left:6px;}
.bet-top5{background:rgba(91,191,133,0.12);color:var(--green-light);}
.bet-top10{background:rgba(90,143,168,0.12);color:var(--blue-mid);}
.bet-top20{background:rgba(90,143,168,0.08);color:var(--blue-mid);}
.bet-win{background:rgba(201,168,76,0.12);color:var(--gold);}
.vf-cell{font-family:var(--mono);font-size:12px;color:rgba(250,250,250,0.5);text-align:center;}
.vf-cell.green{color:var(--green-light);font-weight:600;}
.vf-cell.gold{color:var(--gold);font-weight:600;}
.conf-strong{color:var(--green-light);}
.conf-moderate{color:var(--gold);}

/* ── PLAYER COMPARE (drawer result) ── */
.h2h-result{background:var(--black-card);border:1px solid var(--border);border-radius:12px;overflow:hidden;display:none;}
.h2h-result.show{display:block;}
.h2h-header{display:grid;grid-template-columns:1fr 100px 1fr;padding:20px 24px;border-bottom:1px solid var(--border);align-items:center;text-align:center;}
.h2h-pname{font-family:var(--display);font-size:22px;font-weight:600;font-style:italic;line-height:1.1;}
.h2h-vs{font-family:var(--mono);font-size:12px;color:rgba(250,250,250,0.54);letter-spacing:0.1em;}
.h2h-score-display{padding:20px 24px;border-bottom:1px solid var(--border);display:flex;}
.h2h-score-side{text-align:center;padding:16px;}
.h2h-score-side.winner{background:rgba(91,191,133,0.04);}
.h2h-score-num{font-family:var(--mono);font-size:48px;font-weight:500;line-height:1;margin-bottom:6px;}
.h2h-score-num.a-wins{color:var(--green-light);}
.h2h-score-num.b-wins{color:var(--gold);}
.h2h-score-label{font-family:var(--mono);font-size:10px;color:rgba(250,250,250,0.57);letter-spacing:0.1em;}
.h2h-score-sep{width:1px;background:rgba(255,255,255,0.06);margin:16px 0;flex-shrink:0;}
.h2h-score-side{flex:1;}
.h2h-breakdown{padding:20px 24px;}
.h2h-cat-row{display:grid;grid-template-columns:1fr 120px 1fr;gap:12px;align-items:center;margin-bottom:14px;}
.h2h-cat-row:last-child{margin-bottom:0;}
.h2h-bar-a{display:flex;align-items:center;gap:6px;justify-content:flex-end;}
.h2h-bar-b{display:flex;align-items:center;gap:6px;}
.h2h-val{font-family:var(--mono);font-size:12px;}
.h2h-track{flex:1;height:5px;background:rgba(255,255,255,0.06);border-radius:3px;overflow:hidden;max-width:120px;}
.h2h-fill-a{height:100%;border-radius:3px;background:var(--green-light);}
.h2h-fill-b{height:100%;border-radius:3px;background:var(--gold);}
.h2h-cat-label{font-family:var(--mono);font-size:10px;color:rgba(250,250,250,0.56);text-align:center;letter-spacing:0.08em;}
.h2h-weight-note{font-size:11px;color:rgba(250,250,250,0.54);text-align:center;margin-top:4px;font-style:italic;}

/* ── DISCLAIMER ── */
.pro-disclaimer{max-width:1200px;margin:0 auto;padding:0 40px 32px;font-size:11px;color:rgba(250,250,250,0.49);line-height:1.7;}

/* ── COLLAPSIBLE CARD SHARED ── */
.card-header-toggle{cursor:pointer;user-select:none;}
.card-header-toggle:hover .card-chevron{border-color:rgba(250,250,250,0.55);}
.card-chevron{width:8px;height:8px;border-right:1.5px solid rgba(250,250,250,0.3);border-bottom:1.5px solid rgba(250,250,250,0.3);transform:rotate(45deg);transition:transform .22s ease,border-color .15s;flex-shrink:0;margin-left:auto;}
.card-chevron.up{transform:rotate(-135deg);}
.card-body{overflow:hidden;transition:opacity .2s;}
.card-body.hidden{display:none;}
/* ── PICKS CARD ── */
.picks-card-wrap{background:var(--black-card);border:1px solid var(--border);border-radius:14px;padding:20px 24px;margin-bottom:var(--space-6);}
.picks-card-header{display:flex;align-items:center;gap:12px;margin-bottom:16px;}
.picks-card-wrap.collapsed .picks-card-header{margin-bottom:0;}
.picks-card-badge{font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:0.18em;text-transform:uppercase;color:var(--gold);background:rgba(201,168,76,0.1);border:1px solid rgba(201,168,76,0.2);padding:4px 12px;border-radius:20px;}
.picks-card-tourney{font-size:12px;color:rgba(250,250,250,0.57);}
.picks-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;}
.pick-card{background:var(--black-card2);border:1px solid var(--border);border-radius:10px;padding:16px;position:relative;min-width:0;}
.pick-card.win{border-color:rgba(91,191,133,0.3);}
.pick-card.loss{border-color:rgba(217,72,72,0.2);}
.pick-player{font-size:15px;font-weight:600;margin-bottom:6px;padding-right:62px;}
.pick-meta{display:flex;align-items:center;gap:7px;margin-bottom:8px;flex-wrap:wrap;}
.pick-bet-badge{font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;background:rgba(90,143,168,0.15);border:1px solid rgba(90,143,168,0.25);color:var(--blue-mid);padding:3px 7px;border-radius:4px;}
.pick-odds{font-family:var(--mono);font-size:14px;font-weight:600;color:var(--gold);}
.pick-book{font-family:var(--mono);font-size:10px;color:rgba(250,250,250,0.57);}
.pick-confidence{font-family:var(--mono);font-size:9px;letter-spacing:0.1em;font-weight:600;padding:2px 7px;border-radius:3px;text-transform:uppercase;}
.pick-confidence.high{color:var(--green-light);background:rgba(91,191,133,0.1);}
.pick-confidence.medium{color:var(--gold);background:rgba(201,168,76,0.1);}
.pick-confidence.low{color:rgba(250,250,250,0.57);background:rgba(255,255,255,0.05);}
.pick-reasoning{font-size:12px;color:rgba(250,250,250,0.64);line-height:1.55;margin-top:8px;border-top:1px solid rgba(255,255,255,0.05);padding-top:8px;}
.pick-section-label{grid-column:1/-1;font-size:10px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--blue-mid);background:rgba(90,143,168,0.08);border:1px solid rgba(90,143,168,0.18);padding:6px 14px;border-radius:20px;display:inline-block;margin-top:4px;}.pick-result-badge{position:absolute;top:12px;right:12px;font-family:var(--mono);font-size:8px;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;padding:3px 8px;border-radius:3px;}
.pick-result-win{background:rgba(91,191,133,0.15);color:var(--green-light);border:1px solid rgba(91,191,133,0.3);}
.pick-result-loss{background:rgba(217,72,72,0.1);color:var(--red);border:1px solid rgba(217,72,72,0.2);}
.pick-result-pending{background:rgba(255,255,255,0.04);color:rgba(250,250,250,0.52);border:1px solid rgba(255,255,255,0.07);}

/* ── LIVE TAB ── */
.live-status{display:flex;align-items:center;gap:12px;margin-bottom:20px;flex-wrap:wrap;}
.live-dot{width:8px;height:8px;border-radius:50%;background:var(--green-light);box-shadow:0 0 0 3px rgba(91,191,133,0.15);animation:livepulse 2s infinite;}
@keyframes livepulse{0%,100%{box-shadow:0 0 0 3px rgba(91,191,133,0.15);}50%{box-shadow:0 0 0 7px rgba(91,191,133,0.04);}}
.live-updated{font-family:var(--mono);font-size:11px;color:rgba(250,250,250,0.56);}
.live-refresh-btn{font-family:var(--mono);font-size:11px;color:rgba(250,250,250,0.64);background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.08);border-radius:5px;padding:5px 12px;cursor:pointer;transition:all .2s;}
.live-refresh-btn:hover{color:var(--white);background:rgba(255,255,255,0.09);}
.live-note{font-family:var(--mono);font-size:10px;color:rgba(250,250,250,0.49);margin-left:auto;}
.live-table-wrap{background:var(--black-card);border:1px solid var(--border);border-radius:12px;overflow:hidden;min-width:740px;}
.live-table-head{display:grid;grid-template-columns:48px 1fr 68px 68px 52px 66px 66px 66px 66px 58px 58px 58px 58px;padding:11px 20px;border-bottom:1px solid var(--border);background:rgba(255,255,255,0.02);}
.live-th{font-family:var(--mono);font-size:9px;font-weight:600;letter-spacing:0.14em;text-transform:uppercase;color:rgba(250,250,250,0.56);}
.live-row{display:grid;grid-template-columns:48px 1fr 68px 68px 52px 66px 66px 66px 66px 58px 58px 58px 58px;padding:10px 20px;border-bottom:1px solid rgba(255,255,255,0.04);align-items:center;transition:background .15s;}
.live-row:hover{background:rgba(255,255,255,0.025);}
.live-row.is-pick{background:rgba(201,168,76,0.05);border-left:2px solid rgba(201,168,76,0.5);}
.live-row.is-pick .live-player-name{color:var(--gold);}
.live-pos{font-family:var(--mono);font-size:12px;color:rgba(250,250,250,0.45);}
.live-player-name{font-size:13px;font-weight:500;}
.live-pick-badge{display:inline-block;font-family:var(--mono);font-size:8px;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;color:var(--gold);background:rgba(201,168,76,0.12);border:1px solid rgba(201,168,76,0.25);padding:2px 5px;border-radius:3px;margin-left:6px;vertical-align:middle;}
.live-score{font-family:var(--mono);font-size:12px;}
.live-pos-score{color:var(--green-light);}
.live-neg-score{color:var(--red);}
.live-zero{color:rgba(250,250,250,0.6);}
.live-sg{font-family:var(--mono);font-size:11px;}
.live-th.sorted{color:var(--gold)!important;}
.live-th[onclick]{cursor:pointer;}
.live-th[onclick]:hover{color:rgba(250,250,250,0.6);}
.live-empty{padding:60px 20px;text-align:center;}
.live-empty-title{font-size:15px;font-weight:600;color:rgba(250,250,250,0.6);margin-bottom:8px;}
.live-empty-sub{font-size:12px;color:rgba(250,250,250,0.51);line-height:1.7;}

/* ── MATCHUP MARKET ── */
.mu-legend{font-family:var(--mono);font-size:10.5px;line-height:1.6;color:rgba(250,250,250,0.5);
  margin-bottom:14px;display:flex;align-items:flex-start;gap:8px;}
.mu-legend-swatch{display:inline-block;width:8px;height:8px;border-radius:2px;
  background:var(--green-light);flex-shrink:0;margin-top:4px;}
.mu-table-wrap{--mu-cols:minmax(0,1fr) 40px minmax(0,1fr) 112px 156px;
  --mu3-cols:minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) 112px 156px;
  border:1px solid var(--border);border-radius:14px;overflow:hidden;min-width:640px;
  background:linear-gradient(168deg, rgba(26,24,21,0.82) 0%, rgba(20,19,17,0.68) 100%);
  -webkit-backdrop-filter:blur(14px) saturate(115%);backdrop-filter:blur(14px) saturate(115%);
  box-shadow:0 1px 0 rgba(255,255,255,0.045) inset, 0 20px 46px -30px rgba(0,0,0,0.92);}
.mu-table-head,.mu3-table-head{display:grid;align-items:center;gap:18px;padding:0 22px;height:52px;
  border-bottom:1px solid rgba(255,255,255,0.07);background:rgba(255,255,255,0.018);}
.mu-table-head{grid-template-columns:var(--mu-cols);}
.mu3-table-head{grid-template-columns:var(--mu3-cols);}
/* Same header voice as every other table: 11px, 700, 0.1em, 0.72 opacity. It was 9px/600/0.56
   here, which is the weight we use for a sub-label, not a column heading. */
.mu-th{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:0.1em;
  text-transform:uppercase;color:rgba(250,250,250,0.72);display:flex;align-items:center;gap:6px;
  min-width:0;}
/* A header must not spill into the column beside it — that is how the Best edge tooltip became
   unhoverable, hidden under its own neighbour. */
.mu-th>.cf-hbtn{min-width:0;}
.mu-th-lbl{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.mu-th.right{justify-content:flex-end;text-align:right;}
.mu-row,.mu3-row{display:grid;align-items:center;gap:18px;padding:13px 22px;
  border-bottom:1px solid rgba(255,255,255,0.04);transition:background .15s;}
.mu-row{grid-template-columns:var(--mu-cols);}
.mu3-row{grid-template-columns:var(--mu3-cols);}
.mu-table-wrap>div:last-child{border-bottom:none;}
.mu-row:hover,.mu3-row:hover{background:rgba(255,255,255,0.028);}
.mu-row.has-gap,.mu3-row.has-gap{background:rgba(201,168,76,0.035);}
.mu-row.has-gap:hover,.mu3-row.has-gap:hover{background:rgba(201,168,76,0.055);}
.mu-player{font-size:13.5px;font-weight:500;overflow:hidden;text-overflow:ellipsis;
  white-space:nowrap;cursor:pointer;transition:color .14s;}
.mu-player:hover{color:var(--white);}
.mu-player.favored{color:var(--green-light);}
.mu-player.pick-flag{color:var(--gold);}
.mu-vs{font-family:var(--mono);font-size:9px;color:rgba(250,250,250,0.4);text-align:center;
  text-transform:uppercase;letter-spacing:0.08em;}
.mu-edge{font-family:var(--mono);font-size:13px;color:rgba(250,250,250,0.5);text-align:right;}
.mu-edge.pos{color:var(--green-light);}

/* A player and their own best price, stacked. Both sides are priced now, so the cell has to
   carry a number without competing with the name for attention. */
.mu-pcell{display:flex;flex-direction:column;gap:3px;min-width:0;}
.mu-price{font-family:var(--mono);font-size:11px;font-weight:600;color:rgba(250,250,250,0.66);
  display:inline-flex;align-items:baseline;gap:6px;}
.mu-price.none{color:rgba(250,250,250,0.3);font-weight:400;font-style:italic;}
.mu-price-book{font-size:8.5px;font-weight:700;letter-spacing:0.1em;color:rgba(250,250,250,0.36);}
/* Named on the side the model prefers to the market, so the gap column has a referent in the
   row itself rather than only in a number at the far right. */
.mu-leans{font-family:var(--mono);font-size:8px;font-weight:700;letter-spacing:0.11em;
  text-transform:uppercase;color:var(--gold);opacity:0.78;}

.mu-cell-name{display:block;font-family:var(--mono);font-size:8.5px;font-weight:700;
  letter-spacing:0.1em;text-transform:uppercase;color:rgba(250,250,250,0.38);margin-top:3px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.mu-gap{font-family:var(--mono);font-size:13px;color:rgba(250,250,250,0.5);text-align:right;}
.mu-gap.wide{color:var(--gold);}
.mu-gap-unit{font-size:9px;opacity:0.55;margin-left:1px;}

/* Search sits above the table and outside it, so a re-render cannot take focus mid-keystroke. */
.mu-tools{display:flex;align-items:center;gap:12px;margin-bottom:12px;flex-wrap:wrap;}
.mu-search-wrap{position:relative;display:inline-flex;align-items:center;flex:0 1 260px;}
.mu-search-ic{position:absolute;left:10px;width:12px;height:12px;opacity:0.4;pointer-events:none;}
.mu-search{width:100%;font-family:var(--body);font-size:12.5px;color:var(--white);
  background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.1);border-radius:8px;
  padding:8px 30px 8px 28px;transition:border-color .15s,background .15s;}
.mu-search::placeholder{color:rgba(250,250,250,0.34);}
.mu-search::-webkit-search-cancel-button,
.mu-search::-webkit-search-decoration{-webkit-appearance:none;appearance:none;display:none;}
.mu-search:focus{outline:none;border-color:rgba(91,191,133,0.5);background:rgba(255,255,255,0.05);}
.mu-search-x{position:absolute;right:6px;width:20px;height:20px;border:0;border-radius:5px;
  background:none;color:rgba(250,250,250,0.4);cursor:pointer;font-size:14px;line-height:1;
  display:none;align-items:center;justify-content:center;}
.mu-search:not(:placeholder-shown)~.mu-search-x{display:inline-flex;}
.mu-search-x:hover{color:var(--white);background:rgba(255,255,255,0.08);}
.mu-count{font-family:var(--mono);font-size:10px;letter-spacing:0.09em;text-transform:uppercase;
  color:rgba(250,250,250,0.4);}
.mu-count.filtered{color:var(--green-light);}
.mu-clear-inline{font-family:inherit;font-size:inherit;color:var(--green-light);background:none;
  border:0;padding:0;cursor:pointer;text-decoration:underline;text-underline-offset:2px;}
.mu-empty{padding:60px 20px;text-align:center;}
.mu-empty-title{font-size:15px;font-weight:600;color:rgba(250,250,250,0.6);margin-bottom:8px;}
.mu-empty-sub{font-size:12px;color:rgba(250,250,250,0.51);line-height:1.7;}

/* ── TRACK RECORD ── */
.acc-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:24px;}
.acc-stat{background:var(--black-card);border:1px solid var(--border);border-radius:10px;padding:16px 18px;}
.acc-stat-val{font-family:var(--mono);font-size:24px;font-weight:500;color:var(--green-light);margin-bottom:4px;}
.acc-stat-lbl{font-family:var(--mono);font-size:9px;font-weight:600;letter-spacing:0.12em;text-transform:uppercase;color:rgba(250,250,250,0.56);}
.acc-stat-sub{font-family:var(--mono);font-size:10px;color:rgba(250,250,250,0.51);margin-top:2px;}
.acc-section-label{font-family:var(--mono);font-size:9px;font-weight:600;letter-spacing:0.14em;text-transform:uppercase;color:rgba(250,250,250,0.56);margin:0 0 12px;}
.acc-stat-val.neg{color:var(--red);}
.acc-calib-wrap{background:var(--black-card);border:1px solid var(--border);border-radius:12px;padding:20px;margin-bottom:24px;}
.acc-calib-row{display:flex;align-items:center;gap:14px;margin-bottom:10px;}
.acc-calib-row:last-child{margin-bottom:0;}
.acc-calib-lbl{font-family:var(--mono);font-size:9px;font-weight:600;letter-spacing:0.08em;text-transform:uppercase;color:rgba(250,250,250,0.6);width:100px;flex-shrink:0;}
.acc-calib-bar-wrap{flex:1;height:8px;background:rgba(255,255,255,0.05);border-radius:4px;overflow:hidden;}
.acc-calib-bar{height:100%;border-radius:4px;background:var(--green-light);transition:width .4s;}
.acc-calib-num{font-family:var(--mono);font-size:11px;color:rgba(250,250,250,0.5);width:120px;text-align:right;flex-shrink:0;white-space:nowrap;}
.acc-note{font-size:11px;color:rgba(250,250,250,0.52);line-height:1.6;margin-top:16px;}

/* ── TRACK RECORD: shared event cards (Lab Picks + Model Calibration) ── */
.tr-section{margin-bottom:32px;}
.tr-note{font-size:12px;line-height:1.6;color:rgba(250,250,250,0.58);margin:-4px 0 16px;max-width:640px;}
.tr-type-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:24px;}
.tr-type-item{background:var(--black-card);border:1px solid var(--border);border-radius:10px;padding:12px 14px;text-align:center;}
.tr-type-val{font-family:var(--mono);font-size:18px;font-weight:600;color:var(--green-light);}
.tr-type-val.bad{color:rgba(250,250,250,0.54);}
.tr-type-lbl{font-family:var(--mono);font-size:9px;font-weight:600;letter-spacing:0.1em;text-transform:uppercase;color:rgba(250,250,250,0.57);margin-top:4px;}
.tr-type-frac{font-family:var(--mono);font-size:10px;color:rgba(250,250,250,0.52);margin-top:2px;}
.tr-event-list{display:flex;flex-direction:column;gap:10px;margin-bottom:24px;}
.tr-event-card{background:var(--black-card);border:1px solid var(--border);border-radius:12px;overflow:hidden;}
.tr-event-head{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 18px;cursor:pointer;flex-wrap:wrap;}
.tr-event-head:hover{background:rgba(255,255,255,0.02);}
.tr-event-info{min-width:0;flex:1;}
.tr-event-name{font-size:14px;font-weight:600;color:rgba(250,250,250,0.9);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.tr-event-date{font-family:var(--mono);font-size:10px;color:rgba(250,250,250,0.56);margin-top:2px;}
.tr-event-summary{display:flex;align-items:center;gap:16px;flex-shrink:0;}
.tr-event-rate{font-family:var(--mono);font-size:12px;font-weight:500;color:rgba(250,250,250,0.45);text-align:right;}
.tr-event-rate.good{color:var(--green-light);}
.tr-event-rate.ok{color:var(--gold);}
.tr-event-rate.bad{color:rgba(250,250,250,0.57);}
.tr-event-rate-lbl{font-family:var(--mono);font-size:9px;color:rgba(250,250,250,0.51);text-transform:uppercase;letter-spacing:0.08em;margin-top:2px;text-align:right;}
.tr-event-units{font-family:var(--mono);font-size:15px;font-weight:700;text-align:right;min-width:54px;}
.tr-event-units.pos{color:var(--green-light);}
.tr-event-units.neg{color:var(--red);}
.tr-event-toggle{font-family:var(--mono);font-size:11px;color:rgba(250,250,250,0.52);transition:transform .15s;}
.tr-detail{display:none;border-top:1px solid var(--border);}
.tr-detail.show{display:block;}
.tr-detail-meta{padding:10px 18px 2px;font-size:12px;color:rgba(250,250,250,0.45);display:flex;justify-content:space-between;flex-wrap:wrap;gap:6px 16px;}
.tr-detail-meta strong{color:rgba(250,250,250,0.85);font-weight:600;}
.tr-pick-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 18px;border-bottom:1px solid rgba(255,255,255,0.04);}
.tr-pick-row:last-child{border-bottom:none;}
.tr-pick-info{min-width:0;}
.tr-pick-player{font-size:13px;color:rgba(250,250,250,0.85);}
.tr-pick-bet{font-family:var(--mono);font-size:10px;color:rgba(250,250,250,0.6);margin-top:2px;}
.tr-pick-note{font-size:10px;color:rgba(250,250,250,0.54);margin-top:2px;line-height:1.5;max-width:340px;}
.tr-pick-result{flex-shrink:0;text-align:right;}
.tr-pick-units{font-family:var(--mono);font-size:11px;margin-top:4px;}
.tr-pick-units.pos{color:var(--green-light);}
.tr-pick-units.neg{color:var(--red);}
.tr-event-notes{font-size:11px;color:rgba(250,250,250,0.56);line-height:1.6;padding:10px 18px 14px;}
.tr-grid-row{display:grid;grid-template-columns:1fr 1fr;}
.tr-grid-col{border-left:1px solid rgba(255,255,255,0.04);}
.tr-grid-col:first-child{border-left:none;}
.tr-grid-lbl{padding:10px 16px 6px;font-family:var(--mono);font-size:9px;font-weight:600;letter-spacing:0.12em;text-transform:uppercase;color:rgba(250,250,250,0.52);}
.tr-grid-pick{padding:5px 16px;display:flex;justify-content:space-between;align-items:center;font-size:12px;}
.tr-grid-pick .name{color:rgba(250,250,250,0.64);}
.tr-grid-pick.hit .name{color:rgba(250,250,250,0.85);}
.tr-grid-pick .fin{font-family:var(--mono);font-size:11px;font-weight:600;color:rgba(250,250,250,0.57);}
.tr-grid-pick.hit .fin{color:var(--green-light);}
/* ── DFS ── */
/* ── DFS ──────────────────────────────────────────────────────────────────────
   Same table shell as Course Fit and Matchups. Columns come from --dfs-cols, set
   on the wrap by the renderer, because which columns exist depends on the data:
   no ownership on FanDuel, no fit at an unvalidated venue. */
.dfs-table-wrap{--dfs-cols:24px minmax(0,1.75fr) 92px minmax(0,1fr) 86px 80px 88px;
  border:1px solid var(--border);border-radius:14px;overflow:hidden;min-width:600px;
  background:linear-gradient(168deg, rgba(26,24,21,0.82) 0%, rgba(20,19,17,0.68) 100%);
  -webkit-backdrop-filter:blur(14px) saturate(115%);backdrop-filter:blur(14px) saturate(115%);
  box-shadow:0 1px 0 rgba(255,255,255,0.045) inset, 0 20px 46px -30px rgba(0,0,0,0.92);}
.dfs-table-head,.dfs-row{display:grid;grid-template-columns:var(--dfs-cols);align-items:center;
  gap:13px;padding:0 18px;}
.dfs-table-head{height:52px;border-bottom:1px solid rgba(255,255,255,0.07);
  background:rgba(255,255,255,0.018);}
.dfs-th{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:0.1em;
  text-transform:uppercase;color:rgba(250,250,250,0.72);display:flex;align-items:center;gap:6px;
  min-width:0;}
.dfs-th.right{justify-content:flex-end;text-align:right;}
.dfs-th>.cf-hbtn{min-width:0;}
.dfs-th-lbl{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.dfs-row{padding-top:12px;padding-bottom:12px;border-bottom:1px solid rgba(255,255,255,0.04);
  cursor:pointer;transition:background .15s;}
.dfs-table-wrap>div:last-child{border-bottom:none;}
.dfs-row:hover{background:rgba(255,255,255,0.028);}
.dfs-row.in-lineup{background:rgba(91,191,133,0.09);}
.dfs-row.in-lineup:hover{background:rgba(91,191,133,0.13);}
.dfs-row.over-budget{opacity:0.4;cursor:not-allowed;}

.dfs-sel-circle{width:17px;height:17px;border-radius:50%;border:1.5px solid rgba(255,255,255,0.2);
  display:flex;align-items:center;justify-content:center;transition:all .15s;flex-shrink:0;}
.dfs-row:hover .dfs-sel-circle{border-color:rgba(91,191,133,0.6);}
.dfs-row.in-lineup .dfs-sel-circle{border-color:var(--green-light);background:var(--green-light);}
.dfs-sel-check{width:7px;height:7px;border-radius:50%;background:var(--black);opacity:0;}
.dfs-row.in-lineup .dfs-sel-check{opacity:1;}

.dfs-player{font-size:13.5px;font-weight:600;color:rgba(245,244,240,0.92);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.dfs-tee{font-family:var(--mono);font-size:9.5px;letter-spacing:0.06em;
  color:rgba(250,250,250,0.36);margin-top:2px;}
.dfs-salary{font-family:var(--mono);font-size:13px;color:rgba(245,244,240,0.8);text-align:right;}
.dfs-pts{font-family:var(--mono);font-size:14px;font-weight:600;color:var(--white);text-align:right;}
.dfs-pts-sub{font-family:var(--mono);font-size:9px;color:rgba(250,250,250,0.34);text-align:right;
  margin-top:2px;white-space:nowrap;}
.dfs-bar{height:2px;background:rgba(255,255,255,0.07);border-radius:1px;margin-top:5px;
  overflow:hidden;width:64px;margin-left:auto;}
.dfs-bar-fill{height:100%;background:linear-gradient(90deg,rgba(91,191,133,0.5),var(--green-light));
  border-radius:1px;}
.dfs-val{font-family:var(--mono);font-size:13px;color:rgba(250,250,250,0.62);text-align:right;}
.dfs-val.green{color:var(--green-light);}
.dfs-val.gold{color:var(--gold);}
.dfs-val.dim{color:rgba(250,250,250,0.34);}
.dfs-empty{padding:52px 20px;text-align:center;font-size:13px;color:rgba(250,250,250,0.5);
  line-height:1.7;}

/* ── Where the value is (replaced the AM/PM wave stacks) ──────────────────── */
.dfs-tiers{margin-bottom:14px;}
.dfs-tiers-head{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:0.13em;
  text-transform:uppercase;color:rgba(250,250,250,0.46);margin-bottom:10px;}
.dfs-tiers-wrap{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;}
.dfs-tier{border:1px solid var(--border);border-radius:13px;padding:14px 16px;
  background:linear-gradient(168deg, rgba(26,24,21,0.7) 0%, rgba(20,19,17,0.55) 100%);
  box-shadow:0 1px 0 rgba(255,255,255,0.035) inset;}
.dfs-tier-top{display:flex;align-items:baseline;justify-content:space-between;gap:8px;}
.dfs-tier-label{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:0.11em;
  text-transform:uppercase;color:var(--gold);}
.dfs-tier-range{font-family:var(--mono);font-size:11px;color:rgba(250,250,250,0.55);}
.dfs-tier-count{font-family:var(--body);font-size:11.5px;color:rgba(250,250,250,0.44);
  margin-top:3px;}
.dfs-tier-best{margin-top:11px;padding-top:10px;border-top:1px solid rgba(255,255,255,0.06);
  display:grid;grid-template-columns:1fr auto;gap:2px 10px;align-items:baseline;}
.dfs-tier-best-lbl{grid-column:1/-1;font-family:var(--mono);font-size:8.5px;font-weight:700;
  letter-spacing:0.11em;text-transform:uppercase;color:rgba(250,250,250,0.34);}
.dfs-tier-best-name{font-size:13px;font-weight:600;color:rgba(245,244,240,0.9);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.dfs-tier-best-val{font-family:var(--mono);font-size:14px;font-weight:600;color:var(--green-light);}
.dfs-tier-own{margin-top:8px;font-family:var(--mono);font-size:10px;
  color:rgba(250,250,250,0.38);}
.dfs-tier-own strong{color:rgba(250,250,250,0.62);font-weight:600;}

/* ── Board + rail ────────────────────────────────────────────────────────── */
.dfs-layout{display:grid;grid-template-columns:minmax(0,1fr) 264px;gap:16px;align-items:start;}
.dfs-board{min-width:0;}
/* Filters, then the explanation of the selected one, then search and freshness pushed right. */
.dfs-tools{display:flex;align-items:center;gap:14px;margin-bottom:12px;flex-wrap:wrap;}
.dfs-tools .mu-search-wrap{flex:0 1 220px;margin-left:auto;}
.dfs-mode-n{font-size:9px;opacity:0.55;margin-left:3px;}
/* Cash, GPP and Value are contest jargon. Rather than four tooltips nobody opens, the selected
   one explains itself in a line under the row. */
.dfs-mode-note{flex:1 1 260px;min-width:0;font-family:var(--body);font-size:11.5px;
  line-height:1.5;color:rgba(250,250,250,0.44);margin:0;}
.dfs-mode-note strong{color:rgba(245,244,240,0.72);font-weight:600;}
.dfs-updated{font-family:var(--mono);font-size:10px;letter-spacing:0.08em;
  color:rgba(250,250,250,0.36);white-space:nowrap;}

.dfs-rail{position:sticky;top:88px;align-self:start;}
.dfs-rail-inner{border:1px solid var(--border);border-radius:14px;padding:16px;
  background:linear-gradient(168deg, rgba(26,24,21,0.86) 0%, rgba(20,19,17,0.72) 100%);
  box-shadow:0 1px 0 rgba(255,255,255,0.045) inset, 0 20px 46px -30px rgba(0,0,0,0.92);}
.dfs-rail-head{display:flex;align-items:baseline;justify-content:space-between;gap:8px;
  margin-bottom:13px;}
.dfs-rail-title{font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:0.13em;
  text-transform:uppercase;color:rgba(250,250,250,0.66);}
.dfs-rail-count{font-family:var(--mono);font-size:11px;color:rgba(250,250,250,0.44);}

.dfs-cap{margin-bottom:14px;}
.dfs-cap-row{display:flex;align-items:baseline;gap:6px;margin-bottom:7px;}
.dfs-cap-fig{font-family:var(--mono);font-size:20px;font-weight:600;letter-spacing:-0.01em;
  color:var(--white);}
.dfs-cap-fig.tight{color:var(--gold);}
.dfs-cap-fig.over{color:var(--red,#D9534F);}
.dfs-cap-lbl{font-family:var(--mono);font-size:10px;letter-spacing:0.1em;text-transform:uppercase;
  color:rgba(250,250,250,0.38);}
.dfs-budget-bar{height:4px;background:rgba(255,255,255,0.07);border-radius:2px;overflow:hidden;}
.dfs-budget-fill{height:100%;border-radius:2px;transition:width .25s var(--ease-out,ease);}
.dfs-budget-fill.ok{background:linear-gradient(90deg,rgba(91,191,133,0.55),var(--green-light));}
.dfs-budget-fill.tight{background:linear-gradient(90deg,rgba(201,168,76,0.55),var(--gold));}
.dfs-budget-fill.over{background:var(--red,#D9534F);}
.dfs-cap-sub{font-family:var(--mono);font-size:9.5px;letter-spacing:0.05em;
  color:rgba(250,250,250,0.38);margin-top:6px;}

/* One slot per row. Six slots in a 3-wide grid could not fit a name, a salary and a score in a
   264px rail, so every filled card overflowed. */
.dfs-slots-grid{display:flex;flex-direction:column;gap:5px;}
.dfs-slot{display:grid;grid-template-columns:14px minmax(0,1fr) auto 18px;align-items:center;
  gap:8px;padding:7px 9px;border-radius:9px;background:rgba(255,255,255,0.022);
  border:1px dashed rgba(255,255,255,0.08);min-height:42px;}
.dfs-slot.filled{background:rgba(91,191,133,0.07);border:1px solid rgba(91,191,133,0.2);
  border-style:solid;}
.dfs-slot-num{font-family:var(--mono);font-size:9.5px;color:rgba(250,250,250,0.3);}
.dfs-slot-body{min-width:0;}
.dfs-slot-name{font-size:12.5px;font-weight:600;color:rgba(245,244,240,0.92);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.dfs-slot-meta{font-family:var(--mono);font-size:9.5px;color:rgba(250,250,250,0.42);margin-top:2px;}
.dfs-slot-dot{opacity:0.4;}
.dfs-slot-empty{font-family:var(--mono);font-size:10px;letter-spacing:0.09em;text-transform:uppercase;
  color:rgba(250,250,250,0.24);}
.dfs-slot-pts{font-family:var(--mono);font-size:13px;font-weight:600;color:var(--green-light);}
.dfs-slot-rm{width:19px;height:19px;border:0;border-radius:5px;background:none;
  color:rgba(250,250,250,0.32);font-size:14px;line-height:1;cursor:pointer;
  display:flex;align-items:center;justify-content:center;transition:all .14s;}
.dfs-slot-rm:hover{color:var(--white);background:rgba(255,255,255,0.09);}

.dfs-rail-totals{margin-top:13px;padding-top:12px;border-top:1px solid rgba(255,255,255,0.07);}
.dfs-rail-tot{display:flex;align-items:baseline;justify-content:space-between;gap:8px;}
.dfs-rail-tot-lbl{font-family:var(--mono);font-size:10px;letter-spacing:0.1em;text-transform:uppercase;
  color:rgba(250,250,250,0.4);}
.dfs-rail-tot strong{font-family:var(--mono);font-size:19px;font-weight:600;color:var(--white);}
.dfs-rail-eff{font-family:var(--mono);font-size:9.5px;letter-spacing:0.05em;
  color:rgba(250,250,250,0.38);margin-top:4px;}

.dfs-rail-actions{display:grid;grid-template-columns:1fr auto auto;gap:6px;margin-top:13px;}
.dfs-act-btn{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:0.09em;
  text-transform:uppercase;padding:9px 11px;border-radius:8px;cursor:pointer;
  border:1px solid rgba(255,255,255,0.11);background:rgba(255,255,255,0.03);
  color:rgba(250,250,250,0.72);transition:all .15s;}
.dfs-act-btn:hover:not(:disabled){color:var(--white);background:rgba(255,255,255,0.07);
  border-color:rgba(255,255,255,0.2);}
.dfs-act-btn.primary{background:rgba(91,191,133,0.14);border-color:rgba(91,191,133,0.34);
  color:var(--green-light);}
.dfs-act-btn.primary:hover:not(:disabled){background:rgba(91,191,133,0.22);}
.dfs-act-btn:disabled{opacity:0.34;cursor:not-allowed;}
.dfs-act-btn:focus-visible{outline:2px solid var(--green-light);outline-offset:2px;}
.dfs-rail-hint{font-family:var(--body);font-size:11px;line-height:1.55;
  color:rgba(250,250,250,0.42);margin:11px 0 0;}
/* ── RESPONSIVE ── */
@media(max-width:900px){
  nav{padding:0 20px;}
  .nav-links{display:none !important;}
  .hamburger{display:flex !important;}
  .tourney-head{padding:16px 16px;}
  .tourney-inner{flex-direction:column;align-items:flex-start;gap:8px;}
  .weights-strip{padding:10px 16px;}
  .weights-inner{gap:14px;}
  .pro-tabs{padding:0 16px;overflow-x:auto;}
  .pro-tab{padding:11px 14px;font-size:12px;white-space:nowrap;}
  .pro-subtabs{padding:12px 16px 0;overflow-x:auto;}
  .tab-content{padding:20px 12px 60px;}
  .pro-disclaimer{padding:0 16px 24px;}

  /* Overview — stack hero meta + quick-glance cards */
  .ov-hero-meta{gap:8px;}
  .ov-quick-grid{grid-template-columns:1fr;gap:16px;}
  .picks-card-wrap{padding:16px;}
  .ov-record-strip{gap:16px 24px;padding:14px 16px;}
  .ov-record-cta{margin-left:0;width:100%;}

  /* Remove fixed min-widths that cause all tables to overflow the viewport */
  .cf-table-wrap,.vf-table,.live-table-wrap,.mu-table-wrap,.dfs-table-wrap{min-width:0;}

  /* Course Fit — stacked row-cards on mobile (all SG bars + odds visible) */
  .value-badge{font-size:8px;padding:2px 6px;white-space:nowrap;}
  .player-drawer{width:100vw;}
  .drawer-content{padding:56px 20px 40px;}

  /* Value Finder, Matchups, DFS — shared stacked mobile cards */
  .vf-head,.mu-table-head,.mu3-table-head,.dfs-table-head{display:none;}
  .dfs-layout{grid-template-columns:1fr;}
  .dfs-rail{position:static;order:-1;margin-bottom:16px;}
  .dfs-tiers-wrap{grid-template-columns:1fr;}
  .dfs-updated{margin-left:0;width:100%;}
  .vf-row{row-gap:10px;padding:14px;background:var(--black-card);border:1px solid var(--border);border-radius:12px;margin-bottom:10px;}
  .vf-row>div[data-label]::before,.mu-row>div[data-label]::before,.mu3-row>div[data-label]::before,.dfs-row>div[data-label]::before{content:attr(data-label);display:block;font-family:var(--mono);font-size:8px;letter-spacing:.12em;text-transform:uppercase;color:rgba(250,250,250,0.54);margin-bottom:3px;}

  /* Value Finder — player row, then odds/edge/prob, then fit/book/signal */
  .vf-row{grid-template-columns:repeat(3,1fr);grid-template-areas:"player player player" "odds edge prob" "fit book signal";}
  .vf-row>*:nth-child(1){grid-area:player;}
  .vf-row>*:nth-child(2){grid-area:odds;}
  .vf-row>*:nth-child(3){grid-area:edge;}
  .vf-row>*:nth-child(4){grid-area:prob;}
  .vf-row>*:nth-child(5){grid-area:fit;}
  .vf-row>*:nth-child(6){grid-area:book;}
  .vf-row>*:nth-child(7){grid-area:signal;}
  .vf-cell{text-align:left;}
  .vf-player{font-size:13px;}
  .vf-toolbar{flex-direction:column;align-items:flex-start;gap:10px;}

  /* Player Compare (drawer) */
  .h2h-header{grid-template-columns:1fr 60px 1fr;}
  .h2h-pname{font-size:16px;}
  .h2h-cat-row{gap:8px;}
  .drawer-compare-row{flex-direction:column;}

  /* Matchups — player names on top, odds/book/edge below, signal full-width.
     Mapped BY CLASS: an nth-child map breaks the moment a cell is added or reordered. */
  .mu-c-pa{grid-area:pa;}
  .mu-c-vs{grid-area:vs;align-self:center;}
  .mu-c-pb{grid-area:pb;}
  .mu-c-pc{grid-area:pc;}
  .mu-c-edge{grid-area:edge;}
  .mu-c-gap{grid-area:gap;}
  .mu-row .mu-edge,.mu3-row .mu-edge{text-align:left;}
  .mu-row .mu-gap,.mu3-row .mu-gap{text-align:right;}
  .mu-row .mu-c-gap .mu-cell-name,.mu3-row .mu-c-gap .mu-cell-name{text-align:right;}
  .mu-pcell>div[data-label]::before{margin-bottom:3px;}
  .mu-player{white-space:normal;}
  .mu-search-wrap{flex:1 1 100%;}

  /* Track Record — stat grids + event cards on mobile */
  .acc-summary,.tr-type-grid{grid-template-columns:1fr 1fr;}
  .tr-event-head{padding:12px 14px;}
  .tr-event-summary{gap:10px;}
  .tr-grid-row{grid-template-columns:1fr;}
  .tr-grid-col:nth-child(2){border-left:none;border-top:1px solid rgba(255,255,255,0.04);}

  /* DFS mobile */
  .dfs-slots-grid{grid-template-columns:1fr 1fr;}
  .dfs-c-sel{display:none;}
  .dfs-c-player{grid-area:player;}
  .dfs-c-salary{grid-area:salary;}
  .dfs-c-pts{grid-area:pts;}
  .dfs-c-perk{grid-area:perk;}
  .dfs-c-own{grid-area:own;}
  .dfs-c-lev{grid-area:leverage;}
  .dfs-c-ceil{grid-area:ceil;}
  .dfs-c-fit{grid-area:fit;}
  /* Numbers go back to the left once each cell is its own labelled block. */
  .dfs-row .dfs-salary,.dfs-row .dfs-pts,.dfs-row .dfs-pts-sub,.dfs-row .dfs-val{text-align:left;}
  .dfs-act-btn{flex:1;}

  /* Keep badge + tourney on one line */
  .picks-card-header,.bb-header{flex-wrap:nowrap;}
  .picks-card-badge,.bb-badge{white-space:nowrap;flex-shrink:0;}
  .picks-card-tourney,.bb-sub{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;flex:1;}
  .card-chevron{flex-shrink:0;}

  /* Picks Card — horizontal scroll snap carousel */
  .picks-card-wrap{padding:16px 16px 12px;}
  .picks-grid{display:flex;flex-wrap:nowrap;overflow-x:auto;overflow-y:visible;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;padding-bottom:4px;scrollbar-width:none;}
  .picks-grid::-webkit-scrollbar{display:none;}
  .pick-card{flex:0 0 82%;min-width:0;scroll-snap-align:start;}

  /* Live Tab — 5 cols: Pos, Player, Total, Win%, Top10% (Thru is desktop-only) */
  .live-table-head,.live-row{grid-template-columns:34px 1fr 52px 54px 54px !important;padding-left:10px;padding-right:10px;}
  .live-table-head .live-th:nth-child(4),
  .live-table-head .live-th:nth-child(5),
  .live-table-head .live-th:nth-child(6),
  .live-table-head .live-th:nth-child(7),
  .live-table-head .live-th:nth-child(8),
  .live-table-head .live-th:nth-child(9),
  .live-table-head .live-th:nth-child(11),
  .live-table-head .live-th:nth-child(13),
  .live-row>div:nth-child(4),
  .live-row>div:nth-child(5),
  .live-row>div:nth-child(6),
  .live-row>div:nth-child(7),
  .live-row>div:nth-child(8),
  .live-row>div:nth-child(9),
  .live-row>div:nth-child(11),
  .live-row>div:nth-child(13){display:none !important;}
  .live-note{display:none;}

  /* Bottom nav live indicator dot */
  .bnav-item .psb-live-indicator{width:18px;height:18px;border-radius:50%;background:var(--green-light);flex-shrink:0;box-shadow:0 0 0 2px rgba(91,191,133,0.2);animation:livepulse 2s infinite;}
}

/* ═══════════════════════════════════════════════
   PRO LAYOUT — SIDEBAR + MAIN
   ═══════════════════════════════════════════════ */
body{ --nav-h:64px; }
#proApp{ padding-top:var(--nav-h); }

/* Hide the old top nav strips from inside the app — sidebar replaces them */
.tourney-head,.weights-strip,.pro-tabs,.pro-subtabs{ display:none !important; }

.pro-layout{
  display:grid;
  grid-template-columns:var(--sidebar-w) 1fr;
  min-height:calc(100vh - var(--nav-h));
}

/* ── SIDEBAR ── */
.pro-sidebar{
  position:sticky;
  top:var(--nav-h);
  height:calc(100vh - var(--nav-h));
  overflow-y:auto;
  overflow-x:hidden;
  display:flex;
  flex-direction:column;
  border-right:1px solid rgba(255,255,255,0.06);
  background:var(--black-mid);
  scrollbar-width:none;
  flex-shrink:0;
}
.pro-sidebar::-webkit-scrollbar{ display:none; }

.psb-brand{
  display:flex;
  align-items:center;
  gap:10px;
  padding:14px 16px 10px;
  border-bottom:1px solid rgba(255,255,255,0.05);
  flex-shrink:0;
}
.psb-brand svg{ width:20px;height:20px;color:var(--white);flex-shrink:0; }
.psb-pro-badge{
  font-family:var(--mono);
  font-size:9px;
  font-weight:700;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--gold);
  background:rgba(201,168,76,0.1);
  border:1px solid rgba(201,168,76,0.22);
  padding:3px 8px;
  border-radius:4px;
}

/* Tournament context block */
.psb-tourney{
  padding:10px 16px 12px;
  border-bottom:1px solid rgba(255,255,255,0.04);
  flex-shrink:0;
}
.psb-tourney-label{
  font-family:var(--mono);
  font-size:8px;
  font-weight:600;
  letter-spacing:0.16em;
  text-transform:uppercase;
  color:var(--gold);
  margin-bottom:4px;
  opacity:.8;
}
.psb-tourney-name{
  font-family:var(--display);
  font-size:15px;
  font-weight:500;
  font-style:italic;
  color:var(--white);
  line-height:1.2;
  margin-bottom:8px;
}
.psb-weights{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:4px 10px;
}
.psb-w-pill{
  display:inline-flex;
  align-items:center;
  gap:4px;
}
.psb-w-dot{
  width:5px;
  height:5px;
  border-radius:50%;
  flex-shrink:0;
}
.psb-w-text{
  font-family:var(--mono);
  font-size:9px;
  color:rgba(245,244,240,0.45);
  letter-spacing:0.03em;
}/* psb-chips removed — chips section no longer shown in sidebar */
.psb-chip{
  font-family:var(--mono);
  font-size:8px;
  font-weight:600;
  letter-spacing:0.1em;
  text-transform:uppercase;
  padding:3px 8px;
  border-radius:4px;
}
.psb-chip-gold{ color:var(--gold);background:rgba(201,168,76,0.1);border:1px solid rgba(201,168,76,0.2); }
.psb-chip-blue{ color:var(--blue-mid);background:rgba(90,143,168,0.08);border:1px solid rgba(90,143,168,0.18); }
.psb-chip-green{ color:var(--green-light);background:rgba(91,191,133,0.08);border:1px solid rgba(91,191,133,0.18); }

/* Nav items */
.psb-nav{
  flex:0 0 auto;
  padding:6px 8px;
  display:flex;
  flex-direction:column;
  gap:1px;
}
.psb-nav-section{
  font-family:var(--mono);
  font-size:8px;
  font-weight:700;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:rgba(245,244,240,0.52);
  padding:8px 8px 2px;
}
.psb-nav-item{
  display:flex;
  align-items:center;
  gap:10px;
  padding:7px 10px;
  border-radius:7px;
  border:none;
  background:none;
  color:rgba(245,244,240,0.45);
  font-family:var(--body);
  font-size:13px;
  font-weight:500;
  cursor:pointer;
  transition:all 0.15s var(--ease-out);
  width:100%;
  text-align:left;
  position:relative;
}
.psb-nav-item svg{ width:15px;height:15px;flex-shrink:0;opacity:.7; }
.psb-nav-item .psb-live-indicator{
  width:6px;height:6px;border-radius:50%;
  background:var(--green-light);
  flex-shrink:0;
  box-shadow:0 0 0 2px rgba(91,191,133,0.2);
  animation:livepulse 2s infinite;
}
.psb-nav-item:hover{
  background:rgba(255,255,255,0.05);
  color:var(--white);
}
.psb-nav-item.active{
  background:rgba(201,168,76,0.08);
  color:var(--white);
  font-weight:600;
}
.psb-nav-item.active::before{
  content:'';
  position:absolute;
  left:0;top:20%;bottom:20%;
  width:2.5px;
  background:var(--gold);
  border-radius:0 2px 2px 0;
}
.psb-nav-item.active svg{ opacity:1; }

/* Sidebar footer — account */
.psb-footer{
  padding:10px 16px;
  border-top:1px solid rgba(255,255,255,0.05);
  margin-top:auto;
  flex-shrink:0;
}
.psb-user-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-bottom:6px;
}
.psb-user-email{
  font-family:var(--mono);
  font-size:10px;
  color:rgba(245,244,240,0.58);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  min-width:0;
  flex:1;
}
.psb-trial-chip{
  font-family:var(--mono);
  font-size:9px;
  font-weight:700;
  letter-spacing:0.1em;
  text-transform:uppercase;
  background:rgba(91,191,133,0.1);
  color:var(--green-light);
  border:1px solid rgba(91,191,133,0.25);
  padding:2px 8px;
  border-radius:3px;
  white-space:nowrap;
  flex-shrink:0;
}
.psb-partner-chip{
  font-family:var(--mono);
  font-size:9px;
  font-weight:700;
  letter-spacing:0.1em;
  text-transform:uppercase;
  background:rgba(201,168,76,0.08);
  color:var(--gold);
  border:1px solid rgba(201,168,76,0.2);
  padding:2px 8px;
  border-radius:3px;
  white-space:nowrap;
  flex-shrink:0;
}
.psb-signout{
  background:none;
  border:1px solid rgba(255,255,255,0.09);
  border-radius:5px;
  padding:5px 12px;
  font-family:var(--mono);
  font-size:10px;
  font-weight:500;
  color:rgba(245,244,240,0.58);
  cursor:pointer;
  transition:all 0.15s;
  width:100%;
  letter-spacing:0.05em;
}
.psb-signout:hover{
  border-color:rgba(255,255,255,0.22);
  color:rgba(245,244,240,0.7);
}

/* ── PRO MAIN CONTENT ── */
.pro-main{
  min-height:calc(100vh - var(--nav-h));
  overflow-x:hidden;
}
.pro-main .tab-content{
  display:none;
  max-width:1200px;
  margin:0 auto;
  padding:16px 40px 72px;
}
.pro-main .tab-content.active{ display:block; }

/* ── SECTION HEADINGS (new pattern inside tabs) ── */
.pro-tab-title{
  font-family:var(--display);
  font-size:clamp(22px,2.5vw,34px);
  font-weight:500;
  font-style:italic;
  letter-spacing:-0.01em;
  color:var(--white);
  line-height:1.1;
  margin-bottom:4px;
}
.pro-tab-sub{
  font-family:var(--mono);
  font-size:10px;
  color:rgba(245,244,240,0.57);
  letter-spacing:0.08em;
  margin-bottom:24px;
}

/* ── PLAYER AVATAR (used in table rows) ── */
.p-avatar{
  width:36px;height:36px;
  border-radius:50%;
  overflow:hidden;
  background:rgba(255,255,255,0.05);
  border:1px solid rgba(255,255,255,0.08);
  flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
}
.p-avatar img{ width:100%;height:100%;object-fit:cover; }
.p-avatar-init{
  font-family:var(--body);
  font-size:11px;
  font-weight:600;
  color:rgba(245,244,240,0.64);
  letter-spacing:0;
}
/* ── BOTTOM NAV (mobile only) ── */
.pro-bnav{
  display:none;
  position:fixed;
  bottom:0;left:0;right:0;
  z-index:210;
  height:58px;
  background:rgba(13,12,10,0.96);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  border-top:1px solid rgba(255,255,255,0.07);
  align-items:center;
  justify-content:space-around;
  padding:0 8px;
}
.bnav-item{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:3px;
  padding:6px 10px;
  border:none;
  background:none;
  color:rgba(245,244,240,0.64);
  cursor:pointer;
  border-radius:8px;
  transition:color 0.15s;
  font-family:var(--body);
  min-width:52px;
}
.bnav-item svg{ width:18px;height:18px; }
.bnav-item span{ font-size:10px;font-weight:500;letter-spacing:0.02em; }
.bnav-item.active{ color:var(--gold); }
.bnav-more-drawer{
  display:none;
  position:fixed;
  bottom:58px;left:0;right:0;
  background:rgba(19,18,16,0.98);
  backdrop-filter:blur(20px);
  border-top:1px solid rgba(255,255,255,0.07);
  z-index:209;
  padding:8px 16px 12px;
  flex-direction:column;
  gap:2px;
}
.bnav-more-drawer.open{ display:flex; }
.bnav-more-item{
  display:flex;align-items:center;gap:12px;
  padding:12px 8px;
  border:none;background:none;
  color:rgba(245,244,240,0.7);
  font-family:var(--body);font-size:14px;font-weight:500;
  cursor:pointer;border-radius:8px;width:100%;text-align:left;
  transition:background 0.12s;
}
.bnav-more-item:hover{ background:rgba(255,255,255,0.05); }
.bnav-more-item svg{ width:16px;height:16px;color:rgba(245,244,240,0.64); }

/* ── IMPROVED DARK BODY/CARDS ── */
body{ background:#0C0B09; }
.dl-card{ background:#191714; border-color:rgba(255,255,255,0.07); }
.vf-table{ background:#191714; }
.live-table-wrap{ background:#191714; }
.pick-card{ background:#201E1A; }
.picks-card-wrap{ background:#191714; }
/* ── MOBILE LAYOUT (sidebar hidden, bottom nav shown) ── */
@media(max-width:900px){
  .pro-layout{ grid-template-columns:1fr; }
  .pro-sidebar{ display:none !important; }
  .pro-bnav{ display:flex; }
  .pro-main .tab-content{ padding:20px 14px 80px; }
  .pro-main .tab-content.active{ display:block; }
  .pro-disclaimer{ padding:0 14px 24px; }
}

/* A hardcoded 8-column template used to sit here with !important, left from an earlier version
   of the Field table. It silently overrode --cf-cols on EVERY table built on this system, so the
   widths each renderer computes were dead code on desktop — Form Trends was drawing its
   six-event timeline into the 76px slot meant for a Field score column. The template a renderer
   emits is authoritative now. Do not reintroduce a global grid-template-columns here.
   (It also hid the avatar header on mobile, which is moot: .cf-table-head is display:none there.) */

/* ── SECTION HEADER PATTERN (each tab) ── */
.sec-header{
  display:flex; align-items:flex-end; justify-content:space-between;
  margin-bottom:24px; gap:16px; flex-wrap:wrap;
  border-bottom:1px solid rgba(255,255,255,0.06); padding-bottom:20px;
}
.sec-header-left{ min-width:0; }
.sec-title{
  font-family:var(--display); font-size:clamp(24px,3vw,38px);
  font-weight:600; font-style:italic; letter-spacing:-0.01em;
  color:var(--white); line-height:1.1; margin:0 0 6px;
}
.sec-sub{
  font-family:var(--mono); font-size:10px; font-weight:400;
  letter-spacing:0.09em; text-transform:uppercase;
  color:rgba(245,244,240,0.57); margin:0;
}
.sec-header-actions{ display:flex; gap:8px; align-items:center; flex-shrink:0; }

/* ── SECTION HEADER SELECT (sort/filter dropdowns) ── */
.cf-sort-sel{
  appearance:none; -webkit-appearance:none;
  background-color:rgba(255,255,255,0.05);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' fill='none'%3E%3Cpath d='M1 1l4 4 4-4' stroke='rgba(245%2C244%2C240%2C0.35)' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 8px center;
  border:1px solid rgba(255,255,255,0.1); border-radius:6px;
  color:var(--white); font-family:var(--mono); font-size:10px;
  font-weight:600; letter-spacing:0.06em; text-transform:uppercase;
  padding:6px 28px 6px 10px; cursor:pointer; outline:none;
  transition:border-color .15s, background-color .15s;
}
.cf-sort-sel:hover{ border-color:rgba(255,255,255,0.2); }
.cf-sort-sel:focus{ border-color:var(--gold); }
.cf-sort-sel option{ background:#1A1916; color:#FAFAFA; }
/* ── WEATHER TAB ── */
.wx-current{ padding:20px 20px 12px; border-bottom:1px solid rgba(255,255,255,0.06); margin-bottom:20px; }
.wx-city{ font-family:var(--mono); font-size:10px; font-weight:700; letter-spacing:0.12em; text-transform:uppercase; color:rgba(245,244,240,0.56); margin-bottom:8px; }
.wx-now{ display:flex; align-items:baseline; gap:14px; flex-wrap:wrap; }
.wx-temp{ font-family:var(--mono); font-size:42px; font-weight:700; color:var(--white); line-height:1; }
.wx-cond{ font-size:15px; color:rgba(245,244,240,0.5); }
.wx-wind{ font-family:var(--mono); font-size:12px; color:rgba(245,244,240,0.57); }
.wx-section-label{ font-family:var(--mono); font-size:10px; font-weight:700; letter-spacing:0.12em; text-transform:uppercase; color:rgba(245,244,240,0.54); padding:0 20px 10px; }
.wx-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; padding:0 20px 24px; }
@media(max-width:600px){ .wx-grid{ grid-template-columns:repeat(2,1fr); } }
.wx-day-card{ background:rgba(255,255,255,0.04); border:1px solid rgba(255,255,255,0.07); border-radius:10px; padding:16px 14px; }
.wx-day-header{ display:flex; flex-direction:column; gap:2px; margin-bottom:12px; }
.wx-day-round{ font-family:var(--mono); font-size:9px; font-weight:700; letter-spacing:0.1em; text-transform:uppercase; color:var(--gold); }
.wx-day-name{ font-size:18px; font-weight:700; color:var(--white); line-height:1.1; }
.wx-day-date{ font-family:var(--mono); font-size:10px; color:rgba(245,244,240,0.58); margin-top:2px; }
.wx-day-cond{ font-size:12px; line-height:1.4; margin-bottom:10px; min-height:34px; }
.wx-day-temps{ font-family:var(--mono); font-size:16px; font-weight:700; color:var(--white); margin-bottom:5px; }
.wx-day-rain{ font-family:var(--mono); font-size:11px; color:#5A8FA8; }
.wx-day-wind{ font-family:var(--mono); font-size:11px; color:rgba(245,244,240,0.56); margin-top:3px; }
.wx-note{ font-family:var(--mono); font-size:11px; color:rgba(245,244,240,0.49); padding:4px 20px 20px; }/* vf-neg: dim color for negative-edge bets in Value Finder */
.vf-cell.vf-neg{ color:rgba(250,250,250,0.57); }
/* ── COURSE PROFILE CARD (overview) ── */
.cp-header{ display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; gap:12px; }
.cp-title{ font-family:var(--mono); font-size:9px; font-weight:700; letter-spacing:0.15em; text-transform:uppercase; color:var(--gold); opacity:.8; }
.cp-demand-label{
  font-family:var(--body); font-size:13.5px; font-weight:400; font-style:normal;
  color:rgba(245,244,240,0.62); line-height:1.6; margin-bottom:14px;
}
/* Course character. Scoring-to-par is the verdict and leads; the four components explain how
   it happens and are ordered by how far from ordinary each one is. */
.cc-thin{font-family:var(--body);font-size:12px;line-height:1.5;color:rgba(201,168,76,0.82);
  margin:-2px 0 12px;}
.cc-rows{display:flex;flex-direction:column;gap:10px;}
/* Every track is minmax(0,…) so a column can shrink below its intended width instead of
   pushing the row past the card edge. Fixed px tracks cannot shrink, which is why the rank
   text was running off the right-hand side. */
.cc-row{display:grid;grid-template-columns:minmax(0,74px) minmax(0,56px) minmax(0,152px) minmax(56px,1fr) minmax(0,188px);
  align-items:center;gap:12px;}
.cc-name{font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:0.12em;
  text-transform:uppercase;color:rgba(245,244,240,0.5);}
.cc-val{font-family:var(--mono);font-size:15px;font-weight:500;text-align:right;
  font-variant-numeric:tabular-nums;letter-spacing:-0.01em;}
/* Says what the number MEANS. "pp" was correct and unreadable. */
.cc-unit{font-family:var(--body);font-size:11.5px;color:rgba(245,244,240,0.46);line-height:1.3;}
.cc-up{color:var(--green-light);}
.cc-down{color:#5A8FA8;}
.cc-track{position:relative;height:6px;border-radius:3px;background:rgba(255,255,255,0.05);
  overflow:hidden;}
.cc-zero{position:absolute;left:50%;top:0;bottom:0;width:1px;background:rgba(255,255,255,0.16);}
.cc-bar{position:absolute;top:0;bottom:0;width:var(--w,0%);border-radius:2px;
  animation:ccGrow .7s cubic-bezier(.2,.75,.3,1) both;}
.cc-bar-up{left:50%;background:var(--green-light);transform-origin:left center;}
.cc-bar-down{right:50%;background:#5A8FA8;transform-origin:right center;}
@keyframes ccGrow{from{transform:scaleX(0);}to{transform:scaleX(1);}}
.cc-rank{font-family:var(--mono);font-size:10px;letter-spacing:0.04em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  color:rgba(245,244,240,0.46);white-space:nowrap;text-align:right;}
/* An ordinary metric is dimmed rather than dropped: still visible, no longer presented as a
   finding. Printing "34th of 91" at full weight invites a pattern that is not there. */
.cc-row-typ{opacity:0.46;}
.cc-typ-tag{font-family:var(--mono);font-size:8px;font-weight:700;letter-spacing:0.1em;
  text-transform:uppercase;color:rgba(245,244,240,0.42);border:1px solid rgba(255,255,255,0.1);
  border-radius:3px;padding:1px 4px;margin-right:7px;}
.cc-row-na{opacity:0.4;}
.cc-row-na .cc-val{color:rgba(245,244,240,0.4);}
.cc-foot{margin-top:14px;padding-top:12px;border-top:1px solid rgba(255,255,255,0.06);
  font-family:var(--body);font-size:11.5px;line-height:1.6;color:rgba(245,244,240,0.44);
  max-width:96ch;}
.cc-foot-links{display:block;margin-top:7px;}
.cc-foot a{color:var(--green-light);text-decoration:none;}
.cc-foot a:hover{text-decoration:underline;}
.cc-override{margin-top:11px;padding:7px 10px;border-radius:6px;
  background:rgba(201,168,76,0.07);border:1px solid rgba(201,168,76,0.18);
  font-family:var(--mono);font-size:9.5px;letter-spacing:0.03em;line-height:1.5;
  color:rgba(201,168,76,0.9);}
.cc-override code{font-family:var(--mono);color:var(--gold);}
.cp-demand-label code{font-family:var(--mono);font-size:12px;color:var(--gold);}
@media(max-width:760px){
  .cc-row{grid-template-columns:70px 54px 1fr;gap:6px 10px;}
  .cc-track{grid-column:1 / -1;}
  .cc-rank{grid-column:1 / -1;text-align:left;}
  .cc-verdict-num{font-size:32px;}
}
@media(prefers-reduced-motion:reduce){.cc-bar{animation:none;}}

/* ?sim=live banner. Deliberately loud: it marks a view where the staleness gate is bypassed. */
.sim-banner{display:flex;align-items:flex-start;gap:12px;margin:0 0 18px;padding:11px 16px;
  border-radius:10px;background:rgba(201,168,76,0.09);border:1px solid rgba(201,168,76,0.28);}
.sim-tag{flex:0 0 auto;font-family:var(--mono);font-size:8px;font-weight:700;letter-spacing:0.14em;
  text-transform:uppercase;color:#0A0A0A;background:var(--gold);border-radius:3px;padding:3px 7px;
  margin-top:1px;}
.sim-text{font-family:var(--body);font-size:12.5px;line-height:1.55;color:rgba(245,244,240,0.72);}
.sim-text b{color:var(--white);}
.sim-text code{font-family:var(--mono);font-size:11.5px;color:var(--gold);}

/* Movers: risers and fallers grouped, because a collapse is as informative as a charge and
   a single mixed list buried the direction. */
.ov-mv-head{display:flex;align-items:center;gap:8px;margin:12px 0 2px;}
.ov-mv-head:first-child{margin-top:0;}
.ov-mv-label{font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:0.11em;
  text-transform:uppercase;}
.ov-mv-hot .ov-mv-label{color:var(--green-light);}
.ov-mv-cold .ov-mv-label{color:#C96A5A;}
.ov-mv-rule{flex:1;height:1px;background:rgba(255,255,255,0.07);}
.cp-badge{
  font-family:var(--mono); font-size:8px; font-weight:700; letter-spacing:0.12em; text-transform:uppercase;
  padding:3px 9px; border-radius:3px; white-space:nowrap;
}
.cp-badge-matched{ color:var(--green-light); background:rgba(91,191,133,0.1); border:1px solid rgba(91,191,133,0.2); }
.cp-badge-default{ color:rgba(245,244,240,0.6); background:rgba(255,255,255,0.04); border:1px solid rgba(255,255,255,0.08); }
/* ── OVERVIEW QUICK ROWS with headshots ── */
.ov-quick-row{ display:flex; align-items:center; gap:10px; padding:8px 0; border-bottom:1px solid rgba(255,255,255,0.05); }
.ov-quick-row:last-child{ border-bottom:none; }
.ov-quick-row-info{ flex:1; min-width:0; }
/* ── FADE BOARD (Value Finder — Plays to Avoid) ── */
.fb-section{ margin-top:32px; }
.fb-header{
  display:flex; align-items:center; gap:10px; margin-bottom:12px;
  padding-bottom:12px; border-bottom:1px solid rgba(217,72,72,0.15);
}
.fb-title{ font-family:var(--mono); font-size:9px; font-weight:700; letter-spacing:0.14em; text-transform:uppercase; color:rgba(217,72,72,0.6); }
.fb-note{ font-family:var(--body); font-size:11px; color:rgba(245,244,240,0.57); }
.fb-row{
  display:grid; grid-template-columns:1fr 90px 90px 100px; gap:0;
  padding:10px 0; border-bottom:1px solid rgba(255,255,255,0.04);
  align-items:center;
}
.fb-player{ display:flex; align-items:center; gap:8px; }
.fb-player-name{ font-size:13px; font-weight:500; color:rgba(245,244,240,0.75); }
.fb-player-mkt{ font-family:var(--mono); font-size:9px; color:rgba(245,244,240,0.57); margin-top:2px; }
.fb-odds{ font-family:var(--mono); font-size:13px; font-weight:600; color:rgba(245,244,240,0.55); }
.fb-edge{ font-family:var(--mono); font-size:13px; font-weight:600; color:var(--red); }
.fb-why{ font-family:var(--body); font-size:11px; color:rgba(245,244,240,0.57); }
/* ── PLAYERS TAB ── */
.players-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:10px; }
.players-card{
  display:flex; align-items:center; gap:12px; background:var(--black-card);
  border:1px solid rgba(255,255,255,0.07); border-radius:10px; padding:12px 14px;
  cursor:pointer; transition:background .15s,border-color .15s,transform .12s;
}
.players-card:hover{ background:var(--black-card2); border-color:rgba(201,168,76,0.28); transform:translateY(-1px); }
.players-card-info{ flex:1; min-width:0; }
.players-card-name{ font-size:13px; font-weight:600; color:var(--white); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.players-card-country{ font-family:var(--mono); font-size:10px; color:rgba(245,244,240,0.58); margin-top:2px; }
.players-card-score{ font-family:var(--mono); font-size:16px; font-weight:700; flex-shrink:0; }
/* ── TOUR RANKINGS TAB ── */
.rnk-table-wrap{ background:var(--black-card); border:1px solid var(--border); border-radius:12px; overflow:hidden; }
.rnk-table-head{ display:grid; grid-template-columns:36px 1fr 48px 60px 60px 60px 60px 60px; gap:0; padding:10px 16px; border-bottom:1px solid rgba(255,255,255,0.06); }
.rnk-table-head span{ font-family:var(--mono); font-size:9px; font-weight:700; letter-spacing:0.1em; text-transform:uppercase; color:rgba(245,244,240,0.54); text-align:right; }
.rnk-table-head span:nth-child(2){ text-align:left; }
/* ── FORM TRENDS TAB ── */

.trend-badge-item{ font-family:var(--mono); font-size:9px; font-weight:700; padding:2px 5px; border-radius:4px; white-space:nowrap; }
.trend-badge-item.win  { color:var(--gold);       background:rgba(201,168,76,0.15);  }
.trend-badge-item.top5 { color:var(--green-light); background:rgba(91,191,133,0.15); }
.trend-badge-item.top10{ color:var(--green-light); background:rgba(91,191,133,0.09); }
.trend-badge-item.mc   { color:rgba(245,244,240,0.55); background:rgba(255,255,255,0.05); }
.trend-badge-item.cut  { color:rgba(245,244,240,0.54); background:rgba(255,255,255,0.03); }
.trend-badge-item.empty{ color:rgba(245,244,240,0.44);  background:rgba(255,255,255,0.015); border:1px dashed rgba(255,255,255,0.07); }

.trend-badge{ font-family:var(--mono); font-size:9px; font-weight:700; padding:3px 8px; border-radius:4px; letter-spacing:.04em; }
.trend-badge.peaking{ color:var(--gold);       background:rgba(201,168,76,0.2);   font-weight:800; }
.trend-badge.hot    { color:var(--green-light); background:rgba(91,191,133,0.12); }
.trend-badge.rising { color:var(--green-light); background:rgba(91,191,133,0.07); }
.trend-badge.fading { color:#E06B6B; background:rgba(224,107,107,0.1); }
.trend-badge.cold   { color:rgba(245,244,240,0.6); background:rgba(255,255,255,0.04); }
.trend-badge.stable { color:rgba(245,244,240,0.54); background:rgba(255,255,255,0.03); }
.trend-badge.flat   { color:rgba(245,244,240,0.57);  background:rgba(255,255,255,0.04); }

/* ── MODEL PROBABILITIES TAB ── */
.model-table-wrap{ background:var(--black-card); border:1px solid var(--border); border-radius:12px; overflow:hidden; }
.model-table-head{ display:grid; grid-template-columns:36px 1fr 70px 70px 70px 70px 56px; gap:0; padding:10px 16px; border-bottom:1px solid rgba(255,255,255,0.06); }
.model-table-head span{ font-family:var(--mono); font-size:9px; font-weight:700; letter-spacing:0.1em; text-transform:uppercase; color:rgba(245,244,240,0.54); text-align:right; }
.model-table-head span:nth-child(2){ text-align:left; }
.model-row{ display:grid; grid-template-columns:36px 1fr 70px 70px 70px 70px 56px; gap:0; padding:10px 16px; border-bottom:1px solid rgba(255,255,255,0.04); cursor:pointer; transition:background .12s; }
.model-row:last-child{ border-bottom:none; }
.model-row:hover{ background:rgba(255,255,255,0.03); }
.model-num{ font-family:var(--mono); font-size:11px; color:rgba(245,244,240,0.56); display:flex; align-items:center; }
.model-player{ display:flex; align-items:center; gap:10px; }
.model-name{ font-size:13px; font-weight:600; color:var(--white); }
.model-country{ font-family:var(--mono); font-size:9px; color:rgba(245,244,240,0.57); }
.model-prob{ font-family:var(--mono); font-size:12px; font-weight:600; text-align:right; display:flex; align-items:center; justify-content:flex-end; color:rgba(245,244,240,0.6); }
.model-prob.hi{ color:var(--green-light); }
.model-prob.sort-col{ color:var(--white); font-size:13px; }
.model-fit{ font-family:var(--mono); font-size:12px; font-weight:600; text-align:right; display:flex; align-items:center; justify-content:flex-end; }
/* ── SKILL DECOMPOSITION PANEL (player drawer) ── */

.decomp-cell-val.pos{ color:var(--green-light); }
.decomp-cell-val.neg{ color:#E06B6B; }
.decomp-cell-val.zero{ color:rgba(245,244,240,0.62); }

.decomp-cell-fill-pos{ height:100%; border-radius:2px; background:var(--green-light); }
.decomp-cell-fill-neg{ height:100%; border-radius:2px; background:#E06B6B; }
/* ── APPROACH SKILL PANEL (player drawer) ── */
.appr-panel{ padding:16px 0; }
.appr-title{ font-family:var(--mono); font-size:9px; font-weight:700; letter-spacing:0.14em; text-transform:uppercase; color:rgba(245,244,240,0.57); margin-bottom:14px; }

.appr-dist-fill-pos{ height:100%; border-radius:3px; background:var(--green-light); }
.appr-dist-fill-neg{ height:100%; border-radius:3px; background:var(--red); }

.appr-dist-val.pos{ color:var(--green-light); }
.appr-dist-val.neg{ color:var(--red); }
.appr-dist-val.zero{ color:rgba(245,244,240,0.57); }
.appr-course-badge{
  display:inline-flex; align-items:center; gap:5px; margin-bottom:16px;
  font-family:var(--mono); font-size:9px; letter-spacing:0.1em; text-transform:uppercase;
  color:var(--gold); background:rgba(201,168,76,0.08); border:1px solid rgba(201,168,76,0.15);
  padding:3px 10px; border-radius:4px;
}
/* ── PROFILE MATCH INDICATORS (CF rows) ── */
.pm-dots{ display:flex; gap:3px; align-items:center; margin-top:3px; }
.pm-dot{ width:6px; height:6px; border-radius:50%; }
.pm-dot-hi{ background:var(--green-light); }
.pm-dot-lo{ background:rgba(217,72,72,0.7); }
.pm-dot-mid{ background:rgba(245,244,240,0.2); }

/* ── MOBILE BOTTOM NAV BACKDROP ── */
.bnav-backdrop{
  display:none; position:fixed; inset:0; z-index:208;
  background:rgba(0,0,0,0.4);
}
.bnav-backdrop.open{ display:block; }

/* ── LIVE TAB EMPTY STATE ── */
.live-empty{
  text-align:center; padding:64px 24px;
  font-family:var(--mono); font-size:12px; letter-spacing:0.06em;
  color:rgba(245,244,240,0.54);
}
.live-empty svg{ display:block; margin:0 auto 16px; opacity:.2; }

/* ── PICK CARD RESULT BADGES ── */
.pick-result-win{ color:var(--green-light); font-weight:700; }
.pick-result-loss{ color:var(--red); }

/* ── OV QUICK GRID improvements ── */
/* Two cards since the DL Score card came out. auto-fit fills the row instead of leaving a
   third of it empty. Note this rule overrides the earlier .ov-quick-grid declaration. */
.ov-quick-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:16px; margin-top:24px; }
@media(max-width:900px){ .ov-quick-grid{ grid-template-columns:1fr; } }
.ov-section-label{
  font-family:var(--mono); font-size:13px; font-weight:700; letter-spacing:0.1em;
  text-transform:uppercase; color:rgba(245,244,240,0.76); margin-bottom:16px;
}
/* ── CF PROFILE MATCH column on desktop ── */
.cf-match-col{ display:flex; flex-direction:column; align-items:flex-start; justify-content:center; }

#tab-game{padding-top:0;}
#tab-game .sec-header{margin-bottom:14px;}
/* Sits after every tab in the DOM now, so it reads as a page footer instead of appearing
   above whichever tab happened to be declared later. */
.pro-disclaimer{max-width:1200px;margin:0 auto;padding:22px 40px 40px;border-top:1px solid rgba(255,255,255,0.05);font-size:11px;line-height:1.6;color:rgba(250,250,250,0.52);}@media(max-width:900px){.pro-disclaimer{padding:20px 14px 32px;}}
body{font-variant-numeric:tabular-nums;}

/* ══ GATE — ambient background ══════════════════════════════════════════════
   Contour rings read as course topography rather than the usual gradient blob, and the
   grid underneath gives the instrument-panel feel the product is going for. Two layers
   drift on long, offset durations so the loop never reads as a loop. */
.gate-aside::before,
.gate-aside::after{content:'';position:absolute;pointer-events:none;}
.gate-aside::before{
  inset:-30%;
  background:
    repeating-radial-gradient(circle at 22% 28%,transparent 0 38px,rgba(91,191,133,0.055) 38px 39px),
    repeating-radial-gradient(circle at 78% 74%,transparent 0 52px,rgba(201,168,76,0.045) 52px 53px);
  animation:gateDrift 46s ease-in-out infinite alternate;
}
.gate-aside::after{
  inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,0.028) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,0.028) 1px,transparent 1px);
  background-size:46px 46px;
  -webkit-mask-image:radial-gradient(ellipse 78% 62% at 26% 34%,#000 0%,transparent 72%);
  mask-image:radial-gradient(ellipse 78% 62% at 26% 34%,#000 0%,transparent 72%);
  animation:gateGrid 38s linear infinite;
}
@keyframes gateDrift{
  0%{transform:translate3d(0,0,0) scale(1);}
  100%{transform:translate3d(2.5%,-2%,0) scale(1.06);}
}
@keyframes gateGrid{from{background-position:0 0,0 0;}to{background-position:46px 46px,46px 46px;}}
.gate-aside-inner{position:relative;z-index:1;}

/* ══ GATE — preview card ════════════════════════════════════════════════════ */
.gate-proof{position:relative;}
/* Auto-advance timer doubles as the only chrome the mode switcher needs. */
.gp-progress{position:absolute;top:0;left:0;height:2px;width:100%;transform-origin:left center;
  background:linear-gradient(90deg,var(--gold),var(--green-light));opacity:.85;z-index:2;
  animation:gpProg 9s linear infinite;}
.gate-proof.paused .gp-progress{animation-play-state:paused;opacity:.3;}
@keyframes gpProg{from{transform:scaleX(0);}to{transform:scaleX(1);}}

.gate-proof-head{display:flex;align-items:center;gap:18px;padding:14px 18px;
  border-bottom:1px solid rgba(255,255,255,0.055);
  background:linear-gradient(180deg,rgba(255,255,255,0.028),transparent);}
.gate-proof-label{display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);
  font-size:8.5px;font-weight:600;letter-spacing:0.17em;text-transform:uppercase;color:var(--gold);
  white-space:nowrap;}
.gp-headmeta{display:flex;flex-direction:column;gap:1px;min-width:0;}
.gate-proof-event{font-size:12.5px;font-weight:600;color:var(--white);line-height:1.25;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.gate-proof-course{font-family:var(--mono);font-size:9.5px;letter-spacing:0.03em;
  color:rgba(250,250,250,0.58);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.gp-next{margin-left:auto;flex-shrink:0;display:inline-flex;align-items:center;gap:6px;
  background:rgba(255,255,255,0.045);border:1px solid var(--border);border-radius:20px;
  padding:5px 11px;font-family:var(--body);font-size:10.5px;color:rgba(250,250,250,0.6);
  cursor:pointer;transition:border-color .18s,color .18s,background .18s;}
.gp-next:hover{border-color:rgba(201,168,76,0.5);color:var(--gold);background:rgba(201,168,76,0.08);}
.gp-next:focus-visible{outline:2px solid var(--gold);outline-offset:2px;}
.gp-next svg{width:9px;height:9px;flex-shrink:0;}

/* ══ GATE — proof band ══════════════════════════════════════════════════════
   Four numerals on hairline dividers. Counting them up on reveal is the one flourish;
   the rest is spacing and a tight type scale. */
.gate-trust{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:1px solid var(--border);
  border-radius:12px;overflow:hidden;background:rgba(255,255,255,0.018);}
.gt-cell{padding:13px 14px;border-right:1px solid rgba(255,255,255,0.055);}
.gt-cell:last-child{border-right:none;}
.gt-n{display:block;font-family:var(--mono);font-size:19px;font-weight:500;line-height:1.1;
  color:var(--white);font-variant-numeric:tabular-nums;letter-spacing:-0.01em;}
.gt-n em{font-style:normal;font-size:12px;color:rgba(250,250,250,0.65);margin-left:1px;}
.gt-l{display:block;margin-top:5px;max-width:11ch;font-family:var(--mono);font-size:8px;font-weight:500;
  letter-spacing:0.13em;text-transform:uppercase;color:rgba(250,250,250,0.6);line-height:1.35;}
.gt-cell.hero .gt-n{color:var(--green-light);}
@media(max-width:560px){.gate-trust{grid-template-columns:repeat(2,1fr);}
  .gt-cell:nth-child(2){border-right:none;}
  .gt-cell:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,0.055);}}

/* ══ GATE — below the fold ══════════════════════════════════════════════════ */
.gate-below{border-top:1px solid var(--border);padding:44px clamp(24px,4vw,56px) 64px;
  background:
    radial-gradient(ellipse 60% 100% at 50% 0%,rgba(201,168,76,0.045),transparent 70%),
    rgba(255,255,255,0.012);}
.gb-inner{max-width:820px;margin:0 auto;}
.gate-below-label{font-family:var(--mono);font-size:9px;font-weight:600;letter-spacing:0.16em;
  text-transform:uppercase;color:rgba(250,250,250,0.58);text-align:center;margin-bottom:6px;}
.gb-head{font-family:var(--display);font-size:clamp(22px,2.4vw,29px);font-weight:500;
  color:var(--white);text-align:center;margin:0 0 26px;letter-spacing:-0.01em;}
.gate-tiers{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:0;}
.gate-tier{position:relative;border:1px solid var(--border);border-radius:14px;padding:20px;
  background:var(--black-card);display:flex;flex-direction:column;}
.gate-tier.pro{border-color:rgba(201,168,76,0.32);
  background:linear-gradient(165deg,rgba(201,168,76,0.07),var(--black-card) 62%);}
.gate-tier-top{display:flex;align-items:baseline;justify-content:space-between;gap:10px;
  margin-bottom:14px;padding-bottom:12px;border-bottom:1px solid rgba(255,255,255,0.07);}
.gate-tier-name{font-family:var(--mono);font-size:9.5px;font-weight:600;letter-spacing:0.14em;
  text-transform:uppercase;}
.gate-tier-price{font-family:var(--mono);font-size:19px;font-weight:500;color:var(--white);
  font-variant-numeric:tabular-nums;}
.gate-tier-price em{font-style:normal;font-size:10px;color:rgba(250,250,250,0.62);}
.gate-tier ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px;flex:1;}
.gate-tier li{position:relative;padding-left:20px;font-size:13px;line-height:1.45;
  color:rgba(250,250,250,0.66);}
.gate-tier li::before{content:'';position:absolute;left:0;top:6px;width:11px;height:7px;
  border-left:1.5px solid var(--green-light);border-bottom:1.5px solid var(--green-light);
  transform:rotate(-45deg);}
.gate-tier.pro li::before{border-color:var(--gold);}
.gate-tier-note{margin-top:16px;padding-top:13px;border-top:1px solid rgba(201,168,76,0.18);
  font-family:var(--mono);font-size:9px;font-weight:600;letter-spacing:0.1em;text-transform:uppercase;
  color:var(--gold);}
.gb-foot{margin-top:24px;text-align:center;font-size:13px;color:rgba(250,250,250,0.65);}
.gb-foot b{color:rgba(250,250,250,0.8);font-weight:500;}
@media(max-width:640px){.gate-tiers{grid-template-columns:1fr;}}

@media(prefers-reduced-motion:reduce){
  .gate-aside::before,.gate-aside::after,.gp-progress{animation:none;}
  .gp-progress{transform:scaleX(1);opacity:.25;}
}

/* ══ Ambient: grain, spotlight, ball flight ═════════════════════════════════
   Grain keeps a near-black ground from reading as flat #0A0A0A. The spotlight is a
   pointer-tracked radial that costs two custom properties. The ball-flight trace is the
   one element here that could not appear on a fintech page. */
.gate-aside{--mx:26%;--my:30%;}
.gate-grain{position:absolute;inset:0;pointer-events:none;z-index:0;opacity:.16;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='0.55'/%3E%3C/svg%3E");}
.gate-spot{position:absolute;inset:0;pointer-events:none;z-index:0;
  background:radial-gradient(420px circle at var(--mx) var(--my),rgba(201,168,76,0.085),transparent 62%);
  transition:background .28s ease-out;}

.gate-flight{position:absolute;top:0;left:0;width:100%;height:340px;pointer-events:none;z-index:0;overflow:visible;}
.gate-flight path{
  fill:none;stroke:url(#flightGrad);stroke-width:1.4;stroke-linecap:round;
  stroke-dasharray:var(--len,900);stroke-dashoffset:var(--len,900);
  animation:flightDraw 2.6s cubic-bezier(.34,.72,.36,1) .35s forwards;
}
.gate-flight circle{opacity:0;animation:flightDot .5s ease-out 2.75s forwards;}
@keyframes flightDraw{to{stroke-dashoffset:0;}}
@keyframes flightDot{to{opacity:1;}}

@media(prefers-reduced-motion:reduce){
  .gate-spot{transition:none;}
  .gate-flight path{animation:none;stroke-dashoffset:0;}
  .gate-flight circle{animation:none;opacity:1;}
}.gp-ctry{font-family:var(--mono);font-style:normal;font-size:9px;letter-spacing:0.08em;color:rgba(250,250,250,0.57);margin-left:7px;}

/* ══ Gate — what-you-get, inline under the form ═════════════════════════════
   Lives in the right column rather than a below-fold band, so the page is one screen and
   the supporting detail sits directly under the CTA it supports. */
.gate-inc{display:grid;grid-template-columns:1fr 1fr;gap:14px 20px;margin-top:26px;padding-top:22px;
  border-top:1px solid var(--border);}
.gi-h{font-family:var(--mono);font-size:9px;font-weight:600;letter-spacing:0.13em;
  text-transform:uppercase;margin-bottom:9px;}
.gi-h.free{color:var(--green-light);}
.gi-h.pro{color:var(--gold);}
.gi-h em{font-style:normal;font-size:8px;opacity:.65;}
.gate-inc ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;}
.gate-inc li{position:relative;padding-left:14px;font-size:12px;line-height:1.45;
  color:rgba(250,250,250,0.5);}
.gate-inc li::before{content:'';position:absolute;left:0;top:5px;width:7px;height:4px;
  border-left:1.4px solid currentColor;border-bottom:1.4px solid currentColor;
  transform:rotate(-45deg);opacity:.5;}
.gi-col:first-child li::before{color:var(--green-light);}
.gi-col:last-child li::before{color:var(--gold);}
.gi-note{grid-column:1/-1;margin:4px 0 0;font-size:11.5px;line-height:1.55;
  color:rgba(250,250,250,0.6);}
@media(max-width:640px){.gate-inc{grid-template-columns:1fr;gap:16px;}}
/* .gate-flight is retained for the homepage hero — a drawn shot arc needs somewhere to
   belong, and against the gate headline it read as decoration. */

/* Auth inputs fill the card; a narrow password field beside a full-width button looked broken. */
.gate-card .gate-pw-wrap{position:relative;display:block;width:100%;}
.gate-card .gate-pw-wrap .gate-input{width:100%;padding-right:44px;}
.gate-card .gate-form{display:flex;flex-direction:column;gap:10px;width:100%;}
.gate-card .gate-form .gate-input,.gate-card .gate-form .gate-btn{width:100%;}

/* Trial chip was overlapping the email on narrow sidebars. */
.psb-user-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:10px;}
.psb-user-email{flex:1 1 100%;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.psb-trial-chip{flex:0 0 auto;}

/* Account panel sized to its content. It had a fixed max-height that forced a scrollbar even
   when everything fitted. */
#acctOverlay .acct-panel,#acctOverlay > div{max-height:none!important;overflow:visible!important;}
#acctOverlay{overflow-y:auto;-webkit-overflow-scrolling:touch;}

/* Overview: course profile and field strength share a row — they describe the same venue and
   reading them side by side is the point. */

/* ══ Pro locked tab ═════════════════════════════════════════════════════════
   Contour motif shared with the gate and homepage hero, so a locked tab still reads as this
   product. Composited animation only; nothing here is withheld data. */
.plk{position:relative;min-height:620px;border:1px solid var(--border);border-radius:16px;
  overflow:hidden;background:linear-gradient(168deg,rgba(20,19,17,0.9),rgba(14,13,12,0.94));
  display:flex;align-items:center;justify-content:center;}
.plk::after{content:'';position:absolute;inset:0;pointer-events:none;opacity:.08;
  mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='0.55'/%3E%3C/svg%3E");}
.plk-backdrop{position:absolute;inset:-25%;pointer-events:none;
  background:
    repeating-radial-gradient(circle at 28% 34%,transparent 0 46px,rgba(91,191,133,0.032) 46px 47px),
    repeating-radial-gradient(circle at 74% 70%,transparent 0 60px,rgba(201,168,76,0.026) 60px 61px);
  animation:plkDrift 44s ease-in-out infinite alternate;}
@keyframes plkDrift{0%{transform:translate3d(0,0,0) scale(1);}100%{transform:translate3d(2%,-1.5%,0) scale(1.05);}}

/* Fixed width and a min-height on the detail line so all three locked tabs are the same
   shape — they are the same component, and varying copy length should not show. */
.plk-panel{position:relative;z-index:1;width:100%;max-width:620px;padding:clamp(40px,6vh,72px) 30px;text-align:center;}
.plk-eyebrow{display:inline-block;font-family:var(--mono);font-size:9px;font-weight:600;
  letter-spacing:0.18em;text-transform:uppercase;color:var(--gold);
  background:rgba(201,168,76,0.12);border:1px solid rgba(201,168,76,0.34);
  padding:5px 13px;border-radius:999px;margin-bottom:16px;}
.plk-title{font-family:var(--display);font-size:clamp(32px,3.6vw,46px);font-weight:500;
  color:var(--white);margin:0 0 10px;letter-spacing:-0.018em;}
.plk-line{font-size:15.5px;line-height:1.6;color:rgba(250,250,250,0.68);margin:0 auto 28px;max-width:46ch;min-height:2.6em;display:flex;align-items:center;justify-content:center;}

/* Numerals lead. Countable facts about this tab, not interchangeable feature bullets. */
.plk-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;
  border:1px solid rgba(201,168,76,0.16);border-radius:13px;overflow:hidden;
  background:rgba(201,168,76,0.1);margin-bottom:28px;
  box-shadow:0 1px 0 rgba(255,255,255,0.04) inset,0 14px 34px -26px rgba(0,0,0,0.9);}
.plk-stat{padding:18px 10px;background:linear-gradient(180deg,rgba(28,26,23,0.96),rgba(20,19,17,0.96));}
.plk-stat b{display:block;font-family:var(--mono);font-size:24px;font-weight:500;color:var(--white);
  font-variant-numeric:tabular-nums;line-height:1.1;letter-spacing:-0.01em;}
.plk-stat span{display:block;margin-top:7px;font-family:var(--mono);font-size:8.5px;font-weight:600;
  letter-spacing:0.13em;text-transform:uppercase;color:rgba(250,250,250,0.56);line-height:1.35;}
@media(max-width:560px){.plk-stats{grid-template-columns:1fr 1fr;}
  .plk-stat:nth-child(2){border-right:none;}
  .plk-stat:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,0.06);}}

.plk-detail{font-size:13.5px;line-height:1.65;color:rgba(250,250,250,0.58);margin:0 auto 30px;max-width:52ch;min-height:4.3em;}
/* Gradient fill with an inset highlight reads as a raised object rather than a flat
   rectangle; the sheen sweeps once on hover. Composited only. */
.plk-cta{position:relative;display:inline-block;overflow:hidden;text-decoration:none;
  background:linear-gradient(180deg,#E0C368,#C9A84C 55%,#B08F2A);color:#14120C;
  border-radius:11px;padding:15px 38px;font-size:15.5px;font-weight:700;letter-spacing:0.01em;
  box-shadow:0 1px 0 rgba(255,255,255,0.4) inset,0 10px 26px -12px rgba(201,168,76,0.6);
  transition:transform .16s,box-shadow .22s;}
.plk-cta::after{content:'';position:absolute;top:0;left:-60%;width:40%;height:100%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,0.42),transparent);
  transform:skewX(-18deg);transition:left .55s cubic-bezier(.22,.68,.28,1);}
.plk-cta:hover{transform:translateY(-2px);
  box-shadow:0 1px 0 rgba(255,255,255,0.5) inset,0 16px 34px -12px rgba(201,168,76,0.75);}
.plk-cta:hover::after{left:120%;}
.plk-cta:focus-visible{outline:2px solid var(--white);outline-offset:3px;}
.plk-price{margin-top:11px;font-family:var(--mono);font-size:10.5px;letter-spacing:0.06em;
  color:rgba(250,250,250,0.52);}
.plk-note{margin-top:26px;padding-top:20px;border-top:1px solid rgba(255,255,255,0.06);
  font-size:12.5px;line-height:1.6;color:rgba(250,250,250,0.5);max-width:44ch;margin-inline:auto;}
@media(prefers-reduced-motion:reduce){.plk-backdrop{animation:none;}}

/* Hides the gate while a stored session is being verified, so a returning reader never sees
   the sign-in screen flash. Cleared by showApp or showGate once the answer is known. */
html.booting-auth #gate{display:none;}

/* Hero proof band: the cells were wider than the content needed. */
.gate-trust,.hero-stats{max-width:520px;}
.gt-cell,.hs-cell{padding:13px 14px;}

@media(prefers-reduced-motion:reduce){.plk-cta::after{display:none;}.plk-cta:hover{transform:none;}}
/* The radar shares its box with a right-hand legend, so it needs more height than the
   bar charts to render the diamond at a readable size. */
#skills-radar{max-height:none;}
@media(max-width:900px){.ch-grid{grid-template-columns:1fr;}.ch-canvas,.ch-card.ch-wide .ch-canvas{height:290px;}}

/* ══ Pick 5 live projection ═════════════════════════════════════════════════
   Provisional by nature, so it is labelled as such and never called a score. */
.gp-projwrap{margin-bottom:18px;}
.gp-proj-note{display:flex;align-items:center;gap:8px;margin-bottom:12px;
  font-size:12.5px;color:rgba(250,250,250,0.55);}
.gp-projgrid{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
@media(max-width:760px){.gp-projgrid{grid-template-columns:1fr;}}
.gp-proj{background:linear-gradient(168deg,rgba(24,23,20,0.96),rgba(17,16,14,0.97));
  border:1px solid var(--border);border-radius:14px;padding:18px 20px;
  box-shadow:0 1px 0 rgba(255,255,255,0.035) inset,0 18px 40px -30px rgba(0,0,0,0.9);}
.gp-proj.model{border-color:rgba(201,168,76,0.3);
  background:linear-gradient(168deg,rgba(201,168,76,0.07),rgba(17,16,14,0.97) 62%);}
.gp-proj-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;
  padding-bottom:13px;margin-bottom:11px;border-bottom:1px solid rgba(255,255,255,0.07);}
.gp-proj-t{font-family:var(--mono);font-size:9.5px;font-weight:600;letter-spacing:0.14em;
  text-transform:uppercase;color:rgba(250,250,250,0.6);}
.gp-proj.model .gp-proj-t{color:var(--gold);}
.gp-proj-n{font-family:var(--mono);font-size:28px;font-weight:500;color:var(--white);
  font-variant-numeric:tabular-nums;line-height:1;letter-spacing:-0.02em;}
.gp-proj-n em{font-style:normal;font-size:11px;color:rgba(250,250,250,0.45);margin-left:5px;}
.gp-proj-rows{display:flex;flex-direction:column;}
.gp-proj-row{display:grid;grid-template-columns:38px 1fr 42px 38px;gap:10px;align-items:center;
  padding:7px 0;border-bottom:1px solid rgba(255,255,255,0.04);}
.gp-proj-row:last-child{border-bottom:none;}
.gp-proj-pos{font-family:var(--mono);font-size:10.5px;color:rgba(250,250,250,0.5);}
.gp-proj-name{font-size:13px;color:rgba(250,250,250,0.85);overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap;}
.gp-proj-sc{font-family:var(--mono);font-size:11.5px;text-align:right;
  color:rgba(250,250,250,0.6);font-variant-numeric:tabular-nums;}
.gp-proj-pts{font-family:var(--mono);font-size:13px;text-align:right;color:var(--green-light);
  font-variant-numeric:tabular-nums;font-weight:500;}

/* Post-checkout acknowledgement. Fixed to the bottom so it never displaces the app. */
.checkout-welcome{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);z-index:400;
  display:flex;gap:8px;align-items:baseline;max-width:calc(100vw - 32px);
  padding:13px 20px;border-radius:12px;
  /* This lands on top of dense tables, so it needs its own ground — the tint alone let player
     names and odds read straight through the text. Solid base first, tint layered over it. */
  background:linear-gradient(150deg,rgba(91,191,133,0.13),rgba(91,191,133,0) 62%),#15140f;
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  border:1px solid rgba(91,191,133,0.4);
  box-shadow:0 22px 52px -16px rgba(0,0,0,0.92),0 1px 0 rgba(255,255,255,0.05) inset;
  font-size:13.5px;color:var(--white);
  animation:cwIn .45s cubic-bezier(.2,.7,.3,1) both;}
.checkout-welcome strong{color:var(--green-light);font-weight:600;}
.checkout-welcome.leaving{animation:cwOut .5s ease-in forwards;}
@keyframes cwIn{from{opacity:0;transform:translateX(-50%) translateY(12px);}to{opacity:1;transform:translateX(-50%) translateY(0);}}
@keyframes cwOut{to{opacity:0;transform:translateX(-50%) translateY(10px);}}
@media(prefers-reduced-motion:reduce){.checkout-welcome{animation:none;}.checkout-welcome.leaving{animation:none;opacity:0;}}

/* ── MOBILE LAB, device pass 2026-08-21 ─────────────────────────────────────── */
@media(max-width:900px){

  /* The freshness strip is a desktop affordance. On a phone it consumed the top of every
     tab to say what the header already says, and it wrapped to three lines doing it. */
  .dl-status-bar{display:none !important;}

  /* The drawer opened below the bottom nav, leaving a gap that showed the strip behind it. */
  .bnav-more-drawer{padding-top:6px;}

  /* Account and sign-out: on mobile the sidebar is hidden, so these had no route at all. */
  .bnav-more-sep{height:1px;background:rgba(255,255,255,0.09);margin:8px 14px;}
  .bnav-more-account{display:flex;align-items:center;gap:10px;}
  .bnav-acct-icon{width:16px;height:16px;flex-shrink:0;background:currentColor;
    -webkit-mask:var(--acct-icon) center/contain no-repeat;mask:var(--acct-icon) center/contain no-repeat;}
  .bnav-more-signout{color:rgba(250,250,250,0.55);}
  .bnav-more-email{padding:6px 14px 10px;font-family:var(--mono);font-size:10.5px;
    color:rgba(250,250,250,0.38);letter-spacing:0.03em;word-break:break-all;}

  /* Course Fit rank sat on the baseline of a two-line name block, so it read as attached to
     the country rather than the row. Pin it to the top and give it a column of its own. */
  .cf-row .cf-rank{align-self:start;padding-top:2px;}

  /* Any table wide enough to need it scrolls INSIDE its own container. Columns were running
     off the right edge of the page instead -- Win Probability, Tour Rankings, DFS filters. */
  /* These wrappers carry overflow:hidden, which is WHY the columns were being clipped at the
     page edge rather than scrolling. Restoring scroll on the x axis only. */
  .model-table-wrap::-webkit-scrollbar,.rnk-table-wrap::-webkit-scrollbar,
  /* The site/mode buttons wrapped mid-row and the last one hung off the edge. One row that
     scrolls beats a row that wraps into a ragged block. */
  /* Uniform columns. A grid of auto tracks sized itself per row, so numbers in the same
     column did not line up down the table. */
  .model-table-head,.model-row{min-width:620px;}
  /* Round matchups: book and edge were sharing a track and colliding. */
  .mu-row .mu-book{display:block;margin-bottom:1px;}
  .mu-row .mu-edge{display:block;}
}

/* A DL Score built from fewer than all four components. The dot is deliberately quiet -- the
   score is still real, it just describes less than a complete one. */

/* Probability movement, shown in place of an edge while the book feed is stale. Direction is
   carried by colour AND by an arrow glyph, so it does not rely on colour alone. */
.vf-move{font-weight:600;cursor:help;display:inline-flex;align-items:baseline;gap:4px;
  font-variant-numeric:tabular-nums;}
.vf-move-arrow{font-size:9px;line-height:1;}
/* Tagged, because a bare +14.9 in a column that held percentages reads as a percentage.
   These are percentage POINTS of probability, which is a different quantity. */
.vf-move-unit{font-family:var(--mono);font-size:8px;letter-spacing:0.09em;text-transform:uppercase;
  opacity:0.62;margin-left:1px;}
.vf-move-up{color:var(--green-light);}
.vf-move-down{color:#C96A5A;}
.vf-move-flat{color:rgba(250,250,250,0.45);}
.vf-cell.vf-dim{color:rgba(250,250,250,0.4);}

/* Price mode drops Odds, Best Book and Signal (Signal is derived from edge), so four tracks. */
.vf-table.price-mode .vf-row,
.vf-table.price-mode .vf-head{grid-template-columns:1fr 128px 110px 90px;}
@media(max-width:900px){
  .vf-table.price-mode .vf-row{grid-template-columns:repeat(2,1fr);
    grid-template-areas:"player player" "edge prob";}
  .vf-table.price-mode .vf-row > *:nth-child(4){display:none;}
}
/* A statement of what the column is, not a warning about what it is not. */
.vf-pricenote{margin:0 0 14px;font-size:13px;line-height:1.6;color:rgba(250,250,250,0.5);}

/* ── COURSE STRIP ─────────────────────────────────────────────────────────────
   Held to docs/design-language.md. Layered surface (§3), numbers as hero on hairline
   dividers (§7), composited motion that degrades to the finished layout (§4), contour
   ambient grounded in the subject rather than a gradient blob (§6), and every text colour
   above the dark-only contrast floors (§9). */
.cp-card{
  position:relative;isolation:isolate;overflow:hidden;
  /* Gradient, not a flat fill — plus a 1px inset highlight and a long, soft shadow. */
  background:
    linear-gradient(168deg, rgba(28,26,20,0.92) 0%, rgba(18,20,18,0.72) 100%),
    var(--black-card);
  border:1px solid rgba(201,168,76,0.16);border-radius:14px;
  padding:20px 24px;margin-bottom:14px;
  box-shadow:0 1px 0 rgba(255,255,255,0.04) inset,
             0 18px 44px -28px rgba(0,0,0,0.9);}
/* Contour rings — course topography, the one element that could not sit on a fintech page.
   Masked so they fade before reaching the numbers, and inert to the pointer. */
.cp-card > *{position:relative;z-index:1;}

.cc-strip-head{display:flex;align-items:baseline;justify-content:space-between;gap:14px;
  flex-wrap:wrap;margin-bottom:18px;}
.ov3-label{font-family:var(--mono);font-size:13px;font-weight:700;letter-spacing:0.1em;
  text-transform:uppercase;color:rgba(201,168,76,0.92);}
.cc-evidence{font-family:var(--mono);font-size:9.5px;letter-spacing:0.06em;
  color:rgba(245,244,240,0.5);}

/* auto-fit, because a venue with only two real measurements should show two, not two
   plus a manufactured third. */
.cc-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:16px;
  align-items:start;}
/* Hairline dividers between, never boxes around — three readings of one venue. */
.cc-stat{padding-left:20px;border-left:1px solid rgba(255,255,255,0.06);min-width:0;
  animation:ccStatIn .62s cubic-bezier(.22,.68,.28,1) both;
  animation-delay:calc(var(--i,0) * 70ms);}
.cc-stat:first-child{padding-left:0;border-left:0;}
@keyframes ccStatIn{from{opacity:0;transform:translateY(7px);}to{opacity:1;transform:none;}}
.cc-stat-val{font-family:var(--mono);font-size:33px;font-weight:500;line-height:1;
  letter-spacing:-0.025em;font-variant-numeric:tabular-nums;color:var(--white);
  display:flex;align-items:baseline;gap:3px;}
.cc-stat-val em{font-style:normal;font-size:12px;font-weight:500;letter-spacing:0.01em;
  color:rgba(245,244,240,0.5);}
.cc-stat-lbl{font-family:var(--mono);font-size:11.5px;font-weight:700;letter-spacing:0.1em;
  text-transform:uppercase;color:rgba(245,244,240,0.72);margin-top:11px;}
.cc-stat-sub{font-family:var(--body);font-size:11px;line-height:1.45;
  color:rgba(245,244,240,0.5);margin-top:6px;}

.cc-strip-foot{display:flex;align-items:baseline;justify-content:flex-end;gap:16px;
  flex-wrap:wrap;margin-top:10px;padding-top:0;border-top:0;}
/* Empty once the verdict sentence was removed; kept in the markup so the flex row still has a
   left-hand item if anything is ever put back there. */
.cc-strip-foot .cc-verdict-text:empty{display:none;}
.cc-strip-foot .cc-verdict-text{font-family:var(--body);font-size:13.5px;line-height:1.55;
  color:rgba(245,244,240,0.82);flex:1 1 320px;}
.cc-strip-foot .cc-verdict-text b{color:var(--white);font-weight:600;}
.cc-details-btn{background:none;border:0;cursor:pointer;padding:0;flex:0 0 auto;
  font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:0.1em;
  text-transform:uppercase;color:var(--green-light);transition:opacity .15s;}
.cc-details-btn:hover{opacity:0.75;}
.cc-details-btn:focus-visible{outline:2px solid var(--green-light);outline-offset:3px;
  border-radius:3px;}
/* Empty state, shaped like the populated one: chip in the header, then a value with a label
   beneath it standing where the stats would be, then prose. It used to run two near-white
   lines together with no hierarchy, beside a lowercase meta fighting the uppercase header. */
.cc-chip{font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:0.14em;
  text-transform:uppercase;color:rgba(245,244,240,0.66);
  border:1px solid rgba(255,255,255,0.13);border-radius:4px;padding:4px 9px;white-space:nowrap;}
.cc-empty{max-width:74ch;}
.cc-empty-note{font-family:var(--body);font-size:14px;line-height:1.65;
  color:rgba(245,244,240,0.78);margin:0;}
.cc-empty-note code{font-family:var(--mono);font-size:12px;color:var(--gold);}

@media(max-width:760px){
  .cc-stats{grid-template-columns:1fr;gap:16px;}
  .cc-stat{padding-left:0;border-left:0;padding-top:15px;
    border-top:1px solid rgba(255,255,255,0.06);}
  .cc-stat:first-child{padding-top:0;border-top:0;}
  .cc-stat-val{font-size:28px;}
  .cp-card::before{width:280px;height:280px;}
}
/* Every animation moves TOWARD the end state, so disabling it leaves the finished layout. */
@media(prefers-reduced-motion:reduce){
  .cc-stat{animation:none;}
}

/* The breakdown, full width beneath the row — four aligned tracks need the space. */
.cc-details{background:var(--black-card);border:1px solid var(--border);border-radius:12px;
  padding:18px 20px;margin-bottom:var(--space-6);}
.cc-det-head{display:flex;align-items:baseline;justify-content:space-between;gap:14px;
  flex-wrap:wrap;margin-bottom:13px;}
.cc-evidence{font-family:var(--mono);font-size:9px;letter-spacing:0.06em;
  color:rgba(245,244,240,0.4);}
.cc-sub{font-family:var(--mono);font-size:11.5px;font-weight:700;letter-spacing:0.1em;
  text-transform:uppercase;color:rgba(245,244,240,0.68);}

@media(max-width:900px){
  .ov-three{grid-template-columns:1fr;gap:12px;}
  .ov3-big{font-size:24px;}
  .cc-details-btn{margin-top:14px;}
}

/* ══ THE GROUND ═══════════════════════════════════════════════════════════════
   Premium lives in the background, not in every container. Repeating grain and contour on
   eight cards makes none of them special and costs a composited layer each; painting it once
   on the ground gives the cards something to float ON, which is where the depth actually
   comes from. Cards stay quiet — see the glass block below.

   Everything here is fixed, inert to the pointer, and sits behind all content.

   Layered at z-index:-1, NOT 0. A negative-z-index child paints above its parent's background
   and below all in-flow content, which is exactly what an ambient layer needs — and unlike
   lifting #proApp to z-index:1, it creates no stacking context. That lift confined the mobile
   bottom nav (z-index 210, inside #proApp) beneath .drawer (199) and .player-drawer (460),
   which sit OUTSIDE it — leaving a phone with no way to reach any tab but Overview. */
body::before,
body::after{
  content:'';position:fixed;inset:0;pointer-events:none;z-index:-1;}

/* Layer 1 — a wide, very soft vignette plus two low warm pools, so near-black stops reading
   as a single flat fill. No gradient blobs: these are barely-there and never move. */
body::before{
  background:
    radial-gradient(115% 78% at 50% -12%, rgba(201,168,76,0.055) 0%, transparent 62%),
    radial-gradient(85% 62% at 8% 108%, rgba(27,77,62,0.075) 0%, transparent 66%),
    radial-gradient(120% 100% at 50% 50%, transparent 45%, rgba(0,0,0,0.42) 100%);}

/* Layer 2 — grain. The cheapest upgrade to a dark page: it stops #0A0A0A reading as paper. */
body::after{
  opacity:0.085;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='0.55'/%3E%3C/svg%3E");}

/* Layer 3 — contour rings, drawn once behind the whole app. Course topography: the element
   that could not appear on a fintech page with the logo swapped. Masked to a corner so it
   never crosses the reading column, and held far below the contrast floor. */
#proApp::before{
  content:'';position:fixed;top:-14vh;right:-16vw;width:min(74vw,980px);height:min(74vw,980px);
  pointer-events:none;z-index:-1;opacity:0.5;
  background:
    radial-gradient(circle, transparent 0 30%,   rgba(201,168,76,0.05)  30% 30.25%, transparent 30.25%),
    radial-gradient(circle, transparent 0 38.5%, rgba(201,168,76,0.042) 38.5% 38.75%, transparent 38.75%),
    radial-gradient(circle, transparent 0 47%,   rgba(91,191,133,0.04)  47% 47.25%, transparent 47.25%),
    radial-gradient(circle, transparent 0 55.5%, rgba(91,191,133,0.032) 55.5% 55.75%, transparent 55.75%),
    radial-gradient(circle, transparent 0 64%,   rgba(201,168,76,0.026) 64% 64.25%, transparent 64.25%);
  -webkit-mask-image:radial-gradient(circle at 62% 38%, #000 0%, transparent 68%);
  mask-image:radial-gradient(circle at 62% 38%, #000 0%, transparent 68%);}

/* ══ CONTAINERS — quiet glass ═════════════════════════════════════════════════
   Not "stripped back" — they were already plain. Given just enough to read as panes sitting
   ON the textured ground rather than holes cut out of it: slight translucency so the grain
   shows through, a 1px inset highlight along the top edge, and one long soft shadow.
   backdrop-filter is scoped to section-level cards only, never to list rows. */
.dl-card{
  position:relative;
  background:linear-gradient(168deg, rgba(26,24,21,0.82) 0%, rgba(20,19,17,0.68) 100%);
  border:1px solid rgba(255,255,255,0.075);
  border-radius:14px;
  -webkit-backdrop-filter:blur(14px) saturate(115%);
  backdrop-filter:blur(14px) saturate(115%);
  box-shadow:0 1px 0 rgba(255,255,255,0.045) inset,
             0 20px 46px -30px rgba(0,0,0,0.92);}

/* Browsers without backdrop-filter get an opaque card rather than a washed-out one. */
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .dl-card{background:linear-gradient(168deg, #1A1815 0%, #141311 100%);}
}

/* ══ COURSE FIT TABLE ═════════════════════════════════════════════════════════
   Columns are driven by --cf-cols, set per render, so the Fit column can be dropped ENTIRELY
   at a venue with no validated signal rather than filled with n/a. Cells carry a class and the
   mobile reflow maps grid-areas BY CLASS — the old nth-child mapping silently mis-assigned
   every area whenever a cell was added or removed. */
.cf-table-wrap{border:1px solid var(--border);border-radius:14px;overflow:hidden;
  background:linear-gradient(168deg, rgba(26,24,21,0.82) 0%, rgba(20,19,17,0.68) 100%);
  -webkit-backdrop-filter:blur(14px) saturate(115%);backdrop-filter:blur(14px) saturate(115%);
  box-shadow:0 1px 0 rgba(255,255,255,0.045) inset, 0 20px 46px -30px rgba(0,0,0,0.92);}
.cf-table-head,.cf-row{display:grid;grid-template-columns:var(--cf-cols);align-items:center;
  gap:14px;padding:0 20px;}
.cf-table-head{height:52px;border-bottom:1px solid rgba(255,255,255,0.07);
  background:rgba(255,255,255,0.018);}
.cf-th{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:0.1em;
  text-transform:uppercase;color:rgba(250,250,250,0.72);display:flex;align-items:center;gap:6px;}

.cf-row{min-height:66px;border-bottom:1px solid rgba(255,255,255,0.04);cursor:pointer;
  transition:background .15s;}
.cf-row:last-child{border-bottom:none;}
.cf-row:hover{background:rgba(255,255,255,0.028);}
.cf-row.top3{background:rgba(201,168,76,0.035);}
.cf-row.top3:hover{background:rgba(201,168,76,0.055);}

/* Sort controls. These were 8px bordered spans that did not read as buttons at all. */

.cf-rank{font-family:var(--mono);font-size:14px;color:rgba(250,250,250,0.45);
  font-variant-numeric:tabular-nums;}
.cf-rank.r1{color:var(--gold);}.cf-rank.r2,.cf-rank.r3{color:rgba(201,168,76,0.62);}
.cf-player{font-size:14.5px;font-weight:600;color:var(--white);line-height:1.25;}
.cf-country{font-family:var(--mono);font-size:9.5px;letter-spacing:0.08em;
  color:rgba(250,250,250,0.46);margin-top:3px;}
.cf-score{font-family:var(--mono);font-size:21px;font-weight:500;text-align:center;
  font-variant-numeric:tabular-nums;letter-spacing:-0.02em;color:var(--green-light);}

.cf-score.dim{color:rgba(250,250,250,0.4);}
/* SG:Total is DataGolf's model estimate of true talent, not a raw average — kept beside
   Quality rather than under it so the two are legible as separate things. */
.cf-sgtotal{font-family:var(--mono);font-size:14px;font-weight:500;text-align:center;
  font-variant-numeric:tabular-nums;color:rgba(250,250,250,0.72);}
.cf-sgtotal.dim{color:rgba(250,250,250,0.4);}
.cf-bars{display:flex;flex-direction:column;gap:5px;}
.cf-odds-col{text-align:right;}
.odds-num{font-family:var(--mono);font-size:13px;font-weight:600;color:var(--gold);
  font-variant-numeric:tabular-nums;}
.odds-num.dim{color:rgba(250,250,250,0.3);}
.odds-book{font-family:var(--mono);font-size:8.5px;letter-spacing:0.08em;
  color:rgba(250,250,250,0.42);margin-top:2px;}
.cf-foot{padding:12px 20px;border-top:1px solid rgba(255,255,255,0.05);text-align:right;}
.cf-foot a{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:0.1em;
  text-transform:uppercase;color:rgba(250,250,250,0.5);text-decoration:none;transition:color .2s;}
.cf-foot a:hover{color:var(--gold);}

/* Diverging SG bars — zero draws nothing, right is better, left is worse. */
.sg-br{display:flex;align-items:center;gap:8px;}
.sg-lbl{font-family:var(--mono);font-size:9.5px;font-weight:600;letter-spacing:0.05em;
  color:rgba(250,250,250,0.56);width:30px;flex-shrink:0;}
.sg-track,.drawer-sg-track{position:relative;flex:1;height:5px;border-radius:3px;
  background:rgba(255,255,255,0.05);overflow:hidden;}
.sg-zero{position:absolute;left:50%;top:0;bottom:0;width:1px;
  background:rgba(255,255,255,0.18);}
.sg-fill,.drawer-sg-fill{position:absolute;top:0;bottom:0;width:var(--w,0%);border-radius:2px;}
.sg-fill.pos,.drawer-sg-fill.pos{left:50%;background:var(--green-light);}
.sg-fill.neg,.drawer-sg-fill.neg{right:50%;background:#C96A5A;}
.sg-val{font-family:var(--mono);font-size:10px;width:38px;text-align:right;flex-shrink:0;
  font-variant-numeric:tabular-nums;}
.sg-val.pos{color:var(--green-light);}
.sg-val.neg{color:#C96A5A;}
.sg-val.zero{color:rgba(250,250,250,0.5);}

/* ── MOBILE ── mapped by class, never by nth-child ── */
@media(max-width:900px){
  .cf-table-head{display:none;}
  .cf-row{grid-template-columns:auto 1fr auto auto;
    grid-template-areas:"rank player qual sgt" "bars bars bars bars" "odds odds odds odds";
    row-gap:12px;padding:16px 14px;min-height:0;
    background:var(--black-card);border:1px solid var(--border);border-radius:12px;
    margin-bottom:10px;}
  .cf-c-rank{grid-area:rank;}
  .cf-c-av{display:none;}
  .cf-c-player{grid-area:player;}
  .cf-c-fit{grid-area:qual;justify-self:end;}
  /* With Fit present it takes the qual slot and Quality moves beside SG Total. */
  .cf-row:has(.cf-c-fit){grid-template-areas:"rank player fit qual" "sgt sgt sgt sgt" "bars bars bars bars" "odds odds odds odds";}
  .cf-row:has(.cf-c-fit) .cf-c-fit{grid-area:fit;}
  .cf-row:has(.cf-c-fit) .cf-c-qual{grid-area:qual;}
  .cf-row:has(.cf-c-fit) .cf-c-sg{grid-area:sgt;justify-self:start;}
  .cf-c-qual{grid-area:qual;justify-self:end;}
  .cf-c-sg{grid-area:sgt;justify-self:end;}
  .cf-c-bars{grid-area:bars;}
  .cf-c-odds{grid-area:odds;text-align:left;}
  .cf-row > [data-label]::before{content:attr(data-label);display:block;font-family:var(--mono);
    font-size:8.5px;letter-spacing:.12em;text-transform:uppercase;
    color:rgba(250,250,250,0.5);margin-bottom:3px;}
  .cf-score{font-size:18px;}
  .cf-table-wrap{border:0;background:none;box-shadow:none;backdrop-filter:none;
    -webkit-backdrop-filter:none;overflow:visible;}
}

/* ── Course Fit v2 ─────────────────────────────────────────────────────────────
   Sort controls became a segmented control. Four separate bordered buttons read as tags and
   made the header boxier, not more premium — one container with hairline dividers and a
   tinted (not filled) active segment is quieter and reads as one control. */
.cf-th{align-items:center;}

/* A sortable header carries its own affordance instead of sitting beside a control. */
.cf-hbtn{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:0.1em;
  text-transform:uppercase;color:rgba(250,250,250,0.7);background:none;border:0;padding:2px 0;
  cursor:pointer;display:inline-flex;align-items:center;gap:4px;line-height:1;
  border-bottom:1px solid transparent;transition:color .15s,border-color .15s;}
.cf-hbtn:hover{color:var(--white);border-bottom-color:rgba(255,255,255,0.28);}
.cf-hbtn.on{color:var(--green-light);border-bottom-color:var(--green-light);}
.cf-hbtn.center{justify-content:center;width:100%;}
.cf-hbtn:focus-visible{outline:2px solid var(--green-light);outline-offset:3px;border-radius:2px;}
.cf-hbtn-ar{font-size:9px;opacity:0.9;}

.cf-barhead{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.cf-seg{display:inline-flex;align-items:stretch;border:1px solid rgba(255,255,255,0.1);
  border-radius:7px;overflow:hidden;background:rgba(255,255,255,0.028);}
.cf-seg-btn{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:0.09em;
  color:rgba(250,250,250,0.6);background:none;border:0;border-left:1px solid rgba(255,255,255,0.08);
  padding:5px 9px;cursor:pointer;display:inline-flex;align-items:center;gap:3px;line-height:1;
  transition:color .14s, background .14s;}
.cf-seg-btn:first-child{border-left:0;}
.cf-seg-btn:hover{color:var(--white);background:rgba(255,255,255,0.06);}
.cf-seg-btn.on{color:var(--green-light);background:rgba(91,191,133,0.14);}
.cf-seg-btn:focus-visible{outline:2px solid var(--green-light);outline-offset:-2px;}
.cf-seg-ar{font-size:8.5px;}
/* The bar scale is derived from the field each render, so it is stated rather than implied. */

/* Quality: percentile IS the tier, so colouring by it restates the number rather than adding a
   claim. Flat white on every row gave 100 and 61 identical weight, and 21px mono white read as
   shouty rather than precise. */
.cf-score{font-family:var(--mono);font-size:19px;font-weight:500;text-align:center;
  font-variant-numeric:tabular-nums;letter-spacing:-0.01em;}

.cf-q-dim,.cf-score.dim{color:rgba(245,244,240,0.38);}
.cf-sgtotal{font-family:var(--mono);font-size:13.5px;font-weight:500;text-align:center;
  font-variant-numeric:tabular-nums;color:rgba(250,250,250,0.68);}

.cf-c-odds{text-align:right;}
.cf-bars{display:flex;flex-direction:column;gap:4px;}
.sg-br{gap:7px;}
.sg-lbl{font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:0.08em;
  color:rgba(250,250,250,0.5);width:30px;flex-shrink:0;}
.sg-track,.drawer-sg-track{height:4px;}
.sg-val{font-size:9.5px;width:36px;}
.cf-row{min-height:0;padding-top:12px;padding-bottom:12px;}

@media(max-width:900px){
  .cf-barhead{gap:8px;}
  .cf-seg-btn{padding:6px 11px;font-size:10.5px;}
  .cf-score{font-size:17px;}
  .cf-th-right{text-align:left;}
}

/* ── Field tab v3 ──────────────────────────────────────────────────────────────

   PREMIUM TOOLTIPS. The old box was a flat near-black rectangle with a hairline and no arrow,
   and the trigger was a grey "?" disc on everything — including headers with no tooltip behind
   them. Now: only elements that actually HAVE a tooltip carry the affordance, the box is a
   layered surface with a pointer, and it fades up rather than just appearing. */
.cf-th-plain{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:0.1em;
  text-transform:uppercase;color:rgba(250,250,250,0.7);}
.cf-th-help{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:0.1em;
  text-transform:uppercase;color:rgba(250,250,250,0.7);cursor:help;
  border-bottom:1px dotted transparent;transition:color .15s,border-color .15s;}
.cf-th-help:hover{color:var(--white);border-bottom-color:rgba(255,255,255,0.34);}
/* Underline the TEXT, not the column: display:block stretched the dotted rule the full width. */
.cf-th-right{display:block;width:100%;text-align:right;}
.cf-th-right.cf-th-help{border-bottom:0;}
.cf-th-right.cf-th-help > span,
.cf-th-help.cf-th-right{border-bottom:0;}
.cf-c-odds .cf-th-help{display:inline-block;width:auto;
  border-bottom:1px dotted transparent;}
.cf-c-odds .cf-th-help:hover{border-bottom-color:rgba(255,255,255,0.34);}
.cf-c-odds.cf-th{justify-content:flex-end;}

.tip{position:relative;display:inline-flex;align-items:center;gap:4px;cursor:help;}
.tip-icon{font-size:8.5px;font-weight:700;color:rgba(250,250,250,0.5);
  background:rgba(255,255,255,0.07);border:1px solid rgba(255,255,255,0.08);
  border-radius:50%;width:14px;height:14px;display:inline-flex;align-items:center;
  justify-content:center;flex-shrink:0;font-style:normal;transition:all .15s;}
.tip:hover .tip-icon{color:var(--green-light);background:rgba(91,191,133,0.14);
  border-color:rgba(91,191,133,0.3);}
.tip-box{display:none;}
.tip-portal{position:fixed;top:0;left:0;z-index:2000;
  width:258px;padding:13px 15px;border-radius:11px;
  background:linear-gradient(168deg, rgba(28,26,23,0.99) 0%, rgba(18,17,15,0.99) 100%);
  border:1px solid rgba(255,255,255,0.11);
  box-shadow:0 1px 0 rgba(255,255,255,0.05) inset, 0 18px 40px -14px rgba(0,0,0,0.85);
  font-family:var(--body);font-size:12px;font-weight:400;line-height:1.62;
  color:rgba(245,244,240,0.76);opacity:0;pointer-events:none;visibility:hidden;
  transform:translateY(4px);
  transition:opacity .16s var(--ease-out,ease), transform .16s var(--ease-out,ease);
  text-transform:none;letter-spacing:0;white-space:normal;}
.tip-portal.show{opacity:1;visibility:visible;transform:translateY(0);pointer-events:auto;}
.tip-portal.below{transform:translateY(-4px);}
.tip-portal.below.show{transform:translateY(0);}
.tip-portal strong{color:var(--white);display:block;margin-bottom:5px;font-size:12.5px;
  font-weight:600;letter-spacing:0;}
.tip-portal em{font-style:normal;color:var(--green-light);}
/* Pointer, so the box reads as attached to what it explains. --tip-ax tracks the anchor even
   when the box has been clamped against a viewport edge. */
.tip-portal::after{content:'';position:absolute;top:100%;left:var(--tip-ax,50%);
  transform:translateX(-50%);border:6px solid transparent;
  border-top-color:rgba(24,22,20,0.99);}
.tip-portal.below::after{top:auto;bottom:100%;border-top-color:transparent;
  border-bottom-color:rgba(24,22,20,0.99);}
@media(prefers-reduced-motion:reduce){
  .tip-portal{transition:opacity .12s;transform:none;}
}

/* Player hover card — same layered treatment as the tooltip. */
#playerCard{position:fixed;z-index:400;width:284px;padding:18px 20px;border-radius:13px;
  background:linear-gradient(168deg, rgba(28,26,23,0.99) 0%, rgba(17,16,14,0.99) 100%);
  border:1px solid rgba(255,255,255,0.11);pointer-events:none;opacity:0;
  transform:translateY(5px);transition:opacity .16s, transform .16s;
  box-shadow:0 1px 0 rgba(255,255,255,0.05) inset, 0 22px 52px -18px rgba(0,0,0,0.9);}
#playerCard.show{opacity:1;transform:translateY(0);}

/* QUALITY GRADIENT — gold at the top of the field, green through the upper half, the same grey
   as SG Total below it, faded red at the bottom. Banded by QUALITY rank, computed independently
   of the display sort so the colour never silently changes meaning. */
.cf-q-t1{color:var(--gold);}
.cf-q-t2{color:var(--green-light);}
.cf-q-t3{color:rgba(250,250,250,0.68);}
.cf-q-t4{color:rgba(201,106,90,0.72);}
.cf-q-dim{color:rgba(245,244,240,0.36);}

/* ── VENUE BLOCK ── one source, replacing the weights card and the no-fit banner ── */
.venue-block{position:relative;margin-bottom:16px;padding:18px 22px;border-radius:13px;
  background:linear-gradient(168deg, rgba(28,26,21,0.86) 0%, rgba(20,19,17,0.7) 100%);
  border:1px solid rgba(201,168,76,0.15);
  -webkit-backdrop-filter:blur(14px) saturate(115%);backdrop-filter:blur(14px) saturate(115%);
  box-shadow:0 1px 0 rgba(255,255,255,0.04) inset, 0 18px 44px -30px rgba(0,0,0,0.9);}
.vb-head{display:flex;align-items:center;justify-content:space-between;gap:14px;
  flex-wrap:wrap;margin-bottom:13px;}
.vb-title{font-family:var(--mono);font-size:13px;font-weight:700;letter-spacing:0.1em;
  text-transform:uppercase;color:rgba(201,168,76,0.92);}
.vb-chip{font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:0.14em;
  text-transform:uppercase;color:rgba(245,244,240,0.62);border:1px solid rgba(255,255,255,0.13);
  border-radius:4px;padding:4px 9px;white-space:nowrap;}
.vb-chip-ok{color:var(--green-light);border-color:rgba(91,191,133,0.3);
  background:rgba(91,191,133,0.09);}
.vb-body{display:grid;grid-template-columns:minmax(220px,1fr) minmax(240px,1.1fr);gap:22px;
  align-items:start;}
.vb-bars{display:flex;flex-direction:column;gap:7px;}
.vb-row{display:grid;grid-template-columns:46px 1fr 42px;align-items:center;gap:11px;
  animation:vbIn .5s cubic-bezier(.22,.68,.28,1) both;animation-delay:calc(var(--i,0)*55ms);}
@keyframes vbIn{from{opacity:0;transform:translateX(-5px);}to{opacity:1;transform:none;}}
.vb-lbl{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:0.09em;
  color:rgba(245,244,240,0.62);cursor:help;}
.vb-track{height:6px;border-radius:3px;background:rgba(255,255,255,0.055);overflow:hidden;}
.vb-bar{display:block;height:100%;width:var(--w,0%);border-radius:3px;
  background:linear-gradient(90deg, rgba(91,191,133,0.55), var(--green-light));}
.vb-pct{font-family:var(--mono);font-size:12px;font-weight:600;text-align:right;
  color:rgba(245,244,240,0.86);font-variant-numeric:tabular-nums;}
.vb-note{font-family:var(--body);font-size:14px;line-height:1.65;
  color:rgba(245,244,240,0.78);margin:0;}
.vb-note strong{color:var(--white);font-weight:600;}
.vb-links{margin-top:10px;font-family:var(--mono);font-size:10px;font-weight:700;
  letter-spacing:0.09em;text-transform:uppercase;display:flex;gap:14px;flex-wrap:wrap;}
.vb-links a{color:var(--green-light);text-decoration:none;}
.vb-links a:hover{text-decoration:underline;}
@media(max-width:760px){ .vb-body{grid-template-columns:1fr;gap:16px;} }

/* ── TOOLBAR ── search sits with the table now, and Compare is reachable without a drawer ── */
.cf-toolbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px;}
.cf-search-wrap{flex:1 1 260px;min-width:0;}
.cf-compare-btn{display:inline-flex;align-items:center;gap:8px;flex-shrink:0;
  font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:0.09em;
  text-transform:uppercase;color:rgba(245,244,240,0.8);
  background:rgba(255,255,255,0.045);border:1px solid rgba(255,255,255,0.11);
  border-radius:9px;padding:11px 15px;cursor:pointer;transition:all .15s;}
.cf-compare-btn svg{width:15px;height:15px;}
.cf-compare-btn:hover{color:var(--white);background:rgba(255,255,255,0.08);
  border-color:rgba(255,255,255,0.2);}
.cf-compare-btn.on{color:var(--green-light);background:rgba(91,191,133,0.11);
  border-color:rgba(91,191,133,0.32);}
.cf-compare-btn:focus-visible{outline:2px solid var(--green-light);outline-offset:2px;}

.cmp-panel{margin-bottom:16px;border-radius:13px;overflow:hidden;
  background:linear-gradient(168deg, rgba(26,24,21,0.86) 0%, rgba(20,19,17,0.7) 100%);
  border:1px solid rgba(255,255,255,0.09);
  box-shadow:0 1px 0 rgba(255,255,255,0.04) inset, 0 18px 44px -30px rgba(0,0,0,0.9);}
.cmp-pickers{display:flex;align-items:flex-end;gap:14px;padding:16px 20px;flex-wrap:wrap;
  border-bottom:1px solid rgba(255,255,255,0.07);}
.cmp-field{display:flex;flex-direction:column;gap:6px;flex:1 1 200px;min-width:0;}
.cmp-lbl{font-family:var(--mono);font-size:9.5px;font-weight:700;letter-spacing:0.13em;
  text-transform:uppercase;color:rgba(245,244,240,0.5);}
.cmp-vs{font-family:var(--display);font-style:italic;font-size:16px;
  color:rgba(245,244,240,0.45);padding-bottom:9px;}

.cmp-empty{padding:26px 20px;text-align:center;font-family:var(--body);font-size:13px;
  color:rgba(245,244,240,0.5);}

/* A styled select. The native control was a bare browser dropdown in the middle of a dark,
   considered page — the single loudest "unfinished" tell on the tab. */

/* The open list is drawn by the OS, so only colours carry over — but they carry. */

/* Scrollbars, styled to match rather than defaulting to the OS grey. */
.cmp-result,.cf-table-wrap{scrollbar-width:thin;
  scrollbar-color:rgba(255,255,255,0.18) transparent;}
.cmp-result::-webkit-scrollbar,
.cf-table-wrap::-webkit-scrollbar{width:9px;height:9px;}
.cmp-result::-webkit-scrollbar-track,
.cf-table-wrap::-webkit-scrollbar-track{background:transparent;}
.cmp-result::-webkit-scrollbar-thumb,
.cf-table-wrap::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.16);border-radius:5px;
  border:2px solid transparent;background-clip:content-box;}
.cmp-result::-webkit-scrollbar-thumb:hover,
.cf-table-wrap::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,0.3);
  background-clip:content-box;}

/* ── Approach by distance and lie ── rebuilt; this panel had never rendered ── */
.appr-wrap{display:flex;flex-direction:column;gap:14px;}
.appr-grp + .appr-grp{padding-top:12px;border-top:1px solid rgba(255,255,255,0.05);}
.appr-grp-lbl{font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:0.12em;
  text-transform:uppercase;color:rgba(245,244,240,0.56);margin-bottom:7px;}
.appr-row{display:grid;grid-template-columns:70px 1fr 60px;align-items:center;gap:10px;
  padding:3px 0;}
.appr-dist{font-family:var(--mono);font-size:10.5px;letter-spacing:0.04em;
  color:rgba(245,244,240,0.62);}
.appr-track{position:relative;height:5px;border-radius:3px;
  background:rgba(255,255,255,0.05);overflow:hidden;}
.appr-zero{position:absolute;left:50%;top:0;bottom:0;width:1px;background:rgba(255,255,255,0.18);}
.appr-fill{position:absolute;top:0;bottom:0;width:var(--w,0%);border-radius:2px;}
.appr-fill.pos{left:50%;background:var(--green-light);}
.appr-fill.neg{right:50%;background:#C96A5A;}
.appr-val{font-family:var(--mono);font-size:10.5px;text-align:right;
  font-variant-numeric:tabular-nums;}
.appr-val.pos{color:var(--green-light);}
.appr-val.neg{color:#C96A5A;}
/* A bucket the feed itself flags as thin is dimmed rather than presented as a measurement. */
.appr-thin{opacity:0.5;}
.appr-row-na .appr-val{color:rgba(245,244,240,0.34);}
.appr-foot{font-family:var(--body);font-size:11px;line-height:1.5;
  color:rgba(245,244,240,0.5);margin-top:11px;}

/* ── Field tab v4 ─────────────────────────────────────────────────────────────

   Header labels must not wrap. Widening the column did not help because the button is a flex
   item that will happily shrink and break — the fix is nowrap on the control itself. */
.cf-hbtn{white-space:nowrap;}
.cf-th{min-width:0;}

.vb-why{display:block;margin-top:9px;font-size:12.5px;line-height:1.6;
  color:rgba(245,244,240,0.56);}
.cf-foot{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;}
.cf-foot-note{font-family:var(--body);font-size:11.5px;line-height:1.55;
  color:rgba(245,244,240,0.5);max-width:76ch;text-align:left;text-transform:none;
  letter-spacing:0;font-weight:400;}

/* The drawer's Compare button was a solid mustard block — the last loud yellow control on the
   page, and it did not match the toolbar button that now does the same job. */
.drawer-compare-btn{background:rgba(255,255,255,0.045);color:rgba(245,244,240,0.82);
  border:1px solid rgba(255,255,255,0.11);border-radius:9px;padding:10px 16px;
  font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:0.09em;
  text-transform:uppercase;cursor:pointer;transition:all .15s;white-space:nowrap;}
.drawer-compare-btn:hover{color:var(--white);background:rgba(255,255,255,0.08);
  border-color:rgba(255,255,255,0.2);}
.drawer-compare-btn:focus-visible{outline:2px solid var(--green-light);outline-offset:2px;}

/* ── Searchable player picker ── */
.cb{position:relative;display:flex;flex-direction:column;gap:6px;min-width:0;}
.cb-control{position:relative;display:flex;align-items:center;}
.cb-input{width:100%;font-family:var(--body);font-size:13.5px;font-weight:500;
  color:var(--white);background:rgba(255,255,255,0.05);
  border:1px solid rgba(255,255,255,0.12);border-radius:9px;
  padding:10px 38px 10px 13px;transition:all .15s;}
.cb-input::placeholder{color:rgba(245,244,240,0.4);font-weight:400;}
.cb-input:hover{border-color:rgba(255,255,255,0.22);background:rgba(255,255,255,0.075);}
.cb-input:focus{outline:none;border-color:rgba(91,191,133,0.5);
  background:rgba(255,255,255,0.075);box-shadow:0 0 0 3px rgba(91,191,133,0.12);}
.cb-caret{position:absolute;right:6px;width:26px;height:26px;display:flex;align-items:center;
  justify-content:center;background:none;border:0;cursor:pointer;
  color:rgba(245,244,240,0.5);transition:color .15s, transform .18s;}
.cb-caret svg{width:11px;height:8px;}
.cb-caret:hover{color:var(--white);}
.cb.open .cb-caret{transform:rotate(180deg);}
.cb-list{display:none;position:absolute;top:calc(100% + 6px);left:0;right:0;z-index:60;
  max-height:262px;overflow-y:auto;padding:5px;border-radius:11px;
  background:linear-gradient(168deg, rgba(28,26,23,0.99) 0%, rgba(18,17,15,0.99) 100%);
  border:1px solid rgba(255,255,255,0.12);
  box-shadow:0 1px 0 rgba(255,255,255,0.05) inset, 0 22px 48px -16px rgba(0,0,0,0.9);}
.cb.open .cb-list{display:block;}
.cb-opt{padding:8px 11px;border-radius:7px;font-family:var(--body);font-size:13.5px;
  color:rgba(245,244,240,0.82);cursor:pointer;white-space:nowrap;overflow:hidden;
  text-overflow:ellipsis;}
/* Keyboard and pointer share one highlight, so arrowing and hovering never disagree. */
.cb-opt.active{background:rgba(91,191,133,0.15);color:var(--white);}
.cb-opt.sel{color:var(--green-light);}
.cb-opt:hover{background:rgba(255,255,255,0.07);color:var(--white);}
.cb-none{padding:14px 11px;font-family:var(--body);font-size:12.5px;
  color:rgba(245,244,240,0.45);text-align:center;}
.cb-list{scrollbar-width:thin;scrollbar-color:rgba(255,255,255,0.18) transparent;}
.cb-list::-webkit-scrollbar{width:9px;}
.cb-list::-webkit-scrollbar-track{background:transparent;}
.cb-list::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.16);border-radius:5px;
  border:2px solid transparent;background-clip:content-box;}
.cb-list::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,0.32);
  background-clip:content-box;}

/* Close reads as a control, not a stray glyph at the end of a row. */
.cmp-close{margin-left:auto;display:inline-flex;align-items:center;gap:7px;width:auto;height:auto;
  padding:10px 14px;font-family:var(--mono);font-size:10.5px;font-weight:700;
  letter-spacing:0.09em;text-transform:uppercase;
  color:rgba(245,244,240,0.62);background:rgba(255,255,255,0.04);
  border:1px solid rgba(255,255,255,0.11);border-radius:9px;cursor:pointer;transition:all .15s;}
.cmp-close svg{width:11px;height:11px;}
.cmp-close:hover{color:var(--white);background:rgba(255,255,255,0.08);
  border-color:rgba(255,255,255,0.22);}
.cmp-close:focus-visible{outline:2px solid var(--green-light);outline-offset:2px;}

/* ── Field tab v5 ─────────────────────────────────────────────────────────────

   THE DRAWER. It is a 420px rail, and the H2H comparison was built for the full-width panel:
   two score boxes side by side plus a category row of value/bar/label/bar/value. Inside the
   rail the right-hand player ran off the edge. Everything below stacks or shrinks rather than
   overflowing, and the drawer's own scrollbar is styled instead of left as OS grey. */
.player-drawer{scrollbar-width:thin;scrollbar-color:rgba(255,255,255,0.16) transparent;}
.player-drawer::-webkit-scrollbar{width:10px;}
.player-drawer::-webkit-scrollbar-track{background:transparent;}
.player-drawer::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.14);border-radius:5px;
  border:3px solid transparent;background-clip:content-box;}
.player-drawer::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,0.3);
  background-clip:content-box;}

.drawer-content .h2h-header{gap:8px;}
.drawer-content .h2h-pname{font-size:15px;}
.drawer-content .h2h-score-num{font-size:26px;}
.drawer-content .h2h-score-side{padding:14px 10px !important;}
.drawer-content .h2h-cat-row{grid-template-columns:1fr 82px 1fr;gap:7px;}
.drawer-content .h2h-val{font-size:10.5px;}
.drawer-content .h2h-cat-label{font-size:10.5px;}
.drawer-content .h2h-weight-note{font-size:8.5px;}
/* Nothing inside the rail may set its own width larger than the rail. */
.drawer-content .h2h-result,
.drawer-content .h2h-result *{max-width:100%;box-sizing:border-box;}
.drawer-content table{table-layout:fixed;width:100%;}

/* ── Event history ── grouped by year, venue named once ── */
.eh-wrap{border-top:1px solid rgba(255,255,255,0.07);padding:16px 22px 18px;}
.eh-head{font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:0.13em;
  text-transform:uppercase;color:rgba(245,244,240,0.6);margin-bottom:12px;}
.eh-year + .eh-year{margin-top:12px;padding-top:12px;
  border-top:1px solid rgba(255,255,255,0.05);}
.eh-year-head{display:flex;align-items:baseline;gap:9px;margin-bottom:7px;}
.eh-yr{font-family:var(--mono);font-size:12px;font-weight:700;letter-spacing:0.06em;
  color:rgba(245,244,240,0.78);}
.eh-venue{font-family:var(--mono);font-size:9.5px;letter-spacing:0.04em;
  color:rgba(245,244,240,0.45);}
/* Name and finish on one row with a leader rule between, so the eye does not cross a void. */
.eh-row{display:flex;align-items:baseline;gap:10px;padding:4px 0;}
.eh-name{font-family:var(--body);font-size:13px;color:rgba(245,244,240,0.82);flex:0 1 auto;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.eh-row::after{content:'';flex:1 1 auto;height:1px;margin-bottom:3px;
  background:repeating-linear-gradient(90deg, rgba(255,255,255,0.13) 0 2px, transparent 2px 5px);}
.eh-fin{font-family:var(--mono);font-size:13px;font-weight:600;flex:0 0 auto;
  font-variant-numeric:tabular-nums;order:3;}
.eh-top5{color:var(--green-light);}
.eh-top20{color:var(--gold);}
.eh-back{color:rgba(245,244,240,0.55);}
.eh-none{color:rgba(245,244,240,0.3);}
@media(max-width:520px){ .eh-wrap{padding:14px 16px 16px;} }

/* Empty field — off week, or before the next field lands. Found by the state harness:
   the table used to render a header row over blank space. */
.cf-empty{padding:44px 24px;text-align:center;border:1px solid var(--border);border-radius:14px;
  background:linear-gradient(168deg, rgba(26,24,21,0.7) 0%, rgba(20,19,17,0.55) 100%);}
.cf-empty-title{font-family:var(--mono);font-size:13px;font-weight:700;letter-spacing:0.1em;
  text-transform:uppercase;color:rgba(245,244,240,0.72);margin-bottom:10px;}
.cf-empty p{font-family:var(--body);font-size:13px;line-height:1.6;
  color:rgba(245,244,240,0.55);margin:0 auto;max-width:46ch;}

/* ── Form Trends ──────────────────────────────────────────────────────────────
   Reuses the Field table system wholesale — .cf-table-wrap, .cf-table-head, .cf-row, .cf-th,
   .cf-hbtn — so the two tabs are one table with different columns rather than two tables that
   happen to look similar. Only the cells unique to this tab are defined here. */
.ft-record{display:flex;flex-direction:column;align-items:center;gap:5px;line-height:1;}
.ft-rec-main{display:inline-flex;align-items:baseline;gap:5px;font-family:var(--mono);
  font-size:16px;font-weight:500;color:rgba(245,244,240,0.88);
  font-variant-numeric:tabular-nums;}
.ft-rec-main em{font-style:normal;color:rgba(245,244,240,0.38);margin:0 1px;}
.ft-rec-unit{font-style:normal;font-size:8.5px;font-weight:600;letter-spacing:0.1em;
  text-transform:uppercase;color:rgba(245,244,240,0.42);}
.ft-rec-sub{font-family:var(--mono);font-size:10px;letter-spacing:0.04em;
  color:rgba(245,244,240,0.55);font-variant-numeric:tabular-nums;}
.ft-rec-sub.zero{color:rgba(245,244,240,0.3);}

/* The six slots are a timeline, so the header says which end is now — once, rather than
   repeating a direction label on all 50 rows. */
.ft-th-last6{display:flex;align-items:center;justify-content:space-between;width:100%;gap:14px;}
.ft-tl{display:inline-flex;align-items:center;gap:7px;flex:0 0 auto;font-size:8.5px;
  font-weight:600;letter-spacing:0.14em;color:rgba(245,244,240,0.34);}
.ft-tl-line{display:block;width:46px;height:1px;
  background:linear-gradient(90deg,rgba(255,255,255,0) 0%,rgba(255,255,255,0.32) 100%);}
/* Unit suffix on a header, so "Season SG" keeps its unit without eating the column. */
.ft-th-u{font-size:8.5px;font-weight:600;letter-spacing:0.08em;opacity:0.55;}

.ft-boxes{display:flex;align-items:center;gap:5px;flex-wrap:nowrap;}
.ft-box{flex:1 1 0;min-width:0;text-align:center;padding:6px 3px;border-radius:6px;
  font-family:var(--mono);font-size:11.5px;font-weight:600;letter-spacing:0.02em;
  background:rgba(255,255,255,0.04);color:rgba(245,244,240,0.62);
  font-variant-numeric:tabular-nums;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
/* THE finish scale — gold 1-10, green 11-20, neutral to the cut line, red for a missed cut.
   .win is a weight change inside the gold band, not a fifth colour. */
.ft-box.top10{background:rgba(201,168,76,0.22);color:#EBD289;font-weight:600;}
.ft-box.top10.win{background:rgba(201,168,76,0.4);color:#FBEDBE;font-weight:700;}
/* Green stays flat on purpose: the contrast between a lit gold and an unlit green is what makes
   the ranking legible at a glance. */
.ft-box.top20{background:rgba(91,191,133,0.14);color:var(--green-light);}
.ft-box.made{background:rgba(255,255,255,0.05);color:rgba(245,244,240,0.66);}
.ft-box.cut{background:rgba(201,106,90,0.12);color:rgba(201,106,90,0.85);}
.ft-box.clickable{cursor:pointer;transition:filter .14s,transform .14s;}
.ft-box.clickable:hover{filter:brightness(1.35);transform:translateY(-1px);}
/* Did not play. Deliberately the quietest thing in the row — an absence, not a result. */
.ft-box.none{background:transparent;color:rgba(245,244,240,0.22);}
/* The newest of the six. The header names this end "latest"; the ring is the per-row echo, and
   it stays on an empty slot because that slot is still the latest event. */
.ft-box.latest{box-shadow:inset 0 0 0 1px rgba(255,255,255,0.16);}
.ft-box.none.latest{box-shadow:inset 0 0 0 1px rgba(255,255,255,0.07);}

.ft-sg{font-family:var(--mono);font-size:13.5px;font-weight:500;text-align:center;
  font-variant-numeric:tabular-nums;color:rgba(245,244,240,0.62);}
.ft-sg.strong{font-size:16px;color:rgba(245,244,240,0.9);}

/* The trend is a signed number, not a named tier. Tiers described a LEVEL while sitting beside
   a delta describing a TREND, and 6% of rows contradicted themselves. */
.ft-trend{font-family:var(--mono);font-size:15px;font-weight:600;text-align:center;
  font-variant-numeric:tabular-nums;display:flex;align-items:center;justify-content:center;
  gap:4px;}
.ft-trend .ft-arrow{font-size:10px;opacity:0.85;}
.ft-trend.up{color:var(--green-light);}
.ft-trend.dn{color:#C96A5A;}
.ft-trend.fl{color:rgba(245,244,240,0.55);}
.ft-trend.dim{color:rgba(245,244,240,0.32);font-size:14px;}
/* A thin recent window is shown, but shown as thin. */
.ft-trend.thin{opacity:0.62;}

@media(max-width:900px){
  .cf-row.ft-row{grid-template-columns:auto 1fr auto;
    grid-template-areas:"rank player record" "results results results" "season recent trend";
    row-gap:12px;}
  .ft-c-rank{grid-area:rank;}
  .ft-c-av{display:none;}
  .ft-c-player{grid-area:player;}
  .ft-c-record{grid-area:record;justify-self:end;}
  .ft-c-results{grid-area:results;}
  .ft-c-season{grid-area:season;justify-self:start;}
  .ft-c-recent{grid-area:recent;justify-self:center;}
  .ft-c-trend{grid-area:trend;justify-self:end;}
  .ft-box{font-size:10.5px;padding:6px 2px;}
  .ft-rec-main{font-size:15px;}
}

/* ── THE WEEK HOLD ────────────────────────────────────────────────────────────
   Hides a tab's own content behind a class rather than replacing it, so the moment the hold
   lifts the tab is intact without a reload. */
.tab-content.is-held > *:not(.hold-gate){display:none !important;}
.hold-gate{padding:8px 0 32px;}
.hold-card{position:relative;display:flex;align-items:center;justify-content:space-between;
  gap:32px;flex-wrap:wrap;width:100%;margin:16px 0 0;padding:24px 28px;
  background:linear-gradient(140deg,rgba(255,255,255,0.05),rgba(255,255,255,0.015));
  border:1px solid rgba(255,255,255,0.09);border-radius:14px;
  box-shadow:0 18px 44px rgba(0,0,0,0.3),inset 0 1px 0 rgba(255,255,255,0.06);}
.hold-main{flex:1 1 460px;min-width:0;}
.hold-eyebrow{font-family:var(--mono);font-size:9.5px;font-weight:700;letter-spacing:0.18em;
  text-transform:uppercase;color:var(--gold);margin-bottom:9px;}
.hold-title{font-family:var(--display);font-size:23px;font-weight:400;font-style:italic;
  color:var(--white);margin:0 0 9px;line-height:1.25;}
.hold-body{font-family:var(--body);font-size:13px;line-height:1.62;
  color:rgba(245,244,240,0.58);margin:0;max-width:74ch;}
.hold-body b{color:rgba(245,244,240,0.9);font-weight:600;}
.hold-actions{display:flex;gap:10px;flex-wrap:wrap;flex:0 0 auto;}
.hold-btn{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:0.1em;
  text-transform:uppercase;padding:11px 18px;border-radius:9px;cursor:pointer;
  background:rgba(201,168,76,0.14);border:1px solid rgba(201,168,76,0.32);color:var(--gold);
  transition:background .15s,border-color .15s;}
.hold-btn:hover{background:rgba(201,168,76,0.22);border-color:rgba(201,168,76,0.5);}
.hold-btn.ghost{background:rgba(255,255,255,0.04);border-color:rgba(255,255,255,0.12);
  color:rgba(245,244,240,0.72);}
.hold-btn.ghost:hover{background:rgba(255,255,255,0.08);color:var(--white);}
.dl-status-note.hold{color:rgba(245,244,240,0.66);}

/* ── ARCHIVE EVENT MODAL ──────────────────────────────────────────────────── */
.evt-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.66);backdrop-filter:blur(3px);
  opacity:0;pointer-events:none;transition:opacity .2s;z-index:470;}
.evt-overlay.show{opacity:1;pointer-events:auto;}
.evt-modal{position:fixed;top:50%;left:50%;transform:translate(-50%,-48%) scale(0.985);
  width:min(1060px,94vw);max-height:86vh;overflow:auto;z-index:480;
  background:var(--black-card);border:1px solid rgba(255,255,255,0.1);border-radius:16px;
  box-shadow:0 40px 100px rgba(0,0,0,0.6);opacity:0;pointer-events:none;
  transition:opacity .2s,transform .2s;
  scrollbar-width:thin;scrollbar-color:rgba(255,255,255,0.16) transparent;}
.evt-modal.show{opacity:1;pointer-events:auto;transform:translate(-50%,-50%) scale(1);}
.evt-modal::-webkit-scrollbar{width:10px;}
.evt-modal::-webkit-scrollbar-track{background:transparent;}
.evt-modal::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.14);border-radius:5px;
  border:3px solid transparent;background-clip:content-box;}
.evt-close{position:absolute;top:14px;right:16px;z-index:2;width:32px;height:32px;
  display:flex;align-items:center;justify-content:center;font-size:22px;line-height:1;
  background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.1);border-radius:8px;
  color:rgba(245,244,240,0.7);cursor:pointer;transition:background .15s,color .15s;}
.evt-close:hover{background:rgba(255,255,255,0.11);color:var(--white);}
.evt-head{padding:28px 30px 20px;border-bottom:1px solid rgba(255,255,255,0.07);}
.evt-eyebrow{font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:0.18em;
  text-transform:uppercase;color:var(--gold);margin-bottom:10px;}
.evt-title{font-family:var(--display);font-size:26px;font-weight:400;font-style:italic;
  color:var(--white);margin:0 0 10px;line-height:1.15;}
.evt-meta{display:flex;flex-wrap:wrap;gap:6px 16px;font-family:var(--mono);font-size:10.5px;
  letter-spacing:0.08em;text-transform:uppercase;color:rgba(245,244,240,0.5);}
.evt-table{min-width:640px;}
.evt-thead,.evt-row{display:grid;grid-template-columns:var(--evt-cols);align-items:center;
  gap:10px;padding:0 30px;}
.evt-thead{height:42px;background:rgba(255,255,255,0.02);
  border-bottom:1px solid rgba(255,255,255,0.07);position:sticky;top:0;z-index:1;
  backdrop-filter:blur(8px);}
.evt-th{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:0.1em;
  text-transform:uppercase;color:rgba(250,250,250,0.6);}
.evt-th.c{text-align:center;}
.evt-row{min-height:44px;border-bottom:1px solid rgba(255,255,255,0.035);}
.evt-row:last-child{border-bottom:none;}
.evt-row:hover{background:rgba(255,255,255,0.025);}
.evt-rank{font-family:var(--mono);font-size:12px;color:rgba(250,250,250,0.4);
  font-variant-numeric:tabular-nums;}
.evt-player{font-size:13.5px;font-weight:600;color:var(--white);overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap;}
.evt-fin{font-family:var(--mono);font-size:12.5px;font-weight:700;text-align:center;
  font-variant-numeric:tabular-nums;}
.evt-fin.top10{color:#EBD289;}
.evt-fin.top20{color:var(--green-light);}
.evt-fin.made{color:rgba(245,244,240,0.62);}
.evt-fin.cut{color:rgba(201,106,90,0.85);}
.evt-fin.none{color:rgba(245,244,240,0.4);}
.evt-num{font-family:var(--mono);font-size:12.5px;text-align:center;
  color:rgba(245,244,240,0.66);font-variant-numeric:tabular-nums;}
.evt-num.strong{color:var(--white);font-weight:600;}
.evt-sg{font-family:var(--mono);font-size:11.5px;text-align:center;
  font-variant-numeric:tabular-nums;}
.evt-sg.pos{color:var(--green-light);}
.evt-sg.neg{color:#C96A5A;}
.evt-sg.zero{color:rgba(245,244,240,0.45);}
.evt-na{color:rgba(245,244,240,0.26);}
.evt-foot{padding:16px 30px 24px;font-family:var(--body);font-size:11.5px;line-height:1.6;
  color:rgba(245,244,240,0.48);border-top:1px solid rgba(255,255,255,0.05);}
.evt-loading,.evt-empty{padding:56px 30px;text-align:center;}
.evt-empty-title{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:0.14em;
  text-transform:uppercase;color:rgba(245,244,240,0.72);margin-bottom:10px;}
.evt-empty p,.evt-loading{font-family:var(--body);font-size:13px;line-height:1.65;
  color:rgba(245,244,240,0.55);max-width:46ch;margin:0 auto;}
@media(max-width:900px){
  .evt-modal{width:96vw;max-height:90vh;}
  .evt-head{padding:22px 18px 16px;}
  .evt-title{font-size:21px;}
  .evt-thead,.evt-row{padding:0 18px;gap:8px;}
  .evt-foot{padding:14px 18px 20px;}
  .hold-card{padding:20px 16px;gap:18px;}
  .hold-title{font-size:19px;}
  .hold-actions{width:100%;}
  .hold-btn{flex:1 1 auto;justify-content:center;}
}

/* Scope switch on Form Trends — the field, or the whole tour. */
.ft-scope{flex:0 0 auto;}
.ft-scope .cf-seg-btn{padding:7px 12px;}
.ft-seg-n{font-size:9px;font-weight:600;opacity:0.55;margin-left:5px;
  font-variant-numeric:tabular-nums;}

/* A tab that fails to load says so. Silence is indistinguishable from having nothing to show. */
.tab-error{max-width:520px;margin:40px auto;padding:24px 26px;text-align:center;
  background:rgba(201,106,90,0.06);border:1px solid rgba(201,106,90,0.24);border-radius:12px;}
.tab-error-title{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:0.14em;
  text-transform:uppercase;color:#C96A5A;margin-bottom:10px;}
.tab-error p{font-family:var(--body);font-size:13px;line-height:1.6;
  color:rgba(245,244,240,0.62);margin:0 0 8px;}
.tab-error-raw{font-family:var(--mono) !important;font-size:11px !important;
  color:rgba(201,106,90,0.8) !important;word-break:break-word;margin:0 0 10px !important;}
.tab-error-hint{font-size:12px !important;color:rgba(245,244,240,0.42) !important;margin:0 !important;}

/* ── WEATHER, folded onto Overview ────────────────────────────────────────────
   It is week context, like the course card, so it sits with it instead of owning a tab.
   Collapsible because a reader who does not care about the forecast should be able to
   put it away and have it stay away. */
.ovw-card{padding:0;overflow:hidden;}
.ovw-head{display:flex;align-items:center;gap:14px;width:100%;padding:16px 20px;
  background:none;border:0;cursor:pointer;text-align:left;color:inherit;
  transition:background .15s;}
.ovw-head:hover{background:rgba(255,255,255,0.025);}
.ovw-head:focus-visible{outline:2px solid var(--green-light);outline-offset:-2px;}
.ovw-title{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:0.16em;
  text-transform:uppercase;color:var(--gold);flex:0 0 auto;}
.ovw-place{color:rgba(245,244,240,0.5);}
.ovw-now{flex:1 1 auto;font-family:var(--mono);font-size:13px;font-weight:500;
  color:rgba(245,244,240,0.88);font-variant-numeric:tabular-nums;}
.ovw-now span{color:rgba(245,244,240,0.5);margin-left:8px;font-size:11.5px;}
.ovw-chev{width:12px;height:12px;flex:0 0 auto;color:rgba(245,244,240,0.4);
  transition:transform .2s;}
.ovw-card.collapsed .ovw-chev{transform:rotate(-90deg);}
.ovw-body{padding:0 20px 18px;}
.ovw-card.collapsed .ovw-body{display:none;}
/* The forecast is a summary here, not a page, so it stays compact. */
.ovw-body .wx-current{display:none;}
.ovw-body .wx-section-label{display:none;}
.ovw-body .wx-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;}
.ovw-body .wx-day-card{padding:12px 10px;}
.ovw-body .wx-note{margin-top:12px;}
@media(max-width:900px){
  .ovw-body .wx-grid{grid-template-columns:repeat(2,1fr);}
  .ovw-head{padding:14px 16px;gap:10px;}
  .ovw-body{padding:0 16px 16px;}
}

/* ── WIN PROBABILITY, as the Field board's second view ───────────────────────
   Same table system as the ranking view, so the two read as one board seen two ways. */
.cf-view{flex:0 0 auto;}
.cf-view .cf-seg-btn{padding:7px 13px;}
.fp-note{font-family:var(--body);font-size:12.5px;line-height:1.65;
  color:rgba(245,244,240,0.58);margin:0 0 14px;padding-top:2px;}
.fp-note b{color:rgba(245,244,240,0.9);font-weight:600;}
.fp-note.warn{color:rgba(232,206,132,0.85);}
.fp-link{font:inherit;color:var(--green-light);background:none;border:0;padding:0;
  cursor:pointer;text-decoration:underline;text-underline-offset:2px;}
.fp-link:hover{color:var(--white);}
.fp-num{font-family:var(--mono);font-size:13.5px;text-align:center;
  font-variant-numeric:tabular-nums;color:rgba(245,244,240,0.66);}
/* The column being sorted on is the one being read; the rest are context. */
.fp-num.lead{font-size:16px;font-weight:500;color:rgba(245,244,240,0.92);}
.fp-na{color:rgba(245,244,240,0.26);}
@media(max-width:900px){
  .cf-row.fp-row{grid-template-columns:auto 1fr auto;
    grid-template-areas:"rank player win" "mkts mkts mkts";row-gap:12px;}
  .fp-c-rank{grid-area:rank;}
  .fp-c-av{display:none;}
  .fp-c-player{grid-area:player;}
  .fp-c-win{grid-area:win;justify-self:end;}
  .fp-c-top_5,.fp-c-top_10,.fp-c-top_20{grid-area:mkts;}
  .cf-row.fp-row{grid-template-areas:"rank player win" "t5 t10 t20";}
  .fp-c-top_5{grid-area:t5;}.fp-c-top_10{grid-area:t10;}.fp-c-top_20{grid-area:t20;}
}

/* ── Polish ──────────────────────────────────────────────────────────────────
   The forecast note sat in its own band of empty space below the round cards. */
.ovw-body .wx-note{padding:0;margin-top:10px;font-size:10.5px;}
.ovw-body .wx-grid{padding:0;}

/* The course strip was tall because the number, its label and its footnote each had their own
   generous block. Tightened the leading between them instead of shrinking the type — the 33px
   figure is the whole point of the card. */
.cp-card{padding:14px 22px 12px;}
.cc-strip-head{margin-bottom:10px;}
.cc-stat-val{font-size:31px;}
.cc-stat-lbl{margin-top:6px;}
.cc-stat-sub{margin-top:2px;line-height:1.3;}
.cc-stats{gap:14px;}

/* ── Outrights: market selector ──────────────────────────────────────────────
   Labelled and above the board rather than tucked into the header actions, because choosing the
   market is the first decision on this tab, not a refinement of it. */
.vf-market{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:0 0 16px;}
.vf-market-label{font-family:var(--mono);font-size:9.5px;font-weight:700;letter-spacing:0.18em;
  text-transform:uppercase;color:rgba(245,244,240,0.42);}
.vf-market-seg{display:inline-flex;align-items:stretch;border:1px solid rgba(255,255,255,0.1);
  border-radius:9px;overflow:hidden;background:rgba(255,255,255,0.03);}
.vf-market-btn{font-family:var(--mono);font-size:11.5px;font-weight:700;letter-spacing:0.09em;
  color:rgba(250,250,250,0.58);background:none;border:0;
  border-left:1px solid rgba(255,255,255,0.08);padding:9px 18px;cursor:pointer;line-height:1;
  transition:color .14s,background .14s;}
.vf-market-btn:first-child{border-left:0;}
.vf-market-btn:hover{color:var(--white);background:rgba(255,255,255,0.06);}
.vf-market-btn.on{color:var(--gold);background:rgba(201,168,76,0.14);}
.vf-market-btn:focus-visible{outline:2px solid var(--green-light);outline-offset:-2px;}
.vf-market-count{font-family:var(--mono);font-size:10.5px;letter-spacing:0.08em;
  color:rgba(245,244,240,0.4);font-variant-numeric:tabular-nums;}

/* ── Outrights: the board, on the Field table system ─────────────────────── */
.vf-odds{font-family:var(--mono);font-size:15px;font-weight:500;text-align:center;
  color:var(--gold);font-variant-numeric:tabular-nums;}
.vf-edge{font-family:var(--mono);font-size:15px;font-weight:600;text-align:center;
  font-variant-numeric:tabular-nums;}
.vf-edge.strong{color:var(--green-light);}
.vf-edge.pos{color:rgba(91,191,133,0.8);}
.vf-edge.neg{color:#C96A5A;}
.vf-edge.dim{color:rgba(245,244,240,0.4);}
.vf-num{font-family:var(--mono);font-size:13.5px;text-align:center;
  color:rgba(245,244,240,0.66);font-variant-numeric:tabular-nums;}
.vf-shop{font-family:var(--mono);font-size:13.5px;text-align:center;
  color:rgba(245,244,240,0.5);font-variant-numeric:tabular-nums;}
/* Worth the trip to another book. */
.vf-shop.worth{color:var(--gold);font-weight:600;}
.vf-book{font-family:var(--mono);font-size:10.5px;letter-spacing:0.06em;text-align:center;
  color:rgba(245,244,240,0.56);}
/* .cf-th is a flex row, so a non-sortable header needs centring explicitly -- the sortable ones
   get it from .cf-hbtn.center and this one was left ranged left over centred cells. */
.cf-th.vf-c-book{justify-content:center;}
.vf-move{text-align:center;}
@media(max-width:900px){
  .cf-row.vf-row2{grid-template-columns:auto 1fr auto;
    grid-template-areas:"rank player odds" "edge prob shop" "book book book";row-gap:11px;}
  .vf-c-rank{grid-area:rank;}
  .vf-c-av{display:none;}
  .vf-c-player{grid-area:player;}
  .vf-c-odds{grid-area:odds;justify-self:end;}
  .vf-c-edge{grid-area:edge;justify-self:start;}
  .vf-c-prob{grid-area:prob;}
  .vf-c-shop{grid-area:shop;justify-self:end;}
  .vf-c-book{grid-area:book;text-align:left;}
  .vf-market{gap:10px;}
  .vf-market-btn{padding:8px 13px;font-size:11px;}
}

/* ── Live board, on the shared table system ─────────────────────────────────
   Fourteen columns is a lot, so the mobile reflow groups them by what they answer:
   where the player stands, how the round is going, and what the model now thinks. */
.lv-c-pos{font-family:var(--mono);font-size:13px;font-weight:600;
  color:rgba(245,244,240,0.78);font-variant-numeric:tabular-nums;}
.lv-c-player{display:flex;align-items:center;gap:8px;min-width:0;}
.lv-c-total,.lv-c-today{text-align:center;font-variant-numeric:tabular-nums;}
.lv-c-thru,.lv-c-ott,.lv-c-app,.lv-c-arg,.lv-c-putt,
.lv-c-win,.lv-c-t5,.lv-c-t10,.lv-c-t20{text-align:center;font-variant-numeric:tabular-nums;}
.cf-row.lv-row.is-pick{background:rgba(201,168,76,0.06);}
.cf-row.lv-row.is-pick:hover{background:rgba(201,168,76,0.1);}
@media(max-width:900px){
  .cf-row.lv-row{grid-template-columns:auto 1fr auto auto;
    grid-template-areas:"pos player total today" "thru win t5 t10"
                        "ott app arg putt";
    row-gap:12px;}
  .lv-c-pos{grid-area:pos;}
  .lv-c-av{display:none;}
  .lv-c-player{grid-area:player;}
  .lv-c-total{grid-area:total;}
  .lv-c-today{grid-area:today;}
  .lv-c-thru{grid-area:thru;}
  .lv-c-win{grid-area:win;}
  .lv-c-t5{grid-area:t5;}
  .lv-c-t10{grid-area:t10;}
  /* Top 20 is the least-consulted of the four and the one to drop when space runs out. */
  .lv-c-t20{display:none;}
  .lv-c-ott{grid-area:ott;}
  .lv-c-app{grid-area:app;}
  .lv-c-arg{grid-area:arg;}
  .lv-c-putt{grid-area:putt;}
}

/* ── PRACTICE LIBRARY ────────────────────────────────────────────────────────
   Two levels: pick a part of the game, then work through its drills. A flat list of 32
   accordions made the reader scan everything to find anything, and every category tag was the
   same green, so the one piece of structure the data carried was invisible.

   --cat is set per card, per header and per drill, so a colour always means the same part of
   the game wherever it appears. */
/* Explicit counts, not auto-fit: auto-fit landed on four across and left Mental stranded on a
   row of its own, which reads as a layout accident. Five, or three-then-two, both look chosen. */
.pr-cat-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;}
@media(max-width:1400px){.pr-cat-grid{grid-template-columns:repeat(3,1fr);}}
@media(max-width:820px){.pr-cat-grid{grid-template-columns:repeat(2,1fr);}}
.pr-cat-card{position:relative;overflow:hidden;display:flex;flex-direction:column;gap:7px;
  text-align:left;cursor:pointer;padding:18px 18px 14px;border-radius:15px;
  background:linear-gradient(165deg,rgba(255,255,255,0.048),rgba(255,255,255,0.012));
  border:1px solid rgba(255,255,255,0.08);color:inherit;
  box-shadow:0 1px 0 rgba(255,255,255,0.04) inset,0 18px 40px -30px rgba(0,0,0,0.9);
  transition:transform .16s,border-color .16s,box-shadow .16s;}
.pr-cat-card:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--cat) 42%,transparent);
  box-shadow:0 1px 0 rgba(255,255,255,0.06) inset,0 22px 46px -28px rgba(0,0,0,0.95);}
.pr-cat-card:focus-visible{outline:2px solid var(--cat);outline-offset:3px;}
/* The colour arrives as a rule down the edge rather than a wash, so five cards side by side
   stay legible instead of turning into five tinted panels. */
/* A stroked mark in the category colour, in a tinted well. The colour is carried by something
   drawn rather than a bar stuck to the edge. */
.pr-mark{width:34px;height:34px;border-radius:9px;display:flex;align-items:center;
  justify-content:center;color:var(--cat);
  background:color-mix(in srgb,var(--cat) 11%,transparent);
  border:1px solid color-mix(in srgb,var(--cat) 22%,transparent);
  transition:background .16s,border-color .16s;}
.pr-mark svg{width:19px;height:19px;}
.pr-cat-card:hover .pr-mark{background:color-mix(in srgb,var(--cat) 18%,transparent);
  border-color:color-mix(in srgb,var(--cat) 38%,transparent);}
.pr-cat-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:3px;}
.pr-cat-name{font-family:var(--display);font-size:22px;font-weight:500;color:var(--white);
  letter-spacing:-0.01em;line-height:1.15;}
.pr-cat-n{font-family:var(--mono);font-size:19px;font-weight:500;color:var(--cat);
  font-variant-numeric:tabular-nums;line-height:1;}
.pr-cat-blurb{font-family:var(--body);font-size:13px;line-height:1.5;
  color:rgba(245,244,240,0.62);min-height:2.9em;}
.pr-cat-note{font-family:var(--body);font-size:12px;line-height:1.55;
  color:rgba(245,244,240,0.46);}
.pr-cat-foot{display:flex;align-items:center;gap:10px;margin-top:auto;padding-top:12px;
  border-top:1px solid rgba(255,255,255,0.06);font-family:var(--mono);font-size:9.5px;
  letter-spacing:0.1em;text-transform:uppercase;color:rgba(245,244,240,0.42);}
.pr-cat-go{margin-left:auto;color:var(--cat);font-weight:700;}

.pr-all-row{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:18px;
  padding-top:16px;border-top:1px solid rgba(255,255,255,0.06);}
.pr-all-btn{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:0.1em;
  text-transform:uppercase;color:rgba(245,244,240,0.72);background:rgba(255,255,255,0.045);
  border:1px solid rgba(255,255,255,0.1);border-radius:9px;padding:10px 16px;cursor:pointer;
  transition:color .15s,background .15s;}
.pr-all-btn:hover{color:var(--white);background:rgba(255,255,255,0.08);}
.pr-all-note{font-family:var(--body);font-size:12px;line-height:1.5;
  color:rgba(245,244,240,0.44);max-width:58ch;}

.pr-crumb{margin-bottom:14px;}
.pr-back{font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:0.12em;
  text-transform:uppercase;color:rgba(245,244,240,0.5);background:none;border:0;padding:0;
  cursor:pointer;transition:color .15s;}
.pr-back:hover{color:var(--white);}
.pr-cat-head{padding-left:16px;border-left:3px solid var(--cat,rgba(255,255,255,0.16));
  margin-bottom:20px;}
.pr-cat-h{font-family:var(--display);font-size:27px;font-weight:500;color:var(--white);
  margin:0 0 6px;letter-spacing:-0.015em;}
.pr-cat-p{font-family:var(--body);font-size:13px;line-height:1.6;
  color:rgba(245,244,240,0.55);margin:0;max-width:72ch;}

.pr-list{display:flex;flex-direction:column;gap:9px;}
.pr-drill{border:1px solid rgba(255,255,255,0.075);border-radius:13px;overflow:hidden;
  background:rgba(255,255,255,0.018);transition:border-color .16s;}
.pr-drill:hover{border-color:rgba(255,255,255,0.14);}
.pr-drill.open{border-color:color-mix(in srgb,var(--cat) 34%,transparent);
  background:rgba(255,255,255,0.026);}
.pr-drill-head{display:flex;align-items:center;gap:13px;width:100%;padding:16px 18px;
  background:none;border:0;cursor:pointer;text-align:left;color:inherit;}
.pr-dot{width:7px;height:7px;border-radius:50%;background:var(--cat);flex-shrink:0;
  box-shadow:0 0 0 3px color-mix(in srgb,var(--cat) 16%,transparent);}
.pr-drill-name{font-size:15px;font-weight:600;color:var(--white);flex:1 1 auto;min-width:0;}
.pr-drill-cat{font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:0.11em;
  text-transform:uppercase;color:var(--cat);background:color-mix(in srgb,var(--cat) 13%,transparent);
  border:1px solid color-mix(in srgb,var(--cat) 26%,transparent);border-radius:5px;padding:4px 8px;
  flex-shrink:0;}
.pr-drill-time{font-family:var(--mono);font-size:11px;color:rgba(245,244,240,0.45);flex-shrink:0;
  font-variant-numeric:tabular-nums;}
.pr-chevron{width:15px;height:15px;color:rgba(245,244,240,0.4);flex-shrink:0;
  transition:transform .2s;}
.pr-drill.open .pr-chevron{transform:rotate(180deg);}
/* No inset: the spec sheet brings its own padding, and adding more shrank the diagram. */
.pr-drill-body{padding:0;}

/* The spec sheet, tinted to its category. */
.pr-spec .dr-cat{color:var(--cat);}
.pr-spec .dr-steps li::before{background:color-mix(in srgb,var(--cat) 14%,transparent);
  border-color:color-mix(in srgb,var(--cat) 34%,transparent);color:var(--cat);}
/* The band the reader filtered to is the one they are judging themselves against. */
.dr-band.on{background:rgba(255,255,255,0.055);box-shadow:inset 2px 0 0 var(--cat);}

@media(max-width:900px){
  .pr-cat-grid{grid-template-columns:1fr;}
  .pr-drill-head{padding:14px;gap:10px;}
  .pr-drill-cat{display:none;}
  .pr-drill-body{padding:0 8px 10px;}
}

/* ── Spec-sheet rules, lifted from index.html so the Lab and the homepage cannot drift ──── */
.hp-drill{background:linear-gradient(168deg,rgba(24,23,20,0.96),rgba(16,15,14,0.97));
  border:1px solid var(--border);border-radius:18px;padding:clamp(24px,3.4vw,40px);
  box-shadow:0 1px 0 rgba(255,255,255,0.04) inset,0 24px 54px -34px rgba(0,0,0,0.95);}
.dr-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;
  flex-wrap:wrap;padding-bottom:18px;border-bottom:1px solid rgba(255,255,255,0.07);}
.dr-head-l{min-width:0;}
.dr-cat{font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:0.16em;
  text-transform:uppercase;color:#E0C368;margin-bottom:9px;}
.dr-name{font-family:var(--display);font-size:clamp(26px,2.9vw,36px);font-weight:500;
  color:var(--white);margin:0;letter-spacing:-0.015em;}
.dr-meta{display:flex;gap:8px;flex-wrap:wrap;}
.dr-meta span{font-family:var(--mono);font-size:9.5px;letter-spacing:0.09em;text-transform:uppercase;
  color:rgba(250,250,250,0.6);background:rgba(255,255,255,0.05);border:1px solid var(--border);
  border-radius:999px;padding:5px 11px;white-space:nowrap;}
.dr-desc{font-size:14.5px;line-height:1.7;color:rgba(250,250,250,0.68);margin:20px 0 26px;max-width:74ch;}

.dr-body{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,0.75fr);
  gap:clamp(22px,3vw,40px);align-items:start;margin-bottom:28px;}
.dr-fig{background:rgba(255,255,255,0.022);border:1px solid var(--border);border-radius:14px;
  padding:26px;display:flex;align-items:center;justify-content:center;color:rgba(250,250,250,0.82);}
.dr-fig svg{width:100%;height:auto;}
.dr-h{font-family:var(--mono);font-size:9px;font-weight:600;letter-spacing:0.15em;
  text-transform:uppercase;color:rgba(250,250,250,0.5);margin-bottom:14px;}
.dr-steps ol{margin:0;padding:0;list-style:none;counter-reset:dr;
  display:flex;flex-direction:column;gap:13px;}
.dr-steps li{counter-increment:dr;position:relative;padding-left:30px;font-size:13.5px;
  line-height:1.6;color:rgba(250,250,250,0.72);}
.dr-steps li::before{content:counter(dr);position:absolute;left:0;top:1px;width:20px;height:20px;
  border-radius:50%;background:rgba(201,168,76,0.13);border:1px solid rgba(201,168,76,0.32);
  color:var(--gold);font-family:var(--mono);font-size:10px;font-weight:600;
  display:flex;align-items:center;justify-content:center;}

.dr-bench{padding-top:24px;border-top:1px solid rgba(255,255,255,0.07);margin-bottom:26px;}
.dr-bands{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:rgba(255,255,255,0.07);
  border:1px solid rgba(255,255,255,0.07);border-radius:12px;overflow:hidden;}
.dr-band{background:rgba(20,19,17,0.96);padding:15px 16px;display:flex;flex-direction:column;gap:8px;}
.dr-hcp{font-family:var(--mono);font-size:9px;font-weight:600;letter-spacing:0.12em;
  text-transform:uppercase;color:var(--green-light);}
.dr-mark{font-size:12.5px;line-height:1.5;color:rgba(250,250,250,0.78);}
@media(max-width:860px){.dr-bands{grid-template-columns:1fr 1fr;}}
@media(max-width:520px){.dr-bands{grid-template-columns:1fr;}}

.dr-ff{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:24px;}
.dr-f{border:1px solid var(--border);border-radius:12px;padding:18px 20px;}
.dr-f p{margin:0;font-size:13px;line-height:1.62;color:rgba(250,250,250,0.7);}
.dr-f .dr-h{display:flex;align-items:center;gap:8px;}
.dr-f .dr-h::before{content:'';width:6px;height:6px;border-radius:50%;flex-shrink:0;}
.dr-fault{background:linear-gradient(150deg,rgba(217,133,72,0.07),transparent 58%);
  border-color:rgba(217,133,72,0.22);}
.dr-fault .dr-h{color:#E0A06C;}
.dr-fault .dr-h::before{background:#D98548;box-shadow:0 0 0 3px rgba(217,133,72,0.16);}
.dr-fix{background:linear-gradient(150deg,rgba(91,191,133,0.07),transparent 58%);
  border-color:rgba(91,191,133,0.22);}
.dr-fix .dr-h{color:var(--green-light);}
.dr-fix .dr-h::before{background:var(--green-light);box-shadow:0 0 0 3px rgba(91,191,133,0.16);}
@media(max-width:700px){.dr-ff{grid-template-columns:1fr;}}

.dr-prog{padding-top:22px;border-top:1px solid rgba(255,255,255,0.07);}
.dr-prog p{margin:0;font-size:13.5px;line-height:1.65;color:rgba(250,250,250,0.68);max-width:80ch;}
@media(max-width:860px){.dr-body{grid-template-columns:1fr;}.dr-fig{order:-1;}}

/* Bands sized to what the drill actually carries — thirteen of thirty-two have two or three,
   and a fixed four-column grid rendered the gap as empty cells. */
.dr-bands{grid-template-columns:repeat(var(--n,4),1fr);}
@media(max-width:860px){.dr-bands{grid-template-columns:repeat(2,1fr);}}
@media(max-width:520px){.dr-bands{grid-template-columns:1fr;}}
.dr-aimed{margin:11px 0 0;font-family:var(--body);font-size:12px;line-height:1.55;
  color:rgba(245,244,240,0.45);}

/* Category pills: the same segmented control the rest of the Lab uses, and the active one
   takes its own category colour rather than a single green for all five. */
.pr-pill{font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:0.09em;
  text-transform:uppercase;color:rgba(245,244,240,0.55);background:rgba(255,255,255,0.035);
  border:1px solid rgba(255,255,255,0.09);border-radius:8px;padding:8px 13px;cursor:pointer;
  transition:color .14s,background .14s,border-color .14s;}
.pr-pill:hover{color:var(--white);background:rgba(255,255,255,0.07);}
.pr-pill.active{color:var(--cat,#FAFAFA);background:color-mix(in srgb,var(--cat,#FAFAFA) 13%,transparent);
  border-color:color-mix(in srgb,var(--cat,#FAFAFA) 34%,transparent);}
.pr-select{font-family:var(--mono);font-size:10.5px;letter-spacing:0.06em;
  color:rgba(245,244,240,0.66);background:rgba(255,255,255,0.035);
  border:1px solid rgba(255,255,255,0.09);border-radius:8px;padding:8px 11px;cursor:pointer;}
.pr-select:hover{color:var(--white);}

/* Native select popups are drawn by the OS in its own colours, which is why these three read as
   white panels on a black page. color-scheme tells the platform to draw the dark variant. */
.pr-select{color-scheme:dark;}
.pr-select option{background:#161614;color:#FAFAFA;}

/* What a drill trains, on the row, before you open it. */
.pr-trains{display:inline-flex;gap:5px;flex-shrink:0;}
.pr-tag{font-family:var(--mono);font-size:8.5px;font-weight:700;letter-spacing:0.1em;
  text-transform:uppercase;color:rgba(245,244,240,0.56);background:rgba(255,255,255,0.05);
  border:1px solid rgba(255,255,255,0.08);border-radius:5px;padding:4px 7px;white-space:nowrap;}
.pr-tag.lg{font-size:10px;letter-spacing:0.09em;padding:6px 11px;border-radius:7px;
  color:var(--cat);background:color-mix(in srgb,var(--cat) 11%,transparent);
  border-color:color-mix(in srgb,var(--cat) 24%,transparent);}
/* Kit reads as a caution, because it is the reason a drill is no use to you right now. */
.pr-needs{display:inline-flex;align-items:center;gap:4px;flex-shrink:0;font-family:var(--mono);
  font-size:8.5px;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;
  color:#D9A15A;background:rgba(217,161,90,0.1);border:1px solid rgba(217,161,90,0.24);
  border-radius:5px;padding:4px 7px;white-space:nowrap;}
.pr-needs svg{width:11px;height:11px;}
.pr-tag.lg.need{color:#D9A15A;background:rgba(217,161,90,0.1);border-color:rgba(217,161,90,0.26);}
.dr-trains{margin:0 0 24px;}
.dr-tagrow{display:flex;gap:8px;flex-wrap:wrap;}

@media(max-width:1100px){ .pr-trains{display:none;} }
@media(max-width:900px){ .pr-needs{display:none;} }

.pr-reset{align-items:center;gap:6px;font-family:var(--mono);font-size:10px;font-weight:700;
  letter-spacing:0.11em;text-transform:uppercase;color:rgba(245,244,240,0.6);
  background:rgba(255,255,255,0.035);border:1px solid rgba(255,255,255,0.1);border-radius:8px;
  padding:8px 12px;cursor:pointer;transition:color .14s,background .14s,border-color .14s;}
.pr-reset:hover{color:var(--white);background:rgba(255,255,255,0.08);
  border-color:rgba(255,255,255,0.2);}
.cf-empty .pr-reset{display:inline-flex;margin-top:16px;}
/* A requirement that is not a barrier: worth listing, not worth warning about. */
.pr-tag.lg.kit{color:rgba(245,244,240,0.6);background:rgba(255,255,255,0.05);
  border-color:rgba(255,255,255,0.1);}

.pr-arw{width:12px;height:12px;flex-shrink:0;margin-left:6px;
  transition:transform .16s;}
.pr-arw-l{margin-left:0;margin-right:6px;}
.pr-cat-go{display:inline-flex;align-items:center;}
.pr-cat-card:hover .pr-cat-go .pr-arw{transform:translateX(2px);}
.pr-back{display:inline-flex;align-items:center;}
.pr-back:hover .pr-arw-l{transform:translateX(-2px);}
@media(prefers-reduced-motion:reduce){.pr-arw{transition:none;}}

/* Where it opened and where the model has it, under the price you can actually get. */
.vf-odds{display:flex;flex-direction:column;align-items:center;gap:2px;line-height:1.15;}
.vf-odds-sub{display:block;font-family:var(--mono);font-size:8.5px;letter-spacing:0.02em;
  line-height:1.32;color:rgba(245,244,240,0.36);white-space:nowrap;}
.vf-move2{font-family:var(--mono);font-size:13px;font-weight:600;text-align:center;
  font-variant-numeric:tabular-nums;display:flex;align-items:center;justify-content:center;gap:4px;}
.vf-mv-a{font-size:9px;opacity:0.9;}
/* Direction, not judgement: shortening is good news for a bet already placed and bad news for
   one you are about to make, so neither gets the winning colour. */
.vf-move2.in{color:#6FA8DC;}
.vf-move2.out{color:#C99A5A;}
.vf-move2.flat,.vf-move2.none{color:rgba(245,244,240,0.34);}
@media(max-width:900px){
  .cf-row.vf-row2{grid-template-areas:"rank player odds" "edge prob shop" "move book book";}
  .vf-c-move{grid-area:move;justify-self:start;}
}

/* ── SESSION BUILDER ─────────────────────────────────────────────────────────
   The library answers "what drills exist". This answers the question people arrive with. */
.sb-form{display:flex;flex-direction:column;gap:14px;padding:20px 22px;border-radius:14px;
  background:linear-gradient(165deg,rgba(255,255,255,0.042),rgba(255,255,255,0.012));
  border:1px solid rgba(255,255,255,0.08);margin-bottom:20px;}
.sb-row{display:flex;align-items:center;gap:14px;flex-wrap:wrap;}
.sb-lbl{font-family:var(--mono);font-size:9.5px;font-weight:700;letter-spacing:0.16em;
  text-transform:uppercase;color:rgba(245,244,240,0.42);width:52px;flex-shrink:0;}
.sb-seg{display:inline-flex;border:1px solid rgba(255,255,255,0.1);border-radius:9px;
  overflow:hidden;background:rgba(255,255,255,0.03);flex-wrap:wrap;}
.sb-seg-btn{font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:0.08em;
  color:rgba(250,250,250,0.55);background:none;border:0;
  border-left:1px solid rgba(255,255,255,0.08);padding:9px 14px;cursor:pointer;line-height:1;
  transition:color .14s,background .14s;}
.sb-seg-btn:first-child{border-left:0;}
.sb-seg-btn:hover{color:var(--white);background:rgba(255,255,255,0.06);}
.sb-seg-btn.on{color:var(--gold);background:rgba(201,168,76,0.14);}
.sb-go{align-self:flex-start;margin-top:4px;font-family:var(--mono);font-size:11px;
  font-weight:700;letter-spacing:0.11em;text-transform:uppercase;color:#14120C;
  background:linear-gradient(180deg,#E0C368,#C9A84C 55%,#B08F2A);border:0;border-radius:9px;
  padding:12px 22px;cursor:pointer;
  box-shadow:0 1px 0 rgba(255,255,255,0.4) inset,0 10px 22px -14px rgba(201,168,76,0.7);
  transition:transform .15s;}
.sb-go:hover{transform:translateY(-1px);}

.sb-plan{border:1px solid rgba(255,255,255,0.08);border-radius:14px;overflow:hidden;
  background:rgba(255,255,255,0.018);}
.sb-plan-head{display:flex;justify-content:space-between;padding:13px 20px;
  background:rgba(255,255,255,0.025);border-bottom:1px solid rgba(255,255,255,0.07);
  font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:0.12em;
  text-transform:uppercase;color:rgba(245,244,240,0.5);}
.sb-step{display:flex;gap:15px;padding:17px 20px;border-bottom:1px solid rgba(255,255,255,0.04);}
.sb-step:last-of-type{border-bottom:0;}
.sb-step-n{width:26px;height:26px;flex-shrink:0;border-radius:50%;display:flex;
  align-items:center;justify-content:center;font-family:var(--mono);font-size:11px;
  font-weight:700;color:var(--cat);background:color-mix(in srgb,var(--cat) 13%,transparent);
  border:1px solid color-mix(in srgb,var(--cat) 30%,transparent);}
.sb-step-b{min-width:0;}
.sb-role{font-family:var(--mono);font-size:8.5px;font-weight:700;letter-spacing:0.15em;
  text-transform:uppercase;color:var(--cat);margin-bottom:5px;}
.sb-name{font-size:15px;font-weight:600;color:var(--white);margin-bottom:4px;}
.sb-meta{font-family:var(--mono);font-size:10px;letter-spacing:0.05em;
  color:rgba(245,244,240,0.44);}
.sb-bench{margin-top:7px;font-family:var(--body);font-size:12.5px;
  color:rgba(245,244,240,0.62);}
.sb-note{margin:0;padding:14px 20px;font-family:var(--body);font-size:12px;line-height:1.55;
  color:rgba(245,244,240,0.44);border-top:1px solid rgba(255,255,255,0.05);}
.pr-all-btn.primary{color:var(--gold);background:rgba(201,168,76,0.13);
  border-color:rgba(201,168,76,0.3);}
.pr-all-btn.primary:hover{background:rgba(201,168,76,0.2);color:#E8CE84;}
.pr-all-btn{display:inline-flex;align-items:center;}
@media(max-width:900px){
  .sb-row{align-items:flex-start;flex-direction:column;gap:8px;}
  .sb-lbl{width:auto;}
}

/* Focus is a list of fourteen choices, not a switch: pills wrap, a segmented bar does not. */
.sb-pills{display:flex;flex-wrap:wrap;gap:6px;}
.sb-pill{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:0.08em;
  color:rgba(250,250,250,0.55);background:rgba(255,255,255,0.035);
  border:1px solid rgba(255,255,255,0.09);border-radius:7px;padding:8px 12px;cursor:pointer;
  line-height:1;transition:color .14s,background .14s,border-color .14s;}
.sb-pill:hover{color:var(--white);background:rgba(255,255,255,0.075);}
.sb-pill.on{color:var(--gold);background:rgba(201,168,76,0.14);
  border-color:rgba(201,168,76,0.34);}
.sb-pill:focus-visible,.sb-seg-btn:focus-visible{outline:2px solid var(--green-light);
  outline-offset:2px;}

/* A step is the drill, so it behaves like one. */
.sb-step{cursor:pointer;transition:background .14s;}
.sb-step:hover{background:rgba(255,255,255,0.03);}
.sb-step:focus-visible{outline:2px solid var(--cat);outline-offset:-2px;}

/* The quiz result, where the library starts. Green rather than gold: this is a finding about
   the reader, not a promotion. */
.pr-quiz{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;
  padding:18px 22px;margin-bottom:16px;border-radius:14px;
  background:linear-gradient(160deg,rgba(91,191,133,0.08),rgba(255,255,255,0.012));
  border:1px solid rgba(91,191,133,0.22);}
.pr-quiz.stale{background:linear-gradient(160deg,rgba(255,255,255,0.04),rgba(255,255,255,0.012));
  border-color:rgba(255,255,255,0.1);}
.pr-quiz-lbl{font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:0.17em;
  text-transform:uppercase;color:var(--green-light);margin-bottom:7px;}
.pr-quiz.stale .pr-quiz-lbl{color:rgba(245,244,240,0.42);}
.pr-quiz-h{font-family:var(--display);font-size:21px;font-weight:500;color:var(--white);
  line-height:1.2;margin-bottom:5px;}
.pr-quiz-s{font-family:var(--body);font-size:12.5px;color:rgba(245,244,240,0.55);}
.pr-quiz-r{display:flex;gap:9px;flex-wrap:wrap;flex-shrink:0;}
@media(max-width:900px){.pr-quiz-r{width:100%;}.pr-quiz-r .pr-all-btn{flex:1 1 auto;justify-content:center;}}

/* ── PICK 5 ──────────────────────────────────────────────────────────────────
   Four states, four screens. The old tab rendered a picker and a season table and left the
   two middle states empty, which is why entering felt like filing a form. */
.pg-hero{position:relative;overflow:hidden;padding:30px 32px;border-radius:18px;margin-bottom:16px;
  background:linear-gradient(150deg,rgba(201,168,76,0.12),rgba(255,255,255,0.02) 58%),var(--black-card);
  border:1px solid rgba(201,168,76,0.2);
  box-shadow:0 1px 0 rgba(255,255,255,0.05) inset,0 22px 50px -34px rgba(0,0,0,0.9);}
.pg-hero-tag{display:inline-block;font-family:var(--mono);font-size:9px;font-weight:700;
  letter-spacing:0.18em;text-transform:uppercase;color:var(--gold);
  background:rgba(201,168,76,0.14);border:1px solid rgba(201,168,76,0.3);border-radius:999px;
  padding:5px 11px;margin-bottom:15px;}
.pg-hero-h{font-family:var(--display);font-size:clamp(28px,3.2vw,40px);font-weight:500;
  color:var(--white);margin:0 0 10px;letter-spacing:-0.02em;line-height:1.08;}
.pg-hero-p{font-family:var(--body);font-size:14px;line-height:1.65;
  color:rgba(245,244,240,0.62);margin:0 0 18px;max-width:62ch;}
.pg-chips{display:flex;gap:8px;flex-wrap:wrap;}
.pg-chip{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:0.1em;
  text-transform:uppercase;color:rgba(245,244,240,0.66);background:rgba(255,255,255,0.05);
  border:1px solid rgba(255,255,255,0.1);border-radius:7px;padding:7px 11px;}
.pg-chip.live{color:var(--green-light);background:rgba(91,191,133,0.12);
  border-color:rgba(91,191,133,0.28);}

.pg-brief{padding:16px 20px;border-radius:13px;background:rgba(255,255,255,0.022);
  border:1px solid rgba(255,255,255,0.07);margin-bottom:18px;}
.pg-steps{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-family:var(--mono);
  font-size:11px;letter-spacing:0.05em;color:rgba(245,244,240,0.6);}
.pg-steps b{color:var(--gold);margin-right:5px;}
.pg-arrow{display:inline-flex;color:rgba(245,244,240,0.3);}
.pg-arrow .pr-arw{margin:0;}
.pg-scoring{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:12px;
  padding-top:12px;border-top:1px solid rgba(255,255,255,0.06);}
.pg-scoring-l{font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:0.14em;
  text-transform:uppercase;color:rgba(245,244,240,0.4);}
.pg-tiers{display:flex;gap:6px;flex-wrap:wrap;}
.pg-tier{font-family:var(--mono);font-size:10px;color:rgba(245,244,240,0.55);
  background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.08);border-radius:6px;
  padding:5px 9px;}
.pg-tier b{color:var(--green-light);margin-right:5px;font-size:11px;}

/* Picking. No inner scroller — the list runs its length and the page scrolls once. */
.pg-pick-grid{display:grid;grid-template-columns:minmax(0,1fr) 306px;gap:16px;align-items:start;}
.pg-pool{border:1px solid rgba(255,255,255,0.07);border-radius:14px;overflow:hidden;
  background:rgba(255,255,255,0.015);}
.pg-pool-head{display:flex;align-items:center;gap:14px;padding:12px 14px;
  border-bottom:1px solid rgba(255,255,255,0.07);background:rgba(255,255,255,0.02);}
.pg-search{flex:1 1 auto;}
.pg-pool-n{font-family:var(--mono);font-size:10px;letter-spacing:0.08em;
  color:rgba(245,244,240,0.4);white-space:nowrap;}
.pg-rows{display:flex;flex-direction:column;}
.pg-row{display:flex;align-items:center;gap:11px;width:100%;padding:11px 15px;background:none;
  border:0;border-bottom:1px solid rgba(255,255,255,0.035);cursor:pointer;text-align:left;
  color:inherit;transition:background .13s;}
.pg-row:last-child{border-bottom:0;}
.pg-row:hover{background:rgba(255,255,255,0.03);}
.pg-row.on{background:rgba(91,191,133,0.09);}
.pg-row.full{opacity:0.4;cursor:not-allowed;}
.pg-tick{width:20px;height:20px;flex-shrink:0;border-radius:6px;display:flex;align-items:center;
  justify-content:center;font-family:var(--mono);font-size:11px;
  color:rgba(245,244,240,0.4);background:rgba(255,255,255,0.05);
  border:1px solid rgba(255,255,255,0.09);}
.pg-row.on .pg-tick{color:var(--green-light);background:rgba(91,191,133,0.16);
  border-color:rgba(91,191,133,0.38);}
.pg-row-name{flex:1 1 auto;min-width:0;font-size:14px;font-weight:600;color:var(--white);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.pg-row-n{font-family:var(--mono);font-size:12.5px;color:rgba(245,244,240,0.5);flex-shrink:0;
  font-variant-numeric:tabular-nums;}

.pg-card{position:sticky;top:88px;border:1px solid rgba(201,168,76,0.22);border-radius:14px;
  padding:16px;background:linear-gradient(165deg,rgba(201,168,76,0.07),rgba(255,255,255,0.012));}
.pg-card-head{display:flex;justify-content:space-between;align-items:baseline;
  font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:0.14em;
  text-transform:uppercase;color:rgba(245,244,240,0.5);margin-bottom:9px;}
.pg-card-n{color:rgba(245,244,240,0.4);}
.pg-card-n.ready{color:var(--green-light);}
.pg-prog{height:3px;border-radius:2px;background:rgba(255,255,255,0.07);overflow:hidden;
  margin-bottom:13px;}
.pg-prog span{display:block;height:100%;background:var(--gold);transition:width .25s;}
.pg-name-input{width:100%;font-family:var(--body);font-size:13px;color:var(--white);
  background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.1);border-radius:8px;
  padding:9px 11px;margin-bottom:11px;}
.pg-name-input:focus{outline:none;border-color:rgba(201,168,76,0.45);}
.pg-slots{display:flex;flex-direction:column;gap:5px;margin-bottom:13px;}
.pg-slot{display:flex;align-items:center;gap:10px;padding:9px 11px;border-radius:8px;
  background:rgba(255,255,255,0.028);border:1px dashed rgba(255,255,255,0.09);}
.pg-slot.filled{border-style:solid;border-color:rgba(255,255,255,0.12);
  background:rgba(255,255,255,0.05);}
.pg-slot-n{font-family:var(--mono);font-size:10px;color:rgba(245,244,240,0.35);width:12px;}
.pg-slot-name{flex:1 1 auto;font-size:13.5px;font-weight:600;color:var(--white);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.pg-slot-empty{flex:1 1 auto;font-family:var(--mono);font-size:10.5px;letter-spacing:0.08em;
  color:rgba(245,244,240,0.26);}
.pg-slot-x{background:none;border:0;color:rgba(245,244,240,0.35);font-size:16px;cursor:pointer;
  line-height:1;padding:0 2px;}
.pg-slot-x:hover{color:#C96A5A;}
.pg-submit{width:100%;font-family:var(--mono);font-size:11.5px;font-weight:700;
  letter-spacing:0.1em;text-transform:uppercase;color:#14120C;border:0;border-radius:9px;
  padding:13px;cursor:pointer;background:linear-gradient(180deg,#E0C368,#C9A84C 55%,#B08F2A);
  box-shadow:0 1px 0 rgba(255,255,255,0.4) inset,0 10px 22px -14px rgba(201,168,76,0.7);
  transition:transform .14s,filter .14s;}
.pg-submit:hover:not(:disabled){transform:translateY(-1px);}
.pg-submit:disabled{opacity:0.4;cursor:not-allowed;filter:grayscale(0.4);}
.pg-clear{width:100%;margin-top:7px;font-family:var(--mono);font-size:10px;font-weight:700;
  letter-spacing:0.1em;text-transform:uppercase;color:rgba(245,244,240,0.45);background:none;
  border:0;cursor:pointer;padding:7px;}
.pg-clear:hover{color:var(--white);}
.pg-save{margin-top:9px;font-family:var(--body);font-size:12px;line-height:1.5;text-align:center;}
.pg-save .ok{color:var(--green-light);}
.pg-save .err{color:#C96A5A;}

.pg-wait{padding:26px;border-radius:14px;margin-bottom:16px;text-align:center;
  background:rgba(255,255,255,0.022);border:1px solid rgba(255,255,255,0.07);}
.pg-wait-h{font-family:var(--display);font-size:22px;color:var(--white);margin-bottom:8px;}
.pg-wait p{font-family:var(--body);font-size:13px;line-height:1.6;
  color:rgba(245,244,240,0.55);margin:0 auto;max-width:56ch;}

.pg-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:14px;
  margin-bottom:16px;}
.pg-entry{border:1px solid rgba(255,255,255,0.08);border-radius:14px;overflow:hidden;
  background:rgba(255,255,255,0.018);}
.pg-entry.mine{border-color:rgba(91,191,133,0.3);background:rgba(91,191,133,0.045);}
.pg-entry.model{border-color:rgba(201,168,76,0.28);background:rgba(201,168,76,0.045);}
.pg-entry-head{display:flex;justify-content:space-between;align-items:baseline;padding:13px 16px;
  border-bottom:1px solid rgba(255,255,255,0.06);}
.pg-entry-name{font-size:15px;font-weight:600;color:var(--white);}
.pg-you{font-family:var(--mono);font-size:8.5px;font-weight:700;letter-spacing:0.12em;
  text-transform:uppercase;color:var(--green-light);background:rgba(91,191,133,0.15);
  border-radius:4px;padding:3px 6px;margin-left:8px;}
.pg-entry-pts{font-family:var(--mono);font-size:22px;font-weight:500;color:var(--white);
  font-variant-numeric:tabular-nums;}
.pg-entry-pts em{font-style:normal;font-size:10px;color:rgba(245,244,240,0.4);margin-left:4px;}
.pg-entry-picks{display:flex;flex-direction:column;}
.pg-pk{display:grid;grid-template-columns:1fr 62px 46px;align-items:center;gap:8px;
  padding:10px 16px;border-bottom:1px solid rgba(255,255,255,0.035);}
.pg-pk:last-child{border-bottom:0;}
.pg-pk-name{font-size:13.5px;color:rgba(245,244,240,0.82);overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap;}
.pg-pk-pos,.pg-pk-pts{font-family:var(--mono);font-size:12.5px;text-align:right;
  font-variant-numeric:tabular-nums;}
.pg-pk-pos{color:rgba(245,244,240,0.5);}
.pg-pk-pts{font-weight:600;color:rgba(245,244,240,0.6);}
.pg-pk.hot .pg-pk-pts{color:var(--gold);}
.pg-pk.ok .pg-pk-pts{color:var(--green-light);}
.pg-pk.out .pg-pk-pos,.pg-pk.out .pg-pk-name{color:rgba(201,106,90,0.75);}
.pg-pk.wait{opacity:0.55;}

.pg-board{border:1px solid rgba(255,255,255,0.07);border-radius:14px;overflow:hidden;
  background:rgba(255,255,255,0.015);margin-bottom:16px;}
.pg-board-head{display:flex;justify-content:space-between;padding:13px 18px;
  background:rgba(255,255,255,0.025);border-bottom:1px solid rgba(255,255,255,0.07);
  font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:0.13em;
  text-transform:uppercase;color:rgba(245,244,240,0.5);}
.pg-note{margin:0;padding:11px 18px;font-family:var(--body);font-size:12px;line-height:1.5;
  color:rgba(245,244,240,0.44);border-bottom:1px solid rgba(255,255,255,0.05);}
.pg-lb{display:grid;grid-template-columns:42px 1fr 70px;align-items:center;padding:11px 18px;
  border-bottom:1px solid rgba(255,255,255,0.035);}
.pg-lb:last-child{border-bottom:0;}
.pg-lb.mine{background:rgba(91,191,133,0.07);}
.pg-lb.model{background:rgba(201,168,76,0.055);}
.pg-lb-r{font-family:var(--mono);font-size:12px;color:rgba(245,244,240,0.4);
  font-variant-numeric:tabular-nums;}
.pg-lb-n{font-size:14px;font-weight:600;color:var(--white);overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap;}
.pg-lb.model .pg-lb-n{color:var(--gold);}
.pg-lb-p{font-family:var(--mono);font-size:15px;font-weight:600;text-align:right;
  color:var(--white);font-variant-numeric:tabular-nums;}

@media(max-width:1000px){
  .pg-pick-grid{grid-template-columns:1fr;}
  .pg-card{position:static;order:-1;}
}
@media(max-width:900px){
  .pg-hero{padding:22px 18px;}
  .pg-steps{font-size:10px;gap:7px;}
  .pg-cards{grid-template-columns:1fr;}
}

/* The meta reads as one line rather than three pill badges competing with the title. */
.pg-hero-inner{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,360px);gap:28px;
  align-items:start;}
.pg-meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-family:var(--mono);
  font-size:10.5px;font-weight:700;letter-spacing:0.11em;text-transform:uppercase;
  color:rgba(245,244,240,0.5);}
.pg-meta b{color:rgba(245,244,240,0.85);font-weight:700;}
.pg-meta .sep{color:rgba(245,244,240,0.22);}
.pg-meta .clock{color:var(--green-light);}

/* The rules move into the hero: one block to scan, not two stacked sections. */
.pg-side{border-left:1px solid rgba(255,255,255,0.08);padding-left:24px;}
.pg-side-h{font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:0.16em;
  text-transform:uppercase;color:rgba(245,244,240,0.4);margin-bottom:11px;}
.pg-flow{display:flex;flex-direction:column;gap:8px;margin-bottom:18px;}
.pg-flow-i{display:flex;align-items:baseline;gap:9px;font-family:var(--body);font-size:12.5px;
  color:rgba(245,244,240,0.7);line-height:1.4;}
.pg-flow-n{font-family:var(--mono);font-size:9px;font-weight:700;color:var(--gold);
  flex-shrink:0;width:14px;}
.pg-tiers{display:flex;gap:5px;flex-wrap:wrap;}
.pg-tier{font-family:var(--mono);font-size:9.5px;color:rgba(245,244,240,0.5);
  background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.08);border-radius:6px;
  padding:4px 7px;}
.pg-tier b{color:var(--green-light);margin-right:4px;font-size:10.5px;}

/* A submitted card should look submitted. */
.pg-card.done{border-color:rgba(91,191,133,0.3);
  background:linear-gradient(165deg,rgba(91,191,133,0.07),rgba(255,255,255,0.012));}
.pg-badge{display:inline-flex;align-items:center;gap:5px;font-family:var(--mono);font-size:8.5px;
  font-weight:700;letter-spacing:0.13em;text-transform:uppercase;color:var(--green-light);
  background:rgba(91,191,133,0.15);border:1px solid rgba(91,191,133,0.3);border-radius:5px;
  padding:4px 8px;}
.pg-badge svg{width:10px;height:10px;}
.pg-named{display:flex;align-items:center;gap:8px;padding:10px 12px;border-radius:8px;
  background:rgba(255,255,255,0.035);border:1px solid rgba(255,255,255,0.08);margin-bottom:11px;}
.pg-named-n{flex:1 1 auto;font-size:13.5px;font-weight:600;color:var(--white);overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap;}
.pg-named-e{background:none;border:0;cursor:pointer;color:rgba(245,244,240,0.4);
  font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:0.1em;
  text-transform:uppercase;padding:0;}
.pg-named-e:hover{color:var(--white);}
.pg-card.done .pg-slot{border-style:solid;border-color:rgba(91,191,133,0.18);
  background:rgba(255,255,255,0.04);}
.pg-done{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;
  padding:13px;border-radius:9px;font-family:var(--mono);font-size:11px;font-weight:700;
  letter-spacing:0.11em;text-transform:uppercase;color:var(--green-light);
  background:rgba(91,191,133,0.11);border:1px solid rgba(91,191,133,0.26);}
.pg-done svg{width:13px;height:13px;}
.pg-dirty{font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:0.11em;
  text-transform:uppercase;color:var(--gold);text-align:center;margin-bottom:8px;}
@media(max-width:1100px){
  .pg-hero-inner{grid-template-columns:1fr;gap:20px;}
  .pg-side{border-left:0;border-top:1px solid rgba(255,255,255,0.08);padding-left:0;padding-top:18px;}
}

/* The model card sits under yours, so the comparison is the layout. */
.pg-side-col{display:flex;flex-direction:column;gap:12px;position:sticky;top:88px;}
.pg-side-col .pg-card{position:static;top:auto;}
.pg-model{border:1px solid rgba(201,168,76,0.2);border-radius:14px;padding:15px 16px;
  background:linear-gradient(165deg,rgba(201,168,76,0.055),rgba(255,255,255,0.01));}
.pg-model-head{display:flex;align-items:center;justify-content:space-between;gap:10px;
  margin-bottom:8px;}
.pg-model-t{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:0.14em;
  text-transform:uppercase;color:var(--gold);}
.pg-model-tag{font-family:var(--mono);font-size:8px;font-weight:700;letter-spacing:0.12em;
  text-transform:uppercase;color:rgba(245,244,240,0.42);background:rgba(255,255,255,0.05);
  border:1px solid rgba(255,255,255,0.09);border-radius:4px;padding:3px 6px;}
.pg-model-p{font-family:var(--body);font-size:11.5px;line-height:1.5;
  color:rgba(245,244,240,0.46);margin:0 0 11px;}
.pg-model-list{display:flex;flex-direction:column;gap:3px;}
.pg-model-r{display:flex;align-items:center;gap:9px;padding:6px 9px;border-radius:6px;
  background:rgba(255,255,255,0.028);}
.pg-model-r.same{background:rgba(91,191,133,0.1);}
.pg-model-n{font-family:var(--mono);font-size:9.5px;color:rgba(245,244,240,0.34);width:10px;}
.pg-model-name{flex:1 1 auto;font-size:12.5px;font-weight:600;color:rgba(245,244,240,0.88);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.pg-model-same{font-family:var(--mono);font-size:8px;font-weight:700;letter-spacing:0.1em;
  text-transform:uppercase;color:var(--green-light);flex-shrink:0;}
.pg-model-foot{margin-top:10px;padding-top:9px;border-top:1px solid rgba(255,255,255,0.07);
  font-family:var(--body);font-size:11.5px;line-height:1.5;color:rgba(245,244,240,0.55);}
@media(max-width:1000px){
  .pg-side-col{position:static;order:-1;}
}

.vf-search-wrap{flex:0 1 210px;margin-left:auto;}
.vf-market-count.filtered{color:var(--green-light);}

/* Live nav mark. The trace is the resting state; the pulsing dot appears only while a round is
   actually in play, so the indicator carries information instead of always claiming it. */
.psb-live-ic{display:inline-flex;align-items:center;justify-content:center;
  width:16px;height:16px;flex-shrink:0;position:relative;}
.psb-live-ic svg{width:16px;height:16px;}
.psb-live-ic .psb-live-indicator{display:none;}
body.lab-live .psb-live-ic svg{display:none;}
body.lab-live .psb-live-ic .psb-live-indicator{display:block;}
.bnav-item .psb-live-ic{width:18px;height:18px;}
.bnav-item .psb-live-ic svg{width:18px;height:18px;}

.vf-c-pos,.vf-c-thru,.vf-c-pre{text-align:center;}
.vf-num.dim{color:rgba(245,244,240,0.42);}

/* ── Rankings ─────────────────────────────────────────────────────────────
   Rides the shared .cf-table-wrap shell; only the cells are specific. */
.rk-tools{display:flex;align-items:center;gap:12px;margin-bottom:12px;flex-wrap:wrap;}
.rk-tools .mu-search-wrap{flex:0 1 240px;}
.rk-row{min-height:0;padding-top:10px;padding-bottom:10px;}
.rk-num{font-family:var(--mono);font-size:13px;color:rgba(250,250,250,0.4);
  font-variant-numeric:tabular-nums;}
.rk-num.r1{color:var(--gold);}
.rk-num.r2,.rk-num.r3{color:rgba(245,244,240,0.72);}
.rk-player{display:flex;align-items:center;gap:10px;min-width:0;}
.rk-player-txt{min-width:0;}
.rk-name{font-size:13.5px;font-weight:600;color:rgba(245,244,240,0.92);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.rk-country{font-family:var(--mono);font-size:9px;letter-spacing:0.09em;
  color:rgba(250,250,250,0.34);margin-top:1px;}
.rk-val{font-family:var(--mono);font-size:13px;text-align:right;
  color:rgba(245,244,240,0.72);font-variant-numeric:tabular-nums;}
.rk-val.sorted{font-weight:600;color:var(--white);}
.rk-val.na{color:rgba(245,244,240,0.28);}
.cf-th.rk-c-rank,.cf-th.rk-c-player{justify-content:flex-start;}
@media(max-width:900px){
  .cf-table-head#rankingsHead{display:none;}
  .rk-row{grid-template-columns:1fr 1fr 1fr !important;
    grid-template-areas:"who who who" "a b c" "d e f";
    row-gap:10px;column-gap:10px;padding:14px;background:var(--black-card);
    border:1px solid var(--border);border-radius:12px;margin-bottom:10px;}
  .rk-row>.rk-num{display:none;}
  .rk-row>.rk-player{grid-area:who;}
  .rk-row>.rk-val{text-align:left;}
  .rk-tools .mu-search-wrap{flex:1 1 100%;}
}

/* ── Evidence ─────────────────────────────────────────────────────────────
   The verdict is the organising fact, so it is what the card is coloured by:
   a killed idea reads as settled, not as an error. */
.ev-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;
  margin-bottom:32px;}
.ev-stat{border:1px solid var(--border);border-radius:13px;padding:15px 17px;
  background:linear-gradient(168deg, rgba(26,24,21,0.72) 0%, rgba(20,19,17,0.56) 100%);}
.ev-stat-val{font-family:var(--mono);font-size:24px;font-weight:600;color:var(--white);
  letter-spacing:-0.01em;font-variant-numeric:tabular-nums;}
.ev-stat-lbl{font-size:12.5px;color:rgba(245,244,240,0.66);margin-top:4px;}
.ev-stat-sub{font-family:var(--mono);font-size:9.5px;letter-spacing:0.06em;
  color:rgba(245,244,240,0.34);margin-top:3px;}

.ev-filters{margin:14px 0 16px;}
.ev-n{font-size:9px;opacity:0.55;margin-left:3px;}

.ev-list{display:flex;flex-direction:column;gap:12px;}
.ev-card{border:1px solid var(--border);border-radius:14px;padding:18px 20px;
  background:linear-gradient(168deg, rgba(26,24,21,0.78) 0%, rgba(20,19,17,0.6) 100%);
  box-shadow:0 1px 0 rgba(255,255,255,0.035) inset;}
.ev-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:9px;}
.ev-chip{font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:0.13em;
  text-transform:uppercase;padding:4px 8px;border-radius:5px;}
.ev-killed .ev-chip{color:#E0908C;background:rgba(217,72,72,0.14);
  border:1px solid rgba(217,72,72,0.28);}
.ev-adopted .ev-chip{color:var(--green-light);background:rgba(91,191,133,0.13);
  border:1px solid rgba(91,191,133,0.3);}
.ev-open .ev-chip{color:#EBD289;background:rgba(201,168,76,0.14);
  border:1px solid rgba(201,168,76,0.3);}
.ev-date{font-family:var(--mono);font-size:10px;letter-spacing:0.07em;
  color:rgba(245,244,240,0.3);}
.ev-claim{font-family:var(--display,var(--body));font-size:19px;font-weight:600;
  line-height:1.25;letter-spacing:-0.01em;color:var(--white);margin:0 0 12px;
  text-wrap:balance;}
.ev-fig{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:11px;
  padding-bottom:12px;border-bottom:1px solid rgba(255,255,255,0.06);}
.ev-fig-val{font-family:var(--mono);font-size:26px;font-weight:600;letter-spacing:-0.02em;
  font-variant-numeric:tabular-nums;}
.ev-killed .ev-fig-val{color:#E0908C;}
.ev-adopted .ev-fig-val{color:var(--green-light);}
.ev-open .ev-fig-val{color:rgba(245,244,240,0.5);font-size:20px;font-style:italic;}
.ev-fig-note{font-family:var(--mono);font-size:10.5px;letter-spacing:0.05em;
  color:rgba(245,244,240,0.42);}
.ev-method{font-size:13.5px;line-height:1.65;color:rgba(245,244,240,0.68);margin:0 0 12px;
  max-width:74ch;}
.ev-foot{border-top:1px solid rgba(255,255,255,0.05);padding-top:11px;}
.ev-sample{display:inline-block;font-family:var(--mono);font-size:9.5px;font-weight:700;
  letter-spacing:0.11em;text-transform:uppercase;color:rgba(245,244,240,0.34);
  margin-bottom:5px;}
.ev-outcome{font-size:12.5px;line-height:1.6;color:rgba(245,244,240,0.5);margin:0;
  max-width:74ch;}
@media(max-width:700px){
  .ev-card{padding:15px 16px;}
  .ev-claim{font-size:17px;}
}

/* Numeric columns right-align their values, so their headers have to as well. This was defined
   per-table and missing on .cf-th, which left the Rankings headers adrift from their columns. */
.cf-th.right{justify-content:flex-end;text-align:right;}

@media(max-width:900px){
  /* The bar is one control now. Height is fixed so the page's bottom padding can match it. */
  .pro-bnav{display:block;height:auto;padding:8px 12px calc(8px + env(safe-area-inset-bottom));
    background:linear-gradient(180deg,rgba(10,10,10,0.72),rgba(10,10,10,0.97) 55%);
    -webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);
    border-top:1px solid rgba(255,255,255,0.08);}
  .bnav-menu-btn{display:flex;align-items:center;gap:11px;width:100%;
    padding:11px 14px;border-radius:12px;cursor:pointer;
    background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.11);
    color:inherit;font:inherit;text-align:left;transition:background .15s,border-color .15s;}
  .bnav-menu-btn:active{background:rgba(255,255,255,0.09);}
  .bnav-menu-btn:focus-visible{outline:2px solid var(--green-light);outline-offset:2px;}
  .bnav-menu-ic{display:inline-flex;align-items:center;justify-content:center;
    width:20px;height:20px;flex-shrink:0;color:var(--green-light);}
  .bnav-menu-ic svg{width:20px;height:20px;}
  .bnav-menu-txt{display:flex;flex-direction:column;gap:1px;min-width:0;flex:1 1 auto;}
  .bnav-menu-lbl{font-family:var(--mono);font-size:8.5px;font-weight:700;letter-spacing:0.14em;
    text-transform:uppercase;color:rgba(245,244,240,0.4);}
  .bnav-menu-cur{font-size:14.5px;font-weight:600;color:var(--white);
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  .bnav-menu-chev{width:9px;height:9px;flex-shrink:0;border-right:1.6px solid rgba(245,244,240,0.45);
    border-top:1.6px solid rgba(245,244,240,0.45);transform:rotate(-45deg);margin-right:2px;
    transition:transform .2s;}
  .bnav-menu-btn[aria-expanded="true"] .bnav-menu-chev{transform:rotate(135deg);}

  /* The sheet. Rises from the bar it was opened from, and stops short of the top so the page
     behind it is visibly still there — a full-height takeover reads as a new page. */
  .bnav-more-drawer{position:fixed;left:0;right:0;bottom:0;z-index:230;
    max-height:82vh;display:flex;flex-direction:column;
    padding:8px 12px calc(14px + env(safe-area-inset-bottom));
    border-radius:18px 18px 0 0;border:1px solid rgba(255,255,255,0.1);border-bottom:0;
    background:linear-gradient(180deg,#191714,#121110);
    box-shadow:0 -24px 60px -20px rgba(0,0,0,0.9);
    transform:translateY(101%);transition:transform .26s cubic-bezier(.22,1,.36,1);
    visibility:hidden;}
  .bnav-more-drawer.open{transform:translateY(0);visibility:visible;}
  .bnav-sheet-grip{width:36px;height:4px;border-radius:2px;margin:4px auto 10px;
    background:rgba(255,255,255,0.18);flex-shrink:0;}
  .bnav-sheet-scroll{overflow-y:auto;-webkit-overflow-scrolling:touch;}
  .bnav-sheet-group{font-family:var(--mono);font-size:8.5px;font-weight:700;letter-spacing:0.14em;
    text-transform:uppercase;color:rgba(245,244,240,0.34);padding:12px 8px 6px;}
  .bnav-sheet-group:first-child{padding-top:2px;}
  .bnav-sheet-item{display:flex;align-items:center;gap:13px;width:100%;
    padding:11px 10px;border-radius:10px;border:0;background:none;cursor:pointer;
    color:rgba(245,244,240,0.78);font:inherit;font-size:14.5px;text-align:left;
    transition:background .14s,color .14s;}
  .bnav-sheet-item svg{width:17px;height:17px;flex-shrink:0;color:rgba(245,244,240,0.5);}
  .bnav-sheet-item .psb-live-ic{width:17px;height:17px;flex-shrink:0;color:rgba(245,244,240,0.5);}
  .bnav-sheet-item.active{background:rgba(91,191,133,0.11);color:var(--white);}
  .bnav-sheet-item.active svg,.bnav-sheet-item.active .psb-live-ic{color:var(--green-light);}
  .bnav-sheet-item:active{background:rgba(255,255,255,0.06);}
  .bnav-backdrop{z-index:229;}

  /* The site drawer sat at a hardcoded 64px while the nav is shorter here, leaving a strip of
     page showing through above it. Pinned to the nav's own height instead. */
  .drawer{top:var(--nav-h,56px);}
}

@media(max-width:900px){

  /* ── Shared card frame ─────────────────────────────────────────────────
     One definition so the six tables cannot drift apart again. */
  .vf-row2,.mu-row,.mu3-row,.dfs-row,.rk-row{
    padding:13px 14px !important;border-radius:13px;margin-bottom:9px;
    background:linear-gradient(168deg,rgba(26,24,21,0.8),rgba(20,19,17,0.62));
    border:1px solid rgba(255,255,255,0.075);}
  /* The identity line: rank, avatar and name together, separated from the numbers by a rule. */
  .m-idrow{display:flex;align-items:center;gap:10px;padding-bottom:10px;margin-bottom:11px;
    border-bottom:1px solid rgba(255,255,255,0.07);}
  /* Every number cell states what it is. A grid of bare figures is the thing that made these
     tabs unreadable on a phone. */
  .vf-row2>div[data-label]::before,
  .dfs-row>div[data-label]::before,.rk-row>div[data-label]::before{
    content:attr(data-label);display:block;font-family:var(--mono);font-size:8px;font-weight:700;
    letter-spacing:0.12em;text-transform:uppercase;color:rgba(245,244,240,0.36);margin-bottom:3px;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

  /* ── Outrights ─────────────────────────────────────────────────────────
     Was: rank, avatar and name each in their own grid area, so the number sat above the name
     rather than beside it, and the remaining values fell wherever the next area happened to be. */
  .vf-row2{display:grid;grid-template-columns:repeat(3,1fr);
    grid-template-areas:"who who who" "a b c" "d e f";
    row-gap:12px;column-gap:12px;align-items:start;}
  .vf-row2>.vf-c-rank{grid-area:who;display:flex;align-items:center;gap:10px;
    padding-bottom:10px;margin-bottom:0;border-bottom:1px solid rgba(255,255,255,0.07);
    font-family:var(--mono);font-size:12px;color:rgba(245,244,240,0.42);}
  .vf-row2>.vf-c-av{display:none;}
  .vf-row2>.vf-c-player{grid-area:who;justify-self:start;align-self:center;
    padding-left:30px;padding-bottom:10px;pointer-events:none;}
  .vf-row2>.vf-c-player .cf-player{font-size:15px;font-weight:600;}
  .vf-row2>.vf-c-pos{grid-area:a;}   .vf-row2>.vf-c-thru{grid-area:b;}
  .vf-row2>.vf-c-pre{grid-area:c;}   .vf-row2>.vf-c-prob{grid-area:d;}
  .vf-row2>.vf-c-edge{grid-area:e;}  .vf-row2>.vf-c-move{grid-area:f;}
  .vf-row2>.vf-c-odds{grid-area:a;}  .vf-row2>.vf-c-shop{grid-area:e;}
  .vf-row2>.vf-c-book{grid-area:f;}
  .vf-row2>div[data-label]{text-align:left !important;}
  .vf-row2 .vf-odds,.vf-row2 .vf-num,.vf-row2 .vf-edge,.vf-row2 .vf-move,
  .vf-row2 .vf-shop,.vf-row2 .vf-book{text-align:left !important;font-size:14px;}
  /* The search sat in a row of its own with nothing to align to. */
  #tab-value .vf-market{flex-wrap:wrap;gap:10px;}
  #tab-value .vf-search-wrap{flex:1 1 100%;margin-left:0;}
  #tab-value .vf-market-count{order:3;}

  /* ── Matchups ──────────────────────────────────────────────────────────
     Player B and the two right-hand figures were each aligned differently, and the vs sat closer
     to B than to A. One rule above the numbers keeps it reading as a single card. */
  .mu-row{display:grid;grid-template-columns:1fr 28px 1fr;
    grid-template-areas:"pa vs pb" "edge edge gap";
    row-gap:0;column-gap:8px;align-items:start;}
  .mu3-row{display:grid;grid-template-columns:repeat(3,1fr);
    grid-template-areas:"pa pb pc" "edge edge gap";row-gap:0;column-gap:8px;}
  .mu-row>.mu-c-vs{grid-area:vs;align-self:center;justify-self:center;padding-bottom:12px;}
  .mu-row>.mu-c-pa,.mu-row>.mu-c-pb,.mu3-row>.mu-c-pa,.mu3-row>.mu-c-pb,.mu3-row>.mu-c-pc{
    padding-bottom:12px;}
  .mu-row>.mu-c-pb{text-align:right;}
  .mu-row>.mu-c-pb .mu-price{justify-content:flex-end;}
  .mu-row>.mu-c-edge,.mu3-row>.mu-c-edge{grid-area:edge;text-align:left !important;
    padding-top:11px;border-top:1px solid rgba(255,255,255,0.07);}
  .mu-row>.mu-c-gap,.mu3-row>.mu-c-gap{grid-area:gap;text-align:right !important;
    padding-top:11px;border-top:1px solid rgba(255,255,255,0.07);}
  .mu-row .mu-cell-name{text-align:inherit;}

  /* ── DFS ───────────────────────────────────────────────────────────────
     The bar ran under a number it did not belong to, the name was smaller than the figures, and
     the cells were spread across a grid wider than the content. */
  .dfs-row{display:grid;grid-template-columns:repeat(3,1fr);
    grid-template-areas:"who who who" "salary pts perk" "own leverage fit";
    row-gap:12px;column-gap:12px;align-items:start;}
  .dfs-row>.dfs-c-sel{display:none;}
  .dfs-row>.dfs-c-player{grid-area:who;padding-bottom:10px;
    border-bottom:1px solid rgba(255,255,255,0.07);}
  .dfs-row>.dfs-c-player .dfs-player{font-size:15.5px;}
  .dfs-row>.dfs-c-salary{grid-area:salary;} .dfs-row>.dfs-c-pts{grid-area:pts;}
  .dfs-row>.dfs-c-perk{grid-area:perk;}     .dfs-row>.dfs-c-own{grid-area:own;}
  .dfs-row>.dfs-c-lev{grid-area:leverage;}  .dfs-row>.dfs-c-fit{grid-area:fit;}
  .dfs-row>div[data-label]{text-align:left !important;}
  .dfs-row .dfs-salary,.dfs-row .dfs-pts,.dfs-row .dfs-pts-sub,.dfs-row .dfs-val{
    text-align:left !important;font-size:14px;}
  /* The bar belongs to the projection, so it spans that cell and nothing else. */
  .dfs-row .dfs-bar{width:100% !important;margin-left:0 !important;margin-top:6px;}
  .dfs-row .dfs-pts-sub{font-size:9.5px;}

  /* ── Rankings ──────────────────────────────────────────────────────────
     The head is hidden on a phone, so without per-cell labels the six figures were unidentified.
     They are generated with data-label now (see renderRankingsTab). */
  .rk-row{display:grid;grid-template-columns:repeat(3,1fr);
    grid-template-areas:"who who who" "a b c" "d e f";
    row-gap:12px;column-gap:12px;align-items:start;}
  .rk-row>.rk-num{display:none;}
  .rk-row>.rk-player{grid-area:who;padding-bottom:10px;
    border-bottom:1px solid rgba(255,255,255,0.07);}
  .rk-row>.rk-player .rk-name{font-size:15.5px;}
  .rk-row>.rk-val:nth-of-type(1){grid-area:a;} .rk-row>.rk-val:nth-of-type(2){grid-area:b;}
  .rk-row>.rk-val:nth-of-type(3){grid-area:c;} .rk-row>.rk-val:nth-of-type(4){grid-area:d;}
  .rk-row>.rk-val:nth-of-type(5){grid-area:e;} .rk-row>.rk-val:nth-of-type(6){grid-area:f;}
  .rk-row>.rk-val{text-align:left !important;font-size:14.5px;}
}

@media(max-width:900px){
  /* Stated explicitly rather than inherited: the bar is pinned to the bottom of the VIEWPORT.
     It was reaching the top of the screen, and a fixed overlay whose position depends on rules
     set 2500 lines earlier is not worth debugging twice. */
  .pro-bnav{position:fixed !important;top:auto !important;bottom:0 !important;
    left:0 !important;right:0 !important;height:auto !important;z-index:210;}
  /* The sheet is hidden by transform AND visibility, and only .open reverses both. Without the
     display pair stated here it inherits display:none from the base rule and .open's display:flex
     from a rule 2000 lines up — two sources deciding one thing. */
  .bnav-more-drawer{display:flex !important;}
  .bnav-more-drawer:not(.open){pointer-events:none;}

  /* Live in the section list is a label, not a status light: the pulsing dot belongs on the bar
     you are looking at, not on a menu row, and it was rendering as an unstyled invisible dot. */
  .bnav-sheet-item .psb-live-ic svg,.bnav-menu-ic .psb-live-ic svg{display:block !important;}
  .bnav-sheet-item .psb-live-ic .psb-live-indicator,
  .bnav-menu-ic .psb-live-ic .psb-live-indicator{display:none !important;}
  .bnav-sheet-item .psb-live-ic{width:17px;height:17px;}
}

@media(max-width:900px){
  /* ── Outrights ─────────────────────────────────────────────────────────
     .vf-row2 also carries .cf-row, whose mobile rule sets a FOUR column template. My areas
     described three, and a template-areas that does not match its template-columns is invalid —
     so every cell auto-placed into the same corner. Scoped by tab id to outrank .cf-row and
     its :has() variant without reaching for !important, and rank and name get their own cells
     rather than being overlaid in one area with a padding offset. */
  #tab-value .vf-row2{
    grid-template-columns:auto 1fr 1fr;
    grid-template-areas:"rank name name" "a b c" "d e f";
    row-gap:13px;column-gap:12px;align-items:start;}
  #tab-value .vf-row2>.vf-c-rank{grid-area:rank;align-self:center;padding:0;margin:0;border:0;
    font-family:var(--mono);font-size:13px;color:rgba(245,244,240,0.42);}
  #tab-value .vf-row2>.vf-c-av{display:none;}
  #tab-value .vf-row2>.vf-c-player{grid-area:name;align-self:center;padding:0 0 2px;}
  #tab-value .vf-row2>.vf-c-player .cf-player{font-size:15.5px;font-weight:600;}
  /* The identity row is separated by a rule drawn on the first number cells instead of on the
     name, so it spans the card whichever six values this market has. */
  #tab-value .vf-row2>.vf-c-pos,#tab-value .vf-row2>.vf-c-odds{grid-area:a;}
  #tab-value .vf-row2>.vf-c-thru{grid-area:b;}
  #tab-value .vf-row2>.vf-c-pre{grid-area:c;}
  #tab-value .vf-row2>.vf-c-prob{grid-area:d;}
  #tab-value .vf-row2>.vf-c-edge{grid-area:e;}
  #tab-value .vf-row2>.vf-c-move{grid-area:f;}
  #tab-value .vf-row2>.vf-c-shop{grid-area:e;}
  #tab-value .vf-row2>.vf-c-book{grid-area:f;}
  #tab-value .vf-row2>div[data-label]{text-align:left;padding-top:11px;
    border-top:1px solid rgba(255,255,255,0.06);}
  #tab-value .vf-row2>div[data-label]~div[data-label]~div[data-label]~div[data-label]{
    border-top:0;padding-top:0;}
  #tab-value .vf-row2 .vf-odds,#tab-value .vf-row2 .vf-num,#tab-value .vf-row2 .vf-edge,
  #tab-value .vf-row2 .vf-move,#tab-value .vf-row2 .vf-shop,#tab-value .vf-row2 .vf-book{
    text-align:left;font-size:14.5px;}


  /* ── Form Trends ───────────────────────────────────────────────────────
     The key needs a header row to sit under, and the header is hidden here. */
  /* Handled at source: the label itself is now just "Last 6". */

  /* ── Rankings ──────────────────────────────────────────────────────────
     :nth-of-type counts TAGS, not classes — .rk-val:nth-of-type(1) can never match, because the
     first div child is .rk-num. Nothing was placed and every cell auto-flowed. Keyed off the
     label each cell already carries instead, which also survives a column being added.
     Layout asked for: rank and total down the left, the four SG figures across. */
  #tab-rankings .rk-row{
    grid-template-columns:repeat(3,1fr);
    grid-template-areas:"who who who" "c1 c2 c3" "c4 c5 c6";
    row-gap:13px;column-gap:12px;align-items:start;}
  #tab-rankings .rk-row>[data-label="DG"]{grid-area:c1;}
  #tab-rankings .rk-row>[data-label="Total"]{grid-area:c4;}
  #tab-rankings .rk-row>[data-label="OTT"]{grid-area:c2;}
  #tab-rankings .rk-row>[data-label="App"]{grid-area:c3;}
  #tab-rankings .rk-row>[data-label="ARG"]{grid-area:c5;}
  #tab-rankings .rk-row>[data-label="Putt"]{grid-area:c6;}
  /* Season carries four figures, so DG leads the top row and the rest follow in order. */
  #tab-rankings .rk-row>[data-label="FedEx"]{grid-area:c2;}
  #tab-rankings .rk-row>[data-label="Earnings"]{grid-area:c3;}
  #tab-rankings .rk-row>[data-label="Events"]{grid-area:c4;}

  /* ── Account panel ─────────────────────────────────────────────────────
     The card was centred in a flex overlay, so once it grew past the viewport the top went off
     screen with nothing to scroll — centring cannot be scrolled back into. The overlay scrolls
     and the card sits at the top of it instead. */
  .acct-overlay{align-items:flex-start;overflow-y:auto;-webkit-overflow-scrolling:touch;
    padding:calc(var(--nav-h,56px) + 16px) 14px 96px;}
  .acct-card{max-height:none;overflow:visible;padding:22px 18px;}
}

@media(max-width:900px){
  /* ── Live ──────────────────────────────────────────────────────────────
     The columns were "auto 1fr auto auto": one elastic column in the middle pushed everything
     else to the two edges, which is the uneven spread. Four equal columns instead, so every
     figure sits on the same rhythm, and the identity row spans them.

     TOTAL is the only number on the card that says who is winning and it was set at the same
     size as a probability. It leads now, with Today beside it. */
  .cf-row.lv-row{
    grid-template-columns:repeat(4,1fr);
    grid-template-areas:"pos player player player"
                        "total today thru win"
                        "ott app arg putt"
                        "t5 t10 t20 .";
    row-gap:13px;column-gap:10px;align-items:start;
    padding:13px 14px;}
  .cf-row.lv-row>.lv-c-pos{grid-area:pos;justify-self:start;align-self:center;
    font-family:var(--mono);font-size:13px;}
  .cf-row.lv-row>.lv-c-player{grid-area:player;align-self:center;}
  .cf-row.lv-row>.lv-c-player .cf-player{font-size:15.5px;font-weight:600;}
  .cf-row.lv-row>.lv-c-total{grid-area:total;font-size:22px;font-weight:600;letter-spacing:-0.01em;}
  .cf-row.lv-row>.lv-c-today{grid-area:today;}
  .cf-row.lv-row>.lv-c-thru{grid-area:thru;}
  .cf-row.lv-row>.lv-c-win{grid-area:win;}
  .cf-row.lv-row>.lv-c-ott{grid-area:ott;}
  .cf-row.lv-row>.lv-c-app{grid-area:app;}
  .cf-row.lv-row>.lv-c-arg{grid-area:arg;}
  .cf-row.lv-row>.lv-c-putt{grid-area:putt;}
  /* Room for all three finish markets now that the rows are even, so Top 20 comes back. */
  .cf-row.lv-row>.lv-c-t5{grid-area:t5;display:block;}
  .cf-row.lv-row>.lv-c-t10{grid-area:t10;display:block;}
  .cf-row.lv-row>.lv-c-t20{grid-area:t20;display:block;}
  .cf-row.lv-row>div{text-align:left;}
  .cf-row.lv-row>div[data-label]::before{
    content:attr(data-label);display:block;font-family:var(--mono);font-size:7.5px;font-weight:700;
    letter-spacing:0.1em;text-transform:uppercase;color:rgba(245,244,240,0.36);margin-bottom:3px;}
  .cf-row.lv-row .live-sg{font-size:13px;}

  /* ── Outrights ─────────────────────────────────────────────────────────
     The named areas could not work: this table renders SIX value cells in one mode
     (pos/thru/at tee-off/now/move) and six different ones in the other (odds/edge/hit/move/
     shop/book), and I mapped both sets onto the same six slots — so shop landed on edge and book
     landed on move, which is the pair sitting on top of each other.

     Auto-flow instead. The cells arrive in the order the renderer emits them, three to a row,
     and it cannot collide no matter which market or price state is showing. */
  #tab-value .vf-row2{
    grid-template-columns:repeat(3,1fr);
    grid-template-areas:none;
    row-gap:13px;column-gap:12px;align-items:start;}
  #tab-value .vf-row2>.vf-c-rank{grid-column:1;grid-row:1;justify-self:start;align-self:center;}
  #tab-value .vf-row2>.vf-c-av{display:none;}
  #tab-value .vf-row2>.vf-c-player{grid-column:2 / -1;grid-row:1;align-self:center;}
  /* Everything after the identity row places itself. */
  #tab-value .vf-row2>div[data-label]{grid-area:auto;text-align:left;
    border-top:0;padding-top:0;}
  /* One rule under the name, drawn on the row rather than on a cell that may not be there. */
  #tab-value .vf-row2>.vf-c-player{padding-bottom:11px;
    border-bottom:1px solid rgba(255,255,255,0.07);}
  #tab-value .vf-row2>.vf-c-rank{padding-bottom:11px;
    border-bottom:1px solid rgba(255,255,255,0.07);}
}

@media(max-width:900px){
  /* ── Outrights: one identity line, identical value cells ───────────────
     The rank comes out of the grid as a pill, so it costs no column and the name spans the full
     width carrying a single unbroken rule. Value cells auto-flow, identically styled, whichever
     six the price state emits. */
  #tab-value .vf-row2{position:relative;grid-template-columns:repeat(3,1fr);
    grid-template-areas:none;row-gap:14px;column-gap:12px;align-items:start;padding:13px 14px;}
  #tab-value .vf-row2>.vf-c-rank{position:absolute;top:13px;left:14px;
    display:inline-flex;align-items:center;justify-content:center;
    min-width:24px;height:22px;padding:0 7px;border-radius:7px;
    background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.1);
    font-family:var(--mono);font-size:11.5px;font-weight:700;color:rgba(245,244,240,0.62);}
  #tab-value .vf-row2.top3>.vf-c-rank{background:rgba(201,168,76,0.14);
    border-color:rgba(201,168,76,0.3);color:var(--gold);}
  #tab-value .vf-row2>.vf-c-av{display:none;}
  #tab-value .vf-row2>.vf-c-player{grid-column:1 / -1;padding:1px 0 12px 38px;
    border-bottom:1px solid rgba(255,255,255,0.07);}
  #tab-value .vf-row2>.vf-c-player .cf-player{font-size:15.5px;font-weight:600;}
  #tab-value .vf-row2>div[data-label]{grid-area:auto;text-align:left;border:0;padding:0;
    min-width:0;}
  #tab-value .vf-row2>div[data-label]::before{content:attr(data-label);display:block;
    font-family:var(--mono);font-size:7.5px;font-weight:700;letter-spacing:0.11em;
    text-transform:uppercase;color:rgba(245,244,240,0.36);margin-bottom:4px;white-space:nowrap;}
  #tab-value .vf-row2 .vf-odds,#tab-value .vf-row2 .vf-num,#tab-value .vf-row2 .vf-edge,
  #tab-value .vf-row2 .vf-move,#tab-value .vf-row2 .vf-move2,#tab-value .vf-row2 .vf-shop,
  #tab-value .vf-row2 .vf-book{display:block;text-align:left;justify-content:flex-start;
    font-size:15px;line-height:1.25;}
  #tab-value .vf-row2 .vf-odds-sub{display:block;font-size:9.5px;margin-top:3px;
    color:rgba(245,244,240,0.36);}
  #tab-value .vf-row2 .vf-book{font-size:11.5px;letter-spacing:0.04em;}

  /* ── Live: position as a pill, the score in a box, finish markets on one row ── */
  .cf-row.lv-row{position:relative;
    grid-template-areas:"player player player player"
                        "total today thru ."
                        "ott app arg putt"
                        "win t5 t10 t20";}
  .cf-row.lv-row>.lv-c-pos{position:absolute;top:13px;left:14px;grid-area:auto;
    display:inline-flex;align-items:center;justify-content:center;
    min-width:30px;height:22px;padding:0 7px;border-radius:7px;
    background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.1);
    font-family:var(--mono);font-size:11.5px;font-weight:700;color:rgba(245,244,240,0.7);}
  .cf-row.lv-row.top3>.lv-c-pos{background:rgba(201,168,76,0.14);
    border-color:rgba(201,168,76,0.3);color:var(--gold);}
  .cf-row.lv-row>.lv-c-player{grid-area:player;padding:1px 0 12px 44px;
    border-bottom:1px solid rgba(255,255,255,0.07);}
  /* The score is a fact about the round, not a strokes-gained reading, and colouring it like one
     made three unrelated numbers look like the same measurement. */
  .cf-row.lv-row>.lv-c-total,.cf-row.lv-row>.lv-c-today,.cf-row.lv-row>.lv-c-thru{
    color:rgba(245,244,240,0.92) !important;}
  .cf-row.lv-row>.lv-c-total{grid-area:total;font-size:22px;font-weight:600;
    letter-spacing:-0.01em;padding:5px 10px 6px;border-radius:9px;justify-self:start;
    background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.12);}
  .cf-row.lv-row>.lv-c-t20{grid-area:t20;display:block;}
}

@media(max-width:900px){
  /* ── Outrights: every value cell starts at the same left edge ───────────
     Odds and Move still carried align-items:center from the desktop rules, and the cells were
     free to sit anywhere in their track. Each one is now pinned to the start of its column with
     no residual centring, margin or width from the wide layout, so the six line up on one grid
     regardless of which price state produced them. */
  #tab-value .vf-row2>div[data-label]{
    justify-self:stretch;align-self:start;
    align-items:flex-start;justify-content:flex-start;
    margin:0;width:auto;max-width:none;text-align:left;}
  #tab-value .vf-row2>div[data-label]>*{
    margin-left:0;margin-right:auto;text-align:left;align-items:flex-start;}
  /* The sub-line under the price is a second row inside the cell, not a second column. */
  #tab-value .vf-row2 .vf-odds-sub{display:block;margin-left:0;text-align:left;}

  /* The rank pill and the name share one centre line. The pill was pinned to a fixed offset
     while the name sat on its own baseline, so it drifted low and collided with the text. */
  #tab-value .vf-row2>.vf-c-rank{top:12px;}
  #tab-value .vf-row2>.vf-c-player{
    display:flex;align-items:center;min-height:22px;padding:0 0 12px 38px;}
  #tab-value .vf-row2>.vf-c-player .cf-player{line-height:1.15;}

  /* ── Live: Today and Thru are read as often as the total ───────────────
     They were sized as supporting figures next to a 22px score; at 13px they were the smallest
     things on a card whose whole subject is the round in progress. */
  .cf-row.lv-row>.lv-c-today,.cf-row.lv-row>.lv-c-thru{
    font-family:var(--mono);font-size:18px;font-weight:600;letter-spacing:-0.01em;}
  .cf-row.lv-row>.lv-c-today .live-score,.cf-row.lv-row>.lv-c-thru,
  .cf-row.lv-row>.lv-c-today{line-height:1.15;}
}