/* ==========================================================================
   vsin_propicks_ui.css
   The Pro Picks pages (propicks_page.php, propicks_blocks.php). Sits on top
   of vsin_stats_ui.css and must load after it: every rule is scoped under
   .vst and reads the tokens that sheet sets there (--red, --head, --good...).
   Nothing in here is used by any other page.
   ========================================================================== */

/* one table for every list view; group headers are black band rows; on a
   phone each row lays out as a card, the same trick the power ratings use */
.vst .pp-nav a{padding:7px 10px;}
/* the date chips, styled like the sport chips: label, the count in a dark end-cap */
.vst .pp-dates a{display:inline-flex; align-items:center; gap:6px; padding:0 0 0 10px; border-radius:4px; border:1px solid #c4c4c4; background:#fff; color:#000; font-weight:800; overflow:hidden;}
.vst .pp-dates a .lbl{padding:5px 0; font-size:12px; letter-spacing:.02em; white-space:nowrap;}
.vst .pp-dates a .ct{display:inline-block; min-width:30px; margin-left:2px; padding:5px 7px; text-align:center; font-size:12px; font-weight:800; background:#2b2f36; color:#fff; font-variant-numeric:tabular-nums;}
.vst .pp-dates a:hover{border-color:var(--red);}
.vst .pp-dates a:hover .ct{background:var(--red);}
.vst .pp-dates a.on{background:#000; border-color:#000; color:#fff;}
.vst .pp-dates a.on .ct{background:var(--red);}
.vst .pp-dates a.pp-none .ct{background:#9aa3ad;}
.vst .pp-dates a.pp-arrow{padding:0 10px;}
/* the sport chips: logo, label, the active count in its own dark box on the right */
.vst .pp-sports a{display:inline-flex; align-items:center; gap:6px; padding:0 0 0 8px; border-radius:4px; border:1px solid #c4c4c4; background:#fff; color:#000; font-weight:800; overflow:hidden;}
.vst .pp-sports a .pg-sicon{width:18px; height:18px; object-fit:contain; flex:0 0 auto;}
.vst .pp-sports a .lbl{padding:5px 0; font-size:12px; letter-spacing:.02em;}
.vst .pp-sports a .ct{display:inline-block; min-width:30px; margin-left:2px; padding:5px 7px; text-align:center; font-size:12px; font-weight:800; background:#2b2f36; color:#fff; font-variant-numeric:tabular-nums;}
.vst .pp-sports a:hover{border-color:var(--red);}
.vst .pp-sports a:hover .ct{background:var(--red);}
.vst .pp-sports a.on{background:#000; border-color:#000; color:#fff;}
.vst .pp-sports a.on .ct{background:var(--red);}
.vst .pp-dates a.pp-none{color:#777;}
.vst .pp-dates a.pp-none small{background:transparent; color:#999;}
.vst .pp-tools{border-top:0; margin-top:0; padding-top:10px; gap:10px 14px;}
.vst .pp-tools .pp-group{padding:0; min-height:0; flex:1 1 auto;}
.vst .pp-tools .vst-search{flex:0 1 260px;}
.vst .pp-tools .vst-count{color:#222;}

/* two columns: the picks, and a rail kept clear for now (ads, matrix later) */
/* the old col-xl-8 / col-xl-3 split: the picks take two thirds, the rail the rest */
.vst .pp-cols{grid-template-columns:minmax(0,2fr) minmax(300px,1fr); gap:0 18px; padding:0 18px 0 0;}
.vst .pp-cols > .vst-main{min-width:0;}
.vst .pp-rail{min-width:0;}
@media (max-width:1399px){ .vst .pp-cols{grid-template-columns:minmax(0,1fr) 280px;} .vst .pp-rail .pp-rrow .rec{display:none;} }
@media (max-width:1199px){ .vst .pp-cols{grid-template-columns:1fr; padding-right:0;} .vst .pp-rail{display:none;} }

/* the picks table: a side stack (sport, score, result) and the pick cell */
.vst .pp-table table{min-width:0; width:100%; table-layout:fixed;}
.vst .pp-table th.c-side{width:88px;}
.vst .pp-table tbody td{padding:7px 6px; font-size:12px; line-height:1.3; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; vertical-align:middle; color:#000;}
/* striping by the alt class from PHP (restarts under every band); the base sheet's sticky white td.l is switched off here; no hover */
/* every pick on white; a thick pale rule between picks does the separating, not stripes */
.vst .pp-table tbody tr.pp-row td,.vst .pp-table tbody tr.pp-row td.l{background:#fff; border-bottom:6px solid #e4e6ea;}
.vst .pp-table tbody tr.pp-row:last-child td{border-bottom:0;}
.vst .pp-table td.l,.vst .pp-table thead tr.c th.l{position:static;}
.vst .pp-table thead tr.c th{padding:6px 6px;}
.vst .pp-table td.pp-side{padding:8px 6px 8px 10px;}
.vst .pp-table td.pp-side > *{display:block; width:68px; margin:0 auto 5px; text-align:center; box-sizing:border-box;}
.vst .pp-table td.pp-side > *:last-child{margin-bottom:0;}
.vst .pp-table td.pp-side .bx{min-width:0; padding:4px 2px; font-size:13px;}
.vst .pp-table td.pp-side .res{min-width:0; font-size:9px; padding:5px 2px;}
/* live, muted: slate badge, plain outlined score */
.vst .pp-table .res.live{color:#fff; background:var(--muted);}
.vst .pp-table .bx.score.live{border-color:#8896a7; background:#fff; color:#000;}
/* the sport chip leads the expert line */
.vst .pp-sportchip{flex:0 0 auto; display:inline-block; width:46px; padding:2px 0; border:1px solid #000; border-radius:3px; font-size:9px; font-weight:800; letter-spacing:.05em; color:#000; background:#fff; text-align:center;}
.vst .pp-sportchip:hover{color:#fff; background:var(--black);}
.vst .pp-na{display:block; color:#999; font-weight:700;}
.vst .pp-table td.pp-main{padding:8px 10px 9px 4px;}
/* expert line, the book at its right end */
.vst .pp-meta{display:flex; align-items:center; gap:8px; font-size:12px; font-weight:700; color:#222;}
.vst .pp-meta .pp-who{flex:1 1 auto; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.vst .pp-meta .sep{color:#888; margin:0 5px;}
.vst .pp-meta a.pp-expert{color:var(--red); font-weight:800; font-size:13px;}
.vst .pp-meta a.pp-expert:hover{color:var(--black);}
.vst .pp-meta .pp-show{font-weight:800; color:#000;}
.vst .pp-meta .pp-posted{color:var(--blue); font-weight:800; font-size:11px;}
.vst .pp-rank{display:inline-block; margin-right:4px; padding:1px 5px; border-radius:3px; background:var(--green); color:#fff; font-size:8px; font-weight:800; letter-spacing:.04em; vertical-align:1px;}
.vst .pp-bookchip{flex:0 0 auto; display:inline-block; width:64px; padding:2px 4px; border-radius:3px; background:#fff3b0; border:1px solid #e0c35a; font-size:10px; font-weight:800; color:#1a1a1a; text-align:center; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
/* the pick in its own box under the expert line */
.vst .pp-box{margin-top:4px; padding:5px 10px 6px; border:1px solid #c4c4c4; border-radius:4px; background:#f1f1f1;}
.vst .pp-box .pp-when{font-size:11px; font-weight:800; color:var(--blue); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.vst .pp-box .pp-when .sep{color:#888; margin:0 4px; font-weight:700;}
.vst .pp-box .pp-when a{color:var(--blue); text-decoration:underline;}
.vst .pp-box .pp-when a.pp-day{text-decoration:none;}
.vst .pp-box .pp-when a.pp-day:hover{text-decoration:underline;}
.vst .pp-box .pp-when a:hover{color:var(--red);}
.vst .pp-box .pp-when .fa{margin-right:3px; color:#555;}
.vst .pp-play{margin-top:2px; font-size:14px; font-weight:800; color:#000; white-space:normal; line-height:1.3;}
.vst .pp-play a{color:#000;}
.vst .pp-play a:hover{color:var(--red);}
.vst .pp-tag{display:inline-block; margin-left:6px; padding:1px 5px; border-radius:3px; background:#e4ecf7; border:1px solid #b9cbe6; color:var(--blue); font-size:8px; font-weight:800; letter-spacing:.05em; text-transform:uppercase; vertical-align:1px;}
.vst .pp-live{color:var(--red); font-weight:800; text-transform:uppercase; letter-spacing:.06em; font-size:9px;}
.vst .pp-table tr.is-win td:first-child{box-shadow:inset 4px 0 0 var(--good);}
.vst .pp-table tr.is-loss td:first-child{box-shadow:inset 4px 0 0 var(--bad);}
.vst .pp-table tr.is-push td:first-child,.vst .pp-table tr.is-can td:first-child{box-shadow:inset 4px 0 0 #999;}
/* group header: label left, count and record right */
.vst .pp-table tbody tr.pp-mo td{padding:6px 12px; font-size:11px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:#fff; background:var(--head); border-bottom:2px solid var(--red); text-align:left; white-space:nowrap;}
.vst .pp-table .pp-mo-in{display:flex; justify-content:space-between; align-items:center; gap:12px;}
.vst .pp-table .pp-mo-label small{font-size:10px; font-weight:700; color:#ccc; text-transform:none; letter-spacing:0; margin-left:6px;}
.vst .pp-table .pp-mo-label .pp-rank{margin-right:4px;}
.vst .pp-table .pp-mo-n{font-size:10px; font-weight:700; color:#ddd; text-transform:none; letter-spacing:0;}
.vst .pp-table .pp-mo-n b{color:#fff;}
.vst .pp-table .pp-mo-n b.pos{color:#8fd14f;}
.vst .pp-table .pp-mo-n b.neg{color:#ff6b6b;}
.vst .pp-table tr[hidden]{display:none;}
/* experts board */
/* optional frame: set $ppFramed = true in a route stub to see the page with a border down each side */
.vst.pp-framed{border-left:1px solid #c4c4c4; border-right:1px solid #c4c4c4; padding:0 14px 14px;}
@media (max-width:767px){ .vst.pp-framed{border:0; padding:0;} }

/* the experts page: two boards side by side, full width, no rail */
.vst .pp-cols.pp-full{grid-template-columns:1fr; padding-right:0;}
.vst .pp-cols.pp-full .pp-rail{display:none;}
.vst .pp-boards{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:0 18px; align-items:start;}
.vst .pp-boards .pp-board{margin-top:0; min-width:0;}
.vst .pp-board-table{overflow-x:auto;}
.vst .pp-board-table table{min-width:0; table-layout:fixed;}
.vst .pp-board-table th{white-space:nowrap; overflow:visible; text-overflow:clip; padding-left:4px; padding-right:4px;}
.vst .pp-board-table tbody tr td,.vst .pp-board-table tbody tr:nth-child(even) td,.vst .pp-board-table tbody tr:nth-child(odd) td,.vst .pp-board-table tbody tr td.l,.vst .pp-board-table tbody tr:hover td{background:#fff !important;}
.vst .pp-board-table tbody tr + tr td{border-top:1px solid #e4e6ea;}
.vst .pp-board-table td.name,.vst .pp-board-table th.l{border-right:2px solid #c4c4c4;}
.vst .pp-board-table table{width:100%;}
.vst .pp-board-table th{font-size:11px;}
.vst .pp-board-table td,.vst .pp-board-table th,.vst .pp-board-table td.l,.vst .pp-board-table th.l{position:static; left:auto;}
.vst .pp-board-table td{padding:5px 6px; font-size:12px; font-weight:800; color:#000; background:#fff;}
.vst .pp-board-table td.name a{color:var(--red); font-size:13px; font-weight:800;}
.vst .pp-board-table td.name a:hover{color:var(--black);}
.vst .pp-board-table td.rec,.vst .pp-board-table td.pct{font-variant-numeric:tabular-nums;}
.vst .pp-board-table .bx{min-width:0; width:100%; display:block; padding:3px 4px; font-size:12px;}
.vst .pp-board-table .bx.pos{background:var(--green); border-color:var(--green); color:#fff;}
.vst .pp-board-table .bx.neg{background:var(--bad); border-color:var(--bad); color:#fff;}
.vst .pp-board-table tbody.pp-top3 td{background:#fff;}
.vst .pp-board-table tbody + thead th{border-top:2px solid #fff;}
.vst .pp-brk{display:block; width:34px; margin:0 auto; padding:3px 0; border-radius:3px; border:1px solid #c4c4c4; background:#fff; color:#000; text-align:center; font-size:12px; font-weight:800;}
.vst .pp-brk.top{color:#fff; border-color:transparent;}
.vst .pp-brk.t1{background:#e6b800;}
.vst .pp-brk.t2{background:#9aa3ad;}
.vst .pp-brk.t3{background:#c47a3a;}
.vst .pp-board-empty{font-weight:600; color:#333; padding:14px 10px;}
@media (max-width:991px){ .vst .pp-boards{grid-template-columns:1fr;} .vst .pp-boards .pp-board + .pp-board{margin-top:14px;} }
/* phones: the whole board scrolls sideways at its desktop width, nothing frozen */
@media (max-width:767px){ .vst .pp-board-table{overflow-x:auto; -webkit-overflow-scrolling:touch;} .vst .pp-board-table table{min-width:600px; table-layout:fixed;} }

@media (max-width:767px){
  .vst.propicks-page .vst-head-right{margin-top:10px;}
  .vst .pp-nav{flex:1 1 100%; overflow-x:auto; scrollbar-width:none;}
  .vst .pp-nav::-webkit-scrollbar{display:none;}
  .vst .pp-nav a{flex:0 0 auto; padding:8px 10px;}
  .vst .pp-tools{flex-direction:column; align-items:stretch;}
  .vst .pp-tools .pp-group{overflow-x:auto;}
  .vst .pp-tools .vst-search{flex:1 1 auto;}
  .vst .pp-table thead{display:none;}
  .vst .pp-table tbody{display:block;}
  .vst .pp-table tbody tr.pp-row{display:grid; grid-template-columns:68px minmax(0,1fr); gap:0 8px; padding:8px 10px 8px 8px; border-bottom:6px solid #e4e6ea; align-items:start;}
  .vst .pp-table tbody tr.pp-row td{display:block; border:0; padding:0; background:transparent; text-align:left; box-shadow:none; white-space:normal; overflow:visible;}
  .vst .pp-table tr.is-win{box-shadow:inset 4px 0 0 var(--good);}
  .vst .pp-table tr.is-loss{box-shadow:inset 4px 0 0 var(--bad);}
  .vst .pp-table tr.is-push,.vst .pp-table tr.is-can{box-shadow:inset 4px 0 0 #999;}
  .vst .pp-table td.pp-side > *{width:68px; margin:0 0 5px;}
  .vst .pp-meta{flex-wrap:wrap; gap:4px 8px;}
  .vst .pp-meta .pp-who{white-space:normal;}
  .vst .pp-box{padding:5px 8px 6px;}
  .vst .pp-box .pp-when{white-space:normal;}
  .vst .pp-play{font-size:13px;}
  .vst .pp-table tbody tr.pp-mo{display:block;}
  .vst .pp-table tbody tr.pp-mo td{display:block; padding:6px 12px;}
  .vst .pp-table tbody tr[hidden]{display:none;}
}

/* ---- picks by game (propicks_games_blocks.php) ------------------------------
   the game header and the board cards share the team row: a fill behind the
   row for the share of side picks, logo, name, score when final, count */
.vst .pg-teams{display:flex; flex-direction:column; gap:4px;}
.vst .pg-trow{position:relative; display:grid; grid-template-columns:28px minmax(0,1fr) 44px 64px; align-items:center; gap:8px; padding:6px 10px; border:1px solid var(--line); border-radius:4px; background:#fff; overflow:hidden; font-size:13px; font-weight:800; color:#000;}
.vst .pg-trow .pg-fill{position:absolute; left:0; top:0; bottom:0; background:#eef2f7; z-index:0;}
.vst .pg-trow.lead .pg-fill{background:#e4f3d8;}
.vst .pg-trow > span{position:relative; z-index:1;}
.vst .pg-lg img,.vst .pg-logo{width:24px; height:24px; object-fit:contain; vertical-align:middle;}
.vst .pg-tn{white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.vst .pg-tn small{margin-left:6px; font-size:11px; font-weight:800; color:#444;}
.vst .pg-sc{text-align:right; font-size:15px; font-variant-numeric:tabular-nums;}
.vst .pg-tc{text-align:right; font-size:16px; line-height:1.05; font-variant-numeric:tabular-nums;}
.vst .pg-tc small{display:block; font-size:9px; font-weight:800; letter-spacing:.04em; color:#444; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.vst .pg-trow.lead .pg-tc{color:var(--green);}
.vst .pg-gtop{display:flex; align-items:center; gap:8px; margin-bottom:6px; font-size:10px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:#333;}
.vst .pg-gtop .pg-colh{margin-left:auto; color:#555;}
.vst .pg-tag{display:inline-block; padding:2px 7px; border-radius:3px; background:var(--green); color:#fff; font-size:8px; font-weight:800; letter-spacing:.08em; text-transform:uppercase;}
.vst .pg-crumb{color:var(--red); font-weight:800; text-transform:none; letter-spacing:0; font-size:12px;}
.vst .pg-crumb:hover{color:var(--black);}

/* the game page: the card (or a bare band), then the same tile strip the board uses */
.vst .pg-gstrip{margin:12px 18px 0; border:1px solid #cfd5de; border-radius:6px; overflow:hidden;}
.vst .pg-gstrip.has-card{margin-top:0; border-top:0; border-radius:0 0 6px 6px;}
.vst .pg-gstrip .pg-strip{border-top:0;}
.vst .pg-gstrip.has-card .pg-strip{border-top:2px solid var(--black);}
.vst .pg-strip .pg-back{align-self:center; height:48px; box-sizing:border-box; padding:0 12px; font-size:11px;}
.vst.propicks-page .vst-game{margin:12px 18px 0;}
.vst.propicks-page .vst-game + .pg-gstrip{margin:0 18px;}
.vst.propicks-page .vst-game .vst-btn.picks{display:none;}
/* market tile strips: inside the section, no page gutter; the result tile grows to its sentence */
.vst .pg-strip.market{padding:8px 0; border-top:0;}
.vst .pg-tile.wide{flex:1 1 auto; width:auto; max-width:360px; text-align:left; padding-left:12px;}
.vst .pg-tile.wide > b{font-size:12px; white-space:normal; line-height:1.2;}
/* result: the badge and the amount each in a fixed slot, so every row lines up */
.vst .pg-res-in{display:grid; grid-template-columns:56px 1fr; gap:6px; align-items:center; justify-content:end; width:100%;}
.vst .pg-res-in .res{display:block; width:56px; min-width:0; margin:0; font-size:9px; padding:5px 0;}
.vst .pg-table td.pg-res .pg-res-in small{display:block; margin:0; font-size:12px; font-weight:800; text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap;}
.vst .pg-table td.pg-res .pg-res-in small.score{color:#000; padding:5px 8px; border-radius:4px; background:#f1f1f1; border:1px solid #c4c4c4; text-align:center; font-size:11px; letter-spacing:.02em;}
.vst .pg-table td.pg-res .pg-res-in small.none{color:#bbb;}
.vst .pg-gmeta{display:flex; flex-wrap:wrap; gap:6px 18px; margin-top:8px; font-size:12px; font-weight:700; color:#222;}
.vst .pg-gmeta b{color:#000;}

/* a market: band, split bar, movement note, the table */
.vst .pg-split{margin:8px 0 4px;}
.vst .pg-bar{display:flex; height:26px; border-radius:4px; overflow:hidden; font-size:11px; font-weight:800; color:#fff;}
.vst .pg-bar > div{display:flex; align-items:center; gap:5px; padding:0 8px; white-space:nowrap; overflow:hidden; min-width:0;}
.vst .pg-bar > div:first-child{justify-content:flex-start;}
.vst .pg-bar > div:last-child{justify-content:flex-end;}
.vst .pg-bar .win{background:var(--good);}
.vst .pg-bar .lose{background:var(--bad);}
.vst .pg-bar .tie{background:#8a949f;}
.vst .pg-bar .u{background:var(--under);}
.vst .pg-bar .o{background:var(--over);}
.vst .pg-bar .empty{background:#d7d7d7; color:#333;}
.vst .pg-bar img{width:18px; height:18px; object-fit:contain; background:#fff; border-radius:50%; padding:1px;}
.vst .pg-bar-l{margin-top:3px; font-size:11px; font-weight:700; color:#222;}
.vst .pg-move{margin:6px 0 2px; padding:6px 10px; font-size:11px; font-weight:600; color:#222; background:var(--wash); border:1px solid var(--line); border-radius:4px;}
/* each market is its own card, so one ends before the next begins */
.vst .pg-market{margin:14px 18px 0; padding:0 0 2px; border:1px solid #cfd5de; border-radius:6px; background:#fff; overflow:hidden;}
.vst .pg-market .vst-band{border-radius:0;}
.vst .pg-market .pg-strip.market{padding:8px 10px;}
.vst .pg-market .pg-move{margin:0 10px 6px;}
.vst .pg-table{margin-top:0;}
.vst .pg-table table{min-width:0; width:100%; table-layout:fixed;}
.vst .pg-table th.c-ex{width:200px;}
.vst .pg-table th.c-res{width:164px;}
/* one line per expert: name, then show and date in the same line */
.vst .pg-table tbody td{white-space:nowrap; overflow:hidden; text-overflow:ellipsis; vertical-align:middle; padding:6px 10px; font-size:12px;}
.vst .pg-table td.l,.vst .pg-table thead tr.c th.l{position:static;}
.vst .pg-table tbody tr:nth-child(even) td{background:#fff;}
.vst .pg-table tr.pg-grp td{padding:4px 10px; font-size:10px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:#fff; background:#333; text-align:left;}
.vst .pg-table tr.pg-grp td img{width:18px; height:18px; vertical-align:middle; margin-right:6px; background:#fff; border-radius:50%;}
.vst .pg-table tr.pg-grp td small{margin-left:8px; font-size:9px; color:#ddd; letter-spacing:.04em; text-transform:none;}
.vst .pg-table tr.pg-grp td .sep{color:#888; margin:0 8px;}
.vst .pg-table tr.pg-grp.is-brand td{background:#1f2a3a;}
.vst .pg-grp-face{width:20px; height:20px; border-radius:50%; object-fit:cover; vertical-align:middle; margin-right:6px; background:#fff; border:1px solid #fff;}
.vst .pg-table td.pg-side .pg-ptext{font-size:12px;}
.vst .pg-table td.pg-ex a{font-weight:800; color:var(--red);}
.vst .pg-table td.pg-ex a:hover{color:var(--black);}
/* the show and date on top in small type, the expert under it */
.vst .pg-table td.pg-ex{line-height:1.25; padding-top:5px; padding-bottom:5px;}
.vst .pg-table td.pg-ex .pg-show{display:block; font-size:10px; font-weight:700; color:#333; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.vst .pg-table td.pg-ex .pg-who{display:block; margin-top:1px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.vst .pg-table td.pg-ex a{font-size:13px;}
.vst .pg-table td.pg-side{white-space:normal; line-height:1.3;}
.vst .pg-table td.pg-side{font-weight:800; font-size:13px; color:#000; padding:5px 10px 5px 12px;}
/* the pick cell: text on the left, chips pinned right */
.vst .pg-sidewrap{display:flex; align-items:center; gap:10px; padding:6px 10px; border-radius:4px; background:#f1f1f1; border:1px solid #c4c4c4;}
.vst .pg-sidetext{flex:1 1 auto; min-width:0; display:block;}
.vst .pg-chips{flex:0 0 auto; display:inline-flex; align-items:center; gap:5px;}
.vst .pg-chips .pp-bookchip{margin:0;}
/* the brand line above a system pick: headshot in a thin frame, the name, the edge */
.vst .pp-brand{display:inline-flex; align-items:center; gap:6px; margin-bottom:3px; font-size:10px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:#000;}
.vst .pp-brand img{width:22px; height:22px; border-radius:50%; object-fit:cover; display:block; background:#fff; border:1px solid #bbb;}
.vst .pp-brand i{font-style:normal;}
.vst .pp-brand .pp-edge{margin-left:2px; text-transform:none; letter-spacing:.04em;}
.vst .pg-sidetext .pp-brand{display:flex;}
.vst .pg-pickline{display:block;}
.vst .pg-edgeline{display:block; margin-top:3px;}
.vst .pp-brandline{margin-top:3px;}
.vst .pp-edge{display:inline-block; padding:2px 6px; border-radius:3px; background:#edf8e3; border:1px solid #b9dba0; color:var(--green); font-size:9px; font-weight:800; letter-spacing:.04em; white-space:nowrap;}
.vst .pp-meta .pg-chips{flex:0 0 auto;}
.vst .pg-table td.pg-side img{width:20px; height:20px; vertical-align:middle; margin-right:6px;}
.vst .pg-table tr.side-a td:first-child,.vst .pg-table tr.side-b td:first-child{box-shadow:inset 4px 0 0 #8a949f;}
.vst .pg-table tr.side-p td:first-child{box-shadow:inset 4px 0 0 #999;}
.vst .pg-line{margin-left:4px; color:#222;}
.vst .pg-ptext{font-weight:800;}
.vst .pg-table .pp-bookchip{margin-left:8px; vertical-align:1px;}
.vst .pg-vs{display:inline-block; margin-left:8px; padding:1px 6px; border-radius:3px; font-size:9px; font-weight:800; letter-spacing:.04em; vertical-align:1px;}
.vst .pg-vs.good{color:var(--green); background:#edf8e3; border:1px solid #b9dba0;}
.vst .pg-vs.bad{color:var(--bad); background:#fdeeec; border:1px solid #f1b8b2;}
.vst .pg-table td.pg-res .res{display:block; min-width:0; font-size:9px; padding:4px 2px;}
.vst .pg-rep{display:inline-block; margin-left:6px; padding:1px 6px; border-radius:3px; background:#e9ecef; border:1px solid #cfd5de; color:#222; font-size:9px; font-weight:800; letter-spacing:.04em; vertical-align:middle; cursor:help;}
.vst .pg-foot{margin:12px 18px 0; padding:8px 12px; font-size:11px; font-weight:600; color:#333; border:1px solid var(--line); border-radius:6px; background:var(--wash);}

/* the board: period rail, sort tabs, the card grid */
.vst .pg-tools{border-top:0; margin-top:0; padding-top:10px; gap:10px 14px;}
.vst .pg-tools .pg-periods{padding:0; min-height:0; flex:1 1 auto;}
.vst .pg-tools .pg-periods a small{margin-left:5px; padding:0 5px; border-radius:8px; background:#e9ecef; color:#222; font-size:9px; font-weight:800;}
.vst .pg-tools .pg-periods a.on small{background:rgba(255,255,255,.25); color:#fff;}
.vst .pg-sort{background:#fff; border-color:#ccc;}
.vst .pg-sort a{padding:6px 12px; color:#555;}
.vst .pg-sort a:hover{color:#000;}
.vst .pg-sort a.on{background:#000; color:#fff;}
.vst .pg-tools .vst-count{color:#222;}
/* the board is the games page: one game card after another, the picks strip under each */
.vst .pg-board{display:flex; flex-direction:column; gap:14px; padding:12px 18px 0;}
.vst .pg-entry{border:1px solid #cfd5de; border-radius:6px; background:#fff; overflow:hidden;}
.vst .pg-entry .vst-game{margin:0;}
.vst .pg-entry .vst-game .vst-band{border-radius:0;}
.vst .pg-entry .vst-game table{min-width:760px;}
.vst .pg-strip{display:flex; align-items:stretch; gap:6px; padding:8px 10px; border-top:2px solid var(--black); background:#fff;}
/* each tile has one width on every game, sized to what it holds; all 48 tall */
.vst .pg-tile{display:flex; flex-direction:column; justify-content:center; flex:0 0 136px; width:136px; height:48px; box-sizing:border-box; min-width:0; padding:4px 8px; border:1px solid #d5d5d5; border-radius:5px; background:#f4f4f4; text-align:center; line-height:1.1;}
.vst .pg-tile small{display:block; font-size:8px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:#444; margin-bottom:3px;}
.vst .pg-tile > b{display:block; font-size:15px; font-weight:800; color:#000; font-variant-numeric:tabular-nums; white-space:nowrap;}
.vst .pg-tile > b span{display:inline-block; margin-left:6px; font-size:10px; font-weight:700; color:#444;}
.vst .pg-tile > b span.pos{color:var(--green);}
.vst .pg-tile > b span.neg{color:var(--bad);}
.vst .pg-tile.empty{background:#fafafa; border-style:dashed; color:#999;}
.vst .pg-tile.empty > b{color:#999;}
.vst .pg-tile.hot{background:#edf8e3; border-color:#b9dba0;}
.vst .pg-tile.hot > b{color:var(--green); font-size:13px;}
.vst .pg-tile.split{padding:4px 8px 5px;}
.vst .pg-tile.locked{flex-basis:278px; width:278px; background:#2b2f36; border-color:#2b2f36; color:#fff;}
.vst .pg-tile.locked small{color:#ddd;}
.vst .pg-tile.locked b{color:#fff; font-size:12px;}
.vst .pg-tile.locked:hover{background:var(--red); border-color:var(--red);}
.vst .pg-tile.t-props{flex-basis:84px; width:84px;}
.vst .pg-tile.t-picks{flex-basis:128px; width:128px;}
.vst .pg-tile.t-record{flex-basis:164px; width:164px;}
.vst .pg-tile-head{display:flex; align-items:center; justify-content:space-between; gap:6px; margin-bottom:3px;}
.vst .pg-tile-head small{margin:0; flex:1 1 auto; text-align:center;}
.vst .pg-tile-head .pg-end{flex:0 0 auto; font-size:8px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:#333; line-height:1;}
.vst .pg-tile-head .pg-end .pg-logo{width:18px; height:18px; display:block;}
.vst .pg-tile-row{display:flex; align-items:center; gap:6px;}
.vst .pg-tile-row b{flex:0 0 18px; font-size:14px; font-weight:800; color:#333; text-align:center; font-variant-numeric:tabular-nums;}
.vst .pg-tile-row b.lead{color:#000;}
.vst .pg-mini{flex:1 1 auto; display:flex; height:8px; border-radius:4px; overflow:hidden; background:#ddd;}
.vst .pg-mini span{display:block; height:100%;}
/* the side with more experts is green, the other red, a tie grey */
.vst .pg-mini .win{background:var(--good);} .vst .pg-mini .lose{background:var(--bad);} .vst .pg-mini .tie{background:#9aa3ad;}
.vst .pg-mini .u{background:var(--under);} .vst .pg-mini .o{background:var(--over);}
.vst .pg-tile.empty .pg-mini span{background:#ddd;}
.vst .pg-strip .pg-go{margin-left:auto; align-self:center; flex:0 0 auto; height:48px; box-sizing:border-box; padding:0 14px; font-size:11px;}
@media (max-width:1399px){ .vst .pg-strip .pg-go{padding:0 10px; font-size:10px;} .vst .pg-tile > b{font-size:14px;} }
.vst .pg-bare-head{display:flex; align-items:center; gap:8px; padding:8px 12px; background:var(--black); color:#fff; font-size:13px; font-weight:800; text-transform:uppercase; letter-spacing:.04em;}
.vst .pg-bare-head img{width:22px; height:22px; object-fit:contain; background:#fff; border-radius:50%; padding:1px;}
.vst .pg-bare-head .sep{color:#888; font-weight:700; text-transform:none;}
.vst .pg-bare-head .n{margin-left:auto; font-size:11px; font-weight:700; color:#ddd; text-transform:none; letter-spacing:0;}
.vst .pg-stats{padding-top:12px; grid-template-columns:repeat(3, minmax(0,1fr));}
.vst .pg-stats .vst-stat{text-align:left; display:flex; align-items:baseline; gap:10px; padding:10px 14px;}
.vst .pg-stats .vst-stat b{font-size:22px; margin:0;}
.vst .pg-stats .vst-stat small{margin:0; font-size:10px; letter-spacing:.06em;}
.vst .pg-stats .vst-stat.hot{background:#edf8e3; border-color:#b9dba0;}
.vst .pg-tools .pg-periods .vst-select{margin-left:4px; padding:5px 8px; font-size:11px;}
.vst .vst-band .pg-tag{margin-right:6px; vertical-align:1px;}
/* the day heading on the board: a band, like every section heading */
.vst .pg-board h2.pg-day{margin:4px 0 -4px; padding:6px 12px; background:var(--black); color:#fff; border-radius:6px; font-size:11px; font-weight:800; letter-spacing:.1em; text-transform:uppercase;}
.vst .pg-card{display:flex; flex-direction:column; gap:6px; padding:10px 12px 10px; border:1px solid #cfd5de; border-radius:6px; background:#fff; color:#000; min-width:0;}
.vst .pg-card:hover{border-color:var(--red);}
.vst .pg-card .pg-gtop{margin-bottom:0;}
.vst .pg-when{color:#000;}
.vst .pg-gmid{display:flex; align-items:center; gap:8px;}
.vst .pg-lbl{font-size:9px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:#444; flex:0 0 auto;}
.vst .pg-tbar{position:relative; flex:1 1 auto; display:flex; height:20px; border-radius:3px; overflow:hidden; background:#e6e6e6; font-size:10px; font-weight:800; color:#000;}
.vst .pg-tbar .seg{height:100%;}
.vst .pg-tbar .seg.u{background:#cfe0f2;}
.vst .pg-tbar .seg.o{background:#f6d6c3;}
.vst .pg-tbar.lead-u .seg.u{background:var(--under);}
.vst .pg-tbar.lead-o .seg.o{background:var(--over);}
.vst .pg-tbar .tl,.vst .pg-tbar .tr{position:absolute; top:0; line-height:20px; padding:0 8px;}
.vst .pg-tbar .tl{left:0;} .vst .pg-tbar .tr{right:0;}
.vst .pg-tbar.lead-u .tl,.vst .pg-tbar.lead-o .tr{color:#fff;}
.vst .pg-tbar.none{background:#f1f1f1; color:#555;}
.vst .pg-props{flex:0 0 auto; padding:2px 7px; border-radius:3px; background:#e4ecf7; border:1px solid #b9cbe6; color:var(--blue); font-size:9px; font-weight:800; letter-spacing:.05em; text-transform:uppercase;}
.vst .pg-gfoot{display:flex; justify-content:space-between; align-items:center; gap:8px; font-size:11px; font-weight:700; color:#222; margin-top:auto;}
.vst .pg-gfoot b{color:#000;}
/* record and profit, wherever a game view shows them */
.vst .pg-rec b{color:#000; font-weight:800;}
.vst .pg-rec i{font-style:normal; font-weight:800; color:#333;}
.vst .pg-rec i.pos{color:var(--green);}
.vst .pg-rec i.neg{color:var(--bad);}
.vst .pg-rec.band b{color:#fff;}
.vst .pg-rec.band i{color:#ddd;}
.vst .pg-rec.band i.pos{color:#8fd14f;}
.vst .pg-rec.band i.neg{color:#ff6b6b;}
.vst .pg-table td.pg-res small{display:block; margin-top:3px; font-size:10px; font-weight:800; color:#333;}
.vst .pg-table td.pg-res small.pos{color:var(--green);}
.vst .pg-table td.pg-res small.neg{color:var(--bad);}
.vst .pg-gmeta small{font-weight:600; color:#444;}

/* the hub */
.vst .pg-hub{padding-top:12px;}
.vst .pg-stiles{display:grid; grid-template-columns:repeat(auto-fill, minmax(220px, 1fr)); gap:12px;}
.vst .pg-stile{display:flex; flex-direction:column; gap:8px; padding:12px; border:1px solid #cfd5de; border-radius:6px; background:#fff; color:#000;}
.vst .pg-stile:hover{border-color:var(--red);}
.vst .pg-stop{display:flex; align-items:center; gap:8px; min-width:0;}
.vst .pg-sicon{width:26px; height:26px; object-fit:contain; flex:0 0 auto;}
.vst .pg-stop b{font-size:18px; font-weight:800; flex:0 0 auto;}
.vst .pg-stop span{font-size:11px; font-weight:700; color:#333; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
/* the three figures as boxes, the stat-tile look */
.vst .pg-snums{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:6px;}
.vst .pg-snums > div{padding:6px 4px; text-align:center; background:#f4f4f4; border:1px solid #ddd; border-radius:5px;}
.vst .pg-snums b{display:block; font-size:17px; font-weight:800; color:#000; line-height:1.1; font-variant-numeric:tabular-nums;}
.vst .pg-snums small{display:block; margin-top:2px; font-size:8px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:#444;}
.vst .pg-snums .hot{background:#edf8e3; border-color:#b9dba0;}
.vst .pg-snums .hot b{color:var(--green);}
.vst .pg-sfirst{font-size:11px; font-weight:700; color:#222;}
.vst .pg-toplist{display:flex; flex-direction:column; border:1px solid var(--line); border-top:0; border-radius:0 0 6px 6px;}
.vst .pg-trow2{display:grid; grid-template-columns:64px minmax(0,1fr) 150px 120px; align-items:center; gap:10px; padding:8px 12px; border-bottom:1px solid var(--line); color:#000; font-size:12px; font-weight:700;}
.vst .pg-trow2:last-child{border-bottom:0;}
.vst .pg-trow2:hover{background:#fff6e0;}
.vst .pg-tsport{display:flex; align-items:center; gap:5px; font-size:10px; font-weight:800; letter-spacing:.06em;}
.vst .pg-tsport .pg-sicon{width:18px; height:18px;}
.vst .pg-tm{font-weight:800; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.vst .pg-tm em{font-style:normal; color:#666; font-weight:700; margin:0 2px;}
.vst .pg-tm img{width:18px; height:18px; vertical-align:middle; margin-right:4px;}
.vst .pg-twhen{color:#222;}
.vst .pg-tlean{text-align:right; color:var(--green); font-weight:800;}

@media (max-width:767px){
  .vst .pg-board{padding:10px 12px 0;}
  .vst .pg-strip{flex-wrap:wrap;}
  .vst .pg-tile,.vst .pg-tile.split{flex:1 1 30%; width:auto;}
  .vst .pg-strip .pg-go{flex:1 1 100%; justify-content:center;}
  .vst .pg-trow{grid-template-columns:24px minmax(0,1fr) 36px 56px; padding:5px 8px; font-size:12px;}
  .vst .pg-tools{flex-direction:column; align-items:stretch;}
  .vst .pg-tools .pg-periods{overflow-x:auto;}
  .vst .pg-trow2{grid-template-columns:44px minmax(0,1fr) 90px; gap:6px;}
  .vst .pg-twhen{display:none;}
  .vst .pg-foot{margin:12px 12px 0;}
  /* the market table stacks: expert and result on the first line, the pick box full width under them */
  .vst .pg-table table,.vst .pg-table tbody{display:block; width:100%;}
  .vst .pg-table thead{display:none;}
  .vst .pg-table tbody tr{display:grid; grid-template-columns:minmax(0,1fr) auto; gap:4px 8px; padding:6px 8px; border-bottom:1px solid #e4e6ea;}
  .vst .pg-table tbody tr.pg-grp{display:block; padding:0;}
  .vst .pg-table tbody tr.pg-grp td{display:block;}
  .vst .pg-table tbody td{display:block; padding:0; overflow:visible; white-space:normal;}
  .vst .pg-table td.pg-ex{grid-column:1; grid-row:1; min-width:0;}
  .vst .pg-table td.pg-res{grid-column:2; grid-row:1;}
  .vst .pg-table td.pg-side{grid-column:1 / -1; grid-row:2; padding:0;}
  .vst .pg-table tr.side-a td:first-child,.vst .pg-table tr.side-b td:first-child,.vst .pg-table tr.side-p td:first-child{box-shadow:none;}
  .vst .pg-table tr.side-a,.vst .pg-table tr.side-b{box-shadow:inset 4px 0 0 #8a949f;}
  .vst .pg-table tr.side-p{box-shadow:inset 4px 0 0 #999;}
  .vst .pg-res-in{grid-template-columns:52px auto; gap:4px; width:auto;}
  .vst .pg-table td.pg-res .pg-res-in small.score{padding:4px 6px; font-size:10px;}
  .vst .pg-sidewrap{padding:5px 8px;}
  .vst .pg-market{margin:10px 8px 0;}
}

/* the jump page */
.vst .pp-homestrip{margin-top:14px; padding:0 18px 0 0; grid-template-columns:repeat(5, minmax(0,1fr));}
.vst .pp-homestrip .vst-stat.soon{border-color:var(--red);}
.vst .pp-homestrip .vst-stat.soon b{color:var(--red);}
.vst .pp-homestrip .vst-stat{color:#000;}
.vst .pp-homestrip a.vst-stat:hover{border-color:var(--red);}
.vst .pp-homestrip .vst-stat.hot b{color:var(--green);}
@media (max-width:991px){ .vst .pp-homestrip{grid-template-columns:repeat(3, minmax(0,1fr));} }
@media (max-width:600px){ .vst .pp-homestrip{grid-template-columns:repeat(2, minmax(0,1fr));} }
.vst .pp-htiles{display:grid; grid-template-columns:repeat(auto-fill, minmax(236px, 1fr)); gap:12px; padding:12px 0 0;}
.vst .pp-htile{display:flex; flex-direction:column; gap:8px; padding:12px; border:1px solid #cfd5de; border-radius:6px; background:#fff; color:#000;}
.vst .pp-htop{display:flex; align-items:center; gap:8px; min-width:0; color:#000;}
.vst .pp-htop .pg-sicon{width:26px; height:26px; object-fit:contain; flex:0 0 auto;}
.vst .pp-htop b{font-size:18px; font-weight:800; flex:0 0 auto;}
.vst .pp-htop span{font-size:11px; font-weight:700; color:#333; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.vst .pp-htop:hover b{color:var(--red);}
.vst .pp-hnums{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:6px;}
.vst .pp-hnums > div,.vst .pp-hnums > a{padding:6px 4px; text-align:center; background:#f4f4f4; border:1px solid #ddd; border-radius:5px; color:#000;}
.vst .pp-hnums > a:hover{border-color:var(--red);}
.vst .pp-hnums.picks > a{background:#fff; border-color:#c4c4c4;}
.vst .pp-hnums b{display:block; font-size:17px; font-weight:800; color:#000; line-height:1.1; font-variant-numeric:tabular-nums;}
.vst .pp-hnums small{display:block; margin-top:2px; font-size:8px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:#444;}
.vst .pp-hnums .hot{background:#edf8e3; border-color:#b9dba0;}
.vst .pp-hnums .hot b{color:var(--green);}
.vst .pp-hfirst{font-size:11px; font-weight:700; color:#222;}
.vst .pp-home-cols{display:grid; grid-template-columns:minmax(0,3fr) minmax(300px,2fr); gap:0 18px; align-items:start;}
.vst .pp-home-cols > div{min-width:0;}
.vst .pp-home-cols .c-hot{grid-column:1;}
.vst .pp-home-cols .c-agree,.vst .pp-home-cols .c-added{grid-column:2;}
/* wide desks: three columns on the home page, a wider rail on the list pages */
@media (min-width:1400px){
  .vst .pp-home-cols{grid-template-columns:minmax(0,5fr) minmax(0,4fr) minmax(0,3fr);}
  .vst .pp-home-cols .c-added{grid-column:2;}
  .vst .pp-home-cols .c-agree{grid-column:3;}
  .vst .pp-cols{grid-template-columns:minmax(0,5fr) minmax(360px,2fr);}
  .vst .pp-htiles{grid-template-columns:repeat(auto-fill, minmax(260px, 1fr));}
}
@media (min-width:1700px){
  .vst .pp-cols{grid-template-columns:minmax(0,3fr) minmax(400px,1fr);}
  .vst .pp-boards{gap:0 28px;}
}
.vst .pp-home-cols .vst-section{margin-top:14px;}
.vst .pp-home-cols .pg-hubtop{margin-top:14px;}
.vst .pp-home-cols .pp-rsec{margin-top:14px;}
.vst .pp-board .vst-band .n a{color:#fff; text-decoration:underline;}
.vst .pp-board-table a.bx{display:block;}
.vst .pp-board-table a.bx:hover{border-color:var(--red); color:var(--red);}
.vst .pp-others{display:grid; grid-template-columns:repeat(auto-fill, minmax(230px, 1fr)); gap:6px 12px; padding:10px 12px 12px; background:#fff;}
.vst .pp-other{display:flex; align-items:center; justify-content:space-between; gap:8px; padding:4px 0; border-bottom:1px solid #e4e6ea; min-width:0;}
.vst .pp-other .nm{flex:1 1 auto; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--red); font-weight:800; font-size:12px;}
.vst .pp-other .nm:hover{color:var(--black);}
.vst .pp-other .ct{flex:0 0 auto; display:inline-flex; gap:4px;}
.vst .pp-other .ct .bx{display:inline-block; width:34px; min-width:0; padding:2px 0; font-size:11px; text-align:center;}
.vst .pp-other .ct .bx.pre{visibility:hidden;}
@media (max-width:991px){ .vst .pp-home-cols{grid-template-columns:1fr;} .vst .pp-home-cols .c-hot,.vst .pp-home-cols .c-added,.vst .pp-home-cols .c-agree{grid-column:auto;} .vst .pp-home-cols > div + div .vst-section:first-child{margin-top:14px;} }

/* the date rail: a week of chips, arrows to the rest */
.vst .pp-dates a.pp-arrow{min-width:34px; justify-content:center; font-size:18px; line-height:1; font-weight:800;}

/* the right rail */
.vst .pp-rail .pp-rsec{margin-top:0;}
.vst .pp-rail .pp-rsec + .pp-rsec{margin-top:14px;}
.vst .pp-rsec .vst-band .n a{color:#fff; text-decoration:underline;}
.vst .pp-rlist{display:flex; flex-direction:column; border:1px solid #c4c4c4; border-top:0; background:#fff;}
.vst .pp-rrow,.vst .pp-rgame,.vst .pp-rpick{display:flex; align-items:center; gap:8px; padding:6px 10px; border-bottom:1px solid #e4e6ea; color:#000; min-width:0;}
.vst .pp-rrow:last-child,.vst .pp-rgame:last-child,.vst .pp-rpick:last-child{border-bottom:0;}
.vst .pp-rrow:hover,.vst .pp-rgame:hover,.vst .pp-rpick:hover{background:#f6f6f6;}
.vst .pp-rrow .pp-brk{width:30px; margin:0; flex:0 0 auto; font-size:11px; padding:2px 0;}
.vst .pp-rrow .nm{flex:1 1 auto; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--red); font-weight:800; font-size:12px;}
.vst .pp-rrow:hover .nm{color:var(--black);}
.vst .pp-rrow .rec{flex:0 0 auto; font-size:11px; font-weight:800; font-variant-numeric:tabular-nums;}
.vst .pp-rrow .bx{flex:0 0 72px; min-width:0; padding:2px 4px; font-size:11px; text-align:center; display:block;}
.vst .pp-rrow .bx.pos{background:var(--green); border-color:var(--green); color:#fff;}
.vst .pp-rgame,.vst .pp-rpick{flex-direction:column; align-items:stretch; gap:3px;}
.vst .pp-rgame .tm{display:flex; align-items:center; gap:4px; min-width:0; font-size:12px; font-weight:800; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.vst .pp-rgame .tm img{width:18px; height:18px;}
.vst .pp-rgame .tm em{font-style:normal; color:#555; font-weight:700; margin:0 2px;}
.vst .pp-rgame .ln{display:flex; align-items:center; gap:8px; font-size:11px; font-weight:700; color:#222; min-width:0;}
.vst .pp-rgame .ln .when{white-space:nowrap;}
.vst .pp-rgame .sp,.vst .pp-rpick .sp{display:inline-block; padding:1px 5px; border-radius:3px; background:#e9ecef; color:#222; font-size:9px; font-weight:800; letter-spacing:.06em;}
.vst .pp-rgame .lean{margin-left:auto; color:var(--green); font-weight:800; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; min-width:0;}
.vst .pp-rpick .who{display:flex; align-items:center; gap:6px; font-size:11px; min-width:0;}
.vst .pp-rpick .who b{color:var(--red); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.vst .pp-rpick:hover .who b{color:var(--black);}
.vst .pp-rpick .day{color:#000; font-weight:800; white-space:nowrap;}
.vst .pp-rpick .ago{margin-left:auto; color:#333; font-weight:700; white-space:nowrap;}
.vst .pp-rpick .pk{font-size:12px; font-weight:800; color:#000; line-height:1.3;}

/* the lock panel that stands in for a pick block for non-Pro */
.vst .pp-lockpanel{display:flex; flex-direction:column; align-items:center; gap:10px; padding:22px 14px; border:1px solid #c4c4c4; border-top:0; background:#f1f1f1; text-align:center;}
.vst .pp-lockpanel i{font-size:22px; color:#333;}
.vst .pp-lockpanel span{font-size:12px; font-weight:800; color:#000;}
.vst .pp-lockbtn{display:inline-flex; align-items:center; gap:8px; padding:9px 16px; border-radius:4px; background:var(--red); color:#fff; font-size:12px; font-weight:800; letter-spacing:.04em; text-transform:uppercase; white-space:nowrap;}
.vst .pp-lockbtn:hover{background:#000; color:#fff;}

/* the picks modal on the stats pages: the game view's markets inside the modal body */
.vst.pp-modal .vst-band{margin-top:0;}
.vst.pp-modal .vst-band .n a{color:#fff; text-decoration:underline;}
.vst.pp-modal .pg-gstrip{margin:10px 0 0;}
.vst.pp-modal .pg-market{margin:10px 0 0;}
.vst.pp-modal .pg-foot{margin:10px 0 0;}

/* the 7 / 30 day tabs in a board's band */
.vst .pp-ftabs{display:inline-flex; border:1px solid rgba(255,255,255,.45); border-radius:3px; overflow:hidden; margin-right:8px; vertical-align:middle;}
.vst .pp-ftabs a{padding:2px 8px; font-size:10px; font-weight:800; letter-spacing:.04em; text-transform:uppercase; color:#fff; background:transparent; text-decoration:none;}
.vst .pp-ftabs a + a{border-left:1px solid rgba(255,255,255,.45);}
.vst .pp-ftabs a.on{background:var(--red); color:#fff;}
.vst .pp-ftabs a:hover{background:rgba(255,255,255,.18); color:#fff;}
.vst .pp-ftabs a.on:hover{background:var(--red);}
.vst .pp-framed-board [data-frame][hidden]{display:none;}

/* the dashboard home */
.vst .pp-dash{padding:12px 0 0;}
.vst .pp-dash-row.sports{position:relative; margin-bottom:12px;}
.vst .pp-dsports{position:relative; display:flex; gap:10px; overflow-x:auto; scroll-behavior:smooth; scroll-snap-type:x mandatory; scroll-padding-left:0; scrollbar-width:none; -ms-overflow-style:none; -webkit-overflow-scrolling:touch;}
.vst .pp-dsport{scroll-snap-align:start;}
.vst .pp-dsend{flex:0 0 0px;}
.vst .pp-dsports::-webkit-scrollbar{display:none;}
/* the slide controls sit under the strip, right-aligned, so they never cover a card */
.vst .pp-dsbar{display:none; align-items:center; justify-content:flex-end; gap:4px; margin-top:4px;}
.vst .pp-dash-row.sports.can-slide .pp-dsbar{display:flex;}
.vst .pp-dscount{margin-right:6px; font-size:10px; font-weight:700; color:#333;}
.vst .pp-dsnav{width:34px; height:24px; border:1px solid #c4c4c4; border-radius:4px; background:#fff; color:#000; font-size:18px; line-height:1; font-weight:800; cursor:pointer; padding:0;}
.vst .pp-dsnav:hover{border-color:var(--red); color:var(--red);}
.vst .pp-dsnav:disabled{color:#bbb; border-color:#ddd; cursor:default;}
@media (max-width:767px){ .vst .pp-dsbar{display:none !important;} }
.vst .pp-dsport{flex:0 0 212px; display:flex; flex-direction:column; gap:6px; padding:10px; border:1px solid #cfd5de; border-radius:6px; background:#fff;}
.vst .pp-dsport.has-cons{border-color:#b9dba0;}
.vst .pp-dsport .top{display:flex; align-items:center; gap:6px; min-width:0; color:#000;}
.vst .pp-dsport .top .pg-sicon{width:22px; height:22px; object-fit:contain;}
.vst .pp-dsport .top b{font-size:15px; font-weight:800;}
.vst .pp-dsport .top span{font-size:10px; font-weight:700; color:#333; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.vst .pp-dsport .top:hover b{color:var(--red);}
.vst .pp-dsport .nums{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:4px; color:#000;}
.vst .pp-dsport .nums > span,.vst .pp-dsport .nums > a{display:block; padding:4px 2px; text-align:center; background:#f4f4f4; border:1px solid #ddd; border-radius:4px; color:#000;}
.vst .pp-dsport .nums.picks > a{background:#fff; border-color:#c4c4c4;}
.vst .pp-dsport .nums > a:hover{border-color:var(--red);}
.vst .pp-dsport .nums b{display:block; font-size:15px; font-weight:800; line-height:1.1; font-variant-numeric:tabular-nums;}
.vst .pp-dsport .nums small{display:block; margin-top:1px; font-size:7px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:#444;}
.vst .pp-dsport .nums .hot{background:#edf8e3; border-color:#b9dba0;}
.vst .pp-dsport .nums .hot b{color:var(--green);}
.vst .pp-dsport .first{font-size:10px; font-weight:700; color:#222;}
.vst .pp-dash-grid{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:14px; align-items:start;}
.vst .pp-dash-col{display:flex; flex-direction:column; gap:14px; min-width:0;}
.vst .pp-panel{display:flex; flex-direction:column; border:1px solid #c4c4c4; border-radius:6px; background:#fff; overflow:hidden; max-height:520px;}
.vst .pp-panel .vst-band{margin:0; border-radius:0; flex:0 0 auto;}
.vst .pp-panel .vst-band .n a{color:#fff; text-decoration:underline;}
.vst .pp-panel-body{overflow-y:auto; min-height:0; flex:1 1 auto;}
.vst .pp-panel-body .pp-rlist{border:0;}
.vst .pp-panel.pp-panel-games{max-height:640px;}
.vst .pp-dash-col .pp-rsec{margin-top:0;}
.vst .pp-dash-col .pp-rsec .pp-lockpanel{border-radius:0 0 6px 6px;}
/* the game feed rows */
.vst .pp-dg-head{display:flex; align-items:center; gap:8px; padding:5px 10px; background:#2b2f36; color:#fff; font-size:10px; font-weight:800; letter-spacing:.08em; text-transform:uppercase;}
.vst .pp-dg-head small{font-size:10px; color:#ddd;}
.vst .pp-dg-head.live{background:#1f2a3a;}
.vst .pp-dg{display:grid; grid-template-columns:22px minmax(0,1fr) auto; grid-template-rows:auto auto; gap:2px 8px; align-items:center; padding:6px 10px; border-bottom:1px solid #e4e6ea; color:#000;}
.vst .pp-dg:hover{background:#f6f6f6;}
.vst .pp-dg .sp{grid-row:1 / span 2;}
.vst .pp-dg .sp .pg-sicon{width:20px; height:20px;}
.vst .pp-dg .tm{display:flex; align-items:center; gap:4px; min-width:0; font-size:12px; font-weight:800; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.vst .pp-dg .tm img{width:18px; height:18px;}
.vst .pp-dg .tm em{font-style:normal; color:#555; font-weight:700; margin:0 2px;}
.vst .pp-dg .wh{grid-column:2; font-size:11px; font-weight:700; color:#222;}
.vst .pp-dg .pk{grid-column:3; grid-row:1; font-size:11px; font-weight:700; color:#222; white-space:nowrap; text-align:right;}
.vst .pp-dg .rt{grid-column:3; grid-row:2; text-align:right; white-space:nowrap;}
.vst .pp-dg-lean{display:inline-block; padding:1px 6px; border-radius:3px; background:#edf8e3; border:1px solid #b9dba0; color:var(--green); font-size:10px; font-weight:800;}
.vst .pp-dg-lean.soft{background:#f4f4f4; border-color:#ddd; color:#222;}
.vst .pp-dg-rec{font-size:11px; font-weight:800;}
.vst .pp-dg-rec i{font-style:normal; margin-left:4px;}
.vst .pp-dg-rec i.pos{color:var(--green);} .vst .pp-dg-rec i.neg{color:var(--bad);}
.vst .pp-dg-pend{font-size:10px; font-weight:700; color:#555;}
.vst .pp-panel .pp-rrow .bx.neg{background:var(--bad); border-color:var(--bad); color:#fff;}
@media (max-width:1199px){ .vst .pp-dash-grid{grid-template-columns:repeat(2, minmax(0,1fr));} }
@media (max-width:767px){ .vst .pp-dash-grid{grid-template-columns:1fr;} .vst .pp-panel{max-height:none;} .vst .pp-panel-body{overflow:visible;} .vst .pp-dsport{flex-basis:188px;} }

/* dashboard widgets */
.vst .pp-wgrid{display:grid; grid-template-columns:repeat(5, minmax(0,1fr)); gap:14px; margin-bottom:14px; align-items:stretch;}
.vst .pp-w{display:flex; flex-direction:column; min-width:0; border:1px solid #c4c4c4; border-radius:6px; background:#fff; overflow:hidden;}
.vst .pp-w-head{display:flex; align-items:center; justify-content:space-between; gap:8px; padding:8px 12px; border-bottom:1px solid #e4e6ea; background:#f7f7f7;}
.vst .pp-w-head b{font-size:12px; font-weight:800; letter-spacing:.02em; color:#000; white-space:nowrap;}
.vst .pp-w-head span{font-size:10px; font-weight:700; color:#333; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; display:inline-flex; align-items:center; gap:4px;}
.vst .pp-w-head span a{color:var(--red); text-decoration:underline;}
.vst .pp-w-head .pp-ftabs{border-color:#c4c4c4; margin-right:6px;}
.vst .pp-w-head .pp-ftabs a{color:#000;}
.vst .pp-w-head .pp-ftabs a + a{border-left-color:#c4c4c4;}
.vst .pp-w-head .pp-ftabs a.on{color:#fff;}
.vst .pp-w-head .pp-ftabs a:hover{background:#e9ecef; color:#000;}
.vst .pp-w-body{flex:1 1 auto; padding:10px 12px 12px; min-width:0;}
.vst .pp-w-row{display:flex; align-items:center; gap:14px;}
.vst .sw{display:inline-block; width:9px; height:9px; border-radius:2px; vertical-align:middle;}
.vst .sw.dark{background:#2b2f36;} .vst .sw.light{background:#c9ced6;}
/* the big number with its caption and delta */
.vst .pp-big{display:flex; flex-direction:column; gap:2px; min-width:0;}
.vst .pp-big > b{font-size:30px; font-weight:800; line-height:1; color:#000; font-variant-numeric:tabular-nums;}
.vst .pp-big > b.pos{color:var(--green);} .vst .pp-big > b.neg{color:var(--bad);}
.vst .pp-big > small{font-size:10px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:#444;}
.vst .pp-big small.pend{text-transform:none; letter-spacing:0; font-weight:700; color:#333; margin-top:2px;}
.vst .pp-delta{font-size:10px; font-weight:800; margin-top:3px;}
.vst .pp-delta.up{color:var(--green);} .vst .pp-delta.down{color:var(--bad);} .vst .pp-delta.flat{color:#555;}
.vst .pp-rec{display:inline-flex; gap:4px; margin-top:6px;}
.vst .pp-rec i{font-style:normal; padding:2px 6px; border-radius:3px; font-size:10px; font-weight:800; color:#fff;}
.vst .pp-rec i.w{background:var(--green);} .vst .pp-rec i.l{background:var(--bad);} .vst .pp-rec i.p{background:#8a949f;}
/* picks by day: the bar chart */
.vst .pp-bars{display:flex; align-items:flex-end; gap:6px; height:84px; margin-top:10px;}
.vst .pp-bar{flex:1 1 0; display:flex; flex-direction:column; align-items:stretch; height:100%; min-width:0; color:#000;}
.vst .pp-bar .col{flex:1 1 auto; display:flex; align-items:flex-end; background:#f1f1f1; border-radius:3px; overflow:hidden;}
.vst .pp-bar .col i{display:flex; align-items:flex-end; width:100%; background:#c9ced6; border-radius:3px 3px 0 0; min-height:2px;}
.vst .pp-bar .col i b{display:block; width:100%; background:#2b2f36;}
.vst .pp-bar.is-today .col i{background:#f1b8b2;} .vst .pp-bar.is-today .col i b{background:var(--red);}
.vst .pp-bar.is-future .col i{background:#e4e6ea;}
.vst .pp-bar small{margin-top:4px; text-align:center; font-size:9px; font-weight:800; color:#333; white-space:nowrap;}
.vst .pp-bar.is-today small{color:var(--red);}
.vst .pp-bar:hover .col{background:#e9ecef;}
/* the donut */
.vst .pp-donut{width:96px; height:96px; flex:0 0 96px; transform:rotate(-90deg);}
.vst .pp-donut circle.w{stroke:var(--green);} .vst .pp-donut circle.l{stroke:var(--bad);} .vst .pp-donut circle.p{stroke:#8a949f;}
.vst .pp-donut text.pct{transform:rotate(90deg); transform-origin:21px 21px; font-size:9px; font-weight:800; fill:#000;}
/* proportional bars: label, track, value */
.vst .pp-hbars{display:flex; flex-direction:column; gap:5px;}
.vst .pp-hbar{display:grid; grid-template-columns:minmax(0,120px) minmax(0,1fr) 64px; align-items:center; gap:8px; color:#000; min-width:0;}
.vst .pp-hbar .lbl{display:flex; align-items:center; gap:5px; min-width:0; font-size:11px; font-weight:800; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.vst .pp-hbar .lbl .pg-sicon{width:16px; height:16px; flex:0 0 auto;}
.vst .pp-hbar .lbl .pp-brk{width:24px; margin:0; padding:1px 0; font-size:10px; flex:0 0 auto;}
.vst .pp-hbar .trk{display:block; height:10px; background:#f1f1f1; border-radius:3px; overflow:hidden;}
.vst .pp-hbar .trk i{display:block; height:100%; background:#2b2f36; border-radius:3px; min-width:2px;}
.vst .pp-hbar .trk i.pos{background:var(--green);} .vst .pp-hbar .trk i.neg{background:var(--bad);}
.vst .pp-hbar .val{display:flex; flex-direction:column; align-items:flex-end; line-height:1.1;}
.vst .pp-hbar .val b{font-size:12px; font-weight:800; font-variant-numeric:tabular-nums;}
.vst .pp-hbar .val b.pos{color:var(--green);} .vst .pp-hbar .val b.neg{color:var(--bad);}
.vst .pp-hbar .val small{font-size:9px; font-weight:700; color:#333;}
.vst .pp-hbar:hover .lbl{color:var(--red);}
/* the market mix: one stacked bar and a legend */
.vst .pp-stack{display:flex; height:16px; border-radius:4px; overflow:hidden; background:#f1f1f1;}
.vst .pp-stack i{display:block; height:100%;}
.vst .f-team{background:#2b2f36;} .vst .f-total{background:var(--over);} .vst .f-prop{background:#6f42c1;} .vst .f-other{background:#8a949f;}
.vst .pp-legend{display:flex; flex-wrap:wrap; gap:6px 14px; margin-top:10px;}
.vst .pp-legend span{display:inline-flex; align-items:center; gap:5px; font-size:11px; font-weight:700; color:#000;}
.vst .pp-legend b{font-weight:800;} .vst .pp-legend small{font-size:9px; color:#333;}
/* expert of the week */
.vst .pp-spot{display:flex; align-items:center; gap:10px; color:#000;}
.vst .pp-spot img{width:52px; height:52px; border-radius:50%; object-fit:cover; background:#fff; border:2px solid #e6b800;}
.vst .pp-spot .who b{display:block; font-size:16px; font-weight:800; color:var(--red); line-height:1.1;}
.vst .pp-spot:hover .who b{color:#000;}
.vst .pp-spot .who small{display:flex; align-items:center; gap:6px; margin-top:3px; font-size:10px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:#444;}
.vst .pp-spot .who small .pp-brk{width:22px; margin:0; padding:1px 0; font-size:10px;}
.vst .pp-spot-rows{display:flex; flex-direction:column; gap:4px; margin-top:10px;}
.vst .pp-spot-row{display:grid; grid-template-columns:48px 1fr auto 64px; align-items:center; gap:6px; font-size:11px;}
.vst .pp-spot-row small{font-size:9px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:#444;}
.vst .pp-spot-row b{font-weight:800; font-variant-numeric:tabular-nums;}
.vst .pp-spot-row .bx{min-width:0; padding:2px 6px; font-size:10px;}
.vst .pp-spot-row .bx.pos{background:var(--green); border-color:var(--green); color:#fff;}
.vst .pp-spot-row em{font-style:normal; text-align:right; font-size:10px; font-weight:700; color:#333;}
/* experts agree: split bars */
.vst .pp-agree{display:block; padding:7px 0; border-bottom:1px solid #e4e6ea; color:#000;}
.vst .pp-agree:last-child{border-bottom:0;}
.vst .pp-agree .hd{display:flex; align-items:center; justify-content:space-between; gap:8px; min-width:0;}
.vst .pp-agree .tm{font-size:12px; font-weight:800; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; min-width:0;}
.vst .pp-agree .tm img{width:16px; height:16px; vertical-align:middle; margin-right:3px;}
.vst .pp-agree .tm em{font-style:normal; color:#555; font-weight:700;}
.vst .pp-agree .wh{font-size:10px; font-weight:700; color:#333; white-space:nowrap;}
.vst .pp-agree .split{display:grid; grid-template-columns:22px 1fr 22px auto; align-items:center; gap:6px; margin-top:4px;}
.vst .pp-agree .split > b{font-size:12px; font-weight:800; text-align:center;}
.vst .pp-agree .split b.pos{color:var(--green);} .vst .pp-agree .split b.neg{color:var(--bad);}
.vst .pp-agree .split .trk{display:flex; height:8px; border-radius:3px; overflow:hidden; background:#f1f1f1;}
.vst .pp-agree .split .trk i{display:block; height:100%;}
.vst .pp-agree .split .trk i.pos{background:var(--green);} .vst .pp-agree .split .trk i.neg{background:var(--bad);}
.vst .pp-lockpanel.in-w{border:0; background:transparent; padding:14px 0;}
.vst .pp-w .pp-board-empty{padding:8px 0;}
@media (max-width:1399px){ .vst .pp-wgrid{grid-template-columns:repeat(3, minmax(0,1fr));} }
@media (max-width:991px){ .vst .pp-wgrid{grid-template-columns:repeat(2, minmax(0,1fr));} }
@media (max-width:600px){ .vst .pp-wgrid{grid-template-columns:1fr;} }

/* widget evenness: one body height, rows on a fixed rhythm, values in one column */
.vst .pp-w-body{display:flex; flex-direction:column; justify-content:center; min-height:168px; box-sizing:border-box;}
.vst .pp-w-days .pp-w-body,.vst .pp-w-hot .pp-w-body,.vst .pp-w-today .pp-w-body,.vst .pp-w-agree .pp-w-body{justify-content:flex-start;}
.vst .pp-w-row{gap:18px;}
.vst .pp-donut{width:108px; height:108px; flex:0 0 108px;}
.vst .pp-donut text.pct{font-size:8.5px;}
.vst .pp-hbars{gap:0;}
.vst .pp-hbar{height:26px; grid-template-columns:minmax(0,96px) minmax(0,1fr) 72px; border-bottom:1px solid #f1f1f1;}
.vst .pp-hbar:last-child{border-bottom:0;}
.vst .pp-hbar.ghost{border-bottom:0;}
.vst .pp-hbar .val{flex-direction:row; align-items:baseline; justify-content:flex-end; gap:4px; white-space:nowrap;}
.vst .pp-hbar .val b{font-size:12px; min-width:24px; text-align:right;}
.vst .pp-hbar .val small{font-size:9px; min-width:26px; text-align:right;}
.vst .pp-w-hot .pp-hbar,.vst .pp-w-today .pp-hbar{grid-template-columns:minmax(0,132px) minmax(0,1fr) 96px;}
.vst .pp-w-hot .pp-hbar .val small,.vst .pp-w-today .pp-hbar .val small{min-width:40px;}
.vst .pp-stack{height:18px; margin-top:6px;}
.vst .pp-legend{display:grid; grid-template-columns:1fr 1fr; gap:8px 12px; margin-top:14px;}
.vst .pp-legend span{display:grid; grid-template-columns:9px 1fr auto auto; align-items:center; gap:6px;}
.vst .pp-legend em{font-style:normal;}
.vst .pp-legend b{min-width:28px; text-align:right;} .vst .pp-legend small{min-width:30px; text-align:right;}
.vst .pp-spot{padding-bottom:10px; border-bottom:1px solid #f1f1f1;}
.vst .pp-spot-rows{gap:0; margin-top:4px;}
.vst .pp-spot-row{height:30px; grid-template-columns:52px 1fr 76px 60px; border-bottom:1px solid #f1f1f1;}
.vst .pp-spot-row:last-child{border-bottom:0;}
.vst .pp-spot-row .bx{display:block; text-align:center;}
.vst .pp-big > b{font-size:32px;}
.vst .pp-w-results .pp-big{gap:4px;}

/* dashboard: widgets left, leaderboards right, feeds under */
.vst .pp-dash-top{display:grid; grid-template-columns:minmax(0,2fr) minmax(300px,1fr); gap:14px; align-items:start; margin-bottom:14px;}
.vst .pp-dash-top .pp-wgrid{grid-template-columns:repeat(3, minmax(0,1fr)); margin-bottom:0;}
.vst .pp-dash-side{display:flex; flex-direction:column; gap:14px; min-width:0;}
.vst .pp-dash-grid.feeds{grid-template-columns:repeat(2, minmax(0,1fr));}
@media (max-width:1199px){ .vst .pp-dash-top{grid-template-columns:1fr;} .vst .pp-dash-top .pp-wgrid{grid-template-columns:repeat(3, minmax(0,1fr));} }
@media (max-width:991px){ .vst .pp-dash-top .pp-wgrid{grid-template-columns:repeat(2, minmax(0,1fr));} .vst .pp-dash-grid.feeds{grid-template-columns:1fr;} }
@media (max-width:600px){ .vst .pp-dash-top .pp-wgrid{grid-template-columns:1fr;} }

/* just posted as cards */
.vst .pp-posted{margin-top:0;}
.vst .pp-pcards{display:grid; grid-template-columns:repeat(auto-fill, minmax(300px, 1fr)); gap:12px; padding:12px; border:1px solid #c4c4c4; border-top:0; background:#f1f1f1;}
.vst .pp-pcard{display:flex; flex-direction:column; gap:8px; padding:10px 12px; border:1px solid #cfd5de; border-left:4px solid #2b2f36; border-radius:6px; background:#fff; color:#000; min-width:0; box-shadow:0 1px 2px rgba(0,0,0,.06);}
.vst .pp-pcard:hover{border-color:var(--red); box-shadow:0 2px 6px rgba(0,0,0,.12);}
.vst .pp-pcard .top{display:flex; align-items:center; gap:8px; min-width:0;}
.vst .pp-pcard .top img{width:34px; height:34px; border-radius:50%; object-fit:cover; background:#fff; border:1px solid #c4c4c4; flex:0 0 auto;}
.vst .pp-pcard .who{flex:1 1 auto; min-width:0; display:flex; flex-wrap:wrap; align-items:center; gap:0 5px; line-height:1.2;}
.vst .pp-pcard .who b{font-size:13px; font-weight:800; color:var(--red); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%;}
.vst .pp-pcard:hover .who b{color:#000;}
.vst .pp-pcard .who small{flex-basis:100%; font-size:10px; font-weight:700; color:#333; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.vst .pp-pcard .ago{flex:0 0 auto; padding:2px 7px; border-radius:10px; background:#2b2f36; color:#fff; font-size:9px; font-weight:800; letter-spacing:.04em; white-space:nowrap;}
.vst .pp-pcard .pick{display:block; padding:7px 10px; border-radius:4px; background:#f1f1f1; border:1px solid #c4c4c4; font-size:13px; font-weight:800; line-height:1.3; color:#000;}
.vst .pp-pcard .pick .pp-brandline{display:block; margin:0 0 4px;}
.vst .pp-pcard .foot{display:flex; align-items:center; gap:6px; flex-wrap:wrap; font-size:11px; font-weight:700; color:#222;}
.vst .pp-pcard .foot .day{font-weight:800; color:#000;}
.vst .pp-pcard .foot .pp-bookchip{margin:0;}
.vst .pp-pcard .foot .res{margin-left:auto; font-size:9px; padding:3px 8px;}
@media (max-width:767px){ .vst .pp-pcards{grid-template-columns:1fr; padding:8px;} }

/* just posted inside the widget column: two across, a header strip on each card */
.vst .pp-dash-main{display:flex; flex-direction:column; gap:14px; min-width:0;}
/* the section and its tray span exactly the widget column: no section margins, the tray's outer edge is the widgets' outer edge */
.vst .pp-dash-main .pp-posted{margin:0; padding:0; width:100%; box-sizing:border-box;}
.vst .pp-dash-main .pp-posted .vst-band{margin:0;}
.vst .pp-dash-main .pp-pcards{grid-template-columns:repeat(2, minmax(0,1fr)); gap:12px; padding:12px; box-sizing:border-box; width:100%;}
.vst .pp-pcard{gap:0; padding:0; border-left-width:1px; overflow:hidden;}
.vst .pp-pcard .head{display:grid; grid-template-columns:46px 1fr 60px 60px; align-items:center; gap:8px; height:38px; padding:0 12px; background:#f7f7f7; color:#000; border-bottom:1px solid #e4e6ea;}
.vst .pp-pcard .head .pp-sportchip{width:46px;}
.vst .pp-pcard .head .day{font-size:11px; font-weight:800; color:#000; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.vst .pp-pcard .head .book{text-align:center;}
/* the book and the result are the same box: 60 wide, same height, same type size */
.vst .pp-pcard .head .pp-bookchip,.vst .pp-pcard .head .res{display:block; width:60px; min-width:0; height:22px; line-height:20px; margin:0; padding:0; font-size:9px; letter-spacing:.04em; text-align:center; box-sizing:border-box; border-radius:3px; border-width:1px; border-style:solid;}
.vst .pp-pcard .head .res.pre{background:#fff; color:#555; border-color:#c4c4c4;}
.vst .pp-pcard .top{height:52px; padding:0 12px; box-sizing:border-box;}
.vst .pp-pcard .pick{margin:0 12px 12px; min-height:46px; display:flex; align-items:center; box-sizing:border-box;}
.vst .pp-pcard .pick .pp-brandline{display:block; width:100%;}
.vst .pp-pcard .who small{font-size:10px;}
@media (max-width:767px){ .vst .pp-dash-main .pp-pcards{grid-template-columns:1fr;} }

/* the expert directory */
.vst .pp-dir-tools{border-top:0; margin-top:0; padding-top:10px;}
.vst .pp-dirfilter a small{margin-left:5px; padding:0 5px; border-radius:8px; background:#e9ecef; color:#222; font-size:9px; font-weight:800;}
.vst .pp-dirfilter a.on small{background:rgba(255,255,255,.25); color:#fff;}
.vst .pp-dir{display:grid; grid-template-columns:repeat(auto-fill, minmax(280px, 1fr)); gap:12px; padding:12px 0 0;}
.vst .pp-dcard{display:flex; flex-direction:column; gap:8px; padding:10px 12px; border:1px solid #c4c4c4; border-radius:6px; background:#fff; min-width:0;}
.vst .pp-dcard[hidden]{display:none;}
.vst .pp-dcard .top{display:flex; align-items:center; gap:8px; min-width:0; color:#000; height:42px;}
.vst .pp-dcard .top img{width:38px; height:38px; border-radius:50%; object-fit:cover; background:#fff; border:1px solid #c4c4c4; flex:0 0 auto;}
.vst .pp-dcard .who{flex:1 1 auto; min-width:0; display:flex; flex-direction:column; justify-content:center; line-height:1.2;}
.vst .pp-drank{flex:0 0 26px; display:inline-flex; align-items:center; justify-content:center; width:26px; height:20px; box-sizing:border-box; margin:0; padding:0; border-radius:3px; border:1px solid #c4c4c4; background:#fff; color:#000; font-size:11px; font-weight:800; line-height:1;}
.vst .pp-drank.t1{background:#e6b800; border-color:#e6b800; color:#fff;}
.vst .pp-drank.t2{background:#9aa3ad; border-color:#9aa3ad; color:#fff;}
.vst .pp-drank.t3{background:#c47a3a; border-color:#c47a3a; color:#fff;}
.vst .pp-dcard .who b{font-size:14px; font-weight:800; color:var(--red); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%;}
.vst .pp-dcard .top:hover .who b{color:#000;}
.vst .pp-dcard .who small{font-size:10px; font-weight:700; color:#333; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.vst .pp-dcard .nums{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:6px;}
.vst .pp-dcard .nums a{display:block; height:44px; padding:5px 2px; box-sizing:border-box; text-align:center; background:#f4f4f4; border:1px solid #ddd; border-radius:5px; color:#000;}
.vst .pp-dcard .nums a:hover{border-color:var(--red);}
.vst .pp-dcard .nums a.empty b{color:#999;}
.vst .pp-dcard .nums b{display:block; font-size:15px; font-weight:800; line-height:1.1; font-variant-numeric:tabular-nums;}
.vst .pp-dcard .nums small{display:block; margin-top:2px; font-size:8px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:#444;}
.vst .pp-dcard .nums a.l7 small .pos{color:var(--green); letter-spacing:0; text-transform:none; font-size:10px;}
@media (max-width:767px){ .vst .pp-dir{grid-template-columns:1fr;} }

/* the experts strip on the home page: one row of chips, the rest behind the link */
.vst .pp-expstrip{display:flex; align-items:center; gap:8px; padding:8px 10px; border:1px solid #c4c4c4; border-radius:6px; background:#f7f7f7; min-width:0;}
.vst .pp-expstrip .grp{flex:0 0 auto; font-size:10px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:#444; white-space:nowrap;}
.vst .pp-expstrip .chips{flex:1 1 auto; display:flex; gap:6px; overflow:hidden; min-width:0; mask-image:linear-gradient(to right, #000 92%, transparent); -webkit-mask-image:linear-gradient(to right, #000 92%, transparent);}
.vst .pp-echip{flex:0 0 auto; display:inline-flex; align-items:center; gap:5px; height:28px; padding:0 8px 0 3px; border:1px solid #c4c4c4; border-radius:14px; background:#fff; color:#000; white-space:nowrap;}
.vst .pp-echip img{width:22px; height:22px; border-radius:50%; object-fit:cover; background:#fff; border:1px solid #c4c4c4;}
.vst .pp-echip .pp-drank{width:20px; height:16px; font-size:9px; border-radius:8px;}
.vst .pp-echip .nm{font-size:11px; font-weight:800; color:var(--red);}
.vst .pp-echip .ct{display:inline-block; min-width:18px; padding:1px 5px; border-radius:8px; background:#2b2f36; color:#fff; font-size:9px; font-weight:800; text-align:center;}
.vst .pp-echip:hover{border-color:var(--red);}
.vst .pp-echip:hover .nm{color:#000;}
.vst .pp-echip.all{flex:0 0 auto; padding:0 10px; background:#000; border-color:#000; color:#fff; font-size:11px; font-weight:800;}
.vst .pp-echip.all:hover{background:var(--red); border-color:var(--red);}
@media (max-width:767px){ .vst .pp-expstrip .grp{display:none;} }

.vst .pp-dash-row.experts{margin-bottom:14px;}

/* the head's right side: the board button and the nav wrap onto two lines rather than clip */
.vst.propicks-page .vst-head-right{display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px; min-width:0;}
.vst.propicks-page .vst-head-right .pp-nav{flex:0 1 auto; max-width:100%; overflow-x:auto;}

/* starting soon */
/* the filter panel: three compact rows, a dark label cell, square chips */
.vst .pp-soon-tools{display:flex; flex-direction:column; margin-top:12px; border:1px solid #c4c4c4; border-radius:6px; background:#fff; overflow:hidden;}
.vst .pp-soon-line{display:flex; align-items:stretch; justify-content:space-between; min-width:0;}
.vst .pp-soon-line .vst-rail{flex:1 1 auto; display:flex; flex-wrap:wrap; align-items:center; gap:4px; min-width:0; padding:4px 8px 4px 0; min-height:0; margin:0; border:0; background:transparent;}
.vst .pp-soon-line .vst-rail .grp{flex:0 0 88px; align-self:stretch; display:flex; align-items:center; padding:0 8px; margin:-4px 8px -4px 0; background:#2b2f36; color:#fff; font-size:9px; font-weight:800; letter-spacing:.08em; text-transform:uppercase;}
.vst .pp-soon-line .vst-rail a{display:inline-flex; align-items:center; height:24px; padding:0 9px; border-radius:4px; background:#fff; border:1px solid #c4c4c4; color:#000; font-size:11px; font-weight:800; line-height:1; margin:0;}
.vst .pp-soon-line .vst-rail a:hover{border-color:var(--red);}
.vst .pp-soon-line .vst-rail a.on{background:#000; border-color:#000; color:#fff;}
.vst .pp-soon-find{flex:0 0 auto; display:flex; align-items:center; gap:0; padding:3px 4px 3px 0;}
.vst .pp-soon-find .vst-search{margin:0; height:26px; padding:0 10px 0 28px; font-size:11px; width:240px; border:1px solid #2b2f36; border-right:0; border-radius:4px 0 0 4px; background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232b2f36' stroke-width='3'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-4-4'/%3E%3C/svg%3E") 9px center / 13px no-repeat;}
.vst .pp-soon-find .vst-search:focus{outline:0; border-color:var(--red);}
.vst .pp-soon-find .vst-count{display:inline-flex; align-items:center; height:26px; padding:0 10px; border-radius:0 4px 4px 0; background:#2b2f36; color:#fff; white-space:nowrap; font-size:11px; font-weight:800; box-sizing:border-box;}
.vst .pp-soonsport a .pg-sicon{width:14px; height:14px; vertical-align:middle; margin-right:4px;}
.vst .pp-soonwin a .short{display:none;}
@media (max-width:767px){
  .vst .vst-title.has-logo{flex-wrap:wrap; gap:4px 12px;}
  .vst .vst-title.has-logo .vst-title-date{flex-basis:100%; white-space:normal;}
}
}
.vst .pp-soon{padding-top:12px;}
.vst .pp-soon-band{display:flex; align-items:center; justify-content:space-between; margin-top:12px; padding:7px 12px; border-radius:6px 6px 0 0; background:#000; color:#fff; font-size:12px; font-weight:800; letter-spacing:.06em; text-transform:uppercase;}
.vst .pp-soon-band:first-child{margin-top:0;}
.vst .pp-soon-band .n{font-size:10px; letter-spacing:.04em; text-transform:none; color:#ddd;}
.vst .pp-soon-band[hidden]{display:none;}
.vst .pp-pcards.soon{grid-template-columns:repeat(auto-fill, minmax(320px, 1fr)); gap:12px; padding:12px; background:#f1f1f1; border:1px solid #c4c4c4; border-top:0; border-radius:0 0 6px 6px;}
.vst .pp-pcards.soon[hidden]{display:none;}
.vst .pp-pcard[hidden]{display:none;}
.vst .pp-pcard .head .day .in{margin-left:6px; padding:1px 6px; border-radius:8px; background:#2b2f36; color:#fff; font-size:9px; font-weight:800;}
@media (max-width:767px){ .vst .pp-pcards.soon{grid-template-columns:1fr; padding:8px;} }

/* the home head chips: same as every other page's, the soon one red-edged when live */
.vst .pp-homehs a.hs{color:#fff;}
.vst .pp-homehs a.hs:hover{border-color:var(--red);}
.vst .pp-homehs .hs.hot b{color:#7ed957;}
.vst .pp-homehs .hs.soon{border-color:var(--red);}
.vst .pp-homehs .hs.soon b{color:#ff6b5e;}

/* picks under a board that have no game card */
.vst .pg-loose{margin:14px 18px 0;}
.vst .pg-loose .pp-table{margin-top:0;}
@media (max-width:767px){ .vst .pg-loose{margin:12px 8px 0;} }

/* best of the day: the one dark card */
.vst .pp-w-best{background:#0f1115; border-color:#0f1115; box-shadow:inset 0 0 0 2px #e6b800;}
.vst .pp-best{display:flex; flex-direction:column; justify-content:center; gap:8px; height:100%; min-height:168px; padding:14px 16px; box-sizing:border-box; color:#fff;}
.vst .pp-best-tag{font-size:10px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:#e6b800;}
.vst .pp-best-who{display:flex; align-items:center; gap:10px; min-width:0;}
.vst .pp-best-who img{width:54px; height:54px; border-radius:50%; object-fit:cover; background:#fff; border:3px solid #e6b800; flex:0 0 auto;}
.vst .pp-best-who .nm{min-width:0; line-height:1.15;}
.vst .pp-best-who .nm b{display:block; font-size:19px; font-weight:800; color:#fff; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.vst .pp-best-who .nm small{display:block; margin-top:3px; font-size:10px; font-weight:700; color:#cfd5de; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.vst .pp-best-num{font-size:40px; font-weight:800; line-height:1; letter-spacing:-.01em; font-variant-numeric:tabular-nums; color:#fff;}
.vst .pp-best-num.pos{color:#7ed957;} .vst .pp-best-num.neg{color:#ff6b5e;}
.vst .pp-best-line{display:flex; align-items:baseline; gap:10px; font-size:12px; font-weight:800; color:#fff;}
.vst .pp-best-line i{font-style:normal; font-weight:700; color:#cfd5de;}
.vst .pp-best-line em{font-style:normal; margin-left:auto; font-size:10px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:#e6b800;}
.vst .pp-best-foot{padding-top:8px; border-top:1px solid #2b2f36; font-size:11px; font-weight:700; color:#cfd5de;}
.vst .pp-best-foot b{color:#fff;} .vst .pp-best-foot .pos{color:#7ed957;} .vst .pp-best-foot .neg{color:#ff6b5e;}
.vst .pp-best:hover .pp-best-who .nm b{color:#e6b800;}

.vst .pp-w-none{display:flex; flex-direction:column; gap:6px; text-align:center; padding:8px 6px;}
.vst .pp-w-none b{font-size:14px; font-weight:800; color:#000;}
.vst .pp-w-none small{font-size:11px; font-weight:700; color:#333; line-height:1.4;}

.vst .pp-best-box{display:flex; flex-direction:column; gap:6px; padding:10px 12px; border-radius:6px; background:#1f2328; border:1px solid #3a3f47;}
.vst .pp-best-foot{border-top:0; padding-top:0;}

/* the logo in the head */
.vst .vst-title.has-logo{display:flex; align-items:center; gap:12px; min-width:0;}
.vst .pp-logo{height:40px; width:auto; display:block; flex:0 0 auto;}
.vst .pp-logo-text{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap;}
.vst .vst-title.has-logo .vst-title-date{white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
@media (max-width:767px){ .vst .pp-logo{height:32px;} }

/* ---- phone navigation: bottom tab bar + More sheet; filter sheet on the soon page ---- */
.vst .pp-mbar,.pp-tabbar,.pp-moresheet,.pp-sheet-dim,.pp-sheet-head,.vst .pp-sheet-foot{display:none;}
.vst .pp-soon-find.m{display:none;}
@media (max-width:767px){
  /* room for the bar */
  .vst.propicks-page{padding-bottom:64px;}
  .pp-tabbar{position:fixed; left:0; right:0; bottom:0; z-index:60; display:grid; grid-template-columns:repeat(5, 1fr); height:58px; padding-bottom:env(safe-area-inset-bottom); background:#000; border-top:2px solid var(--red);}
  .pp-tabbar a,.pp-tabbar button{display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; color:#cfd5de; background:transparent; border:0; font-size:10px; font-weight:800; letter-spacing:.04em; text-transform:uppercase; cursor:pointer; padding:0;}
  .pp-tabbar i{font-size:18px; line-height:1;}
  .pp-tabbar .on{color:#fff;}
  .pp-tabbar .on i{color:var(--red);}
  /* the top nav strip gives way to the bar */
  .vst .vst-head-right .pp-nav{display:none;}
  /* sheets: slide up from the bottom, a dim behind */
  .pp-sheet-dim{position:fixed; inset:0; z-index:70; background:rgba(0,0,0,.55);}
  .pp-sheet-dim.open{display:block;}
  .pp-moresheet,.vst .pp-sheet{position:fixed; left:0; right:0; bottom:0; z-index:80; max-height:82vh; overflow-y:auto; background:#fff; border-radius:12px 12px 0 0; box-shadow:0 -4px 24px rgba(0,0,0,.3); transform:translateY(105%); transition:transform .22s ease;}
  .pp-moresheet{display:block;}
  .pp-moresheet.open,.vst .pp-sheet.open{transform:translateY(0);}
  .pp-sheet-head{display:flex; align-items:center; justify-content:space-between; padding:12px 16px; background:#000; color:#fff; font-size:13px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; position:sticky; top:0;}
  .pp-sheet-x{border:0; background:transparent; color:#fff; font-size:26px; line-height:1; cursor:pointer; padding:0 4px;}
  .pp-morelist{display:flex; flex-direction:column; padding:6px 0 10px;}
  .pp-morelist a{padding:13px 18px; border-bottom:1px solid #e4e6ea; color:#000; font-size:14px; font-weight:800;}
  .pp-morelist a.on{color:var(--red);}
  /* the soon page on a phone: the tray becomes the bar; the chip rows live in the sheet */
  .vst .pp-soon-tools{border:0; background:transparent; overflow:visible;}
  .vst .pp-mbar{display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; align-items:center;}
  .vst .pp-soon-find.m{display:flex; padding:0;}
  .vst .pp-soon-find.m .vst-search{flex:1 1 auto; width:auto; min-width:0;}
  .vst .pp-soon-find.d{display:none;}
  .vst .pp-filterbtn{position:relative; display:inline-flex; align-items:center; gap:6px; height:28px; padding:0 12px; border-radius:4px; border:1px solid #2b2f36; background:#2b2f36; color:#fff; font-size:11px; font-weight:800; letter-spacing:.04em; text-transform:uppercase; cursor:pointer;}
  .vst .pp-filterbtn .badge{position:absolute; top:-7px; right:-7px; min-width:18px; height:18px; padding:0 5px; border-radius:9px; background:var(--red); color:#fff; font-size:10px; line-height:18px; text-align:center;}
  .vst .pp-applied{grid-column:1 / -1; display:flex; flex-wrap:wrap; gap:6px;}
  .vst .pp-applied:empty{display:none;}
  .vst .pp-applied span{display:inline-flex; align-items:center; gap:6px; height:24px; padding:0 4px 0 9px; border-radius:12px; background:#000; color:#fff; font-size:11px; font-weight:800;}
  .vst .pp-applied span b{display:inline-flex; align-items:center; justify-content:center; width:16px; height:16px; border-radius:8px; background:#fff; color:#000; font-size:12px; line-height:1; cursor:pointer;}
  .vst .pp-sheet{display:block;}
  .vst .pp-sheet .pp-soon-line{flex-direction:column; align-items:stretch; padding:10px 16px 0;}
  .vst .pp-sheet .pp-soon-line .vst-rail{flex-wrap:wrap; gap:6px; padding:0; margin:0;}
  .vst .pp-sheet .pp-soon-line .vst-rail .grp{flex-basis:100%; margin:0 0 6px; padding:0; min-height:0; background:transparent; color:#444; font-size:10px; letter-spacing:.1em;}
  .vst .pp-sheet .pp-soon-line .vst-rail a{height:32px; padding:0 14px; font-size:13px;}
  .vst .pp-soonwin a .long{display:inline;} .vst .pp-soonwin a .short{display:none;}
  .vst .pp-sheet-foot{display:grid; grid-template-columns:1fr 2fr; gap:10px; padding:14px 16px calc(14px + env(safe-area-inset-bottom)); position:sticky; bottom:0; background:#fff; border-top:1px solid #e4e6ea; margin-top:12px;}
  .vst .pp-sheet-foot button{height:44px; border-radius:6px; font-size:14px; font-weight:800; cursor:pointer;}
  .vst .pp-sheet-clear{background:#fff; border:1px solid #c4c4c4; color:#000;}
  .vst .pp-sheet-apply{background:var(--red); border:1px solid var(--red); color:#fff;}
}

/* the card grids never exceed their column */
.vst .pp-soon,.vst .pp-pcards,.vst .pp-dir{min-width:0; max-width:100%;}
.vst .pp-pcards.soon{grid-template-columns:repeat(auto-fill, minmax(min(320px, 100%), 1fr));}
.vst .pp-dir{grid-template-columns:repeat(auto-fill, minmax(min(280px, 100%), 1fr));}

/* the primary nav: a little tighter so it sits beside the head chips */
.vst.propicks-page .pp-nav a{padding-left:11px; padding-right:11px; letter-spacing:.03em;}
@media (min-width:768px) and (max-width:1199px){ .vst.propicks-page .pp-nav a{padding-left:8px; padding-right:8px; font-size:11px;} }

/* the head as two rows: logo and nav, then the sub line and the chips */
.vst .pp-head{display:block;}
.vst .pp-head-row{display:flex; align-items:center; justify-content:space-between; gap:12px 18px; min-width:0;}
.vst .pp-head-row .vst-title{margin:0; min-width:0;}
.vst .pp-head-row .vst-head-right{flex:0 1 auto;}
.vst .pp-head-row.two{justify-content:flex-start; gap:8px 16px; margin-top:8px; flex-wrap:wrap;}
.vst .pp-head-row.two .vst-sub{margin:0;}
.vst .pp-head-row.two .vst-hs{margin:0;}
@media (max-width:767px){ .vst .pp-head-row{flex-wrap:wrap;} }

/* the page's own count leads the site-wide chips */
.vst .pp-homehs .hs.here{background:var(--red); border-color:var(--red); margin-right:6px;}
.vst .pp-homehs .hs.here b,.vst .pp-homehs .hs.here small{color:#fff;}

/* the site search: a trigger on the page, a centred modal when open */
.vst .pp-ssearch-chip{display:inline-flex; align-items:center; gap:7px; cursor:pointer; margin-left:6px; padding:0 12px; border:1px solid #1f6feb; border-radius:4px; background:#1f6feb; color:#fff; font:inherit; box-sizing:border-box; height:auto; line-height:inherit; align-self:stretch;}
.vst .pp-ssearch-chip svg{display:block; width:14px; height:14px; flex:0 0 auto; color:#fff;}
.vst .pp-ssearch-chip b{font-size:12px; font-weight:800; letter-spacing:.04em; text-transform:uppercase; color:#fff; line-height:1;}
.vst .pp-ssearch-chip kbd{padding:0 5px; border:1px solid rgba(255,255,255,.5); border-radius:3px; background:rgba(0,0,0,.25); color:#fff; font-family:inherit; font-size:9px; font-weight:800; line-height:14px;}
.vst .vst-hs .pp-ssearch-chip:hover,.vst .vst-hs .pp-ssearch-chip:focus{background:#145cc9 !important; border-color:#145cc9 !important; color:#fff !important; outline:0;}
.vst .pp-search-host{display:contents;}
/* the modal sits above the site header: same frame as the site's picks modal, black title bar with the red rule */
.vst .pp-ssearch-dim{position:fixed; inset:0; z-index:100000; background:rgba(0,0,0,.6);}
.vst .pp-ssearch-dim[hidden]{display:none;}
.vst .pp-ssearch{position:fixed; left:50%; top:5vh; bottom:auto; z-index:100001; width:min(900px, calc(100% - 24px)); height:auto; max-height:calc(100vh - 10vh); box-sizing:border-box; display:flex; flex-direction:column; transform:translateX(-50%); background:#fff; border-radius:8px; box-shadow:0 18px 50px rgba(0,0,0,.45); overflow:hidden;}
.vst .pp-ssearch[hidden]{display:none;}
.vst .pp-ssearch-title{display:flex; align-items:center; justify-content:space-between; flex:0 0 auto; height:46px; padding:0 16px; background:#000; color:#fff; border-bottom:3px solid var(--red); font-size:14px; font-weight:800; letter-spacing:.06em; text-transform:uppercase;}
.vst .pp-ssearch-x{border:0; background:transparent; color:var(--red); font-size:26px; line-height:1; cursor:pointer; padding:0 2px;}
.vst .pp-ssearch-x:hover{color:#fff;}
.vst .pp-ssearch-box{display:flex; align-items:center; gap:10px; flex:0 0 auto; height:56px; padding:0 16px; border-bottom:1px solid #e4e6ea; background:#fff;}
.vst .pp-ssearch-box i{font-size:17px; color:#2b2f36;}
.vst .pp-ssearch-box input{flex:1 1 auto; min-width:0; height:100%; border:0; outline:0; background:transparent; font-size:18px; font-weight:700; color:#000;}
.vst .pp-ssearch-box input::placeholder{color:#555; font-weight:600;}
.vst .pp-ssearch-n{flex:0 0 auto; font-size:10px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:#444; white-space:nowrap;}
.vst .pp-ssearch-hint{padding:8px 14px; font-size:11px; font-weight:600; color:#333; background:#f7f7f7;}
.vst .pp-ssearch-hint b{font-weight:800; color:#000;}
.vst .pp-ssearch-hint[hidden]{display:none;}
.vst .pp-ssearch-drop{flex:1 1 auto; min-height:0; max-height:calc(90vh - 200px); overflow-y:auto !important; overscroll-behavior:contain; padding:10px 12px 12px; background:#f1f1f1; display:flex; flex-direction:column; gap:10px;}
.vst .pp-ssearch-drop[hidden]{display:none;}
.vst .pp-ss-card{flex:0 0 auto; border:1px solid #c4c4c4; border-radius:6px; background:#fff; overflow:hidden;}
.vst .pp-ss-empty{flex:0 0 auto;}
.vst .pp-ss-grp{padding:6px 12px; background:#f7f7f7; border-bottom:1px solid #e4e6ea; color:#333; font-size:10px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; display:flex; justify-content:space-between;}
.vst .pp-ss-grp small{display:inline-flex; align-items:center; justify-content:center; min-width:22px; height:18px; padding:0 7px; border-radius:9px; background:#2b2f36; color:#fff; font-size:10px; font-weight:800; letter-spacing:0; text-transform:none;}
.vst .pp-ss-forget{font-size:10px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--red); text-decoration:none; padding:0 2px;}
.vst .pp-ss-forget:hover{color:#000; text-decoration:underline;}
.vst .pp-ss-row{display:grid; grid-template-columns:34px minmax(0,1fr) auto; align-items:center; gap:10px; padding:7px 12px; border-bottom:1px solid #e4e6ea; color:#000; cursor:pointer;}
.vst .pp-ss-row:last-child{border-bottom:0;}
.vst .pp-ss-row.is-on,.vst .pp-ss-row:hover{background:#fff8dc;}
.vst .pp-ss-row img{width:30px; height:30px; border-radius:50%; object-fit:cover; background:#fff; border:1px solid #c4c4c4;}
.vst .pp-ss-row .pg-sicon{width:26px; height:26px; object-fit:contain; margin:0 auto; display:block; border-radius:0; border:0;}
.vst .pp-ss-row .ico{display:flex; align-items:center; justify-content:center; width:30px; height:30px; border-radius:50%; background:#e9ecef; color:#2b2f36; font-size:13px;}
.vst .pp-ss-row .tx{min-width:0; line-height:1.2;}
.vst .pp-ss-row .tx b{display:block; font-size:13px; font-weight:800; color:#000; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.vst .pp-ss-row .tx b mark{background:#ffe680; color:#000; padding:0 1px; margin:0; border-radius:2px; font:inherit; letter-spacing:inherit;}
.vst .pp-ss-row .tx small{display:flex; align-items:center; gap:4px; margin-top:5px; font-size:10px; font-weight:700; color:#333; white-space:nowrap; overflow:hidden;}
.vst .pp-ss-row .tx small .chip{display:inline-block; padding:1px 6px; border-radius:3px; border:1px solid #cfd5de; background:#f7f7f7; color:#222; font-style:normal; font-size:9px; font-weight:800; letter-spacing:.04em;}
.vst .pp-ss-row .tx small .chip.today{background:#edf8e3; border-color:#b9dba0; color:var(--green);}
.vst .pp-ss-row .tx small .chip.hot{background:#fff3b0; border-color:#e0c35a; color:#000;}
.vst .pp-ss-row .tx small .chip.live{background:#2b2f36; border-color:#2b2f36; color:#fff;}
.vst .pp-ss-row{padding:8px 12px;}
.vst .pp-ss-row .tx b{font-size:14px;}
.vst .pp-ss-row .ct{display:flex; flex-direction:column; align-items:center; justify-content:center; width:58px; height:34px; border-radius:4px; background:#2b2f36; color:#fff; line-height:1; white-space:nowrap;}
.vst .pp-ss-row .ct b{font-size:14px; font-weight:800; font-variant-numeric:tabular-nums;}
.vst .pp-ss-row .ct small{margin-top:2px; font-size:8px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:#cfd5de;}
.vst .pp-ss-row.is-on .ct,.vst .pp-ss-row:hover .ct{background:#000;}
.vst .pp-ss-row.all{grid-template-columns:34px 1fr; background:#fff;}
.vst .pp-ss-row.all .ico{background:var(--red); color:#fff;}
.vst .pp-ss-row.all .tx b{color:var(--red);}
.vst .pp-ss-empty{padding:12px; font-size:12px; font-weight:700; color:#333; background:#fff; border:1px solid #c4c4c4; border-radius:6px;}
.vst .pp-ssearch .pp-rank{margin:0 4px 0 0;}
@media (max-width:767px){ .vst .pp-ssearch{top:0; width:100%; height:100vh; max-height:100vh; border-radius:0;} .vst .pp-ssearch-drop{max-height:calc(100vh - 190px);} .vst .pp-ssearch-n{display:none;} .vst .pp-ssearch-box{height:50px;} .vst .pp-ssearch-chip kbd{display:none;} }

.vst .pp-ss-row.recent{grid-template-columns:34px 1fr;}

.vst .pp-ssearch-foot{flex:0 0 auto; border-top:1px solid #c4c4c4; background:#fff; box-shadow:0 -4px 12px rgba(0,0,0,.08);}
.vst .pp-ssearch-foot[hidden]{display:none;}
.vst .pp-ssearch-foot .pp-ss-row{padding:9px 14px;}

/* chip numbers in fixed-width digits so a changing count does not shift the row */
.vst .pp-homehs .hs b{font-variant-numeric:tabular-nums; min-width:2ch; text-align:center;}