/* XBALLS High-End Design System 12.0
   Visual-only layer: no prediction/data semantics. */
:root{
 --xb-bg:#020912;--xb-bg2:#06111d;--xb-panel:rgba(7,24,39,.78);--xb-panel2:rgba(10,31,49,.88);
 --xb-border:rgba(105,221,255,.14);--xb-border-strong:rgba(90,225,255,.28);
 --xb-text:#f3fbff;--xb-muted:#8da9bb;--xb-cyan:#59e7ff;--xb-blue:#178dff;
 --xb-green:#5ef0b0;--xb-amber:#ffc66b;--xb-red:#ff7184;
 --xb-shadow:0 24px 70px rgba(0,0,0,.34);--xb-glow:0 0 42px rgba(61,219,255,.09);
 --xb-radius:22px;--xb-radius-sm:14px;--xb-max:1440px;
}
html{background:var(--xb-bg)!important;scroll-behavior:smooth}
body.xb-highend-ui{
 color:var(--xb-text)!important;background:
 radial-gradient(900px 520px at 78% -4%,rgba(26,135,255,.13),transparent 66%),
 radial-gradient(700px 440px at -10% 20%,rgba(55,226,255,.08),transparent 70%),
 linear-gradient(180deg,#020912 0%,#03101a 45%,#020912 100%)!important;
 font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
 min-height:100vh;overflow-x:hidden;
}
body.xb-highend-ui:before{content:"";position:fixed;z-index:-1;inset:0;pointer-events:none;opacity:.42;background-image:linear-gradient(rgba(110,225,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(110,225,255,.025) 1px,transparent 1px);background-size:42px 42px;mask-image:linear-gradient(to bottom,black,transparent 82%)}
body.xb-highend-ui a{transition:color .2s ease,border-color .2s ease,background .2s ease,transform .2s ease,box-shadow .2s ease}
body.xb-highend-ui button,body.xb-highend-ui input,body.xb-highend-ui select{font:inherit}
body.xb-highend-ui ::selection{background:rgba(74,222,255,.28);color:#fff}
body.xb-highend-ui ::-webkit-scrollbar{width:10px;height:10px}body.xb-highend-ui ::-webkit-scrollbar-track{background:#020914}body.xb-highend-ui ::-webkit-scrollbar-thumb{background:#143b54;border:2px solid #020914;border-radius:999px}

/* Bricks/WordPress shell cleanup */
body.xb-highend-ui main,body.xb-highend-ui .brxe-section,body.xb-highend-ui .brxe-container{position:relative}
body.xb-highend-ui .brx-body{background:transparent!important}
body.xb-highend-ui .entry-content{margin:0!important}
body.xb-highend-ui .site-main{background:transparent!important}

/* Shared XBALLS page shells */
body.xb-highend-ui [class^="xb"][class*="-hero"],
body.xb-highend-ui [class^="x"][class*="hero"]{
 border-color:var(--xb-border)!important;
 box-shadow:var(--xb-shadow),inset 0 1px rgba(255,255,255,.025),var(--xb-glow)!important;
}
body.xb-highend-ui .xb79,body.xb-highend-ui .xb92,body.xb-highend-ui .xb518,
body.xb-highend-ui .x95,body.xb-highend-ui .xb70dash,
body.xb-highend-ui .xb-cinematic-home{
 max-width:var(--xb-max);margin-left:auto!important;margin-right:auto!important;
}
body.xb-highend-ui .xb-cinematic-home{max-width:none!important}

/* Cards */
body.xb-highend-ui :is(.xb79-card,.xb92-card,.xb518-card,.x95c,.xb112,.xb113,.xb114){
 background:linear-gradient(155deg,rgba(10,31,49,.90),rgba(4,18,31,.94))!important;
 border:1px solid var(--xb-border)!important;border-radius:var(--xb-radius)!important;
 box-shadow:0 14px 45px rgba(0,0,0,.20),inset 0 1px rgba(255,255,255,.025)!important;
 overflow:hidden;
}
@media(hover:hover){
 body.xb-highend-ui :is(.xb79-card,.xb92-card,.xb518-card,.x95c):hover{
  transform:translateY(-3px);border-color:var(--xb-border-strong)!important;
  box-shadow:0 22px 55px rgba(0,0,0,.29),0 0 28px rgba(61,219,255,.06)!important;
 }
}

/* Headings */
body.xb-highend-ui h1,body.xb-highend-ui h2,body.xb-highend-ui h3{color:#f6fcff;letter-spacing:-.025em}
body.xb-highend-ui h1{font-weight:850}
body.xb-highend-ui :is(.xb518-kicker,.xb92-kicker,.xb81-kicker,.x95hero small){color:var(--xb-cyan)!important;letter-spacing:.16em;font-weight:900}
body.xb-highend-ui small,body.xb-highend-ui .muted{color:var(--xb-muted)}

/* Buttons / action links */
body.xb-highend-ui :is(button,.button,[class*="-btn"],[class*="-cta"]){
 border-radius:12px;transition:.2s ease;
}
body.xb-highend-ui :is(.button-primary,[class*="-primary"]){
 background:linear-gradient(135deg,var(--xb-cyan),var(--xb-blue))!important;
 color:#00121d!important;border-color:transparent!important;font-weight:900!important;
 box-shadow:0 8px 26px rgba(29,183,255,.16)!important;
}
@media(hover:hover){body.xb-highend-ui :is(.button-primary,[class*="-primary"]):hover{transform:translateY(-1px);box-shadow:0 12px 34px rgba(29,183,255,.24)!important}}

/* Inputs/filters */
body.xb-highend-ui :is(input[type=text],input[type=search],input[type=email],input[type=password],input[type=number],select,textarea){
 background:rgba(5,23,38,.9)!important;color:var(--xb-text)!important;border:1px solid rgba(101,211,245,.17)!important;
 border-radius:12px!important;outline:none!important;box-shadow:none!important;
}
body.xb-highend-ui :is(input,select,textarea):focus{border-color:rgba(78,226,255,.48)!important;box-shadow:0 0 0 3px rgba(69,216,255,.07)!important}

/* Tabs */
body.xb-highend-ui :is(.xb79-tabs,.xb92-tabs,.xb518-tabs,.xb81-cats){
 padding:5px!important;background:rgba(5,20,33,.66)!important;border:1px solid var(--xb-border)!important;
 border-radius:14px!important;backdrop-filter:blur(16px);
}
body.xb-highend-ui :is(.xb79-tabs,.xb92-tabs,.xb518-tabs,.xb81-cats) :is(a,button){
 border-radius:10px!important;color:#91adbe!important
}
body.xb-highend-ui :is(.xb79-tabs,.xb92-tabs,.xb518-tabs,.xb81-cats) :is(.active,[aria-selected=true]){
 background:rgba(72,222,255,.11)!important;color:#effcff!important;box-shadow:inset 0 0 0 1px rgba(79,224,255,.16)
}

/* Metrics/status */
body.xb-highend-ui :is(.xb518-stat,.xb518-metric,.xb92-mini,.xb112pos div,.xb112s span,.xb113g div,.xb114g div){
 background:linear-gradient(145deg,rgba(12,42,63,.72),rgba(6,27,43,.82))!important;
 border:1px solid rgba(108,214,244,.10)!important;border-radius:14px!important;
}
body.xb-highend-ui .is-live{box-shadow:0 0 0 1px rgba(94,240,176,.20),0 18px 48px rgba(0,0,0,.25)!important}
body.xb-highend-ui .xb518-livebadge{color:var(--xb-green)!important}
body.xb-highend-ui .xb518-livebadge i{box-shadow:0 0 12px var(--xb-green)}

/* Desktop customer nav */
body.xb-highend-ui .xb70-topnav{
 height:76px!important;background:linear-gradient(180deg,rgba(3,13,24,.96),rgba(3,13,24,.88))!important;
 border-bottom:1px solid rgba(90,225,255,.16)!important;box-shadow:0 18px 55px rgba(0,0,0,.28)!important;
 padding:0 max(22px,calc((100vw - 1500px)/2))!important;
}
body.xb-highend-ui .xb70-brand-x{background:linear-gradient(145deg,#62ecff,#168fff)!important;border-radius:14px!important;box-shadow:0 0 32px rgba(65,215,255,.18)!important}
body.xb-highend-ui .xb70-links a{font-size:11px!important;font-weight:780!important;letter-spacing:.01em}
body.xb-highend-ui .xb70-links a.active{color:#fff!important;background:linear-gradient(180deg,transparent,rgba(54,220,255,.045))}
body.xb-highend-ui .xb70-logout{background:rgba(11,40,62,.72)!important;border-color:rgba(81,222,255,.16)!important}

/* Home cinematic refinement */
body.xb-highend-ui .xb-cinematic-home{background:transparent!important}
body.xb-highend-ui .xb81-bottom{background:rgba(3,13,24,.90)!important;backdrop-filter:blur(22px)!important;border-top-color:rgba(81,222,255,.13)!important}
body.xb-highend-ui .xb81-bottom a.active{color:var(--xb-cyan)!important}

/* Data tables */
body.xb-highend-ui table{border-collapse:separate;border-spacing:0}
body.xb-highend-ui table th{color:#82a6bb;text-transform:uppercase;font-size:10px;letter-spacing:.09em}
body.xb-highend-ui table td{border-color:rgba(110,215,245,.09)!important}
body.xb-highend-ui table tr:hover td{background:rgba(65,205,245,.025)}

/* Premium/login/account generic polish */
body.xb-highend-ui :is(.xb-login,.xb-register,.xb-premium,.xb-account,[class*="pricing"],[class*="premium"]){
 --xb-local-panel:rgba(7,24,39,.88);
}
body.xb-highend-ui :is(.xb-login,.xb-register,.xb-premium,.xb-account) form{
 background:linear-gradient(160deg,rgba(9,31,49,.92),rgba(4,18,30,.96));border:1px solid var(--xb-border);
 border-radius:24px;box-shadow:var(--xb-shadow);padding:22px;
}

/* Page reveal */
body.xb-highend-ui.xb-ui-ready :is(.xb79,.xb92,.xb518,.x95,.xb70dash,.xb112,.xb113,.xb114){animation:xb120-in .44s cubic-bezier(.2,.75,.25,1) both}
@keyframes xb120-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* Mobile high-end */
@media(max-width:900px){
 body.xb-highend-ui{background:linear-gradient(180deg,#020912,#03111c 55%,#020912)!important}
 body.xb-highend-ui .xb70-mobile-top{background:rgba(3,14,25,.94)!important;border-bottom-color:rgba(84,223,255,.14)!important;backdrop-filter:blur(22px)!important}
 body.xb-highend-ui .xb70-mobile-nav{
  left:10px!important;right:10px!important;border:1px solid rgba(84,223,255,.15)!important;
  border-radius:19px!important;background:rgba(4,18,30,.92)!important;backdrop-filter:blur(24px)!important;
  box-shadow:0 16px 55px rgba(0,0,0,.42)!important;
 }
 body.xb-highend-ui .xb70-mobile-nav a.active{background:rgba(65,218,255,.055)!important}
 body.xb-highend-ui .xb79,body.xb-highend-ui .xb92,body.xb-highend-ui .xb518,body.xb-highend-ui .x95{padding-left:10px!important;padding-right:10px!important}
 body.xb-highend-ui :is(.xb79-card,.xb92-card,.xb518-card,.x95c,.xb112,.xb113,.xb114){border-radius:17px!important}
 body.xb-highend-ui h1{letter-spacing:-.035em}
}
@media(max-width:520px){
 body.xb-highend-ui :is(.xb518-hero,.xb92-hero,.x95hero){border-radius:19px!important}
 body.xb-highend-ui .xb518-stats{gap:7px!important}
 body.xb-highend-ui .xb518-stat{padding:13px!important}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}body.xb-highend-ui *{animation:none!important;transition:none!important}}


/* 12.2 screenshot-driven mobile layout corrections */
@media(max-width:900px){
  body.xb-highend-ui{overflow-x:hidden!important}
  body.xb-highend-ui main,
  body.xb-highend-ui .brx-body,
  body.xb-highend-ui .brxe-section,
  body.xb-highend-ui .brxe-container{max-width:100vw!important;overflow-x:clip}

  /* Reserve real space for the floating customer navigation. */
  body.xb-highend-ui.xb-customer-session{
    padding-bottom:calc(104px + env(safe-area-inset-bottom))!important
  }
  body.xb-highend-ui .xb70-mobile-nav{
    height:70px!important;bottom:max(10px,env(safe-area-inset-bottom))!important;
  }

  /* Home: Top Spiele becomes a controlled snap carousel instead of clipped cards. */
  body.xb-highend-ui :is(.xb81-games,.xb81-match-grid,.xb81-top-games,.xb-home-games,[class*="top-games"]){
    display:flex!important;grid-template-columns:none!important;gap:12px!important;
    overflow-x:auto!important;overflow-y:hidden!important;scroll-snap-type:x mandatory;
    scroll-padding-left:14px;padding-left:14px!important;padding-right:14px!important;
    scrollbar-width:none;-webkit-overflow-scrolling:touch;
  }
  body.xb-highend-ui :is(.xb81-games,.xb81-match-grid,.xb81-top-games,.xb-home-games,[class*="top-games"])::-webkit-scrollbar{display:none}
  body.xb-highend-ui :is(.xb81-games,.xb81-match-grid,.xb81-top-games,.xb-home-games,[class*="top-games"]) > *{
    flex:0 0 min(84vw,390px)!important;width:min(84vw,390px)!important;min-width:min(84vw,390px)!important;
    scroll-snap-align:start;
  }

  /* Match Intelligence top tabs: one-row swipe navigation, never collide. */
  body.xb-highend-ui .xb92-tabs{
    display:flex!important;justify-content:flex-start!important;gap:5px!important;
    overflow-x:auto!important;overflow-y:hidden!important;white-space:nowrap!important;
    scrollbar-width:none;-webkit-overflow-scrolling:touch;padding:5px!important;
  }
  body.xb-highend-ui .xb92-tabs::-webkit-scrollbar{display:none}
  body.xb-highend-ui .xb92-tabs a{
    flex:0 0 auto!important;min-width:max-content!important;padding:12px 15px!important;
    font-size:12px!important;line-height:1!important;
  }

  /* Match report cards and metric grids stay inside the phone viewport. */
  body.xb-highend-ui .xb92,
  body.xb-highend-ui .xb92 *{box-sizing:border-box}
  body.xb-highend-ui .xb92{width:100%!important;max-width:100%!important;overflow:hidden!important}
  body.xb-highend-ui :is(.xb92-grid,.xb92-metrics,.xb92-probs){
    grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;gap:8px!important
  }
  body.xb-highend-ui :is(.xb92-card,.xb92-panel,.xb92-section){min-width:0!important;max-width:100%!important}
  body.xb-highend-ui .xb92 img{max-width:100%;height:auto}
  body.xb-highend-ui .xb92 p{overflow-wrap:anywhere}

  /* Quick actions under report remain readable instead of compressing 4 labels. */
  body.xb-highend-ui :is(.xb81-quick,.xb92-quick){
    display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  body.xb-highend-ui :is(.xb81-quick,.xb92-quick) a{
    min-width:0!important;white-space:normal!important;text-align:center!important;padding:12px 7px!important;
  }
}
@media(max-width:430px){
  body.xb-highend-ui :is(.xb92-grid,.xb92-metrics,.xb92-probs){grid-template-columns:1fr!important}
  body.xb-highend-ui .xb92-tabs a{padding:11px 13px!important;font-size:11px!important}
}

@media(max-width:900px){body.xb-highend-ui .xb81-newsgrid{max-width:100%!important;}}

@media(max-width:900px){body.xb-highend-ui .xb81-subgrid{max-width:100%!important;}}

.xb123-today{margin:26px 0}.xb123-count{font-size:10px;color:#79a1b8}.xb123-daylist{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.xb123-game{padding:13px;border:1px solid rgba(91,210,244,.13);border-radius:17px;background:#061b2c;text-decoration:none!important;color:#eefaff!important}.xb123-meta,.xb123-foot{display:flex;justify-content:space-between;gap:8px;font-size:9px}.xb123-meta{color:#8da9bb}.xb123-meta b,.xb123-foot strong{color:#5ce6ff}.xb123-teams{display:grid;grid-template-columns:1fr 22px 1fr;align-items:center;margin:12px 0}.xb123-teams span{display:flex;align-items:center;gap:8px;min-width:0}.xb123-teams span:last-child{justify-content:flex-end;text-align:right}.xb123-teams img{width:30px;height:30px;object-fit:contain}.xb123-teams b{font-size:11px}.xb123-teams em{text-align:center;color:#55ddfa}
@media(max-width:900px){body.xb-highend-ui .xb81-tabs{display:flex!important;grid-template-columns:none!important;overflow-x:auto!important;white-space:nowrap!important;scrollbar-width:none!important}body.xb-highend-ui .xb81-tabs button{flex:0 0 auto!important;min-width:max-content!important;width:auto!important;padding:13px 16px!important;font-size:11px!important;white-space:nowrap!important}body.xb-highend-ui .xb81-bottom{position:fixed!important;left:0!important;right:0!important;bottom:0!important;top:auto!important;z-index:2147483000!important;margin:0!important;transform:none!important;background:rgba(2,13,24,.98)!important}body.xb-highend-ui .xb81,body.xb-highend-ui .xb81-wrap{padding-bottom:112px!important}.xb123-daylist{grid-template-columns:1fr!important}}