/* SkyFair theme (yl02). Every colour, font size and control size below was measured from the live skyfair.biz
   (desktop 1366px, phone 393px). Loaded last. On phones, sizes scale with screen width like the reference:
   --u is 1px at 375px wide (1.048px at 393px), capped at 1.2px. */
:root{
    --u:1px;
    --font:Tahoma,Helvetica,sans-serif;
    --font-mobile:Helvetica,Tahoma,sans-serif;
    --text:#1e1e1e;--text-2:#3b5160;--text-3:#777;--link:#2789ce;--neg:#d0021b;--pos:#508d0e;
    --gold:#ffb200;--gold-2:#ffb80c;
    --gold-bg:linear-gradient(180deg,#ffcc2e,#ffbd14);
    --gold-select:#ffdc7a;
    --dark-bg:linear-gradient(180deg,#474747,#070707);
    --dark-bg-hover:linear-gradient(180deg,#070707,#474747);
    --header-bg:linear-gradient(180deg,#383838,#010101);
    --red-bg:linear-gradient(180deg,#f72424,#bb1c00);
    --grey-btn:linear-gradient(180deg,#666,#333);
    --grey-btn-m:linear-gradient(180deg,#777,#4c4c4c);
    --live-bg:linear-gradient(180deg,#f82d2d,#ea0a0a);
    --slate-bg:linear-gradient(180deg,#2c485a,#243a48);
    --slate:#243a48;--tab:#3b5160;
    --login-bg:linear-gradient(56deg,#ffcc2e 4%,#ffb80c 42%);
    --page:#eee;--line:#e0e6e6;--line-2:#7e97a7;--head:#dddcd6;--head-2:#ced5da;
    --back:#72bbef;--lay:#faa9ba;--back-light:#beddf4;--lay-light:#f3dce2;
    --shine:inset 0 2px 0 rgba(255,255,255,.25);
    --lift:0 1px 2px rgba(0,0,0,.25);
    --ease:.15s ease;
}
@media(max-width:700px){:root{--u:min(calc(100vw / 375),1.2px)}}

/* ---------- Base ---------- */
html{line-height:1.2}
body{font-family:var(--font);color:var(--text);background:var(--page);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
@media(max-width:700px){body{font-family:var(--font-mobile)}}
a,button,input,select,.odd{transition:background-color var(--ease),color var(--ease),border-color var(--ease),box-shadow var(--ease),filter var(--ease)}
:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.odd,.mini-odds,#wallet-balance,#wallet-exposure,td{font-variant-numeric:tabular-nums}
button:active,.guest-actions>a:active{filter:brightness(.92)}

/* Dark / gold button used across the app (reference "main-btn") */
.filters button,.pagination a,.btn-check,.casino-search button,.casino-pager a,.casino-back,.settings-save,.policy-close,.slip-actions button:last-child{
    background:var(--dark-bg);border:1px solid #222;color:var(--gold);font-weight:bold;cursor:pointer}
.filters button:hover,.pagination a:hover,.btn-check:hover,.casino-search button:hover,.casino-pager a:hover,.casino-back:hover,.settings-save:hover,.policy-close:hover,.slip-actions button:last-child:hover{background:var(--dark-bg-hover)}

/* ---------- Logo (reference: PNG wordmark, 150x55 box on desktop, 161x48 on phone) ---------- */
.logo{display:flex;align-items:center;flex:0 0 auto;font-size:0;line-height:0;text-shadow:none}
.logo picture{display:contents}
.logo img{display:block;width:100%;height:100%;object-fit:contain}
.site-header .logo{width:132px;height:48px;margin-right:15px}
@media(max-width:700px){.site-header .logo img{object-position:left center}}
.login-art .logo{width:calc(300 * var(--u));height:calc(80 * var(--u));max-width:80%}

/* ---------- Desktop header (74px, gradient #383838 -> #010101) ---------- */
.site-header{background:var(--header-bg)}
.header-row{max-width:none;height:74px;padding:0 20px;gap:0}
.event-search{position:relative;width:280px;height:25px;padding:0 3px 0 24px;border:1px solid #bbb;border-radius:4px;background:#fff;box-shadow:inset 0 1px 0 rgba(0,0,0,.5);font-size:12px}
.event-search>span{position:absolute;left:6px;top:50%;transform:translateY(-50%);font-size:13px;line-height:1;color:#1e1e1e}
.event-search input{font-size:12px;color:var(--text);background:none}
.guest-actions{gap:0}
.guest-actions>a{display:flex;align-items:center;justify-content:center;gap:4px;height:25px;min-width:80px;margin-left:10px;padding:0 10px;border:0;border-radius:4px;font-size:12px;font-weight:bold;line-height:1;color:#fff;box-shadow:none}
.guest-actions .signup{order:2;background:var(--grey-btn)}
.guest-actions .login-btn{order:1;background:var(--red-bg)}
.guest-actions>a:hover{filter:brightness(1.12)}
.guest-actions>a:not(.signup):not(.login-btn){background:rgba(255,255,255,.1);border:1px solid rgba(0,0,0,.3);color:var(--gold)}
.ico-person{width:11px;height:11px;fill:currentColor;flex:0 0 auto}

/* Menu bar (30px, gold gradient, 12px bold) */
.desktop-nav{height:30px;justify-content:flex-start;padding-left:16px;background:var(--gold-bg);overflow:visible}
.desktop-nav a{display:flex;align-items:center;padding:0 10px;font-size:12px;font-weight:bold;color:var(--text);border-right:1px solid rgba(0,0,0,.2)}
.desktop-nav a:hover{background:rgba(255,255,255,.2);text-decoration:underline}
.desktop-nav a.active{background:var(--gold-select);box-shadow:inset 0 0 5px rgba(83,33,33,.8);font-weight:bold}
.desktop-nav b{position:absolute;top:-8px;right:4px;display:flex;align-items:center;gap:0;height:12px;padding:0 3px 0 0;border-radius:0 3px 3px 0;background:var(--live-bg);color:#fff;font-size:10px;font-weight:bold;line-height:12px;overflow:hidden}
.desktop-nav b i{height:12px;margin-right:3px;padding:0 2px;background:#fff;color:#ea0a0a;border-radius:0;font-size:7px;font-style:normal;line-height:12px}

/* Phone header (54u, gradient #474747 -> #070707; buttons 98x34u) */
@media(max-width:700px){
    .site-header{background:var(--dark-bg)}
    .site-header .header-row{height:calc(54 * var(--u));padding:0 calc(7 * var(--u)) 0 calc(3 * var(--u));gap:0}
    .site-header .logo{width:calc(161 * var(--u));max-width:none;height:calc(48 * var(--u));margin-right:auto}
    .guest-actions{gap:calc(4 * var(--u))}
    .guest-actions>a{width:calc(98 * var(--u));min-width:0;height:calc(34 * var(--u));margin:0;padding:calc(6 * var(--u)) calc(4 * var(--u));border-radius:calc(4 * var(--u));font-size:calc(13 * var(--u));box-shadow:var(--shine)}
    .guest-actions .signup{order:1;background:var(--grey-btn-m);border:1px solid #000}
    .guest-actions .login-btn{order:2;background:var(--red-bg);border:1px solid #710b0b}
    .ico-person{width:calc(16 * var(--u));height:calc(16 * var(--u))}
}

/* ---------- Balance bar (logged in; same dark bar as the reference header) ---------- */
.balance-bar{height:44px;gap:5px;padding:5px 7px;background:var(--dark-bg);border-bottom:0;box-shadow:none}
.balance-bar .bets-btn,.balance-bar .wallet-box,.balance-bar .settings-btn{height:34px;border:1px solid #000;border-radius:4px;background:rgba(255,255,255,.1);box-shadow:var(--shine)}
.balance-bar .bets-btn{gap:5px;padding:0 12px 0 8px;font-size:13px;color:var(--gold)}
.balance-bar .bets-btn svg{width:18px;height:18px}
.balance-bar .wallet-lines{padding:0 8px;font-size:12px;line-height:1.2}
.balance-bar .wallet-lines em{color:rgba(255,178,0,.7)}
.balance-bar .wallet-lines b{color:var(--gold);font-weight:bold}
.balance-bar .plus-pill{padding:0 5px;border:1px solid rgba(255,178,0,.5);border-radius:3px;font-size:11px;line-height:14px;color:var(--gold)}
.balance-bar .wallet-refresh{width:34px;background:rgba(255,255,255,.1);border-left:1px solid #000}
.balance-bar .wallet-refresh svg{width:18px;height:18px;fill:#fff}
.balance-bar .settings-btn{width:34px}
.balance-bar .settings-btn svg{width:20px;height:20px;fill:var(--gold)}
.balance-bar .bets-btn:hover,.balance-bar .settings-btn:hover,.balance-bar .wallet-refresh:hover{background:rgba(255,255,255,.18)}
@media(max-width:700px){
    .balance-bar{height:calc(54 * var(--u));gap:calc(4 * var(--u));padding:calc(10 * var(--u)) calc(7 * var(--u))}
    .balance-bar .bets-btn,.balance-bar .wallet-box,.balance-bar .settings-btn{height:calc(34 * var(--u));border-radius:calc(4 * var(--u))}
    .balance-bar .bets-btn{font-size:calc(13 * var(--u));padding:0 calc(10 * var(--u)) 0 calc(7 * var(--u))}
    .balance-bar .bets-btn svg{width:calc(18 * var(--u));height:calc(18 * var(--u))}
    .balance-bar .wallet-lines{font-size:calc(12 * var(--u));padding:0 calc(7 * var(--u))}
    .balance-bar .plus-pill{font-size:calc(11 * var(--u))}
    .balance-bar .wallet-refresh,.balance-bar .settings-btn{width:calc(34 * var(--u))}
}

/* ---------- Home tiles (desktop: 4 columns, 193px tiles, 34px caption; phone: 2 columns, 140u tiles, 28u caption) ---------- */
.home-page{max-width:1024px;background:var(--page)}
.home-tiles{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;padding:0 0 10px}
.home-sports{padding-top:15px}
.home-tile,.home-tile.wide{position:relative;display:block;height:193px;border:0;border-radius:0;background:#1b1b1b;box-shadow:none}
.home-tile.wide{grid-column:span 2}
.home-tile-art{position:absolute;inset:0}
.home-tile footer{position:absolute;left:0;right:0;bottom:0;height:34px;display:flex;align-items:stretch;background:linear-gradient(270deg,transparent 4%,#000 97%)}
.home-tile footer::after{content:'';position:absolute;left:0;right:0;bottom:0;height:4px;background:var(--gold-2)}
.home-tile footer strong{flex:1;display:flex;align-items:center;padding:0 0 4px 6px;font-size:17px;font-weight:bold;color:#fff}
.home-tile footer span{position:relative;flex:0 0 80px;display:flex;align-items:center;justify-content:flex-end;padding:0 8px 4px 0;background:var(--gold-2);color:var(--text);font-size:12px;font-weight:bold;clip-path:polygon(10% 0,100% 0,100% 100%,0 100%,0 calc(100% - 4px),10% 0)}
.home-tile:hover .home-tile-art>img:first-child{transform:scale(1.03);transition:transform .25s}
.home-tile-art{overflow:hidden}
.home-tile-art .live-panel{width:120px;height:auto;max-height:calc(100% - 34px);padding:6px;background:linear-gradient(0deg,transparent,rgba(0,0,0,.82) 50%,#000)}
.home-page .live-panel>b{display:inline-block;margin-left:24px;padding:3px 5px;border-radius:0 3px 3px 0;background:var(--live-bg);font-size:12px;line-height:14px;text-align:left}
.home-page .live-panel div{display:flex;justify-content:space-between;align-items:center;padding-top:5px;font-size:13px;line-height:16px}
.home-page .live-panel em{min-width:16px;height:16px;padding:0 3px;border-radius:3px;background:#fff;color:var(--text);font-size:13px;line-height:16px;text-align:center}
@media(max-width:700px){
    .home-page{max-width:none}
    .home-tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:calc(5 * var(--u));padding:0 calc(5 * var(--u)) calc(5 * var(--u))}
    .home-sports{padding-top:calc(5 * var(--u))}
    .home-tile,.home-tile.wide{height:calc(140 * var(--u))}
    .home-tile footer{height:calc(28 * var(--u));background:linear-gradient(90deg,#000,transparent)}
    .home-tile footer::after{height:calc(4 * var(--u))}
    .home-tile footer strong{padding:0 0 calc(4 * var(--u)) calc(6 * var(--u));font-size:calc(14 * var(--u))}
    .home-tile footer span{flex-basis:calc(56 * var(--u));justify-content:center;padding:0 0 calc(4 * var(--u));font-size:calc(11 * var(--u));clip-path:none;overflow:visible}
    .home-tile footer span::before{content:'';position:absolute;right:100%;top:0;width:calc(11 * var(--u));height:100%;background:var(--gold-2);clip-path:polygon(100% 0,0 100%,100% 100%)}
    .home-tile-art .live-panel{width:calc(89 * var(--u));padding:calc(5 * var(--u));background:linear-gradient(#000 59.5%,transparent)}
    .home-page .live-panel>b{margin-left:0;padding:0 calc(3 * var(--u));font-size:calc(13 * var(--u));line-height:calc(16 * var(--u))}
    .home-page .live-panel div{padding-top:calc(5 * var(--u));font-size:calc(10 * var(--u));line-height:calc(14 * var(--u))}
    .home-page .live-panel em{min-width:calc(16 * var(--u));height:calc(14 * var(--u));border-radius:calc(3 * var(--u));font-size:calc(10 * var(--u));line-height:calc(14 * var(--u))}
}

/* ---------- Support boxes (46u, radius 8u, 13u #4d4d4d on white 60%) ---------- */
.support-links{width:90.67%;max-width:560px;margin:0 auto;padding:20px 0;gap:10px}
.support-card{min-height:46px;padding:7px;gap:4px;border-radius:8px;background:rgba(255,255,255,.6);box-shadow:none;font-size:13px;color:#4d4d4d;line-height:1.2}
.support-card a{padding:0 10px;color:#4d4d4d}
.support-card a:hover{text-decoration:underline}
.support-card i{display:inline-block;width:1px;height:16px;overflow:hidden;background:#6f6f6f;color:transparent}
.support-card>span.sl-ico{width:25px;height:25px}
.sl-ico.round,.sl-ico.square{background:rgba(0,0,0,.7)}
.sl-ico svg{width:14px;height:14px}
.sl-ico.plain{color:rgba(0,0,0,.7)}
.sl-ico.plain svg{width:22px;height:22px}
@media(max-width:700px){
    .support-links,.login-shell .support-links{width:90.67%;padding:calc(20 * var(--u)) 0;gap:calc(10 * var(--u))}
    .support-card{min-height:calc(46 * var(--u));padding:calc(7 * var(--u));border-radius:calc(8 * var(--u));font-size:calc(13 * var(--u))}
    .support-card a{padding:0 calc(10 * var(--u))}
    .support-card>span.sl-ico{width:calc(25 * var(--u));height:calc(25 * var(--u))}
}

/* ---------- Policy links (13u, underlined) ---------- */
.policy-links{max-width:500px;margin:0 auto;padding:10px 10px 0;gap:0;line-height:1.2}
.policy-links a{margin:0 4px 8px;font-size:13px;color:#666;text-decoration:underline}
.policy-links a:not(:last-child):after{content:'';display:inline-block;width:1px;height:1.1em;margin:0 0 0 8px;vertical-align:middle;background:#bbb}
.policy-links a:hover{color:var(--text)}
.policy-links.light{margin:0 auto}
@media(max-width:700px){
    .policy-links{margin:0 calc(10 * var(--u));padding:calc(10 * var(--u)) 0 0}
    .policy-links a{margin:0 calc(4 * var(--u)) calc(8 * var(--u));font-size:calc(13 * var(--u))}
    .policy-links.light{margin-bottom:0}
}

/* ---------- Licence / operator box (reference .anjouan-license) ---------- */
.license-wrap{padding:20px 0 20px}
.license-box{display:flex;align-items:center;gap:10px;max-width:560px;margin:0 auto;padding:10px;border:1px solid #bbb;border-radius:8px;color:#4d4d4d;font-size:11px;line-height:1.4}
.license-box p{flex:1;min-width:0;margin:0}
.license-seal{flex:0 0 50px;display:flex;flex-direction:column;align-items:center;gap:2px}
.license-seal svg{width:34px;height:40px}
.license-seal b{font-size:8px;letter-spacing:.3px;color:#8a1d24;text-transform:uppercase}
@media(max-width:700px){
    .license-wrap{padding:calc(20 * var(--u)) 0}
    .license-box{margin:0 calc(10 * var(--u));gap:calc(10 * var(--u));padding:calc(10 * var(--u));border-radius:calc(8 * var(--u));font-size:calc(11 * var(--u))}
    .license-seal{flex-basis:calc(50 * var(--u))}
    .license-seal svg{width:calc(34 * var(--u));height:calc(40 * var(--u))}
    .license-seal b{font-size:calc(8 * var(--u))}
}

/* ---------- Login (fields 37u/radius 6u/15u, button 41u dark with #ffb200 text) ---------- */
.login-page,.login-shell{background:var(--login-bg);font-family:var(--font-mobile)}
.login-page .close-login{position:absolute;width:calc(35 * var(--u));height:calc(35 * var(--u));top:calc(7 * var(--u));right:calc(7 * var(--u));border-radius:50%;background:rgba(0,0,0,.75);font-size:calc(22 * var(--u));text-shadow:none}
.login-page .login-art .logo{top:50%;filter:none}
.login-page .login-form{margin:calc(51 * var(--u)) auto 0;padding:0 calc(30 * var(--u));max-width:460px;gap:calc(10 * var(--u))}
.login-page .login-form>input,.login-page .captcha{height:calc(37 * var(--u));padding:calc(7 * var(--u)) calc(10 * var(--u));border:0;border-radius:calc(6 * var(--u));background:#fff;box-shadow:inset 0 calc(2 * var(--u)) 0 rgba(0,0,0,.1);font-size:calc(15 * var(--u));color:var(--text)}
.login-page .login-form>input:focus,.login-page .captcha:focus-within{background:#fff;box-shadow:inset 0 calc(2 * var(--u)) 0 rgba(0,0,0,.1),0 0 0 2px rgba(0,0,0,.35)}
.login-page .login-form>input::placeholder,.login-page .captcha input::placeholder{color:#4d4d4d}
.login-page .captcha strong{font-size:calc(20 * var(--u));font-weight:bold;color:#000}
/* Validation code as on skyfair.biz (measured from the reference login at 393px): black bold 20u digits in the phone's
   sans-serif, 6u from the field's right edge. */
.login-page .captcha{padding-right:calc(6 * var(--u))}
.login-page .captcha strong{flex:0 0 auto;font-family:Roboto,Helvetica,Arial,sans-serif;font-weight:700;line-height:1;letter-spacing:0;color:#000}
/* Same server-drawn code as the agent login (validation_code_image): ink 52.8u x 13.9u, 8u from the right edge, centred.
   The text above is only shown when the server cannot draw the image. */
.login-page .captcha.has-img{padding-right:calc(8 * var(--u))}
.login-page .captcha.has-img strong{display:none}
.login-page .captcha .code-img{display:block;flex:0 0 auto;width:calc(52.8 * var(--u));height:calc(13.9 * var(--u));margin:0;padding:0;border:0;pointer-events:none;user-select:none}
.login-page .login-form>button{height:calc(41 * var(--u));margin-top:0;padding:0 calc(10 * var(--u));border:1px solid #222;border-radius:calc(6 * var(--u));background:var(--dark-bg);color:var(--gold);font-size:calc(15 * var(--u));font-weight:bold;box-shadow:none;cursor:pointer}
.login-page .login-form>button:hover{background:var(--dark-bg-hover);color:var(--gold)}
/* Login error (reference): plain red text under the Login button, left edge of the fields */
.login-page .login-error{margin:calc(2 * var(--u)) 0 0;padding:0;background:none;color:#d0021b;font-size:calc(10.5 * var(--u));line-height:1.3;text-align:left}
.login-page .policy-links{margin:calc(30 * var(--u)) auto 0;padding:0 calc(7 * var(--u))}
.login-page .policy-links a{color:rgba(0,0,0,.6)}
.login-page .policy-links a:not(:last-child):after{background:rgba(0,0,0,.3)}
.login-page .support-links{padding-top:calc(40 * var(--u))}
.form-error{font-size:calc(13 * var(--u));color:var(--neg);background:rgba(255,255,255,.55);border-radius:calc(6 * var(--u));padding:calc(8 * var(--u))}
.demo-note{font-size:calc(12 * var(--u));color:rgba(0,0,0,.7);background:rgba(0,0,0,.1)}

/* ---------- Sport strip (phone: 47u strip, 37u tabs radius 6u top, 13u bold; 48u search) ---------- */
.sport-strip{height:calc(47 * var(--u));background:var(--gold-bg);border-bottom:calc(3 * var(--u)) solid #070707;box-sizing:content-box}
.sport-strip-tabs{padding:0 0 0 calc(5 * var(--u));-webkit-mask-image:linear-gradient(90deg,#000 85%,transparent);mask-image:linear-gradient(90deg,#000 85%,transparent)}
.strip-tab{height:calc(37 * var(--u));gap:calc(5 * var(--u));padding:calc(7 * var(--u)) calc(8 * var(--u));border-radius:calc(6 * var(--u)) calc(6 * var(--u)) 0 0;font-size:calc(13 * var(--u));font-weight:bold;color:#070707}
.strip-tab .sport-icon{width:calc(20 * var(--u));height:calc(20 * var(--u));color:#070707}
.strip-tab:not(.active):not(.casino):hover{background:rgba(255,255,255,.2)}
.strip-tab.active{background:var(--dark-bg);color:var(--gold)}
.strip-tab.active .sport-icon{color:var(--gold)}
.strip-tab.casino{margin-right:calc(4 * var(--u));border-radius:calc(6 * var(--u)) calc(6 * var(--u)) 0 0}
.strip-tab.casino .ext{width:calc(12 * var(--u));height:calc(12 * var(--u))}
.live-badge,.new-badge{top:calc(-8 * var(--u));height:calc(13 * var(--u));border-radius:0 calc(3 * var(--u)) calc(3 * var(--u)) 0;background:var(--live-bg);font-size:calc(10 * var(--u));line-height:calc(13 * var(--u))}
.live-badge{padding:0 calc(3 * var(--u)) 0 0}
.live-badge i{height:100%;margin-right:calc(3 * var(--u));padding:0 calc(2 * var(--u));font-size:calc(7 * var(--u));line-height:calc(13 * var(--u))}
.strip-search{flex:0 0 calc(48 * var(--u));background:linear-gradient(180deg,#4d4d4d,#303030);box-shadow:inset -9px 0 10px rgba(0,0,0,.2)}
.strip-search svg{width:calc(26 * var(--u));height:calc(26 * var(--u))}
.inplay-tabs .strip-search svg{width:calc(36 * var(--u));height:calc(36 * var(--u))} /* reference In-Play: the glass itself is 26u */
.strip-search-form input{height:calc(33 * var(--u));font-size:calc(13 * var(--u));border-radius:calc(4 * var(--u))}
.strip-search-form button{width:calc(33 * var(--u));height:calc(33 * var(--u));font-size:calc(24 * var(--u))}

/* Section title (30u, 14u bold, navy gradient) + by Time / by Competition (300u, 12u bold) */
.section-bar,.match-list .list-title{display:flex;align-items:center;justify-content:center;height:calc(30 * var(--u));margin:0;padding:0 10px;background:var(--slate-bg);color:#fff;font-size:calc(14 * var(--u));font-weight:bold}
.view-toggle{display:flex;width:calc(300 * var(--u));max-width:calc(100% - 20px);margin:calc(5 * var(--u)) auto;padding:calc(1 * var(--u));gap:0;background:#e3e3e3;border:0;border-radius:calc(5 * var(--u))}
.view-toggle a{flex:1;margin:calc(1 * var(--u));padding:calc(8 * var(--u)) 0;border-radius:calc(4 * var(--u));background:none;box-shadow:none;font-size:calc(12 * var(--u));font-weight:bold;color:var(--text)}
.view-toggle a.active{background:#fff;color:var(--link);box-shadow:none}
.competition-title{padding:calc(6 * var(--u)) calc(10 * var(--u));background:var(--head);color:var(--text);font-size:calc(12 * var(--u));font-weight:bold}

/* In-Play tabs (49u bar #172832, 33u tabs 13u bold, white outline; 49u search #2b4557) */
.inplay-tabs{height:calc(49 * var(--u));background:#172832}
.inplay-tabs nav{margin:calc(6 * var(--u)) calc(8 * var(--u));border:1px solid #fff;border-radius:calc(4 * var(--u))}
.inplay-tabs nav a{font-size:calc(13 * var(--u));font-weight:bold;color:#fff;border-left:1px solid #fff}
.inplay-tabs nav a.active{background:#fff;color:var(--text)}
.inplay-tabs nav a:not(.active):hover{background:rgba(255,255,255,.1)}
.inplay-tabs .strip-search{flex-basis:calc(49 * var(--u));background:#2b4557;border-left:1px solid #909090;box-shadow:inset 0 -15px 15px rgba(0,0,0,.4)}
.inplay-page .match-list{margin-bottom:calc(20 * var(--u));border-bottom:calc(3 * var(--u)) solid #070707}
.inplay-page .match-list>.match-row:last-child{margin-bottom:0;border-bottom:0} /* reference: the last match sits right on the black line */

/* ---------- Match rows ---------- */
.match-list{box-shadow:none}
.match-row{min-height:calc(52 * var(--u));border-bottom:1px solid var(--line);background:#fff}
.match-row:hover{background:#eff2f2}
.match-info{padding:calc(6 * var(--u))}
.match-meta{min-height:calc(16 * var(--u));gap:calc(3 * var(--u));padding-left:calc(18 * var(--u));font-size:calc(12 * var(--u));font-weight:500;color:var(--text-3)}
.match-status,.match-status.live{color:var(--text-3);font-weight:500}
.match-name{gap:calc(6 * var(--u));margin-top:calc(1 * var(--u))}
.match-name strong{font-size:calc(15 * var(--u));font-weight:bold;line-height:1.3;color:var(--link)}
.match-info:hover .match-name strong{text-decoration:underline}
.dot{width:calc(12 * var(--u));height:calc(12 * var(--u));background:#ccc;border:1px solid #aaa}
.dot.live{background:#6bbd11;border-color:#508d0e}
.ico{width:calc(16 * var(--u));height:calc(16 * var(--u));border-radius:calc(3 * var(--u));font-size:calc(11 * var(--u))}
.ico svg{width:calc(13 * var(--u));height:calc(13 * var(--u))}
.ico-p{background:#ea6414}
.virtual-tag{height:calc(14 * var(--u));border-color:#1f5172;border-radius:calc(2 * var(--u));color:#1f5172;font-size:calc(9 * var(--u));font-weight:bold;line-height:calc(12 * var(--u))}
.virtual-tag b{background:#1f5172;font-size:calc(10 * var(--u));padding:0 calc(4 * var(--u));margin-right:calc(2 * var(--u))}
.row-pin{width:calc(25 * var(--u));height:calc(25 * var(--u));border:2px solid var(--line-2);background:#fff}
.row-pin svg{width:calc(15 * var(--u));height:calc(15 * var(--u));fill:var(--line-2)}
.row-pin:hover{border-color:var(--link)}
.row-pin.pinned{background:var(--link);border-color:var(--link)}
.empty-list{font-size:13px;color:var(--text-2)}
@media(max-width:700px){.match-row{grid-template-columns:1fr calc(48 * var(--u))}}

/* Desktop list table (rows 40px, 12px bold names, odds cells 53x35, 11px bold odds) */
@media(min-width:701px){
    .sport-strip{height:47px;border-bottom-width:3px}
    .section-bar,.match-list .list-title{justify-content:flex-start;height:25px;padding:0 10px;background:var(--slate);border-bottom:1px solid var(--line-2);font-size:12px;font-weight:normal}
    .inplay-tabs{height:47px;background:var(--page)}
    .inplay-tabs nav{flex:0 0 auto;display:flex;margin:10px 0 10px 8px;border:1px solid var(--tab);border-radius:0}
    .inplay-tabs nav a{width:129px;height:27px;border-left:1px solid var(--tab);background:#fff;color:var(--tab);font-size:13px}
    .inplay-tabs nav a:hover{text-decoration:underline;background:#fff}
    .inplay-tabs nav a.active{background:var(--tab);color:#fff}
    .inplay-tabs .strip-search{display:none}
    .inplay-page .match-list{margin:0 8px 15px;border-bottom:1px solid var(--line-2)}
    .match-list-head{height:25px;padding-left:10px;background:var(--head-2);color:var(--text);font-size:12px}
    .match-list-head span{font-weight:normal}
    .match-list-head,.match-row{grid-template-columns:1fr repeat(3,114px) 36px}
    .match-row{min-height:40px;padding-left:10px}
    .match-info{display:flex;flex-direction:column-reverse;justify-content:center;padding:2px 0}
    .match-name{margin:0;gap:5px}
    .match-name strong{font-size:12px;line-height:1.2}
    .match-meta{min-height:16px;padding-left:13px;font-size:12px;font-weight:normal}
    .match-status.live{color:var(--pos);font-weight:bold}
    .dot{width:8px;height:8px;border:0}
    .ico{width:16px;height:16px;font-size:11px}
    .virtual-tag{height:14px;font-size:9px}
    .mini-odds{height:35px;gap:1px;padding:0 2px}
    .mini-odds i{border-radius:0;font-size:11px;font-weight:bold;color:var(--text)}
    .mini-odds.none i{background:#eef1f3;color:#bbb}
    .row-pin{width:20px;height:20px;border-width:1px}
    .row-pin svg{width:12px;height:12px}
}

/* ---------- Event page ---------- */
.score-panel header{height:calc(36 * var(--u));padding:0 10px;background:var(--slate-bg);font-size:calc(13 * var(--u))}
.score-panel header .event-status{font-size:calc(12 * var(--u))}
.pin-btn{font-size:calc(15 * var(--u));padding-right:10px}
.score-panel .teams{padding:10px 14px 2px;font-size:calc(15 * var(--u));font-weight:bold}
.score-panel .teams small{font-size:calc(11 * var(--u));font-weight:normal}
.event-score{font-size:calc(15 * var(--u))}
.event-date{font-size:calc(11 * var(--u))}
.market-tabs{gap:2px;padding:calc(6 * var(--u)) calc(6 * var(--u)) 0;background:#172832;border-bottom:1px solid #21323d}
.market-tabs button{height:calc(30 * var(--u));padding:0 calc(12 * var(--u));border:1px solid #203846;border-bottom:0;border-radius:6px 6px 0 0;background:var(--tab);color:#fff;font-size:calc(13 * var(--u));font-weight:bold;box-shadow:inset 0 2px 0 rgba(255,255,255,.4)}
.market-tabs button:hover{background:#4a6475}
.market-tabs button.active{background:linear-gradient(180deg,#fff,#dddcd6 71%);color:var(--text);border-color:#21323d}
.market>.market-title{height:calc(30 * var(--u));padding:0 10px;gap:8px;background:var(--slate-bg);font-size:calc(13 * var(--u))}
.market>.market-title small{font-size:calc(11 * var(--u))}
.market>.market-head{min-height:25px;background:#e4f1f9;border-bottom-color:var(--line-2)}
.market>.market-head .matched{padding:4px 10px;font-size:calc(11 * var(--u));color:var(--text-2)}
.market>.market-head .matched b{font-size:calc(12 * var(--u))}
.market>.market-head>b{font-size:calc(12 * var(--u))}
.market-row{min-height:calc(44 * var(--u));border-top-color:var(--line-2)}
.market-row:hover{background:#eff2f2}
.market-row>strong,.fancy-row>strong{padding:calc(3 * var(--u)) calc(8 * var(--u));font-size:calc(15 * var(--u));font-weight:bold}
.odd{border-left-color:#fff}
.odd b{font-size:calc(15 * var(--u));font-weight:bold}
.odd small{font-size:calc(11 * var(--u));color:rgba(30,30,30,.75)}
.back{background:var(--back)}.lay{background:var(--lay)}
.odd.depth.back{background:var(--back-light)}.odd.depth.lay{background:var(--lay-light)}
.odd.back:not(:disabled):hover{background:#5aaee9}.odd.lay:not(:disabled):hover{background:#f896ab}
.odd.selected{outline:2px solid var(--text);outline-offset:-2px}
.suspended::after{font-size:calc(13 * var(--u));background:rgba(0,0,0,.4)}
.premium-market h4{padding:7px 10px;font-size:calc(13 * var(--u))}
.premium-option{min-height:40px}
.premium-option>span{font-size:calc(13 * var(--u))}
.premium-option .odd{height:40px}
@media(min-width:701px){
    .market-row{min-height:40px}
    .market-row>strong,.fancy-row>strong{padding:3px 10px;font-size:12px}
    .odd b{font-size:12px}
    .odd small{font-size:10px}
}

/* ---------- Bet slip (reference: navy title bar, 12px text) ---------- */
.bet-slip{border-radius:6px;box-shadow:0 10px 40px rgba(0,0,0,.5)}
.bet-slip::backdrop{background:rgba(0,0,0,.7)}
.slip-head{height:32px;background:linear-gradient(180deg,#2d4a5c,#203846);color:#fff}
.slip-head h3{font-size:13px}
.slip-head .slip-close{color:#fff;font-size:22px}
.slip-body{gap:8px;padding:10px;background:var(--back-light)}
.bet-slip.lay .slip-body{background:var(--lay-light)}
.slip-market{font-size:11px;color:var(--text-2)}
.slip-title{font-size:14px;font-weight:bold}
.slip-side{font-size:11px;padding:1px 6px}
.slip-inputs label{font-size:12px;color:var(--text-2)}
.slip-inputs input{height:33px;padding:0 8px;border:1px solid #aaa;border-radius:4px;font-size:14px}
.quick-stakes{gap:5px}
.quick-stakes button{height:27px;padding:0;border:1px solid #bbb;border-radius:4px;background:linear-gradient(180deg,#fff,#eee);font-size:12px;color:var(--text)}
.quick-stakes button:hover{background:#fff;border-color:var(--line-2)}
.slip-summary{font-size:12px;color:var(--text-2)}
.slip-actions{gap:6px}
.slip-actions button{height:33px;padding:0;border-radius:4px;font-size:13px}
.slip-actions button:first-child{border:1px solid #bbb;background:linear-gradient(180deg,#fff,#eee);color:var(--text)}
.slip-message{font-size:12px}
.toast{font-size:13px;padding:8px 16px;background:rgba(30,30,30,.92)}

/* ---------- Multi markets ---------- */
.multi-market>header{min-height:calc(30 * var(--u));background:var(--slate-bg);font-size:calc(13 * var(--u))}
.multi-market .unpin{height:calc(30 * var(--u))}
.multi-head{min-height:25px;font-size:12px;background:var(--head-2)}
.multi-row{min-height:calc(44 * var(--u))}
.multi-row strong{font-size:calc(15 * var(--u))}
.multi-row .odd{height:calc(44 * var(--u))}
.multi-row .odd b{font-size:calc(15 * var(--u))}.multi-row .odd small{font-size:calc(11 * var(--u))}

/* ---------- Account ---------- */
.account-sidebar h3{height:30px;display:flex;align-items:center;justify-content:center;padding:0 10px;background:#000;font-size:13px}
.account-sidebar a{padding:7px 10px;font-size:12px;color:#222;border-bottom-color:#eee1c0}
.account-sidebar a:hover{background:rgba(242,220,167,.4)}
.account-sidebar a.active{background:#f2dca7;font-weight:bold}
.account-content>h2{font-size:15px;font-weight:bold;padding:6px 10px}
.detail-block{border-bottom:0;box-shadow:var(--lift)}
.detail-block h3,.bet-list h3{padding:6px 10px;font-size:13px;background:var(--slate-bg)}
.detail-block>div{padding:7px 10px;font-size:12px;border-bottom-color:var(--line)}
.filters{gap:6px;padding:10px;font-size:12px;background:var(--line)}
.filters input,.filters select{height:25px;padding:0 6px;border:1px solid #bbb;border-radius:4px;font-size:12px;background:#fff}
.filters button{height:25px;padding:0 14px;border-radius:4px;font-size:12px}
table{font-size:12px}
th{padding:6px 10px;background:var(--head);color:var(--text);font-weight:bold;border-bottom:1px solid var(--line-2)}
td{padding:7px 10px;border-bottom-color:var(--line)}
tbody tr:hover td{background:#eff2f2}
.bets-table td,.bets-table td b{font-size:12px}
.side-tag{font-size:11px;padding:1px 6px}
.success{color:var(--pos)}
.switch-tabs a{padding:7px 10px;font-size:12px;font-weight:bold;border-color:var(--tab);color:var(--tab)}
.switch-tabs a.active,.product-tabs b{background:var(--tab);color:#fff}
.product-tabs>*{padding:5px 10px;font-size:12px}
.bet-list{border-bottom:0;box-shadow:var(--lift)}
.bet-list p{font-size:12px;padding:10px}
.help-text{font-size:12px}
.pagination a{padding:5px 10px;font-size:12px;border-radius:4px}
.btn-check{padding:5px 12px;font-size:12px}
.api-status h2{font-size:15px}
.mobile-account header{height:calc(40 * var(--u));padding:0 calc(10 * var(--u));background:var(--dark-bg);color:var(--gold);font-size:calc(15 * var(--u));font-weight:bold}
.account-user svg{width:calc(24 * var(--u));height:calc(24 * var(--u));fill:var(--gold)}
.mobile-account>a{padding:calc(11 * var(--u)) calc(10 * var(--u));font-size:calc(15 * var(--u));color:var(--link);border-bottom-color:var(--line)}
.mobile-account>a:hover{background:#eff2f2}
.mobile-account>a b{font-size:calc(20 * var(--u));line-height:calc(20 * var(--u));padding:0 calc(5 * var(--u));color:var(--line-2);border:0}
.mobile-account form{margin:calc(20 * var(--u)) calc(10 * var(--u))}
.mobile-account form button{height:calc(41 * var(--u));border:1px solid #710b0b;border-radius:calc(6 * var(--u));background:var(--red-bg);font-size:calc(15 * var(--u));font-weight:bold;box-shadow:var(--shine)}

/* ---------- Settings panel ---------- */
.settings-head{height:calc(40 * var(--u));background:var(--dark-bg);color:var(--gold)}
.settings-head h2{font-size:calc(15 * var(--u))}
.settings-head h2 svg{width:calc(20 * var(--u));height:calc(20 * var(--u))}
.settings-close{width:calc(40 * var(--u));font-size:calc(22 * var(--u));border-left-color:rgba(255,178,0,.3)}
.settings-body h3{padding:calc(7 * var(--u)) 10px;font-size:calc(12 * var(--u));background:var(--slate-bg)}
.set-row{min-height:calc(44 * var(--u));font-size:calc(13 * var(--u));color:var(--text)}
.set-row input[type=number]{width:calc(120 * var(--u));height:calc(30 * var(--u));border-radius:4px;font-size:calc(13 * var(--u))}
.set-block>p{margin:2px 0 8px;font-size:calc(11 * var(--u));font-weight:bold;color:var(--slate)}
.stake-grid{gap:calc(5 * var(--u))}
.stake-grid button,.stake-grid input{height:calc(30 * var(--u));border-radius:4px;font-size:calc(12 * var(--u))}
.stake-grid button.on{background:var(--dark-bg);color:var(--gold);border-color:#222}
.edit-stakes{height:calc(33 * var(--u));margin-top:10px;border-radius:4px;font-size:calc(13 * var(--u))}
.edit-stakes svg{width:16px;height:16px}
/* Toggle = reference CheckBox.vue .switch_wrap: 35u square, green on / grey off, white bar knob with a grey notch */
.set-row:has(.switch){min-height:calc(55 * var(--u));padding:0 calc(7 * var(--u));font-size:calc(15 * var(--u));color:#243a48}
.switch{position:relative;flex:0 0 auto;width:calc(35 * var(--u));height:calc(35 * var(--u));margin:0;padding:0;border:0;border-radius:calc(5 * var(--u));background:#a2b1ba;box-shadow:inset 0 1px 4px rgba(0,0,0,.5);transition:background .2s}
.switch:checked{background:#6fb033;border:0}
.switch::after{content:'';position:absolute;top:50%;left:calc(4 * var(--u));width:calc(10 * var(--u));height:calc(28 * var(--u));border-radius:calc(4 * var(--u));background:#fff;box-shadow:inset 0 -3px 0 rgba(0,0,0,.2);transform:translateY(-50%);transition:left .2s}
.switch::before{content:'';position:absolute;z-index:1;top:50%;left:calc(9 * var(--u));width:calc(4 * var(--u));height:calc(5 * var(--u));border-radius:calc(4 * var(--u));background:#d9d9d9;box-shadow:inset 0 1px 1px rgba(0,0,0,.3);transform:translate(-50%,-50%);transition:left .2s}
.switch:checked::after{left:calc(21 * var(--u))}
.switch:checked::before{left:calc(26 * var(--u))}
.settings-foot{gap:8px;padding:8px 10px}
.settings-foot button{height:calc(36 * var(--u));border-radius:4px;font-size:calc(14 * var(--u))}
.settings-message{font-size:12px}

/* ---------- Policy pop-ups ---------- */
.policy-modal,.policy-page{font-family:var(--font-mobile);border-radius:8px}
.policy-modal header,.policy-page header{padding:12px 14px;background:var(--dark-bg)}
.policy-modal h2,.policy-page h1{font-size:calc(15 * var(--u));color:var(--gold)}
.policy-body{font-size:calc(13 * var(--u));line-height:1.45;color:#444}
.policy-body h4{font-size:calc(13 * var(--u))}
.policy-close{width:min(200px,70%);height:calc(36 * var(--u));border-radius:4px;font-size:calc(13 * var(--u))}

/* ---------- Casino ---------- */
.casino-tabs{background:var(--gold-bg);border-bottom:calc(3 * var(--u)) solid #070707}
.casino-tabs a{height:calc(40 * var(--u));font-size:calc(13 * var(--u))}
.casino-tabs a svg{width:calc(18 * var(--u));height:calc(18 * var(--u))}
.casino-tabs a b{font-size:calc(10 * var(--u))}
.casino-tabs a.active{background:var(--dark-bg);color:var(--gold);border-radius:calc(6 * var(--u)) calc(6 * var(--u)) 0 0}
.casino-search{gap:5px;padding:8px}
.casino-search input{height:calc(33 * var(--u));font-size:calc(13 * var(--u));border-radius:4px}
.casino-search button{height:calc(33 * var(--u));padding:0 16px;font-size:calc(13 * var(--u));border-radius:4px}
.casino-providers a{height:calc(28 * var(--u));padding:0 10px;font-size:calc(12 * var(--u))}
.casino-providers a.active{background:var(--slate-bg);color:var(--gold)}
.casino-card{border-radius:0;border-bottom:4px solid var(--gold-2)}
.casino-info strong{font-size:calc(12 * var(--u))}
.casino-info small{font-size:calc(10 * var(--u))}
.casino-pager a{padding:6px 12px;font-size:12px;border-radius:4px}
.casino-back{padding:8px 18px;font-size:13px;border-radius:4px}


/* ---------- Promo banner (home-reference.jpg, 1436x268): whole image, same ratio everywhere ----------
   Reference: 1010px wide on desktop above the tiles, full width (73px tall at 393px) on phones. */
.promo-banner,.home-page .promo-banner,.sports-banner{display:block;width:100%;max-width:1010px;height:auto;min-height:0;max-height:none;margin:0 auto;overflow:hidden;background:#000;aspect-ratio:1436/268}
.promo-banner>img,.sports-banner>img{display:block;width:100%;height:100%;max-height:none;object-fit:cover;object-position:50% 50%;opacity:1;transform:none}
@media(max-width:700px){.promo-banner,.home-page .promo-banner,.sports-banner{max-width:none;height:auto}}
/* LIVE list on the Sports tile: as in the reference, it may run behind the caption bar so all 5 sports fit on phones. */
.home-tile footer{z-index:1}
@media(max-width:700px){.home-page .home-tile-art .live-panel{max-height:none;overflow:visible}.home-page .live-panel div{padding-top:calc(5 * var(--u));line-height:calc(13 * var(--u))}.home-page .live-panel em{height:calc(13 * var(--u));line-height:calc(13 * var(--u))}}

/* ---------- Login logo: reference h1.login-logo = 80% wide x 80u tall, centred, centre at 62% of the 280u header ---------- */
.login-page .login-art{position:relative}
.login-page .login-art .logo{position:absolute;left:50%;top:62.1%;width:80%;max-width:none;height:calc(80 * var(--u));transform:translate(-50%,-50%);filter:none}
.login-page .login-art .logo img{width:100%;height:100%;object-fit:contain;object-position:50% 50%}

/* ---------- Banner slides (Admin → Banners); one or more, rotating ---------- */
.promo-banner{position:relative}
.promo-slide{display:none;width:100%;height:100%}
.promo-slide.on{display:block}
.promo-slide picture{display:contents}
.promo-slide img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 50%}
.promo-banner.is-slider .promo-slide{animation:banner-in .45s ease}
@keyframes banner-in{from{opacity:.35}to{opacity:1}}
@media(prefers-reduced-motion:reduce){.promo-banner.is-slider .promo-slide{animation:none}}
/* Player news ticker (Admin → News) */
.news-bar{display:flex;align-items:center;height:calc(26 * var(--u));background:#1e1e1e;color:#fff;font-size:calc(12 * var(--u));overflow:hidden}
.news-bar>b{flex:0 0 auto;display:flex;align-items:center;height:100%;padding:0 calc(8 * var(--u));background:var(--gold-bg);color:var(--text)}
.news-track{flex:1;min-width:0;overflow:hidden;white-space:nowrap}
.news-track p{display:inline-block;margin:0;padding-left:100%;animation:news-scroll 28s linear infinite}
.news-track p span{margin-right:calc(40 * var(--u))}
.news-track p em{font-style:normal;color:var(--gold)}
@keyframes news-scroll{to{transform:translateX(-100%)}}
@media(prefers-reduced-motion:reduce){.news-track p{animation:none;padding-left:8px}}

/* ---------- Page loading: exact copy of the reference PageLoading + .loading-circle-anime ---------- */
.page-loading{position:fixed;inset:0;z-index:130;display:flex;align-items:center;justify-content:center;pointer-events:all;background:transparent}
.page-loading[hidden]{display:none}
.page-loading-wrap{display:flex;flex-direction:column;align-items:center;justify-content:center;width:calc(150 * var(--u));padding:calc(18 * var(--u)) 0;border-radius:calc(5 * var(--u));background:#fff;box-shadow:0 3px 10px rgba(0,0,0,.5)}
.page-loading-wrap>span{font-family:var(--font-mobile);font-size:calc(12 * var(--u));font-weight:400;line-height:1.2;color:#243a48}
.loading-circle-anime{position:relative;overflow:hidden;width:calc(70 * var(--u));height:calc(35 * var(--u));margin-bottom:calc(19 * var(--u))}
.loading-circle-anime::before,.loading-circle-anime::after{content:'';position:absolute;top:0;width:50%;height:100%;border-radius:9999px}
.loading-circle-anime::before{right:0;background:rgb(61,81,97);animation:rightToLeft .6s ease infinite}
.loading-circle-anime::after{left:0;background:rgb(255,184,12);animation:leftToRight .6s ease infinite}
@keyframes rightToLeft{0%{transform:translate(0)}to{transform:translate(-100%)}}
@keyframes leftToRight{0%{transform:translate(0)}to{transform:translate(100%)}}

/* ---------- News marquee: exact copy of the reference Marquee (mobile + desktop) ---------- */
.marquee{display:flex;background-image:linear-gradient(180deg,#2b3d47,#1c292e);border-bottom:1px solid #fff;overflow:hidden}
.marquee-left{position:relative;z-index:1;flex:0 0 auto;display:flex;align-items:center;justify-content:center;width:calc(75 * var(--u));padding:calc(4 * var(--u)) calc(6 * var(--u));color:#fff}
.marquee-left .icon-marquee{flex:0 0 auto;width:calc(17 * var(--u));height:calc(17 * var(--u));margin-right:calc(3 * var(--u));fill:#fff}
.marquee-left-content{font-size:calc(13 * var(--u));font-weight:700;line-height:1.2;color:#fff}
.arrow-right::before,.arrow-right::after{content:'';position:absolute;top:0;bottom:0;height:100%;width:calc(9 * var(--u));clip-path:polygon(0 0,1px 0,100% 50%,1px 100%,0 100%)}
.arrow-right::before{left:100%;background:#d5d5d5}
.arrow-right::after{left:calc(100% - 1px);background-image:linear-gradient(180deg,#2b3d47,#1c292e)}
.marquee-right{flex:1 1 0%;display:flex;min-width:0;overflow:hidden}
.marquee-items{display:flex;flex-wrap:nowrap;margin:0;padding:0;list-style:none;transform:translate(80vw);animation:marquee-scroll var(--marquee-duration,16s) linear infinite}
.marquee-item{display:flex;align-items:center;justify-content:center;margin-right:calc(80 * var(--u));padding:calc(5 * var(--u)) 0}
.marquee-item-date{min-width:0;width:max-content;margin-right:calc(2 * var(--u));padding:calc(2 * var(--u)) calc(4 * var(--u));border-radius:calc(3 * var(--u));background:#6ac2ff;color:#27363e;font-size:calc(11 * var(--u));font-style:italic;font-weight:400;letter-spacing:-.55px;line-height:1.2;white-space:nowrap}
.marquee-item-content{min-width:0;width:max-content;color:#6ac2ff;font-size:calc(13 * var(--u));font-weight:700;line-height:1.3;white-space:nowrap}
@keyframes marquee-scroll{0%{transform:translate(80vw)}to{transform:translate(-100%)}}

/* ---------- Banner slider (reference Swiper: horizontal slide, 3 s autoplay, loop, arrows; dots on desktop) ---------- */
.promo-banner{position:relative;overflow:hidden;touch-action:pan-y}
.promo-track{display:flex;width:100%;height:100%;will-change:transform}
.promo-banner .promo-slide,.promo-banner .promo-slide.on{display:block;flex:0 0 100%;width:100%;height:100%;animation:none}
.promo-slide img{pointer-events:none;user-select:none}
.promo-prev,.promo-next{position:absolute;top:0;z-index:10;display:flex;align-items:center;justify-content:center;width:calc(24 * var(--u));height:100%;padding:0;border:0;background:none;color:rgba(255,255,255,.8);cursor:pointer}
.promo-prev{left:0}.promo-next{right:0}
.promo-prev svg,.promo-next svg{width:calc(14 * var(--u));height:calc(14 * var(--u));fill:currentColor;filter:drop-shadow(0 1px 1px rgba(0,0,0,.5))}
.promo-dots{display:none}
@media(min-width:701px){
    .promo-prev{left:12px}.promo-next{right:12px}
    .promo-prev,.promo-next{width:24px;color:rgba(255,255,255,.6)}
    .promo-prev:hover,.promo-next:hover{color:rgba(255,255,255,.8)}
    .promo-prev svg,.promo-next svg{width:28px;height:28px}
    .promo-dots{position:absolute;left:0;right:0;bottom:8px;z-index:10;display:flex;align-items:center;justify-content:center;gap:8px}
    .promo-dots button{width:8px;height:8px;padding:0;border:0;border-radius:50%;background:#000;opacity:.2;cursor:pointer}
    .promo-dots button.on{width:11px;height:11px;background:#007aff;opacity:1}
}

/* ---------- Games chip: the reference's own animated artwork (images/skyfair/icon-promote.svg, 4.43 s loop) ---------- */
.mobile-nav .chip-face img.chip-art{position:absolute;inset:0;display:block;width:100%;height:100%;margin:0;animation:none;transform:none;pointer-events:none;user-select:none}
.mobile-nav .chip-face{background:none;box-shadow:none;overflow:visible}

/* ---------- Mobile account menu: exact copy of the reference Account page ---------- */
.mobile-account .account-info{display:flex;background:#000}
.account-info-name-wrap{flex:1 1 0%;display:flex;align-items:center;min-width:0;padding:calc(8 * var(--u)) calc(10 * var(--u));color:#fff}
.account-info-name-wrap .icon-account{flex:0 0 auto;width:calc(24 * var(--u));height:calc(24 * var(--u));margin-right:calc(5 * var(--u));fill:#fff}
.account-info-name,.account-info-timeZone{color:#fff;font-size:calc(14 * var(--u));font-weight:700;line-height:1.2}
.account-info-name{margin-right:calc(5 * var(--u));overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.account-info-timeZone{display:flex;align-items:center;padding:calc(10 * var(--u));border-left:1px solid rgba(255,255,255,.3)}
.account-list{display:flex;flex-direction:column}
.mobile-account .account-item{display:flex;align-items:center;padding:calc(8 * var(--u)) calc(7 * var(--u));border-bottom:1px solid #e0e6e6;background:#fff;font-size:inherit}
.mobile-account .account-item:hover{background:#eff2f2}
.account-item-label{flex:1 1 0%;display:flex;align-items:center;color:#2789ce;font-size:calc(14 * var(--u));font-weight:700;line-height:1.2}
.account-item-arrow{display:flex;align-items:center;justify-content:center;width:calc(24 * var(--u));height:calc(24 * var(--u));border:1px solid #dcdcdc;border-radius:calc(3 * var(--u));background:#fff}
/* Arrow = the reference's icon-arrow glyph at its inherited 16u (1rem) size, #1e1e1e. */
.account-item-arrow svg{width:calc(16 * var(--u));height:calc(16 * var(--u));fill:#1e1e1e}
.mobile-account .account-logout{margin:calc(20 * var(--u)) 0 0}
.mobile-account .account-logout button{display:flex;align-items:center;justify-content:center;gap:calc(5 * var(--u));width:100%;height:calc(45 * var(--u));border:0;border-radius:0;background:linear-gradient(0deg,#c12515,#e83522);color:#fff;font-size:calc(17 * var(--u));font-weight:700;line-height:1.2;letter-spacing:0;box-shadow:none;cursor:pointer}
/* Logout icon = the reference's icon-login glyph at the button text size (1em = 17u), 5u after the text. */
.mobile-account .account-logout .icon-login{width:calc(17 * var(--u));height:calc(17 * var(--u));fill:#fff}
/* Reference .button-logout: 17u bold, 12u top/bottom padding, 1px rgba(0,0,0,.3) lines above and below. */
.mobile-account .account-logout button{height:auto;padding:calc(12 * var(--u)) 0;border-top:1px solid rgba(0,0,0,.3);border-bottom:1px solid rgba(0,0,0,.3)}

/* ---------- Front page icons in the configured order; a full-row tile that does not fit on a half-filled row goes to the
   next row and the following small tile fills the gap (dense), so the grid never has holes ---------- */
.home-tiles.home-ordered{grid-auto-flow:row dense}
.home-tile-name{position:absolute;inset:0 0 calc(28 * var(--u));display:flex;align-items:center;justify-content:center;padding:0 10px;color:var(--gold-2);font-size:calc(18 * var(--u));font-weight:bold;text-align:center}

/* ---------- Vendor transfer pop-up (reference BetRadar "Express": balances, amount, slider 0..Max, Cancel / Enter) ---------- */
.vt-modal{width:calc(360 * var(--u));max-width:calc(100vw - 20px);padding:0;border:0;border-radius:calc(6 * var(--u));overflow:hidden;background:#fff;box-shadow:0 10px 40px rgba(0,0,0,.5);font-family:var(--font-mobile)}
.vt-modal::backdrop{background:rgba(0,0,0,.7)}
.vt-head{display:flex;align-items:center;height:calc(40 * var(--u));padding:0 calc(14 * var(--u));background:linear-gradient(180deg,#474747,#070707)}
.vt-head h2{margin:0;color:#ffb200;font-size:calc(16 * var(--u));font-weight:700}
.vt-head h2:focus{outline:0}
.balance-transfer-express{position:relative;display:flex;border-top:1px solid #e0e6e6}
.balance-transfer-express-left,.balance-transfer-express-right{flex:1;padding:calc(10 * var(--u)) calc(14 * var(--u)) calc(58 * var(--u))}
.balance-transfer-express-left{border-right:1px solid #c9deec;text-align:left}
.balance-transfer-express-right{text-align:right}
.balance-transfer-express-sub-title{margin-bottom:calc(3 * var(--u));color:#243a48;font-size:calc(12 * var(--u));font-weight:400;line-height:1.2}
.balance-transfer-express-balance{color:#243a48;font-size:calc(16 * var(--u));font-weight:700;line-height:1.2}
.balance-transfer-express-input-wrap{position:absolute;left:50%;bottom:calc(10 * var(--u));transform:translateX(-50%);color:#315195}
.balance-transfer-express-input-wrap::before,.balance-transfer-express-input-wrap::after{content:'';position:absolute;left:50%;transform:translateX(-50%);clip-path:polygon(0 0,100% 0,50% 100%)}
.balance-transfer-express-input-wrap::before{top:calc(100% - 2px);width:calc(18 * var(--u));height:calc(12 * var(--u));background:rgb(205,127,40)}
.balance-transfer-express-input-wrap::after{top:calc(100% - 3px);width:calc(14 * var(--u));height:calc(9 * var(--u));background:rgb(254,237,199)}
.balance-transfer-express-input{display:block;width:calc(177 * var(--u));height:calc(30 * var(--u));padding:0 calc(6 * var(--u));border:1px solid rgb(205,127,40);border-radius:calc(2 * var(--u));background:#fff;color:#315195;font-size:calc(14 * var(--u));font-weight:700;text-align:center;box-shadow:inset 0 0 0 1px rgb(254,237,199)}
.balance-transfer-express-input::placeholder{color:#315195;font-weight:700;opacity:1}
.balance-transfer-express-input:focus{outline:0;border-color:#bd7728}
.side-bar-wrap{display:flex;padding:calc(12.5 * var(--u)) 0;background:#c9deec}
.side-bar-min,.side-bar-max{flex:1;display:flex;align-items:center;justify-content:center;padding:0;border:1px solid #b3b2b3;background:linear-gradient(180deg,#fff,#ededed);color:#243a48;font-size:calc(15 * var(--u));font-weight:700;line-height:1.2;cursor:pointer}
.side-bar-max{border-right-width:0}
.side-bar-min{border-left-width:0}
.side-bar-express{position:relative;display:flex;align-items:center;justify-content:center;width:calc(220 * var(--u));padding:calc(10 * var(--u));border-top:1px solid #b3b2b3;border-bottom:1px solid #b3b2b3;background:linear-gradient(180deg,#fff,#ededed)}
.side-bar-express-scale{position:absolute;left:0;right:0;top:0;height:calc(6 * var(--u));background-image:linear-gradient(0deg,#ccd7e3,#ccd7e3),linear-gradient(0deg,#ccd7e3,#ccd7e3),linear-gradient(0deg,#ccd7e3,#ccd7e3),linear-gradient(0deg,#ccd7e3,#ccd7e3);background-position:20% 0,40% 0,60% 0,80% 0;background-repeat:no-repeat;background-size:calc(3 * var(--u)) calc(6 * var(--u))}
.side-bar-express-wrap{position:relative;width:100%;height:calc(12 * var(--u));margin:calc(10 * var(--u));border-radius:calc(6 * var(--u));background:#ccd8e0;box-shadow:inset 0 1px 1px rgba(0,0,0,.2);cursor:pointer;touch-action:none}
.side-bar-express-fill{width:0;height:100%;border:1px solid #bd7728;border-right-width:0;border-radius:calc(20 * var(--u)) 0 0 calc(20 * var(--u));background:linear-gradient(180deg,#f8b138,#f69b33);box-shadow:inset 0 2px rgba(255,255,255,.3)}
.side-bar-express-fill[data-empty]{border-width:0}
.side-bar-express-circle{position:absolute;top:50%;left:0;width:calc(32 * var(--u));height:calc(32 * var(--u));border:1px solid #bd7728;border-radius:50%;background:linear-gradient(0deg,#ffa00c,#ffb80c);box-shadow:inset 0 2px rgba(255,255,255,.3);transform:translate(-50%,-50%)}
.side-bar-express-wrap:focus-visible{outline:2px solid #315195;outline-offset:4px}
.vt-msg{min-height:calc(14 * var(--u));margin:calc(6 * var(--u)) calc(14 * var(--u)) 0;color:#d0021b;font-size:calc(12 * var(--u));text-align:center}
.vt-msg.ok{color:#508d0e}
.vt-foot{display:flex;gap:calc(12 * var(--u));padding:calc(8 * var(--u)) calc(14 * var(--u)) calc(6 * var(--u))}
.vt-foot button{flex:1;height:calc(45 * var(--u));border-radius:calc(6 * var(--u));font-size:calc(15 * var(--u));font-weight:700;cursor:pointer}
.vt-cancel{border:1px solid #bbb;background:linear-gradient(180deg,#fff,#eee);color:#1e1e1e}
.vt-enter{border:1px solid #222;background:linear-gradient(180deg,#474747,#070707);color:#ffb200}
.vt-enter:hover{background:linear-gradient(180deg,#070707,#474747)}
.vt-enter:disabled,.vt-cancel:disabled{opacity:.6;cursor:default}
.vt-back{display:block;margin:0 auto calc(12 * var(--u));padding:calc(4 * var(--u));border:0;background:none;color:#315195;font-size:calc(11 * var(--u));text-decoration:underline;cursor:pointer}
.vt-back[hidden]{display:none}
.vt-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:calc(6 * var(--u)) calc(10 * var(--u));background:#c9deec;border-bottom:1px solid #b3b2b3;color:#243a48;font-size:calc(12 * var(--u))}
.vt-bar b{margin-left:4px;font-size:calc(14 * var(--u))}
.vt-bar small{margin-left:6px;color:#d0021b}
.vt-bar-btn{padding:calc(5 * var(--u)) calc(12 * var(--u));border:1px solid #222;border-radius:calc(4 * var(--u));background:linear-gradient(180deg,#474747,#070707);color:#ffb200;font-weight:700}
.vt-msg:empty{display:none}
.vt-foot{padding-top:calc(14 * var(--u))}

/* ---------- Sticky top: header (logged out) or balance bar (logged in) + news marquee stay at the top while scrolling,
   like the reference's sticky header-wrap. Market tabs stick right below it (--site-top-h is set by app.js). ---------- */
.site-top{position:sticky;top:0;z-index:40}
.market-tabs{top:var(--site-top-h,0px)}

/* ---------- Logged-in phone header, measured from the reference (HeaderLoginWrapper + MultiWallet, mobile):
   55u bar on the header gradient (the reference spreads #474747 -> #070707 over header + news, so the bar itself only
   reaches #242424 at its bottom: measured); Bets 29.14% wide, flush left, rounded right; wallet box with Main / Exposure,
   +2 and refresh; settings 9.63% wide. Buttons: 10% white on the gradient, 1px black border, 2u inner shine,
   5u radius; icons (the reference's icon-font glyphs) #ffb200 at 19u; labels #ffb200, titles 70% of it. ---------- */
@media(max-width:700px){
    .balance-bar{display:flex;align-items:center;justify-content:space-between;height:calc(55 * var(--u));gap:0;padding:0 calc(6 * var(--u)) 0 0;border:0;background:linear-gradient(180deg,#474747,#242424);box-shadow:none}
    .balance-bar .bets-btn,.balance-bar .wallet-box,.balance-bar .settings-btn{height:calc(36 * var(--u));border:1px solid #000;background:rgba(255,255,255,.1);box-shadow:inset 0 2px 0 rgba(255,255,255,.25)}
    .balance-bar .bets-btn{flex:0 0 29.144385026%;display:flex;align-items:center;justify-content:center;gap:0;padding:calc(7 * var(--u)) calc(10 * var(--u));border-left:0;border-radius:0 calc(5 * var(--u)) calc(5 * var(--u)) 0;color:#ffb200;font-size:calc(13 * var(--u));font-weight:700;line-height:1.3}
    .balance-bar .bets-btn svg{flex:0 0 auto;width:calc(19 * var(--u));height:calc(19 * var(--u));margin-right:calc(2 * var(--u));fill:#ffb200}
    .balance-bar .wallet-box{flex:1 1 0%;min-width:0;display:flex;align-items:center;margin:0 calc(10 * var(--u));border-radius:calc(5 * var(--u));overflow:hidden}
    .balance-bar .wallet-lines{flex:1 1 0%;min-width:0;display:flex;flex-direction:column;justify-content:center;padding:0 calc(3 * var(--u)) 0 calc(5 * var(--u));font-size:calc(10 * var(--u));line-height:1.2}
    .balance-bar .wallet-lines em{font-style:normal;font-weight:400;color:rgba(255,178,0,.7);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
    .balance-bar .wallet-lines b{color:#ffb200;font-weight:700}
    .balance-bar .plus-pill{display:block;flex:0 0 auto;margin:0 calc(3 * var(--u)) 0 0;padding:calc(1 * var(--u)) calc(6 * var(--u));border:1px solid rgba(255,178,0,.5);border-radius:calc(3 * var(--u));background:none;color:#ffb200;font-style:normal;font-size:calc(10 * var(--u));font-weight:700;line-height:1.2}
    .balance-bar .wallet-refresh{flex:0 0 auto;display:flex;align-items:center;justify-content:center;width:auto;height:calc(34 * var(--u));margin:0;padding:calc(7 * var(--u));border:0;border-left:1px solid #000;border-radius:0;background:none}
    .balance-bar .wallet-refresh svg{width:calc(19 * var(--u));height:calc(19 * var(--u));fill:#ffb200}
    .balance-bar .settings-btn{flex:0 0 9.625668449%;display:flex;align-items:center;justify-content:center;width:auto;margin:0;padding:calc(7 * var(--u));border-radius:calc(5 * var(--u))}
    .balance-bar .settings-btn svg{width:calc(19 * var(--u));height:calc(19 * var(--u));fill:#ffb200}
    .balance-bar .bets-btn:hover,.balance-bar .settings-btn:hover{background:rgba(255,255,255,.1)}
    .balance-bar .wallet-refresh:hover{background:none}
}@media(max-width:700px){.balance-bar .plus-pill>span:first-child{margin-right:calc(2 * var(--u))}}

/* The +2 counter: two plain spans ("+" and "2", 2u apart), not the old app.css .balance-bar span boxes. */
.balance-bar .plus-pill>span{display:inline;max-width:none;margin:0;padding:0;border:0;border-radius:0;background:none;font-size:inherit;line-height:inherit}
@media(max-width:700px){.balance-bar .plus-pill>span:first-child{margin-right:calc(2 * var(--u))}}

/* ---------- Balance bar refresh: the balance lines turn into 8 pulsing dots (reference Loading.vue .loader) ---------- */
.balance-bar .wallet-box.loading .wallet-lines,.balance-bar .wallet-box.loading .plus-pill{display:none}
.balance-bar .wallet-box .wallet-lines{cursor:pointer}
.balance-bar .wallet-box .wallet-lines:focus-visible{outline:1px solid #ffb200;outline-offset:-2px}
.wallet-loader{flex:1 1 0%;min-width:0;display:flex;flex-wrap:nowrap;align-items:center;justify-content:center;height:100%}
.wallet-loader div{width:calc(6 * var(--u));height:calc(6 * var(--u));margin:calc(2 * var(--u));border-radius:9999px;background:#fff;animation:wallet-loader 1.2s linear infinite}
.wallet-loader div:nth-child(1){animation-delay:-.7s}.wallet-loader div:nth-child(2){animation-delay:-.6s}.wallet-loader div:nth-child(3){animation-delay:-.5s}.wallet-loader div:nth-child(4){animation-delay:-.4s}
.wallet-loader div:nth-child(5){animation-delay:-.3s}.wallet-loader div:nth-child(6){animation-delay:-.2s}.wallet-loader div:nth-child(7){animation-delay:-.1s}.wallet-loader div:nth-child(8){animation-delay:0s}
@keyframes wallet-loader{0%,to{transform:scale(1)}50%{background:transparent;transform:scale(.5)}}
.balance-bar .wallet-refresh:disabled{cursor:default}

/* ---------- Balance pop-up (reference Balance.vue): grey sheet under the balance bar + dark mask ---------- */
.balance-pop{position:fixed;left:0;right:0;bottom:0;top:0;z-index:45;display:flex;flex-direction:column;opacity:0;transition:opacity .2s ease;font-family:var(--font-mobile)}
.balance-pop[hidden]{display:none}
.balance-pop.show{opacity:1}
.bp-open,.bp-open body,.ob-open,.ob-open body{overflow:hidden}
.balance-pop .balance-container{flex:0 0 auto;max-height:100%;overflow-y:auto;padding:calc(10 * var(--u)) 0;background:#e0e6e6}
.balance-pop .bp-mask{flex:1 1 0%;background:rgba(0,0,0,.7)}
.balance-pop .main-balance-container,.balance-pop .balance-multi-wallet-container{width:calc(360 * var(--u));max-width:calc(100% - 14px);margin:0 auto calc(10 * var(--u));border-radius:calc(3 * var(--u));background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.25)}
.balance-pop .main-balance-container{padding:calc(10 * var(--u)) calc(7 * var(--u)) calc(5 * var(--u))}
.balance-pop .main-balance-title,.balance-pop .balance-multi-wallet-info-title{margin-bottom:calc(5 * var(--u));font-size:calc(12 * var(--u));font-weight:400;line-height:1.3;color:#3b5160}
.balance-pop .main-balance-title-description{display:flex;align-items:center;padding-bottom:calc(10 * var(--u));border-bottom:1px solid #e0e6e6}
.balance-pop .balance-multi-wallet-info-balance{display:flex;align-items:center}
.balance-pop .bp-cur{display:flex;align-items:center;justify-content:center;flex:0 0 auto;min-width:calc(25 * var(--u));height:calc(14 * var(--u));margin-right:calc(4 * var(--u));padding:0 calc(2 * var(--u));border-radius:calc(2 * var(--u));background:#5f849d;color:#fff;font-size:calc(10 * var(--u));font-weight:700}
.balance-pop .bp-amount{display:block;font-size:calc(17 * var(--u));font-weight:700;line-height:1.3;color:#1e1e1e}
.balance-pop .main-balance-title-exposure{display:flex;align-items:center;justify-content:space-between;padding:calc(5 * var(--u)) 0;font-size:calc(12 * var(--u));line-height:1.2;color:#3b5160}
.balance-pop .balance-multi-wallet-wrap{display:flex;align-items:center;border-bottom:1px solid #e0e6e6}
.balance-pop .balance-multi-wallet-info{flex:1 1 0%;min-width:0;padding:calc(10 * var(--u)) calc(7 * var(--u))}
.balance-pop .balance-multi-wallet-wrap .bp-recall{flex:0 0 auto;margin:0 calc(5 * var(--u))}
.balance-pop .balance-recall-all-container{display:flex;justify-content:flex-end;padding:calc(10 * var(--u)) calc(5 * var(--u)) calc(8 * var(--u))}
.balance-pop .bp-recall{height:calc(33 * var(--u));padding:0 calc(7 * var(--u));border:1px solid #7e97a7;border-radius:calc(4 * var(--u));background:#e8f4fb;box-shadow:inset 0 1px 0 rgba(255,255,255,.6);color:#1e1e1e;font-family:inherit;font-size:calc(14 * var(--u));line-height:1;cursor:pointer}
.balance-pop .bp-recall:active{background:#d2e7f5}
.balance-pop .bp-recall:disabled{cursor:default;opacity:.7}
.balance-pop .bp-msg{width:calc(360 * var(--u));max-width:calc(100% - 14px);margin:0 auto calc(10 * var(--u));font-size:calc(12 * var(--u));color:#d0021b;text-align:center}
.balance-pop .balance-buttons-wrap{width:calc(175 * var(--u));margin:auto}
.balance-pop .bp-close{display:block;width:100%;height:calc(41 * var(--u));border:1px solid #bbb;border-radius:calc(4 * var(--u));background:linear-gradient(180deg,#fff,#eee);box-shadow:inset 0 2px 0 rgba(255,255,255,.5);color:#1e1e1e;font-family:inherit;font-size:calc(13 * var(--u));font-weight:700;line-height:1;cursor:pointer}
.balance-pop .bp-close:active{background:linear-gradient(180deg,#eee,#ddd)}

/* ---------- Open Bets panel (Bets button): full-screen white sheet, dark header with gold title and close ---------- */
.open-bets-pop{position:fixed;inset:0;z-index:110;display:flex;flex-direction:column;background:#fff;font-family:var(--font-mobile)}
.open-bets-pop[hidden]{display:none}
.open-bets-pop .ob-head{flex:0 0 calc(38 * var(--u));display:flex;align-items:stretch;background:linear-gradient(180deg,#3b3b3b,#0b0b0b)}
.open-bets-pop .ob-head h2{flex:1 1 0%;display:flex;align-items:center;gap:calc(4 * var(--u));margin:0;padding-left:calc(10 * var(--u));color:#ffb200;font-size:calc(15 * var(--u));font-weight:700;line-height:1}
.open-bets-pop .ob-head h2 svg{width:calc(20 * var(--u));height:calc(20 * var(--u));fill:#ffb200}
.open-bets-pop .ob-close{flex:0 0 calc(36 * var(--u));display:flex;align-items:center;justify-content:center;padding:0;border:0;border-left:1px solid rgba(255,178,0,.4);background:none;cursor:pointer}
.open-bets-pop .ob-close svg{width:calc(16 * var(--u));height:calc(16 * var(--u));fill:#ffb200}
.open-bets-pop .ob-body{flex:1 1 0%;overflow-y:auto;-webkit-overflow-scrolling:touch}
.open-bets-pop .ob-empty{margin:0;padding:calc(15 * var(--u)) calc(5 * var(--u)) calc(5 * var(--u));font-size:calc(14 * var(--u));line-height:calc(22 * var(--u));text-align:center;color:#1e1e1e}
/* Market list: grey dot, blue "Event - Market" link, bordered arrow button that opens the market's bets */
.open-bets-pop .ob-markets{margin:0;padding:0;list-style:none}
.open-bets-pop .ob-markets li{display:flex;align-items:center;gap:calc(6 * var(--u));min-height:calc(42 * var(--u));padding:calc(4 * var(--u)) calc(7 * var(--u));border-bottom:1px solid #e0e6e6;background:#fff}
.open-bets-pop .ob-dot{flex:0 0 auto;width:calc(9 * var(--u));height:calc(9 * var(--u));border:1px solid #9aa9b3;border-radius:50%;background:#c6d1d7}
.open-bets-pop .ob-market-name{flex:1 1 0%;min-width:0;padding:0;border:0;background:none;color:#2789ce;font:inherit;font-size:calc(15 * var(--u));line-height:1.3;text-align:left;text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:pointer}
.open-bets-pop .ob-arrow{flex:0 0 auto;display:flex;align-items:center;justify-content:center;width:calc(23 * var(--u));height:calc(23 * var(--u));padding:0;border:1px solid #bbb;border-radius:calc(3 * var(--u));background:#fff;cursor:pointer}
.open-bets-pop .ob-arrow svg{width:calc(17 * var(--u));height:calc(17 * var(--u));fill:#1e1e1e}
.open-bets-pop .ob-arrow:active{background:#e6e6e6}
/* Market detail: black title bar with back triangle, Matched / Unmatched header, Back and Lay tables */
.open-bets-pop .ob-market-bar{display:flex;align-items:stretch;min-height:calc(38 * var(--u));background:#1d1d1d}
.open-bets-pop .ob-back{flex:0 0 calc(40 * var(--u));display:flex;align-items:center;justify-content:center;padding:0;border:0;border-right:1px solid #4b4b4b;background:none;cursor:pointer}
.open-bets-pop .ob-back svg{width:calc(13 * var(--u));height:calc(13 * var(--u));fill:#fff}
.open-bets-pop .ob-market-bar h3{flex:1 1 0%;display:flex;align-items:center;min-width:0;margin:0;padding:calc(4 * var(--u)) calc(8 * var(--u));color:#fff;font-size:calc(13 * var(--u));font-weight:700;line-height:1.3}
.open-bets-pop .ob-status h4{display:flex;align-items:center;height:calc(40 * var(--u));margin:0;padding:0 calc(5 * var(--u));background:linear-gradient(-180deg,#2e4b5e 0%,#243a48 82%);color:#fff;font-size:calc(13 * var(--u));font-weight:700}
.open-bets-pop .ob-table{--ob-cols:1fr calc(76 * var(--u)) calc(70 * var(--u)) calc(52 * var(--u))}
.open-bets-pop .ob-table.wide{--ob-cols:1fr calc(56 * var(--u)) calc(56 * var(--u)) calc(86 * var(--u))}
.open-bets-pop .ob-thead,.open-bets-pop .ob-row{display:grid;grid-template-columns:var(--ob-cols);align-items:center;padding:0 calc(3 * var(--u)) 0 calc(5 * var(--u))}
.open-bets-pop .ob-thead{height:calc(20 * var(--u));background:#fff;color:#1e1e1e;font-size:calc(11 * var(--u))}
.open-bets-pop .ob-thead span{text-align:center;white-space:nowrap}
.open-bets-pop .ob-thead span:first-child{font-weight:700;text-align:left}
.open-bets-pop .ob-thead span:last-child,.open-bets-pop .ob-row>span:last-child{text-align:right}
.open-bets-pop .ob-ref{display:flex;gap:calc(10 * var(--u));height:calc(20 * var(--u));align-items:center;padding:0 calc(5 * var(--u));color:#3b5160;font-size:calc(11 * var(--u))}
.open-bets-pop .ob-ref.back{background:#e8f4fd}
.open-bets-pop .ob-ref.lay{background:#faf1f2}
.open-bets-pop .ob-row{min-height:calc(40 * var(--u));border-bottom:1px solid #fff;color:#1e1e1e;font-size:calc(12 * var(--u))}
.open-bets-pop .ob-row.back{background:#beddf4}
.open-bets-pop .ob-row.lay{background:#f3dce2}
.open-bets-pop .ob-row>span{text-align:center;overflow-wrap:anywhere}
.open-bets-pop .ob-row>.ob-sel{display:flex;align-items:center;gap:calc(4 * var(--u));min-width:0;text-align:left}
.open-bets-pop .ob-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.open-bets-pop .ob-side{flex:0 0 auto;display:flex;align-items:center;justify-content:center;width:calc(44 * var(--u));height:calc(30 * var(--u));border-radius:calc(4 * var(--u));background:#79c0f5;color:#1e1e1e;font-size:calc(12 * var(--u))}
.open-bets-pop .ob-row.lay .ob-side{background:#faa9ba}
/* Bet info / Time Order / Average Odds: round checkboxes, blue with a white tick when on */
.open-bets-pop .ob-options{display:flex;flex-wrap:wrap;align-items:center;gap:calc(4 * var(--u)) calc(10 * var(--u));padding:calc(8 * var(--u)) calc(5 * var(--u));border-top:1px solid #e0e6e6;color:#1e1e1e;font-size:calc(13 * var(--u))}
.open-bets-pop .ob-opt{position:relative;display:inline-flex;align-items:center;gap:calc(6 * var(--u));cursor:pointer}
.open-bets-pop .ob-opt input{position:absolute;opacity:0;width:0;height:0;margin:0}
.open-bets-pop .ob-opt i{flex:0 0 auto;width:calc(18 * var(--u));height:calc(18 * var(--u));border:1px solid #9fb6c7;border-radius:50%;background:#fff;box-shadow:inset 0 2px 0 rgba(0,0,0,.15)}
.open-bets-pop .ob-opt input:checked+i{border-color:#1f82c8;background:#278cd2 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E") center/78% no-repeat;box-shadow:none}
.open-bets-pop .ob-opt input:focus-visible+i{outline:2px solid #2789ce;outline-offset:1px}
.open-bets-pop .ob-opt.disabled{opacity:.45;cursor:default}

/* ---------- Account sub-pages: desktop site like the reference (black "My Account" menu, tan active row, slate tabs) ---------- */
body.account-desktop{background:#ededed}
body.account-desktop main{background:#ededed}
.account-desktop .account-layout{display:grid;grid-template-columns:220px minmax(0,1fr);gap:15px;max-width:none;min-width:0;margin:0;padding:0 15px 30px 0;background:#ededed;min-height:calc(100vh - 118px)}
.account-desktop .account-sidebar{float:none;width:auto;margin-top:1px;background:none}
.account-desktop .account-sidebar h3{display:flex;align-items:center;justify-content:flex-end;height:25px;margin:0;padding:0 10px;background:#000;color:#fff;font-size:12px;font-weight:400;text-align:right}
.account-desktop .account-sidebar a{display:flex;align-items:center;height:25px;padding:0 10px;border-bottom:1px solid #e0e6e6;background:#fff;color:#1e1e1e;font-size:12px;font-weight:400}
.account-desktop .account-sidebar a:last-child{border-bottom-color:#7e97a7}
.account-desktop .account-sidebar a:hover{background:#eff2f2}
.account-desktop .account-sidebar a.active{background:#f2dca7;font-weight:400}
.account-desktop .account-content{margin:0;padding:0;overflow:visible}
.account-desktop .account-content>h2{margin:12px 0 8px;padding:0;background:none;color:#222;font-size:13px;font-weight:700;line-height:1.2}
.account-desktop .red{color:#d0021b}
.account-desktop .green{color:#508d0e}

/* My Profile: two columns of cards (About You, Address | Setting, Commission) */
.profile-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px;align-items:start}
.profile-card{margin-bottom:15px;background:#fff;box-shadow:0 1px 1px rgba(0,0,0,.1)}
.profile-title{margin:0;padding:3px 10px;border-top:1px solid #8c9296;background:#7e97a7;color:#fff;font-size:13px;font-weight:700;line-height:1.2}
.profile-item{display:flex;padding:5px 10px;border-bottom:1px solid #e0e6e6;background:#fff;font-size:12px;line-height:1.2;color:#1e1e1e}
.profile-item:last-child{border-bottom-color:#7e97a7}
.profile-item-label{flex:0 0 145px}
.profile-item-value{flex:1 1 0%}

/* Tables (Account Statement, Activity Log, My Bets) */
.acc-table-wrap{overflow-x:auto;background:#fff;border-bottom:1px solid #7e97a7}
.acc-table{width:100%;border-collapse:collapse;background:#fff;font-size:12px;color:#1e1e1e}
.acc-table th{padding:5px 10px;border-top:1px solid #c1cbd2;border-bottom:1px solid #c1cbd2;background:#e0e6e6;color:#243a48;font-size:12px;font-weight:700;line-height:1.2;text-align:right;white-space:nowrap}
.acc-table td{padding:6px 10px;border-bottom:1px solid #e0e6e6;line-height:1.3;text-align:right;vertical-align:middle}
.acc-table .al{text-align:left}
.acc-table td small{display:block;color:#777;font-size:11px}
.acc-table tbody tr:hover td{background:#fff}
.acc-table td.no-data{color:#1e1e1e}
.acc-table tr.total td{background:#f3f5f6}
.statement-table td:nth-child(5),.statement-table td:nth-child(6){max-width:180px}
.statement-table .tri{color:#7e97a7;font-size:10px}
.activity-table td{white-space:nowrap}
.acc-pager{display:flex;justify-content:flex-end;gap:3px;margin:10px 0}
.acc-pager a,.acc-pager span{display:flex;align-items:center;justify-content:center;min-width:32px;height:22px;padding:0 8px;border:1px solid #bbb;border-radius:3px;background:#fff;color:#1e1e1e;font-size:12px}
.acc-pager a:hover{background:#eff2f2}
.acc-pager .disabled{border-color:#d3d3d3;background:#dcdcdc;color:#999}
.acc-pager .current{border-color:#222;background:linear-gradient(180deg,#454744,#373737);color:#ffb80c;font-weight:700}

/* My Bets: Current Bets | Bets History | Profit & Loss, product tabs, filter panel */
.mybets-tabs{display:inline-flex;margin-bottom:10px;border:1px solid #3b5160;border-radius:3px;overflow:hidden}
.mybets-tabs a{min-width:110px;padding:4px 12px;border-left:1px solid #3b5160;background:#fff;color:#3b5160;font-size:12px;font-weight:700;line-height:1.2;text-align:center}
.mybets-tabs a:first-child{border-left:0}
.mybets-tabs a.active{background:#3b5160;color:#fff}
.pnl-title{margin:0 0 4px;color:#222;font-size:13px;font-weight:700}
.pnl-user{display:flex;align-items:center;gap:4px;margin:0 0 10px;color:#777;font-size:12px}
.pnl-user svg{width:14px;height:14px;fill:#777}
.pnl-user svg:not(:first-child){margin-left:10px}
.acc-products{display:flex;flex-wrap:wrap;gap:3px;margin:0;padding:0;border-bottom:3px solid #3b5160}
.acc-products a{padding:4px 12px;border:1px solid #bbb;border-bottom:0;border-radius:3px 3px 0 0;background:#fff;color:#1e1e1e;font-size:12px;line-height:1.3}
.acc-products a.active{border-color:#3b5160;background:#3b5160;color:#fff;font-weight:700}
.acc-filter{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:0 0 10px;padding:8px 10px;background:#dee4e6;color:#1e1e1e;font-size:12px}
.acc-filter.acc-period{flex-direction:column;align-items:flex-start;gap:8px}
.acc-filter-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.acc-filter label{display:flex;align-items:center;gap:6px}
.acc-filter select{min-width:90px;height:25px;padding:0 6px;border:1px solid #bbb;border-radius:4px;background:#fff;font-size:12px}
.acc-filter-label{margin-left:4px}
.acc-radio input{margin:0;accent-color:#2789ce}
.acc-period-box{display:flex;align-items:center;gap:4px;height:25px;padding:0 6px;border:1px solid #bbb;border-radius:4px;background:#fff}
.acc-period-box svg{width:14px;height:14px;fill:#3b5160}
.acc-period-box input{height:19px;padding:0 2px;border:0;background:none;font-size:12px;color:#1e1e1e}
.acc-period-box input[type=time]{border-radius:2px;background:#eef1f2;color:#555}
.acc-btn,.acc-btn-dark{height:25px;padding:0 14px;border-radius:4px;font-size:12px;line-height:1;cursor:pointer}
.acc-btn{border:1px solid #bbb;background:#fbfdfd;color:#1e1e1e}
.acc-btn:hover{background:#eff2f2}
.acc-btn-dark{border:1px solid #222;background:linear-gradient(180deg,#3e4342,#0b0b0b);color:#ffb80c;font-weight:700}
.acc-btn-dark:hover{background:linear-gradient(180deg,#4b504f,#1b1b1b)}
.acc-error{margin:0 0 10px;color:#d0021b;font-size:12px}
.acc-section{margin-bottom:12px}
.acc-section>h3{margin:0;padding:5px 10px;background:var(--slate-bg);color:#fff;font-size:12px;font-weight:700;line-height:1.2}
.acc-help{margin-top:10px;padding:10px;background:#fff;color:#363636;font-size:12px;line-height:1.4}
.acc-help p{margin:0 0 8px}
.acc-help p:last-child{margin:0}

/* Mobile Account page: LOGOUT colours sampled from the reference recording */
.mobile-account .account-logout button{background:linear-gradient(180deg,#e73223,#d52c1c 50%,#c82718);border-top:1px solid #c8372b;border-bottom:1px solid #a02317}
.mobile-account{background:#ececec}

/* ---------- Full market page (reference skyfair.biz #/fullMarket; colours sampled from the reference screenshots) ---------- */
.event-page.fm{background:#eee;font-family:var(--font-mobile)}
.fm-title{display:flex;align-items:center;height:calc(34 * var(--u));padding:0 calc(10 * var(--u)) 0 0;background:linear-gradient(180deg,#2c4759,#263e4f);color:#fff}
.fm-title .fm-pin{flex:0 0 auto;display:flex;align-items:center;justify-content:center;height:100%;width:calc(34 * var(--u));margin:0;padding:0;border:0;border-right:1px solid rgba(255,255,255,.18);background:none;filter:none;opacity:1;cursor:pointer}
.fm-title .fm-pin svg{width:calc(26 * var(--u));height:calc(26 * var(--u));padding:calc(5 * var(--u));border-radius:50%;background:#20303b;fill:#cad5de}
.fm-title .fm-pin.pinned svg{background:#ffb200;fill:#1e1e1e}
.fm-title>b{flex:1 1 0%;min-width:0;margin-left:calc(11 * var(--u));font-size:calc(15 * var(--u));font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fm-status{display:flex;align-items:center;gap:calc(5 * var(--u));font-size:calc(15 * var(--u))}
.fm-clock{display:flex;align-items:center;justify-content:center;width:calc(16 * var(--u));height:calc(16 * var(--u));border-radius:calc(3 * var(--u));background:#51bb0a}
.fm-clock svg{width:calc(13 * var(--u));height:calc(13 * var(--u));fill:#fff}

.fm-score{position:relative;padding:calc(8 * var(--u)) 0 calc(22 * var(--u));background:#1e1e1e;color:#fff;text-align:center}
.fm-score.collapsed{padding-bottom:calc(20 * var(--u))}
.fm-score.collapsed .fm-score-body{display:none}
.fm-score-status{margin:0 0 calc(6 * var(--u));color:#c2c2c2;font-size:calc(11 * var(--u))}
.fm-teams{display:flex;justify-content:space-between;gap:calc(10 * var(--u));padding:0 calc(11 * var(--u));font-size:calc(15 * var(--u))}
.fm-teams span:last-child{text-align:right}
.fm-score-line{margin:calc(6 * var(--u)) 0 0;font-size:calc(16 * var(--u))}
.fm-score-line b{font-weight:700}
.fm-score-desc{margin:calc(6 * var(--u)) calc(11 * var(--u)) 0;font-size:calc(11 * var(--u))}
.fm-score-toggle{position:absolute;left:50%;bottom:0;display:flex;align-items:center;justify-content:center;width:calc(40 * var(--u));height:calc(20 * var(--u));margin-left:calc(-20 * var(--u));padding:0;border:0;background:none;cursor:pointer}
.fm-score-toggle svg{width:calc(22 * var(--u));height:calc(22 * var(--u));fill:#f9c12a;transform:rotate(180deg);transition:transform .2s}
.fm-score.collapsed .fm-score-toggle svg{transform:none}

.fm-pills{display:flex;gap:calc(6 * var(--u));height:calc(43 * var(--u));padding:calc(4 * var(--u)) calc(7 * var(--u)) 0;overflow-x:auto;scrollbar-width:none;background:#dfe5e5}
.fm-pills::-webkit-scrollbar{display:none}
.fm-pills button{flex:0 0 auto;height:calc(34 * var(--u));padding:0 calc(14 * var(--u));border:0;border-radius:9999px;background:#243946;color:#fff;font-family:inherit;font-size:calc(14 * var(--u));font-weight:700;white-space:nowrap;cursor:pointer}
.fm-pills button.active{background:linear-gradient(180deg,#403f41,#0e0e0e);color:#ffb200}
.fm-pills button[hidden]{display:none}

.fm-market{scroll-margin-top:calc(110 * var(--u))}
.fm-market .odd{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;min-height:0;margin:0;padding:0;border:0;border-left:1px solid #fff;border-radius:0;color:#1e1e1e;cursor:pointer}
.fm-market .odd b{display:block;font-size:calc(13 * var(--u));font-weight:700;line-height:1.2}
.fm-market .odd small{display:block;font-size:calc(11 * var(--u));line-height:1.2;color:#555}
.fm-market .odd:disabled{cursor:default}
.fm-market .odd.selected{outline:2px solid #1e1e1e;outline-offset:-2px}
.fm-row{position:relative;display:grid;grid-template-columns:60% 20% 20%;align-items:stretch;min-height:calc(46 * var(--u));border-bottom:1px solid #8a9092;background:#fff}
.fm-row>strong{display:flex;align-items:center;min-width:0;padding:calc(3 * var(--u)) calc(6 * var(--u));color:#111;font-size:calc(15 * var(--u));font-weight:500;overflow-wrap:anywhere}

/* Match Odds */
.fm-mo-head{display:grid;grid-template-columns:60% 20% 20%;align-items:end;min-height:calc(40 * var(--u));padding-bottom:calc(3 * var(--u));border-bottom:1px solid #8a9092;background:#fff}
.fm-mo-head>b{text-align:center;color:#111;font-size:calc(13 * var(--u));font-weight:700}
.fm-matched{display:flex;align-items:center;gap:calc(6 * var(--u));padding-left:calc(4 * var(--u));align-self:center}
.fm-matched svg{width:calc(22 * var(--u));height:calc(22 * var(--u));color:#758086}
.fm-matched span{color:#555;font-size:calc(11 * var(--u));line-height:1.2}
.fm-matched b{display:block;color:#000;font-size:calc(12 * var(--u));font-weight:700}
.fm-mo .odd.back{background:#8fd7a1}
.fm-mo .odd.lay{background:#a7ced7}
.fm-mo .odd:not(:disabled):hover{filter:brightness(.95)}
.fm-rows{position:relative}
.fm-suspend-box{position:absolute;top:0;bottom:0;left:60%;right:0;display:flex;align-items:center;justify-content:center;border:1px solid #d0021b;background:#fff;color:#d0021b;font-size:calc(13 * var(--u));font-weight:700;line-height:1.5}
.fm-suspend-box.fm-low-box{border:0;background:rgba(0,0,0,.45);color:#fff}
.fm-low{flex:0 0 auto;width:calc(25 * var(--u));height:calc(15 * var(--u));margin-left:calc(5 * var(--u));background:url("data:image/svg+xml,%3Csvg width='26' height='15' viewBox='0 0 26 15' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='0.500977' width='25' height='15' rx='3' fill='%23D0021B'/%3E%3Cpath d='M8.10645 11H3.25293V3.72949H5.0791V9.61328H8.10645V11ZM14.1416 8.26074C14.1416 9.16243 13.8942 9.8737 13.3994 10.3945C12.9079 10.9121 12.2113 11.1709 11.3096 11.1709C10.4144 11.1709 9.71777 10.9121 9.21973 10.3945C8.72493 9.8737 8.47754 9.16243 8.47754 8.26074C8.47754 7.34928 8.72493 6.63639 9.21973 6.12207C9.71777 5.60449 10.4144 5.3457 11.3096 5.3457C12.208 5.3457 12.9046 5.60612 13.3994 6.12695C13.8942 6.64453 14.1416 7.35579 14.1416 8.26074ZM12.3887 8.27051C12.3887 7.94499 12.361 7.6748 12.3057 7.45996C12.2536 7.24186 12.1803 7.06771 12.0859 6.9375C11.985 6.80078 11.8711 6.70638 11.7441 6.6543C11.6172 6.59896 11.4723 6.57129 11.3096 6.57129C11.1566 6.57129 11.0182 6.5957 10.8945 6.64453C10.7708 6.6901 10.6569 6.77962 10.5527 6.91309C10.4551 7.04004 10.377 7.21419 10.3184 7.43555C10.2598 7.6569 10.2305 7.93522 10.2305 8.27051C10.2305 8.60579 10.2581 8.8776 10.3135 9.08594C10.3688 9.29102 10.4404 9.4554 10.5283 9.5791C10.6195 9.70605 10.7334 9.79883 10.8701 9.85742C11.0068 9.91602 11.1582 9.94531 11.3242 9.94531C11.4609 9.94531 11.5993 9.91602 11.7393 9.85742C11.8825 9.79883 11.9964 9.71094 12.0811 9.59375C12.182 9.45378 12.2585 9.28613 12.3105 9.09082C12.3626 8.89225 12.3887 8.61882 12.3887 8.27051ZM23.2188 5.5166L21.6172 11H19.8008L18.8389 7.45508L17.8721 11H16.0557L14.4688 5.5166H16.2656L17.1055 9.14453L18.1455 5.5166H19.6543L20.6357 9.14453L21.4609 5.5166H23.2188Z' fill='white'/%3E%3C/svg%3E") center/contain no-repeat}
.fm-low[hidden]{display:none}
.fm-all-suspended .odd{pointer-events:none}
.fm-row-suspended::after{content:attr(data-status);position:absolute;top:0;bottom:0;left:60%;right:0;display:flex;align-items:center;justify-content:center;background:rgba(30,40,50,.55);color:#fff;font-size:calc(15 * var(--u));font-weight:700}
.fm-row-suspended .odd{pointer-events:none}

/* Bookmaker */
.fm-bar{display:flex;align-items:center;gap:calc(8 * var(--u));min-height:calc(34 * var(--u));padding:0 calc(8 * var(--u)) 0 calc(4 * var(--u));background:#3b505f;color:#fff}
.fm-bar-pin{flex:0 0 auto;display:flex}
.fm-bar-pin svg{width:calc(24 * var(--u));height:calc(24 * var(--u));padding:calc(5 * var(--u));border-radius:50%;background:#273845;fill:#cad5de}
.fm-bar>b{flex:1 1 0%;min-width:0;font-size:calc(14 * var(--u));font-weight:400;line-height:1.2}
.fm-bm .fm-bar>b{flex:0 0 auto;font-weight:700}
.fm-bar>em{padding-left:calc(8 * var(--u));border-left:1px solid rgba(255,255,255,.5);color:#aab6be;font-size:calc(14 * var(--u));font-style:normal}
.fm-bm-sub{display:flex;align-items:center;justify-content:space-between;height:calc(29 * var(--u));padding:0 calc(8 * var(--u));background:#e4eff8;color:#222;font-size:calc(13 * var(--u))}
.fm-bm-sub i{display:flex}.fm-bm-sub svg{width:calc(18 * var(--u));height:calc(18 * var(--u));color:#3b505f}
.fm-bm-head,.fm-fancy-head{display:grid;grid-template-columns:60% 20% 20%;align-items:center;height:calc(25 * var(--u));background:#f8f4e0;border-bottom:1px solid #c1c5b8}
.fm-bm-head>b,.fm-fancy-head>b{text-align:center;color:#1e1e1e;font-size:calc(13 * var(--u));font-weight:500}
.fm-bm-row{min-height:calc(48 * var(--u));background:#f8f4e0;border-bottom-color:#c1c5b8}
.fm-bm .odd{padding:calc(4 * var(--u));border-left:0}
.fm-bm .odd.back{background:#b2d2e8}.fm-bm .odd.lay{background:#f6d6de}
.fm-bm .odd b{display:flex;align-items:center;justify-content:center;width:100%;height:100%;border:1px solid #fff;border-radius:calc(3 * var(--u));font-size:calc(14 * var(--u))}
.fm-bm .odd.back b{background:#72baef}.fm-bm .odd.lay b{background:#f9a9b8}
.fm-bm .odd small{display:none}

/* Premium <sport> / Fancy Bet */
.fm-sb{margin-top:calc(18 * var(--u))}
.fm-sb-tabs{display:flex;align-items:flex-end;height:calc(30 * var(--u))}
.fm-sb-tab{display:flex;align-items:stretch;height:100%;margin:0;padding:0;border:0;background:none;color:#fff;font-family:inherit;font-size:calc(15 * var(--u));font-weight:700;cursor:pointer}
.fm-sb-tab span{display:flex;align-items:center;padding:0 calc(10 * var(--u));background:#233845;white-space:nowrap}
.fm-sb-tab i{display:flex;align-items:center;padding:0 calc(14 * var(--u)) 0 calc(6 * var(--u));background:#233845;clip-path:polygon(0 0,100% 0,72% 100%,0 100%)}
.fm-sb-tab i svg{width:calc(17 * var(--u));height:calc(17 * var(--u));color:#fff}
.fm-sb-tab:first-child span{border-top-left-radius:calc(4 * var(--u))}
.fm-sb-tab+.fm-sb-tab span{padding-left:calc(16 * var(--u));clip-path:polygon(calc(10 * var(--u)) 0,100% 0,100% 100%,0 100%);border-top-right-radius:calc(4 * var(--u));margin-left:calc(-8 * var(--u))}
.fm-sb-tab.active span{background:linear-gradient(180deg,#ec6724,#e35610)}
.fm-sb-tab.active i{background:#f19b4a}
.fm-min{display:flex;align-items:center;gap:calc(3 * var(--u));height:100%;margin:0 0 0 auto;padding:0 calc(6 * var(--u));border:0;border-radius:calc(4 * var(--u)) calc(4 * var(--u)) 0 0;background:#bdd4d6;color:#1f3a3d;font-family:inherit;font-size:calc(15 * var(--u));cursor:pointer}
.fm-min svg{width:calc(15 * var(--u));height:calc(15 * var(--u))}
.fm-min.on{background:#9fc0c3}
.fm-min-info{margin:0;padding:calc(5 * var(--u)) calc(8 * var(--u));background:#bdd4d6;color:#1f3a3d;font-size:calc(12 * var(--u))}
.fm-sb-filter{display:flex;align-items:center;height:calc(30 * var(--u));padding:0 calc(3 * var(--u));overflow-x:auto;background:linear-gradient(180deg,#e35610,#e75516);scrollbar-width:thin;scrollbar-color:#8b3a12 transparent}
.fm-sb-filter::-webkit-scrollbar{height:2px}.fm-sb-filter::-webkit-scrollbar-thumb{background:#8b3a12}
.fm-sb-filter button{flex:0 0 auto;height:calc(24 * var(--u));margin:0;padding:0 calc(9 * var(--u));border:0;border-left:1px solid #ff925b;background:none;color:#fff;font-family:inherit;font-size:calc(14 * var(--u));font-weight:700;white-space:nowrap;cursor:pointer}
.fm-sb-filter button:first-child,.fm-sb-filter button.active,.fm-sb-filter button.active+button{border-left-color:transparent}
.fm-sb-filter button.active{border-radius:calc(4 * var(--u));background:#fffffd;color:#89250a}
/* Premium markets, measured on the reference (skyfair.biz SportsBook, 1u = 1px at 375): 1px of page between markets,
   34u title bar with a 25u pin and a one-line title, 49u rows split 60/40 with a blue-grey line under each row. */
.fm-pm{margin-bottom:1px}
.fm-pm .fm-bar{height:calc(34 * var(--u));min-height:0;gap:calc(5 * var(--u));padding:0 calc(8 * var(--u)) 0 calc(5 * var(--u))}
.fm-pm .fm-bar-pin svg{width:calc(25 * var(--u));height:calc(25 * var(--u));padding:calc(3.5 * var(--u));background:#223039}
.fm-pm .fm-bar>b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fm-pm .fm-fold{width:calc(14 * var(--u));height:calc(14 * var(--u));border-radius:calc(2 * var(--u));font-size:calc(13 * var(--u));font-weight:700}
.fm-fold{flex:0 0 auto;display:flex;align-items:center;justify-content:center;width:calc(17 * var(--u));height:calc(17 * var(--u));margin:0;padding:0;border:1.5px solid #fff;border-radius:calc(3 * var(--u));background:none;color:#fff;font-size:calc(15 * var(--u));line-height:1;cursor:pointer}
.fm-pm-rows{position:relative}
.fm-pm-row{grid-template-columns:60% 40%;min-height:calc(49 * var(--u));border-bottom-color:#7e97a7}
.fm-pm-row>strong{font-weight:400;padding:calc(5 * var(--u)) calc(7 * var(--u));color:#1e1e1e;line-height:1.3}
.fm-pm .odd.back{background:#72e2a1;color:#1e1e1e}
.fm-pm .odd b{font-size:calc(11 * var(--u));font-weight:400;line-height:1.2}
.fm-pm .odd.back:not(:disabled):hover{background:#5fd690}
.fm-pm .odd.selected{outline:0;background:#16a55f;color:#fff}
.fm-suspend-overlay{position:absolute;inset:0 0 0 60%;display:flex;align-items:center;justify-content:center;background:rgba(30,40,50,.55);color:#fff;font-size:calc(15 * var(--u));font-weight:700}
.fm-pm-suspended .odd{pointer-events:none}
.fm-fancy-row .odd.lay{background:#faa9ba}.fm-fancy-row .odd.back{background:#72bbef}
.fm-fancy-head{background:#fff}
.fm-empty{margin:0;padding:calc(7 * var(--u)) calc(8 * var(--u));border-bottom:2px solid #c8c8c8;background:#fff;color:#333;font-size:calc(14 * var(--u))}

/* Scoreboard texts + run-rate graph (reference skyfair.biz: #1e1e1e panel, blue home / pink away series, gold switcher) */
/* Measured on the reference at 360px (1u = 0.96px): status tag 14u, team names 13.3u, score 11.6u, every small text 9.4u,
   graph panel = 15u head + 345 x 80.5 plot, 30u chart switch on the right, 17u for the arrow. */
.fm-score{padding:0 0 calc(17 * var(--u))}
.fm-score.collapsed{padding-bottom:calc(17 * var(--u))}
.fm-score-status{display:table;margin:0 auto;padding:0 calc(4.5 * var(--u));border:1px solid #141414;border-top:0;background:#272727;color:#c9c9c9;font-size:calc(9.4 * var(--u));line-height:calc(13.5 * var(--u))}
.fm-score-status:empty{display:none}
.fm-teams{margin-top:calc(-2 * var(--u));padding:0 calc(11.8 * var(--u));font-size:calc(13.3 * var(--u));line-height:calc(16 * var(--u))}
.fm-score-line{margin:calc(-1.3 * var(--u)) 0 0;color:#fff;font-size:calc(11.6 * var(--u));line-height:calc(13 * var(--u));word-spacing:calc(3 * var(--u))}
.fm-score-line b{color:#fff;font-size:inherit;font-weight:500}
.fm-ytb{color:#e0e0e0;font-weight:400}
.fm-score-desc{margin:0 calc(11 * var(--u));color:#fff;font-size:calc(9.4 * var(--u));line-height:calc(11 * var(--u))}
.fm-rr{position:relative;margin-top:calc(2.9 * var(--u));border-top:1px solid #141414}
.fm-rr[hidden]{display:none}
.fm-rr-head{position:relative;display:flex;align-items:stretch;justify-content:center;height:calc(15 * var(--u))}
.fm-rr-head>b{position:absolute;left:calc(15.6 * var(--u));top:0;color:#fff;font-size:calc(9.4 * var(--u));font-weight:700;line-height:calc(15 * var(--u))}
.fm-rr-inns{display:flex}
.fm-rr-inns select{height:100%;max-width:calc(210 * var(--u));margin:0;padding:0 calc(16 * var(--u)) 0 calc(2 * var(--u));border:1px solid #141414;border-top:0;border-radius:0;background:#272727 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath d='M0 0h10L5 6z' fill='%23fff'/%3E%3C/svg%3E") right calc(5.5 * var(--u)) center/calc(5.6 * var(--u)) no-repeat;color:#fff;font-family:inherit;font-size:calc(9.4 * var(--u));line-height:calc(14 * var(--u));appearance:none;-webkit-appearance:none;cursor:pointer;text-align:center}
.fm-rr-inns select option{background:#1e1e1e;color:#fff}
.fm-rr-body{display:block;margin-right:calc(30 * var(--u))}
.fm-rr-chart{display:block;width:100%;height:auto;overflow:visible}
.fm-rr-chart .fm-rr-tick{fill:#777;font-size:9.4px;font-family:Roboto,var(--font-mobile)}
.fm-rr-chart .fm-rr-w text{fill:#fff;font-size:6.6px;font-weight:700;font-family:Roboto,var(--font-mobile)}
.fm-rr-switch{position:absolute;top:0;right:0;bottom:0;display:flex;flex-direction:column;width:calc(30 * var(--u));border-left:1px solid #141414}
.fm-rr-switch button{flex:1 1 0%;display:flex;align-items:center;justify-content:center;margin:0 0 0 -1px;padding:0;border:0;border-left:1px solid transparent;background:none;color:#d6d6d6;cursor:pointer}
.fm-rr-switch button+button{border-top:1px solid #141414}
.fm-rr-switch button.active{border-left-color:#f5b82e;color:#f5b82e}
.fm-rr-switch svg{width:calc(11.5 * var(--u));height:calc(11.5 * var(--u))}
.fm-score-toggle{height:calc(17 * var(--u))}
.fm-score-toggle svg{fill:#f8b82c;transform:none}
.fm-score.collapsed .fm-score-toggle svg{transform:rotate(180deg)}

/* Sign up chooser (WhatsApp / Telegram) */
.signup-modal{width:min(340px,calc(100vw - 32px));padding:0;border:0;border-radius:8px;background:#fff;color:#1e1e1e;font-family:var(--font-mobile);box-shadow:0 8px 30px rgba(0,0,0,.4)}
.signup-modal::backdrop{background:rgba(0,0,0,.6)}
.signup-modal header{display:flex;align-items:center;justify-content:space-between;height:44px;padding:0 6px 0 14px;background:linear-gradient(180deg,#474747,#070707);color:#ffb600}
.signup-modal h2{margin:0;font-size:16px;font-weight:700}
.signup-close{width:36px;height:36px;border:0;background:none;color:#ffb600;font-size:26px;line-height:1;cursor:pointer}
.signup-modal p{margin:14px 16px;font-size:14px;line-height:1.4;color:#3b5160}
.signup-options{display:grid;gap:10px;padding:0 16px 18px}
.signup-option{display:flex;align-items:center;justify-content:center;gap:8px;height:46px;border-radius:6px;color:#fff;font-size:16px;font-weight:700}
.signup-option svg{width:24px;height:24px;fill:#fff}
.signup-option.whatsapp{background:#25d366}.signup-option.whatsapp:hover{background:#1ebe5b}
.signup-option.telegram{background:#229ed9}.signup-option.telegram:hover{background:#1c8cc2}

/* Desktop header login (reference: logged-out Sky Exchange home): user icon, Username, Password, Validation + code,
   red Login, grey Sign up. Phones keep the Sign up / Login buttons. */
.header-login{display:none}
@media(min-width:701px){
    .guest-actions .header-login{order:1;display:flex;align-items:center;gap:5px;margin:0}
    .guest-actions .login-btn{display:none}
    .header-login-user{width:12px;height:12px;margin-right:4px;fill:#ffb600}
    .header-login input{width:130px;height:25px;margin:0;padding:0 5px;border:0;border-radius:4px;background:#fff;box-shadow:inset 0 1px 0 rgba(0,0,0,.5);color:#1e1e1e;font-family:Tahoma,Helvetica,sans-serif;font-size:12px}
    .header-login input::placeholder{color:#9ca3af}
    .header-login input:focus{outline:1px solid #ffb600;outline-offset:0}
    .header-login-code{position:relative;display:block}
    .header-login-code input{border:1px solid #bbb;padding-right:50px}
    .header-login-code strong{position:absolute;right:6px;top:50%;transform:translateY(-55%);color:#000;font-family:Tahoma,Verdana,sans-serif;font-size:18px;font-weight:900;line-height:1;pointer-events:none}
    .header-login-btn{display:flex;align-items:center;justify-content:center;gap:4px;width:80px;height:25px;margin:0 0 0 5px;padding:0;border:0;border-radius:4px;background:linear-gradient(180deg,#f72424,#bb1c00);color:#fff;font-family:Tahoma,Helvetica,sans-serif;font-size:12px;font-weight:700;cursor:pointer}
    .header-login-btn:hover{filter:brightness(1.12)}
    .header-login-btn svg{width:11px;height:11px;fill:#fff}
    .guest-actions .signup{order:2;margin-left:10px;background:linear-gradient(180deg,#666,#333)}
}

/* Inline bet slip (reference skyfair.biz mobile; colours sampled from the reference screenshot) */
.fm-slip{--slip-bg:#d2ecd0;--slip-foot:#c5ddc2;--slip-max:#b8ceb5;--slip-line:#849e8f;--slip-off:#d8e7d6;--slip-off-b:#c8d9c6;--slip-off-t:#b3bfb2;
    border-top:1px solid var(--slip-line);border-bottom:1px solid var(--slip-line);background:var(--slip-bg);color:#1e1e1e;font-family:var(--font-mobile)}
.fm-slip[hidden]{display:none}
.fm-slip.lay.type-match{--slip-bg:#d9eaee;--slip-foot:#c6dce2;--slip-max:#b3cbd2;--slip-line:#8aa3aa;--slip-off:#d5e4e8;--slip-off-b:#c3d6db;--slip-off-t:#a9bcc1}
.fm-slip.back.type-bookmaker,.fm-slip.back.type-fancy{--slip-bg:#d4e6f3;--slip-foot:#bfd6e8;--slip-max:#a9c6dc;--slip-line:#7fa4bf;--slip-off:#d1e2ee;--slip-off-b:#bcd2e3;--slip-off-t:#a6bccc}
.fm-slip.lay.type-bookmaker,.fm-slip.lay.type-fancy{--slip-bg:#f6e1e6;--slip-foot:#ebccd4;--slip-max:#deb6c0;--slip-line:#c393a0;--slip-off:#f2dce2;--slip-off-b:#e5c8d0;--slip-off-t:#c9aab2}
.fm-slip-min{display:grid;grid-template-columns:1fr 1fr;gap:calc(12 * var(--u));margin:0;padding:0 calc(10 * var(--u));height:calc(28 * var(--u));align-items:center;font-size:calc(11 * var(--u))}
.fm-slip-min span:last-child{text-align:center}
.fm-slip-inputs{display:grid;grid-template-columns:1fr 1fr;gap:calc(12 * var(--u));padding:0 calc(10 * var(--u))}
.fm-slip-odds{display:flex;align-items:center;justify-content:center;height:calc(38 * var(--u));border:1px solid #c5cdc4;border-radius:calc(5 * var(--u));background:#dcdcdc;color:#8d8d8d;font-size:calc(15 * var(--u));font-weight:700}
.fm-slip-stake{display:flex;height:calc(38 * var(--u));border:1px solid #b2beb1;border-radius:calc(5 * var(--u));overflow:hidden;background:#fff}
.fm-slip-stake input{flex:1 1 0%;min-width:0;height:100%;margin:0;padding:0 calc(4 * var(--u));border:0;border-left:1px solid #bababa;border-right:1px solid #bfb9b3;border-radius:0;background:#fdedc7;box-shadow:inset 0 1px 1px rgba(0,0,0,.08);color:#1e1e1e;font-family:inherit;font-size:calc(15 * var(--u));font-weight:700;text-align:center;caret-color:#6e9196;outline:0}
.fm-step{flex:0 0 calc(38 * var(--u));display:flex;align-items:center;justify-content:center;margin:0;padding:0;border:0;background:linear-gradient(180deg,#fcfcfc,#f1f0f0);cursor:pointer}
.fm-step svg{width:calc(18 * var(--u));height:calc(18 * var(--u));fill:#1f72ac}
.fm-step:active{background:#e6e6e6}
.fm-slip-quick{display:flex;height:calc(30 * var(--u));margin-top:calc(13 * var(--u));border-top:1px solid #80a7b5;background:linear-gradient(180deg,#315e7c,#2a526d 50%,#22475f)}
.fm-slip-quick button{flex:1 1 0%;min-width:0;margin:0;padding:0;border:0;border-left:1px solid rgba(255,255,255,.15);background:none;color:#fff;font-family:inherit;font-size:calc(13 * var(--u));cursor:pointer}
.fm-slip-quick button:first-child{border-left:0}
.fm-slip-quick button:active{background:rgba(255,255,255,.12)}
.fm-slip-keys{display:grid;grid-template-columns:repeat(7,1fr);grid-template-rows:repeat(2,calc(39 * var(--u)));margin-top:calc(9 * var(--u));border-top:1px solid #c4d4c3;background:#fff}
.fm-slip-keys button{margin:0;padding:0;border:0;border-right:1px solid #dcdcdc;border-bottom:1px solid #dcdcdc;background:#fff;color:#131313;font-family:inherit;font-size:calc(14 * var(--u));cursor:pointer}
.fm-slip-keys button:nth-child(-n+6){grid-row:1}
.fm-slip-keys button:nth-child(n+7):nth-child(-n+12){grid-row:2;border-bottom:0}
.fm-slip-keys .fm-slip-back{grid-column:7;grid-row:1 / span 2;border-right:0;border-bottom:0;display:flex;align-items:center;justify-content:center}
.fm-slip-back svg{width:calc(20 * var(--u));height:calc(20 * var(--u));color:#111}
.fm-slip-keys button:active{background:#eee}
.fm-slip-message{margin:0;padding:0 calc(10 * var(--u));font-size:calc(12 * var(--u))}
.fm-slip-message:empty{display:none}
.fm-slip-message:not(:empty){padding-top:calc(8 * var(--u))}
.fm-slip-message.ok{color:#508d0e}.fm-slip-message.error{color:#d0021b}
.fm-slip-actions{display:grid;grid-template-columns:1fr 1fr;gap:calc(9 * var(--u));padding:calc(11 * var(--u)) calc(10 * var(--u)) calc(13 * var(--u))}
.fm-slip-actions button{height:calc(42 * var(--u));margin:0;border-radius:calc(5 * var(--u));font-family:inherit;font-size:calc(15 * var(--u));font-weight:700;cursor:pointer}
.fm-slip-cancel{border:1px solid #b0b8af;background:linear-gradient(180deg,#fefefe,#f6f6f6 50%,#efefee);color:#000}
.fm-slip-place{border:1px solid #222;background:linear-gradient(180deg,#474747,#070707);color:#ffb200}
.fm-slip-place:disabled{border-color:var(--slip-off-b);background:var(--slip-off);color:var(--slip-off-t);cursor:default}
.fm-slip-foot{display:flex;align-items:center;justify-content:space-between;height:calc(27 * var(--u));padding:0 calc(12 * var(--u)) 0 calc(8 * var(--u));background:var(--slip-foot)}
.fm-slip-accept{display:flex;align-items:center;gap:calc(9 * var(--u));font-size:calc(13 * var(--u));cursor:pointer}
.fm-slip-accept[hidden]{visibility:hidden;display:flex}
.fm-slip-accept input{appearance:none;-webkit-appearance:none;position:relative;width:calc(18 * var(--u));height:calc(18 * var(--u));margin:0;border:1px solid #bb8c00;border-radius:calc(2 * var(--u));background:#fff;cursor:pointer}
.fm-slip-accept input:checked{background:#ffb200}
.fm-slip-accept input:checked::after{content:'';position:absolute;left:30%;top:10%;width:30%;height:55%;border:solid #000;border-width:0 2px 2px 0;transform:rotate(45deg)}
.fm-slip-max{height:calc(19 * var(--u));min-width:calc(41 * var(--u));margin:0;padding:0 calc(6 * var(--u));border:0;border-radius:calc(3 * var(--u));background:var(--slip-max);color:#0e1a0d;font-family:inherit;font-size:calc(13 * var(--u));font-weight:500;cursor:pointer}
/* Profit / loss projection under runner names while a slip is open */
.fm-row>strong{flex-direction:column;align-items:flex-start;justify-content:center}
.fm-proj{display:flex;align-items:center;gap:calc(2 * var(--u));margin-top:calc(2 * var(--u));color:#508d0e;font-size:calc(11 * var(--u));font-weight:400}
.fm-proj svg{width:calc(11 * var(--u));height:calc(11 * var(--u));fill:currentColor}
.fm-proj.loss{color:#d0021b}

/* Match page corrections from the reference screenshots (Match Odds / Bookmaker / Fancy Bet) */
.fm-mo .odd.back{background:#72bbef}
.fm-mo .odd.lay{background:#faa9ba}
.fm-mo .odd small{color:#1e1e1e;opacity:.75}
.fm-mo .fm-row>strong{font-weight:400;color:#1e1e1e}
.fm-mo .fm-row{min-height:calc(48 * var(--u))}
.fm-mo-head>b{font-weight:400;font-size:calc(13 * var(--u))}
.fm-bm .fm-row>strong{font-weight:400;color:#1e1e1e}
.fm-bm .odd.back{background:#b5d2f0}.fm-bm .odd.lay{background:#f2c2cc}
.fm-bm .odd.back b{background:#72bbef}.fm-bm .odd.lay b{background:#faa9ba}
.fm-bm .fm-bar>b{font-weight:400}
.fm-bm .fm-row-suspended::after{left:60%;background:rgba(20,30,45,.55)}

/* Fancy Bet / Premium tab row: dark slate bar, pin block, teal Fancy Bet, Premium with a red "New" badge */
.fm-sb .fm-sb-tabs{position:relative;align-items:stretch;height:calc(32 * var(--u));background:linear-gradient(180deg,#eee 0,#eee 18%,#1e3c46 18%,#243a48 100%)}
.fm-sb-pin{flex:0 0 calc(34 * var(--u));display:flex;align-items:center;justify-content:center;margin-top:calc(6 * var(--u));background:#243a48}
.fm-sb-pin svg{width:calc(24 * var(--u));height:calc(24 * var(--u));padding:calc(5 * var(--u));border-radius:50%;background:#3d4c59;fill:#c8d3d9}
.fm-sb .fm-sb-tab{position:relative;margin-top:0;font-size:calc(15 * var(--u));font-weight:400}
.fm-sb .fm-sb-tab span{gap:calc(6 * var(--u));padding:0 calc(10 * var(--u));background:#253844;border-radius:0}
.fm-sb .fm-sb-tab i{background:#253844}
.fm-sb .fm-sb-tab.fancy span{border-top-left-radius:calc(6 * var(--u))}
.fm-sb .fm-sb-tab.fancy.active span{background:linear-gradient(180deg,#0a8fa0,#008292)}
.fm-sb .fm-sb-tab.fancy.active i{background:#189596;clip-path:polygon(0 0,82% 0,100% 100%,0 100%);padding-right:calc(18 * var(--u))}
.fm-sb .fm-sb-tab.fancy:not(.active) i{display:none}
.fm-sb .fm-sb-tab.premium span{padding-right:calc(22 * var(--u));clip-path:polygon(calc(10 * var(--u)) 0,calc(100% - 12px) 0,100% 100%,0 100%);border-top-right-radius:calc(6 * var(--u));margin-left:calc(-6 * var(--u));padding-left:calc(18 * var(--u))}
.fm-sb .fm-sb-tab.premium.active span{background:linear-gradient(180deg,#ec6724,#e35610)}
.fm-sb-clock{display:flex;align-items:center;justify-content:center;width:calc(22 * var(--u));height:calc(22 * var(--u));border-radius:calc(4 * var(--u));background:#6bbd11}
.fm-sb-clock svg{width:calc(16 * var(--u));height:calc(16 * var(--u));fill:#fff}
.fm-new{position:absolute;right:calc(4 * var(--u));top:calc(-10 * var(--u));padding:calc(1 * var(--u)) calc(5 * var(--u));border-radius:calc(3 * var(--u));background:#d90928;color:#fff;font-size:calc(11 * var(--u));font-style:normal;font-weight:700;line-height:1.2}
.fm-new::after{content:'';position:absolute;left:calc(8 * var(--u));bottom:calc(-4 * var(--u));border:calc(4 * var(--u)) solid transparent;border-top-color:#d90928;border-bottom:0}
/* Filter bar: teal for Fancy, orange for Premium; white pill = active */
.fm-sb-filter.fancy{background:#087e8b;scrollbar-color:#055f69 transparent}
.fm-sb-filter{height:calc(36 * var(--u));gap:0;padding:0 calc(5 * var(--u))}
.fm-sb-filter button{height:calc(28 * var(--u));padding:0 calc(14 * var(--u));border-left-color:rgba(255,255,255,.3);font-size:calc(15 * var(--u));font-weight:400}
.fm-sb-filter.fancy button.active{color:#243a48}
.fm-sb-filter .fm-min{height:calc(24 * var(--u));margin-left:auto;border-radius:calc(4 * var(--u));font-size:calc(13 * var(--u))}
/* Fancy markets: white No / Yes header, light-blue title row with (i), white body row with the remark */
.fm-sb.fancy .fm-fancy-head{display:grid;grid-template-columns:60% 20% 20%;height:calc(32 * var(--u));border-bottom:1px solid #adc0c8;background:#fff}
.fm-sb.fancy .fm-fancy-head>b{font-size:calc(14 * var(--u));font-weight:400}
.fm-fancy-title{display:flex;align-items:center;justify-content:space-between;min-height:calc(32 * var(--u));padding:0 calc(6 * var(--u)) 0 calc(8 * var(--u));background:#e4eff8;border-bottom:1px solid #edf3f5;color:#1e1e1e;font-size:calc(14 * var(--u))}
.fm-fancy-title span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fm-fancy-i{flex:0 0 auto;display:flex;margin:0;padding:calc(2 * var(--u));border:0;background:none;color:#525d66;cursor:pointer}
.fm-fancy-i svg{width:calc(19 * var(--u));height:calc(19 * var(--u))}
.fm-fancy-limits{margin:0;padding:calc(4 * var(--u)) calc(8 * var(--u));background:#f0f6fb;color:#3b5160;font-size:calc(12 * var(--u))}
.fm-sb.fancy .fm-fancy-row{min-height:calc(48 * var(--u));border-bottom:1px solid #adc0c8;background:#fff}
.fm-sb.fancy .fm-fancy-remark{font-size:calc(12 * var(--u));font-weight:400;color:#1e1e1e;line-height:1.3}
.fm-sb.fancy .fm-fancy-row .odd.lay{background:#faa9ba}
.fm-sb.fancy .fm-fancy-row .odd.back{background:#72bbef}
.fm-sb.fancy .fm-fancy-row .odd b{font-size:calc(15 * var(--u));font-weight:400}
.fm-sb.fancy .fm-fancy-row .odd small{font-size:calc(11 * var(--u));color:#1e1e1e;opacity:.8}
.fm-sb.fancy .fm-row-suspended::after{background:rgba(20,30,45,.55)}
/* Fancy / Premium tab row (reference skyfair.biz): light page behind the tabs, the active tab's ⓘ block slanted,
   Premium alone = orange tab + ⓘ block + Min button at the right. */
.fm-sb .fm-sb-tabs{background:none;align-items:stretch}
.fm-sb .fm-sb-tabs.has-fancy .fm-sb-pin{margin-top:0;border-top-left-radius:calc(6 * var(--u))}
.fm-sb .fm-sb-tab.premium i{display:none}
.fm-sb .fm-sb-tab.premium.active i{display:flex;background:#f47f3a;clip-path:polygon(0 0,82% 0,100% 100%,0 100%);padding-right:calc(18 * var(--u))}
.fm-sb .fm-sb-tab.premium.active span{clip-path:polygon(calc(10 * var(--u)) 0,100% 0,100% 100%,0 100%);border-top-right-radius:0;padding-right:calc(10 * var(--u))}
.fm-sb .fm-sb-tabs:not(.has-fancy) .fm-sb-tab.premium span{clip-path:none;margin-left:0;padding-left:calc(10 * var(--u));border-top-left-radius:calc(6 * var(--u))}
.fm-sb .fm-sb-tabs:not(.has-fancy) .fm-sb-tab.premium:not(.active) span{clip-path:polygon(0 0,calc(100% - 12px) 0,100% 100%,0 100%)}
.fm-sb .fm-sb-tabs .fm-min{align-self:center;height:calc(26 * var(--u));margin:0 calc(6 * var(--u)) 0 auto;padding:0 calc(7 * var(--u));border-radius:calc(4 * var(--u));background:#bdd4d6;color:#1f3a3d;font-size:calc(15 * var(--u))}
.fm-sb .fm-sb-tabs .fm-min.on{background:#9fc0c3}
.fm-sb-filter button{font-weight:500}
.fm-sb-filter{scrollbar-width:none}.fm-sb-filter::-webkit-scrollbar{display:none}

/* ---------- Bet placing (reference skyfair.biz video): positions, Book, confirm, result bar ---------- */
/* Position under the runner name: profit green, loss red in brackets; hidden while the slip shows its projection. */
.fm-pos{display:block;margin-top:calc(2 * var(--u));color:#508d0e;font-size:calc(12 * var(--u));font-weight:400;line-height:1.2}
.fm-pos.loss{color:#d0021b}
.fm-row>strong:has(.fm-proj) .fm-pos{display:none}
.fm-placing .odd{filter:brightness(.78)}
/* Fancy row with a bet: worst case on the left, yellow Book button next to No. */
.fm-sb.fancy .fm-row>strong.fm-fancy-remark.has-book{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:calc(6 * var(--u));padding-right:calc(5 * var(--u))}
.fm-fancy-remark>span:empty{display:none}
.fm-fancy-pos{flex:0 0 auto;color:#508d0e;font-size:calc(12 * var(--u))}
.fm-fancy-pos.loss{color:#d0021b}
.fm-book-btn{flex:0 0 auto;margin:0 0 0 auto;padding:0 calc(7 * var(--u));height:calc(27 * var(--u));border:1px solid #cb8009;border-radius:calc(4 * var(--u));background:#ffcc2f;color:#1e1e1e;font-family:inherit;font-size:calc(13 * var(--u));cursor:pointer}
.fm-book-btn:active{background:#f5b800}
/* Balance bar: open exposure red in brackets. */
#wallet-exposure.neg{padding:0 calc(3 * var(--u));border-radius:calc(2 * var(--u));background:#d0021b;color:#fff}

/* "Please Confirm Your Bet" */
/* "Please Confirm Your Bet" = the reference's ConfirmBets dialog (values from its CSS): 70% black mask; box 11/12 of the
   width, 6px corners; 39px title bar #474747 > #070707 with bold 15px #ffb200 text; 41px bet line (50x32 side badge,
   bold 15px runner); Odds / Stake / Liability: 15px title over a bold 17px number, red #d0021b only for a loss
   (Liability); footer: 10px padding + #e0e6e6 line, Back (light) and Confirm (dark) 43px buttons, bold 15px. */
.fm-confirm{position:fixed;inset:0;z-index:140;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.7)}
.fm-confirm-box{display:flex;flex-direction:column;width:91.6667%;max-width:420px;max-height:94.6667%;margin:auto;color:#1e1e1e;font-family:Helvetica,Tahoma,sans-serif;text-align:center}
.fm-confirm-box h3{display:flex;align-items:center;height:calc(39 * var(--u));margin:0;padding-left:calc(10 * var(--u));border-radius:calc(6 * var(--u)) calc(6 * var(--u)) 0 0;background:linear-gradient(180deg,#474747,#070707);color:#ffb200;font-size:calc(15 * var(--u));font-weight:700;line-height:1;text-align:left}
.fm-confirm-sel{display:flex;align-items:center;height:calc(41 * var(--u));margin:0;padding:0 calc(7 * var(--u));border-bottom:1px solid #e0e6e6;background:#fff;font-size:calc(15 * var(--u));font-weight:700;line-height:1.3;text-align:left}
.fm-side{display:inline-flex;align-items:center;padding:calc(3 * var(--u)) calc(9 * var(--u));border-radius:calc(3 * var(--u));font-size:calc(14 * var(--u));line-height:1.3}
.fm-confirm-sel .fm-side{flex:0 0 auto;justify-content:center;width:calc(50 * var(--u));height:calc(32 * var(--u));margin-right:calc(7 * var(--u));padding:calc(4 * var(--u));border-radius:calc(4 * var(--u));font-size:calc(15 * var(--u));font-weight:400}
.fm-side.back{background:#72bbef}.fm-side.lay{background:#faa9ba}
.fm-confirm-box dl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:0;background:#fff;text-align:left}
.fm-confirm-box dl>div{padding:calc(7 * var(--u)) calc(10 * var(--u));border-right:1px solid #e0e6e6}
.fm-confirm-box dl>div:last-child{border-right:0}
.fm-confirm-box dt{color:#1e1e1e;font-size:calc(15 * var(--u));line-height:1.3}
.fm-confirm-box dd{margin:0;color:#1e1e1e;font-size:calc(17 * var(--u));font-weight:700;line-height:1.3}
.fm-confirm-box dd.risk{color:#d0021b}
.fm-confirm-actions{display:flex;gap:calc(10 * var(--u));padding:calc(10 * var(--u)) calc(20 * var(--u));border-top:1px solid #e0e6e6;border-radius:0 0 calc(6 * var(--u)) calc(6 * var(--u));background:#fff}
.fm-confirm-actions button{flex:1;height:calc(43 * var(--u));padding:0 calc(10 * var(--u));border-radius:calc(6 * var(--u));font-family:inherit;font-size:calc(15 * var(--u));font-weight:700;line-height:1.2;cursor:pointer}
.fm-confirm-back{border:1px solid rgba(0,0,0,.35);background:linear-gradient(0deg,#eee,#fff);color:#1e1e1e}
.fm-confirm-ok{border:1px solid #222;background:linear-gradient(180deg,#474747,#070707);color:#ffb200}

/* Result bar under the header: green "Bet Matched" / red "Bet Failed". */
.fm-result{position:fixed;left:0;right:0;z-index:125;display:flex;align-items:stretch;background:#7cc41a;color:#1e1e1e;box-shadow:0 2px 6px rgba(0,0,0,.25);animation:fmResultIn .2s ease-out}
.fm-result>div{flex:1;min-width:0;padding:calc(6 * var(--u)) calc(8 * var(--u)) calc(7 * var(--u))}
.fm-result b{display:block;font-size:calc(14 * var(--u));font-weight:400}
.fm-result p{display:flex;align-items:center;gap:calc(8 * var(--u));margin:calc(5 * var(--u)) 0 0;font-size:calc(14 * var(--u))}
.fm-result .fm-side{padding:calc(1 * var(--u)) calc(7 * var(--u));font-size:calc(13 * var(--u))}
.fm-result .fm-side.lay{background:#ececec}.fm-result .fm-side.back{background:#b7dbf6}
.fm-result>button{flex:0 0 calc(34 * var(--u));margin:0;padding:0;border:0;border-left:1px solid rgba(0,0,0,.12);background:none;color:#1e1e1e;font-size:calc(22 * var(--u));line-height:1;cursor:pointer}
.fm-result.failed{background:#d0021b;color:#fff}
.fm-result.failed>button{color:#fff;border-left-color:rgba(255,255,255,.3)}
.fm-result.failed .fm-side{display:none}
@keyframes fmResultIn{from{transform:translateY(-100%);opacity:0}to{transform:none;opacity:1}}

/* Fancy "Book Position" panel. */
.fm-bookpos{position:fixed;inset:0;z-index:140;background:rgba(0,0,0,.6)}
.fm-bookpos-panel{position:absolute;top:calc(40 * var(--u));left:calc(9 * var(--u));right:calc(9 * var(--u));bottom:calc(10 * var(--u));max-width:600px;margin:0 auto;overflow:auto;border-radius:calc(3 * var(--u)) calc(3 * var(--u)) 0 0;background:#fff}
.fm-bookpos-panel header{display:flex;align-items:stretch;background:linear-gradient(180deg,#2f2f2f,#000)}
.fm-bookpos-panel h3{flex:1;margin:0;padding:calc(11 * var(--u)) calc(10 * var(--u));color:#ffb80c;font-size:calc(15 * var(--u));font-weight:700}
.fm-bookpos-panel header button{flex:0 0 calc(34 * var(--u));margin:0;padding:0;border:0;border-left:1px solid rgba(255,184,12,.35);background:none;color:#ffb80c;font-size:calc(22 * var(--u));cursor:pointer}
.fm-bookpos-name{margin:0;padding:calc(10 * var(--u));background:#000;color:#fff;font-size:calc(14 * var(--u))}
.fm-bookpos-panel table{width:100%;border-collapse:collapse;font-size:calc(14 * var(--u))}
.fm-bookpos-panel th{padding:calc(10 * var(--u)) calc(7 * var(--u));background:#d7e1e4;color:#1e1e1e;font-weight:400;text-align:left}
.fm-bookpos-panel td{padding:calc(11 * var(--u)) calc(7 * var(--u));border-bottom:1px solid #fff}
.fm-bookpos-panel th:first-child,.fm-bookpos-panel td:first-child{width:33%;border-right:1px solid #fff}
.fm-bookpos-panel tr.loss td{background:#fcd6dd}.fm-bookpos-panel tr.loss td:last-child{color:#d0021b}
.fm-bookpos-panel tr.win td{background:#d0e3f3}

/* "VIRTUAL CRICKET LIVE" banner (reference Advertise.vue: full-width image, 20px below): after the Cricket group on
   In-Play, under the Cricket list on Sports. Desktop: inside the list column, not stretched. */
.vc-banner{display:block;margin-bottom:calc(20 * var(--u));line-height:0}
.vc-banner img{display:block;width:100%;height:auto}
@media(min-width:701px){.vc-banner{display:none}} /* desktop: the reference has no banner, Virtual Cricket is in the top menu */

/* ===== Match page: every value below is the reference's computed style (skyfair.biz fullMarket at 375px, 1u = 1px) ===== */
/* Title bar: 25u pin in a 35u block, 1px divider, 13u bold sport name, "In Play" 13u */
.event-page.fm .fm-title{height:calc(34 * var(--u));padding:0 calc(5 * var(--u)) 0 0;background:linear-gradient(180deg,#2c485a,#263d4c)}
.event-page.fm .fm-title .fm-pin{width:calc(36 * var(--u));border-right:1px solid #5b7382}
.event-page.fm .fm-title .fm-pin svg{width:calc(25 * var(--u));height:calc(25 * var(--u));padding:calc(3.5 * var(--u));background:#223039;fill:#c5d0d7}
.event-page.fm .fm-title .fm-pin.pinned svg{background:#ffb200;fill:#fff}
.event-page.fm .fm-title>b{margin-left:calc(5 * var(--u));font-size:calc(13 * var(--u));line-height:1.3}
.event-page.fm .fm-status{gap:calc(3 * var(--u));font-size:calc(13 * var(--u));line-height:1}
.event-page.fm .fm-clock{width:calc(15 * var(--u));height:calc(15 * var(--u))}
/* Exchange market tabs: 49u strip, 37u pills */
.event-page.fm .fm-pills[hidden]{display:none}
.event-page.fm .fm-pills{gap:calc(5 * var(--u));height:calc(49 * var(--u));padding:calc(6 * var(--u));background:#e0e6e6}
.event-page.fm .fm-pills button{height:calc(37 * var(--u));padding:0 calc(10 * var(--u));border:1px solid rgba(36,58,72,.3);border-radius:calc(20 * var(--u));background:#243a48;font-size:calc(13 * var(--u));line-height:1.2}
.event-page.fm .fm-pills button.active{border-color:rgba(0,0,0,.3);background:linear-gradient(180deg,#474747,#070707);color:#ffb200}
/* Match Odds: Matched row, Back / Lay, 49u runner rows with bold names */
.event-page.fm .fm-mo-head{grid-template-columns:60% 20% 20%;align-items:end;min-height:calc(37.4 * var(--u));padding:0;border-bottom:1px solid #7e97a7}
.event-page.fm .fm-matched{gap:calc(5 * var(--u));padding:calc(5 * var(--u)) calc(3 * var(--u)) calc(5 * var(--u)) calc(5 * var(--u));align-self:center}
.event-page.fm .fm-matched svg{width:calc(25 * var(--u));height:calc(25 * var(--u));fill:#7e97a7;color:#7e97a7}
.event-page.fm .fm-matched span{color:#1e1e1e;font-size:calc(11 * var(--u));line-height:1.2}
.event-page.fm .fm-matched b{color:#1e1e1e;font-size:calc(11 * var(--u));font-weight:700}
.event-page.fm .fm-mo-head>b{padding:calc(5 * var(--u)) 0;color:#1e1e1e;font-size:calc(13 * var(--u));font-weight:700;line-height:1}
.event-page.fm .fm-mo .fm-row{grid-template-columns:calc(60% - 1px) 1fr 1fr;column-gap:1px;min-height:calc(49 * var(--u));border-bottom-color:#7e97a7}
.event-page.fm .fm-mo .fm-row>strong{padding:calc(3 * var(--u)) calc(5 * var(--u));color:#1e1e1e;font-size:calc(15 * var(--u));font-weight:700;line-height:1.3}
.event-page.fm .fm-mo .odd{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(3 * var(--u));border-left:0;padding:calc(6 * var(--u)) 0}
.event-page.fm .fm-mo .odd b{padding-bottom:calc(2 * var(--u));font-size:calc(13 * var(--u));font-weight:700;line-height:1}
.event-page.fm .fm-mo .odd small{color:#1e1e1e;font-size:calc(11 * var(--u));line-height:1;opacity:1}
.event-page.fm .fm-row-suspended::after{background:rgba(0,0,0,.45);font-size:calc(13 * var(--u));line-height:1.5}
/* Bookmaker: 34u bar with an outlined pin, 30u "Bookmaker" line, 26u Back / Lay line, 49u rows, 74u price cells */
.event-page.fm .fm-bm .fm-bar{height:calc(34 * var(--u));min-height:0;gap:0;padding:0 0 0 calc(2.5 * var(--u));background:#3b5160}
.event-page.fm .fm-bm .fm-bar-pin{margin-right:calc(7.5 * var(--u))}
.event-page.fm .fm-bm .fm-bar-pin svg{width:calc(25 * var(--u));height:calc(25 * var(--u));padding:calc(2.5 * var(--u));border:1px solid #7e97a7;background:none;fill:#7e97a7}
.event-page.fm .fm-bm .fm-bar>b{margin-right:calc(5 * var(--u));font-size:calc(13 * var(--u));font-weight:700;line-height:1.5}
.event-page.fm .fm-bm .fm-bar>em{padding-left:0;border-left:0;color:#bbb;font-size:calc(13 * var(--u));line-height:1.5}
.event-page.fm .fm-bm .fm-bar>em::before{content:"|";margin-right:calc(5 * var(--u));font-size:calc(16 * var(--u));line-height:1}
.event-page.fm .fm-bm-sub{height:calc(30 * var(--u));background:#e4f1f9;color:#1e1e1e;font-weight:700;line-height:1.5}
.event-page.fm .fm-bm-sub svg{width:calc(13 * var(--u));height:calc(13 * var(--u));fill:#1e1e1e;color:#1e1e1e}
.event-page.fm .fm-bm-head{grid-template-columns:1fr calc(74 * var(--u)) calc(74 * var(--u));height:calc(26 * var(--u));background:#f8f6e1;border-bottom:1px solid #7e97a7}
.event-page.fm .fm-bm-head>b{font-weight:700;line-height:1.5}
.event-page.fm .fm-bm-row{grid-template-columns:1fr calc(74 * var(--u)) calc(74 * var(--u));min-height:calc(49 * var(--u));background:#f8f6e1;border-bottom-color:#7e97a7}
.event-page.fm .fm-bm .fm-row>strong{padding:calc(3 * var(--u)) calc(8 * var(--u));color:#1e1e1e;font-weight:700;line-height:1}
.event-page.fm .fm-bm .odd{padding:calc(4 * var(--u)) calc(5 * var(--u))}
.event-page.fm .fm-bm .odd.back{background:#b2d4e8}.event-page.fm .fm-bm .odd.lay{background:#f0c0cb}
.event-page.fm .fm-bm .odd.back b{background:#72bbef}.event-page.fm .fm-bm .odd.lay b{background:#faa9ba}
.event-page.fm .fm-bm .fm-row-suspended::after{left:auto;width:calc(148 * var(--u));background:rgba(0,0,0,.45)}
/* Premium: bold titles and names, the reference's + / - glyph, Min button 49 x 24u, "no market" line */
.event-page.fm .fm-min{align-self:flex-start;gap:calc(5 * var(--u));height:calc(24 * var(--u));margin:0 calc(5 * var(--u)) 0 auto;padding:calc(3 * var(--u)) calc(5 * var(--u));border-radius:calc(4 * var(--u));background:#bed5d8;color:#243a48;font-size:calc(13 * var(--u));line-height:1.2}
.event-page.fm .fm-min svg{width:calc(13 * var(--u));height:calc(13 * var(--u));fill:#3b5160;color:#3b5160}
.event-page.fm .fm-pm .fm-bar{background:#3b5160}
.event-page.fm .fm-pm .fm-bar-pin svg{fill:#c5d0d7}
.event-page.fm .fm-pm .fm-bar>b{font-weight:700}
.event-page.fm .fm-pm .fm-fold{display:flex;width:calc(14 * var(--u));height:calc(14 * var(--u));border:0;border-radius:0}
.event-page.fm .fm-pm .fm-fold svg{width:100%;height:100%;fill:#fff}
.event-page.fm .fm-pm-row>strong{font-weight:700}
.event-page.fm .fm-pm .odd{border-left:0}
.event-page.fm .fm-empty{padding:calc(7 * var(--u)) calc(10 * var(--u));border-bottom:1px solid #7e97a7;color:#1e1e1e;font-size:calc(13 * var(--u));line-height:1.3}
/* Scoreboard = the reference's Sportradar widget. It is not scaled with the screen (fixed px, Roboto):
   57px score block (13px status tag, 14px team names, 12px score, 10px comment), 100px run-rate panel, 20px footer. */
.event-page.fm .fm-score{padding:0 0 20px;font-family:Roboto,Helvetica,Arial,sans-serif}
.event-page.fm .fm-score.collapsed{padding-bottom:20px}
.event-page.fm .fm-scb{height:57px;border-bottom:1px solid #1a1a1a;overflow:hidden}
.event-page.fm .fm-score-status{display:table;height:13px;margin:0 auto;padding:1px 4px 0;border:1px solid #1a1a1a;border-top:0;border-radius:0 0 2px 2px;background:#1d1d1d;color:rgba(255,255,255,.7);font-size:10px;font-weight:400;line-height:11px;text-transform:uppercase}
.event-page.fm .fm-teams{margin-top:7px;padding:0 12px;font-size:14px;font-weight:500;line-height:16px}
.event-page.fm .fm-teams span{min-width:0;max-width:calc(50% - 6px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.event-page.fm .fm-scb:has(.fm-score-line) .fm-teams{margin-top:0}
.event-page.fm .fm-score-line{margin:-1px 0 0;color:#fff;font-size:12px;font-weight:500;line-height:14px;word-spacing:normal}
.event-page.fm .fm-score-line b,.event-page.fm .fm-ytb{color:#fff;font-size:inherit;font-weight:500}
.event-page.fm .fm-score-desc{margin:-1px 0 0;padding:0 12px;color:#fff;font-size:10px;line-height:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.event-page.fm .fm-score-desc:empty{display:none}
.event-page.fm .fm-rr{position:relative;height:100px;margin:0;border-top:0}
.event-page.fm .fm-rr-head{position:absolute;top:0;left:0;right:0;height:16px}
.event-page.fm .fm-rr-head>b{left:16px;top:2px;font-size:10px;font-weight:700;line-height:11px}
.event-page.fm .fm-rr-inns select{height:16px;max-width:262px;padding:2px 18px 2px 4px;border:1px solid #1a1a1a;border-top:0;border-radius:0 0 2px 2px;background-color:transparent;background-position:right 4px center;background-size:6px;font-family:inherit;font-size:10px;line-height:11px}
.event-page.fm .fm-rr-body{position:absolute;top:16px;left:0;right:32px;height:84px;margin:0}
.event-page.fm .fm-rr-chart{width:100%;height:84px}
.event-page.fm .fm-rr-chart .fm-rr-tick{font-size:10px}
.event-page.fm .fm-rr-switch{position:absolute;top:-16px;right:-32px;bottom:0;width:32px;border-left:0}
.event-page.fm .fm-rr-switch button{margin:0;border-left:1px solid #1a1a1a;color:#ccc}
.event-page.fm .fm-rr-switch button+button{border-top:1px solid #1a1a1a}
.event-page.fm .fm-rr-switch button.active{border-left-color:transparent;background:linear-gradient(#ffb80c,#ffb80c) left 2px/1px 45.5px no-repeat;color:#ffb80c}
.event-page.fm .fm-rr-switch svg{width:12px;height:12px}
.event-page.fm .fm-score-toggle{height:20px}
.event-page.fm .fm-score-toggle svg{width:12px;height:20px;fill:#ffb80c}
/* (i) on the Premium / Fancy tabs and titles: the reference glyph, white on the coloured tab */
.event-page.fm .fm-sb-tab i svg{width:calc(15 * var(--u));height:calc(15 * var(--u));fill:#fff}
/* Run-rate panel before play: dim innings box, larger footer arrow (reference widget) */
.event-page.fm .fm-rr.empty select{color:rgba(255,255,255,.38);opacity:1}
.event-page.fm .fm-score-toggle svg{width:24px;height:24px}
/* Bookmaker price 13u bold */
.event-page.fm .fm-bm .odd b{font-size:calc(13 * var(--u));font-weight:700}
/* Selected price (reference): darker cell, inner shadow, white text */
.event-page.fm .fm-market .odd.selected{outline:0;box-shadow:inset 0 2px 5px rgba(0,0,0,.5);color:#fff}
.event-page.fm .fm-market .odd.selected b,.event-page.fm .fm-market .odd.selected small{color:#fff}
.event-page.fm .fm-mo .odd.back.selected,.event-page.fm .fm-fancy-row .odd.back.selected{background:#1a8ee1}
.event-page.fm .fm-mo .odd.lay.selected,.event-page.fm .fm-fancy-row .odd.lay.selected{background:#f4496d}
.event-page.fm .fm-pm .odd.selected{background:#16a660}
.event-page.fm .fm-bm .odd.selected{box-shadow:none}
.event-page.fm .fm-bm .odd.back.selected b{background:#1a8ee1;box-shadow:inset 0 4px 4px rgba(0,0,0,.25)}
.event-page.fm .fm-bm .odd.lay.selected b{background:#f4496d;box-shadow:inset 0 4px 4px rgba(0,0,0,.25)}
/* Profit / loss line under a runner name */
.event-page.fm .fm-proj{gap:calc(3 * var(--u));margin-top:calc(5 * var(--u));line-height:1.2}
.event-page.fm .fm-proj svg{width:calc(10 * var(--u));height:calc(10 * var(--u))}
.event-page.fm .fm-mo .fm-proj{font-weight:700}
/* Bet slip (reference): #dceaf4 back, #f2e5e8 lay, #d3edd0 Premium; 173 x 40u boxes, 31u quick stakes, 40u keys, 43u buttons */
#bet-slip.fm-slip{--slip-bg:#dceaf4;border-top:0;border-bottom:1px solid #7e97a7;background:var(--slip-bg)}
#bet-slip.fm-slip.lay{--slip-bg:#f2e5e8}
#bet-slip.fm-slip.type-premium{--slip-bg:#d3edd0}
#bet-slip .fm-slip-min{grid-template-columns:calc(173 * var(--u)) calc(173 * var(--u));justify-content:space-between;gap:0;height:auto;padding:calc(12 * var(--u)) calc(10 * var(--u)) 0;color:#1e1e1e;font-size:calc(11 * var(--u));line-height:1.5}
#bet-slip .fm-slip-inputs{grid-template-columns:calc(173 * var(--u)) calc(173 * var(--u));justify-content:space-between;gap:0;margin-bottom:calc(12 * var(--u))}
#bet-slip .fm-slip-odds{height:calc(40 * var(--u));border:1px solid #bbb;color:#999;line-height:1.5}
#bet-slip .fm-slip-stake{height:calc(40 * var(--u));border:0;border-radius:0;overflow:visible;background:none}
#bet-slip .fm-step{flex:0 0 calc(40 * var(--u));border:1px solid #bbb;background:linear-gradient(180deg,#fff,#eee)}
#bet-slip .fm-step:first-child{border-radius:calc(5 * var(--u)) 0 0 calc(5 * var(--u))}
#bet-slip .fm-step:last-child{border-radius:0 calc(5 * var(--u)) calc(5 * var(--u)) 0}
#bet-slip .fm-slip-stake input{border:1px solid #bbb;background:#feeec7;box-shadow:inset 0 4px 4px rgba(0,0,0,.1);caret-color:#1f72ac}
#bet-slip .fm-slip-quick{height:calc(31 * var(--u));margin:0 0 calc(7 * var(--u));border-top:0;background:linear-gradient(180deg,#32617f,#21465d)}
#bet-slip .fm-slip-quick button{height:100%;border-left:0;border-right:1px solid rgba(255,255,255,.15);border-radius:0;font-weight:400;line-height:1}
#bet-slip .fm-slip-quick button:last-child{border-right:0}
#bet-slip .fm-slip-keys{grid-template-columns:repeat(6,calc(53.5 * var(--u))) 1fr;grid-template-rows:repeat(2,calc(40 * var(--u)));margin-top:0;border-top:1px solid #bbb}
#bet-slip .fm-slip-keys button{border-right:1px solid #bbb;border-bottom:1px solid #bbb;color:#1e1e1e;font-size:calc(15 * var(--u))}
#bet-slip .fm-slip-keys .fm-slip-back{border-right:0}
#bet-slip .fm-slip-back svg{width:calc(18 * var(--u));height:calc(18 * var(--u));fill:#1e1e1e;color:#1e1e1e}
#bet-slip .fm-slip-actions{gap:calc(8 * var(--u));padding:calc(10 * var(--u))}
#bet-slip .fm-slip-actions button{height:calc(43 * var(--u));border-radius:calc(6 * var(--u))}
#bet-slip .fm-slip-cancel{border:1px solid rgba(0,0,0,.35);background:linear-gradient(0deg,#eee,#fff);color:#1e1e1e}
#bet-slip .fm-slip-place:disabled{border-color:rgba(171,171,171,.4);background:rgba(222,222,222,.4);color:rgba(153,153,153,.4)}
#bet-slip .fm-slip-foot{height:auto;padding:calc(5.5 * var(--u)) calc(8 * var(--u));background:rgba(0,0,0,.05)}
#bet-slip .fm-slip-accept{gap:calc(6 * var(--u));color:#1e1e1e;line-height:1.5}
#bet-slip .fm-slip-accept input{border:0;box-shadow:inset 0 2px 0 rgba(0,0,0,.25)}
#bet-slip .fm-slip-accept input:checked{background:#ffb500}
#bet-slip .fm-slip-max{height:auto;min-width:0;margin-right:calc(4 * var(--u));padding:calc(3 * var(--u)) calc(8 * var(--u));background:rgba(0,0,0,.1);color:#1e1e1e;font-weight:700;line-height:1}

/* ===== Sports / In-Play lists: the last differences from the reference's computed styles ===== */
.inplay-tabs{height:calc(48.2 * var(--u))}
.inplay-tabs nav{height:calc(35 * var(--u));border-radius:calc(5 * var(--u))}
.inplay-page .match-list .list-title{background:linear-gradient(180deg,#2c485a,#263d4c)}
.sport-strip .strip-search{border-left:1px solid #757575}
@media(max-width:700px){
    .strip-tab .sport-icon{width:calc(23 * var(--u));height:calc(23 * var(--u))}
    .sport-strip .strip-search svg{width:calc(21 * var(--u));height:calc(21 * var(--u));fill:#fff}
    .inplay-tabs .strip-search svg{width:calc(26 * var(--u));height:calc(26 * var(--u));fill:#fff}
}

/* Fancy Bet (reference computed styles at 375px): 28u No / Yes line, 30u market title (13u bold #3a4b52), 49u rows,
   74u cells with a 1px gap, 13u bold run line over an 11u rate */
#markets .fm-sb-tabs .fm-new{display:flex;align-items:center;justify-content:center;width:calc(37 * var(--u));height:calc(17 * var(--u));padding:0;font-size:calc(11 * var(--u));line-height:1}
.event-page.fm .fm-sb.fancy .fm-fancy-head{grid-template-columns:1fr calc(74 * var(--u)) calc(74 * var(--u));column-gap:1px;align-items:center;height:calc(28 * var(--u));border-bottom:1px solid #7e97a7}
.event-page.fm .fm-sb.fancy .fm-fancy-head>b{padding:calc(3 * var(--u));font-size:calc(13 * var(--u));font-weight:700;line-height:1}
.event-page.fm .fm-fancy-title{height:calc(30 * var(--u));min-height:0;padding:0 0 0 calc(5 * var(--u));border-bottom:0;background:#e4f1f9}
.event-page.fm .fm-fancy-title span{color:#3a4b52;font-size:calc(13 * var(--u));font-weight:700;line-height:1.2}
.event-page.fm .fm-fancy-i{align-items:center;justify-content:center;width:calc(30 * var(--u));height:calc(30 * var(--u));padding:calc(7.5 * var(--u));color:#3b5160}
.event-page.fm .fm-fancy-i svg{width:calc(15 * var(--u));height:calc(15 * var(--u));fill:#3b5160}
.event-page.fm .fm-sb.fancy .fm-fancy-row{grid-template-columns:1fr calc(74 * var(--u)) calc(74 * var(--u));column-gap:1px;min-height:calc(49 * var(--u));border-bottom:1px solid #7e97a7}
.event-page.fm .fm-sb.fancy .fm-fancy-remark{padding:calc(3 * var(--u)) calc(5 * var(--u))}
.event-page.fm .fm-sb.fancy .fm-fancy-row .odd{border-left:0}
.event-page.fm .fm-sb.fancy .fm-fancy-row .odd b{color:#1e1e1e;font-size:calc(13 * var(--u));font-weight:700;line-height:1.2}
.event-page.fm .fm-sb.fancy .fm-fancy-row .odd small{color:#1e1e1e;font-size:calc(11 * var(--u));line-height:1.2;opacity:1}
.event-page.fm .fm-sb.fancy .fm-fancy-row .odd.selected b,.event-page.fm .fm-sb.fancy .fm-fancy-row .odd.selected small{color:#fff}
.event-page.fm .fm-sb.fancy .fm-row-suspended::after{left:auto;width:calc(149 * var(--u))}
/* Bottom menu label: 5u side padding like the reference (so "Multi Markets" shortens at the same place); smaller New badge */
.mobile-nav .nav-item span{padding-left:calc(3 * var(--u));padding-right:calc(3 * var(--u))}
#markets .fm-sb-tabs .fm-new{width:calc(33 * var(--u));height:calc(15 * var(--u));font-size:calc(10 * var(--u))}
/* Suspended row: no prices under the "Suspend" cover (reference) */
.event-page.fm .fm-row-suspended:not(.fm-bm-row) .odd>*{visibility:hidden}
.event-page.fm .fm-bm-row.fm-row-suspended .odd b{color:transparent}
/* Fancy Bet Min / Max box (reference): opens from the (i) button over the right end of the market, 5u from the edge;
   10u grey label, 13u value, 25u close square behind a 1px divider. */
.event-page.fm .fm-fancy{position:relative}
.event-page.fm .fm-fancy-mm{position:absolute;top:0;right:calc(5 * var(--u));z-index:3;padding:calc(7 * var(--u)) calc(30 * var(--u)) calc(7 * var(--u)) calc(5 * var(--u));border-radius:calc(5 * var(--u));background:#fff;box-shadow:0 4px 4px rgba(0,0,0,.25)}
.event-page.fm .fm-fancy-mm::before{content:'';position:absolute;top:0;bottom:0;right:calc(25 * var(--u));width:1px;background:#e0e6e6}
.event-page.fm .fm-fancy-mm p{margin:0 0 calc(3 * var(--u));color:#7e97a7;font-size:calc(10 * var(--u));font-weight:400;line-height:1.2}
.event-page.fm .fm-fancy-mm b{display:block;color:#1e1e1e;font-size:calc(13 * var(--u));font-weight:400;line-height:1.2;white-space:nowrap}
.event-page.fm .fm-fancy-mm button{position:absolute;top:0;right:0;display:flex;align-items:center;justify-content:center;width:calc(25 * var(--u));height:calc(25 * var(--u));margin:0;padding:0;border:0;background:none;cursor:pointer}
.event-page.fm .fm-fancy-mm button svg{width:calc(9 * var(--u));height:calc(9 * var(--u));fill:#4d4d4d}

/* ===== Info pop-ups of the match page (reference computed styles at 375px) ===== */
/* Bookmaker (i): Min / Max box over the right end of the "Bookmaker" line: 40u high, 11u bold #577c94 label, 13u value */
.event-page.fm .fm-bm-sub{position:relative}
.event-page.fm .fm-bm-i{display:flex;margin:0;padding:0;border:0;background:none;cursor:pointer}
.event-page.fm .fm-mm-box{position:absolute;top:0;right:calc(5 * var(--u));z-index:3;height:calc(40 * var(--u));padding:calc(4 * var(--u)) calc(30 * var(--u)) calc(4 * var(--u)) calc(5 * var(--u));border-radius:calc(5 * var(--u));background:#fff;box-shadow:0 4px 4px rgba(0,0,0,.25);font-weight:400}
.event-page.fm .fm-mm-box::before{content:'';position:absolute;top:0;bottom:0;right:calc(25 * var(--u));width:1px;background:#e0e6e6}
.event-page.fm .fm-mm-box p{margin:0 0 calc(3 * var(--u));color:#577c94;font-size:calc(11 * var(--u));font-weight:700;line-height:1.2}
.event-page.fm .fm-mm-box b{display:block;color:#1e1e1e;font-size:calc(13 * var(--u));font-weight:400;line-height:1.2;white-space:nowrap}
.event-page.fm .fm-mm-box button,.event-page.fm .fm-min-pop button{position:absolute;top:0;right:0;display:flex;align-items:center;justify-content:center;width:calc(25 * var(--u));height:calc(25 * var(--u));margin:0;padding:0;border:0;background:none;cursor:pointer}
.event-page.fm .fm-mm-box button svg{width:calc(9 * var(--u));height:calc(9 * var(--u));fill:#4d4d4d}
/* Premium Min: 42u box in the place of the Min button: 10u #577c94 label, 13u value, close on the right */
.event-page.fm .fm-min .dk-min-value{display:none}
.event-page.fm .fm-min-pop{position:absolute;top:0;right:calc(5 * var(--u));z-index:3;display:flex;align-items:center;height:calc(42 * var(--u));padding-right:calc(25 * var(--u));border-radius:calc(5 * var(--u));background:#fff;box-shadow:0 6px 10px rgba(0,0,0,.7)}
.event-page.fm .fm-min-pop p{display:flex;flex-direction:column;justify-content:space-between;height:100%;margin:0;padding:calc(5 * var(--u));border-right:1px solid #e0e6e6}
.event-page.fm .fm-min-pop small{margin-bottom:calc(3 * var(--u));color:#577c94;font-size:calc(10 * var(--u));line-height:1.2}
.event-page.fm .fm-min-pop b{color:#1e1e1e;font-size:calc(13 * var(--u));font-weight:400;line-height:1.2}
.event-page.fm .fm-min-pop button svg{width:calc(9 * var(--u));height:calc(9 * var(--u));fill:#1e1e1e}
/* The (i) of the open Fancy Bet / Premium tab opens the rules */
.event-page.fm .fm-sb-tab.active>i{cursor:pointer}

/* Rules dialog: 70% black cover; box 11/12 of the screen wide, at most 94.67% high; 39u dark bar with a 15u gold title
   and close button; white body; 64u footer with the 170 x 43u OK button */
.fm-rules{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.7);font-family:var(--font-mobile)}
.fm-rules-box{display:flex;flex-direction:column;width:91.6667%;max-width:460px;max-height:94.6667%;margin:auto}
.fm-rules-box h3{flex:0 0 auto;display:flex;align-items:center;height:calc(39 * var(--u));margin:0;padding:0 0 0 calc(10 * var(--u));border-radius:calc(6 * var(--u)) calc(6 * var(--u)) 0 0;background:linear-gradient(180deg,#474747,#070707)}
.fm-rules-box h3 span{flex:1 1 0%;display:flex;align-items:center;height:100%;border-right:1px solid rgba(255,178,0,.3);color:#ffb200;font-size:calc(15 * var(--u));font-weight:700;line-height:1.2}
.fm-rules-box h3 button{display:flex;align-items:center;justify-content:center;height:100%;margin:0;padding:0 calc(13 * var(--u));border:0;background:none;cursor:pointer}
.fm-rules-box h3 svg{width:calc(9 * var(--u));height:calc(9 * var(--u));fill:#ffb200}
.fm-rules-body{flex:1 1 auto;min-height:0;overflow-y:auto;background:#fff;color:#1e1e1e;font-size:calc(15 * var(--u))}
.fm-rules-body ol{margin:0 0 0 calc(20 * var(--u));padding:calc(20 * var(--u));list-style:decimal;overflow-wrap:break-word}
.fm-rules-body li,.fm-rules-body ul{margin:0 0 calc(4 * var(--u));padding:0;color:#1e1e1e;font-size:calc(14 * var(--u));line-height:1.2}
.fm-rules-body ul{list-style:none;line-height:1.5}
.fm-rules-file{display:flex;align-items:center;padding:calc(5 * var(--u)) 0}
.fm-rules-file i{flex:0 0 auto;display:flex;margin:0 calc(10 * var(--u))}
.fm-rules-file i svg{width:calc(29 * var(--u));height:calc(29 * var(--u));fill:#1e1e1e}
.fm-rules-file a{flex:1 1 0%;color:#327ec2;font-size:calc(14 * var(--u));font-weight:700;line-height:1.3;text-decoration:none}
.fm-rules-file a.fm-rules-dl{flex:0 0 auto;display:flex;align-items:center;min-height:calc(39.5 * var(--u));padding:calc(6 * var(--u)) calc(10 * var(--u))}
.fm-rules-file .fm-rules-dl svg{width:calc(22 * var(--u));height:calc(22 * var(--u));fill:#1e1e1e}
.fm-rules-box footer{flex:0 0 auto;display:flex;justify-content:center;padding:calc(10 * var(--u));border-top:1px solid #e0e6e6;border-radius:0 0 calc(6 * var(--u)) calc(6 * var(--u));background:#fff}
.fm-rules-box footer button{width:calc(170 * var(--u));height:calc(43 * var(--u));margin:0;padding:0 calc(10 * var(--u));border:1px solid rgba(0,0,0,.35);border-radius:calc(6 * var(--u));background:linear-gradient(0deg,#eee,#fff);color:#1e1e1e;font-family:inherit;font-size:calc(15 * var(--u));font-weight:700;cursor:pointer}

/* ---------- Unmatched bets (reference skyfair.biz): exchange odds box in the slip, "!" on Bets, Open Bets Unmatched ---------- */
/* Slip: Match Odds gets an odds box with - / + like the stake; the box being typed in is cream, the other white. */
#bet-slip.type-match .fm-slip-odds,#bet-slip:not(.type-match) .fm-slip-oddin{display:none}
#bet-slip .fm-slip-stake input{background:#fff}
#bet-slip .fm-slip-stake.on input{background:#feeec7}
/* Bets button: red round "!" at its top right while the player has unmatched bets. */
.balance-bar .bets-btn{position:relative;overflow:visible}
.balance-bar .bets-alert{position:absolute;top:calc(-6 * var(--u));right:calc(-6 * var(--u));z-index:1;display:flex;align-items:center;justify-content:center;width:calc(18 * var(--u));height:calc(18 * var(--u));border:1px solid #fff;border-radius:50%;background:#d0021b;color:#fff;font-size:calc(12 * var(--u));font-style:normal;font-weight:700;line-height:1}
.balance-bar .bets-alert[hidden]{display:none}
/* Result bar "Bet Unmatched": red, with the side badge. */
.fm-result.failed.um .fm-side{display:inline-block;color:#1e1e1e}
/* Open Bets: red dot of a market with unmatched bets, Unmatched header with Cancel All, pencil / bin per bet, editor. */
.open-bets-pop .ob-um-dot{flex:0 0 auto;width:calc(9 * var(--u));height:calc(9 * var(--u));border-radius:50%;background:#d0021b}
.open-bets-pop .ob-status.um h4{justify-content:space-between;padding-right:calc(4 * var(--u))}
.open-bets-pop .ob-cancel-all{display:flex;align-items:center;gap:calc(3 * var(--u));height:calc(32 * var(--u));margin:0;padding:0 calc(7 * var(--u));border:0;border-radius:calc(4 * var(--u));background:#d0021b;color:#fff;font-family:inherit;font-size:calc(13 * var(--u));font-weight:400;cursor:pointer}
.open-bets-pop .ob-cancel-all svg{width:calc(16 * var(--u));height:calc(16 * var(--u));fill:#fff}
.open-bets-pop .ob-table.um{--ob-cols:1fr calc(56 * var(--u)) calc(66 * var(--u)) calc(64 * var(--u)) calc(34 * var(--u))}
.open-bets-pop .ob-table.um.wide{--ob-cols:1fr calc(50 * var(--u)) calc(56 * var(--u)) calc(74 * var(--u)) calc(34 * var(--u))}
.open-bets-pop .ob-table.um .ob-thead::after{content:''}
.open-bets-pop .ob-table.um .ob-row>span:nth-last-of-type(1){text-align:right}
.open-bets-pop .ob-pencil{flex:0 0 auto;display:flex;align-items:center;justify-content:center;width:calc(32 * var(--u));height:calc(32 * var(--u));margin:0;padding:0;border:1px solid #79a8cc;border-radius:calc(4 * var(--u));background:#e9f3fb;cursor:pointer}
.open-bets-pop .ob-row.lay .ob-pencil{border-color:#d9a0ae;background:#fbeef1}
.open-bets-pop .ob-pencil svg{width:calc(18 * var(--u));height:calc(18 * var(--u));fill:#1f72ac}
.open-bets-pop .ob-name{white-space:normal;line-height:1.2}
.open-bets-pop .ob-bin{justify-self:end;display:flex;align-items:center;justify-content:center;width:calc(30 * var(--u));height:calc(30 * var(--u));margin:0;padding:0;border:0;border-radius:calc(4 * var(--u));background:#d0021b;cursor:pointer}
.open-bets-pop .ob-bin svg{width:calc(18 * var(--u));height:calc(18 * var(--u));fill:#fff}
.open-bets-pop .ob-edit{padding:calc(10 * var(--u)) calc(8 * var(--u));border-bottom:1px solid #fff;background:#dceaf4}
.open-bets-pop .ob-edit.lay{background:#f2e5e8}
.open-bets-pop .ob-edit-inputs{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:calc(10 * var(--u))}
.open-bets-pop .ob-edit-inputs label{min-width:0;display:flex;flex-direction:column;gap:calc(3 * var(--u));font-size:calc(11 * var(--u));color:#1e1e1e}
.open-bets-pop .ob-edit-box{display:flex;height:calc(36 * var(--u))}
.open-bets-pop .ob-edit-box .fm-step{flex:0 0 calc(34 * var(--u));border:1px solid #bbb;background:linear-gradient(180deg,#fff,#eee);color:#1f72ac;font-size:calc(20 * var(--u));font-weight:700}
.open-bets-pop .ob-edit-box .fm-step:first-child{border-radius:calc(5 * var(--u)) 0 0 calc(5 * var(--u))}
.open-bets-pop .ob-edit-box .fm-step:last-child{border-radius:0 calc(5 * var(--u)) calc(5 * var(--u)) 0}
.open-bets-pop .ob-edit-box input{flex:1 1 0%;min-width:0;margin:0;padding:0 calc(4 * var(--u));border:1px solid #bbb;border-left:0;border-right:0;border-radius:0;background:#feeec7;color:#1e1e1e;font-family:inherit;font-size:calc(15 * var(--u));font-weight:700;text-align:center;outline:0}
.open-bets-pop .ob-edit-actions{display:grid;grid-template-columns:1fr 1fr;gap:calc(8 * var(--u));margin-top:calc(10 * var(--u))}
.open-bets-pop .ob-edit-actions button{height:calc(38 * var(--u));margin:0;border-radius:calc(6 * var(--u));font-family:inherit;font-size:calc(14 * var(--u));font-weight:700;cursor:pointer}
.open-bets-pop .ob-edit-actions button:first-child{border:1px solid rgba(0,0,0,.35);background:linear-gradient(0deg,#eee,#fff);color:#1e1e1e}
.open-bets-pop .ob-edit-actions button:last-child{border:1px solid #222;background:linear-gradient(180deg,#474747,#070707);color:#ffb200}
.open-bets-pop .ob-toast{flex:0 0 auto;display:flex;align-items:stretch;min-height:calc(36 * var(--u));background:#fff200;color:#1e1e1e;font-size:calc(14 * var(--u))}
.open-bets-pop .ob-toast span{flex:1 1 0%;display:flex;align-items:center;justify-content:center;padding:calc(4 * var(--u)) calc(8 * var(--u));text-align:center}
.open-bets-pop .ob-toast button{flex:0 0 calc(34 * var(--u));margin:0;padding:0;border:0;border-left:1px solid rgba(0,0,0,.12);background:none;color:#1e1e1e;font-size:calc(20 * var(--u));line-height:1;cursor:pointer}
.open-bets-pop .ob-toast.error{background:#d0021b;color:#fff}
.open-bets-pop .ob-toast.error button{color:#fff}
#bet-slip .fm-slip-stake input::placeholder{color:#999;font-weight:400}

/* ---------- Live TV button beside Bets (reference HeaderLoginWrapper .header-bet-streaming, mobile) ----------
   Bets + TV share the 29.14% Bets slot; TV: 8u 10u padding round a 21u x 19u icon, borders rgba(0,0,0,.3) (no left),
   teal #0a7b89 (open-tv) / orange #ce441d with an X screen (close-tv, stream showing). Only on a match with live TV. */
.bets-wrap{display:contents}
.balance-bar .tv-btn,.fm-tv{display:none}
@media(max-width:700px){
    .balance-bar .bets-wrap{flex:0 0 29.144385026%;display:flex;min-width:0;height:calc(36 * var(--u))}
    .balance-bar .bets-wrap .bets-btn{flex:1 1 auto;min-width:0}
    .balance-bar .tv-btn{flex:0 0 auto;display:flex;align-items:center;justify-content:center;height:100%;margin:0;padding:calc(8 * var(--u)) calc(10 * var(--u));border:1px solid rgba(0,0,0,.3);border-left:0;border-radius:0;box-shadow:inset 0 2px 0 rgba(255,255,255,.25);cursor:pointer}
    .balance-bar .tv-btn.open-tv{background:#0a7b89}
    .balance-bar .tv-btn.close-tv{background:#ce441d}
    .balance-bar .tv-btn .icon-tv{display:block;width:calc(21 * var(--u));height:calc(19 * var(--u));background:no-repeat center/contain}
    .balance-bar .tv-btn.open-tv .icon-tv{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='21' height='19' fill='none'%3E%3Cpath fill='url(%23a)' fill-rule='evenodd' d='M4 0h13a4 4 0 0 1 4 4v9a4 4 0 0 1-4 4H4a4 4 0 0 1-4-4V4a4 4 0 0 1 4-4m3 17h7v2H7zM4 2a2 2 0 0 0-2 2v8a2 2 0 0 0 2 2h13a2 2 0 0 0 2-2V4a2 2 0 0 0-2-2zm11 6.024L8 12V4z' clip-rule='evenodd'/%3E%3Cpath fill='url(%23b)' fill-rule='evenodd' d='M4 2h13a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2m11 6.024L8 4v8z' clip-rule='evenodd'/%3E%3Cdefs%3E%3ClinearGradient id='a' x1='10.5' x2='10.5' y1='0' y2='19' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23fff'/%3E%3Cstop offset='1' stop-color='%23ECECEC'/%3E%3C/linearGradient%3E%3ClinearGradient id='b' x1='10.5' x2='10.5' y1='2' y2='14' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23279CE6'/%3E%3Cstop offset='1' stop-color='%230B7DC5'/%3E%3C/linearGradient%3E%3C/defs%3E%3C/svg%3E")}
    .balance-bar .tv-btn.close-tv .icon-tv{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='21' height='19' fill='none'%3E%3Cpath fill='url(%23a)' d='M17 2H4a2 2 0 0 0-2 2v8a2 2 0 0 0 2 2h13a2 2 0 0 0 2-2V4a2 2 0 0 0-2-2'/%3E%3Cpath fill='url(%23b)' d='m14.066 5.614-.93-.93L10.5 7.32 7.864 4.684l-.93.93L9.57 8.25l-2.636 2.636.93.93L10.5 9.18l2.636 2.636.93-.93L11.43 8.25z'/%3E%3Cpath fill='url(%23c)' fill-rule='evenodd' d='M21 4a4 4 0 0 0-4-4H4a4 4 0 0 0-4 4v9a4 4 0 0 0 4 4h3v2h7v-2h3a4 4 0 0 0 4-4zM4 2h13a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2' clip-rule='evenodd'/%3E%3Cdefs%3E%3ClinearGradient id='a' x1='10.5' x2='10.5' y1='0' y2='19' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23E07034'/%3E%3Cstop offset='1' stop-color='%23D35D25'/%3E%3C/linearGradient%3E%3ClinearGradient id='b' x1='10.5' x2='10.5' y1='0' y2='19' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23fff'/%3E%3Cstop offset='1' stop-color='%23EFEFEF'/%3E%3C/linearGradient%3E%3ClinearGradient id='c' x1='10.5' x2='10.5' y1='0' y2='19' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23fff'/%3E%3Cstop offset='1' stop-color='%23EFEFEF'/%3E%3C/linearGradient%3E%3C/defs%3E%3C/svg%3E")}
    .fm-tv:not([hidden]){display:flex;align-items:center;justify-content:center;aspect-ratio:16 / 9;max-height:calc(211 * var(--u));padding:calc(16 * var(--u));background:#000;color:#bbb;font-size:calc(13 * var(--u));text-align:center}
    .fm-tv p{margin:0}
    .fm-tv:has(video:not([hidden])){padding:0}
    .fm-tv video:not([hidden]){display:block;width:100%;height:100%;background:#000;object-fit:contain}
}
