/* PROPER — reference-locked October 25 visual system
   Matches the approved five-screen mockup: near-black canvas, vivid crimson,
   narrow compact dark cards, authentic team/headshot assets, slim navigation. */
:root{--bg:#02060c;--panel:#050d16;--panel2:#091521;--line:#192d3a;--muted:#8c9baa;--red:#ff173b;--green:#06e377;--white:#f8fbff;--softred:#280918; color-scheme:dark;}
html{background:#02060c}
body{background:radial-gradient(ellipse 1050px 340px at 50% -360px,#5c071b 0%,transparent 80%),#02060c;color:#f8fbff;font-size:13px}
.app{max-width:960px;padding:0 18px 110px}
.mast{height:75px;border-bottom:0;background:transparent;gap:8px}
.proper-logo{width:192px;height:auto;max-height:73px;display:block}
.brand-version{display:none}
.mast-actions{display:flex;gap:8px;align-items:center}
.icon-action,.data-btn.icon-action{background:none;border:0;color:#f9fcff;font-size:24px;height:38px;width:34px;display:flex;align-items:center;justify-content:center;gap:0;padding:0;position:relative}
.data-btn.icon-action i{position:absolute;width:6px;height:6px;right:0;top:3px;box-shadow:0 0 8px #0cda7a}
.mast-tabs{max-width:unset;width:100%;border-bottom:1px solid #1c2b35;margin:0 0 11px;display:flex;justify-content:space-between}
.mast-tabs button{font-size:12px;letter-spacing:-.1px;padding:11px 10px 12px;flex:1}
.mast-tabs button.selected{color:#ff3152;border-bottom:3px solid #ff173b}
.headline{display:none}
.screen{padding-top:3px}
.bar{margin:10px 0 13px}
.bar h2{font-size:14px;color:white;letter-spacing:-.2px;font-weight:800}
#gamesStamp{font-size:11px}
.game-list{grid-template-columns:1fr;gap:8px}
.game-card{background:linear-gradient(135deg,#071321,#050c16)!important;border:1px solid #1b3442!important;box-shadow:none;border-radius:10px;min-height:99px;padding:12px 13px;text-align:left}
.game-card:hover,.game-card:focus-visible{border-color:#f82848!important}
.game-teams{display:grid;grid-template-columns:66px 1fr 66px 10px;gap:8px;align-items:center}
.game-logo{display:grid;place-items:center}
.game-logo .team-logo{width:57px;height:57px;object-fit:contain}
.game-logo .logo-fallback{height:54px;width:54px;display:grid;place-items:center;padding:0;font-size:14px;border-color:#40506a;background:#101d2a}
.game-center{min-width:0;display:flex;flex-direction:column;gap:6px;align-items:flex-start;text-align:left}
.game-center strong{font-size:14px;white-space:nowrap;letter-spacing:-.3px;font-weight:760}
.game-center small{font-size:11px;color:#b0bece}
.game-center .matchup-lines{color:#fff;font-size:10px;font-weight:760;background:#0d1c2a;padding:4px 7px;border-radius:5px;border:1px solid #1f3446}
.chev{color:#ddd;font-weight:400;font-size:22px}
.compact-game{margin:0 0 11px}
.compact-row{background:#081420;border:1px solid #18303e;border-radius:10px;padding:8px 11px;gap:9px}
.compact-row strong{font-size:14px;color:#fff;white-space:nowrap}
.compact-row small{color:#a7b4c6;font-size:10px}
.compact-row .team-logo{height:43px;width:43px}
#screen-players .compact-game{display:none}
.spotlight{background:#020912;margin:-2px -2px 10px;border:0;padding:0 0 10px}
.spot-head{height:104px;display:flex;align-items:center;gap:14px;border-bottom:1px solid #172c3a}
.spot-head .headshot,.spot-head .avatar{width:90px;height:90px;border-radius:3px;object-fit:contain;background:transparent;object-position:center bottom}
.spot-head .team-logo{width:47px;height:47px;margin-left:auto}
.spot-name{min-width:0;flex:1}.spot-name strong{display:block;font-size:18px;font-weight:800;letter-spacing:-.5px}.spot-name small{display:block;color:#aab9c8;font-size:11px;margin-top:6px}
.spot-tabs{display:flex;justify-content:space-between;border-bottom:1px solid #1c2c3b}.spot-tabs button{border:0;background:none;color:#b2bccb;font-size:12px;font-weight:750;border-bottom:3px solid transparent;padding:13px 11px}.spot-tabs button.selected{color:#ff3150;border-bottom-color:#ff173b}
.market-filters{display:flex;gap:5px;overflow-x:auto;padding:14px 0 8px;scrollbar-width:none}.market-filters button{color:#d8dfe8;background:#10202e;border:1px solid #203c4d;font-weight:720;border-radius:7px;font-size:11px;white-space:nowrap;padding:10px 12px}.market-filters button.selected{background:#ff173b;color:#fff;border-color:#ff173b}
.spot-data{padding:7px 2px 14px}
.prop-overview-title{display:flex;justify-content:space-between;gap:10px;align-items:baseline;margin:9px 0 13px}.prop-overview-title b{font-size:16px}.prop-overview-title small{font-size:10px;color:#a0adba;text-align:right}
.duo-probs{display:grid;grid-template-columns:1fr 1fr;gap:9px}.prob-box{background:#051c14;border:1px solid #168253;border-radius:8px;text-align:left;padding:12px;color:#00e580;display:flex;flex-direction:column;gap:5px;min-width:0}.prob-box span{font-size:11px;font-weight:900}.prob-box b{font-size:29px;letter-spacing:-1px}.prob-box small{font-size:9px;color:#b8cec4}.prob-box.under{background:#250915;border-color:#7c1a32;color:#ff3151}.prob-box.under small{color:#e1b5c1}
.prob-bar.featured{height:25px;margin-top:14px;border-radius:5px}.prob-bar .over,.prob-bar .under{height:100%}.featured-legend{display:flex;justify-content:space-between;align-items:center;color:white;font-size:11px;font-weight:850;margin-top:-21px;position:relative;padding:0 15px;pointer-events:none}
.mini-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-bottom:1px solid #19303b;margin-top:26px;padding:4px 0 18px}.mini-stats div{display:grid;justify-items:center;gap:7px;border-right:1px solid #203544}.mini-stats div:last-child{border:0}.mini-stats small{color:#a0b1bf;font-size:10px}.mini-stats b{font-size:18px;color:white}
#screen-players>.bar,#playerSearch,#posFilters{margin-top:18px}.player-list{grid-template-columns:1fr;gap:5px}.player-item{border-radius:6px;padding:5px 10px;min-height:59px;background:#071523}.player-item .headshot,.player-item .avatar{width:45px;height:47px;object-fit:contain}.player-text strong{font-size:12px}.player-text small{font-size:10px}.checkmark{font-size:18px}.sticky-foot{background:linear-gradient(180deg,transparent,#02060c 20%);bottom:70px}
#screen-picks>.bar{margin:16px 0 5px}
#gameOutlook{margin:6px 0 14px}.stat3{gap:6px}.stat3>div{background:#071320;border:1px solid #1d3441;padding:10px 5px;border-radius:8px}.stat3 b{font-size:18px}.stat3 small{font-size:9px}
#edgeBanner{font-size:10px;color:#acb7c7;background:none;border:0;padding:3px 0 5px}
#rankFilters{display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px;margin:10px 0 8px}
#rankFilters button{border-radius:6px;font-size:11px;padding:10px 6px;white-space:nowrap}
.explain-note{font-size:10px;margin:6px 0 12px}
.pick-list{grid-template-columns:1fr;gap:5px;margin:6px 0 13px}
.pick-card{border:1px solid #1a3341;background:#061320;box-shadow:none;border-radius:9px;padding:9px 10px}
.pick-head{gap:8px;min-height:55px}
.pick-number{font-size:15px;font-weight:850;color:white;width:16px;min-width:16px}
.pick-head .headshot,.pick-head .avatar{width:48px;height:47px;border-radius:4px;object-fit:contain;background:#0a1f30}
.pick-head .team-logo{height:37px;width:37px}
.pick-meta{min-width:0;flex:1;display:grid;gap:2px}
.pick-meta strong{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pick-meta small{color:#a4b2c1;font-size:10px;display:block}
.micro-prob{font-size:13px;color:#00e582;font-weight:850;line-height:1.2}
.mini-quote{font-size:11px;color:#d9e2ec;white-space:nowrap}
.pick-plus{height:29px;width:29px;border:1px solid #ff2349;border-radius:50%;display:grid;place-items:center;background:transparent;color:#ff244a;font-size:25px;font-weight:300;line-height:1;padding:0;flex:none}
.pick-plus.selected{background:#ff173b;color:white}
.pick-meter{height:5px;width:50%;background:#172733;border-radius:15px;margin-left:71px;margin-top:-8px;overflow:hidden}.pick-meter span{display:block;background:linear-gradient(90deg,#00a96a,#00ef8a);height:100%}
.pick-tools{margin-top:11px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid #192c3b;padding-top:8px}.pick-tools small{font-size:9px;color:#738da0}.pick-tools button{background:none;border:0;font-size:10px;font-weight:700;color:#ff3c56}
#showAllPicks,.outline-action{border-radius:7px;padding:11px}
#screen-parlay>.subtle{font-size:11px}
.parlay-leg{background:#061422;border:1px solid #1b3443;border-radius:9px;padding:8px 10px;gap:12px;justify-content:initial}.parlay-leg .headshot,.parlay-leg .avatar,.parlay-leg .team-logo{width:45px;height:45px;object-fit:contain}.parlay-leg>div{flex:1}.parlay-leg strong{font-size:12px}.parlay-leg small{font-size:10px;margin-top:3px}.parlay-leg button{font-size:24px;color:#ff294d}
.advisor{background:#061421;padding:13px;border-radius:9px}.advisor h3{font-size:16px}.advisor-warning{background:#210e1a;color:#e3afbc}.advisor .triple b{font-size:22px}.advisor .triple small{font-size:10px}
.replay-tabs button{font-size:11px;padding:12px 5px}.replay-wrap{padding:8px;background:transparent;border:0;box-shadow:none;margin-top:3px}
.replay-label{margin-bottom:8px}.replay-score{padding:6px 0 12px}.replay-score .score-team strong{font-size:31px}.replay-score .score-team img{width:42px;height:42px}.score-team span{display:none}.replay-time span{font-size:12px}
.field-screen{aspect-ratio:1.48;border-radius:0;border:1px solid #24445d}.field-grass{background:repeating-linear-gradient(90deg,#096533 0%,#096533 10%,#087c42 10%,#087c42 20%)}.endzone-left{background:#0d4057}.endzone-right{background:#1c438b}.field-stripes{opacity:.65}
.replay-play{background:#091a29;border:1px solid #253947;border-radius:7px;padding:12px;margin-top:7px;min-height:68px}.replay-nav>button{background:none}.replay-nav>button.play-toggle{color:#ff1643;background:#19060e;border:2px solid #ff143a}
.seed-controls button{border:0;color:#dfeaf2;background:transparent;font-size:30px}.seed-controls input{background:#0c1c2a;color:white;border:1px solid #243745;border-radius:6px;padding:7px;text-align:center}
#replaySecondary{border-top:1px solid #1e3341;padding-top:11px}
.navbar{background:#02070dfc;box-shadow:0 -6px 22px #0009;border-top:1px solid #152635;height:77px;padding-bottom:env(safe-area-inset-bottom)}
.navbar button{color:#9da9b8;font-size:10px;min-width:0;font-weight:550}
.navbar button span{font-size:24px;color:#abbaca;margin-bottom:5px}.navbar button.selected{color:#ff2143}.navbar button.selected span{color:#ff2143;text-shadow:0 0 14px #ff173b66}
.mainbutton{background:linear-gradient(100deg,#ff3044,#ff0738);border-radius:7px;box-shadow:none}.modal{background:#07121e;border-color:#223649}.empty{background:#081624;border-color:#294151;color:#bed0dc}
@media(max-width:660px){
 .app{padding:0 13px 108px}
 .mast{height:66px}.proper-logo{width:167px;height:auto;max-height:55px}
 .mast-tabs{margin:0 -13px 10px;width:calc(100% + 26px)}
 .mast-tabs button{padding:11px 5px;font-size:12px}
 .bar{margin:9px 0 11px}
 .game-list{gap:8px}.game-card{padding:8px 7px;min-height:85px}.game-teams{grid-template-columns:50px 1fr 50px 8px;gap:5px}
 .game-logo .team-logo{width:46px;height:46px}.game-logo .logo-fallback{width:46px;height:46px;font-size:11px}
 .game-center strong{font-size:13px}.game-center small{font-size:10px}.game-center .matchup-lines{font-size:9px;padding:3px 5px}
 .spot-head{height:93px}.spot-head .headshot,.spot-head .avatar{width:82px;height:84px}.spot-head .team-logo{width:43px;height:43px}.spot-name strong{font-size:16px}
 .prop-overview-title b{font-size:14px}.prob-box b{font-size:26px}.duo-probs{gap:7px}.prob-box{padding:9px}
 .pick-card{padding:8px}.pick-head{gap:6px}.pick-head .headshot,.pick-head .avatar{width:42px;height:43px}.pick-plus{height:27px;width:27px}
 .pick-meter{margin-left:61px}.replay-score .score-team img{height:35px;width:35px}
 .navbar button{font-size:9px}.navbar button span{font-size:20px}
}
@media(min-width:661px){.game-list{grid-template-columns:repeat(2,minmax(0,1fr))}.pick-list{grid-template-columns:repeat(2,minmax(0,1fr))}.player-list{grid-template-columns:repeat(2,minmax(0,1fr))}.spotlight{max-width:640px;margin:0 auto 12px}#screen-replay{max-width:720px;margin:auto}#screen-parlay{max-width:720px;margin:auto}}

/* Exact-reference compact Top 5 treatment: prioritize five names above the fold. */
#screen-picks #gameOutlook,#screen-picks>.bar,#screen-picks #edgeBanner,#screen-picks .explain-note{display:none}
#screen-picks .compact-game{margin:0 0 9px}
#screen-picks .compact-row{min-height:70px}
#screen-picks #rankFilters{grid-template-columns:1fr 1fr;margin:5px 0 12px}
#screen-picks #rankFilters button[data-rank="all"]{display:none}
#screen-picks .pick-card{min-height:73px;padding:7px 9px}
#screen-picks .pick-head{min-height:52px}
#screen-picks .pick-tools{display:none}
#screen-picks .pick-meter{margin-top:-6px;margin-bottom:0}
.pick-why{background:transparent;border:1px solid #3c5467;color:#94abbc;border-radius:50%;height:21px;width:21px;display:grid;place-items:center;font-size:11px;padding:0;flex:none}
#addAllFive{display:block;width:100%;margin-top:13px;height:44px}
#screen-players .sticky-foot{display:none}
#screen-players .spotlight{padding-bottom:8px}
#screen-players .player-list{padding-bottom:18px}

/* Verified logo overlay on player headshot, like the approved reference. */
.player-art{display:block;position:relative;flex:none;width:44px;height:45px}
.player-art .headshot,.player-art .avatar{width:44px;height:45px}
.player-art .team-logo{position:absolute;right:-7px;bottom:0;width:20px;height:20px;filter:drop-shadow(0 0 3px #02060c)}
.player-art .logo-fallback{position:absolute;right:-7px;bottom:0;padding:2px;font-size:7px;background:#081421;border:1px solid #344552}
.navbar button[data-screen="parlay"] span{font-size:18px;letter-spacing:-3px}