
/*
 SPORTS INTEL MOBILE APP V10 FINAL REBUILD
 Final mobile information architecture + combo odds interaction restoration.
*/
@media(max-width:720px){

:root{
 --si10-bg:#020a11;
 --si10-panel:#07141f;
 --si10-panel2:#0a1926;
 --si10-line:#18364d;
 --si10-text:#f4f8fb;
 --si10-muted:#7c93a6;
 --si10-blue:#1688ff;
 --si10-cyan:#49a9ff;
 --si10-green:#37dd89;
 --si10-red:#ff414d;
 --si10-amber:#efba4f;
 --si10-purple:#9471ff;
}

/* ---------- reset problematic stacked layers ---------- */
.si7-match-card,.si8-match-card{display:none!important}
.match-row,.multisport-row{display:none!important}
.si-v3-skeleton,.si-refresh-indicator{display:none!important;pointer-events:none!important}

html{
 height:auto!important;min-height:100%!important;
 overflow-x:hidden!important;overflow-y:scroll!important;
 background:var(--si10-bg)!important;
}
body{
 min-height:100vh!important;height:auto!important;max-height:none!important;
 position:static!important;overflow-x:hidden!important;overflow-y:visible!important;
 touch-action:pan-y pinch-zoom!important;
 background:
  radial-gradient(circle at 50% -100px,rgba(19,104,167,.16),transparent 430px),
  var(--si10-bg)!important;
 color:var(--si10-text)!important;
 padding-bottom:84px!important;
}
*,*:before,*:after{box-sizing:border-box!important}

/* ---------- top app header ---------- */
.si-app-header{
 height:58px!important;padding:0 14px!important;
 background:rgba(2,10,17,.99)!important;border-bottom:1px solid #142d40!important;
 box-shadow:none!important;
}
.si-app-logo strong{color:#fff!important;font-size:18px!important;font-weight:950!important}
.si-app-logo strong em{color:var(--si10-blue)!important}
.si-app-logo small,.si-app-head-center small{color:#70889b!important}
.si-app-head-center b{color:#f3f7fa!important;font-size:12px!important}

/* ---------- bottom nav: 5 real services ---------- */
.si-mobile-nav{
 grid-template-columns:repeat(5,minmax(0,1fr))!important;
 height:68px!important;
 padding-left:4px!important;padding-right:4px!important;
 background:rgba(2,10,17,.99)!important;
 border-top:1px solid #173149!important;
 box-shadow:0 -8px 24px rgba(0,0,0,.28)!important;
}
.si-mobile-nav a{
 min-width:0!important;color:#7d94a7!important;font-size:8px!important;
}
.si-mobile-nav a i{font-size:17px!important}
.si-mobile-nav a span{
 max-width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;
 font-size:8px!important;font-weight:850!important;
}
.si-mobile-nav a.active,.si-mobile-nav a.active span{color:#32a1ff!important}

/* ---------- V10 match card ---------- */
.si10-match-card{
 position:relative;
 width:100%;
 margin:0 0 10px;
 overflow:hidden;
 border:1px solid #18384f;
 border-radius:15px;
 background:linear-gradient(145deg,#081925,#05121b);
 color:var(--si10-text);
}
.si10-match-card.live{border-color:#1e6e54}
.si10-match-card.live:before{
 content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--si10-red);
}
.si10-head{
 min-height:30px;padding:7px 10px 0;
 display:flex;align-items:flex-start;justify-content:space-between;gap:8px;
}
.si10-head-left{min-width:0;display:flex;align-items:center;gap:6px}
.si10-live{
 padding:3px 6px;border-radius:5px;background:var(--si10-red);
 color:#fff;font-size:8px;font-weight:950;line-height:1;
}
.si10-meta{
 min-width:0;color:#8197a9;font-size:8px;font-weight:850;
 white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.si10-state{color:#ff626c;font-size:9px;font-weight:950}
.si10-time{color:#a7b8c4;font-size:9px;font-weight:900}

.si10-main{
 min-height:72px;padding:2px 10px 8px;
 display:grid;grid-template-columns:minmax(0,1fr) 82px minmax(0,1fr);
 align-items:center;gap:5px;text-decoration:none;color:inherit;
}
.si10-team{
 min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;
 gap:4px;text-align:center;
}
.si10-team img{
 width:36px;height:36px;object-fit:contain;filter:drop-shadow(0 3px 7px rgba(0,0,0,.25));
}
.si10-team b{
 width:100%;color:#f1f6fa;font-size:10px;line-height:1.12;font-weight:900;
 white-space:normal;overflow-wrap:anywhere;
}
.si10-score{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.si10-score strong{
 color:#fff;font-size:26px;line-height:1;font-weight:950;letter-spacing:-1px;white-space:nowrap;
}
.si10-score small{margin-top:5px;color:#758da0;font-size:7px;font-weight:850}
.si10-match-card.live .si10-score small{color:#ff626d}

.si10-ai{
 min-height:37px;margin:0 10px;padding:7px 8px;
 display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:8px;align-items:center;
 border-top:1px solid #163149;border-bottom:1px solid #163149;
}
.si10-probs{display:flex;align-items:center;gap:6px;color:#7891a4;font-size:8px;font-weight:850}
.si10-probs .home{color:#42df99}.si10-probs .draw{color:#d2b45e}.si10-probs .away{color:#5db4ff}
.si10-pick,.si10-conf{text-align:center}
.si10-pick small,.si10-conf small{display:block;color:#6f889a;font-size:6px;font-weight:850}
.si10-pick b{display:block;margin-top:2px;color:#47a9ff;font-size:10px;font-weight:950}
.si10-conf b{display:block;margin-top:2px;color:#37dd89;font-size:11px;font-weight:950}

/* clickable odds = restored combo interaction */
.si10-market{padding:8px 10px 9px}
.si10-market-title{
 margin-bottom:5px;display:flex;align-items:center;justify-content:space-between;gap:8px;
}
.si10-market-title span{color:#7c94a6;font-size:7px;font-weight:900}
.si10-market-title em{
 color:#5d7182;font-size:7px;font-style:normal;font-weight:850;
}
.si10-odds{
 display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;
}
.si10-odd{
 min-width:0;height:38px;padding:0;
 display:flex;flex-direction:column;align-items:center;justify-content:center;
 border:1px solid #17384f;border-radius:9px;background:#081824;
 color:#eef5fa;cursor:pointer;
}
.si10-odd small{color:#718a9d;font-size:6px;font-weight:850}
.si10-odd b{margin-top:2px;color:#eef5fa;font-size:10px;font-weight:950}
.si10-odd:active{transform:scale(.98)}
.si10-odd.selected{
 border-color:var(--si10-blue)!important;
 background:linear-gradient(145deg,#0e3658,#0a2034)!important;
 box-shadow:0 0 0 1px rgba(22,136,255,.14);
}
.si10-odd.disabled{opacity:.3;pointer-events:none}
.si10-match-actions{
 margin-top:7px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px;align-items:center;
}
.si10-edge{color:#758da0;font-size:7px;font-weight:850}
.si10-edge b{color:#37dd89;font-size:9px}
.si10-analysis{
 height:32px;min-width:78px;padding:0 12px;
 display:flex;align-items:center;justify-content:center;
 border-radius:9px;background:linear-gradient(145deg,#0f8bff,#1688ff);
 color:#fff;text-decoration:none;font-size:9px;font-weight:950;
}

/* ---------- mobile combo tray ---------- */
.si10-combo-tray{
 position:fixed;left:10px;right:10px;bottom:76px;z-index:9989;
 padding:10px;
 border:1px solid #1e5277;border-radius:14px;
 background:rgba(4,17,27,.98);
 box-shadow:0 12px 32px rgba(0,0,0,.35);
 transform:translateY(140%);opacity:0;pointer-events:none;
 transition:.2s ease;
}
.si10-combo-tray.show{transform:none;opacity:1;pointer-events:auto}
.si10-combo-head{
 display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px;
}
.si10-combo-head b{color:#fff;font-size:11px}
.si10-combo-head button{
 border:0;background:transparent;color:#7891a4;font-size:10px;font-weight:850;
}
.si10-combo-list{
 max-height:150px;overflow:auto;display:grid;gap:5px;
}
.si10-combo-item{
 padding:7px 8px;display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:7px;align-items:center;
 border:1px solid #17364d;border-radius:9px;background:#071722;
}
.si10-combo-item span{min-width:0;color:#a6b8c5;font-size:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.si10-combo-item b{color:#48a9ff;font-size:9px}
.si10-combo-item em{color:#eef5fa;font-size:9px;font-style:normal;font-weight:900}
.si10-combo-summary{
 margin-top:8px;padding-top:8px;border-top:1px solid #17364d;
 display:grid;grid-template-columns:repeat(3,1fr);gap:6px;text-align:center;
}
.si10-combo-summary small{display:block;color:#6f889a;font-size:6px}
.si10-combo-summary b{display:block;margin-top:2px;color:#f3f7fa;font-size:10px}
.si10-combo-actions{margin-top:8px;display:grid;grid-template-columns:1fr 1fr;gap:6px}
.si10-combo-actions a,.si10-combo-actions button{
 height:34px;display:flex;align-items:center;justify-content:center;
 border-radius:9px;text-decoration:none;font-size:9px;font-weight:950;
}
.si10-combo-actions button{border:1px solid #284257;background:#071722;color:#9db0be}
.si10-combo-actions a{background:var(--si10-blue);color:#fff}
.si10-combo-fab{
 position:fixed;right:14px;bottom:82px;z-index:9990;
 min-width:62px;height:38px;padding:0 12px;
 display:flex;align-items:center;justify-content:center;gap:5px;
 border:0;border-radius:20px;background:var(--si10-blue);color:#fff;
 font-size:9px;font-weight:950;box-shadow:0 8px 20px rgba(22,136,255,.25);
}
.si10-combo-fab b{
 min-width:18px;height:18px;padding:0 4px;display:flex;align-items:center;justify-content:center;
 border-radius:10px;background:#fff;color:var(--si10-blue);font-size:9px;
}

/* ---------- mobile service pages ---------- */
body.si10-live-page .page-head,
body.si10-highwin-page .v15-hero,
body.si10-market-page .page-head,
body.si10-results-page .page-head,
body.si10-performance-page .page-head,
body.si10-status-page .page-head,
body.si10-combo-page .combo-hero{
 margin:10px 12px!important;
 border:1px solid var(--si10-line)!important;
 border-radius:15px!important;
 background:linear-gradient(145deg,#081824,#06121b)!important;
 box-shadow:none!important;
}
body.si10-live-page .page-head h1,
body.si10-market-page .page-head h1,
body.si10-results-page .page-head h1,
body.si10-performance-page .page-head h1,
body.si10-status-page .page-head h1,
body.si10-combo-page .combo-hero h1{
 color:#f4f8fb!important;font-size:18px!important;
}
body.si10-highwin-page .v15-hero h1{font-size:19px!important}
body.si10-highwin-page .v15-grid,
body.si10-market-page .detail-page,
body.si10-results-page .results-page,
body.si10-performance-page .detail-page,
body.si10-status-page .detail-page{
 width:auto!important;max-width:none!important;margin:0 12px 90px!important;
}
body.si10-highwin-page .v15-card,
body.si10-market-page .card,
body.si10-results-page .card,
body.si10-performance-page .card,
body.si10-status-page .card,
body.si10-combo-page .card{
 border-color:var(--si10-line)!important;border-radius:14px!important;
 background:linear-gradient(145deg,#081824,#06121b)!important;box-shadow:none!important;
}
body.si10-highwin-page table,
body.si10-market-page table,
body.si10-results-page table,
body.si10-performance-page table,
body.si10-status-page table,
body.si10-combo-page table{
 font-size:9px!important;
}

/* ---------- MORE hub ---------- */
.si10-more-page{width:100%;padding:10px 12px 92px}
.si10-more-hero{
 padding:16px 14px;border:1px solid var(--si10-line);border-radius:16px;
 background:radial-gradient(circle at 85% 0,rgba(22,136,255,.14),transparent 45%),#07141f;
}
.si10-more-hero small{color:#46a8ff;font-size:8px;font-weight:950;letter-spacing:.8px}
.si10-more-hero h1{margin:5px 0 3px;color:#fff;font-size:22px}
.si10-more-hero p{margin:0;color:#8096a8;font-size:10px;line-height:1.45}
.si10-more-section{margin-top:12px}
.si10-more-section h2{margin:0 0 7px 2px;color:#8ea4b5;font-size:10px}
.si10-more-grid{display:grid;gap:7px}
.si10-more-grid>a{
 min-height:64px;padding:10px 11px;
 display:grid;grid-template-columns:38px minmax(0,1fr) 18px;align-items:center;gap:9px;
 border:1px solid var(--si10-line);border-radius:13px;
 background:linear-gradient(145deg,#081824,#06121b);color:#f4f8fb;text-decoration:none;
}
.si10-more-grid>a>i{
 width:36px;height:36px;display:flex;align-items:center;justify-content:center;
 border-radius:10px;background:#0b2235;color:#49a9ff;font-size:16px;font-style:normal;font-weight:950;
}
.si10-more-grid b{display:block;color:#f2f7fa;font-size:11px}
.si10-more-grid small{display:block;margin-top:2px;color:#7890a3;font-size:8px}
.si10-more-grid em{color:#7890a3;font-size:18px;font-style:normal}

/* narrow */
@media(max-width:390px){
 .si10-main{grid-template-columns:minmax(0,1fr) 70px minmax(0,1fr);gap:3px}
 .si10-score strong{font-size:22px}
 .si10-team img{width:31px;height:31px}
 .si10-team b{font-size:9px}
 .si10-probs{gap:4px;font-size:7px}
 .si-mobile-nav a span{font-size:7px!important}
}
}

@media(min-width:721px){
 .si10-match-card,.si10-combo-tray,.si10-combo-fab{display:none!important}
 .si10-more-page{max-width:900px;margin:0 auto;padding:30px 20px}
 .si10-more-grid{grid-template-columns:repeat(2,1fr)}
}
