/* Lobby v2 — category-based navigation, dense poster grids, live rails, effects (Fable, 2026-09-27).
   Shared base: every colour is a brand token; the brand overlay decides the palette (wincricket = night by default).
   Spec: docs/operations/casino-lobby-redesign-2026-09-27.md */
:root{--lv2-gap:6px;--lv2-gutter:16px;--lv2-radius:10px;--lv2-tile-radius:8px;--lv2-accent:var(--brand);--lv2-accent-ink:var(--brand-ink);
 --lv2-glow:color-mix(in srgb,var(--brand) 55%,transparent);--lv2-card:var(--surface-2);--lv2-card-2:var(--surface-3);--lv2-hair:var(--line);
 --lv2-ease:cubic-bezier(.2,.8,.2,1);--lv2-art-grad:linear-gradient(135deg,color-mix(in srgb,var(--board-alt,#2A0746) 70%,#000),var(--board,#37095B))}
@media(max-width:760px){:root{--lv2-gutter:12px}}
/* compact.css pads .main 9px at ≤370: a 12 px bleed pushed every rail 3 px past the screen (WebKit scrolled the page sideways) */
@media(max-width:370px){:root{--lv2-gutter:9px}}
@media(prefers-reduced-motion:reduce){:root{--lv2-motion:0}}

/* ---------- page transition + reveal ---------- */
.main.lv2-page-in{animation:lv2PageIn .32s var(--lv2-ease) both}
@keyframes lv2PageIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.lv2-reveal{opacity:0;transform:translateY(14px);transition:opacity .5s var(--lv2-ease),transform .5s var(--lv2-ease)}
.lv2-reveal.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.main.lv2-page-in{animation:none}.lv2-reveal{opacity:1;transform:none;transition:none}}

/* ---------- hero rail ---------- */
.lv2-hero{margin:10px calc(-1*var(--lv2-gutter)) 6px;padding:0 var(--lv2-gutter);display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.lv2-hero::-webkit-scrollbar{display:none}
.lv2-hero-card{position:relative;flex:0 0 calc(100% - 28px);aspect-ratio:2.2/1;border-radius:14px;overflow:hidden;scroll-snap-align:start;isolation:isolate;
 background:linear-gradient(120deg,var(--board-alt,#2A0746) 0%,var(--board,#37095B) 55%,color-mix(in srgb,var(--board,#37095B) 72%,var(--brand,#F7D22A)) 100%);color:#fff;text-decoration:none;box-shadow:0 12px 30px -14px var(--lv2-glow);border:1px solid color-mix(in srgb,var(--brand) 22%,transparent)}
.lv2-hero-card>img{position:absolute;right:-6%;top:-8%;height:124%;width:auto;object-fit:cover;filter:drop-shadow(0 10px 24px rgba(0,0,0,.45));transition:transform .8s var(--lv2-ease);z-index:1}
.lv2-hero-card:hover>img{transform:scale(1.04) rotate(-1deg)}
.lv2-hero-card>.lv2-hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(6,7,14,.74) 0%,rgba(6,7,14,.38) 48%,rgba(6,7,14,0) 72%);z-index:2}
.lv2-hero-card::before{content:"";position:absolute;inset:-40%;z-index:0;background:conic-gradient(from 180deg at 50% 50%,transparent 0deg,color-mix(in srgb,var(--brand) 22%,transparent) 60deg,transparent 120deg,rgba(120,60,200,.25) 200deg,transparent 260deg,color-mix(in srgb,var(--brand) 16%,transparent) 320deg,transparent 360deg);animation:lv2Aurora 18s linear infinite;animation-delay:var(--lv2-ta,0s);opacity:.55;filter:blur(28px)}
@keyframes lv2Aurora{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.lv2-hero-card::before{animation:none}}
.lv2-hero-copy{position:absolute;inset:0;z-index:3;display:flex;flex-direction:column;justify-content:flex-end;gap:6px;padding:16px 18px}
.lv2-hero-copy .lv2-eyebrow{color:var(--brand)}
.lv2-hero-copy h2{margin:0;font-size:22px;line-height:1.05;font-weight:850;letter-spacing:-.3px;max-width:62%;text-wrap:balance}
.lv2-hero-copy p{margin:0;font-size:12px;line-height:1.35;color:rgba(255,255,255,.82);max-width:62%}
.lv2-hero-cta{position:relative;overflow:hidden;display:inline-flex;align-items:center;gap:6px;align-self:flex-start;margin-top:4px;padding:9px 13px;border-radius:999px;background:var(--brand);color:var(--brand-ink);font-weight:800;font-size:12px;letter-spacing:.2px;box-shadow:0 6px 18px -6px var(--brand)}
.lv2-hero-cta::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.55) 50%,transparent 65%);transform:translateX(-130%);animation:lv2CtaSheen 6s ease-in-out infinite;animation-delay:var(--lv2-ts,0s)}
@keyframes lv2CtaSheen{0%,70%{transform:translateX(-130%)}85%,100%{transform:translateX(130%)}}
@media(prefers-reduced-motion:reduce){.lv2-hero-cta::after{animation:none}}
.lv2-hero-cta .icon{width:12px;height:12px}
.lv2-hero-dots{display:flex;justify-content:center;gap:5px;margin:8px 0 2px}
.lv2-hero-dots i{width:6px;height:6px;border-radius:3px;background:var(--border);transition:width .25s var(--lv2-ease),background .25s}
.lv2-hero-dots i.on{width:18px;background:var(--brand)}
/* gold particle field */
.lv2-particles{position:absolute;inset:0;z-index:2;pointer-events:none;overflow:hidden}
.lv2-particles i{position:absolute;bottom:-10px;width:var(--s,5px);height:var(--s,5px);border-radius:50%;background:radial-gradient(circle,#fffbe6 0,var(--brand) 40%,transparent 70%);box-shadow:0 0 8px 2px color-mix(in srgb,var(--brand) 60%,transparent);opacity:0;left:var(--x,50%);
 animation:lv2Rise var(--d,7s) linear infinite;animation-delay:var(--dl,0s)}
@keyframes lv2Rise{0%{transform:translate3d(0,0,0) scale(.5);opacity:0}10%{opacity:.95}55%{opacity:.7}100%{transform:translate3d(var(--dx,10px),-210px,0) scale(1.2);opacity:0}}
@media(prefers-reduced-motion:reduce){.lv2-particles{display:none}}

/* ---------- category navigation (sticky rail) ---------- */
.lv2-catnav{position:sticky;top:calc(var(--header,58px) - 1px);z-index:30;margin:6px calc(-1*var(--lv2-gutter)) 4px;padding:8px var(--lv2-gutter) 6px;
 background:var(--wc-catnav-bg,color-mix(in srgb,var(--bg) 84%,transparent));backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3);border-bottom:1px solid var(--lv2-hair);
 mask-image:linear-gradient(90deg,transparent 0,#000 12px,#000 calc(100% - 12px),transparent 100%);-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 12px,#000 calc(100% - 12px),transparent 100%)}
.lv2-catnav-track{display:flex;gap:6px;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none;padding:2px 0 4px}
.lv2-catnav-track::-webkit-scrollbar{display:none}
.lv2-cat{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;gap:5px;width:66px;padding:4px 2px 2px;border:0;background:none;color:var(--dim);font:inherit;cursor:pointer;scroll-snap-align:start;border-radius:12px;transition:transform .18s var(--lv2-ease)}
.lv2-cat:active{transform:scale(.94)}
.lv2-cat>span.lv2-cat-art{position:relative;width:60px;height:60px;border-radius:14px;overflow:hidden;background:var(--lv2-art-grad);box-shadow:inset 0 0 0 1px rgba(255,255,255,.06),0 6px 14px -8px rgba(0,0,0,.6);transition:box-shadow .25s var(--lv2-ease),transform .25s var(--lv2-ease)}
.lv2-cat>span.lv2-cat-art>img{display:block;width:100%;height:100%;object-fit:cover;position:relative;z-index:1}
.lv2-cat>span.lv2-cat-art>img.lv2-noart,.lv2-card>img.lv2-noart{display:none}
.lv2-cat>span.lv2-cat-art>.icon{position:absolute;inset:0;margin:auto;width:22px;height:22px;color:var(--brand)}
/* Fable 2026-09-29 (icons v2): the tile is 60 px on the phone too (the rail scrolls; the art is drawn for >= 56 px), the
   fallback glyph stays hidden under art (it showed through the transparent icons) and returns if the art fails, and the
   Live dot sits above the art */
.lv2-cat>span.lv2-cat-art:has(>img:not(.lv2-noart))>.icon{display:none}
.lv2-cat>b{font-size:11px;font-weight:700;letter-spacing:.1px;line-height:var(--wc-cat-label-line-height,normal);white-space:var(--wc-cat-label-white-space,nowrap);width:var(--wc-cat-label-width,auto);max-width:var(--wc-cat-label-max,66px);min-height:var(--wc-cat-label-min-height,auto);overflow:var(--wc-cat-label-overflow,hidden);text-overflow:var(--wc-cat-label-text-overflow,ellipsis);text-align:center}
.lv2-cat-tail{display:var(--wc-cat-label-tail-display,inline);white-space:var(--wc-cat-label-tail-space,normal)}
.lv2-cat>b>small,.lv2-cat-tail>small{display:inline-block;margin-left:var(--wc-cat-badge-gap,3px);padding:0 4px;border-radius:6px;background:var(--control);color:var(--faint);font-size:11px;font-weight:700;line-height:14px;vertical-align:1px}
:root:not([data-theme="dark"]) :is(.lv2-cat>b>small,.lv2-cat-tail>small){color:var(--dim)}   /* light: --faint on --control is 4.15-4.49 : 1 (contrast sweep); --dim ~7.4 */
.lv2-cat.active{color:var(--text)}
.lv2-cat.active>span.lv2-cat-art{box-shadow:0 0 0 2px var(--brand),0 0 22px -4px var(--brand);transform:translateY(-2px)}
.lv2-cat.active>b{color:var(--brand)}
.lv2-cat.is-live>span.lv2-cat-art::after{content:"";position:absolute;z-index:2;top:5px;right:5px;width:7px;height:7px;border-radius:50%;background:#FF4D4D;box-shadow:0 0 0 2px var(--bg);animation:lv2Pulse 1.6s ease-in-out infinite}
@keyframes lv2Pulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.35);opacity:.65}}

/* ---------- section header + segmented control ---------- */
.lv2-sec{margin:14px 0 0}
.lv2-sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;margin:0 0 9px}
.lv2-sec-head>div{min-width:0}
.lv2-eyebrow{display:block;font-size:10px;font-weight:800;letter-spacing:1.6px;text-transform:uppercase;color:var(--brand);margin-bottom:2px}
.lv2-sec-head h2{margin:0;font-size:21px;line-height:1.05;font-weight:850;letter-spacing:-.3px;display:flex;align-items:center;gap:8px}
.lv2-sec-head h2>small{font-size:11px;font-weight:700;color:var(--faint);padding:2px 7px;border-radius:999px;background:var(--control);letter-spacing:.2px}
.lv2-sec-link{display:inline-flex;align-items:center;gap:4px;font-size:11.5px;font-weight:800;color:var(--dim);text-decoration:none;white-space:nowrap;padding:6px 0}
.lv2-sec-link .icon{width:11px;height:11px}
.lv2-seg{display:inline-flex;padding:3px;border-radius:999px;background:var(--control);border:1px solid var(--lv2-hair);gap:2px}
.lv2-seg>button{border:0;background:none;color:var(--faint);font:inherit;font-size:11px;font-weight:800;padding:5px 11px;border-radius:999px;cursor:pointer;transition:background .2s,color .2s}
.lv2-seg>button.active{background:var(--brand);color:var(--brand-ink);box-shadow:0 4px 12px -6px var(--brand)}
.lv2-seg>button:disabled{opacity:.6;cursor:default}

/* ---------- dense 5-per-row poster grid ---------- */
.lv2-grid5{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--lv2-gap)}
.lv2-grid5 .game-card{min-width:0;margin:0}
.lv2-grid5 .game-card .game-caption,.lv2-grid5 .game-card .game-paysheet{display:none}
.lv2-grid5 .game-art{aspect-ratio:2/3;border-radius:var(--lv2-tile-radius);border:1px solid var(--lv2-hair);background:var(--lv2-card);box-shadow:0 4px 10px -6px rgba(0,0,0,.5);overflow:hidden;isolation:isolate;position:relative;transition:transform .18s var(--lv2-ease),box-shadow .25s var(--lv2-ease)}
.lv2-grid5 .game-art img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s var(--lv2-ease)}
.lv2-grid5 .game-card:hover .game-art{transform:translateY(-3px);box-shadow:0 12px 22px -10px rgba(0,0,0,.6),0 0 0 1px color-mix(in srgb,var(--brand) 50%,transparent)}
.lv2-grid5 .game-card:hover .game-art img{transform:scale(1.06)}
.lv2-grid5 .game-card:active .game-art{transform:scale(.96);box-shadow:0 0 0 2px var(--brand)}
.lv2-grid5 .game-preview-badge{top:4px;left:4px;padding:3px 5px;font-size:10px;text-transform:uppercase;border-radius:3px}
.lv2-grid5 .lv2-badge{position:absolute;top:4px;left:4px;z-index:3;padding:3px 5px;border-radius:3px;font-size:10px;font-weight:900;letter-spacing:.8px;text-transform:uppercase;line-height:1;color:var(--brand-ink);background:var(--brand);pointer-events:none}
.lv2-grid5 .lv2-badge.live{background:#FF3B3B;color:#fff}
.lv2-grid5 .game-art .game-art-word{font-size:11px}
/* tile "play" shimmer on hover (desktop) */
.lv2-grid5 .game-art::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.22) 50%,transparent 70%);transform:translateX(-120%);z-index:2;pointer-events:none}
.lv2-grid5 .game-card:hover .game-art::after{animation:lv2Sheen .9s var(--lv2-ease) 1}
@keyframes lv2Sheen{to{transform:translateX(120%)}}
/* skeletons sized to the grid */
.lv2-grid5 .lv2-skel{aspect-ratio:2/3;border-radius:var(--lv2-tile-radius);background:linear-gradient(100deg,var(--lv2-card) 30%,var(--lv2-card-2) 50%,var(--lv2-card) 70%);background-size:220% 100%;animation:lv2Shimmer 1.2s linear infinite}
@keyframes lv2Shimmer{from{background-position:120% 0}to{background-position:-120% 0}}
/* the wins ticker's slot (wiring lane): layout-neutral, always present so the refresh patches it in place */
.lv2-wins-slot{display:contents}
/* continue playing (wiring lane): grid5's tile as a snap rail of 72 px posters */
.lv2-grid5.lv2-recent{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:72px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;margin:0 calc(-1*var(--lv2-gutter));padding:4px var(--lv2-gutter);scroll-padding-inline:var(--lv2-gutter)}
.lv2-grid5.lv2-recent::-webkit-scrollbar{display:none}
.lv2-grid5.lv2-recent .game-card{scroll-snap-align:start}
@media(min-width:761px){.lv2-grid5.lv2-recent{grid-template-columns:none;margin:0;padding:4px 0}.lv2-grid5.lv2-recent .game-card .game-caption{display:none}}
.lv2-more{display:flex;justify-content:center;margin:10px 0 0}
.lv2-more>button{min-height:38px;padding:0 18px;border-radius:999px;border:1px solid var(--lv2-hair);background:var(--surface);color:var(--text);font:inherit;font-size:12px;font-weight:800}

/* ---------- wins ticker (real, masked names; hidden when empty) ---------- */
.lv2-ticker{position:relative;display:flex;align-items:stretch;margin:12px calc(-1*var(--lv2-gutter)) 0;padding:0 0 0 0;overflow:hidden;border-top:1px solid var(--lv2-hair);border-bottom:1px solid var(--lv2-hair);background:color-mix(in srgb,var(--surface) 70%,transparent)}
.lv2-ticker:empty{display:none}
.lv2-ticker.is-wait{display:block;height:48px;box-sizing:border-box}
.lv2-ticker-label{position:relative;flex:none;z-index:2;display:flex;align-items:center;gap:6px;padding:0 26px 0 var(--lv2-gutter);background:linear-gradient(90deg,var(--bg) 78%,transparent);font-size:10px;font-weight:900;letter-spacing:1.4px;text-transform:uppercase;color:var(--brand)}
.lv2-ticker-label i{width:6px;height:6px;border-radius:50%;background:#FF4D4D;animation:lv2Pulse 1.4s infinite}
/* P06: the track starts beside the label (the view clips it), the first item at offset 0; the trailing 26 px = the gap, so -50% is
   exactly one set + one gap and the loop restarts on an item boundary */
.lv2-ticker-view{flex:1 1 auto;min-width:0;overflow:hidden}
.lv2-ticker-track{display:flex;gap:26px;width:max-content;padding:9px 26px 9px 0;animation:lv2Marquee var(--lv2-ticker-s,38s) linear infinite}
.lv2-ticker:hover .lv2-ticker-track,.lv2-ticker.paused .lv2-ticker-track,.lv2-ticker.is-off .lv2-ticker-track{animation-play-state:paused}
@keyframes lv2Marquee{to{transform:translateX(-50%)}}
.lv2-win{display:inline-flex;align-items:center;gap:8px;white-space:nowrap;font-size:11.5px;color:var(--dim)}
.lv2-win img{width:20px;height:28px;border-radius:4px;object-fit:cover;border:1px solid var(--lv2-hair)}
.lv2-win b{color:var(--text);font-weight:800}
.lv2-win em{font-style:normal;color:var(--positive,#7EE0A4);font-weight:900;text-shadow:0 0 12px color-mix(in srgb,var(--positive,#7EE0A4) 45%,transparent)}
.lv2-win small{color:var(--faint);font-size:11px}
@media(prefers-reduced-motion:reduce){.lv2-ticker-track{animation:none}}

/* card colour worlds (data-world, set by lobby-v2.js categoryCards; keep in step with CARD_WORLDS there) */
.lv2-card[data-world="cricket"]{--lv2-world:#1E7A46;--lv2-light:#7FE0A6}.lv2-card[data-world="football"]{--lv2-world:#2E8B3A;--lv2-light:#A6F09A}.lv2-card[data-world="tennis"]{--lv2-world:#7A8F1E;--lv2-light:#E6F27A}.lv2-card[data-world="basketball"]{--lv2-world:#C25A1E;--lv2-light:#FFC27A}
.lv2-card[data-world="table-tennis"]{--lv2-world:#1E5AA8;--lv2-light:#8FC4FF}.lv2-card[data-world="baseball"]{--lv2-world:#7A3E1E;--lv2-light:#F2C89A}.lv2-card[data-world="volleyball"]{--lv2-world:#C9A227;--lv2-light:#FFF0A6}.lv2-card[data-world="ice-hockey"]{--lv2-world:#1C6E9C;--lv2-light:#BFEBFF}
.lv2-card[data-world="rugby"]{--lv2-world:#3B5B1E;--lv2-light:#BEE39A}.lv2-card[data-world="darts"]{--lv2-world:#7A1E2E;--lv2-light:#FFB3B3}.lv2-card[data-world="futsal"]{--lv2-world:#1E6E5C;--lv2-light:#9AE8D6}.lv2-card[data-world="horse-racing"]{--lv2-world:#6E4A1E;--lv2-light:#F2D3A6}
.lv2-card[data-world="greyhounds"]{--lv2-world:#4A5E1E;--lv2-light:#D6F29A}.lv2-card[data-world="kabaddi"]{--lv2-world:#A0501E;--lv2-light:#FFCF9A}.lv2-card[data-world="badminton"]{--lv2-world:#1E7A7A;--lv2-light:#9AF2F2}.lv2-card[data-world="mma"]{--lv2-world:#7A1E1E;--lv2-light:#FFA3A3}
.lv2-card[data-world="all-sports"]{--lv2-world:#37095B;--lv2-light:#F7D22A}.lv2-card[data-world="slots"]{--lv2-world:#C2172F;--lv2-light:#FFB347}.lv2-card[data-world="originals"]{--lv2-world:#6A2BD9;--lv2-light:#C7A4FF}.lv2-card[data-world="live-casino"]{--lv2-world:#0E6B45;--lv2-light:#F2D06B}
.lv2-card[data-world="teen-patti"]{--lv2-world:#8A1E3B;--lv2-light:#FFB3C6}.lv2-card[data-world="roulette"]{--lv2-world:#1E5E3B;--lv2-light:#F2D06B}.lv2-card[data-world="crash"]{--lv2-world:#B03A1E;--lv2-light:#FFC27A}

/* ---------- live rail (sports) ---------- */
.lv2-live-rail{display:flex;gap:8px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin:0 calc(-1*var(--lv2-gutter));padding:2px var(--lv2-gutter) 6px}
.lv2-live-rail::-webkit-scrollbar{display:none}
.lv2-live-card{flex:0 0 78%;scroll-snap-align:start;border-radius:14px;border:1px solid var(--lv2-hair);background:var(--surface);padding:10px 12px 10px;display:flex;flex-direction:column;gap:8px;color:var(--text);text-decoration:none;box-shadow:0 8px 20px -14px rgba(0,0,0,.6)}
.lv2-live-top{display:flex;align-items:center;justify-content:space-between;font-size:11px;color:var(--faint);font-weight:700}
.lv2-live-top .icon{width:11px;height:11px;margin-right:4px;vertical-align:-1px}
.lv2-live-badge{color:#FF6B6B;font-weight:900;letter-spacing:1px;font-size:10px;text-transform:uppercase}
.lv2-live-badge::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:#FF4D4D;margin-right:5px;animation:lv2Pulse 1.6s infinite;vertical-align:1px}
.lv2-live-teams{display:grid;grid-template-columns:1fr auto;row-gap:5px;column-gap:8px;align-items:center}
.lv2-live-teams .team{display:flex;align-items:center;gap:8px;min-width:0;font-size:13px;font-weight:800}
.lv2-live-teams .team img{width:22px;height:22px;border-radius:50%;object-fit:cover;background:var(--control)}
.lv2-live-teams .team>span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lv2-live-teams .score{font-size:12px;font-weight:800;color:var(--dim);font-variant-numeric:tabular-nums;white-space:nowrap}
.lv2-odds{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.lv2-odds.n2{grid-template-columns:repeat(2,minmax(0,1fr))}
.lv2-odds.n1{grid-template-columns:1fr}
/* Odds pills (Fable's ruling 2026-09-29, docs/operations/wincricket-odds-pills-2026-09-29.md): the rails' prices are glass
   brand pills. Every value is a brand token (--wc-odd-*, --wc-up/--wc-down, the flash animation names, brand.css) with the
   previous look as its fallback. The label may take two lines; lobby-v2.js shortens only at a word boundary. */
.lv2-odd{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:44px;padding:5px 4px;border-radius:9px;background:var(--wc-odd-bg,var(--back));color:var(--wc-odd-price,var(--back-ink));box-shadow:inset 0 0 0 1px var(--wc-odd-rim,transparent),inset 0 1px 0 var(--wc-odd-hi,transparent);border:0;font:inherit;cursor:pointer;transition:transform .15s var(--lv2-ease),background .3s,box-shadow .2s}
.lv2-odd.lay{background:var(--lay);color:var(--lay-ink)}
.lv2-odd b{font-size:15px;font-weight:var(--wc-odd-weight,900);line-height:1;font-variant-numeric:tabular-nums}
.lv2-odd small{font-size:var(--wc-odd-label-size,11px);font-weight:var(--wc-odd-label-weight,inherit);color:var(--wc-odd-label,inherit);opacity:var(--wc-odd-label-alpha,.8);margin-top:3px;line-height:1.15;max-width:100%;text-align:center;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow-wrap:break-word}
@media(hover:hover){.lv2-odd:not(.is-readonly):hover{box-shadow:inset 0 0 0 1px var(--wc-odd-rim-hover,transparent),inset 0 1px 0 var(--wc-odd-hi,transparent)}}
.lv2-odd:not(.is-readonly):active,.lv2-odd.is-selected{background:var(--wc-odd-sel,var(--back));color:var(--wc-odd-sel-ink,var(--back-ink))}
.lv2-odd:not(.is-readonly):active small,.lv2-odd.is-selected small{color:inherit}
.lv2-odd:active{transform:scale(.95)}
.lv2-odd.flash-up{animation:var(--wc-pill-flash-up,lv2FlashUp) var(--wc-flash-ms,.45s) ease-out}
.lv2-odd.flash-down{animation:var(--wc-pill-flash-down,lv2FlashDown) var(--wc-flash-ms,.45s) ease-out}
@keyframes lv2FlashUp{0%{background:#22A45D;color:#fff}100%{}}
@keyframes lv2FlashDown{0%{background:#D9364C;color:#fff}100%{}}
/* the glass pill's movement: the rim only (owner 2026-10-14: the price ink stays white / near-black); a team stripe stays put */
@keyframes lv2PillUp{0%,20%{box-shadow:inset 3px 0 0 var(--tc,transparent),inset 0 0 0 2px var(--wc-up),inset 0 1px 0 var(--wc-odd-hi,transparent)}100%{}}
@keyframes lv2PillDown{0%,20%{box-shadow:inset 3px 0 0 var(--tc,transparent),inset 0 0 0 2px var(--wc-down),inset 0 1px 0 var(--wc-odd-hi,transparent)}100%{}}
/* generic price flash for the existing odds buttons (a BACK|LAY cell keeps its exchange colour: only its rim flashes) */
[data-action="odds"]:not(.lv2-odd).flash-up{animation:var(--wc-cell-flash-up,lv2FlashUp) var(--wc-flash-ms,.45s) ease-out}
[data-action="odds"]:not(.lv2-odd).flash-down{animation:var(--wc-cell-flash-down,lv2FlashDown) var(--wc-flash-ms,.45s) ease-out}
@keyframes lv2RimUp{0%,20%{box-shadow:inset 0 0 0 2px var(--wc-up),0 0 12px -3px var(--wc-up)}100%{}}
@keyframes lv2RimDown{0%,20%{box-shadow:inset 0 0 0 2px var(--wc-down),0 0 12px -3px var(--wc-down)}100%{}}

/* ---------- floating bet-slip pill ---------- */
.floating-slip{border-radius:999px;box-shadow:0 12px 30px -10px var(--brand),0 0 0 1px color-mix(in srgb,var(--brand) 40%,transparent);animation:lv2PopIn .35s var(--lv2-ease)}
@keyframes lv2PopIn{from{transform:translateY(20px) scale(.9);opacity:0}to{transform:none;opacity:1}}

/* ---------- bottom nav (category based) ---------- */
@media(max-width:760px){/* @lobby-v2 */.lv2-hero{margin-left:0;padding-left:0;gap:12px}.lv2-hero-card{flex-basis:100%}/* @/lobby-v2 */
 .product-nav{display:none!important}
 .main.route-home,.main.route-casino,.main.route-slots,.main.route-sports,.main.route-live,.main.route-event,.main.route-game,.main.route-saved,.main.route-bets,.main.route-wallet,.main.route-account,.main.route-support{padding-top:8px}
 /* the tab bar (lane wc-tabbar 2026-10-25; docs/design/wincricket-tabbar-2026-10-25/DESIGN.md §3): an opaque purple bar in both
    themes, one active language (a gold pill behind the icon, a gold label), true-colour icons, the live / open-bet badges, press
    feedback. app-insets.css keeps the bar's bottom, height, padding and layer (the inset contract): none of them is set here. */
 .mobile-nav{--wc-tab-bar:#37095B;background:var(--wc-tab-bar)!important;backdrop-filter:none;-webkit-backdrop-filter:none;border-top:1px solid #4A1478;box-shadow:0 -6px 20px rgba(55,9,91,.16)}
 [data-theme="dark"] .mobile-nav{--wc-tab-bar:#1B1030;border-top-color:#3A2A55;box-shadow:none}
 html .mobile-nav>a.wc-tab{gap:2px;height:48px;color:#D9C9EC;font-weight:650;background:none;transition:color .2s;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
 html .mobile-nav>a.wc-tab.active{color:#F7D22A;font-weight:800;background:none}
 html .mobile-nav>a.wc-tab::before{content:"";position:absolute;top:-1px;left:50%;z-index:-1;width:min(56px,calc(100% - 6px));height:30px;border-radius:15px;background:rgba(247,210,42,.16);box-shadow:inset 0 0 0 1px rgba(247,210,42,.55);opacity:0;transform:translateX(-50%) scale(.6);transition:opacity .18s,transform .22s var(--lv2-ease)}
 html .mobile-nav>a.wc-tab.active::before{opacity:1;transform:translateX(-50%)}
 html .mobile-nav>a.wc-tab.is-pressed::before{opacity:.6;transform:translateX(-50%) scale(.94)}
 html .mobile-nav>a.wc-tab.active.is-pressed::before{opacity:1;background:rgba(247,210,42,.28)}
 html .mobile-nav>a.wc-tab>.wc-tab-ico{width:24px;height:24px;opacity:.84;transition:transform .22s var(--lv2-ease),opacity .18s}
 html .mobile-nav>a.wc-tab.active>.wc-tab-ico{opacity:1;transform:translateY(-1px)}
 html .mobile-nav>a.wc-tab.is-pressed>.wc-tab-ico{transform:scale(.86)}
 html .mobile-nav>a.wc-tab>.wc-tab-l{line-height:16px;white-space:nowrap}
 html .mobile-nav>a.wc-tab>.wc-tab-badge{position:absolute;top:-2px;left:calc(50% + 4px);min-width:18px;height:18px;padding:0 5px;border-radius:9px;font-size:12px;line-height:18px;font-weight:800;font-style:normal;text-align:center;box-shadow:0 0 0 2px var(--wc-tab-bar);pointer-events:none}
 html .mobile-nav>a.wc-tab>.wc-tb-live{background:#E0123A;color:#FFFFFF}
 html .mobile-nav>a.wc-tab>.wc-tb-bets{background:#F7D22A;color:#06070E}
 :root.reduce-motion .mobile-nav>a.wc-tab::before,:root.reduce-motion .mobile-nav>a.wc-tab>.wc-tab-ico{transition:none}
 @media(prefers-reduced-motion:reduce){html .mobile-nav>a.wc-tab::before,html .mobile-nav>a.wc-tab>.wc-tab-ico{transition:none}}
 .casino-dock{display:none!important}
 body:has(.casino-dock) .main{padding-bottom:calc(var(--mobile-bottom-space,84px) + 4px)}
}

/* ---------- count-up numbers ---------- */
.lv2-num{font-variant-numeric:tabular-nums}

/* ---------- desktop ---------- */
@media(min-width:761px){
 .lv2-hero{margin:14px 0 8px;padding:0}
 .lv2-hero-card{flex:0 0 calc(50% - 5px);aspect-ratio:2.6/1}
 .lv2-hero-copy h2{font-size:28px}
 .lv2-catnav{position:static;margin:14px 0 6px;padding:0;background:none;backdrop-filter:none;border:0;mask-image:none;-webkit-mask-image:none}
 .lv2-cat{width:84px}.lv2-cat>span.lv2-cat-art{width:60px;height:60px;border-radius:16px}.lv2-cat>b{font-size:11px;max-width:84px}
 .lv2-grid5{grid-template-columns:repeat(auto-fill,minmax(132px,1fr));gap:12px 10px}
 .lv2-grid5 .game-card .game-caption{display:flex;opacity:0;transform:translateY(-4px);transition:opacity .2s,transform .2s}
 .lv2-grid5 .game-card:hover .game-caption{opacity:1;transform:none}
 .lv2-live-rail{margin:0;padding:2px 0 6px}.lv2-live-card{flex:0 0 340px}
 .lv2-sec-head h2{font-size:24px}
 .lv2-ticker{margin:14px 0 0;border-radius:12px;border:1px solid var(--lv2-hair)}
 .lv2-ticker-label{padding-left:14px}
}

/* ---------- upcoming + competitions (sports) ---------- */
.lv2-when{color:var(--brand);font-weight:800;font-size:11px;letter-spacing:.3px}
.lv2-up-card .score{display:none}
.lv2-comps{display:grid;grid-auto-flow:column;grid-template-rows:repeat(2,auto);gap:6px;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none;margin:0 calc(-1*var(--lv2-gutter));padding:0 var(--lv2-gutter) 4px}
.lv2-comps::-webkit-scrollbar{display:none}
@media(min-width:761px){.lv2-comps{display:flex;flex-wrap:wrap;margin:0;padding:0;overflow:visible}}
.lv2-comp{display:inline-flex;align-items:center;gap:7px;min-height:36px;white-space:nowrap;scroll-snap-align:start;padding:0 12px 0 10px;border-radius:999px;border:1px solid var(--lv2-hair);background:var(--surface);color:var(--text);font:inherit;font-size:11.5px;font-weight:800;cursor:pointer;transition:transform .15s var(--lv2-ease),border-color .2s}
.lv2-comp .icon{width:13px;height:13px;color:var(--brand)}
.lv2-comp>b{font-size:11px;font-weight:800;color:var(--faint);padding:2px 6px;border-radius:999px;background:var(--control)}
.lv2-comp>b>i{display:inline-block;width:5px;height:5px;border-radius:50%;background:#FF4D4D;margin-right:4px;vertical-align:1px;animation:lv2Pulse 1.6s infinite}
.lv2-comp:hover{border-color:var(--brand)}.lv2-comp:active{transform:scale(.96)}
/* masthead My bets (logged in) */
.header-bets{position:relative;display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:10px;color:var(--dim);border:1px solid var(--lv2-hair);background:var(--surface)}
.header-bets .icon{width:18px;height:18px}
.header-bets.active{color:var(--brand);border-color:var(--brand)}
.header-bets .nav-count{position:absolute;top:-6px;right:-6px;transform:none}
/* wincricket 2026-09-29 (docs/operations/wincricket-flicker-2026-09-29.md) ---------------------------------------------
   Runner names in the live/upcoming price cells: the full name at 12 px, wrapping to two lines at a word boundary
   (the templates no longer cut it to 11 letters + "…" at 9 px). Every cell reserves the two-line height (58 px: 6+6 padding,
   15 px price, 3 px gap, 2 x 13.8 px label), so a rail keeps its height whichever names it holds: a long name arriving or
   leaving must not move the sections below it (measured on live: +14 px per rail, CLS 0.029, before this reserve).
   Size: the odds-pill ruling's token (11 px/600 on wincricket, docs/operations/wincricket-odds-pills-2026-09-29.md; two
   11 px lines need 55 px, inside the 58 px reserve), 12 px without it. */
.lv2-odd{padding:6px 4px;min-height:58px}
.lv2-odd small{font-size:var(--wc-odd-label-size,12px);line-height:1.15;margin-top:3px;max-width:100%;text-align:center;overflow-wrap:break-word;hyphens:auto;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
/* The UPDATES strip steps notice by notice (lobby-v2.js newsMeasure): one notice per window-wide slot, measured keyframes. */
.tenant-news[data-news-step] .tenant-news-item{min-width:var(--news-window,0px)}
.tenant-news[data-news-step] .tenant-news-headline{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 18px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 18px),transparent)}
.tenant-news[data-news-step] .tenant-news-track{animation-name:var(--news-step,tenant-news-scroll-left);animation-duration:var(--news-step-dur,var(--news-duration,45s));animation-timing-function:linear}
/* The UPDATES strip on phones (lobby-v2.js newsCard): one notice at a time, wrapped to two lines, swapped every 6 s. The
   headline button stays the tap target for the full list (stretched over the strip, its marquee hidden and stopped). */
.tenant-news[data-news-card]{height:auto;min-height:0;padding-block:6px}
.tenant-news[data-news-card] .tenant-news-headline{position:absolute;inset:0;z-index:1;color:transparent;min-height:0}
.tenant-news[data-news-card] .tenant-news-track{visibility:hidden;animation:none}
.tenant-news[data-news-card] .tenant-news-pause{position:relative;z-index:2}
.lv2-news-card{flex:1;min-width:0;display:grid;align-items:center;height:calc(2 * 1.25 * 13px);overflow:hidden;font-size:13px;line-height:1.25;font-weight:600;pointer-events:none}
.lv2-news-slide{grid-area:1/1;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;white-space:normal;overflow-wrap:break-word}
/* UX-10 mobile type floor (360-760px, wincricket): restates each sub-10px selector exactly as set, so this later block wins by order. */
@media (min-width:360px) and (max-width:760px){
 .lv2-cat>b>small,.lv2-cat-tail>small,.lv2-grid5 .game-preview-badge,.lv2-grid5 .lv2-badge,.lv2-grid5 .game-art .game-art-word,.lv2-ticker-label,.lv2-live-badge{font-size:11px}
}

/* ---------- hero board (home v3 SPEC §3.2): bento 380 / 420 at >= 1200, lead 320 + a 150 side row at 761-1199, the lead only on the
   phone home. Side cards are .wc-promo with a fixed copy budget (nothing clips); no aurora on the cards, no CTA sheen. ---------- */
.lv2-hb{--hb-h:372px;--hb-ink:rgba(11,6,20,.94);--hb-rim:color-mix(in srgb,var(--brand) 28%,transparent)}
.lv2-hb>.lv2-hb-lead,.lv2-hb>.lv2-hb-card{position:relative;flex:0 0 100%;height:var(--hb-h);scroll-snap-align:start}
.lv2-hb-lead{border-radius:18px;box-shadow:0 16px 36px -18px var(--lv2-glow)}
.lv2-hb .lv2-hb-card{aspect-ratio:auto;border-radius:18px;border-color:var(--hb-rim);background:#150323}
.lv2-hb .lv2-hb-card::before,.lv2-hb .lv2-hero-cta::after{content:none;animation:none}
.lv2-hb-lead>.lv2-hb-card{position:absolute;inset:0;height:auto;box-shadow:none}
.lv2-hb .lv2-hb-card>img{inset:0;width:100%;height:100%;object-fit:cover;filter:none;max-width:none}
.lv2-hb .lv2-hb-card:hover>img{transform:scale(1.03)}
.lv2-hb .is-matchday>img{object-position:76% 50%}.lv2-hb .is-inplay>img{object-position:90% 50%}
.lv2-hb .is-slots>img{object-position:70% 50%}.lv2-hb .is-livecasino>img{object-position:86% 50%}
.lv2-hb .lv2-hero-shade{background:linear-gradient(0deg,var(--hb-ink) 0%,rgba(11,6,20,.6) 42%,rgba(11,6,20,0) 72%)}
.lv2-hb-lead .lv2-hero-shade{background:linear-gradient(180deg,var(--hb-ink) 0%,rgba(11,6,20,.55) 40%,rgba(11,6,20,0) 58%,rgba(11,6,20,.7) 100%)}
.lv2-hb .lv2-hero-copy{gap:8px;padding:18px}
.lv2-hb-lead .lv2-hero-copy{justify-content:flex-start}
.lv2-hb .lv2-eyebrow{display:flex;align-items:center;font-size:12px;line-height:14px;font-weight:900;letter-spacing:.12em;margin:0}
.lv2-hb-pulse{width:8px;height:8px;margin-right:9px;border-radius:50%;background:#FF4B4B;box-shadow:0 0 0 4px rgba(255,75,75,.22);animation:lv2Pulse 1.6s infinite}
.lv2-hb .lv2-hero-copy h2{max-width:none;font-size:26px;line-height:1.04;font-weight:900;letter-spacing:-.01em;text-shadow:0 2px 14px rgba(0,0,0,.45)}
.lv2-hb .lv2-hero-copy h2>span{display:block}
.lv2-hb .lv2-hero-copy p{max-width:24em;font-size:14px;font-weight:400;line-height:1.35;color:#ECE4F4}
.lv2-hb .lv2-hero-cta{gap:10px;margin-top:4px;padding:0 20px;height:44px;border-radius:10px;font-size:15px;font-weight:700;box-shadow:0 10px 24px -10px var(--brand)}
.lv2-hb .lv2-hero-cta .icon{width:15px;height:15px}
/* the featured match: a positioning box; the coupon inside is the glass panel (.wc-coupon.is-hero), a night surface in both
   themes, so it carries the night palette's text / live / tag / accent tokens (brand.css NIGHT block) and day ink never lands on it */
.lv2-hb-fm{position:absolute;z-index:4;left:12px;right:12px;bottom:12px}
@media(max-width:760px){
 /* the phone home: art band 150 with the eyebrow + h2 over it, then the featured coupon inside the same card; no CTA, no swipe
    rail, no dots (decision 3). Other routes keep the swipe rail. */
 .lv2-hb.is-home{display:block;margin:8px 0 0;padding:0;overflow:visible}
 .lv2-hb.is-home>.wc-promo,.lv2-hb.is-home+.lv2-hb-dots{display:none}
 .lv2-hb.is-home>.lv2-hb-lead{height:auto;overflow:hidden;border:1px solid var(--hb-rim);background:#150323}
 .lv2-hb.is-home .lv2-hb-lead>.lv2-hb-card{position:relative;inset:auto;display:block;height:150px;border:0;border-radius:0}
 .lv2-hb.is-home .lv2-hb-lead:not(.has-fm)>.lv2-hb-card{height:196px}
 .lv2-hb.is-home .lv2-hb-lead .lv2-hb-card>img{object-position:70% 30%;-webkit-mask-image:linear-gradient(180deg,#000 55%,transparent);mask-image:linear-gradient(180deg,#000 55%,transparent)}
 .lv2-hb.is-home .lv2-hb-lead .lv2-hero-shade{background:linear-gradient(180deg,rgba(11,6,20,.1) 0%,rgba(11,6,20,.55) 50%,var(--hb-ink) 100%)}
 .lv2-hb.is-home .lv2-hb-lead .lv2-hero-copy{justify-content:flex-end;gap:6px;padding:12px 16px 10px}
 .lv2-hb.is-home .lv2-hb-lead .lv2-hero-copy h2{font-size:24px}
 .lv2-hb.is-home .lv2-hb-lead .lv2-hero-copy h2>span{display:inline}
 .lv2-hb.is-home .lv2-hero-cta,.lv2-hb.is-home .has-fm .lv2-hero-copy p{display:none}
 .lv2-hb.is-home .lv2-hb-fm{position:relative;left:auto;right:auto;bottom:auto;padding:0 10px 10px}
 /* board A at 412: the copy sits at the top of the 150-px art band and the coupon panel starts right under the copy, over the
    band's faded lower part (lead 348, not 400), so the first LIVE coupon's BACK pill clears the bottom nav (SPEC §2 fold) */
 .lv2-hb.is-home .has-fm>.lv2-hb-card{height:auto;overflow:visible}
 .lv2-hb.is-home .has-fm .lv2-hero-copy{position:relative;inset:auto;justify-content:flex-start;padding:14px 16px 6px}
 .lv2-hb.is-home .has-fm .lv2-hero-copy h2>span{display:block}
 .lv2-hb.is-home .has-fm .lv2-hb-card>img,.lv2-hb.is-home .has-fm .lv2-hero-shade,.lv2-hb.is-home .has-fm .lv2-particles{top:0;bottom:auto;height:150px}
 .lv2-hb.is-home .has-fm .lv2-hb-fm{padding-top:4px}
}
@media(min-width:761px){
 .lv2-hb{--hb-h:auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:320px 150px;gap:12px;margin:16px 0 0;padding:0;overflow:visible}
 .lv2-hb.n0{grid-template-rows:320px}
 .lv2-hb.n1{grid-template-columns:minmax(0,1fr)}.lv2-hb.n2{grid-template-columns:repeat(2,minmax(0,1fr))}
 .lv2-hb>.lv2-hb-lead{grid-column:1/-1}
 .lv2-hb-dots{display:none}
 .lv2-hb-lead .lv2-hb-card>img{inset:0 0 0 auto;width:auto;height:100%;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 30%);mask-image:linear-gradient(90deg,transparent 0,#000 30%)}
 .lv2-hb-lead .lv2-hero-shade{background:linear-gradient(90deg,var(--hb-ink) 0%,rgba(11,6,20,.72) 36%,rgba(11,6,20,0) 64%)}
 .lv2-hb>.lv2-hb-card .lv2-hero-shade{background:linear-gradient(90deg,var(--hb-ink) 0%,rgba(11,6,20,.86) 44%,rgba(11,6,20,.1) 80%)}
 .lv2-hb-lead .lv2-hero-copy{right:auto;width:min(50%,520px);gap:10px;padding:28px 30px}
 .lv2-hb-lead .lv2-hero-copy h2{font-size:32px}
 .lv2-hb-lead .lv2-hero-copy p{font-size:16px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
 .lv2-hb-lead .lv2-hero-cta{padding:0 20px;font-size:16px}
 .lv2-hb-fm{left:auto;right:18px;bottom:18px;width:min(440px,46%)}
 .lv2-hb-lead:not(.has-fm) .lv2-hero-copy{justify-content:center}
 /* side cards: 14 + eyebrow 14 + 6 + title (3 x 19 here, 2 x 19 in the bento) + 6 + CTA 36 + 14 <= the card */
 .wc-promo .lv2-hero-copy{justify-content:flex-start;right:auto;width:70%;gap:6px;padding:14px 18px;overflow:hidden}
 .wc-promo.is-inplay .lv2-hero-copy{width:80%}
 .wc-promo .lv2-hero-copy h2{font-size:16px;line-height:1.2;font-weight:700;letter-spacing:0;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
 .wc-promo .lv2-hero-copy h2>span{display:inline}
 .wc-promo .lv2-hero-cta{margin-top:auto;flex:0 0 auto;height:36px;padding:0 14px;font-size:14px;box-shadow:none}
 .wc-promo .lv2-hero-cta .icon{width:13px;height:13px}
}
@media(min-width:1200px){
 .lv2-hb,.lv2-hb.n1,.lv2-hb.n2,.lv2-hb.n3{grid-template-columns:minmax(0,1.62fr) minmax(0,1fr);grid-template-rows:none;height:380px}
 .lv2-hb.n0{grid-template-columns:minmax(0,1fr);height:340px}
 .lv2-hb.n1{grid-template-rows:1fr}.lv2-hb.n2{grid-template-rows:repeat(2,minmax(0,1fr))}.lv2-hb.n3{grid-template-rows:repeat(3,minmax(0,1fr))}
 .lv2-hb>.lv2-hb-lead{grid-column:1;grid-row:1/-1}
 .lv2-hb>.lv2-hb-card{grid-column:2}
 .wc-promo .lv2-hero-copy h2{-webkit-line-clamp:2}
 /* 118-px side cards: 12 + eyebrow 12 + 4 + title 2 x 18 + 4 + CTA 36 + 12 = 116 */
 .lv2-hb.n3>.wc-promo .lv2-hero-copy{gap:4px;padding:12px 16px}
 .lv2-hb.n3>.wc-promo .lv2-eyebrow{line-height:12px}
 .lv2-hb.n3>.wc-promo .lv2-hero-copy h2{font-size:15px}
}
/* the 420 bento (SPEC col. 1920 x 1080) needs the height too: at 1600 x 900 it put the first BACK pill at 919, under the fold */
@media(min-width:1600px) and (min-height:940px){
 .lv2-hb,.lv2-hb.n1,.lv2-hb.n2,.lv2-hb.n3{height:420px}
 .lv2-hb.n0{height:380px}
 .lv2-hb-lead .lv2-hero-copy{padding:36px 40px}
 .lv2-hb-lead .lv2-hero-copy h2{font-size:40px}
 .lv2-hb.n3>.wc-promo .lv2-hero-copy{gap:6px;padding:14px 18px}
 .lv2-hb.n3>.wc-promo .lv2-eyebrow{line-height:14px}
 .lv2-hb.n3>.wc-promo .lv2-hero-copy h2{font-size:16px}
}
/* day: the night art sits in the purple board frame (SPEC §3.8) */
:root:not([data-theme="dark"]) .lv2-hb{--hb-rim:var(--board)}
/* P06: the casino hero on phones is at most 220 px, so the category tiles and the search start inside the first screen */
@media(max-width:760px){
 .lv2-hb.is-casino{--hb-h:220px}
 .lv2-hb.is-casino>.lv2-hb-lead,.lv2-hb.is-casino>.lv2-hb-card{max-height:220px}
 .lv2-hb.is-casino .lv2-hero-copy{gap:6px;padding:14px 16px}
 .lv2-hb.is-casino .lv2-hero-copy h2{font-size:22px}
 .lv2-hb.is-casino .lv2-hero-copy p{display:none}
}
/* P06: a category label stays on one line (brand.css lets it wrap); the count never ellipsises */
html .lv2-catnav:not(.wc-strip) .lv2-cat>b{display:flex;align-items:center;justify-content:center;min-width:0;min-height:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html .lv2-catnav:not(.wc-strip) .lv2-cat>b>:is(.lv2-cn,.wc-cn){min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
html .lv2-catnav:not(.wc-strip) .lv2-cat>b>small{flex:none}
/* P06: the casino rail and the search row hold their rendered height from the first paint (CLS) */
.lv2-catnav:not(.wc-strip) .lv2-catnav-track{min-height:91px;box-sizing:border-box}
.lv2-search{min-height:42px}
.lv2-win{min-height:28px}
:root:not([data-theme="dark"]) .lv2-hb-lead{box-shadow:0 16px 36px -18px color-mix(in srgb,var(--board) 70%,transparent)}

/* ==================== wincricket HOME v3 "Matchday Desk" (docs/operations/wincricket-home-v3-2026-10-13/SPEC.md) ====================
   One system (SYSTEM.md): type T1 12/11 · T2 13/12 · T3 14 · T4 15 · T5 17/16 · T6 22/20 · T7 28/24; radii 6 tags · 10 pills/buttons/
   posters · 14 cards · 18 hero/lanes · 999 chips; spacing 4·8·12·16·24·28·32. Every colour is a brand token. */
/* ---------- A. logged-in masthead (§3.1): bets · balance chip · Deposit · avatar ---------- */
html .masthead:has(.wc-wallet) .header-actions{gap:10px}
html .masthead :is(.wc-wallet,.header-deposit,.wc-av){flex:0 0 auto;text-decoration:none}
html .masthead .wc-wallet{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 12px;border-radius:10px;background:var(--surface);border:1px solid var(--border);color:var(--text);white-space:nowrap;transition:border-color .15s}
html .masthead .wc-wallet-label{font-size:12px;font-weight:600;line-height:1;color:var(--faint)}
html .masthead .wc-amt{font-size:15px;font-weight:700;line-height:1;font-variant-numeric:tabular-nums}
html .masthead .wc-amt-short{display:none}
html .masthead .wc-skel{display:block;width:64px;height:14px;border-radius:4px;background:linear-gradient(100deg,var(--control) 30%,var(--surface-3,var(--surface-2)) 50%,var(--control) 70%);background-size:220% 100%;animation:lv2Shimmer 1.2s linear infinite}
html .masthead .header-deposit{display:inline-flex;align-items:center;gap:6px;height:40px;padding:0 9px 0 16px;border-radius:10px;background:var(--brand);color:var(--brand-ink);font-size:14px;font-weight:700;line-height:1;white-space:nowrap;transition:filter .15s,transform .12s}
html .masthead .header-deposit .wc-plus{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:rgba(0,0,0,.16)}
html .masthead .header-deposit .wc-plus .icon{width:14px;height:14px}
html .masthead .wc-av{position:relative;display:inline-flex;align-items:center;justify-content:center;min-width:36px;min-height:36px}
html .masthead .wc-av .avatar{width:36px;height:36px;border:0;background:var(--control);color:var(--brand);font-size:15px;font-weight:900}
html .masthead .wc-av-badge{display:none;position:absolute;top:-5px;right:-6px;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--brand);color:var(--brand-ink);box-shadow:0 0 0 2px var(--surface);font-size:11px;font-weight:900;line-height:18px;text-align:center;font-variant-numeric:tabular-nums}
@media(hover:hover){html .masthead .wc-wallet:hover{border-color:color-mix(in srgb,var(--brand) 55%,var(--border))}html .masthead .header-deposit:hover{filter:brightness(1.06)}}
html .masthead .header-deposit:active{transform:scale(.96)}
/* SYSTEM "targets": drawn at board H's sizes (40 / 38 / 36 desktop, 36 / 32 / 30 phone), each with a 44 x 44 hit area */
html .masthead :is(.wc-wallet,.header-deposit){position:relative}
html .masthead:has(.wc-wallet) :is(.wc-wallet,.header-deposit,.wc-av,.header-bets)::after{content:"";position:absolute;left:50%;top:50%;width:max(100%,44px);height:max(100%,44px);transform:translate(-50%,-50%)}
:root:not([data-theme="dark"]) .masthead .wc-av .avatar{color:var(--accent-ink,var(--brand))}
@media(max-width:760px){
 html .masthead:has(.wc-wallet){gap:8px}
 html .masthead:has(.wc-wallet) .header-actions{gap:8px}
 html .masthead:has(.wc-wallet) :is(.search-trigger,.theme-control,.header-bets){display:none}
 html .masthead .wc-wallet{height:36px;padding:0 10px}
 html .masthead .wc-wallet-label,html .masthead .wc-amt-full{display:none}
 html .masthead .wc-amt-short{display:inline}
 html .masthead .wc-amt{font-size:14px}
 html .masthead .header-deposit{height:36px;padding:0 7px 0 12px;font-size:13px}
 html .masthead .header-deposit .wc-plus{width:20px;height:20px}
 html .masthead .wc-av,html .masthead .wc-av .avatar{min-width:32px;min-height:32px;width:32px;height:32px;font-size:14px}
 html .masthead .wc-av-badge{display:block}
}
@media(max-width:390px){
 html .masthead:has(.wc-wallet){padding:0 9px;gap:6px}
 html .masthead:has(.wc-wallet) .header-actions{gap:6px}
 html .masthead:has(.wc-wallet) .brand{--lockup-h:17px}
 html .masthead:has(.wc-wallet) .brand-flag{display:none}
 html .masthead .wc-av,html .masthead .wc-av .avatar{min-width:30px;min-height:30px;width:30px;height:30px}
}

/* ---------- C. sport strip (§3.3): 56-px art tiles, the live count only, not sticky ---------- */
.lv2-catnav.wc-strip{position:static;margin:16px calc(-1*var(--lv2-gutter)) 0;padding:0 var(--lv2-gutter);background:none;backdrop-filter:none;-webkit-backdrop-filter:none;border:0;
 mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent);-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent)}
.wc-strip .lv2-catnav-track{gap:4px;padding:0}
.wc-strip .lv2-cat{width:68px;gap:6px;padding:4px 0 2px;color:var(--dim)}
.wc-strip .lv2-cat>span.lv2-cat-art{width:56px;height:56px;border-radius:14px}
.wc-strip .lv2-cat.is-live>span.lv2-cat-art::after{content:none}
html .wc-strip .lv2-cat>b{display:block;width:auto;max-width:none;min-height:30px;overflow:visible;text-overflow:clip;white-space:nowrap;font-size:12px;font-weight:700;line-height:15px}
html .wc-strip .lv2-cat-tail{display:inline;white-space:nowrap}
html .wc-strip .wc-live-n{display:flex;align-items:center;justify-content:center;gap:4px;margin:0;padding:0;background:none;border-radius:0;color:var(--live);font-size:11px;font-weight:700;line-height:15px;font-variant-numeric:tabular-nums;vertical-align:baseline}
html .wc-strip .lv2-cat-tail>.wc-live-n{display:inline-flex;margin-left:4px}
.wc-strip .wc-live-n>i{width:6px;height:6px;border-radius:50%;background:#FF4D4D;animation:lv2Pulse 1.6s ease-in-out infinite}
@media(hover:hover){.wc-strip .lv2-cat:hover{color:var(--text)}.wc-strip .lv2-cat:hover>span.lv2-cat-art{box-shadow:0 0 0 2px var(--brand)}}
@media(min-width:761px){
 .lv2-catnav.wc-strip{margin:16px 0 0;padding:0;mask-image:none;-webkit-mask-image:none}
 /* gate 4: the tiles shrink from 84 to a 68-px floor (the widest label is 65) so 12 sports fit the 908-px track at 1024; no rail */
 .wc-strip .lv2-cat{width:auto;flex:0 1 84px;min-width:68px}
 html .wc-strip .lv2-cat>b{font-size:13px;line-height:16px;min-height:32px}
 html .wc-strip .wc-live-n{font-size:12px;line-height:16px}
}
/* F6: from 1024 the tiles spread over the content width, one equal column each (whatever the sport count), icon and label
   centred on the column; 761-1023 and the phone keep the rows above */
@media(min-width:1024px){
 .wc-strip .lv2-catnav-track{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:4px;overflow:visible}
 .wc-strip .lv2-cat{width:auto;min-width:0;flex:none}
 html .wc-strip .lv2-cat>b{text-align:center}
}
/* 761-899 (tablet): 12 tiles cannot fit, so the strip keeps the phone's swipe with the right-edge fade */
@media(min-width:761px) and (max-width:899px){
 .lv2-catnav.wc-strip{mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent);-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent)}
}

/* ---------- D. the coupon family (§3.4 + live-rail SPEC §3): LIVE · hero · COMING UP. Names and competitions wrap rather than
   clip (gate 7); only the state line ellipsises. ---------- */
.wc-coupon{position:relative;display:flex;flex-direction:column;gap:6px;min-width:0;padding:10px 12px;border-radius:14px;background:var(--surface);border:1px solid var(--line);color:var(--text);transition:transform .18s var(--lv2-ease),box-shadow .18s var(--lv2-ease),border-color .18s}
/* the head: the right group (stream, LIVE, star / the kick-off tag) floats, so a competition line below it takes the card's full
   width; its margin box (the group less 6 px) stays inside the first line. The competition is one line of text (line height =
   the tag height); the tags ride on its last word in a nowrap glue (lobby-v2.js coupon), so they never stand alone on a line */
.wc-coupon .lv2-lc-top{min-height:22px}
.wc-coupon.is-upcoming .lv2-lc-top{min-height:24px}
.wc-coupon .lv2-lc-comp{display:block;min-width:0;padding-top:2px;color:var(--faint);font-size:12px;font-weight:600;line-height:18px;overflow-wrap:break-word}
.wc-coupon .lv2-lc-comp>.icon{display:inline-block;width:12px;height:12px;margin:3px 6px 0 0;vertical-align:top}
.wc-coupon .wc-glue{white-space:nowrap}
.wc-coupon .wc-tags{display:inline-flex;gap:4px;margin-left:6px;vertical-align:top}
.wc-tag{display:inline-flex;align-items:center;height:18px;padding:0 6px;border-radius:6px;background:var(--control);color:var(--faint);font-size:11px;font-weight:700;font-style:normal;line-height:1;letter-spacing:.02em;white-space:nowrap}
.wc-tag.bm{background:var(--wc-tag-bm);color:var(--wc-tag-bm-ink)}
.wc-tag.f{background:var(--wc-tag-f);color:var(--wc-tag-f-ink)}
.wc-tag.time{gap:5px;height:24px;padding:0 8px;background:color-mix(in srgb,var(--brand) 12%,transparent);letter-spacing:0}
.wc-tag.time small{font-size:12px;font-weight:600;color:var(--faint)}
.wc-tag.time b{font-size:15px;font-weight:700;color:var(--brand);font-variant-numeric:tabular-nums}
.wc-coupon .lv2-lc-right{float:right;display:flex;align-items:center;gap:6px;margin:0 0 -6px 8px}
.wc-coupon .lv2-lc-badge{display:inline-flex;align-items:center;gap:5px;height:22px;color:var(--live);font-size:12px;font-weight:900;letter-spacing:.08em;white-space:nowrap}
.wc-coupon .lv2-lc-badge>i{width:6px;height:6px;border-radius:50%;background:currentColor;animation:lv2Pulse 1.6s ease-in-out infinite}
.wc-coupon .lv2-lc-badge.is-halt{color:var(--faint)}.wc-coupon .lv2-lc-badge.is-halt>i{animation:none}
html .wc-coupon :is(.lv2-lc-tv,.lv2-lc-star){position:relative;display:grid;place-items:center;flex:0 0 auto;width:28px;height:28px;min-width:0;min-height:0;margin:-3px 0;padding:0;border:0;border-radius:8px;background:none;color:var(--faint)}
html .wc-coupon :is(.lv2-lc-tv,.lv2-lc-star)::after{content:"";position:absolute;inset:-8px}
html .wc-coupon :is(.lv2-lc-tv,.lv2-lc-star) .icon{width:16px;height:16px}
html .wc-coupon .lv2-lc-tv{color:var(--brand)}
html .wc-coupon .lv2-lc-star.saved{color:var(--brand)}
html .wc-coupon .lv2-lc-star.saved .icon{fill:currentColor}
.wc-coupon :is(.lv2-lc-cols,.lv2-lc-run){display:grid;grid-template-columns:28px minmax(0,1fr) 84px 84px;column-gap:6px;align-items:center}
.wc-coupon .lv2-lc-cols{min-height:14px;color:var(--faint);font-size:11px;font-weight:700;letter-spacing:.06em;line-height:14px;text-align:center}
.wc-coupon .lv2-lc-cols>span:first-child{grid-column:1/3;text-align:left;letter-spacing:.02em;color:var(--wc-odd-label,var(--faint))}
.wc-coupon .lv2-lc-cols .b{color:var(--back-ink)}.wc-coupon .lv2-lc-cols .l{color:var(--lay-ink)}
:root[data-theme="dark"] .wc-coupon .lv2-lc-cols .b{color:#BFE3FF}:root[data-theme="dark"] .wc-coupon .lv2-lc-cols .l{color:#FFC1D2}
.wc-coupon .lv2-lc-run{min-height:44px}
html .wc-coupon .team-mark{width:22px;height:22px;flex:0 0 22px;justify-self:center;font-size:11px;font-weight:800;letter-spacing:-.02em}
/* the initials fallback (no crest in the shared store) is a 28 x 22 r6 tile so three letters sit at the type floor, never 8 px */
html .wc-coupon .team-mark:not(:has(img)):not(.wc-draw){width:28px;flex-basis:28px;border-radius:6px;background:var(--control);border-color:transparent;color:var(--dim)}
@media(min-width:1024px){html .wc-coupon .team-mark:not(.wc-draw){font-size:12px}}
.wc-coupon .team-mark.wc-draw{border-radius:6px;background:var(--control);border-color:transparent;color:var(--faint)}
.wc-coupon .team-mark.wc-draw>span{font-size:13px;font-weight:700}
.wc-coupon .wc-nm{display:flex;flex-direction:column;justify-content:center;align-self:stretch;min-height:44px;gap:1px;min-width:0;color:var(--text);text-decoration:none}
.wc-coupon .wc-nm>span:first-child{font-size:14px;font-weight:700;line-height:17px;overflow-wrap:break-word}
.wc-coupon .wc-sc{display:flex;align-items:baseline;gap:6px;color:var(--dim);font-size:13px;font-weight:700;line-height:16px;font-variant-numeric:tabular-nums}
.wc-coupon .wc-sc>i{font-style:normal}.wc-coupon .wc-sc>i.cur{color:var(--text)}
.wc-coupon .wc-sc>em{font-style:normal;color:var(--faint)}
@media(hover:hover){.wc-coupon .wc-nm:hover>span:first-child{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}}
/* BACK / LAY pills: 44 tall (beats the 58-px rule above), the side colour on a two-sided row; read-only keeps the glass pill */
html .wc-coupon .lv2-odd{min-height:44px;height:44px;padding:4px;border-radius:10px;transition:opacity .15s,filter .15s,box-shadow .15s}
html .wc-coupon .lv2-odd b{font-size:15px;font-weight:700;line-height:18px}
html .wc-coupon .lv2-odd small{display:block;margin-top:1px;overflow:visible;-webkit-line-clamp:unset;white-space:nowrap;font-size:11px;font-weight:600;line-height:13px;color:inherit;opacity:.82}
html .wc-coupon .lv2-odd.back:not(.is-readonly),html .wc-row .lv2-odd.back:not(.is-readonly){background:var(--wc-back,var(--back));color:var(--wc-back-ink,var(--back-ink));box-shadow:inset 0 0 0 1px var(--wc-back-rim,transparent),inset 0 1px 0 var(--wc-odd-hi,transparent)}
html .wc-coupon .lv2-odd.lay:not(.is-readonly),html .wc-row .lv2-odd.lay:not(.is-readonly){background:var(--wc-lay,var(--lay));color:var(--wc-lay-ink,var(--lay-ink));box-shadow:inset 0 0 0 1px var(--wc-lay-rim,transparent),inset 0 1px 0 var(--wc-odd-hi,transparent)}
html .wc-coupon .lv2-odd.is-off{background:var(--wc-off-bg,var(--control));color:var(--wc-off-ink,var(--faint));box-shadow:inset 0 0 0 1px var(--line);cursor:default}
html .wc-coupon .lv2-odd.is-paused{opacity:.5;cursor:default}
html .wc-coupon .lv2-odd:disabled:active{transform:none}
@media(hover:hover){
 html .wc-coupon .lv2-odd.back:not(:disabled,.is-readonly):hover,html .wc-row .lv2-odd.back:not(:disabled,.is-readonly):hover{background:var(--wc-back-hover,var(--back));box-shadow:inset 0 0 0 1px var(--wc-back-hover-rim,var(--back-ink))}
 html .wc-coupon .lv2-odd.lay:not(:disabled,.is-readonly):hover,html .wc-row .lv2-odd.lay:not(:disabled,.is-readonly):hover{background:var(--wc-lay-hover,var(--lay));box-shadow:inset 0 0 0 1px var(--wc-lay-hover-rim,var(--lay-ink))}
}
/* a halted market: one muted block across both price columns and every runner row; the label sits in the first row */
.wc-coupon .lv2-odd.is-readonly{grid-column:3/5}
.wc-coupon .lv2-lc-halt{grid-column:3/5;align-self:stretch;display:grid;place-items:center;min-height:44px;border-radius:10px;background:var(--control);color:var(--faint);font-size:13px;font-weight:700;letter-spacing:.02em}
.wc-coupon .lv2-lc-run:has(+.lv2-lc-run>.lv2-lc-halt)>.lv2-lc-halt{border-bottom-left-radius:0;border-bottom-right-radius:0}
.wc-coupon .lv2-lc-run+.lv2-lc-run>.lv2-lc-halt{margin-top:-6px;border-top-left-radius:0;border-top-right-radius:0}
/* the foot: state line (the one ellipsis) + last six balls, then the matched line; pinned to the card's foot in a stretched row */
.wc-coupon .lv2-lc-run:not(:has(~.lv2-lc-run)){margin-bottom:auto}
.wc-coupon .lv2-lc-state{display:flex;align-items:center;gap:8px;min-height:20px;color:var(--dim);font-size:12px;font-weight:600;line-height:16px}
.wc-coupon .lv2-lc-state>span:first-child{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wc-coupon .lv2-lc-state b{color:var(--text);font-weight:700}
.wc-coupon .lv2-lc-six{display:flex;gap:3px;flex:0 0 auto}
.wc-coupon .lv2-lc-six>i{display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:var(--control);color:var(--dim);font-size:11px;font-weight:700;font-style:normal;line-height:1;font-variant-numeric:tabular-nums}
.wc-coupon .lv2-lc-six>i.w{background:#5A1221;color:#FFC1D2}.wc-coupon .lv2-lc-six>i.four{background:#163E5C;color:#BFE3FF}.wc-coupon .lv2-lc-six>i.six{background:#5A4210;color:#FFE9A8}
.wc-coupon .wc-matched{margin:0;color:var(--faint);font-size:12px;font-weight:600;line-height:16px;font-variant-numeric:tabular-nums}
/* the hero's featured match: a glass panel over the art, 15-px names, no matched line */
.wc-coupon.is-hero{background:rgba(11,6,20,.84);border-color:rgba(247,210,42,.35);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#fff;--text:#fff;--dim:#D9CFE6;--faint:#B9AECB;--live:#FFB380;--wc-tag-bm:#2E1D49;--wc-tag-bm-ink:#E6D6FF;--wc-tag-f:#183B2E;--wc-tag-f-ink:#9CF0C3;--accent-ink:#F8D846;--control:rgba(255,255,255,.08);--line:rgba(255,255,255,.12)}
.wc-coupon.is-hero .wc-nm>span:first-child{font-size:15px;line-height:18px}
.wc-coupon.is-hero .wc-matched{display:none}
@media(min-width:761px){
 .wc-coupon{padding:12px 14px}
 .wc-coupon .lv2-lc-comp{padding-top:1px;font-size:13px;line-height:20px}
 .wc-coupon .lv2-lc-comp>.icon{margin-top:4px}
 .wc-coupon :is(.lv2-lc-cols,.lv2-lc-run){grid-template-columns:28px minmax(0,1fr) 72px 72px}
 .wc-coupon .lv2-lc-cols{font-size:12px}
 .wc-tag{height:20px;font-size:12px}.wc-tag.time{height:24px}
 html .wc-coupon .lv2-odd small{font-size:12px}
 .wc-coupon .lv2-lc-state{font-size:13px}
 .wc-coupon .lv2-lc-six>i{font-size:12px}
}
@media(hover:hover) and (min-width:1024px){
 .wc-coupon:not(.is-hero):hover{transform:translateY(-2px);box-shadow:0 10px 22px -12px rgba(0,0,0,.6),0 0 0 1px color-mix(in srgb,var(--brand) 40%,transparent)}
}

/* ---------- E. section rhythm, sport chips, the coupon grids (SYSTEM §1: 1 / 2 / 3 / 4 / 5 columns) ---------- */
.lv2-sec.wc-sec{margin:20px 0 0}
.wc-sec .lv2-sec-head,.wc-shelf .lv2-sec-head{align-items:center;gap:12px;min-height:40px;margin:0 0 12px}
.wc-sec .lv2-eyebrow,.wc-shelf .lv2-eyebrow{margin:0 0 2px;font-size:11px;font-weight:900;letter-spacing:.12em;line-height:14px;color:var(--brand)}
.wc-sec .lv2-sec-head h2,.wc-shelf .lv2-sec-head h2{gap:8px;font-size:20px;font-weight:900;line-height:24px;letter-spacing:-.01em}
.wc-sec .lv2-sec-head h2>small,.wc-shelf .lv2-sec-head h2>small{display:inline-flex;align-items:center;height:20px;padding:0 7px;border-radius:6px;background:var(--control);color:var(--faint);font-size:12px;font-weight:700;letter-spacing:0;font-variant-numeric:tabular-nums}
.wc-live .lv2-sec-head h2>small{background:color-mix(in srgb,var(--live) 16%,transparent);color:var(--live)}
:root:not([data-theme="dark"]) .wc-live .lv2-sec-head h2>small{background:color-mix(in srgb,var(--live) 8%,transparent)}
.wc-sec .lv2-sec-link,.wc-shelf .lv2-sec-link{gap:4px;min-height:40px;padding:0 2px;color:var(--brand);font-size:13px;font-weight:700}
.wc-sec .lv2-sec-link .icon,.wc-shelf .lv2-sec-link .icon{width:12px;height:12px}
.wc-sec .feed-error{margin:0 0 12px}
.wc-chips{display:flex;gap:6px;margin:0 calc(-1*var(--lv2-gutter)) 12px;padding:0 var(--lv2-gutter);overflow-x:auto;scrollbar-width:none;
 mask-image:linear-gradient(90deg,#000 calc(100% - 24px),transparent);-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 24px),transparent)}
.wc-chips::-webkit-scrollbar{display:none}
.wc-chip{flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 6px 0 12px;border-radius:999px;border:1px solid var(--line);background:var(--surface);color:var(--dim);font:inherit;font-size:12px;font-weight:700;white-space:nowrap;cursor:pointer;transition:transform .12s,background .15s,color .15s,border-color .15s}
.wc-chip .icon{width:14px;height:14px}
.wc-chip>b{display:inline-flex;align-items:center;height:20px;min-width:20px;justify-content:center;padding:0 6px;border-radius:6px;background:var(--control);color:var(--faint);font-size:12px;font-weight:700;font-variant-numeric:tabular-nums}
.wc-chip .wc-dot{width:6px;height:6px;border-radius:50%;background:var(--live)}
.wc-chip.is-on{background:var(--brand);border-color:var(--brand);color:var(--brand-ink)}
.wc-chip.is-on>b{background:rgba(0,0,0,.18);color:inherit}
.wc-chip.is-on .wc-dot{background:currentColor}
.wc-chip:active{transform:scale(.96)}
@media(hover:hover){.wc-chip:not(.is-on):hover{color:var(--text);border-color:color-mix(in srgb,var(--brand) 45%,var(--line))}}
/* F4: a coupon in a grid is a subgrid of the grid's rows: head / column labels / runners 1-12 / state / matched, so a row of cards
   shares its tracks and every BACK label and price sits at one height across it. The grid has no row gap, so a track no card of
   the row fills is 0 px (a missing third runner or state line adds nothing); the row spacing is each card's bottom margin, the
   last row's given back by the grid's own negative margin (it collapses with whatever follows). A grid holding an outright of
   more than 12 runners (never a match) keeps the flex column: that card would overrun the 16-track span. The display rule's guards
   sit in :where() so it weighs .wc-grid>.wc-coupon and the per-breakpoint caps below (same weight, later) still hide a card */
.wc-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:0 10px;margin-bottom:-10px}
.wc-grid>.wc-coupon{margin-bottom:10px}
.wc-grid:where(:not(:has(>.wc-coupon>.lv2-lc-run:nth-child(15))))>.wc-coupon:where(:not(.wc-skel-card)){display:grid;grid-template-rows:subgrid;grid-template-columns:minmax(0,1fr);grid-row:span 16;row-gap:0}
.wc-grid:not(:has(>.wc-coupon>.lv2-lc-run:nth-child(15)))>.wc-coupon:not(.wc-skel-card)>:not(.lv2-lc-top){margin:6px 0 0}
.wc-grid>.wc-coupon>.lv2-lc-state{grid-row:-3/-2}
.wc-grid>.wc-coupon>.wc-matched{grid-row:-2/-1}
.wc-more{display:flex;align-items:center;justify-content:center;width:100%;height:44px;margin:12px 0 0;padding:0 18px;border-radius:10px;border:1px solid var(--line);background:var(--surface);color:var(--text);font:inherit;font-size:14px;font-weight:700;cursor:pointer;transition:border-color .15s,transform .12s}
.wc-more:active{transform:scale(.98)}
@media(hover:hover){.wc-more:hover{border-color:color-mix(in srgb,var(--brand) 55%,var(--line))}}
.wc-none{display:flex;flex-wrap:wrap;align-items:center;gap:4px 6px;min-height:52px;margin:0;padding:12px 14px;border-radius:14px;border:1px solid var(--line);background:var(--surface);color:var(--dim);font-size:14px;line-height:20px}
.wc-none a{color:inherit;text-decoration:none}.wc-none a b{color:var(--text)}
@media(hover:hover){.wc-none a:hover b{text-decoration:underline}}
.wc-skel-card{height:241px;border-color:transparent;background:linear-gradient(100deg,var(--surface) 30%,var(--surface-2) 50%,var(--surface) 70%);background-size:220% 100%;animation:lv2Shimmer 1.2s linear infinite}
.wc-skel-card.is-upcoming{height:150px}
/* the per-breakpoint caps (lobby-v2.js hideAt / needAt) */
@media(max-width:760px){.wc-grid>.hide-p{display:none}.wc-more:not(.need-p){display:none}}
@media(min-width:761px){
 .lv2-sec.wc-sec{margin-top:28px}
 .wc-sec .lv2-sec-head,.wc-shelf .lv2-sec-head{min-height:44px}
 .wc-sec .lv2-eyebrow,.wc-shelf .lv2-eyebrow{font-size:12px}
 .wc-sec .lv2-sec-head h2,.wc-shelf .lv2-sec-head h2{font-size:22px;line-height:26px}
 .wc-chips{flex-wrap:wrap;margin:0 0 12px;padding:0;overflow:visible;mask-image:none;-webkit-mask-image:none}
 .wc-chip{height:34px;font-size:13px}
 .wc-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 12px;margin-bottom:-12px}
 .wc-grid>.wc-coupon{margin-bottom:12px}
 .wc-more{width:auto;height:40px;margin:16px auto 0}
}
@media(min-width:761px) and (max-width:1023px){.wc-grid>.hide-t{display:none}.wc-more:not(.need-t){display:none}}
@media(min-width:1024px) and (max-width:1279px){.wc-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.wc-grid>.hide-d{display:none}.wc-more:not(.need-d){display:none}}
@media(min-width:1280px) and (max-width:1599px){.wc-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.wc-grid>.hide-w{display:none}.wc-more:not(.need-w){display:none}}
@media(min-width:1600px){.wc-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.wc-grid>.hide-x{display:none}.wc-more:not(.need-x){display:none}}

/* ---------- F. CASINO (§3.5): four lanes + PAYS UP TO, the recent-wins strip, one poster row per shelf ---------- */
.wc-lanes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
/* F7 (fix round): a lane is a grid; the text owns its cells and the art (the trimmed LANE_ART copy) is contain-fitted into the free
   cell, standing in its bottom-right corner, so it is as large as the card allows and never under the title, count or CTA. Phone
   (4:3): title + count on one line, the CTA bottom-left, the art right of the CTA; 761+ (5:2, 16:9): the text column left, the art
   right; >= 1200 beside the stat card (a lane taller than wide): title + count stacked, the CTA top-right, the art the full width
   below. The art keeps >= 5 px to every edge and its corners inside the r18 clip. The art box is out of flow (absolute on its grid
   area) and its own track is minmax(0, 1fr): otherwise the image's natural size feeds the track sizing and the art outgrows the card */
.wc-lane{position:relative;display:grid;grid-template:"copy copy" auto "cta art" minmax(0,1fr)/auto minmax(0,1fr);gap:4px;min-width:0;aspect-ratio:4/3;margin:0;padding:10px 4px 7px 10px;overflow:hidden;isolation:isolate;border-radius:18px;border:1px solid var(--line);color:#fff;font:inherit;text-align:left;cursor:pointer;
 background:radial-gradient(60% 80% at 85% 60%,rgba(247,210,42,.18),transparent 70%),linear-gradient(135deg,#120A1F,#2A0746);transition:transform .18s var(--lv2-ease),box-shadow .18s var(--lv2-ease)}
.wc-lane .artbox{grid-area:art;position:absolute;inset:0;z-index:1;display:grid;grid-template:minmax(0,1fr)/minmax(0,1fr);place-items:center;pointer-events:none}
.wc-lane .artbox>img{display:block;width:100%;height:100%;object-fit:contain;object-position:100% 100%;transform:none;animation:none}
.wc-lane .artbox>.icon{display:none;width:40%;height:40%;color:var(--brand);opacity:.85}
.wc-lane .artbox:not(:has(>img))>.icon,.wc-lane .artbox.is-noart>.icon{display:block}
.wc-lane .artbox.is-noart>img{display:none}
.wc-lane-copy{grid-area:copy;position:relative;z-index:2;display:flex;flex-wrap:wrap;align-items:center;gap:5px;min-width:0}
.wc-lane-title{font-size:16px;font-weight:700;line-height:20px;text-shadow:0 1px 8px rgba(0,0,0,.55)}
.wc-lane-n{display:inline-flex;align-items:center;height:20px;padding:0 5px;border-radius:6px;background:rgba(255,255,255,.12);color:#E6DDF0;font-size:12px;font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}
.wc-lane-cta{grid-area:cta;align-self:end;justify-self:start;position:relative;z-index:2;margin:0 0 2px;display:inline-flex;align-items:center;gap:4px;color:var(--brand);font-size:13px;font-weight:700}
.wc-lane-cta>i{font-style:normal;transition:transform .18s var(--lv2-ease)}
.wc-lane:active{transform:scale(.98)}
@media(hover:hover) and (min-width:1024px){.wc-lane:hover{transform:translateY(-2px);box-shadow:0 10px 22px -12px rgba(0,0,0,.6),0 0 0 1px color-mix(in srgb,var(--brand) 40%,transparent)}.wc-lane:hover .wc-lane-cta>i{transform:translateX(3px)}}
.wc-fomo-slot:empty{display:none}
.wc-lanes>.wc-fomo-slot{grid-column:1/-1;min-width:0}
/* PAYS UP TO: a card of fact rows (the content of the FOMO band's max card) */
.wc-stat,.wc-wins{display:flex;flex-direction:column;gap:6px;height:100%;padding:12px 14px;border-radius:14px;background:var(--surface);border:1px solid var(--line)}
:is(.wc-stat-head,.wc-wins-head){display:flex;align-items:center;gap:8px;min-height:24px}
:is(.wc-stat-head,.wc-wins-head) .lv2-eyebrow{margin:0;font-size:11px;font-weight:900;letter-spacing:.12em;line-height:14px;color:var(--brand);white-space:nowrap}
.wc-wins-head>small{color:var(--faint);font-size:12px;font-weight:600;white-space:nowrap}
.wc-stat-link{margin-left:auto;display:inline-flex;align-items:center;gap:4px;min-height:24px;color:var(--brand);font-size:13px;font-weight:700;text-decoration:none;white-space:nowrap}
.wc-stat-link .icon{width:12px;height:12px}
:root:not([data-theme="dark"]) :is(.wc-stat-link,.wc-stat-who>b){color:var(--accent-ink,var(--brand))}
.wc-stat-list,.wc-wins-list{list-style:none;margin:0;padding:0}
.wc-stat-list{display:flex;flex-direction:column;flex:1}
.wc-stat-list>li{display:flex;align-items:center;gap:10px;flex:1;min-height:40px;min-width:0;border-top:1px solid var(--line)}
.wc-stat-list>li:first-child{border-top:0}
.wc-stat-stack{flex:0 0 46px;display:flex}
.wc-stat-stack>*{flex:0 0 auto;width:24px;height:32px;border-radius:6px;object-fit:cover;border:1px solid var(--line);background:var(--surface-2);box-shadow:0 2px 6px rgba(0,0,0,.28)}
.wc-stat-stack>*+*{margin-left:-13px}
.wc-stat-who{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.wc-stat-who>b{font-size:17px;font-weight:900;line-height:20px;color:var(--brand);font-variant-numeric:tabular-nums}
.wc-stat-who>small{font-size:12px;font-weight:600;line-height:15px;color:var(--dim);overflow-wrap:break-word}
.wc-stat-pay{flex:0 0 auto;display:flex;flex-direction:column;align-items:flex-end;gap:1px;text-align:right}
.wc-stat-pay>em{font-style:normal;font-size:15px;font-weight:700;line-height:18px;color:var(--text);font-variant-numeric:tabular-nums}
.wc-stat-pay>small{font-size:12px;font-weight:600;line-height:15px;color:var(--faint);white-space:nowrap}
/* RECENT WINS: one strip, 44-px items; a snap rail on the phone, up to four across from 761 */
.wc-casino>.wc-fomo-slot.is-wins{display:block;margin:20px 0 0}
.wc-wins-list{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin:0 -14px;padding:0 14px;scroll-padding:0 14px}
.wc-wins-list::-webkit-scrollbar{display:none}
.wc-wins-list:focus-visible{outline:2px solid var(--brand);outline-offset:2px;border-radius:8px}
.wc-wins-list>li{flex:0 0 82%;scroll-snap-align:start;display:flex;align-items:center;gap:10px;min-height:44px;min-width:0}
.wc-wins-list>li:only-child{flex-basis:100%}
.wc-win-thumb{flex:0 0 auto;width:30px;height:40px;border-radius:6px;object-fit:cover;border:1px solid var(--line);background:var(--surface-2)}
span.wc-win-thumb{display:grid;place-items:center;color:var(--brand)}span.wc-win-thumb .icon{width:15px;height:15px}
.wc-win-txt{min-width:0;color:var(--dim);font-size:13px;font-weight:600;line-height:17px;overflow-wrap:break-word}
.wc-win-txt>b{color:var(--text);font-weight:700}.wc-win-txt>em{font-style:normal;font-weight:700;color:var(--positive,#2FD27A);font-variant-numeric:tabular-nums}
.wc-win-txt>small{color:var(--faint);font-size:12px;white-space:nowrap}
/* lanes by width (D10): phone 2 x 2 at 4:3 (board); 761-1023 2 x 2 at 5:2; 1024-1199 4 at 16:9 with the stat card full width;
   >= 1200 one row of 4 lanes + the stat card, the lanes stretched to the card's height (the cell layouts: F7 above) */
@media(min-width:761px){
 .wc-lanes{gap:12px}.wc-lane{aspect-ratio:5/2;grid-template:"copy art" minmax(0,1fr) "cta art" auto/auto minmax(0,1fr);gap:0 8px;padding:12px 6px 8px 14px}
 .wc-lane-copy{flex-direction:column;align-items:flex-start;flex-wrap:nowrap;gap:6px}.wc-lane-n{padding:0 6px}.wc-lane-cta{margin-bottom:3px}
 .wc-lane-title{font-size:17px;line-height:21px}
 .wc-stat-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:24px}
 .wc-stat-list>li:nth-child(2){border-top:0}
 .wc-wins-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 16px;overflow:visible;margin:0;padding:0}
 .wc-wins-list>li:only-child{grid-column:1/-1}
}
@media(min-width:1024px){.wc-lanes{grid-template-columns:repeat(4,minmax(0,1fr))}.wc-lane{aspect-ratio:16/9}
 .wc-lanes.n3{grid-template-columns:repeat(3,minmax(0,1fr))}.wc-lanes.n2{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1200px){
 .wc-lanes:has(>.wc-fomo-slot>.wc-stat){grid-template-columns:repeat(4,minmax(0,1fr)) minmax(300px,1.3fr)}
 .wc-lanes.n3:has(>.wc-fomo-slot>.wc-stat){grid-template-columns:repeat(3,minmax(0,1fr)) minmax(300px,1.3fr)}
 .wc-lanes.n2:has(>.wc-fomo-slot>.wc-stat){grid-template-columns:repeat(2,minmax(0,1fr)) minmax(300px,1.3fr)}
 .wc-lanes.n1:has(>.wc-fomo-slot>.wc-stat){grid-template-columns:minmax(0,1fr) minmax(300px,1.3fr)}
 .wc-lanes:has(>.wc-fomo-slot>.wc-stat)>.wc-fomo-slot{grid-column:auto}
 .wc-lanes:has(>.wc-fomo-slot>.wc-stat)>.wc-lane{aspect-ratio:auto;align-self:stretch;min-height:180px;
  grid-template:"copy cta" auto "art art" minmax(0,1fr)/minmax(0,1fr) auto;gap:6px 8px;padding:10px 4px 6px 14px}
 .wc-lanes:has(>.wc-fomo-slot>.wc-stat) .wc-lane-copy{gap:4px}
 .wc-lanes:has(>.wc-fomo-slot>.wc-stat) .wc-lane-cta{align-self:start;margin:1px 10px 0 0}
 .wc-lanes:has(>.wc-fomo-slot>.wc-stat) .artbox{left:-10px}
 .wc-lanes:has(>.wc-fomo-slot>.wc-stat) .wc-stat-list{display:flex}.wc-lanes:has(>.wc-fomo-slot>.wc-stat) .wc-stat-list>li:nth-child(2){border-top:1px solid var(--line)}
 .wc-wins-list{grid-template-columns:repeat(4,minmax(0,1fr))}
}
/* SHELVES: one row each; the DOM carries up to 12 tiles and CSS shows exactly tilesPerRow (6 / 8 / 10 / 12, D11) so a resize never
   re-renders; the phone is a snap rail sized to 3 whole posters + a 40 % peek (F3: the rail's 4-px shadow room under the posters
   is given back by a -4 margin, so every casino block is 20 / 28 below the last one's visible bottom and the footer 32) */
.wc-shelf{margin-top:20px}
.wc-shelf .lv2-seg>button{font-size:12px;font-weight:700;padding:6px 12px}
.wc-shelf .lv2-grid5{gap:8px}
.wc-shelf .lv2-grid5 .game-art{border-radius:10px;border-color:var(--line)}
.wc-shelf .lv2-grid5 .game-art::after{content:none;display:none}
.wc-shelf .lv2-grid5 .game-card:hover .game-art{transform:none;box-shadow:0 4px 10px -6px rgba(0,0,0,.5)}
.wc-shelf .lv2-grid5 .game-card:hover .game-art img{transform:none}
.wc-shelf .lv2-grid5 :is(.game-preview-badge,.lv2-badge){top:6px;left:6px;padding:3px 6px;border-radius:6px;font-size:11px;font-weight:700;letter-spacing:.04em;line-height:1.1}
.wc-shelf .lv2-grid5 .game-art .game-art-word{font-size:12px}
@media(max-width:760px){
 .wc-shelf .lv2-grid5{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:clamp(88px,calc((100vw - var(--lv2-gutter) - 16px)/3.4),132px);
  overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;
  margin:0 calc(-1*var(--lv2-gutter)) -4px;padding:2px var(--lv2-gutter) 4px;scroll-padding:0 var(--lv2-gutter)}
 .wc-shelf .lv2-grid5::-webkit-scrollbar{display:none}
 .wc-shelf .lv2-grid5>*{scroll-snap-align:start}
}
@media(min-width:761px){
 .wc-shelf,.wc-casino>.wc-fomo-slot.is-wins{margin-top:28px}.wc-shelf .lv2-seg>button{font-size:13px}.wc-shelf .lv2-grid5{gap:10px}
 .wc-shelf .lv2-grid5{grid-template-columns:repeat(6,minmax(0,1fr))}
}
@media(min-width:761px) and (max-width:1023px){.wc-shelf .lv2-grid5>:nth-child(n+7){display:none}}
@media(min-width:1024px){.wc-shelf .lv2-grid5{grid-template-columns:repeat(8,minmax(0,1fr))}.wc-shelf .lv2-grid5 :is(.game-preview-badge,.lv2-badge){font-size:12px}}
@media(min-width:1024px) and (max-width:1199px){.wc-shelf .lv2-grid5>:nth-child(n+9){display:none}}
@media(min-width:1200px){.wc-shelf .lv2-grid5{grid-template-columns:repeat(10,minmax(0,1fr))}}
@media(min-width:1200px) and (max-width:1599px){.wc-shelf .lv2-grid5>:nth-child(n+11){display:none}}
@media(min-width:1600px){.wc-shelf .lv2-grid5{grid-template-columns:repeat(12,minmax(0,1fr))}}
@media(hover:hover) and (min-width:1024px){
 .wc-shelf .lv2-grid5 .game-card:hover .game-art{transform:translateY(-2px);box-shadow:0 10px 20px -10px rgba(0,0,0,.6),0 0 0 1px color-mix(in srgb,var(--brand) 45%,transparent)}
 .wc-shelf .lv2-grid5 .game-card:hover .game-caption{transform:translateY(-2px)}
}
/* F3: the desktop hover caption (SPEC "as today") lies over the poster's foot instead of holding its own height, invisible, under
   every poster (the 48-64 px that pushed each next block down); a row is exactly as tall as its posters */
@media(min-width:761px){
 .wc-shelf .lv2-grid5 .game-card{position:relative}
 .wc-shelf .lv2-grid5 .game-card .game-caption{position:absolute;z-index:3;left:1px;right:1px;bottom:1px;align-items:flex-end;padding:28px 8px 8px;border-radius:0 0 9px 9px;
  background:linear-gradient(180deg,transparent,rgba(10,5,18,.9) 55%);transform:translateY(4px);pointer-events:none}
 html .wc-shelf .lv2-grid5 .game-caption h3{margin:0;color:#fff;font-size:14px;line-height:1.25}
 html .wc-shelf .lv2-grid5 .game-caption span{color:rgba(255,255,255,.72);font-size:12px;line-height:1.3}
 .wc-shelf .lv2-grid5 .game-caption-arrow{display:none}
}

/* ---------- G. TRUST FOOTER (§3.7 + rulings): replaces the shared one-line footer on the home only ---------- */
main.route-home:has(.wc-foot)>.footer{display:none}
.wc-foot{margin-top:32px;padding:24px 0 8px;border-top:1px solid var(--line);color:var(--dim)}
.wc-foot-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px 16px}
.wc-foot-brand{grid-column:1/-1;min-width:0}
.wc-foot-lockup{display:inline-flex;align-items:center;min-height:44px;color:var(--text);text-decoration:none;font-size:20px;font-weight:900}
/* F2: markHTML renders both lockups; one shows per theme, by the masthead's rule (brand.css .brand .lockup-*) */
.wc-foot-lockup .lockup-dark,[data-theme="dark"] .wc-foot-lockup .lockup-light{display:none}
[data-theme="dark"] .wc-foot-lockup .lockup-dark{display:inline-block}
.wc-foot p{margin:8px 0 0;max-width:44em;font-size:13px;font-weight:400;line-height:1.5}
.wc-foot p.wc-foot-kind{margin-top:2px;color:var(--text);font-weight:700}
.wc-foot p.wc-foot-pay{color:var(--text);font-weight:600}
.wc-foot-col{display:flex;flex-direction:column;align-items:flex-start;min-width:0}
.wc-foot-col>h4{margin:0 0 4px;font-size:11px;font-weight:900;letter-spacing:.12em;line-height:14px;text-transform:uppercase;color:var(--brand)}
:root:not([data-theme="dark"]) .wc-foot-col>h4{color:var(--accent-ink,var(--brand))}
.wc-foot-link{display:inline-flex;align-items:center;min-height:40px;margin:0;padding:0;border:0;background:none;color:var(--dim);font:inherit;font-size:13px;font-weight:600;text-align:left;text-decoration:none;cursor:pointer}
.wc-foot-link:hover{color:var(--text)}
.wc-foot-link:focus-visible{outline:2px solid var(--brand);outline-offset:2px;border-radius:6px}
.wc-foot-legal{display:flex;align-items:center;gap:12px;margin-top:20px;padding-top:14px;border-top:1px solid var(--line);color:var(--faint)}
.wc-foot-legal>p{margin:0;font-size:12px;font-weight:400}
.wc-age{flex:0 0 auto;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;border:1px solid var(--border,var(--line));color:var(--dim);font-size:11px;font-weight:900}
@media(min-width:761px){
 .wc-foot-grid{grid-template-columns:2fr 1fr 1fr 1fr;gap:24px}.wc-foot-brand{grid-column:auto}
 .wc-foot-col>h4{font-size:12px;line-height:15px;margin-bottom:6px}.wc-foot-link{min-height:36px;padding:0}
}
@media(min-width:1024px){.wc-age{font-size:12px}}

/* ---------- H. DAY THEME (gold text fails on white: accent ink; lanes and ball chips go light) + REDUCED MOTION ---------- */
:root:not([data-theme="dark"]) :is(.wc-tag.time b,.wc-sec .lv2-eyebrow,.wc-shelf .lv2-eyebrow,.wc-stat-head .lv2-eyebrow,.wc-wins-head .lv2-eyebrow,.wc-sec .lv2-sec-link,.wc-shelf .lv2-sec-link,span.wc-win-thumb){color:var(--accent-ink,var(--brand))}
:root:not([data-theme="dark"]) .wc-tag.time{background:color-mix(in srgb,var(--accent-ink,var(--brand)) 9%,transparent)}
:root:not([data-theme="dark"]) .wc-coupon:not(.is-hero) :is(.lv2-lc-tv,.lv2-lc-star.saved){color:var(--accent-ink,var(--brand))}
:root:not([data-theme="dark"]) .wc-coupon:not(.is-hero) .lv2-lc-six>i.w{background:#FFE1E8;color:#8A1033}
:root:not([data-theme="dark"]) .wc-coupon:not(.is-hero) .lv2-lc-six>i.four{background:#DCEEFF;color:#0B4F86}
:root:not([data-theme="dark"]) .wc-coupon:not(.is-hero) .lv2-lc-six>i.six{background:#FFF1C2;color:#6E4A00}
:root:not([data-theme="dark"]) .wc-lane{color:var(--text);background:radial-gradient(60% 80% at 85% 60%,rgba(247,210,42,.30),transparent 70%),linear-gradient(135deg,#FBF7FF,#EFE4FA)}
:root:not([data-theme="dark"]) .wc-lane-title{text-shadow:0 1px 6px rgba(255,255,255,.8)}
:root:not([data-theme="dark"]) .wc-lane-n{background:rgba(55,9,91,.08);color:var(--accent-ink,var(--dim))}
:root:not([data-theme="dark"]) :is(.wc-lane-cta,.wc-lane .artbox>.icon){color:var(--accent-ink,var(--brand))}
@media(prefers-reduced-motion:reduce){
 :is(.wc-wallet .wc-skel,.wc-skel-card,.wc-strip .wc-live-n>i,.wc-coupon .lv2-lc-badge>i){animation:none!important}
 :is(.wc-coupon,.wc-lane,.wc-lane-cta>i,.wc-chip,.wc-coupon .lv2-odd,.wc-shelf .game-art,.header-deposit){transition:none!important}
 .wc-coupon:hover,.wc-lane:hover,.wc-lane:active,.wc-shelf .lv2-grid5 .game-card:hover .game-art{transform:none!important}
}
/* SYSTEM §6 targets: the drawn size stays (chip 34/36, link T2), a centred ::after takes a 44-px tap (the brand.css idiom) */
:is(.wc-chip,.wc-stat-link,.wc-foot-link,.wc-more){position:relative}
:is(.wc-chip,.wc-stat-link,.wc-foot-link,.wc-more)::after{content:"";position:absolute;left:50%;top:50%;width:max(100%,44px);height:max(100%,44px);transform:translate(-50%,-50%)}
html .wc-coupon .team-mark:has(img)>span{visibility:hidden}
@media(min-width:1024px){:is(.wc-stat-head,.wc-wins-head) .lv2-eyebrow{font-size:12px}}
/* ---- the Betby fixed-odds model (lane wincricket-betby-live 2026-10-14, SPEC sportsbook-model-betby §B) ----
   One price per outcome: the live back pill re-toned to the neutral raised cell (.lv2-odd's --wc-odd-* tones), the outcome
   key left, the price the hero; gold when selected (.lv2-odd.is-selected), green / red flashes on a move, a lock when
   suspended or not offered, "—" without a price; no size line. Only markets the server shaped (model:"fixed") use it. */
.lv2-odd.fx{flex-direction:row;justify-content:space-between;align-items:center;gap:8px;padding:0 12px}
.lv2-odd.fx .fx-k{font-style:normal;font-size:12px;font-weight:700;line-height:1;letter-spacing:.02em;color:var(--wc-odd-label,var(--muted));white-space:nowrap}
.lv2-odd.fx b{font-size:16px;font-weight:var(--wc-odd-weight,800);letter-spacing:-.01em}
.lv2-odd.fx.is-selected .fx-k{color:inherit}
/* an unpriced or suspended pill stays legible (AA): no global button:disabled fade, the "—" and the key take the label tone
   (on the always-dark hero card its --faint); only the lock glyph dims */
.lv2-odd.fx:is(.is-lock,.is-off){cursor:default;opacity:1}
.lv2-odd.fx.is-lock b{display:inline-flex;opacity:.72}.lv2-odd.fx.is-lock svg{width:14px;height:14px}
.lv2-odd.fx.is-lock .fx-k{opacity:.8}
html .wc-coupon .lv2-odd.fx.is-off{color:var(--wc-odd-label,var(--faint))}
html .wc-coupon.is-hero .lv2-odd.fx.is-off{color:var(--faint)}
.lv2-odd.fx.is-off .fx-k{color:inherit}
html .wc-coupon .lv2-odd.fx{padding:0 12px}
html .wc-coupon .lv2-odd.fx.is-lock{background:var(--wc-odd-bg,var(--control));color:var(--wc-odd-price,var(--muted))}
.wc-coupon.is-fx .lv2-odd{grid-column:3/5}
:root .wc-coupon.is-fx .lv2-lc-cols>.b{grid-column:3/5;color:var(--wc-odd-label,var(--faint));letter-spacing:.12em}
:root .wc-coupon.is-hero.is-fx .lv2-lc-cols>.b{color:var(--faint)} /* the hero card is night glass in both themes */
.wc-coupon.is-fx .lv2-lc-cols>.l{display:none}
/* a 3-way match (The Draw) featured on the phone hero rail: its third row lifts the panel 50px onto the CTA, so the rail grows by
   it and the panel keeps the exchange two-row top (fixed markets carry no matched volume, so the pick falls to the rail order and a
   3-way lead is common under fixed) */
@media(max-width:760px){.lv2-hb:not(.is-home):has(>.lv2-hb-lead .wc-coupon.is-hero.is-fx>.lv2-lc-run:nth-child(3 of .lv2-lc-run)){--hb-h:422px}}
/* the sportsbook list card (views.js eventCard): one cell per outcome, no B / L legend */
.outcome-pair:has(.lv2-odd.fx) span:has(>.back-label){display:none}
.outcome-prices:has(>.lv2-odd.fx){display:grid;grid-template-columns:minmax(0,1fr)}
.outcome-prices>.lv2-odd.fx{width:100%;min-height:44px}

/* fixed model · event page (SPEC §B.2): winner markets as one price per runner, lines as Under | Over rows on the
   existing session grid; tabs are the existing market-kind chips */
.fx-grid{display:grid;gap:6px;padding:10px 12px}.fx-grid.n1{grid-template-columns:minmax(0,1fr)}.fx-grid.n2{grid-template-columns:repeat(2,minmax(0,1fr))}.fx-grid.n3{grid-template-columns:repeat(3,minmax(0,1fr))}
.fx-grid .lv2-odd.fx{min-height:46px;min-width:0}.fx-grid .lv2-odd.fx .fx-k{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left;font-style:normal}
.fx-grid .lv2-odd.fx b{flex:none}
.fx-line .lv2-odd.fx{justify-content:center;padding:0 6px;min-height:44px}.fx-line .lv2-odd.fx .fx-k{display:none}
.fx-ou{text-align:center;font:700 10px/1 var(--font);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.fx-st{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:700;color:var(--muted)}.fx-st svg{width:12px;height:12px}
.fx-line .session-name{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:8px;row-gap:2px}.fx-line .session-name strong{flex:1 1 100%}
.fx-line .session-name small{color:var(--muted);font-size:11px}.fx-line .session-name small b{color:var(--text);font-weight:800}
@media(max-width:760px){.fx-grid{padding:8px 9px;gap:5px}.fx-grid.n3 .lv2-odd.fx{flex-direction:column;justify-content:center;gap:1px;padding:4px 6px}.fx-grid.n3 .lv2-odd.fx .fx-k{max-width:100%;text-align:center}}
/* the fixed betslip (SPEC §B.3): the live slip and its tones; only the odds-changed prompt and the price move are new */
#fx-odds.is-up{animation:var(--wc-pill-flash-up,lv2FlashUp) var(--wc-flash-ms,.45s) ease-out}#fx-odds.is-down{animation:var(--wc-pill-flash-down,lv2FlashDown) var(--wc-flash-ms,.45s) ease-out}
.fx-chg{display:flex;align-items:center;justify-content:space-between;gap:10px}.fx-chg>span{min-width:0}.fx-chg s{opacity:.75}.fx-chg b{font-weight:800}
.fx-accept{flex:none;min-height:32px;padding:0 16px;border:0;border-radius:999px;background:var(--brand);color:var(--brand-ink);font:800 12px/1 var(--font);letter-spacing:.02em;cursor:pointer}
.fx-accept:disabled{opacity:.5;cursor:default}
.inline-betslip .fx-chg .fx-accept{min-height:28px;padding:0 14px;font-size:11px}
@media(prefers-reduced-motion:reduce){#fx-odds:is(.is-up,.is-down){animation:none}}
/* fix round (orchestrator read 2026-10-14, owner: "Its too purple" / "Especially bet pills"): every fixed price sits on a NEUTRAL
   raised cell, no brand tint. Night: graphite a few steps above the row, a hairline neutral rim, white price; day: a light grey
   cell, near-black price. The hero card is night glass in both themes, so it takes the night cell. Selected stays gold (dark
   ink), a move flashes green / red, suspended shows the lock. The slip's odds box is the same cell. */
:root{--fx-cell-top:#F1F2F4;--fx-cell:#E5E7EA;--fx-rim:rgba(16,18,22,.14);--fx-rim-hover:rgba(16,18,22,.34);--fx-ink:#0F1115;--fx-key:#474C55}
:root[data-theme="dark"],.wc-coupon.is-hero{--fx-cell-top:#35373D;--fx-cell:#2A2C31;--fx-rim:rgba(255,255,255,.11);--fx-rim-hover:rgba(255,255,255,.28);--fx-ink:#FFFFFF;--fx-key:#B7BBC3}
.lv2-odd.fx{--wc-odd-bg:linear-gradient(180deg,var(--fx-cell-top),var(--fx-cell));--wc-odd-rim:var(--fx-rim);--wc-odd-rim-hover:var(--fx-rim-hover);--wc-odd-hi:transparent;--wc-odd-price:var(--fx-ink);--wc-odd-label:var(--fx-key);--wc-odd-sel-ink:#0F1115}
html .wc-coupon.is-hero .lv2-odd.fx.is-off,:root .wc-coupon.is-fx .lv2-lc-cols>.b,:root .wc-coupon.is-hero.is-fx .lv2-lc-cols>.b{color:var(--fx-key)}
#fx-odds.fixed-odds,.inline-slip-price:has(#fx-odds){background:linear-gradient(180deg,var(--fx-cell-top),var(--fx-cell));border:1px solid var(--fx-rim);color:var(--fx-ink)}
.inline-slip-price:has(#fx-odds)>span{color:var(--fx-key)}
/* ---- the team-colour stripe (lane wincricket-mobile-polish 2026-10-14, SPEC wincricket-team-colour-pills §1-§3): a fixed price for
   one of the two teams wears its team's colour as a 3 px left stripe; the cell and the ink stay neutral, hover tints the cell
   faintly, selected stays gold without the stripe, a lock keeps a faded stripe. Tokens (--tc, --tc-soft, --tc-soft-top, --tc-rim)
   come per colour from lobby-v2.js (a constructed sheet keyed by data-tc: CSP style-src 'self'). ---- */
.lv2-odd.fx.tc{box-shadow:inset 3px 0 0 var(--tc),inset 0 0 0 1px var(--fx-rim)}
@media(hover:hover){.lv2-odd.fx.tc:not(:disabled,.is-selected,.is-readonly):hover{background:linear-gradient(180deg,var(--tc-soft-top),var(--tc-soft));box-shadow:inset 3px 0 0 var(--tc),inset 0 0 0 1px var(--tc-rim)}}
.lv2-odd.fx.tc.is-selected{box-shadow:none}
.lv2-odd.fx.tc:is(.is-lock,.is-off){box-shadow:inset 3px 0 0 color-mix(in srgb,var(--tc) 45%,transparent),inset 0 0 0 1px var(--fx-rim)}
.lv2-odd.is-readonly.tc{box-shadow:inset 3px 0 0 var(--tc),inset 0 0 0 1px var(--wc-odd-rim,transparent),inset 0 1px 0 var(--wc-odd-hi,transparent)}
.lv2-odd.is-readonly.tc.is-off{box-shadow:inset 3px 0 0 color-mix(in srgb,var(--tc) 45%,transparent),inset 0 0 0 1px var(--wc-odd-rim,transparent),inset 0 1px 0 var(--wc-odd-hi,transparent)}
#fx-odds.fixed-odds.tc,.inline-slip-price.tc:has(#fx-odds){box-shadow:inset 3px 0 0 var(--tc)}
.fx-pick.tc{border-left:3px solid var(--tc);padding-left:10px}
.compact-teams>div:has(>.tc-bar){position:relative;padding-left:10px}
.tc-bar{position:absolute;left:0;top:50%;width:4px;height:22px;margin-top:-11px;border-radius:2px;background:var(--tc)}
/* the sports explorer's display-only cards on the shared pill (quoteGrid): equal cells, one row per side */
.wc-quote-prices:has(>.lv2-qg){display:block}
.lv2-qg{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.lv2-qg.n2{grid-template-columns:repeat(2,minmax(0,1fr))}
.lv2-qg.n1{grid-template-columns:1fr}
.lv2-qg.bl{grid-auto-flow:column;grid-template-rows:auto auto}
.lv2-qg .lv2-odd{min-height:44px}
.lv2-qg .lv2-odd:not(.fx) .fx-k{font-style:normal;font-size:12px;font-weight:700;line-height:1;opacity:.8;margin-bottom:3px}
#fx-odds:not(.tc){--tc:transparent}
/* lane wincricket-mobile-polish (owner 2026-10-14: "pills not properly spaced"): the explorer's read-only grid drops the old quote
   label styling (10 px dim ink), the list card names each outcome by its key (the card head names the teams; fixed pills carry the
   key themselves), and the outcome cells are one equal grid with the label and price together */
.wc-quote-prices>.lv2-qg>.lv2-odd{display:flex;margin:0;font-size:inherit;color:var(--wc-odd-price,var(--back-ink));white-space:normal;overflow:visible}
.wc-quote-prices>.lv2-qg>.lv2-odd.lay{color:var(--lay-ink)}
.outcome-pair:has(.lv2-odd.fx) .outcome-label>span[title]{display:none}
.outcome-pair:has(.lv2-odd.fx) .outcome-label:not(:has(>:not([title],:has(>.back-label)))){display:none}
.outcome-board:has(.lv2-odd.fx){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.outcome-board.three-outcomes:has(.lv2-odd.fx){grid-template-columns:repeat(3,minmax(0,1fr))}
.outcome-board:has(.lv2-odd.fx)>.outcome-pair{min-width:0;margin:0}
/* the Live page's one featured card above Match centre (views.js sportsPage): a full-width card on the phone, one card wide on desktop */
.lv2-sec.is-featured .lv2-live-rail{overflow:visible;scroll-snap-type:none}
.lv2-sec.is-featured .lv2-live-card{flex:1 1 100%;max-width:560px}
@media(max-width:760px){
 /* mobile polish (owner 2026-10-14: "Some text wayy too small to read"), phones only: the 12-px floor for the runs earlier rules here and in the
    shared sheets set at 9-11 px (brand.css carries the rest; this sheet loads last, so the equal-specificity ones live here) */
 html .wc-strip .wc-live-n,html :is(.wc-sec,.wc-shelf,.lv2-sec-head,.wc-stat-head,.wc-wins-head) .lv2-eyebrow,html .wc-board-heading h2>span,
 html .inline-betslip :is(.quote-row,.quote-total)>span,html :is(.stake-presets,.inline-betslip) .amount-chip{font-size:12px}
 html .inline-betslip :is(.quote-row,.quote-total)>span{line-height:14px}
 html .wc-board-heading .wc-clear{font-size:12px!important}
 html .wc-coupon .lv2-lc-six>i{width:20px;height:20px;font-size:12px}
 /* the exchange model on the phone: the same floor (labels, sizes, the slip's side badge and toggle) and 15-px prices on the coupon and the ladder */
 html body :is(.lv2-lc-run,.lv2-odds)>.lv2-odd>small,html body .wc-quote-prices>.wc-waiting,html body .match-meta .market-paused,
 html body .inline-slip-market>.badge,html body .inline-betslip .backlay-toggle>button{font-size:12px}
 html body .outcome-prices .odds strong,html body .price-depth .odds>strong{font-size:15px}
 html body .outcome-prices .odds.px-l6 strong{font-size:13px}
 html body .outcome-prices .odds:is(.px-l7,.px-l8) strong{font-size:12px}
 /* the exchange coupon + ladder cells at the 44-px tap height (sportsbook.css sets 33-38 px), the no-price cell included */
 html body :is(.outcome-prices,.price-depth) .odds,html body :is(.outcome-prices,.price-depth) .odds.with-depth{min-height:44px}
 /* sign-in and sign-up: auth.css sets the field labels at 11 px and the label-row link at 10 px */
 html .auth-shell :is(.access-field label,.access-field .label-row .text-link),html .auth-shell .is-register .registration-details label{font-size:12px}
 /* fix2 (owner: no visible text under 12 px on phones; the C4 gate skipped aria-hidden text): the coupon column heads "1 · X · 2" / BACK LAY,
    the line markets' sub-labels (fixed and exchange), the exchange ladder's runner names (compact.css 11 px), the position slot, and the team marks: in the coupon's 28-px box the initials at 12 px; everywhere else
    (Live Match centre, explorer quotes, scoreboard, ladder: 20-24 px rounds that set 6-8 px initials) a mark with no crest / flag / face
    shows a neutral glyph instead of the initials; a mark with an image keeps the image over them */
 html .wc-coupon .lv2-lc-cols,html body .session-name>strong,html body .session-name small,html .fx-line .session-name small,
 html body .exchange-runner>span,html body .sp-position{font-size:12px}
 html .wc-coupon .team-mark:not(:has(img)):not(.wc-draw){font-size:12px;letter-spacing:-.04em}
 html body .team-mark:not(:has(img)):not(.wc-draw):not(.wc-coupon .team-mark)>span{display:none}
 html body .team-mark:not(:has(img)):not(.wc-draw):not(.wc-coupon .team-mark)::before{content:"";width:58%;height:58%;background:currentColor;opacity:.75;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2 4 5v6.2c0 5 3.4 9.3 8 10.8 4.6-1.5 8-5.8 8-10.8V5z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2 4 5v6.2c0 5 3.4 9.3 8 10.8 4.6-1.5 8-5.8 8-10.8V5z'/%3E%3C/svg%3E") center/contain no-repeat}
}
/* the TV badge (owner 2026-10-14; wynbook's "TV" market badge): every card / row whose event has a stream (event.hasVideo, live or
   upcoming), in the meta row next to LIVE / the time; a 16-px monoline glyph + "TV" at 12 px in the brand ink; the tap area of the
   link / button reaches 44 px through ::after */
html .lv2-tv{position:relative;display:inline-flex;align-items:center;gap:4px;flex:0 0 auto;box-sizing:border-box;height:24px;min-height:0;min-width:0;margin:0;padding:0 7px 0 5px;border:1px solid color-mix(in srgb,var(--brand) 60%,transparent);border-radius:6px;background:color-mix(in srgb,var(--brand) 14%,transparent);color:var(--brand);font-family:inherit;font-size:12px;font-weight:800;line-height:1;letter-spacing:.06em;text-decoration:none;white-space:nowrap;vertical-align:middle;cursor:pointer}
html .lv2-tv>span{font-size:12px;line-height:1}
html :is(a,button).lv2-tv::after{content:"";position:absolute;inset:-10px -4px}
html .lv2-tv>.lv2-tv-ic{width:16px;height:16px;flex:0 0 16px;margin:0;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
:root:not([data-theme="dark"]) .lv2-tv{color:var(--accent-ink,var(--brand));border-color:color-mix(in srgb,var(--accent-ink,var(--brand)) 55%,transparent);background:color-mix(in srgb,var(--accent-ink,var(--brand)) 9%,transparent)}
:root:not([data-theme="dark"]) .wc-coupon.is-hero .lv2-tv{color:var(--brand);border-color:color-mix(in srgb,var(--brand) 60%,transparent);background:color-mix(in srgb,var(--brand) 14%,transparent)}
:is(.lv2-live-top,.wc-highlight-top)>.lv2-tv{margin-left:auto;margin-right:6px}
:is(.wc-quote-meta,.scoreboard-top)>.lv2-tv{margin-left:8px;margin-right:auto}
.event-top>.lv2-tv{margin-left:6px}

/* ---------- I. THE COMPACT MATCH ROW (lane wincricket-sports-rows 2026-10-14; lobby-v2.js matchRow) ----------
   One anatomy for every match list (home live / coming up, the sports board, explorer sports): a 24-px meta line over the teams
   stacked at left (20-px crest, name, gold score per team) and one row of equal 44-px price cells at right; a thin 40-px league
   head. Every size sits on the 4-px grid; hairlines are inset shadows so they add no pixel; the cell width is one variable, so
   every row of a list has the same price edges (2-way cells split the 3-way block). */
.wc-row{--row-cell:56px;--row-gap:4px;position:relative;display:flex;flex-direction:column;gap:4px;min-width:0;margin:0;padding:8px 12px;border:0;border-radius:0;background:var(--surface);color:var(--text)}
@media(min-width:391px){.wc-row{--row-cell:60px}}
@media(max-width:430px){.wc-row .wc-sc>em.ov{display:none}}
.wc-row+.wc-row,.wc-league-events>*+.wc-row,.wc-league-events>.wc-row+*{border:0;box-shadow:inset 0 1px 0 var(--lv2-hair,var(--line))}
.wc-row-meta{display:flex;align-items:center;gap:8px;height:24px;min-width:0;font-size:12px;line-height:16px;font-weight:600;color:var(--dim);white-space:nowrap}
.wc-row-live{display:inline-flex;align-items:center;gap:4px;height:20px;flex:none;color:var(--live,#FF5C5C);font-weight:800;letter-spacing:.04em}
.wc-row-live>i{width:6px;height:6px;border-radius:50%;background:#FF4D4D;animation:lv2Pulse 1.6s ease-in-out infinite}
.wc-row-st,.wc-row-when{min-width:0;overflow:hidden;text-overflow:ellipsis}
.wc-row-tag{display:inline-flex;align-items:center;flex:none;height:20px;padding:0 6px;border-radius:6px;background:var(--control);color:var(--dim);font-size:12px;font-weight:700;font-style:normal}
.wc-row-lg{display:none;align-items:center;gap:4px;min-width:0;overflow:hidden;color:var(--faint)}
.wc-row-lg>.icon{width:12px;height:12px;flex:none}
.wc-row-lg>span{overflow:hidden;text-overflow:ellipsis}
.wc-row-tools{display:flex;align-items:center;gap:8px;flex:none;margin-left:auto}
html .wc-row .lv2-tv{height:20px;padding:0 6px 0 4px;gap:4px;border-radius:6px}
html .wc-row .lv2-tv>span{font-size:12px;line-height:12px}
html .wc-row :is(a,button).lv2-tv::after{inset:-12px -4px}   /* the 20-px row chip keeps a 44-px tap (the shared -10 fits the 24-px chip) */
html .wc-row .lv2-lc-star{position:relative;display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;min-width:24px;min-height:24px;margin:0 -4px 0 0;padding:0;border:0;background:none}
html .wc-row .lv2-lc-star::after{content:"";position:absolute;inset:-10px}
html .wc-row .lv2-lc-star .icon{width:16px;height:16px}
.wc-row-body{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;min-width:0}
.wc-row-teams{display:grid;grid-auto-rows:22px;min-width:0;color:inherit;text-decoration:none}
.wc-row-t{display:grid;grid-template-columns:20px minmax(0,1fr) auto;align-items:center;gap:8px;min-width:0}
.wc-row-t:only-child{grid-template-columns:minmax(0,1fr);grid-row:span 2}
html .wc-row .team-mark{width:20px;height:20px;min-width:20px;flex:0 0 20px;margin:0;font-size:12px}
html .wc-row .team-mark:has(img)>span{visibility:hidden}
.wc-row-n{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px;line-height:22px;font-weight:700;color:var(--text);text-decoration:none}
.wc-row .wc-sc{display:flex;align-items:center;justify-content:flex-end;gap:6px;font-size:13px;line-height:22px;font-weight:800;color:var(--brand);font-variant-numeric:tabular-nums;white-space:nowrap}
.wc-row .wc-sc>i{font-style:normal;color:var(--dim)}.wc-row .wc-sc>i.cur{color:inherit}.wc-row .wc-sc>em{font-style:normal;color:var(--faint)}
:root:not([data-theme="dark"]) .wc-row .wc-sc{color:var(--accent-ink,var(--brand))}
.wc-row-px{display:grid;grid-template-columns:repeat(3,var(--row-cell));gap:var(--row-gap);flex:none}
.wc-row-px.n2{grid-template-columns:repeat(2,calc((3*var(--row-cell) + var(--row-gap))/2))}
.wc-row-px.n1{grid-template-columns:calc(3*var(--row-cell) + 2*var(--row-gap))}
.wc-row-px>.lv2-qg{display:contents}
html .wc-row .lv2-odd{box-sizing:border-box;height:44px;min-height:44px;min-width:0;margin:0;padding:0 4px;border-radius:8px}
html .wc-row .lv2-odd.fx{flex-direction:column;justify-content:center;align-items:center;gap:4px;padding:0 4px}
html .wc-row .lv2-odd.fx .fx-k{max-width:100%;overflow:hidden;text-overflow:ellipsis;font-size:12px;line-height:12px}
html .wc-row .lv2-odd b{font-size:15px;line-height:16px}
.wc-row-lines{display:grid;gap:4px}
.wc-row-l{display:grid;grid-template-columns:20px minmax(0,1fr) auto auto;align-items:center;gap:8px;min-height:44px}
.wc-row-bl{display:grid;grid-template-columns:repeat(2,var(--row-cell));gap:var(--row-gap)}
.wc-row-l>.wc-row-bl{grid-column:4}
html .wc-row .lv2-odd small{font-size:12px;line-height:12px}
/* league heads: the home groups' and the sports board's, one line (glyph, league, count + chevron) */
html :is(.wc-lg-head,.wc-league>header){display:flex;align-items:center;gap:8px;box-sizing:border-box;height:40px;margin:0;padding:0 0 0 12px;border:0;background:var(--surface-3,var(--surface));box-shadow:inset 0 -1px 0 var(--lv2-hair,var(--line))}
html :is(.wc-lg-head,.wc-league>header)>.icon{width:16px;height:16px;flex:none;color:var(--brand)}
:root:not([data-theme="dark"]) :is(.wc-lg-head,.wc-league>header)>.icon{color:var(--accent-ink,var(--brand))}
html :is(.wc-lg-head,.wc-league>header)>span{display:block;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px;line-height:16px;font-weight:700;color:var(--text)}
html .wc-league>header>span>small{display:none}
html .wc-league>header>span>strong{font:inherit;color:inherit}
html :is(.wc-lg-head,.wc-league>header) .wc-league-more{display:flex;align-items:center;justify-content:flex-end;gap:4px;height:40px;min-width:44px;margin:0;padding:0 12px 0 8px;font-size:12px!important;line-height:16px;font-weight:700;color:var(--faint)}
html :is(.wc-lg-head,.wc-league>header) .wc-league-more>.icon{width:12px;height:12px}
html .wc-grid.wc-rows,html .wc-match-groups:has(>.wc-league .wc-row){gap:8px;margin-bottom:0}
html .wc-match-groups:has(>.wc-league .wc-row){display:flex;flex-direction:column}
html :is(.wc-lg,.wc-league:has(.wc-row)){min-width:0;border:1px solid var(--lv2-hair,var(--line));border-radius:12px;overflow:hidden;background:var(--surface)}
html .wc-league-events:has(>.wc-row){display:block}
@media(max-width:760px){.wc-rows .hide-p{display:none}}
/* ≥ 761 px: the home lists keep their grid of cards (each group is display:contents, every row a card naming its league, the
   prices under the teams); the sports board keeps its rows, with wider cells */
@media(min-width:761px){
 .wc-row{--row-cell:64px}
 html .wc-rows>.wc-lg,html .wc-rows .wc-lg-rows{display:contents}
 html .wc-rows .wc-lg-head{display:none}
 html .wc-grid.wc-rows{gap:0 12px;margin-bottom:-12px}
 html .wc-rows .wc-row{margin-bottom:12px;border:1px solid var(--lv2-hair,var(--line));border-radius:12px;box-shadow:none}
 .wc-rows .wc-row-lg{display:flex}
 .wc-rows .wc-row-body{grid-template-columns:minmax(0,1fr);gap:8px}
 .wc-rows .wc-row-px{grid-template-columns:repeat(3,minmax(0,1fr))}
 .wc-rows .wc-row-px.n2{grid-template-columns:repeat(2,minmax(0,1fr))}.wc-rows .wc-row-px.n1{grid-template-columns:minmax(0,1fr)}
}
@media(min-width:761px) and (max-width:1023px){.wc-rows .wc-row.hide-t{display:none}}
@media(min-width:1024px) and (max-width:1279px){.wc-rows .wc-row.hide-d{display:none}}
@media(min-width:1280px) and (max-width:1599px){.wc-rows .wc-row.hide-w{display:none}}
@media(min-width:1600px){.wc-rows .wc-row.hide-x{display:none}}
html .wc-row .lv2-odd.is-paused{opacity:.64;cursor:default}
/* ---------- J. LOADING WITHOUT LAYOUT SHIFT (lane wincricket-home-cls 2026-10-15; lobby-v2.js dataWait) ----------
   Until the feed's first full pass, home / Sports / Live show placeholders at the size of what replaces them: the hero coupon
   (2-way: top 24 + labels 14 + two 44-px runs), the sport strip (56-px art + two label lines), the live list (chips 36, league
   heads 40, rows 88; desktop cards 142), the Live page's featured card and the board's leagues. One shimmer (the .wc-skel-card
   one), still under reduced motion. The UPDATES strip keeps its place from the first paint: shown (label + a bar) until
   news.json has answered, and on phones at its card height (45.5) before the card mode applies, so nothing below it moves. */
.wc-skel-chips>i{background:linear-gradient(100deg,var(--surface) 30%,var(--surface-2) 50%,var(--surface) 70%);background-size:220% 100%;animation:lv2Shimmer 1.2s linear infinite;box-shadow:inset 0 0 0 1px var(--line)}
/* a tile placeholder is the tile's own art ground (the art lands on it) with the sheen passing over it */
html .wc-skel-tile>span.lv2-cat-art{background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.12) 50%,transparent 70%) 0 0/220% 100%,var(--lv2-art-grad);animation:lv2Shimmer 1.2s linear infinite}
/* the text bars: the masthead balance skeleton's shimmer (A), which reads on a surface */
:is(.wc-skel-tile>b>i,.wc-skel-head>i,.wc-skel-row>i,.wc-skel-live>i){background:linear-gradient(100deg,var(--control) 30%,var(--surface-3,var(--surface-2)) 50%,var(--control) 70%);background-size:220% 100%;animation:lv2Shimmer 1.2s linear infinite}
.wc-skel-tile{cursor:default;pointer-events:none}
.wc-skel-tile>.lv2-cat-art{box-shadow:none}
.wc-skel-tile>b>i{display:inline-block;width:44px;height:9px;border-radius:4px;vertical-align:middle}
.wc-skel-tile>b>i+br+i{width:28px}
.wc-skel-fm{pointer-events:none}
.wc-skel-fm>i{display:block;height:44px;border-radius:10px;background:linear-gradient(100deg,rgba(255,255,255,.06) 30%,rgba(255,255,255,.13) 50%,rgba(255,255,255,.06) 70%);background-size:220% 100%;animation:lv2Shimmer 1.2s linear infinite}
.wc-skel-fm>i:first-child{width:62%;height:24px;border-radius:6px}
.wc-skel-fm>i:nth-child(2){width:22%;height:14px;margin-left:auto;border-radius:4px}
.wc-skel-chips>i{flex:0 0 auto;width:72px;height:36px;border-radius:999px}
.wc-skel-chips>i:nth-child(2){width:110px}.wc-skel-chips>i:nth-child(3){width:96px}
.wc-skel-head>i{display:block;width:44%;height:12px;border-radius:4px}
.wc-league>header.wc-skel-head{display:flex;align-items:center;height:40px;padding:0 12px}
html .wc-row.wc-skel-row{justify-content:center;gap:10px;height:88px}
.wc-skel-row>i{display:block;width:58%;height:14px;border-radius:4px}
.wc-skel-row>i+i{width:36%}
.wc-skel-live{pointer-events:none;justify-content:center;min-height:var(--wc-skel-live-h,173px);box-shadow:none}
.wc-skel-live>i{display:block;height:14px;width:48%;border-radius:4px}
.wc-skel-live>i:nth-child(3),.wc-skel-live>i:nth-child(4){height:44px;width:100%;border-radius:10px}
@media(max-width:760px){html .wc-strip .wc-skel-tile>b{min-height:30.5px}}
@media(max-width:380px){.wc-skel-fm>i:first-child{height:38px}}
@media(min-width:761px){html .wc-rows .wc-row.wc-skel-row{height:142px}.wc-skel-chips>i{height:34px}}
@media(prefers-reduced-motion:reduce){:is(html .wc-skel-tile>span.lv2-cat-art,.wc-skel-tile>b>i,.wc-skel-chips>i,.wc-skel-head>i,.wc-skel-row>i,.wc-skel-live>i,.wc-skel-fm>i){animation:none!important}}
html:not(.wc-news-set) .tenant-news[hidden]{display:flex}
.tenant-news[hidden] .tenant-news-headline{font-size:0}
.tenant-news[hidden] .tenant-news-headline::before{content:"";display:block;width:min(240px,70%);height:10px;border-radius:5px;background:linear-gradient(100deg,rgba(255,255,255,.08) 30%,rgba(255,255,255,.18) 50%,rgba(255,255,255,.08) 70%);background-size:220% 100%;animation:lv2Shimmer 1.2s linear infinite}
.tenant-news[hidden] .tenant-news-pause{visibility:hidden}
@media(prefers-reduced-motion:reduce){.tenant-news[hidden] .tenant-news-headline::before{animation:none}}
@media(max-width:760px){.tenant-news:not([data-news-card]){height:auto;min-height:45.5px}}
/* racing on the fixed model (racing build 2026-10-15): the race page's single "Odds" column — runner left, one price cell
   right; no depth, no Lay, no team stripe. Non-runners show NR; a race not yet open for betting shows its price dimmed. */
.fx-race-table{display:grid;padding:4px 12px 8px}
.fx-race-head,.fx-race-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(84px,112px);gap:10px;align-items:center}
.fx-race-head{font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--faint);padding:6px 0}
.fx-race-head>span:last-child{text-align:center}
.fx-race-row{min-height:50px;border-top:1px solid var(--line)}
.fx-race-row .race-runner-name{min-width:0;flex-wrap:wrap}
.fx-race-row .race-runner-name strong{overflow-wrap:anywhere}
.fx-race-row .lv2-odd.fx{width:100%;min-height:44px;justify-content:center}
.fx-race-row .lv2-odd.fx .fx-k:empty{display:none}
.fx-race-row .lv2-odd.fx.is-paused b{opacity:.55}
@media(max-width:760px){.fx-race-table{padding:2px 9px 6px}.fx-race-head,.fx-race-row{grid-template-columns:minmax(0,1fr) 84px;gap:8px}}
/* race off (2026-10-15): the locked cell names the state; it has to fit the 84 px phone column */
.fx-race-row .lv2-odd.fx.fx-race-off{justify-content:center;padding:0 6px}
.fx-race-row .lv2-odd.fx.fx-race-off b{align-items:center;gap:4px;font-size:12px;font-weight:700;white-space:nowrap}
.fx-race-row .lv2-odd.fx.fx-race-off svg{width:12px;height:12px;flex:none}

/* =====================================================================================================================
   K. THE PIXEL-PERFECT REDESIGN (owner GO 2026-10-16; docs/operations/wincricket-redesign-2026-10-16, TARGET-SPEC.md)
   Betby's grid, sizes and behaviour in wincricket's purple, gold and orange. One frame per league, fixed price columns
   (72 x 44 desktop, 48 x 44 phone; a 2-way block never stretches; the market title sits once in the league strip), the odds
   cell states, the docked slip column from 1280 px, the phone slip bar + sheet, the sport-filtered agenda, the event page.
   Text floor 12 px. Nothing here may clip or overlap text (owner 2026-10-16; gate tools/no-clip-overlap.mjs).
   ===================================================================================================================== */
:root{
 --r-cell-w:72px;--r-cell-h:44px;--r-cell-gap:8px;--r-row-px:16px;--r-row-py:12px;--r-gut:24px;
 --r-surface:#FFFFFF;--r-surface-2:#F6F1F9;--r-surface-3:#EFE5F7;--r-hair:#E4D8EC;--r-div:#EFE8F3;
 --r-text:#06070E;--r-dim:#4E3C5B;--r-faint:#6F6479;--r-accent:#37095B;--r-gold:#F7D22A;--r-gold-ink:#06070E;
 --r-live:#C24E00;--r-live-dot:#E5262E;--r-up:#1B7A43;--r-down:#C4002F;
 --r-strip:#F6F1F9;--r-strip-ink:#37095B;--r-score-bg:#F3ECF8;--r-score-ink:#37095B;
 --r-lock-bg:repeating-linear-gradient(135deg,#F6F1F9 0 6px,#F1EAF6 6px 12px);--r-lock-rim:#E4D8EC;--r-lock-ink:#4E3C5B;
 --r-na-bg:rgba(6,7,14,.04);--r-na-op:.4;--r-shadow:0 1px 2px rgba(55,9,91,.06),0 4px 16px rgba(55,9,91,.06);--r-sheet-shadow:0 -12px 40px rgba(6,7,14,.24);
 --fx-cell-top:#FFFFFF;--fx-cell:#F2F0F5;--fx-rim:#DCD6E3;--fx-rim-hover:rgba(55,9,91,.45);--fx-ink:#06070E;--fx-key:#5E5468;
}
:root[data-theme="dark"]{
 --r-surface:#120A1F;--r-surface-2:#1B1030;--r-surface-3:#241540;--r-hair:rgba(247,210,42,.16);--r-div:rgba(255,255,255,.07);
 --r-text:#F6F2FA;--r-dim:#D9CFE6;--r-faint:#B9AECB;--r-accent:#F8D846;
 --r-live:#FF7A1A;--r-live-dot:#FF3B3B;--r-up:#37D67A;--r-down:#FF5C5C;
 --r-strip:linear-gradient(90deg,#2A0746 0%,#1B1030 70%);--r-strip-ink:#F6F2FA;--r-score-bg:#2A0746;--r-score-ink:#F7D22A;
 --r-lock-bg:repeating-linear-gradient(135deg,#1B1030 0 6px,#180E2B 6px 12px);--r-lock-rim:rgba(247,210,42,.18);--r-lock-ink:#B9AECB;
 --r-na-bg:rgba(255,255,255,.05);--r-na-op:.35;--r-shadow:none;--r-sheet-shadow:0 -12px 40px rgba(0,0,0,.6);
 --fx-cell-top:#2E2B37;--fx-cell:#24222B;--fx-rim:rgba(255,255,255,.08);--fx-rim-hover:rgba(247,210,42,.6);--fx-ink:#FFFFFF;--fx-key:#B9B2C7;
}
.wc-coupon.is-hero{--fx-cell-top:#2E2B37;--fx-cell:#24222B;--fx-rim:rgba(255,255,255,.08);--fx-rim-hover:rgba(247,210,42,.6);--fx-ink:#FFFFFF;--fx-key:#B9B2C7}
@media(max-width:760px){:root{--r-cell-w:48px;--r-cell-gap:4px;--r-row-px:12px;--r-row-py:8px;--r-gut:12px;--r-na-op:.5}}
@media(min-width:761px) and (max-width:1023px){:root{--r-gut:16px}}
@media(min-width:1600px){:root{--r-gut:32px}}

/* ---- K1. shell: content starts 16 px under the masthead (12 on phones) on every route (D3); the phone masthead gets search (D10) ---- */
@media(min-width:1024px){html body .main{padding-top:16px}}
@media(max-width:1023px){html body .main{padding-top:12px}}
@media(max-width:1023px){
 html body .masthead .search-trigger{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;min-width:40px;padding:0;border-radius:10px;border:1px solid var(--r-hair);background:transparent;color:var(--r-dim);flex:none}
 html body .masthead .search-trigger>span,html body .masthead .search-trigger>kbd{display:none}
 html body .masthead .search-trigger .icon{width:20px;height:20px}
}
@media(max-width:760px){html body .masthead .header-actions>[data-action="theme"]{display:none}}
html body .floating-slip{display:none!important}

/* ---- K2. the category strip (D5, D15): not sticky; tile 64 (60 phone) r 16 (14); the name on ONE line, a 16-px count line ---- */
html body .lv2-catnav,html body .lv2-catnav.wc-strip{position:static;top:auto;margin:0 0 24px;padding:0;background:none;border:0;backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:none}
html body .lv2-catnav .lv2-catnav-track{gap:8px;padding:2px 24px 2px 2px;-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 24px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 24px),transparent)}
html body .lv2-catnav .lv2-cat.wc-cat{flex:0 0 auto;width:auto;min-width:84px;max-width:none;gap:6px;padding:0 2px;border-radius:12px}
html body .lv2-catnav .lv2-cat.wc-cat>span.lv2-cat-art{width:64px;height:64px;border-radius:16px;background:linear-gradient(180deg,#2A0746,#1B1030);box-shadow:inset 0 0 0 1px rgba(247,210,42,.14);transform:none}
:root:not([data-theme="dark"]) html body .lv2-catnav .lv2-cat.wc-cat>span.lv2-cat-art,:root:not([data-theme="dark"]) body .lv2-catnav .lv2-cat.wc-cat>span.lv2-cat-art{box-shadow:inset 0 0 0 1px rgba(55,9,91,.35)}
html body .lv2-catnav .lv2-cat.wc-cat>span.lv2-cat-art>img{width:52px;height:52px;inset:6px;left:6px;top:6px}
html body .lv2-catnav .lv2-cat.wc-cat.active>span.lv2-cat-art{box-shadow:0 0 0 2px var(--r-gold),0 0 0 5px rgba(247,210,42,.18);transform:none}
html body .lv2-catnav .lv2-cat.wc-cat>b{display:flex;flex-direction:column;align-items:center;gap:0;width:auto;max-width:none;min-height:0;margin:0;overflow:visible;white-space:nowrap;text-overflow:clip;font-size:12px;line-height:16px;font-weight:700;color:var(--r-text)}
html body .lv2-catnav .lv2-cat.wc-cat.active>b>.wc-cn{color:var(--r-accent)}
html body .lv2-catnav .lv2-cat.wc-cat>b>.wc-cc{display:flex;align-items:center;gap:4px;height:16px;margin:0;padding:0;background:none;border-radius:0;font-size:12px;line-height:16px;font-weight:700;color:var(--r-faint);vertical-align:0}
html body .lv2-catnav .lv2-cat.wc-cat>b>.wc-cc>i{width:6px;height:6px;border-radius:50%;background:var(--r-live-dot);flex:none}
@media(max-width:760px){
 html body .lv2-catnav .lv2-catnav-track{padding-left:0}
 html body .lv2-catnav,html body .lv2-catnav.wc-strip{margin:0 0 20px}
 html body .lv2-catnav .lv2-cat.wc-cat{min-width:72px}
 html body .lv2-catnav .lv2-cat.wc-cat>span.lv2-cat-art{width:60px;height:60px;border-radius:14px}
 html body .lv2-catnav .lv2-cat.wc-cat>span.lv2-cat-art>img{width:48px;height:48px}
}
html body .lv2-catnav.wc-strip{margin-top:24px}
@media(max-width:760px){html body .lv2-catnav.wc-strip{margin-top:20px}}

/* ---- K3. section heads (D16 / audit #11): right-side controls on the title's baseline; one section gap 32 / 24 (audit #12) ---- */
html body .wc-sec{margin-top:32px}
@media(max-width:760px){html body .wc-sec{margin-top:24px}}
html body .wc-sec>.lv2-sec-head{display:flex;align-items:flex-end;gap:16px;margin:0 0 16px}
html body .wc-sec>.lv2-sec-head>div:first-child{display:flex;flex-direction:column;gap:4px;min-width:0;margin-right:auto}
html body .wc-sec>.lv2-sec-head h2{display:flex;align-items:center;gap:8px;margin:0;font-size:24px;line-height:28px;font-weight:900;white-space:nowrap}
html body .wc-sec>.lv2-sec-head h2>small{height:24px;min-width:24px;padding:0 6px;border-radius:6px;background:var(--r-surface-3);color:var(--r-dim);font-size:12px;line-height:24px;font-weight:700;text-align:center}
html body .wc-sec>.lv2-sec-head .lv2-sec-link{display:flex;align-items:center;gap:4px;height:28px;font-size:14px;font-weight:700;color:var(--r-accent);white-space:nowrap;flex:none}
@media(max-width:760px){html body .wc-sec>.lv2-sec-head{margin-bottom:12px;flex-wrap:wrap;row-gap:8px}html body .wc-sec>.lv2-sec-head h2{font-size:20px;line-height:24px}}
.wc-seg{display:flex;padding:3px;gap:2px;border-radius:999px;background:var(--r-surface-2);border:1px solid var(--r-hair);flex:none}
.wc-seg>button{height:26px;padding:0 12px;border:0;border-radius:999px;background:none;font:700 12px/16px var(--font);color:var(--r-dim);white-space:nowrap;cursor:pointer}
.wc-seg>button.is-on{background:var(--r-gold);color:var(--r-gold-ink)}
@media(max-width:760px){html body .wc-up>.lv2-sec-head .wc-seg{order:3;flex-basis:auto}}
.wc-empty-row{padding:16px;border:1px dashed var(--r-hair);border-radius:12px;font-size:14px;line-height:20px;color:var(--r-dim)}
.wc-empty-row a{color:var(--r-accent);font-weight:700;display:inline-flex;align-items:center;gap:4px}
/* chips (sport filter, competitions): 36 h, r full, 14/700, count pill 12/700; active gold; the row ends in a 24-px fade (A14) */
html body .wc-chips{display:flex;gap:8px;margin:0 0 16px;padding:0 24px 0 0;overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 24px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 24px),transparent)}
html body .wc-chips::-webkit-scrollbar{display:none}
html body .wc-chips>.wc-chip{flex:none;height:36px;min-height:36px;display:inline-flex;align-items:center;gap:8px;padding:0 14px 0 12px;border-radius:999px;border:1px solid var(--r-hair);background:var(--r-surface);font-size:14px;line-height:20px;font-weight:700;color:var(--r-dim);white-space:nowrap}
html body .wc-chips>.wc-chip>b{padding:0 6px;border-radius:999px;background:var(--r-surface-3);color:var(--r-dim);font-size:12px;line-height:16px;font-weight:700}
html body .wc-chips>.wc-chip.is-on{background:var(--r-gold);border-color:var(--r-gold);color:var(--r-gold-ink)}
html body .wc-chips>.wc-chip.is-on>b{background:rgba(6,7,14,.14);color:var(--r-gold-ink)}
html body .wc-chips>.wc-chip .icon{width:18px;height:18px}

/* ---- K4. the odds cell (TARGET-SPEC §2 states): one control, label over price; neutral raised pill; gold selected; movers;
   not offered "-" faded; whole-market lock block; "All markets ›" ---- */
html body .lv2-odd.fx,html body .lv2-odd.back,html body .lv2-odd.lay{position:relative}
html body .lv2-odd.fx.is-na{opacity:var(--r-na-op);background:var(--r-na-bg)!important;box-shadow:none!important;cursor:default}
html body .lv2-odd.fx.is-na b{font-weight:700}
html body .lv2-odd.is-na:is(.back,.lay){opacity:var(--r-na-op)}
html body .lv2-odd.fx.is-selected{background:var(--r-gold)!important;box-shadow:none!important;color:#06070E}
html body .lv2-odd.fx.is-selected .fx-k{color:rgba(6,7,14,.72)}html body .lv2-odd.fx.is-selected b{color:#06070E}
@media(hover:hover){html body .lv2-odd.fx:not(:disabled):not(.is-selected):not(.is-readonly):hover{background:linear-gradient(180deg,var(--fx-cell-top),var(--fx-cell));box-shadow:inset 0 0 0 1px var(--fx-rim-hover)}}
:root[data-theme="dark"] body .lv2-odd.fx:not(:disabled):not(.is-selected):not(.is-readonly):hover{background:#37343F}
/* movers: rim + price tint (dark) and an 8 x 5 triangle top-right that stays until the next tick; selected keeps black ink */
html body .lv2-odd.flash-up{box-shadow:inset 0 0 0 1px var(--r-up)}html body .lv2-odd.flash-down{box-shadow:inset 0 0 0 1px var(--r-down)}
:root[data-theme="dark"] body .lv2-odd.flash-up:not(.is-selected) b{color:var(--r-up)}:root[data-theme="dark"] body .lv2-odd.flash-down:not(.is-selected) b{color:var(--r-down)}
html body .lv2-odd:is(.flash-up,.flash-down)::after{content:"";position:absolute;top:5px;right:5px;width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;pointer-events:none}
html body .lv2-odd.flash-up::after{border-bottom:5px solid var(--r-up)}html body .lv2-odd.flash-down::after{border-top:5px solid var(--r-down)}
html body .lv2-odd.is-selected.flash-up::after{border-bottom-color:#0B5D2E}html body .lv2-odd.is-selected.flash-down::after{border-top-color:#9E0F2A}
html body .lv2-odd.is-selected:is(.flash-up,.flash-down){box-shadow:none}
.wc-lock{display:flex;align-items:center;justify-content:center;gap:6px;height:var(--r-cell-h);padding:0 8px;border-radius:8px;background:var(--r-lock-bg);box-shadow:inset 0 0 0 1px var(--r-lock-rim);font-size:12px;line-height:16px;font-weight:700;color:var(--r-lock-ink);white-space:nowrap}
.wc-lock .icon{width:16px;height:16px;flex:none}
.wc-lock-dot{width:6px;height:6px;border-radius:50%;background:var(--r-live);flex:none}
.wc-allm{display:flex;align-items:center;justify-content:center;gap:4px;height:var(--r-cell-h);padding:0 8px;border-radius:8px;border:1px dashed var(--r-hair);font-size:12px;line-height:16px;font-weight:700;color:var(--r-accent);white-space:nowrap;text-decoration:none}
.wc-allm .icon{width:12px;height:12px}

/* ---- K5. the lists: one frame per league (D1 / A2), a 40-px strip with the market title over the price block, rows 96 / 88 ---- */
html body .wc-match-groups.match-list,html body .wc-match-groups:has(>.wc-league .wc-row){display:flex;flex-direction:column;gap:12px;margin:0;padding:0;border:0;border-radius:0;background:none;box-shadow:none;overflow:visible;max-height:none}
html body :is(.wc-lg,.wc-league:has(.wc-row)){border:1px solid var(--r-hair);border-radius:12px;overflow:hidden;background:var(--r-surface);box-shadow:var(--r-shadow)}
html body :is(.wc-lg-head,.wc-league>header){height:40px;gap:8px;padding:0 var(--r-row-px);background:var(--r-strip);color:var(--r-strip-ink);box-shadow:inset 0 -1px 0 var(--r-div)}
html body :is(.wc-lg-head,.wc-league>header)>.icon{width:20px;height:20px;color:var(--r-gold)}
:root:not([data-theme="dark"]) body :is(.wc-lg-head,.wc-league>header)>.icon{color:var(--r-accent)}
html body :is(.wc-lg-head,.wc-league>header)>span:not(.wc-mt){flex:0 1 auto;font-size:12px;line-height:16px;font-weight:700;color:var(--r-strip-ink)}
html body :is(.wc-lg-head,.wc-league>header) .wc-league-more{order:2;flex:none;height:40px;min-width:0;padding:0 4px;color:var(--r-faint);font-size:12px!important}
html body .wc-league>header>.wc-mt{order:3;display:block;flex:none;margin-left:auto;font-size:12px;line-height:16px;font-weight:700;color:var(--r-faint);text-align:center;white-space:nowrap}
html body .wc-league>header>.wc-mt.n1{width:var(--r-cell-w)}html body .wc-league>header>.wc-mt.n2{width:calc(2*var(--r-cell-w) + var(--r-cell-gap))}html body .wc-league>header>.wc-mt.n3{width:calc(3*var(--r-cell-w) + 2*var(--r-cell-gap))}html body .wc-league>header>.wc-mt.nx{width:calc(2*var(--r-cell-w) + var(--r-cell-gap))}
@media(max-width:760px){html body .wc-league>header>.wc-mt{display:none}}
html body .wc-row{--row-cell:var(--r-cell-w);--row-gap:var(--r-cell-gap);gap:4px;padding:var(--r-row-py) var(--r-row-px);background:var(--r-surface)}
html body .wc-row+.wc-row,html body .wc-league-events>*+.wc-row{box-shadow:inset 0 1px 0 var(--r-div)}
html body .wc-row-meta{height:20px;gap:8px;font-size:12px;line-height:16px;font-weight:600;color:var(--r-faint)}
html body .wc-row-when{flex:none;overflow:visible;text-overflow:clip;color:var(--r-dim);font-weight:700}
html body .wc-row-live{height:20px;gap:6px;color:var(--r-live);font-weight:800;letter-spacing:.02em}
html body .wc-row-live>i{background:var(--r-live-dot);box-shadow:0 0 0 3px rgba(255,59,59,.18)}
html body .wc-row-st{flex:none;overflow:visible;text-overflow:clip;white-space:nowrap;color:var(--r-dim);font-weight:700}
html body .wc-row .lv2-tv{height:20px;border-radius:4px;border-color:rgba(247,210,42,.6);background:none}
:root:not([data-theme="dark"]) body .wc-row .lv2-tv{border-color:#37095B;color:#37095B}
html body .wc-row .lv2-lc-star{width:20px;height:20px;min-width:20px;min-height:20px;margin:0}
html body .wc-row .lv2-lc-star::after{inset:-12px}
html body .wc-row-body{grid-template-columns:minmax(0,1fr) auto;gap:8px}
html body .wc-row-teams{grid-auto-rows:22px;row-gap:4px}
html body .wc-row-t{grid-template-columns:20px minmax(0,1fr) auto;gap:6px}
html body .wc-row-n{font-size:14px;line-height:20px;font-weight:600}
html body .wc-row .wc-sc{gap:4px;font-size:13px;line-height:22px}
html body .wc-row .wc-sc{padding:0 6px;min-width:24px;height:22px;border-radius:6px;background:var(--r-score-bg);color:var(--r-score-ink);justify-content:center}
html body .wc-row .wc-sc>em.ov{color:var(--r-faint);font-weight:700}
html body .wc-row-px,html body .wc-row-px.n1,html body .wc-row-px.n2,html body .wc-row-px.n3{display:grid;grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:var(--r-cell-w);gap:var(--r-cell-gap);justify-content:end}
html body .wc-row-px:has(>.wc-lock,>.wc-allm){display:flex;justify-content:flex-end}
html body .wc-row-px.n1>:is(.wc-lock,.wc-allm){width:max(var(--r-cell-w),100%)}
html body .wc-row-px.n2>:is(.wc-lock,.wc-allm){width:calc(2*var(--r-cell-w) + var(--r-cell-gap))}
html body .wc-row-px.n3>:is(.wc-lock,.wc-allm){width:calc(3*var(--r-cell-w) + 2*var(--r-cell-gap))}
html body .wc-row .lv2-odd{height:var(--r-cell-h);min-height:var(--r-cell-h);padding:0 2px;border-radius:8px}
html body .wc-row .lv2-odd.fx{gap:0}
html body .wc-row .lv2-odd.fx .fx-k{font-size:12px;line-height:14px;font-weight:600;overflow:visible;text-overflow:clip}
html body .wc-row .lv2-odd b{font-size:15px;line-height:18px;font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:-.01em}
@media(max-width:760px){html body .wc-row .lv2-odd b{font-size:14px}}
html body .wc-row-bl{grid-template-columns:repeat(2,var(--r-cell-w));gap:var(--r-cell-gap)}
/* phones: lists run full-bleed (no side frame) so team names keep >= 180 px at 390 (D8 / A5) */
@media(max-width:760px){
 html body .wc-match-groups.match-list,html body .wc-grid.wc-rows{margin-left:calc(-1*var(--r-gut));margin-right:calc(-1*var(--r-gut))}
 html body :is(.wc-lg,.wc-league:has(.wc-row)){border-radius:0;border-left:0;border-right:0;box-shadow:none}
 html body .wc-match-groups.match-list,html body .wc-grid.wc-rows{gap:8px}
 html body .wc-row .wc-sc{min-width:20px;padding:0 4px}
}
html body .wc-row-l{min-height:44px}

/* ---- K6. Betby match cards (owner addendum 2026-10-16 "we should do match cards in betby style"): category + competition head,
   the status line (period / start time, TV, star), crest + name with a right-aligned tabular score, the market name as served over one
   row of equal label|price buttons; cards in a row share one height (the market + buttons sit at the bottom). Home grids from 761 px,
   the agenda, the hero's featured match and the Live page's featured card. ---- */
@media(min-width:761px){
 html body .wc-grid.wc-rows{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:0;align-items:stretch}
 html body .wc-rows .wc-row{display:flex;flex-direction:column;gap:12px;margin:0;padding:12px;height:100%;border:1px solid var(--r-hair);border-radius:12px;background:var(--r-surface);box-shadow:var(--r-shadow)}
 html body .wc-rows .wc-card-hd{display:flex;flex-direction:column;gap:0;min-width:0}
 html body .wc-rows .wc-card-cat{font-size:12px;line-height:16px;font-weight:600;color:var(--r-faint);text-transform:uppercase;letter-spacing:.06em;white-space:nowrap}
 html body .wc-rows .wc-card-comp{font-size:14px;line-height:20px;font-weight:600;color:var(--r-text);overflow-wrap:anywhere;min-height:20px}
 html body .wc-rows .wc-row-meta{display:flex;height:20px;gap:8px}
 html body .wc-rows .wc-row-meta>.wc-row-lg{display:none}
 html body .wc-rows .wc-row-meta>.wc-row-when{color:var(--r-text)}
 html body .wc-rows .wc-row-meta>.wc-row-st{text-transform:none}
 html body .wc-rows .wc-row-body{display:flex;flex-direction:column;align-items:stretch;gap:0;flex:1;min-width:0;text-align:left}
 html body .wc-rows .wc-row-teams{display:grid;grid-auto-rows:22px;row-gap:4px}
 html body .wc-rows .wc-row-t{grid-template-columns:20px minmax(0,1fr) auto;gap:8px}
 html body .wc-rows .wc-row .wc-sc{min-width:0;height:22px;padding:0;background:none;border-radius:0;color:var(--r-text);font-size:14px;line-height:22px;font-weight:800;text-align:right;justify-content:flex-end}
 html body .wc-rows .wc-row .wc-sc>em.ov{display:none}
 html body .wc-rows .wc-row .wc-sc.wc-ytb{font-size:12px;font-weight:600;color:var(--r-faint)}
 html body .wc-rows .wc-card-mk{margin:auto 0 0;padding-top:12px;font-size:12px;line-height:16px;font-weight:600;color:var(--r-faint);overflow-wrap:anywhere}
 html body .wc-rows .wc-row-px,html body .wc-rows .wc-row-px.n1,html body .wc-rows .wc-row-px.n2,html body .wc-rows .wc-row-px.n3{display:grid;grid-auto-flow:row;grid-auto-columns:auto;gap:8px;justify-content:stretch;margin-top:6px}
 html body .wc-rows .wc-row-px.n2{grid-template-columns:repeat(2,minmax(0,1fr))}html body .wc-rows .wc-row-px.n3{grid-template-columns:repeat(3,minmax(0,1fr))}html body .wc-rows .wc-row-px.n1{grid-template-columns:minmax(0,1fr)}
 html body .wc-rows .wc-row .lv2-odd.fx,html body .wc-rows .wc-row .lv2-odd.is-readonly{height:40px;min-height:40px;flex-direction:row;justify-content:space-between;align-items:center;gap:6px;padding:0 12px 0 14px}
 html body .wc-rows .wc-row-px.n3 .lv2-odd.fx{padding:0 10px 0 12px}
 html body .wc-rows .wc-row .lv2-odd .fx-k{font-size:12px;line-height:14px;font-weight:600}
 html body .wc-rows .wc-row .lv2-odd.fx:is(.flash-up,.flash-down)::after{position:static;margin-left:auto;order:2}
 html body .wc-rows .wc-row .lv2-odd.fx b{order:3}
 html body .wc-rows .wc-row-px:has(>.wc-lock,>.wc-allm){display:flex}
 html body .wc-rows .wc-row-px>:is(.wc-lock,.wc-allm){width:100%;height:40px}
 html body .wc-rows .wc-row-lines{gap:4px}
}

 html body .wc-cardset .wc-row{display:flex;flex-direction:column;gap:12px;margin:0;padding:12px;height:100%;border:1px solid var(--r-hair);border-radius:12px;background:var(--r-surface);box-shadow:var(--r-shadow)}
 html body .wc-cardset .wc-card-hd{display:flex;flex-direction:column;gap:0;min-width:0}
 html body .wc-cardset .wc-card-cat{font-size:12px;line-height:16px;font-weight:600;color:var(--r-faint);text-transform:uppercase;letter-spacing:.06em;white-space:nowrap}
 html body .wc-cardset .wc-card-comp{font-size:14px;line-height:20px;font-weight:600;color:var(--r-text);overflow-wrap:anywhere;min-height:20px}
 html body .wc-cardset .wc-row-meta{display:flex;height:20px;gap:8px}
 html body .wc-cardset .wc-row-meta>.wc-row-lg{display:none}
 html body .wc-cardset .wc-row-meta>.wc-row-when{color:var(--r-text)}
 html body .wc-cardset .wc-row-meta>.wc-row-st{text-transform:none}
 html body .wc-cardset .wc-row-body{display:flex;flex-direction:column;align-items:stretch;gap:0;flex:1;min-width:0;text-align:left}
 html body .wc-cardset .wc-row-teams{display:grid;grid-auto-rows:22px;row-gap:4px}
 html body .wc-cardset .wc-row-t{grid-template-columns:20px minmax(0,1fr) auto;gap:8px}
 html body .wc-cardset .wc-row .wc-sc{min-width:0;height:22px;padding:0;background:none;border-radius:0;color:var(--r-text);font-size:14px;line-height:22px;font-weight:800;text-align:right;justify-content:flex-end}
 html body .wc-cardset .wc-row .wc-sc>em.ov{display:none}
 html body .wc-cardset .wc-row .wc-sc.wc-ytb{font-size:12px;font-weight:600;color:var(--r-faint)}
 html body .wc-cardset .wc-card-mk{margin:auto 0 0;padding-top:12px;font-size:12px;line-height:16px;font-weight:600;color:var(--r-faint);overflow-wrap:anywhere}
 html body .wc-cardset .wc-row-px,html body .wc-cardset .wc-row-px.n1,html body .wc-cardset .wc-row-px.n2,html body .wc-cardset .wc-row-px.n3{display:grid;grid-auto-flow:row;grid-auto-columns:auto;gap:8px;justify-content:stretch;margin-top:6px}
 html body .wc-cardset .wc-row-px.n2{grid-template-columns:repeat(2,minmax(0,1fr))}html body .wc-cardset .wc-row-px.n3{grid-template-columns:repeat(3,minmax(0,1fr))}html body .wc-cardset .wc-row-px.n1{grid-template-columns:minmax(0,1fr)}
 html body .wc-cardset .wc-row .lv2-odd.fx,html body .wc-cardset .wc-row .lv2-odd.is-readonly{height:40px;min-height:40px;flex-direction:row;justify-content:space-between;align-items:center;gap:6px;padding:0 12px 0 14px}
 html body .wc-cardset .wc-row-px.n3 .lv2-odd.fx{padding:0 10px 0 12px}
 html body .wc-cardset .wc-row .lv2-odd .fx-k{font-size:12px;line-height:14px;font-weight:600}
 html body .wc-cardset .wc-row .lv2-odd.fx:is(.flash-up,.flash-down)::after{position:static;margin-left:auto;order:2}
 html body .wc-cardset .wc-row .lv2-odd.fx b{order:3}
 html body .wc-cardset .wc-row-px:has(>.wc-lock,>.wc-allm){display:flex}
 html body .wc-cardset .wc-row-px>:is(.wc-lock,.wc-allm){width:100%;height:40px}
 html body .wc-cardset .wc-row-lines{gap:4px}
.wc-card-hd{display:none}
html body .wc-row .wc-card-mk{display:none}
html body :is(.wc-cardset,.wc-rows) .wc-row .wc-card-mk{display:block}
@media(max-width:760px){html body .wc-rows .wc-row .wc-card-mk,html body .wc-rows .wc-card-hd{display:none}html body .wc-rows .wc-ytb{display:none}}
html body .wc-cardset .wc-card-hd{display:flex}
@media(min-width:761px){html body .wc-rows .wc-card-hd{display:flex}}
/* the agenda: cards stacked inside the panel are frameless rows with dividers (never a card in a card) */
html body .wc-ag-list .wc-row{border:0;border-radius:0;box-shadow:none;padding:12px 16px;height:auto}
html body .wc-ag-list .wc-row+.wc-row{box-shadow:inset 0 1px 0 var(--r-div)}
html body .wc-ag-list .wc-row .lv2-odd.fx{height:36px;min-height:36px}
/* the hero's featured card is night glass on the hero art in both themes */
html body .wc-hero-set{--r-surface:rgba(18,10,31,.92);--r-hair:rgba(247,210,42,.28);--r-text:#F6F2FA;--r-dim:#D9CFE6;--r-faint:#B9AECB;--r-accent:#F8D846;--r-live:#FF7A1A;--r-div:rgba(255,255,255,.07);--r-shadow:none;--fx-cell-top:#2E2B37;--fx-cell:#24222B;--fx-rim:rgba(255,255,255,.08);--fx-ink:#FFFFFF;--fx-key:#B9B2C7;--r-na-bg:rgba(255,255,255,.05)}
html body .wc-hero-set .wc-row{backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);color:#F6F2FA}
html body .wc-hero-set .wc-row-n{color:#F6F2FA}
html body .wc-hero-set .lv2-tv{color:#F8D846;border-color:rgba(247,210,42,.6)}
html body .wc-feat-set{max-width:440px}
@media(min-width:1024px){html body .wc-grid.wc-rows{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(min-width:1280px){html body .wc-grid.wc-rows{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(min-width:1600px){html body .wc-grid.wc-rows{grid-template-columns:repeat(5,minmax(0,1fr))}}
.wc-tail{display:none}
@media(min-width:761px){
 .wc-tail{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:172px;padding:12px;border:1px dashed var(--r-hair);border-radius:12px;color:var(--r-dim);text-align:center;text-decoration:none;font-size:14px;line-height:20px;font-weight:700}
 .wc-tail>b{font-size:32px;line-height:36px;font-weight:900;color:var(--r-accent)}
 .wc-tail-go{display:inline-flex;align-items:center;gap:4px;color:var(--r-accent)}
 .wc-tail-go .icon{width:12px;height:12px}
 html body .wc-live .wc-more{display:none}
}
@media(max-width:760px){html body .wc-rows .hide-p{display:none!important}}

/* ---- K7. the sportsbook frame (TARGET-SPEC §3): main + the docked 320-px slip from 1280 (sticky top 112); the agenda between
   list and slip from 1440 (300; 360 from 1680) ---- */
.wc-sbf{display:grid;grid-template-columns:minmax(0,1fr);gap:24px;align-items:start}
.wc-sbf-main{min-width:0}
.wc-slipcol{display:none}
@media(min-width:1280px){
 .wc-sbf{grid-template-columns:minmax(0,1fr) 320px}
 .wc-slipcol{display:block;position:sticky;top:112px;max-height:calc(100svh - 128px);overflow-y:auto;scrollbar-width:thin;border-radius:12px}
 .wc-slipcol:has(#inline-betslip)>.wc-slip-empty{display:none}
}
html body .wc-explorer--board,html body .wc-explorer--board>.wc-content{display:block;padding:0;margin:0;min-width:0}
html body .wc-board-layout{display:block}
html body .wc-agenda{display:none}
@media(min-width:1440px){
 html body .wc-board-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:24px;align-items:start}
 html body .wc-agenda{display:block;position:sticky;top:112px;padding:0;border:0;background:none;border-radius:0}
 html body .wc-agenda>header,html body .wc-agenda>.wc-agenda-foot{display:none}
}
@media(min-width:1680px){html body .wc-board-layout{grid-template-columns:minmax(0,1fr) 360px}}
/* the toolbar: h1 28/900 + count; competition chips; tabs 40 (gold underline); search 44 + competition select 240 (phone: search only) */
html body .wc-board-heading{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin:0 0 16px}
html body .wc-board-heading h2{display:flex;align-items:center;gap:12px;margin:0;font:900 28px/32px var(--display);letter-spacing:-.01em;white-space:nowrap;color:var(--r-text)}
html body .wc-board-heading h2>span{height:24px;min-width:24px;padding:0 6px;border-radius:6px;background:var(--r-surface-3);color:var(--r-dim);font:700 12px/24px var(--font);text-align:center}
html body .wc-board-heading .wc-clear{position:relative;margin-left:auto;display:inline-flex;align-items:center;gap:4px;height:28px;padding:0 4px;font-size:12px!important;font-weight:700;color:var(--r-faint)}
html body .wc-board-heading .wc-clear::after{content:"";position:absolute;left:50%;top:50%;width:max(100%,44px);height:44px;transform:translate(-50%,-50%)}
html body .wc-board-heading>.wc-comp-chips{flex:1 0 100%;margin:4px 0 0;min-width:0}
@media(max-width:760px){html body .wc-board-heading h2{font-size:24px;line-height:28px}}
html body .wc-toolbar{display:flex;align-items:center;gap:12px;margin:0 0 16px;padding:0;border:0;border-bottom:1px solid var(--r-div);background:none;min-width:0}
html body .wc-time-tabs{display:flex;gap:4px;min-width:0;overflow-x:auto;scrollbar-width:none}
html body .wc-time-tabs>button{height:40px;min-height:40px;display:flex;align-items:center;gap:6px;padding:0 12px;margin-bottom:-1px;border:0;border-bottom:3px solid transparent;border-radius:0;background:none;font-size:14px!important;line-height:20px;font-weight:700;color:var(--r-faint);white-space:nowrap}
html body .wc-time-tabs>button::after{display:none}
html body .wc-time-tabs>button.is-active{color:var(--r-text);border-bottom-color:var(--r-gold)}
html body .wc-time-tabs>button>span{font-size:12px;line-height:16px;font-weight:700;color:var(--r-live);background:none;padding:0}
html body .wc-odds-key{margin-left:auto;flex:none;font-size:12px;line-height:16px;font-weight:600;color:var(--r-faint);white-space:nowrap}
@media(max-width:760px){html body .wc-odds-key{display:none}}
html body .wc-search-row{display:grid;grid-template-columns:minmax(0,1fr) fit-content(55%);gap:12px;margin:0 0 16px}
html body .wc-search{height:44px;min-height:44px;padding:0 12px;gap:8px;border-radius:6px;border:1px solid var(--r-hair);background:var(--r-surface)}
html body .wc-search>input{font-size:14px;line-height:20px;min-width:0}
html body .wc-search-row>select#competition-filter{height:44px;min-height:44px;min-width:0;border-radius:6px;border:1px solid var(--r-hair);background-color:var(--r-surface);font-size:14px;color:var(--r-dim)}
@media(max-width:760px){html body .wc-search-row{grid-template-columns:minmax(0,1fr)}html body .wc-search-row>select#competition-filter{display:none}}
html body .wc-load-more{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;height:44px;margin-top:16px;border-radius:8px;border:1px solid var(--r-hair);background:var(--r-surface);font-size:14px;font-weight:700;color:var(--r-dim)}
html body .wc-load-more>span{font-size:12px;color:var(--r-faint)}
html body .wc-feed-notice{font-size:12px;line-height:16px}
/* the agenda panel */
.wc-ag{border:1px solid var(--r-hair);border-radius:12px;background:var(--r-surface);overflow:hidden;box-shadow:var(--r-shadow)}
.wc-ag-h{display:flex;align-items:center;gap:8px;height:52px;padding:0 12px 0 16px;border-bottom:1px solid var(--r-div)}
.wc-ag-h>h3{margin:0 auto 0 0;font-size:16px;line-height:20px;font-weight:900;white-space:nowrap;color:var(--r-text)}
.wc-ag-h .wc-seg>button{padding:0 8px}
.wc-ag-i{display:flex;flex-direction:column;gap:8px;padding:12px 16px}
.wc-ag-i+.wc-ag-i{border-top:1px solid var(--r-div)}
.wc-ag-meta{display:flex;align-items:center;gap:8px;height:16px;min-width:0;font-size:12px;line-height:16px}
.wc-ag-t{flex:none;font-weight:700;color:var(--r-accent);white-space:nowrap}
.wc-ag-lg{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--r-faint);font-weight:600}
.wc-ag-teams{display:flex;flex-direction:column;gap:4px;color:inherit;text-decoration:none;min-width:0}
.wc-ag-tm{display:flex;align-items:center;gap:8px;height:22px;min-width:0}
html body .wc-ag-tm .team-mark{width:20px;height:20px;min-width:20px;flex:0 0 20px;margin:0}
html body .wc-ag-tm .team-mark:has(img)>span{visibility:hidden}
.wc-ag-tm>.wc-row-n{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px;line-height:20px;font-weight:600;color:var(--r-text)}
.wc-ag-px{display:grid;gap:8px}.wc-ag-px.n1{grid-template-columns:minmax(0,1fr)}.wc-ag-px.n2{grid-template-columns:repeat(2,minmax(0,1fr))}.wc-ag-px.n3{grid-template-columns:repeat(3,minmax(0,1fr))}
html body .wc-ag-px>.lv2-odd{height:36px;min-height:36px;flex-direction:row;justify-content:space-between;align-items:center;padding:0 10px 0 12px;border-radius:8px}
html body .wc-ag-px>.lv2-odd .fx-k{font-size:12px;line-height:14px;font-weight:600}
html body .wc-ag-px>.lv2-odd b{font-size:15px;line-height:18px;font-weight:700}
html body .wc-ag-px.n3>.lv2-odd{padding:0 8px}
html body .wc-ag-px>.wc-lock{grid-column:1/-1;height:36px}
.wc-ag-none{margin:0;padding:16px;font-size:14px;line-height:20px;color:var(--r-dim)}
html body .wc-ag-all{display:flex;align-items:center;justify-content:center;gap:4px;width:100%;height:44px;border:0;border-top:1px solid var(--r-div);background:none;font-size:14px;font-weight:700;color:var(--r-accent)}
html body .wc-ag-all .icon{width:12px;height:12px}

/* ---- K8. the bet slip (TARGET-SPEC §4 Bet slip): column 320 / phone sheet / desktop dialog; text floor 12 (D2); names wrap ---- */
.wc-slip,html body .wc-slip.inline-betslip{display:block;margin:0;padding:0;border:1px solid var(--r-hair);border-radius:12px;background:var(--r-surface);box-shadow:var(--r-shadow);color:var(--r-text);overflow:hidden;min-width:0}
.wc-slip-hd{display:flex;align-items:center;gap:8px;height:48px;padding:0 8px 0 16px;background:var(--r-strip);color:var(--r-strip-ink)}
.wc-slip-hd>b{font-size:12px;line-height:16px;font-weight:900;letter-spacing:.14em}
.wc-bc{height:20px;min-width:20px;padding:0 6px;border-radius:999px;background:var(--r-gold);color:#06070E;font-size:12px;line-height:20px;font-weight:800;text-align:center;flex:none}
.wc-sp{flex:1}
html body .wc-slip-x{position:relative;display:grid;place-items:center;width:32px;height:32px;min-height:32px;padding:0;border:0;border-radius:8px;background:none;color:inherit;opacity:.85}
html body .wc-slip-x::after{content:"";position:absolute;inset:-6px}
html body .wc-slip-x .icon{width:18px;height:18px}
html body .wc-slip-hide .icon{transform:rotate(90deg)}
.wc-slip-hide{display:none!important}
.wc-sheet .wc-slip-hide{display:grid!important}
.wc-slip-tb{display:grid;grid-template-columns:1fr 1fr;gap:4px;margin:12px 16px 0;padding:3px;border-radius:8px;background:var(--r-surface-2)}
.wc-slip-tb>span,html body .wc-slip-tb>button{height:30px;min-height:30px;display:grid;place-items:center;padding:0;border:0;border-radius:6px;background:none;font-size:13px;line-height:16px;font-weight:700;color:var(--r-faint)}
.wc-slip-tb>.is-on{background:var(--r-surface-3);color:var(--r-text);box-shadow:inset 0 0 0 1px var(--r-hair)}
.wc-slip-tb>button>b{margin-left:4px;color:var(--r-accent)}
.wc-ssel{display:flex;flex-direction:column;gap:4px;padding:12px 16px;margin:4px 0 0;border:0;border-radius:0;background:none}
html body .wc-ssel.fx-pick.tc{border-left:0;padding-left:16px;box-shadow:inset 3px 0 0 var(--tc)}
.wc-slip:has(.fx-chg) .wc-ssel,.wc-slip-dialog:has(.fx-chg) .wc-ssel{box-shadow:inset 3px 0 0 var(--r-live)!important}
.wc-ssel-ev,.wc-ssel-mk{margin:0;font-size:12px;line-height:16px;font-weight:600;color:var(--r-faint);overflow-wrap:anywhere}
.wc-ssel-pick{display:flex;align-items:flex-start;gap:8px}
.wc-ssel-nm{flex:1;min-width:0;font-size:14px;line-height:20px;font-weight:800;overflow-wrap:anywhere}
.wc-ssel-nm .badge{font-size:12px}
.wc-ssel-pr{flex:none;display:flex;align-items:center;gap:6px;font-size:16px;line-height:20px;font-weight:800;color:var(--r-accent);font-variant-numeric:tabular-nums}
html body .wc-ssel-pr>strong{font:inherit;color:inherit;background:none;border:0;padding:0;box-shadow:none}
html body .wc-slip .backlay-toggle,html body .wc-slip-dialog .backlay-toggle{margin:0 16px 12px}
html body .wc-slip #betslip-form,html body .wc-slip-dialog #betslip-form{display:block;margin:0;padding:0}
html body :is(.wc-slip,.wc-slip-dialog) #quote-status:empty{display:none}
html body :is(.wc-slip,.wc-slip-dialog) #quote-status{margin:0 16px 12px}
html body :is(.wc-slip,.wc-slip-dialog) .quote-warning{display:flex;align-items:center;gap:8px;margin:0;padding:8px 12px;border:0;border-radius:8px;background:rgba(255,122,26,.12);color:var(--r-live);font-size:12px;line-height:16px;font-weight:700}
:root:not([data-theme="dark"]) body :is(.wc-slip,.wc-slip-dialog) .quote-warning{background:#FFF1E6}
html body :is(.wc-slip,.wc-slip-dialog) .quote-warning .fx-accept,html body :is(.wc-slip,.wc-slip-dialog) .quote-warning [data-action="accept-price"]{flex:none;min-height:28px;margin-left:auto;padding:0 12px;border-radius:999px;background:var(--r-live);color:#06070E;font-size:12px;font-weight:800;text-decoration:none}
.wc-stake{display:flex;flex-direction:column;gap:8px;padding:12px 16px;border-top:1px solid var(--r-div)}
.wc-stake>label{font-size:12px;line-height:16px;font-weight:700;color:var(--r-faint)}
html body .wc-inp{display:flex;align-items:center;gap:8px;height:44px;min-height:44px;padding:0 12px;border-radius:6px;border:1px solid var(--r-gold);background:var(--r-surface-2)}
html body .wc-inp>span{font-size:16px;font-weight:700;color:var(--r-faint)}
html body .wc-inp>input{flex:1;min-width:0;height:40px;border:0;background:none;padding:0;font-size:16px;font-weight:800;color:var(--r-text);box-shadow:none}
html body .wc-qs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin:0}
html body .wc-qs>.amount-chip{height:36px;min-height:36px;min-width:0;padding:0 4px;border-radius:6px;border:1px solid var(--r-div);background:var(--r-surface-2);font-size:13px;line-height:16px;font-weight:700;color:var(--r-dim);white-space:nowrap}
html body .wc-qs>.amount-chip.is-on{background:var(--r-surface-3);border-color:var(--r-gold);color:var(--r-text)}
.wc-tot{display:flex;flex-direction:column;gap:6px;padding:12px 16px;border-top:1px solid var(--r-div)}
html body .wc-tot #quote-summary{display:flex;flex-direction:column;gap:6px;margin:0;padding:0;border:0;background:none}
html body .wc-tot :is(.quote-row,.quote-total){display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0;padding:0;border:0;background:none;font-size:13px;line-height:18px;color:var(--r-faint)}
html body .wc-tot :is(.quote-row,.quote-total)>strong{font-weight:800;color:var(--r-text);font-variant-numeric:tabular-nums;white-space:nowrap}
html body .wc-tot .quote-total{font-size:15px;line-height:20px;font-weight:800;color:var(--r-text)}
html body .wc-tot .quote-total>strong{font-size:18px;line-height:22px;color:var(--r-accent)}
.wc-acc{display:flex;align-items:center;gap:8px;margin:0;font-size:12px;line-height:16px;color:var(--r-faint)}
.wc-acc .icon{width:14px;height:14px;flex:none;color:var(--r-up)}
html body :is(.wc-slip,.wc-slip-dialog) .form-error{margin:0 16px;font-size:12px;line-height:16px}
html body :is(.wc-slip,.wc-slip-dialog) .form-error:empty{display:none}
html body :is(.wc-slip,.wc-slip-dialog) #ftd-shortfall-slot:empty{display:none}
html body :is(.wc-slip,.wc-slip-dialog) #ftd-shortfall-slot{margin:0 16px 8px}
html body .wc-place{display:flex;align-items:center;justify-content:center;width:calc(100% - 32px);height:48px;min-height:48px;margin:4px 16px 8px;border-radius:8px;background:var(--r-gold);color:#06070E;font-size:16px;line-height:20px;font-weight:900;white-space:nowrap;border:0}
html body .wc-place:disabled{opacity:.6}
.wc-slip-sub{margin:0 16px 16px;font-size:12px;line-height:16px;color:var(--r-faint);text-align:center}
html body :is(.wc-slip,.wc-slip-dialog) .multi-add{display:flex;margin:0 16px 16px;font-size:12px;font-weight:700}
.wc-slip-none{display:flex;flex-direction:column;align-items:center;gap:8px;padding:24px 16px;text-align:center}
.wc-slip-ic{display:grid;place-items:center;width:48px;height:48px;border-radius:12px;background:var(--r-surface-3);color:var(--r-accent)}
.wc-slip-ic .icon{width:24px;height:24px}
.wc-slip-none>strong{font-size:16px;line-height:20px;font-weight:800}
.wc-slip-none>p{margin:0;font-size:12px;line-height:16px;color:var(--r-faint)}
html body .wc-slip-combo{display:inline-flex;align-items:center;gap:4px;height:32px;padding:0 12px;border-radius:999px;border:1px solid var(--r-hair);background:none;font-size:12px;font-weight:700;color:var(--r-accent)}
/* the desktop dialog (1024-1279, home, casino): the same anatomy inside the existing dialog */
html body dialog.wc-slip-dialog{width:min(400px,calc(100vw - 32px));padding:0;border-radius:12px;overflow:hidden}
html body dialog.wc-slip-dialog>.dialog-content,html body dialog.wc-slip-dialog .dialog-body{padding:0}
/* the phone / floating slip bar and the sheet (TARGET-SPEC §1.7, §4) */
.wc-slipbar{position:fixed;z-index:47;display:flex;align-items:center;gap:8px;height:48px;padding:0 16px;border:1px solid rgba(247,210,42,.28);border-bottom:0;border-radius:16px 16px 0 0;background:linear-gradient(90deg,#2A0746 0%,#1B1030 70%);color:#F6F2FA;box-shadow:var(--r-sheet-shadow);font:inherit;cursor:pointer;text-align:left}
.wc-slipbar[hidden]{display:none}
:root:not([data-theme="dark"]) .wc-slipbar{background:#37095B;color:#FFFBFC}
.wc-slipbar>b{font-size:12px;line-height:16px;font-weight:900;letter-spacing:.14em}
.wc-slipbar>.wc-pv{font-size:14px;line-height:20px;font-weight:800;color:#F7D22A;white-space:nowrap}
.wc-sb-ic{width:16px;height:18px;border:2px solid currentColor;border-radius:3px;opacity:.85;flex:none}
.wc-chev{width:8px;height:8px;border-left:2px solid currentColor;border-top:2px solid currentColor;transform:rotate(45deg);margin:4px 2px 0 4px;flex:none}
@media(max-width:1023px){.wc-slipbar{left:0;right:0;bottom:62px}body.wc-has-slipbar .main{padding-bottom:calc(62px + 48px + 24px)!important}}
@media(min-width:1024px){.wc-slipbar{right:24px;bottom:0;width:320px;height:56px;border-radius:12px 12px 0 0}}
/* wc-tabbar D8: on phones the strip is a drawer sitting on the tab bar (a violet lighter than the bar, a gold rim, an upward shadow);
   in the app shells it sits on the bar's real top (62 px + the inset), not over the tabs; a toast rises above it */
@media(max-width:760px){
 html .wc-slipbar{border-color:rgba(247,210,42,.5);background:linear-gradient(180deg,#37095B 0%,#2A0746 100%);box-shadow:0 -10px 24px rgba(6,7,14,.32)}
 :root:not([data-theme="dark"]) .wc-slipbar{background:linear-gradient(180deg,#5A1E8C 0%,#4A1478 100%)}
 html[data-wyn-app] .wc-slipbar{bottom:calc(62px + var(--wyn-inset-bottom-max))}
 html[data-wyn-app] body.wc-has-slipbar .main{padding-bottom:calc(134px + var(--wyn-inset-bottom-max))!important}
 html:not([data-wyn-app]) body.wc-has-slipbar:not(.wc-sheet-open) #toast{bottom:126px}
 html[data-wyn-app] body.wc-has-slipbar:not(.wc-sheet-open) #toast{bottom:calc(126px + var(--wyn-inset-bottom-max))}
}
.wc-scrim{position:fixed;inset:0;z-index:60;background:rgba(6,7,14,.62)}
.wc-scrim[hidden],.wc-sheet[hidden]{display:none}
.wc-sheet{position:fixed;left:0;right:0;bottom:0;z-index:61;display:flex;flex-direction:column;max-height:calc(100% - 56px);max-height:calc(100dvh - 56px);border:1px solid var(--r-hair);border-bottom:0;border-radius:16px 16px 0 0;background:var(--r-surface);box-shadow:var(--r-sheet-shadow);overflow:hidden;outline:0}
@media(min-width:761px){.wc-sheet{left:50%;right:auto;width:480px;transform:translateX(-50%)}}
.wc-grab{flex:none;width:40px;height:4px;margin:8px auto 0;border-radius:2px;background:var(--r-hair);cursor:pointer}
.wc-grab::after{content:"";display:block;height:20px;margin-top:-8px}
.wc-sheet-body{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain}
html body .wc-sheet .wc-slip{border:0;border-radius:0;box-shadow:none}
body.wc-sheet-open{overflow:hidden}

/* ---- K9. the event page (TARGET-SPEC §4; D6, D12, D22, D26): crumb 32, scoreboard (strip 40, vs 16, foot 40), stream bar 48,
   market pills 36 r full, market cards r 12 (titles and runner names wrap), one block for a market that is not open ---- */
html body .wc-crumb{display:flex;align-items:center;flex-wrap:wrap;gap:8px;min-height:32px;margin:0 0 8px;padding:0;font-size:12px;line-height:16px;color:var(--r-faint)}
html body .wc-crumb .icon{width:12px;height:12px}
html body .wc-crumb>a,html body .wc-crumb>.wc-crumb-l{position:relative;padding:0;border:0;background:none;font:inherit;color:var(--r-faint);min-height:0;cursor:pointer}
html body .wc-crumb>a::after,html body .wc-crumb>.wc-crumb-l::after{content:"";position:absolute;left:-4px;right:-4px;top:-14px;bottom:-14px}
html body .wc-crumb>span{font-weight:700;color:var(--r-dim)}
.wc-ev{display:block;min-width:0}
.wc-ev>.event-main{min-width:0}
.wc-scb{border:1px solid var(--r-hair);border-radius:12px;background:var(--r-surface);overflow:hidden;box-shadow:var(--r-shadow)}
.wc-scb-top{display:flex;align-items:center;gap:8px;height:40px;padding:0 12px 0 16px;background:var(--r-strip);color:var(--r-strip-ink);font-size:12px;line-height:16px;font-weight:700}
.wc-scb-top>.icon{width:16px;height:16px;flex:none;color:var(--r-gold)}
:root:not([data-theme="dark"]) .wc-scb-top>.icon{color:var(--r-accent)}
.wc-scb-lg{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html body .wc-scb-top .lv2-tv{height:24px;margin:0}
html body .wc-scb-top [data-action="favourite"]{position:relative;display:grid;place-items:center;width:28px;height:28px;min-width:28px;min-height:28px;padding:0;margin:0;border:0;background:none;color:var(--r-faint)}
html body .wc-scb-top [data-action="favourite"]::after{content:"";position:absolute;inset:-8px}
html body .wc-scb-top [data-action="favourite"] .icon{width:18px;height:18px}
.wc-scb-vs{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:16px;padding:16px}
.wc-scb-vs.is-one{grid-template-columns:minmax(0,1fr) auto}
.wc-scb-side{position:relative;display:flex;align-items:center;gap:12px;min-width:0}
.wc-scb-side.is-b{flex-direction:row-reverse;text-align:right}
html body .wc-scb-side .team-mark{width:44px;height:44px;min-width:44px;flex:0 0 44px;margin:0;font-size:15px;line-height:16px}
html body .wc-scb-side .team-mark:has(img)>span{visibility:hidden}
html body .wc-scb-side>.tc-bar{position:static;flex:none;width:3px;height:28px;margin:0;border-radius:2px}
.wc-scb-nmw{display:flex;flex-direction:column;gap:2px;min-width:0}
.wc-scb-side.is-b .wc-scb-nmw{align-items:flex-end}
html body .wc-scb-nm{margin:0;font:800 18px/22px var(--display);letter-spacing:0;color:var(--r-text);overflow-wrap:anywhere}
.wc-scb-sc{font-size:16px;line-height:20px;font-weight:900;color:var(--r-score-ink);font-variant-numeric:tabular-nums}
.wc-scb-mid{display:flex;flex-direction:column;align-items:center;gap:2px;text-align:center}
.wc-scb-d{font-size:12px;line-height:16px;font-weight:700;color:var(--r-faint);white-space:nowrap}
.wc-scb-k{font-size:22px;line-height:26px;font-weight:900;color:var(--r-accent);white-space:nowrap;font-variant-numeric:tabular-nums}
.wc-scb-foot{display:flex;align-items:center;gap:12px;min-height:40px;padding:0 16px;border-top:1px solid var(--r-div);font-size:12px;line-height:16px;color:var(--r-faint)}
@media(max-width:760px){
 .wc-scb-vs{gap:8px;padding:12px}
 .wc-scb-side,.wc-scb-side.is-b{flex-direction:column;align-items:center;text-align:center;gap:6px}
 .wc-scb-side.is-b .wc-scb-nmw{align-items:center}
 .wc-scb-nmw{align-items:center}
 html body .wc-scb-side .team-mark{width:40px;height:40px;min-width:40px;flex-basis:40px}
 html body .wc-scb-side>.tc-bar{display:none}
 html body .wc-scb-nm{font-size:14px;line-height:18px;text-align:center}
}
html body .wc-ev .live-stream-panel{margin:12px 0 0;border:1px solid var(--r-hair);border-radius:12px;background:var(--r-surface);overflow:hidden}
html body .wc-ev .live-stream-panel .stream-bar{min-height:48px;padding:6px 16px;gap:12px;font-size:12px;line-height:16px;flex-wrap:wrap}
html body .wc-ev .live-stream-panel .stream-bar [data-stream-toggle]{font-size:14px;font-weight:700}
html body .wc-ev .live-stream-panel .stream-bar [data-stream-status]{font-size:12px;line-height:16px;color:var(--r-faint);min-width:0}
html body .wc-ev-tabs{display:flex;gap:4px;margin:16px 0 0;padding:0;border:0;border-bottom:1px solid var(--r-div);background:none}
html body .wc-ev-tabs>button{height:40px;min-height:40px;padding:0 12px;margin-bottom:-1px;border:0;border-bottom:3px solid transparent;border-radius:0;background:none;font-size:14px;line-height:20px;font-weight:700;color:var(--r-faint)}
html body .wc-ev-tabs>button.active{color:var(--r-text);border-bottom-color:var(--r-gold)}
html body .wc-ev-tabs>button::after{display:none}
html body .wc-mpills{display:flex;gap:8px;margin:12px 0;padding:0 24px 0 0;overflow-x:auto;scrollbar-width:none;border:0;background:none;-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 24px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 24px),transparent)}
html body .wc-mpills::-webkit-scrollbar{display:none}
html body .wc-mpills>button{flex:none;display:inline-flex;align-items:center;gap:6px;height:36px;min-height:36px;padding:0 14px;border:1px solid var(--r-hair);border-radius:999px;background:var(--r-surface);font-size:14px;line-height:20px;font-weight:700;color:var(--r-dim);white-space:nowrap}
html body .wc-mpills>button>span{font-size:12px;line-height:16px;font-weight:700;opacity:.8;background:none;padding:0;color:inherit}
html body .wc-mpills>button.active{background:var(--r-gold);border-color:var(--r-gold);color:var(--r-gold-ink)}
html body .wc-mpills>.icon-button{width:36px;padding:0;justify-content:center}
html body .wc-ev [data-live-region="markets"]>.panel,html body .wc-ev [data-live-region="markets"]>section{margin:0 0 12px}
html body .wc-ev .fx-market{border:1px solid var(--r-hair);border-radius:12px;background:var(--r-surface);box-shadow:var(--r-shadow);overflow:hidden;padding:0}
html body .wc-ev .fx-market>.panel-heading{display:flex;align-items:flex-start;gap:8px;min-height:0;margin:0;padding:12px 12px 0;border:0;background:none}
html body .wc-ev .fx-market>.panel-heading>div{min-width:0;flex:0 1 auto}
html body .wc-ev .fx-market>.panel-heading h2{margin:0;font:800 16px/20px var(--display);letter-spacing:0;text-transform:none;color:var(--r-text);white-space:normal;overflow-wrap:anywhere}
html body .wc-ev .fx-market>.panel-heading>.fx-st{margin-left:auto;flex:none;height:20px;font-size:12px;line-height:16px;color:var(--r-faint)}
html body .wc-ev .fx-grid{gap:8px;padding:12px}
html body .wc-ev .fx-grid .lv2-odd.fx{height:auto;min-height:44px;padding:6px 14px 6px 16px;gap:8px;border-radius:8px}
html body .wc-ev .fx-grid .lv2-odd.fx .fx-k{min-width:0;overflow:visible;text-overflow:clip;white-space:normal;overflow-wrap:anywhere;font-size:14px;line-height:18px;font-weight:600;color:var(--fx-key);text-align:left}
html body .wc-ev .fx-grid .lv2-odd.fx.is-selected .fx-k{color:rgba(6,7,14,.8)}
html body .wc-ev .fx-grid .lv2-odd.fx b{font-size:15px;line-height:18px;font-weight:700}
html body .wc-ev .fx-grid .lv2-odd.fx:is(.flash-up,.flash-down)::after{top:50%;margin-top:-3px;right:auto;left:auto;position:static;margin-left:auto;order:2}
html body .wc-ev .fx-grid .lv2-odd.fx b{order:3}
html body .wc-ev .fx-grid>.wc-lock{height:44px}
@media(max-width:760px){html body .wc-ev .fx-grid.n3 .lv2-odd.fx{flex-direction:column;justify-content:center;gap:0;padding:4px 6px}html body .wc-ev .fx-grid.n3 .lv2-odd.fx .fx-k{font-size:12px;line-height:14px;text-align:center}}
@media(min-width:1920px){html body .wc-ev [data-live-region="markets"]:has(>.fx-market){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:12px;align-items:start}html body .wc-ev [data-live-region="markets"]>:not(.fx-market){grid-column:1/-1}}
html body .wc-ev .fx-lines{border:1px solid var(--r-hair);border-radius:12px;background:var(--r-surface);overflow:hidden}
html body .wc-ev .fx-lines .session-heading h2{font:800 16px/20px var(--display);margin:0}
html body .wc-ev .fx-ou{font-size:12px;letter-spacing:.06em}
html body .wc-ev .fx-line .session-name small,html body .fx-st{font-size:12px}
html body .wc-ev .empty-state p{font-size:14px}

/* ---- K10. legacy surfaces on wincricket: the 12-px text floor (D2), the search dialog (D10), FAQ (D11), wins scroller (D13),
   race card (D14), footer (D18/D21), initials (D22), auth (D27/D28) ---- */
html body :is(.search-result-label,.search-result small,.slip-note p,.betslip-dialog .field-help,.slip-type,.slip-type span,.footer,.footer a,.footer span,.scoreboard-bottom,.scoreboard-top,.market-foot,.market-foot span,.race-market-heading span,.fx-race-head,.badge,.eyebrow,.field-help,.muted-text,.quote-row,.receipt-values span,.age-mark,.empty-state p,.feed-error,.market-state,.stream-bar span,.live-label,.count,.scorecard th,.scorecard td,.scorecard small,.scorecard p,.score-table th,.score-table td){font-size:max(12px,1em)}
html body :is(.search-result-label,.search-result small,.slip-note p,.slip-type,.footer,.scoreboard-top,.scoreboard-bottom,.market-foot,.fx-race-head,.badge,.eyebrow,.race-market-heading span,.age-mark,.live-label){font-size:12px!important;line-height:16px}
html body .search-dialog .dialog-content,html body dialog.search-dialog>div{padding:24px 24px 16px}
html body .search-dialog :is(.search-results,#search-results){max-height:calc(100svh - 260px);overflow-y:auto;padding-bottom:16px;-webkit-mask-image:linear-gradient(180deg,#000 calc(100% - 24px),transparent);mask-image:linear-gradient(180deg,#000 calc(100% - 24px),transparent)}
html body .search-result .team-mark{font-size:10px}
html body .team-mark:not(:has(img))>span{font-size:max(10px,inherit)}
html body .faq-section details{padding:16px}
html body .faq-section summary{padding-right:28px;position:relative}
html body .wc-wins-list{margin:0;padding:0 24px 0 0;-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 24px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 24px),transparent)}
html body .footer{min-height:0;padding:24px 0 0;margin-top:48px;border-top:1px solid var(--r-div);gap:8px 16px;flex-wrap:wrap}
html body .footer a{display:inline-flex;align-items:center;min-height:32px}
html body .route-event .event-casino,html body .route-event .slip-prompt{display:none}
html body .route-event .event-layout{grid-template-columns:minmax(0,1fr)}
@media(max-width:760px){html body .auth-shell .auth-main{align-items:flex-start;padding-top:12px}}

/* ---- K11. no-clip / no-overlap fixes found by the gate (owner 2026-10-16) ---- */
/* a home group is display:contents on the card grid: it must not compute a clip either */
@media(min-width:761px){html body .wc-rows>.wc-lg,html body .wc-rows .wc-lg-rows{overflow:visible}}
/* the UPDATES strip (TARGET-SPEC §4): desktop = one headline on one line (no step carousel whose off-window items are cut);
   phones = "UPDATES" + "See all ›" only (the headline would not fit); a tap opens the drawer as before */
html body .tenant-news .tenant-news-track{transform:none!important;animation:none!important;width:auto!important}
html body .tenant-news .tenant-news-group:not(:first-child),html body .tenant-news .tenant-news-item:not(:first-child){display:none!important}
html body .tenant-news .tenant-news-item{width:auto!important;max-width:none;white-space:nowrap}
@media(max-width:1023px){
 html body .tenant-news{height:32px;min-height:32px}
 html body .tenant-news .tenant-news-headline{display:flex;justify-content:flex-end;align-items:center;min-width:0}
 html body .tenant-news .tenant-news-headline>*{display:none!important}
 html body .tenant-news .tenant-news-headline::after{content:"See all ›";font-size:12px;line-height:16px;font-weight:700;color:var(--r-gold)}
 html body .tenant-news .tenant-news-pause{display:none}
}
/* the hero art is a full-card layer under its copy (the approved board: inset 0, cover), legible through the hero shade; the
   sparks stay on the art side, away from the copy */
@media(min-width:761px){html body .lv2-hb .lv2-hb-lead .lv2-hb-card>img{inset:0;width:100%;height:100%;object-fit:cover;object-position:70% 30%;-webkit-mask-image:none;mask-image:none}}
html body .lv2-hb .lv2-particles{left:58%}
/* recent wins: one line per win inside the scroller (the 24-px fade says "more"); never a ragged 2-line first item */
html body .wc-wins-list .wc-win-txt{white-space:nowrap}
html body .wc-wins-list,html body .wc-wins-list>li:only-child{display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none;grid-template-columns:none}
html body .wc-wins-list>li{flex:0 0 auto;max-width:none;scroll-snap-align:start}
html body .wc-wins-list .wc-win-txt{flex:none}
@media(max-width:1023px){html body .tenant-news .lv2-news-card{display:none!important}}
@media(max-width:760px){html body .lv2-hb .lv2-particles{display:none}}
/* hero / promo titles never clamp or clip: they wrap, with the glyph room of a 1.2 line */
html body .lv2-hb .lv2-hero-copy h2,html body .wc-promo .lv2-hero-copy h2{overflow:visible;display:block;-webkit-line-clamp:unset;line-height:1.2}
.wc-row-msc{display:none}
@media(max-width:760px){
 html body .wc-row-meta>.wc-row-msc{display:inline-block;flex:none;height:20px;padding:0 6px;border-radius:6px;background:var(--r-score-bg);color:var(--r-score-ink);font-size:12px;line-height:20px;font-weight:800;font-variant-numeric:tabular-nums;white-space:nowrap}
 html body .wc-row:has(.wc-row-msc) .wc-row-t>.wc-sc{display:none}
}
@media(min-width:761px){html body .lv2-catnav.wc-strip .lv2-cat.wc-cat{flex:0 0 auto;min-width:84px}}
html body .lv2-hb .has-fm .lv2-particles{display:none}
/* league names never cut: they take a second line in the strip, which grows past 40 only when it must */
html body :is(.wc-lg-head,.wc-league>header){height:auto;min-height:40px}
html body :is(.wc-lg-head,.wc-league>header)>span:not(.wc-mt){white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere;padding:4px 0}
html body .lv2-catnav.wc-strip .lv2-catnav-track{display:flex;overflow-x:auto;scrollbar-width:none}
/* full-bleed lists follow the page gutter the shell actually uses (9 px below 390, 12 above) */
@media(max-width:760px){html body .wc-match-groups.match-list,html body .wc-grid.wc-rows{margin-left:calc(-1*var(--lv2-gutter,12px));margin-right:calc(-1*var(--lv2-gutter,12px))}}
@media(max-width:760px){html body .wc-match-groups.match-list:has(>.wc-league .wc-row){margin-left:calc(-1*var(--lv2-gutter,12px));margin-right:calc(-1*var(--lv2-gutter,12px))}}
/* a team line is crest · name · score with no empty-column gap: the name takes everything left */
html body .wc-row-t{display:flex;align-items:center;gap:6px;min-width:0}
html body .wc-row-t>.team-mark{flex:0 0 20px}
html body .wc-row-t>.wc-row-n{flex:1 1 auto;min-width:0}
html body .wc-row-t>.wc-sc{flex:none}
/* casino captions (D19): one size, wrap to a reserved second line instead of cutting */
html body .game-card .game-caption h3{white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere}
html body .lv2-grid5 .game-card .game-caption h3{min-height:2.5em}
html body .lv2-cat.wc-cat.is-live>span.lv2-cat-art::after{content:none}
/* the base's dark-theme :is() lists carry 0,4,1 specificity: the pill, stake and total tones are pinned here */
html body .wc-mpills>button:not(.icon-button){height:36px!important;min-height:36px!important;padding:0 14px!important;border:1px solid var(--r-hair)!important;border-radius:999px!important;background:var(--r-surface)!important;color:var(--r-dim)!important;font-size:14px!important;line-height:20px!important;font-weight:700!important;box-shadow:none!important}
html body .wc-mpills>button:not(.icon-button)>span{font-size:12px!important;line-height:16px;opacity:.8}
html body .wc-mpills>button.active{background:var(--r-gold)!important;border-color:var(--r-gold)!important;color:var(--r-gold-ink)!important}
html body .wc-mpills>.icon-button{width:36px;height:36px;border-radius:999px!important}
html body .wc-slip .wc-inp,html body .wc-slip-dialog .wc-inp{border:1px solid var(--r-gold)!important;background:var(--r-surface-2)!important;border-radius:6px!important;box-shadow:none!important}
html body .wc-qs>.amount-chip{background:var(--r-surface-2)!important;border:1px solid var(--r-div)!important;color:var(--r-dim)!important;border-radius:6px!important}
html body .wc-qs>.amount-chip.is-on{background:var(--r-surface-3)!important;border-color:var(--r-gold)!important;color:var(--r-text)!important}
html body .wc-tot .quote-total.fx-win,html body .wc-tot .quote-total,html body .wc-tot .quote-row{display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:space-between!important;text-align:left!important;background:none!important;border:0!important;padding:0!important}
html body .wc-tot .quote-total>span,html body .wc-tot .quote-row>span{font-size:15px!important;line-height:20px!important;font-weight:800;color:var(--r-text)!important}
html body .wc-tot .quote-row>span{font-size:13px!important;font-weight:600;color:var(--r-faint)!important}
html body .wc-tot .quote-total>strong{font-size:18px!important;line-height:22px!important;font-weight:800!important;color:var(--r-accent)!important}
/* exchange cards: one row of runner pairs (key · BACK · LAY); phone home rows keep the per-line coupon */
.wc-body-card{display:none}
html body .wc-cardset .wc-body-card{display:flex}
@media(min-width:761px){html body .wc-rows .wc-body-card{display:flex}html body .wc-rows .wc-body-row{display:none}}
html body .wc-row-px.wc-bl{display:grid!important;grid-auto-flow:row;gap:8px;justify-content:stretch}
html body .wc-row-px.wc-bl.n2{grid-template-columns:repeat(2,minmax(0,1fr))}html body .wc-row-px.wc-bl.n3{grid-template-columns:repeat(3,minmax(0,1fr))}html body .wc-row-px.wc-bl.n1{grid-template-columns:minmax(0,1fr)}
html body .wc-row-px.wc-bl:has(>.wc-lock){display:flex!important}
.wc-blp{display:grid;grid-template-columns:auto minmax(0,1fr) minmax(0,1fr);align-items:center;gap:4px;min-width:0}
.wc-blp>.fx-k{font-style:normal;font-size:12px;line-height:14px;font-weight:600;color:var(--r-faint);padding-right:2px}
html body .wc-blp>.lv2-odd{height:40px;min-height:40px;min-width:0;padding:0 2px;border-radius:8px}
html body .wc-blp>.lv2-odd>small{display:none}
html body .wc-blp>.lv2-odd>b{font-size:14px;line-height:18px}
html body .wc-ag-list .wc-blp>.lv2-odd{height:36px;min-height:36px}
html body .wc-cardset .wc-card-state{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;margin:12px 0 0;padding:0;font-size:12px;line-height:16px;color:var(--r-dim);border:0;background:none}
html body .wc-cardset .wc-card-state>span:first-child{min-width:0;overflow-wrap:anywhere}
html body .wc-cardset .wc-card-state .lv2-lc-six{display:flex;gap:4px;flex:none}
html body .wc-ag.is-wait{min-height:52px}
html body .wc-row-lines.has-lock{display:grid;grid-template-columns:minmax(0,1fr) calc(2*var(--r-cell-w) + var(--r-cell-gap));column-gap:8px;row-gap:4px;align-items:center}
html body .wc-row-lines.has-lock>.wc-row-l{grid-column:1;min-height:22px}
html body .wc-row-lines.has-lock>.wc-lock{grid-column:2;grid-row:1/span 3;align-self:center}
/* D4: the wallet's logged-out gate is the same centred dashed card as My bets / Account */
html body .account-gate{display:flex;flex-direction:column;align-items:center;gap:12px;max-width:640px;margin:0 auto;padding:32px 24px;border:1px dashed var(--r-hair);border-radius:12px;background:var(--r-surface);text-align:center}
html body .account-gate h1{margin:0;font-size:24px;line-height:28px;font-weight:900}
html body .account-gate p{margin:0;font-size:14px;line-height:20px;color:var(--r-dim)}
/* D27: the auth CTA reads 16/800, centred */
html body .auth-main form .button.primary[type="submit"]{justify-content:center;font-size:16px;font-weight:800}
/* card scores read in the card's own ink (the base's light-theme score rule is 0,4,0) */
:root body .wc-cardset .wc-row .wc-sc{color:var(--r-text)}
@media(min-width:761px){:root body .wc-rows .wc-row .wc-sc{color:var(--r-text)}}
:root body .wc-cardset .wc-row .wc-sc.wc-ytb,:root body .wc-rows .wc-row .wc-sc.wc-ytb{color:var(--r-faint)}
html body .wc-hero-set{--r-score-ink:#F7D22A;--r-score-bg:#2A0746}
/* ---- K12. logos are transparent (owner 2026-10-16 "logos must not have a white background square"): no white, no solid tile, no
   rim behind a crest or a competition / sport logo; round flags and portraits keep their circle (the image fills it); a missing
   crest shows its initials on a transparent ring ---- */
html body .team-mark{background:transparent!important;border:0!important;box-shadow:none!important}
html body .team-mark .team-image{background:transparent!important}
html body .team-mark-crest,html body .team-mark-crest:has(img){border-radius:0!important;overflow:visible!important}
html body .team-mark-crest .team-image{object-fit:contain}
html body .team-mark:not(:has(img)):not(.wc-draw){border-radius:50%!important;box-shadow:inset 0 0 0 1px var(--r-hair)!important;overflow:visible}
html body .team-mark:not(:has(img)):not(.wc-draw)::before{content:none!important;display:none!important}
html body .team-mark:not(:has(img)):not(.wc-draw)>span{display:inline!important;visibility:visible!important;font:800 10px/11px var(--font)!important;letter-spacing:-.02em;color:var(--r-accent)}
html body .wc-scb-side .team-mark:not(:has(img)):not(.wc-draw)>span{font-size:15px!important;line-height:16px!important}
/* UX-10 (R1 on wincricket, 2026-10-17): the 10 px floor at 360-760 for the initials of a crest-less team (search results and the
   redesign's initials mark); the scoreboard's 15 px initials above keep winning by specificity */
@media (min-width:360px) and (max-width:760px){html body .search-result .team-mark{font-size:10px}html body .team-mark:not(:has(img))>span{font-size:max(10px,inherit)}html body .team-mark:not(:has(img)):not(.wc-draw)>span{font-size:10px!important}}

/* phone home: the featured card starts under the 150-px art band (the approved board: art, then the card as the hero's bottom band) */
@media(max-width:760px){html body .lv2-hb.is-home .has-fm>.lv2-hb-card{min-height:150px}}

/* ---- K13. Fable must-fix round (2026-10-16) ----
   1. the competition select never cuts its value: the shared explorer rule caps it at 42 % (of the 240-px column) at 11 px; here it
      fills a column that is at least 240 px and grows to its longest option (native select intrinsic width), up to 55 % of the row,
      at the spec's 14 px */
/* the row wraps: the search keeps >= 280 px, the select takes its intrinsic width (its longest option, never under 240) and moves
   to its own line only when both cannot share one */
html body .wc-search-row{display:flex;flex-wrap:wrap;gap:12px}
html body .wc-search-row>.wc-search{flex:1 1 280px;min-width:0}
html body .wc-search-row>select#competition-filter{flex:0 1 auto;width:auto;max-width:100%;min-width:240px;padding:0 34px 0 12px;font-size:14px!important;line-height:20px;text-overflow:clip}
/* 2. the phone / tablet UPDATES strip keeps the page gutter on its right ("See all ›" off the viewport edge) */
@media(max-width:760px){html body .tenant-news{padding-right:12px}html body .tenant-news .tenant-news-headline{padding-right:12px;box-sizing:border-box}}
@media(min-width:761px) and (max-width:1023px){html body .tenant-news{padding-right:16px}html body .tenant-news .tenant-news-headline{padding-right:16px;box-sizing:border-box}}

/* ---- K14. dark theme: transparent crests keep their edge (2026-10-16). A dark crest (e.g. Garden Route Badgers) on the dark surface
   gets a thin light outline + faint halo that follows the artwork's own alpha; never a tile or background. Flags / portraits untouched ---- */
:root[data-theme="dark"] body .team-mark-crest>.team-image{filter:drop-shadow(0 0 .5px rgba(255,255,255,.8)) drop-shadow(0 0 1px rgba(255,255,255,.4)) drop-shadow(0 0 4px rgba(255,255,255,.14))}

/* ---- K8. the Betby match card, EXACT (owner 2026-10-16 "Match cards should be exactly like betby with same button placements").
   Measured on demo.betby.com's card layout (/sportsbook/tile/, component `eventCard`; research/betby/CARDS-EXACT.md): 206 px tall,
   padding 12 8 8, radius 8, 1 px rim. Head 16 (glyph 16 + competition 12/600 faint, star 16 at the right, inset 8). The event link
   (padding 8 0 12 8): the status line 16 (live period in the live colour / "Today, 20:30" faint; icons after it; the broadcast glyph
   at the right), 12, two team lines 24 high 8 apart (crest 24, gap 8, name 14/600) with 24-px score boxes (r 8, padding 4, 14/600)
   in a right column. The market: name 12/600 dim inset 8, 8, then ONE 40-px row: equal plates 8 apart (r 8, padding 0 8, label left
   12/600 faint, price right 12/600) and a 32 x 40 "▾" button. Price moves: an 8 px corner triangle (up top-right, down bottom-right).
   Not offered: label + "-" at .3. Betby's colours are its skin; the roles here are wincricket's (surface, gold rim, orange live). ---- */
.wc-bbc{display:none}
html body .wc-cardset .wc-bbc{display:flex}
@media(min-width:761px){
 html body .wc-rows .wc-row:not(.wc-skel-row){display:none}
 html body .wc-rows .wc-bbc{display:flex}
 html body .wc-grid.wc-rows{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:0}
 html body .wc-rows .wc-row.wc-skel-row,html body .wc-tail{height:206px;min-height:206px;box-sizing:border-box}
}
@media(min-width:761px) and (max-width:1023px){html body .wc-rows .wc-bbc.hide-t{display:none}}
@media(min-width:1024px) and (max-width:1279px){html body .wc-rows .wc-bbc.hide-d{display:none}}
@media(min-width:1280px) and (max-width:1599px){html body .wc-rows .wc-bbc.hide-w{display:none}}
@media(min-width:1600px){html body .wc-rows .wc-bbc.hide-x{display:none}}
@media(min-width:1280px){html body .wc-grid.wc-rows{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(min-width:1600px){html body .wc-grid.wc-rows{grid-template-columns:repeat(4,minmax(0,1fr))}}
html body .wc-bbc{flex-direction:column;box-sizing:border-box;min-width:0;height:206px;margin:0;padding:12px 8px 8px;border:1px solid var(--r-hair);border-radius:8px;background:var(--r-surface);box-shadow:var(--r-shadow);color:var(--r-text);text-align:left}
html body .wc-bbc-hd{display:flex;align-items:center;gap:8px;flex:none;height:16px;padding:0 8px;min-width:0}
html body .wc-bbc-cat{display:flex;align-items:center;gap:4px;flex:1 1 auto;min-width:0;height:16px;font-size:12px;line-height:16px;font-weight:600;color:var(--r-faint)}
html body .wc-bbc-cat>.icon{width:16px;height:16px;flex:0 0 16px}
html body .wc-bbc-comp{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html body .wc-bbc .wc-bbc-star{position:relative;display:inline-flex;align-items:center;justify-content:center;flex:0 0 16px;width:16px;height:16px;min-width:16px;min-height:16px;margin:0;padding:0;border:0;border-radius:0;background:none;color:var(--r-faint)}
html body .wc-bbc .wc-bbc-star::after{content:"";position:absolute;inset:-12px}
html body .wc-bbc .wc-bbc-star .icon{width:16px;height:16px}
html body .wc-bbc .wc-bbc-star.saved{color:var(--r-accent)}
html body .wc-bbc .wc-bbc-star.saved .icon{fill:currentColor}
html body .wc-bbc-main{display:flex;flex-direction:column;gap:12px;flex:none;height:104px;box-sizing:border-box;padding:8px 0 12px 8px;border-radius:6px;color:inherit;text-decoration:none;min-width:0}
html body .wc-bbc-st{display:flex;align-items:center;gap:4px;height:16px;min-width:0;padding-right:8px;font-size:12px;line-height:16px;font-weight:600}
html body .wc-bbc-now{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--r-live)}
html body .wc-bbc-when{flex:none;white-space:nowrap;color:var(--r-faint)}
html body .wc-bbc-ics{display:flex;align-items:center;gap:4px;flex:1 1 auto;min-width:0;height:16px}
html body .wc-bbc .wc-bbc-ics .lv2-tv{height:16px;padding:0;border:0;border-radius:0;background:none;gap:2px;font-size:12px;line-height:16px;font-weight:700;color:var(--r-live)}
html body .wc-bbc .wc-bbc-ics .lv2-tv .lv2-tv-ic{width:16px;height:16px}
html body .wc-bbc-air{display:inline-flex;flex:0 0 16px;width:16px;height:16px;color:var(--r-live-dot)}
html body .wc-bbc-teams{display:flex;gap:0;height:56px;min-width:0}
html body .wc-bbc-names{display:flex;flex-direction:column;gap:8px;flex:1 1 auto;min-width:0;padding-right:12px}
html body .wc-bbc-t{display:flex;align-items:center;gap:8px;height:24px;min-width:0}
html body .wc-bbc-t>.team-mark{width:24px;height:24px;min-width:24px;flex:0 0 24px;margin:0}
html body .wc-bbc-t>.team-mark:has(img)>span{visibility:hidden}
html body .wc-bbc-n{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px;line-height:24px;font-weight:600;color:var(--r-text)}
html body .wc-bbc-sc{display:grid;grid-auto-rows:24px;row-gap:8px;flex:none;align-content:start}
html body .wc-bbc-box{display:flex;align-items:center;justify-content:center;box-sizing:border-box;min-width:32px;height:24px;padding:4px;border:1px solid var(--r-hair);border-radius:8px;background:var(--r-score-bg);color:var(--r-score-ink);font-size:14px;line-height:16px;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
html body .wc-bbc-box.is-empty{visibility:hidden}
html body .wc-bbc-mk{display:flex;flex-direction:column;gap:8px;flex:none;height:64px;min-width:0}
html body .wc-bbc-mt{height:16px;margin:0;padding:0 8px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;line-height:16px;font-weight:600;color:var(--r-dim)}
html body .wc-bbc-row{display:flex;align-items:flex-end;gap:8px;height:40px;min-width:0}
html body .wc-bbc-px{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:8px;flex:1 1 auto;min-width:0;height:40px}
html body .wc-bbc-px>.lv2-qg{display:contents}
html body .wc-bbc .lv2-odd.fx,html body .wc-bbc .lv2-odd.is-readonly{position:relative;display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:4px;box-sizing:border-box;width:auto;height:40px;min-height:40px;min-width:0;margin:0;padding:0 8px;border-radius:8px;font-size:12px;line-height:14px}
html body .wc-bbc .lv2-odd .fx-k{flex:0 1 auto;min-width:0;overflow:visible;text-overflow:clip;white-space:nowrap;font-style:normal;font-size:12px;line-height:14px;font-weight:600;letter-spacing:0;color:var(--fx-key);opacity:1}
html body .wc-bbc .lv2-odd b{flex:none;margin:0;font-size:12px;line-height:14px;font-weight:600;letter-spacing:0;font-variant-numeric:tabular-nums;color:var(--fx-ink);text-align:right}
html body .wc-bbc .lv2-odd.is-selected :is(.fx-k,b){color:inherit}
html body .wc-bbc .lv2-odd.fx.is-lock b svg{width:12px;height:12px}
html body .wc-bbc .lv2-odd.is-na,html body .wc-bbc .lv2-odd.is-off.is-readonly{opacity:.3}
html body .wc-bbc .lv2-odd.is-na :is(.fx-k,b){color:var(--fx-ink)}
html body .wc-bbc .k-s{display:none}
/* a card under ~340 px (phones under 360, the 2-column grid to 900, the 300-px agenda to 1679) has ~80-px plates: "X" keeps a
   3-digit price whole */
@media(max-width:359px){html body .wc-bbc .k-l{display:none}html body .wc-bbc .k-s{display:inline}}
@media(max-width:359px){html body .wc-bbc .wc-bbc-n{font-size:13px}}
@media(min-width:761px) and (max-width:900px){html body .wc-rows .wc-bbc .k-l{display:none}html body .wc-rows .wc-bbc .k-s{display:inline}}
@media(max-width:1679px){html body .wc-ag-list .wc-bbc .k-l{display:none}html body .wc-ag-list .wc-bbc .k-s{display:inline}}
/* price moves: Betby's 8 px corner triangle, up in the top-right corner, down in the bottom-right; the plate keeps its colour */
html body .wc-bbc .lv2-odd:is(.flash-up,.flash-down){box-shadow:none}
html body .wc-bbc .lv2-odd:is(.flash-up,.flash-down) b{color:var(--fx-ink)}
html body .wc-bbc .lv2-odd:is(.flash-up,.flash-down)::after{content:"";position:absolute;top:auto;bottom:auto;right:3px;left:auto;width:0;height:0;margin:0;border:0;border-left:8px solid transparent;pointer-events:none;order:0}
html body .wc-bbc .lv2-odd.flash-up::after{top:3px;border-top:8px solid var(--r-up)}
html body .wc-bbc .lv2-odd.flash-down::after{bottom:3px;border-bottom:8px solid var(--r-down)}
/* the exchange model as a card (the admin's flip): one row of key · BACK · LAY pairs in the same 40-px row */
html body .wc-bbc-px.is-bl .wc-blp{display:grid;grid-template-columns:auto minmax(0,1fr) minmax(0,1fr);align-items:center;gap:4px;min-width:0}
html body .wc-bbc-px.is-bl .wc-blp>.fx-k{padding:0 2px;font-style:normal;font-size:12px;line-height:14px;font-weight:600;color:var(--fx-key)}
html body .wc-bbc-px.is-bl .lv2-odd:is(.back,.lay){height:40px;min-height:40px;min-width:0;padding:0 2px;border-radius:8px}
html body .wc-bbc-px.is-bl .lv2-odd:is(.back,.lay) b{font-size:12px;line-height:14px;font-weight:600}
html body .wc-bbc-px.is-bl .lv2-odd:is(.back,.lay) small{display:none}
html body .wc-bbc-more{display:flex;align-items:center;justify-content:center;flex:0 0 32px;box-sizing:border-box;width:32px;height:40px;border-radius:8px;background:linear-gradient(180deg,var(--fx-cell-top),var(--fx-cell));box-shadow:inset 0 0 0 1px var(--fx-rim);color:var(--fx-key)}
html body .wc-bbc-more>svg{width:16px;height:16px;opacity:.8}
/* B9 2026-10-25: 44 px touch hit area; the visible cell stays 32x40. */
@media (pointer:coarse){html body .wc-bbc-more{position:relative}html body .wc-bbc-more::after{content:"";position:absolute;inset:-2px -6px}}
@media(hover:hover){html body .wc-bbc-more:hover{box-shadow:inset 0 0 0 1px var(--fx-rim-hover);color:var(--fx-ink)}}
html body .wc-bbc-row.is-bar>*{flex:1 1 auto;width:100%;height:40px;min-width:0}
html body .wc-bbc-all{display:flex;align-items:center;justify-content:center;box-sizing:border-box;border-radius:8px;background:linear-gradient(180deg,var(--fx-cell-top),var(--fx-cell));box-shadow:inset 0 0 0 1px var(--fx-rim);font-size:12px;line-height:40px;font-weight:700;color:var(--fx-ink);text-decoration:none;white-space:nowrap}
html body .wc-bbc-row.is-bar>.wc-lock{height:40px;border-radius:8px}
/* the hero's featured match (night glass on the hero art, both themes) and the Live page's featured card: the same card */
html body .wc-hero-set .wc-bbc{backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
html body .wc-feat-set{max-width:460px}
/* the agenda column: the same card anatomy, frameless inside the panel with a divider between cards (never a card in a card) */
html body .wc-ag-list .wc-bbc{height:206px;border:0;border-radius:0;box-shadow:none;background:none}
html body .wc-ag-list .wc-bbc+.wc-bbc{box-shadow:inset 0 1px 0 var(--r-div)}
/* K8b. phones (Fable must-fix 2026-10-16): home Live / Starting soon show the same Betby card full width, one column, 16 apart (Betby's
   phone: 374 x 206 cards, 222 px pitch); the rows and the league strips are gone below 761 px too */
@media(max-width:760px){
 html body .wc-grid.wc-rows{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;margin:0}
 html body .wc-rows>.wc-lg,html body .wc-rows .wc-lg-rows{display:contents;overflow:visible}
 html body .wc-rows .wc-lg-head,html body .wc-rows .wc-row:not(.wc-skel-row){display:none}
 html body .wc-rows .wc-bbc{display:flex}
 html body .wc-rows .wc-bbc.hide-p{display:none}
 html body .wc-rows .wc-row.wc-skel-row{height:206px;box-sizing:border-box}
}
/* K8c. the Live page (owner 2026-10-16 "#/live here match cards need to be like betby also"): every live match is the Betby card in
   Betby's live tile grid: no league strips, cards 16 apart, as many ≥ 360-px columns as fit (Betby: 405-488-px cards; here 369-482),
   one full-width column on phones. The "Coming up" agenda leaves the Live page (Betby's live page has none), so the cards keep
   Betby's width at 1440 */
html body .wc-match-groups:has(>.wc-league .wc-bbc){display:grid;grid-template-columns:repeat(auto-fill,minmax(360px,1fr));gap:16px;margin:0}
html body .wc-match-groups:has(>.wc-league .wc-bbc)>.wc-league,html body .wc-match-groups:has(>.wc-league .wc-bbc) .wc-league-events{display:contents;overflow:visible}
html body .wc-match-groups:has(>.wc-league .wc-bbc) .wc-league>header{display:none}
html body .wc-league-events>.wc-bbc{display:flex}
/* a league with one live match: sports-explorer.css spans the old per-league grid's only child (grid-column 1/-1); with the league
   and its events display:contents the card is a cell of the Live grid, so it takes one column like every other card. The
   agenda leaves only the Live page's layout (.wc-lp, set by sports-explorer.js boardLayout(liveOnly)); #/sports keeps it */
html body .wc-match-groups:has(>.wc-league .wc-bbc) .wc-league-events>:only-child{grid-column:auto}
@media(max-width:760px){html body .wc-match-groups:has(>.wc-league .wc-bbc){grid-template-columns:minmax(0,1fr);margin:0}}
@media(min-width:1440px){
 html body .wc-board-layout.wc-lp{grid-template-columns:minmax(0,1fr)}
 html body .wc-board-layout.wc-lp>.wc-agenda{display:none}
}
/* live tennis (Betby's live card): games plain, the point in the live colour, the server slot, the sets-won box; 8 apart, rows 24 / 8 */
html body .wc-bbc-sc.is-ten{grid-auto-flow:column;grid-template-rows:24px 24px;grid-auto-columns:auto;column-gap:8px;row-gap:8px;align-items:center}
html body .wc-bbc-sc.is-ten>:is(.wc-bbc-g,.wc-bbc-p){min-width:8px;font-size:14px;line-height:18px;font-weight:600;text-align:center;font-variant-numeric:tabular-nums;white-space:nowrap;color:var(--r-text)}
html body .wc-bbc-sc.is-ten>.wc-bbc-p{color:var(--r-live)}
html body .wc-bbc-sc.is-ten>.wc-bbc-sv{width:8px;height:8px}
/* =====================================================================================================================
   CMS-3 site content (WYN_BRAND.siteContent, wincricket only; lobby-v2.js cmsBoard / promoNav, promotions-view.js).
   The banners are marketing copy of any length (label 24, title 40 with one break, copy 90, CTA 20): every CMS card sizes to its
   copy (the copy is in the flow, the art and the shade are layers under it), so nothing is clamped, cut or laid over the art's
   own edge; the board keeps the built-in board's sizes as its minimums. Text floor 12 px.
   ===================================================================================================================== */
html body .lv2-hb.is-cms .lv2-hb-card{display:flex;flex-direction:column;justify-content:flex-end;height:auto;aspect-ratio:auto}
html body .lv2-hb.is-cms .lv2-hb-card>img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:50% 50%;filter:none;-webkit-mask-image:none;mask-image:none;transform:none}
html body .lv2-hb.is-cms .lv2-hb-card:hover>img{transform:scale(1.03)}
html body .lv2-hb.is-cms .lv2-hero-copy{position:relative;inset:auto;z-index:3;width:auto;max-width:none;overflow:visible;display:flex;flex-direction:column;gap:8px;padding:18px}
html body .lv2-hb.is-cms :is(.lv2-eyebrow,.lv2-hero-copy h2,.lv2-hero-copy p,.lv2-hero-cta){overflow-wrap:anywhere}
html body .lv2-hb.is-cms .lv2-hero-copy h2{line-height:1.25}
html body .lv2-hb.is-cms .lv2-hero-copy p{display:block;-webkit-line-clamp:unset;overflow:visible;margin:0}
html body .lv2-hb.is-cms .lv2-hero-cta{display:inline-flex;align-self:flex-start;max-width:100%;height:auto;min-height:40px;padding:8px 16px;white-space:normal;text-align:left;line-height:1.25;font-size:14px}
html body .lv2-hb.is-cms .lv2-hero-cta .icon{flex:0 0 auto}
html body .lv2-hb.is-cms .lv2-hero-shade{background:linear-gradient(0deg,var(--hb-ink) 0%,rgba(11,6,20,.74) 48%,rgba(11,6,20,.36) 100%)}
html body .lv2-hb.is-cms>.lv2-hb-lead{display:flex;overflow:hidden;border:0;background:none}
html body .lv2-hb.is-cms .lv2-hb-lead>.lv2-hb-card{position:relative;inset:auto;flex:1 1 auto;min-width:0;border:1px solid var(--hb-rim);border-radius:18px}
html body .lv2-hb.is-cms .lv2-hb-card:focus-visible{outline:3px solid var(--r-gold);outline-offset:-3px}
/* the hold: the hero's box until the first answer (sized by what this browser showed last time) */
.lv2-hb-hold{height:372px;margin:8px 0 0;border-radius:18px;border:1px solid var(--hb-rim,rgba(247,210,42,.2));background:linear-gradient(100deg,#150323 30%,#22073A 50%,#150323 70%);background-size:220% 100%;animation:lv2Shimmer 1.2s linear infinite}
.lv2-hb-hold.is-cms{height:225px}
@media(prefers-reduced-motion:reduce){.lv2-hb-hold{animation:none}}
@media(max-width:760px){
 /* the phone: every banner in one swipe rail (the next one peeks), dots under it */
 html body .lv2-hb.is-cms{display:flex;gap:10px;margin:8px 0 0;padding:0;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none}
 html body .lv2-hb.is-cms::-webkit-scrollbar{display:none}
 html body .lv2-hb.is-cms>.lv2-hb-lead,html body .lv2-hb.is-cms .lv2-hb-card.wc-promo{flex:0 0 calc(100% - 28px);height:auto;min-height:208px;scroll-snap-align:start}
 html body .lv2-hb.is-cms.n0>.lv2-hb-lead{flex-basis:100%}
 html body .lv2-hb.is-cms .lv2-hb-card.wc-promo{display:flex;border-radius:18px;border:1px solid var(--hb-rim)}
 html body .lv2-hb.is-cms>.lv2-hb-more{display:contents}
 html body .lv2-hb.is-cms .lv2-hero-copy{padding:16px}
 html body .lv2-hb.is-cms .lv2-hero-copy h2{font-size:22px}
 html body .lv2-hb.is-cms .lv2-hero-copy h2>span{display:block}
 html body .lv2-hb.is-cms .lv2-hero-copy p{font-size:14px}
 html body .lv2-hb.is-cms+.lv2-hb-dots{display:flex}
 html body .lv2-hb.is-cms.n0+.lv2-hb-dots{display:none}
}
@media(min-width:761px){
 html body .lv2-hb.is-cms{height:auto;grid-template-rows:minmax(300px,auto) minmax(150px,auto)}
 html body .lv2-hb.is-cms.n0{grid-template-rows:minmax(300px,auto)}
 html body .lv2-hb.is-cms.has-more{grid-template-rows:minmax(300px,auto) minmax(150px,auto) auto}
 html body .lv2-hb.is-cms .lv2-hb-lead .lv2-hero-copy{width:min(56%,560px);justify-content:center;gap:10px;padding:28px 30px}
 html body .lv2-hb.is-cms .lv2-hb-lead .lv2-hb-card{justify-content:center}
 html body .lv2-hb.is-cms .lv2-hb-lead .lv2-hero-shade{background:linear-gradient(90deg,var(--hb-ink) 0%,rgba(11,6,20,.78) 42%,rgba(11,6,20,.08) 78%)}
 html body .lv2-hb.is-cms .lv2-hb-lead .lv2-hero-copy p{font-size:16px;max-width:30em}
 html body .lv2-hb.is-cms .lv2-hb-lead .lv2-hero-cta{min-height:44px;padding:10px 20px;font-size:16px}
 html body .lv2-hb.is-cms .wc-promo{min-height:150px;justify-content:stretch}
 html body .lv2-hb.is-cms .wc-promo .lv2-hero-copy{flex:1 1 auto;justify-content:flex-start;gap:6px;padding:14px 18px}
 html body .lv2-hb.is-cms .wc-promo .lv2-hero-copy h2{font-size:16px;line-height:1.3;font-weight:700}
 html body .lv2-hb.is-cms .wc-promo .lv2-hero-copy h2>span{display:inline}
 html body .lv2-hb.is-cms .wc-promo .lv2-hero-cta{margin-top:auto;min-height:36px;padding:7px 14px;font-size:14px;box-shadow:none}
 html body .lv2-hb.is-cms .wc-promo .lv2-hero-shade{background:linear-gradient(90deg,var(--hb-ink) 0%,rgba(11,6,20,.8) 52%,rgba(11,6,20,.34) 100%)}
 html body .lv2-hb.is-cms>.lv2-hb-more{grid-column:1/-1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
 html body .lv2-hb.is-cms>.lv2-hb-more.m1{grid-template-columns:minmax(0,1fr)}
 html body .lv2-hb.is-cms>.lv2-hb-more>.wc-promo{min-height:132px}
 .lv2-hb-hold{height:482px;margin:16px 0 0}
 .lv2-hb-hold.is-cms{height:462px}
}
@media(min-width:1200px){
 html body .lv2-hb.is-cms,html body .lv2-hb.is-cms.n1{height:auto;grid-template-rows:minmax(380px,auto)}
 html body .lv2-hb.is-cms.n0{height:auto;grid-template-rows:minmax(340px,auto)}
 html body .lv2-hb.is-cms.n2{grid-template-rows:repeat(2,minmax(184px,auto))}
 html body .lv2-hb.is-cms.n3{grid-template-rows:repeat(3,minmax(118px,auto))}
 html body .lv2-hb.is-cms.has-more{grid-template-rows:repeat(3,minmax(118px,auto)) auto}
 html body .lv2-hb.is-cms.has-more>.lv2-hb-lead{grid-row:1/4}
 html body .lv2-hb.is-cms>.lv2-hb-more{grid-row:4;grid-template-columns:repeat(4,minmax(0,1fr))}
 html body .lv2-hb.is-cms>.lv2-hb-more:is(.m1,.m2,.m3){grid-template-columns:repeat(var(--m,2),minmax(0,1fr))}
 html body .lv2-hb.is-cms>.lv2-hb-more.m1{--m:1}html body .lv2-hb.is-cms>.lv2-hb-more.m2{--m:2}html body .lv2-hb.is-cms>.lv2-hb-more.m3{--m:3}
 html body .lv2-hb.is-cms .wc-promo{min-height:0}
 html body .lv2-hb.is-cms>.lv2-hb-more>.wc-promo{min-height:140px}
 html body .lv2-hb.is-cms.n3>.wc-promo .lv2-hero-copy{gap:4px;padding:12px 16px}
 html body .lv2-hb.is-cms.n3>.wc-promo .lv2-hero-cta{min-height:32px;padding:6px 12px;font-size:13px}
 html body .lv2-hb.is-cms .lv2-hb-lead .lv2-hero-copy h2{font-size:32px}
 .lv2-hb-hold,.lv2-hb-hold.is-cms{height:380px}
}
@media(min-width:1600px) and (min-height:940px){
 html body .lv2-hb.is-cms,html body .lv2-hb.is-cms.n1{grid-template-rows:minmax(420px,auto)}
 html body .lv2-hb.is-cms.n0{grid-template-rows:minmax(380px,auto)}
 html body .lv2-hb.is-cms.n2{grid-template-rows:repeat(2,minmax(204px,auto))}
 html body .lv2-hb.is-cms.n3,html body .lv2-hb.is-cms.has-more{grid-template-rows:repeat(3,minmax(132px,auto))}
 html body .lv2-hb.is-cms.has-more{grid-template-rows:repeat(3,minmax(132px,auto)) auto}
 html body .lv2-hb.is-cms .lv2-hb-lead .lv2-hero-copy{padding:36px 40px}
 html body .lv2-hb.is-cms .lv2-hb-lead .lv2-hero-copy h2{font-size:40px}
 .lv2-hb-hold,.lv2-hb-hold.is-cms{height:420px}
}
/* the Promotions nav entry: the rail and the tab bar carry it like any page (views.js navItems); in the masthead it sits beside the
   product switch as a quiet link from 1200 px, where the masthead has the room */
html body .masthead .product-nav>.wc-nav-promos{display:none}
@media(min-width:1200px){
 html body .masthead .product-nav>.wc-nav-promos{display:inline-flex;white-space:nowrap}
}
/* ---- #/promotions ---- */
.wc-pp{padding:20px 0 8px}
.wc-pp-head{margin:0 0 18px}
.wc-pp-head .lv2-eyebrow{font-size:12px;line-height:16px;letter-spacing:.12em;color:var(--r-accent,var(--brand))}
.wc-pp-head h1{display:flex;align-items:center;gap:10px;margin:4px 0 6px;font-size:28px;line-height:1.15;font-weight:700;color:var(--r-text,var(--text))}
.wc-pp-head h1>small{font-size:12px;line-height:20px;font-weight:700;padding:0 8px;border-radius:6px;background:var(--r-score-bg,var(--control));color:var(--r-score-ink,var(--text))}
.wc-pp-head p{margin:0;max-width:44em;font-size:14px;line-height:1.45;color:var(--r-dim,var(--dim))}
.wc-pp-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;align-items:stretch}
@media(min-width:761px){.wc-pp-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.wc-pp-head h1{font-size:32px}}
@media(min-width:1280px){.wc-pp-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.wc-pc{scroll-margin-top:calc(var(--header,67px) + 12px);position:relative;display:flex;flex-direction:column;min-width:0;border-radius:16px;overflow:hidden;background:var(--r-surface,var(--surface));border:1px solid var(--r-hair,var(--line));box-shadow:var(--r-shadow,none)}
.wc-pc.is-target{border-color:var(--r-gold);box-shadow:0 0 0 3px rgba(247,210,42,.22)}
.wc-pc-media{position:relative;aspect-ratio:2/1;background:#150323;overflow:hidden}
.wc-pc-media>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.wc-pc-tag{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;font-size:12px;line-height:16px;font-weight:700;white-space:nowrap;background:rgba(6,7,14,.78);color:#FFFFFF}
.wc-pc-tag .icon{width:14px;height:14px;color:var(--r-gold)}
.wc-pc-media>.wc-pc-tag{position:absolute;left:12px;bottom:12px}
.wc-pc-tagrow{margin:0 0 10px}
.wc-pc.no-media .wc-pc-tag{background:var(--r-score-bg,var(--control));color:var(--r-score-ink,var(--text))}
.wc-pc.no-media{border-top:3px solid var(--r-gold)}
.wc-pc-b{display:flex;flex-direction:column;flex:1 1 auto;padding:16px 18px 18px}
.wc-pc-title{margin:0;font-size:20px;line-height:1.25;font-weight:700;color:var(--r-text,var(--text));overflow-wrap:anywhere}
.wc-pc-sum{margin:8px 0 0;font-size:14px;line-height:1.5;color:var(--r-dim,var(--dim));overflow-wrap:anywhere}
.wc-pc-accs{margin:14px 0 0;border-top:1px solid var(--r-div,var(--line))}
.wc-pc-acc{border-bottom:1px solid var(--r-div,var(--line))}
.wc-pc-acc>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px;padding:10px 0;cursor:pointer;list-style:none;font-size:14px;line-height:20px;font-weight:600;color:var(--r-text,var(--text))}
.wc-pc-acc>summary::-webkit-details-marker{display:none}
.wc-pc-acc>summary .icon{flex:0 0 auto;width:16px;height:16px;color:var(--r-faint,var(--faint));transform:rotate(90deg);transition:transform .2s var(--lv2-ease,ease)}
.wc-pc-acc[open]>summary .icon{transform:rotate(-90deg)}
.wc-pc-acc>summary:focus-visible{outline:2px solid var(--r-gold);outline-offset:2px;border-radius:4px}
.wc-pc-acc:not([open])>.wc-pc-acc-in{display:none}
.wc-pc-acc-in{padding:0 0 14px;font-size:14px;line-height:1.55;color:var(--r-dim,var(--dim));overflow-wrap:anywhere}
.wc-pc-acc-in p{margin:0 0 10px}.wc-pc-acc-in p:last-child{margin:0}
.wc-pc-acc-in :is(ul,ol){margin:0 0 10px;padding-left:20px}.wc-pc-acc-in :is(ul,ol):last-child{margin-bottom:0}
.wc-pc-acc-in li{margin:0 0 6px}
.wc-pc-acc.is-terms .wc-pc-acc-in{font-size:13px}
.wc-pc-cta{display:flex;align-items:center;justify-content:center;gap:10px;min-height:44px;padding:10px 18px;border-radius:10px;background:var(--r-gold);color:var(--r-gold-ink);font-size:15px;line-height:20px;font-weight:700;text-align:center;text-decoration:none;overflow-wrap:anywhere}
.wc-pc-cta .icon{flex:0 0 auto;width:15px;height:15px}
.wc-pc-cta:hover{filter:brightness(1.05)}
.wc-pc-cta:focus-visible{outline:3px solid var(--r-text,var(--text));outline-offset:2px}
.wc-pc-b>.wc-pc-cta{margin-top:auto}
.wc-pc-b>:nth-last-child(2):not(:first-child){margin-bottom:16px}
.wc-pc.is-skel{pointer-events:none}
.wc-pc.is-skel .wc-pc-media,.wc-pc.is-skel .wc-pc-b>i{background:linear-gradient(100deg,var(--control) 30%,var(--surface-3,var(--surface-2)) 50%,var(--control) 70%);background-size:220% 100%;animation:lv2Shimmer 1.2s linear infinite}
.wc-pc.is-skel .wc-pc-b>i{display:block;height:14px;border-radius:6px;margin:0 0 10px}
.wc-pc.is-skel .wc-pc-b>i:first-child{width:70%;height:20px}.wc-pc.is-skel .wc-pc-b>i:last-child{width:45%}
.wc-pp-empty{display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;padding:48px 20px;border-radius:16px;border:1px dashed var(--r-hair,var(--line));background:var(--r-surface,var(--surface))}
.wc-pp-empty-ic{display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:var(--r-score-bg,var(--control));color:var(--r-accent,var(--brand))}
.wc-pp-empty-ic .icon{width:30px;height:30px}
.wc-pp-empty h2{margin:4px 0 0;font-size:20px;line-height:1.3;font-weight:700;color:var(--r-text,var(--text))}
.wc-pp-empty p{margin:0;max-width:30em;font-size:14px;line-height:1.5;color:var(--r-dim,var(--dim))}
.wc-pp-empty-go{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:8px}
.wc-pp-foot{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin:20px 0 0;font-size:13px;line-height:18px;color:var(--r-faint,var(--faint))}
.wc-pp-foot a{color:var(--r-accent,var(--brand));font-weight:600}
/* ---- fe-int 2026-10-16: the integrated no-clip gate (owner hard rule: no clipped or overlapping text), wincricket only ---- */
/* the signed-in masthead overflowed the viewport at 761-1279 px (Deposit and the avatar cut at 768 and 1024): the search box is an icon
   from 1024 to 1279; from 761 to 1023 the masthead takes the phone set (no theme / bets buttons, the short balance) */
@media(min-width:1024px) and (max-width:1279px){
 html body .masthead:has(.wc-wallet) .search-trigger{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;min-width:40px;padding:0}
 html body .masthead:has(.wc-wallet) .search-trigger>:is(span,kbd){display:none}
}
@media(min-width:761px) and (max-width:1023px){
 html .masthead:has(.wc-wallet) :is(.theme-control,.header-bets){display:none}
 html .masthead:has(.wc-wallet) :is(.wc-wallet-label,.wc-amt-full){display:none}
 html .masthead:has(.wc-wallet) .wc-amt-short{display:inline}
}
/* a long team name under 360 px (e.g. "Beliye Medveditsy Chelyabinsk" beside "All markets") takes a second line, whole, never "…" */
@media(max-width:359px){
 html body .wc-row .wc-row-teams{grid-auto-rows:minmax(22px,auto)}
 html body .wc-row .wc-row-t>.wc-row-n{white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere;line-height:18px}
}
/* wallet / statement rows on phones: the title and its detail get the row's full width (they were cut to "Dep…" at 320-412);
   amount + time + status go under them */
@media(max-width:760px){
 html body .tx-row{display:grid;grid-template-columns:34px minmax(0,1fr) auto;column-gap:12px;row-gap:6px;align-items:center}
 html body .tx-row>.tx-icon{grid-row:1/span 2;align-self:start}
 html body .tx-row>.tx-main{grid-column:2/-1;grid-row:1}
 html body .tx-row>.tx-side{grid-column:2;grid-row:2;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:4px 10px;min-width:0}
 html body .tx-row>.text-link{grid-column:3;grid-row:2;margin-left:0}
}
/* CMS banners: each title line (the editor's line break) is its own line at every width, as on phones (at 1280 the 5-8 row's
   inline lines wrapped into each other) */
html body .lv2-hb.is-cms .lv2-hero-copy h2>span,html body .lv2-hb.is-cms .wc-promo .lv2-hero-copy h2>span{display:block}
/* the casino category bar: where a label wraps (from 1024 px) its count sits on its own line under it, as "Originals 32" already does */
@media(min-width:1024px){html body .lv2-cat:not(.wc-strip .lv2-cat)>b>small{display:table;margin:2px auto 0}}
/* the search dialog's team pair: the two marks sit side by side (2 px apart) instead of the shared -5 px stack, so transparent crests and
   portraits never lie over each other (fe-int no-clip gate) */
html body .search-team-pair .team-mark+.team-mark{margin-left:2px}
/* fe-int M2 (Fable 2026-10-17, pre-existing on live): at 761-1023 the account overview is two cards side by side and the Performance
   metrics' three ~82 px columns split "₹38,250.00" mid-number: two columns there, and a money figure never wraps (account.css untouched) */
@media(min-width:761px) and (max-width:1023px){
 html body .account-mini-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
 html body .account-mini-metrics .account-metric>strong{overflow-wrap:normal;white-space:nowrap}
}
/* the same metrics under 360 px (found by the gate's MULTILINE money check: "₹38,250.00" split at 320): two columns, one line */
@media(max-width:359px){
 html body .account-mini-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
 html body .account-mini-metrics .account-metric>strong{overflow-wrap:normal;white-space:nowrap}
}

/* ---- UX backlog R1 on wincricket (2026-10-17, lane ux-r1-wc; docs/operations/ux-backlog-2026-10-07/records/R1-WINCRICKET.md) ----
   UX-04: every header control is a 44 x 44 target. The search button gets the masthead's own hit area (the ::after of at least
   44 x 44 that the signed-in controls already carry; no visual change); on phones the UPDATES strip is 44 px high, so its
   full-width "See all" button is a 44 px target (it was 28.6). UX-07: the light theme's "Confirmed" chip in the wallet list holds 4.5:1. */
html body .masthead .search-trigger{position:relative}
html body .masthead .search-trigger::after{content:"";position:absolute;left:50%;top:50%;width:max(100%,44px);height:max(100%,44px);transform:translate(-50%,-50%)}
@media(max-width:760px){
 html body .tenant-news,html body .tenant-news[data-news-card]{height:44px;min-height:44px;padding-block:0}
 html body .tenant-news .tenant-news-headline,html body .tenant-news[data-news-card] .tenant-news-headline{min-height:44px}
}
:root:not([data-theme="dark"]) body .tx-meta .account-status.positive{color:#17633f}