/* v16 PREVIEW: 8-bit x DraftKings. html.pxA = subtle (DK layout + pixel accents), html.pxB = full retro. Font: MR Pixel = Coder 2's 3x5 replay glyphs as a TTF (bundled). */
@font-face{font-family:"MR Pixel";src:url(mrpixel.ttf) format("truetype");font-display:block}
html.pxA,html.pxB{--px:"MR Pixel",ui-monospace,monospace;--step:polygon(0 4px,2px 4px,2px 2px,4px 2px,4px 0,calc(100% - 4px) 0,calc(100% - 4px) 2px,calc(100% - 2px) 2px,calc(100% - 2px) 4px,100% 4px,100% calc(100% - 4px),calc(100% - 2px) calc(100% - 4px),calc(100% - 2px) calc(100% - 2px),calc(100% - 4px) calc(100% - 2px),calc(100% - 4px) 100%,4px 100%,4px calc(100% - 2px),2px calc(100% - 2px),2px calc(100% - 4px),0 calc(100% - 4px))}
/* ---- shared pixel accents (A and B) ---- */
html.pxA #mHead .brand,html.pxB #mHead .brand{font:400 21px var(--px);letter-spacing:1px;text-transform:uppercase}
html.pxA h2.sec,html.pxA .kh,html.pxA .lvCard h4,html.pxA .ev .evh,html.pxB h2.sec,html.pxB .kh,html.pxB .lvCard h4,html.pxB .ev .evh{font:400 14px var(--px);letter-spacing:1px;color:#8c8c8c}
html.pxA .ob b,html.pxB .ob b{font:400 14px var(--px);letter-spacing:.5px}
html.pxA .ob i,html.pxB .ob i{font:400 14px var(--px)}
html.pxA .ob em,html.pxB .ob em{font:400 7px var(--px);line-height:10px}
html.pxA .ev .evr .sc,html.pxA .tvSc,html.pxA .score,html.pxA .win .p,html.pxA .prog .big,html.pxA .erow .edge,html.pxA .tvWPn b,html.pxA .tvClk b,html.pxA .tclvbig b,html.pxA .brec b,
html.pxB .ev .evr .sc,html.pxB .tvSc,html.pxB .score,html.pxB .win .p,html.pxB .prog .big,html.pxB .erow .edge,html.pxB .tvWPn b,html.pxB .tvClk b,html.pxB .tclvbig b,html.pxB .brec b{font-family:var(--px)!important;font-weight:400!important;letter-spacing:1px}
html.pxA .ev .evr .sc,html.pxB .ev .evr .sc{font-size:21px}
html.pxA .tvWPn b,html.pxB .tvWPn b{font-size:28px}
/* team badges: pixel font, stepped corners, 2px inner bevel like the replay sprites */
html.pxA .badge,html.pxA .tvBadge,html.pxB .badge,html.pxB .tvBadge{border-radius:0!important;clip-path:var(--step);font-family:var(--px)!important;font-weight:400!important;font-size:14px!important;letter-spacing:1px;box-shadow:inset 0 -3px 0 rgba(0,0,0,.35),inset 0 2px 0 rgba(255,255,255,.22)!important}
html.pxA .ev .evr .badge,html.pxB .ev .evr .badge{width:34px;height:28px;font-size:7px!important}
html.pxA .tvBadge.lg,html.pxB .tvBadge.lg{font-size:21px!important}
html.pxA .ev .evr .badge,html.pxB .ev .evr .badge{font-size:14px!important;width:38px}
/* cards: square, 2px borders, stepped corners */
html.pxA .card,html.pxA .group,html.pxA .lvCard,html.pxA .gcard,html.pxA .tvBug,html.pxB .card,html.pxB .group,html.pxB .lvCard,html.pxB .gcard,html.pxB .tvBug{border-radius:0!important;border:2px solid #2c2c2c!important;clip-path:var(--step)}
/* odds: chunky pixel buttons with a press state */
html.pxA .ob,html.pxB .ob{border-radius:0;border:2px solid #3a3a3a;background:#262626;box-shadow:inset 0 -3px 0 #151515,inset 0 2px 0 #333;clip-path:var(--step);transition:transform .05s}
html.pxA .ob:active,html.pxB .ob:active,html.pxA .ob.press,html.pxB .ob.press{transform:translateY(2px);box-shadow:inset 0 2px 0 #151515;background:#202020}
html.pxA .ob.pk,html.pxB .ob.pk{border-color:var(--g);background:#14280f;box-shadow:inset 0 -3px 0 #0d1a09,inset 0 0 0 2px rgba(83,211,55,.35)}
/* nav chips: square pixel chips + 8-bit icons */
html.pxA #mTabs button,html.pxB #mTabs button{border-radius:0;clip-path:var(--step);gap:6px;padding:0 12px}
html.pxA #mTabs button .pxi,html.pxB #mTabs button .pxi{display:inline-block;width:16px;height:16px;flex:0 0 16px}
.pxi svg{display:block!important;width:16px;height:16px;shape-rendering:crispEdges}
html.pxA #mTabs button.on,html.pxB #mTabs button.on{box-shadow:inset 0 -3px 0 #2f7f1f}
/* pills, segmented controls, buttons */
html.pxA .pill,html.pxA .bchip,html.pxA .tvTag,html.pxA .lvTier,html.pxB .pill,html.pxB .bchip,html.pxB .tvTag,html.pxB .lvTier{border-radius:0!important;clip-path:var(--step);font-family:var(--px)!important;font-weight:400!important;font-size:7px!important;letter-spacing:1px;padding:3px 6px}
html.pxA .lvTier,html.pxB .lvTier{font-size:14px!important;padding:2px 6px}
html.pxA .seg,html.pxA .seg button,html.pxA .pchips button,html.pxA .tfilt button,html.pxA .lvG,html.pxA .lvBtn,html.pxA .runbtn,html.pxA .btn2,
html.pxB .seg,html.pxB .seg button,html.pxB .pchips button,html.pxB .tfilt button,html.pxB .lvG,html.pxB .lvBtn,html.pxB .runbtn,html.pxB .btn2{border-radius:0!important;clip-path:var(--step)}
html.pxA .runbtn,html.pxA .lvBtn,html.pxB .runbtn,html.pxB .lvBtn{font-family:var(--px)!important;font-weight:400!important;letter-spacing:1px;box-shadow:inset 0 -4px 0 #2f7f1f}
html.pxA .runbtn,html.pxB .runbtn{font-size:21px!important}html.pxA .lvBtn,html.pxB .lvBtn{font-size:14px}
html.pxA .runbtn:active,html.pxB .runbtn:active,html.pxA .lvBtn:active,html.pxB .lvBtn:active{transform:translateY(2px);box-shadow:none}
/* pixel progress bars: square, stepped blocks */
html.pxA .lvBar,html.pxA .bar,html.pxA .wbar,html.pxA .mkbar,html.pxA .bbar .trk,html.pxB .lvBar,html.pxB .bar,html.pxB .wbar,html.pxB .mkbar,html.pxB .bbar .trk{border-radius:0!important;image-rendering:pixelated;position:relative}
html.pxA .lvBar,html.pxB .lvBar{height:18px;border:2px solid #000;box-shadow:0 0 0 2px #333}
html.pxA .lvBar::after,html.pxA .bar::after,html.pxA .wbar::after,html.pxB .lvBar::after,html.pxB .bar::after,html.pxB .wbar::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 6px,rgba(0,0,0,.55) 6px 8px);pointer-events:none}
html.pxA .lvBar i,html.pxA .bar i,html.pxB .lvBar i,html.pxB .bar i{border-radius:0!important;box-shadow:inset 0 3px 0 rgba(255,255,255,.25),inset 0 -3px 0 rgba(0,0,0,.25)}
html.pxA .lvLeg b,html.pxB .lvLeg b{font-family:var(--px);font-weight:400}
html.pxA .tvWPc polyline,html.pxB .tvWPc polyline{shape-rendering:crispEdges;stroke-width:3}
html.pxA .tvTO i,html.pxB .tvTO i{border-radius:0;height:4px}
html.pxA .tvDD,html.pxB .tvDD{font-family:var(--px);font-weight:400;font-size:14px;letter-spacing:1px}
html.pxA .tvDD.rz,html.pxB .tvDD.rz{border-radius:0;clip-path:var(--step)}
html.pxA #tvField,html.pxA #tv8,html.pxB #tvField,html.pxB #tv8{border-radius:0}
/* ---- B: full retro ---- */
html.pxB{--bg:#07090a;--card:#121614}
html.pxB body{background:#07090a radial-gradient(circle at 1px 1px,#141a16 1px,transparent 1.5px) 0 0/6px 6px}
html.pxB #mTabs button{font:400 14px var(--px);letter-spacing:1px;text-transform:uppercase;height:36px}
html.pxB #mTabs{background:#07090a;border-bottom:2px solid #1f2a1d}
html.pxB #mHead{background:#07090a;border-bottom:2px solid #1f2a1d}
html.pxB #mHead .brand{color:var(--g);text-shadow:2px 2px 0 #1b4a12}
html.pxB .ev .evr .nm,html.pxB .hero .side .nm,html.pxB .tvNm,html.pxB .ev .evt{font-family:var(--px)!important;font-weight:400!important;font-size:14px!important;letter-spacing:1px;text-transform:uppercase}
html.pxB .ev .evt{font-size:7px!important;color:#7a8a76}
html.pxB .card,html.pxB .group,html.pxB .lvCard,html.pxB .gcard,html.pxB .tvBug{border-color:#25331f!important;background:#101410!important;box-shadow:inset 0 0 0 2px #0a0d09}
html.pxB .ob{background:#18201a;border-color:#2c3a29}
html.pxB h2.sec,html.pxB .kh,html.pxB .lvCard h4,html.pxB .ev .evh{color:var(--g)}
html.pxB .seg button,html.pxB .pchips button,html.pxB .tfilt button{font:400 14px var(--px)!important;letter-spacing:1px;text-transform:uppercase}
/* CRT scanlines (subtle, B only; off with ?crt=0) */
html.pxB.crt body::after{content:"";position:fixed;inset:0;z-index:9999;pointer-events:none;background:repeating-linear-gradient(180deg,rgba(0,0,0,0) 0 2px,rgba(0,0,0,.16) 2px 3px);mix-blend-mode:multiply}
html.pxB.crt body::before{content:"";position:fixed;inset:0;z-index:9998;pointer-events:none;box-shadow:inset 0 0 90px rgba(0,0,0,.55)}
/* v16 fixes: Pixelify Sans (OFL 1.1, bundled locally) for words; MR Pixel (replay 3x5) for numbers, odds, badges */
@font-face{font-family:"Pixelify";src:url(pixelify.ttf) format("truetype");font-weight:100 900;font-display:block}
html.pxA,html.pxB{--pxw:"Pixelify",var(--sans)}
html.pxA #mHead .brand,html.pxB #mHead .brand{font:700 24px var(--pxw);letter-spacing:.5px;text-transform:lowercase}
html.pxA h2.sec,html.pxA .kh,html.pxA .lvCard h4,html.pxA .ev .evh,html.pxB h2.sec,html.pxB .kh,html.pxB .lvCard h4,html.pxB .ev .evh{font:600 13px var(--pxw);letter-spacing:1.2px;text-transform:uppercase}
html.pxA #mTabs button .pxi svg,html.pxB #mTabs button .pxi svg{width:16px!important;height:16px!important;margin:0!important}
html.pxA #mTabs button,html.pxB #mTabs button{display:flex;align-items:center;flex-direction:row}
html.pxA .pill,html.pxA .bchip,html.pxA .tvTag,html.pxB .pill,html.pxB .bchip,html.pxB .tvTag{font:600 11px var(--pxw)!important;letter-spacing:.6px;text-transform:uppercase}
html.pxB #mTabs button{font:600 15px var(--pxw);letter-spacing:.6px;text-transform:uppercase}
html.pxB .ev .evr .nm,html.pxB .hero .side .nm,html.pxB .tvNm{font:600 16px var(--pxw)!important;letter-spacing:.4px;text-transform:uppercase}
html.pxB .ev .evt{font:500 12px var(--pxw)!important;letter-spacing:.3px;text-transform:none;color:#8a9a86}
html.pxB .seg button,html.pxB .pchips button,html.pxB .tfilt button{font:600 14px var(--pxw)!important;letter-spacing:.5px}
html.pxA .runbtn,html.pxB .runbtn,html.pxA .lvBtn,html.pxB .lvBtn{font-family:var(--pxw)!important;font-weight:700!important;text-transform:uppercase}
html.pxB .lvCard,html.pxB .tv{font-family:var(--sans)}
html.pxA #mTabs button .pxi~svg,html.pxB #mTabs button .pxi~svg{display:none!important}
html.pxB .ev .evt{font:600 12px var(--sans)!important;color:#8a9a86}
html.pxA h2.sec,html.pxA .kh,html.pxA .lvCard h4,html.pxB h2.sec,html.pxB .kh,html.pxB .lvCard h4{font-size:15px!important;font-weight:500!important;letter-spacing:.8px}
/* ===== v16 final polish ===== */
html.pxA,html.pxB{--px:"MR Pixel","Pixelify",ui-monospace,monospace}
/* words in caps -> Pixelify (readable); MR Pixel only for numbers, odds and team abbreviations */
html.pxA .tvDD,html.pxB .tvDD,html.pxA .lvLeg b,html.pxB .lvLeg b,html.pxA .ob em,html.pxB .ob em,html.pxA .lvTier,html.pxB .lvTier{font-family:var(--pxw)!important;font-weight:600!important;letter-spacing:.4px}
html.pxA .ob em,html.pxB .ob em{font-size:9px!important;line-height:11px}
html.pxA .tvDD,html.pxB .tvDD{font-size:14px}
html.pxA .lvTier,html.pxB .lvTier{font-size:12px!important}
/* tap targets >= 44px */
html.pxB #mTabs button,html.pxA #mTabs button{height:44px;min-height:44px}
html.pxA,html.pxB{--ch:54px}
html.pxA .seg button,html.pxB .seg button,html.pxA .pchips button,html.pxB .pchips button,html.pxA .tfilt button,html.pxB .tfilt button,html.pxA .lvBtn,html.pxB .lvBtn,html.pxA .lvG,html.pxB .lvG,html.pxA .hbtn,html.pxB .hbtn{min-height:44px}
html.pxA .ob,html.pxB .ob{min-height:46px}
/* scanlines lighter so muted text keeps >= 4.5:1 */
html.pxB.crt body::after{background:repeating-linear-gradient(180deg,rgba(0,0,0,0) 0 2px,rgba(0,0,0,.12) 2px 3px)}
html.pxB .ev .evt{color:#9aaa96!important}
/* Pixelify MR: static instance with clear 5 and C; never faux-bold (it turns 2/3/5 into 8) */
html.pxA,html.pxB{font-synthesis:none}
/* WebKit still faux-bolds a static face: pin every Pixelify use to its real weight */
html.pxA .tvDD,html.pxB .tvDD,html.pxA .lvLeg b,html.pxB .lvLeg b,html.pxA .ob em,html.pxB .ob em,html.pxA .lvTier,html.pxB .lvTier,html.pxA .runbtn,html.pxB .runbtn,html.pxA .lvBtn,html.pxB .lvBtn,
html.pxA .pill,html.pxB .pill,html.pxA .bchip,html.pxB .bchip,html.pxA .tvTag,html.pxB .tvTag,html.pxA #mHead .brand,html.pxB #mHead .brand,html.pxA h2.sec,html.pxB h2.sec,html.pxA .kh,html.pxB .kh,html.pxA .lvCard h4,html.pxB .lvCard h4,html.pxA .ev .evh,html.pxB .ev .evh,
html.pxB #mTabs button,html.pxB .ev .evr .nm,html.pxB .hero .side .nm,html.pxB .tvNm,html.pxB .seg button,html.pxB .pchips button,html.pxB .tfilt button{font-weight:500!important}
/* desktop app sidebar (desk layer) in B */
html.desk.pxB #mTabs::before{content:'honest_bets';font:500 22px var(--pxw);letter-spacing:.5px;color:var(--g);text-shadow:2px 2px 0 #1b4a12}
html.desk.pxB #mTabs{border-right:2px solid #1f2a1d}
html.desk.pxB #mTabs button kbd{font-family:var(--px);font-size:14px}