/* Home + Games sections (home-sections.js). Written in the light palette like the rest of the workspace;
   tools/make-dark.mjs turns it black-and-red. */
.hm-filters{display:flex;flex-direction:column;gap:10px;margin:4px 0 16px}
.hm-views{display:flex;gap:8px;flex-wrap:wrap}
.hm-views button{display:inline-flex;align-items:center;gap:6px;min-height:38px;padding:0 16px;border-radius:999px;border:1px solid #d5d9df;background:#fff;color:#2f3742;font:800 13.5px Manrope,sans-serif;cursor:pointer}
.hm-views button small{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:#eef0f3;color:#2f3742;font:800 11px Manrope,sans-serif}
.hm-views button.is-active{background:#e5132f;border-color:#e5132f;color:#fff}
.hm-views button.is-active small{background:#ffffff33;color:#fff}
.hm-filters .tabs{margin:0}
.hm-sec{margin:6px 0 22px}
.hm-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:10px}
.hm-head h2{margin:0;font:900 21px/1.2 Manrope,sans-serif;color:#0e1116;padding-left:12px;border-left:4px solid #e5132f}
.hm-head a{font:800 13px Manrope,sans-serif;color:#d9001b;text-decoration:none}
.hm-head a:hover{text-decoration:underline}
.hm-board-title{margin-top:8px}
/* featured matchups */
.fm-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
@media (max-width:1180px){.fm-row{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:700px){.fm-row{grid-template-columns:minmax(0,1fr)}}
.fm-card{display:grid;gap:10px;padding:14px;border:1px solid #e2e5e9;border-radius:14px;background:#fff;min-width:0}
.fm-card.is-live{border-color:#f3c2c9}
.fm-card header,.fm-card footer{display:flex;justify-content:space-between;align-items:center;gap:8px;font:700 12px Manrope,sans-serif;color:#5b6470}
.fm-card footer{flex-wrap:wrap}
.fm-card footer a{color:#d9001b;font-weight:800;text-decoration:none;margin-left:auto}
.fm-why{padding:4px 9px;border-radius:999px;font:900 10.5px Manrope,sans-serif;letter-spacing:.06em;text-transform:uppercase;background:#f1f3f5;color:#2f3742}
.fm-why-pick{background:#e5132f;color:#fff}.fm-why-live{background:#fff0f2;color:#b4232f}.fm-why-follow{background:#fff6e5;color:#8a5a00}.fm-why-group{background:#eef4ff;color:#1d4ed8}
.fm-when{display:inline-flex;align-items:center;gap:6px}
.fm-dot,.gw-status i,.cw-card span i,.sw-card span i{width:7px;height:7px;border-radius:50%;background:#e5132f;display:inline-block;animation:gPulse 1.6s infinite}
.fm-cols,.fm-btns{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.fm-cols small{font:800 10px Manrope,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#5b6470;text-align:center}
.fm-side{display:grid;gap:6px}
.fm-team{display:flex;align-items:center;gap:8px;min-width:0;color:#0e1116;text-decoration:none}
.fm-team b{font:800 14px Manrope,sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.fm-team em{margin-left:auto;font:900 16px Manrope,sans-serif;font-style:normal}
.fm-btns .sl-mb{min-height:44px;min-width:0}
/* player spotlight */
.ps-filters{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px}
.ps-filters button{min-height:32px;padding:0 13px;border-radius:999px;border:1px solid #d5d9df;background:#fff;color:#2f3742;font:800 12.5px Manrope,sans-serif;cursor:pointer}
.ps-filters button.is-active{background:#0e1116;border-color:#0e1116;color:#fff}
.ps-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,430px),1fr));gap:8px;container:pslist/inline-size}
.ps-row{display:grid;grid-template-columns:minmax(0,1fr) 78px 74px 74px;gap:8px;align-items:center;padding:10px 12px;border:1px solid #e2e5e9;border-radius:12px;background:#fff}
.ps-who{display:flex;align-items:center;gap:10px;min-width:0;color:#0e1116;text-decoration:none}
.ps-who span{display:grid;min-width:0}
.ps-who b{font:800 14px Manrope,sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ps-who small{font:600 12px Manrope,sans-serif;color:#5b6470}
.ps-live{font-style:normal;color:#d9001b;font-weight:900}
.ps-mkt{display:grid;text-align:center}
.ps-mkt small{font:800 12px/1.25 Manrope,sans-serif;color:#2f3742}
.ps-mkt b{font:900 16px Manrope,sans-serif;color:#0e1116}
.ps-row .sl-mb{min-height:44px}
/* your group is watching / continue watching */
.gw-row,.cw-row{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(230px,1fr);gap:10px;overflow-x:auto;padding-bottom:4px;scrollbar-width:thin}
.gw-card,.cw-card{display:grid;gap:4px;align-content:start;padding:12px 14px;border:1px solid #e2e5e9;border-radius:12px;background:#fff;color:#0e1116;text-decoration:none;min-width:0}
.gw-card:hover,.cw-card:hover{border-color:#cfd4da;box-shadow:0 8px 20px -14px #10182855}
.gw-card.is-live,.cw-card.is-live{border-color:#f3c2c9}
.gw-top{display:flex;justify-content:space-between;gap:8px;font:600 12.5px Manrope,sans-serif;color:#2f3742}
.gw-top small{color:#1d4ed8;font-weight:800;white-space:nowrap}
.gw-pick,.cw-card b{font:800 14px/1.3 Manrope,sans-serif;color:#0e1116}
.gw-status,.cw-card span{display:flex;align-items:center;gap:6px;font:700 12px Manrope,sans-serif;color:#5b6470}
.gw-need,.cw-card em{font:800 12.5px Manrope,sans-serif;font-style:normal;color:#b4232f}
.gw-meta{font:600 11.5px Manrope,sans-serif;color:#8a929c}
.cw-card small{font:700 11px Manrope,sans-serif;color:#8a929c}
/* the group link under a game */
.gg-link{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;background:#eef4ff;color:#1d4ed8;font:700 12px Manrope,sans-serif;text-decoration:none;white-space:nowrap}
.gg-link:hover{background:#e0eaff}
.gg-link b{color:#b4232f}
.sl-row-foot{gap:10px;flex-wrap:wrap}
/* board: "show more" instead of page numbers; a tick on a selected price */
.sl-league-head h3 small{margin-left:8px;font:700 12px Manrope,sans-serif;color:#8a929c}
.sl-league-more{display:flex;justify-content:center;align-items:center;gap:16px;padding:12px}
.sl-league-more .secondary{min-height:38px;padding:0 16px}
body .sl-mb.is-selected,body .odds.selected{position:relative}
body .sl-mb.is-selected::after,body .odds.selected::after{content:'✓';position:absolute;top:3px;right:5px;font:900 10px/1 Manrope,sans-serif;color:#fff;opacity:.95}
/* compact empty betslip + what you're watching */
body .slip-empty.slip-empty-compact{display:flex;align-items:center;gap:12px;text-align:left;padding:14px 4px 10px}
body .slip-empty.slip-empty-compact .icon{width:28px;height:28px;margin:0;flex:none}
.slip-empty-compact p{margin:0;display:grid;gap:2px}
.slip-empty-compact b{font:800 14px Manrope,sans-serif;color:#0e1116}
.slip-empty-compact small{font:600 12.5px Manrope,sans-serif;color:#5b6470}
.slip-rail .keep-browsing{display:none}
.slip-rail.open .keep-browsing{display:flex}
.sw-card{margin-top:12px;padding:14px 16px;border:1px solid #e2e5e9;border-radius:14px;background:#fff}
.sw-card h3{margin:0 0 8px;font:900 15px Manrope,sans-serif;color:#0e1116}
.sw-card ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.sw-card a{display:grid;gap:2px;padding:8px 10px;border-radius:10px;background:#f7f8fa;color:#0e1116;text-decoration:none}
.sw-card a:hover{background:#eef0f3}
.sw-card a.is-live{box-shadow:inset 3px 0 #e5132f}
.sw-card small{font:700 11px Manrope,sans-serif;color:#8a929c}
.sw-card b{font:800 13px Manrope,sans-serif}
.sw-card span{display:flex;align-items:center;gap:6px;font:700 12px Manrope,sans-serif;color:#5b6470}
.sw-card em{font:800 12px Manrope,sans-serif;font-style:normal;color:#b4232f}
.sw-empty{margin:0;font:600 12.5px/1.45 Manrope,sans-serif;color:#5b6470}
/* games: the stadium display before kickoff — start time and the two teams, not an empty score */
body .broadcast-screen .spotlight-score.spot-pre{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:18px;text-align:center}
.spot-pre .sp-team{display:grid;justify-items:center;gap:6px;color:#fff}
.spot-pre .sp-team em{font:800 16px/1.2 Manrope,sans-serif;font-style:normal;color:#fff}
.spot-pre .sp-team small,.spot-pre .sp-when small{display:block!important;font:700 10.5px Manrope,sans-serif!important;letter-spacing:.14em!important;text-transform:uppercase;color:#cbd3df!important}
.spot-pre .sp-when{display:grid;justify-items:center;gap:4px;padding:0 10px;border-left:1px solid #ffffff2e;border-right:1px solid #ffffff2e}
.spot-pre .sp-when b{font:900 clamp(30px,3.6vw,52px)/1 Manrope,sans-serif!important;letter-spacing:-1px!important;color:#fff}
.spot-entries{display:flex;gap:8px;flex-wrap:wrap}
.spot-entry{display:inline-flex;align-items:center;gap:8px;min-height:38px;padding:0 16px;border-radius:999px;border:1px solid #ffffff55;background:#ffffff14;color:#fff!important;font:800 13px Manrope,sans-serif;text-decoration:none!important}
.spot-entry:hover{background:#ffffff26}
.spot-entry small{font:700 11px Manrope,sans-serif;color:#cbd3df}
.spotlight-bottom{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.spotlight-bottom .gg-link{background:#ffffff1f;color:#fff}
.broadcast-channels button{border:0;cursor:pointer;font:inherit}
body .broadcast-screen .spotlight-score.spot-pre{max-width:380px;gap:12px;padding:16px 18px}
.spot-pre .sp-team em{font-size:14px!important;letter-spacing:0!important;line-height:1.2!important;max-width:110px;overflow-wrap:anywhere}
.spot-pre .sp-team small{letter-spacing:.12em!important}
.spot-pre .sp-when b{font-size:clamp(26px,2.6vw,40px)!important;white-space:nowrap;letter-spacing:-.5px!important}
.spot-pre .score-team-identity{transform:scale(.9)}
@container pslist (max-width:429px){.ps-row{grid-template-columns:minmax(0,1fr) 72px 72px}.ps-who{grid-column:1/-1}.ps-mkt{text-align:left;justify-items:start;display:flex;gap:8px;align-items:baseline}}
.fm-when{white-space:nowrap}
.fm-why{white-space:nowrap}
@media (max-width:1180px){.fm-row .fm-card:nth-child(3){display:none}}
@media (max-width:700px){.fm-row .fm-card:nth-child(3){display:grid}}
/* sidebar art under My groups */
.side-art{position:relative;display:block;margin:12px 6px 6px;border-radius:14px;overflow:hidden;background:#0b0c0f;border:1px solid #2a2e35;text-decoration:none;min-height:230px}
.side-art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:78% 40%;display:block;opacity:.7;transition:transform .3s}
.side-art:hover img{transform:scale(1.04)}
.side-art span{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;gap:8px;padding:16px 14px 14px;background:linear-gradient(180deg,#0b0c0f10 20%,#0b0c0fee 75%)}
.side-art b{font:900 20px/1 Oswald,'Bebas Neue',Manrope,sans-serif;letter-spacing:.02em;text-transform:uppercase;color:#d5d9df}
.side-art i{display:block;width:28px;height:3px;background:#e5132f}
.side-art small{font:600 10.5px/1.45 Manrope,sans-serif;color:#9aa2ad}
body.side-mini .side-art{display:none}
@media (max-height:780px){.side-art{min-height:170px}.side-art small{display:none}}
/* right rail: your group, under the empty betslip */
.rg-card{position:relative;margin-top:12px;padding:20px 20px 18px;border:1px solid #e2e5e9;border-radius:16px;background:#fff;overflow:hidden;display:grid;gap:10px}
.rg-art{position:absolute;right:-30px;top:10px;width:190px;height:240px;background:url(/art/model-dragon.png) right top/contain no-repeat;opacity:.35;pointer-events:none}
.rg-card>*:not(.rg-art){position:relative}
.rg-card h3{margin:0;font:900 20px Manrope,sans-serif;color:#0e1116}
.rg-name{margin:0;display:flex;align-items:center;gap:8px;font:900 19px Manrope,sans-serif;color:#0e1116}
.rg-faces{display:flex}.rg-faces .ga{margin-left:-8px;border:2px solid #fff}.rg-faces .ga:first-child{margin-left:0}
.rg-tag{margin:0;font:600 14px/1.45 Manrope,sans-serif;color:#2f3742}
.rg-tag b{color:#b4232f}
.rg-sub{margin:0;font:600 13px/1.45 Manrope,sans-serif;color:#5b6470}
.rg-btn{justify-self:start;display:inline-flex;align-items:center;gap:10px;min-height:42px;padding:0 18px;border-radius:10px;border:1.5px solid #e5132f;color:#d9001b;font:800 14px Manrope,sans-serif;text-decoration:none}
.rg-btn:hover{background:#fff0f2}
.rg-quote{margin:6px 0 0;padding-top:10px;border-top:1px solid #e2e5e9;font:italic 600 13px/1.5 Manrope,sans-serif;color:#5b6470}
/* casino coming soon */
.cz{display:grid;gap:18px}
.cz-hero{position:relative;border-radius:18px;overflow:hidden;min-height:220px;display:flex;align-items:flex-end;background:#0b0c0f}
.cz-hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:right center}
.cz-hero::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#0b0c0ff2 30%,#0b0c0f33)}
.cz-hero div{position:relative;z-index:1;padding:26px;max-width:560px;color:#fff}
.cz-hero .eyebrow{color:#ff4d6a!important;margin:0 0 8px}
.cz-hero h1{margin:0;font:900 clamp(28px,3vw,40px)/1.05 Manrope,sans-serif;color:#fff;text-transform:none}
.cz-hero p{margin:10px 0 0;color:#d5dae1;font:600 15px/1.5 Manrope,sans-serif}
.cz-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:14px}
.cz-card{position:relative;display:grid;gap:8px;padding:22px;border-radius:16px;border:1px solid #2a2e35;background:radial-gradient(120% 90% at 85% 0%,#5b0f1d 0,#16181d 60%);color:#fff;min-height:190px;align-content:end}
.cz-baccarat{background:radial-gradient(120% 90% at 85% 0%,#0f3b2a 0,#16181d 60%)}
.cz-roulette{background:radial-gradient(120% 90% at 85% 0%,#3a2a0a 0,#16181d 60%)}
.cz-suit{position:absolute;top:14px;right:18px;font-size:56px;line-height:1;color:#ffffff22}
.cz-card h2{margin:0;font:900 22px Manrope,sans-serif;color:#fff}
.cz-card p{margin:0;color:#c9cfd8;font:600 13.5px/1.45 Manrope,sans-serif}
.cz-soon{justify-self:start;padding:5px 10px;border-radius:999px;background:#e5132f;color:#fff;font:900 11px Manrope,sans-serif;letter-spacing:.06em;text-transform:uppercase}
.cz{width:100%}
.cz-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:760px){.cz-grid{grid-template-columns:minmax(0,1fr)}}

/* the group card stays under the slip on desktop; the phone slip drawer is just the slip */
@media (max-width:1100px){.slip-rail.open .rg-card{display:none}}
