.bx-hero{position:relative;overflow:hidden;padding-bottom:10px}
.bx-hero::before{content:"";position:absolute;inset:-30% -10% auto;height:130%;z-index:-1;background:radial-gradient(38% 55% at 22% 42%,rgba(255,92,154,.3),transparent 70%),radial-gradient(36% 55% at 78% 30%,rgba(124,126,129,.34),transparent 70%);animation:bx-drift 14s ease-in-out infinite alternate}
@keyframes bx-drift{to{transform:translate3d(3%,6%,0) scale(1.08)}}
.bx-live{display:inline-flex;align-items:center;gap:8px;padding:6px 14px 6px 11px;border:1px solid var(--line);border-radius:99px;background:rgba(255,255,255,.06);backdrop-filter:blur(14px);font-size:13px;color:var(--muted)}
.bx-live b{color:#6DF5A8;font-size:12px;letter-spacing:.08em}
.bx-live i{width:9px;height:9px;border-radius:50%;background:#6DF5A8;animation:bx-pulse 1.6s ease-out infinite}
.bx-live.off b{color:var(--pink)}.bx-live.off i{background:var(--pink);animation:none}
@keyframes bx-pulse{from{box-shadow:0 0 0 0 rgba(109,245,168,.7)}to{box-shadow:0 0 0 11px rgba(109,245,168,0)}}
.bx-title{margin:16px 0 8px;font-size:clamp(38px,7vw,78px);line-height:1.02;letter-spacing:-.02em}
.bx-title em{font-style:normal;background:linear-gradient(100deg,var(--pink),var(--violet) 55%,var(--cyan));-webkit-background-clip:text;background-clip:text;color:transparent}
.bx-hero .lead{max-width:620px}
.bx-kpi{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:26px}
.bx-kpi>div{position:relative;display:grid;grid-template-columns:auto 1fr;column-gap:13px;align-items:center;padding:17px 19px;border:1px solid var(--line);border-radius:22px;background:linear-gradient(140deg,color-mix(in srgb,var(--c) 15%,transparent),var(--card));backdrop-filter:blur(18px)}
.bx-kpi .ic{grid-row:span 2;display:grid;place-items:center;width:44px;height:44px;border-radius:14px;color:var(--c);background:color-mix(in srgb,var(--c) 18%,transparent)}
.bx-kpi small{color:var(--muted);font-size:13px}.bx-kpi b{font-size:27px;line-height:1.15;font-variant-numeric:tabular-nums}
.bx-wrap{container-type:inline-size}
.bx-ctl{display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;align-items:center}
.bx-tabs{display:flex;gap:5px;padding:5px;border:1px solid var(--line);border-radius:18px;background:var(--card)}
.bx-tabs button{display:inline-flex;align-items:center;gap:8px;padding:10px 15px;border:0;border-radius:13px;background:none;color:var(--muted);font:inherit;font-weight:700;cursor:pointer;transition:background .2s,color .2s}
.bx-tabs button.on{color:#17191C;background:var(--lime)}
.bx-tabs span{min-width:22px;padding:0 6px;border-radius:9px;background:rgba(255,255,255,.12);font-size:12px;text-align:center}.bx-tabs .on span{background:rgba(23,25,28,.16)}
.bx-q{flex:1 1 240px;max-width:360px;display:flex;align-items:center;gap:9px;padding:0 15px;height:50px;border:1px solid var(--line);border-radius:16px;background:var(--card);color:var(--muted)}
.bx-q:focus-within{border-color:var(--cyan)}
.bx-q input{flex:1;min-width:0;border:0;outline:0;background:none;color:var(--text);font:inherit}
.bx-srv{display:flex;flex-wrap:wrap;gap:7px;margin-top:13px}.bx-srv[hidden]{display:none}
.bx-srv button{display:inline-flex;align-items:center;gap:7px;padding:7px 13px;border:1px solid var(--line);border-radius:99px;background:none;color:var(--muted);font:inherit;font-size:13px;cursor:pointer}
.bx-srv .on{color:var(--text);border-color:var(--violet);background:rgba(124,126,129,.2)}
.bx-srv i{width:7px;height:7px;border-radius:50%;background:#7A7D82}.bx-srv i.up{background:#6DF5A8}
.bx-list{display:grid;gap:9px;margin-top:16px;min-height:220px;align-content:start;view-transition-name:bx-list}
.bx-c,.bx-f{display:flex;align-items:center;gap:15px;padding:14px 18px;border:1px solid var(--line);border-radius:20px;background:var(--card);backdrop-filter:blur(14px);transition:border-color .2s,transform .2s}
.bx-c:hover,.bx-f:hover{border-color:rgba(255,255,255,.26);transform:translateY(-1px)}
.bx-c.is-new,.bx-f.is-new{animation:bx-in .6s cubic-bezier(.2,.9,.3,1.2),bx-glow 2.6s ease-out}
@keyframes bx-in{from{opacity:0;transform:translateY(-14px) scale(.98)}}
@keyframes bx-glow{from{border-color:var(--lime);box-shadow:0 0 0 1px var(--lime),0 12px 40px -14px var(--lime)}}
.bx-av{flex:none;width:46px;height:46px;display:grid;place-items:center;overflow:hidden;border-radius:15px;background:linear-gradient(140deg,var(--violet),var(--pink));font-weight:800}
.bx-av img{width:100%;height:100%;object-fit:cover}
.bx-m{flex:1;min-width:0}
.bx-m h3{margin:0;font-size:16px;font-family:inherit;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bx-m h3 a{color:inherit}.bx-m h3 a:hover{color:var(--cyan)}
.bx-m h3 i{margin-left:6px;font-style:normal;font-size:12px;font-weight:600;color:var(--muted)}
.bx-m p{margin:2px 0 0;color:var(--muted);font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bx-m small{display:flex;align-items:center;gap:5px;margin-top:4px;color:var(--muted);font-size:12px;opacity:.8}.bx-m small .i{width:13px;height:13px}
.bx-t{flex:none;text-align:right}.bx-t small{display:block;color:var(--muted);font-size:12px}.bx-t b{font-size:15px;color:var(--lime);font-variant-numeric:tabular-nums}
.bx-f time{flex:none;color:var(--muted);font-size:13px}
.bx-b{flex:none;min-width:112px;display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:7px 10px;border-radius:11px;font-size:12px;font-weight:800}.bx-b .i{width:14px;height:14px}
.bx-b.r{color:#FF8DB7;background:rgba(255,92,154,.16)}.bx-b.y{color:var(--lime);background:rgba(255,201,77,.14)}.bx-b.g{color:#6DF5A8;background:rgba(109,245,168,.13)}.bx-b.v{color:#B5B8BD;background:rgba(124,126,129,.18)}
.bx-empty{display:grid;justify-items:center;gap:6px;padding:54px 20px;border:1px dashed var(--line);border-radius:22px;color:var(--muted);text-align:center}
.bx-empty .i{width:34px;height:34px;color:var(--cyan)}.bx-empty b{color:var(--text);font-size:18px}
.bx-sk{height:76px;border-radius:20px;background:linear-gradient(100deg,var(--card) 30%,var(--card2) 50%,var(--card) 70%);background-size:220% 100%;animation:bx-sk 1.3s linear infinite}
@keyframes bx-sk{to{background-position:-220% 0}}
.bx-note{display:flex;align-items:center;gap:8px;margin-top:20px;color:var(--muted);font-size:13px}.bx-note .i{flex:none;width:15px;height:15px}.bx-note a{color:var(--cyan)}
@container (max-width:620px){
  .bx-q{max-width:none}.bx-tabs{width:100%}.bx-tabs button{flex:1;justify-content:center;padding:10px 7px;font-size:14px}
  .bx-c{flex-wrap:wrap}.bx-t{width:100%;display:flex;justify-content:space-between;align-items:center;padding-top:9px;border-top:1px solid var(--line);text-align:left}
  .bx-f{flex-wrap:wrap;gap:9px}.bx-f .bx-m{order:3;flex-basis:100%}.bx-f time{margin-left:auto}
}
@media(max-width:620px){.bx-kpi{gap:8px}.bx-kpi>div{grid-template-columns:1fr;padding:13px;border-radius:17px}.bx-kpi .ic{grid-row:auto;width:34px;height:34px;margin-bottom:7px;border-radius:11px}.bx-kpi small{font-size:11.5px}.bx-kpi b{font-size:21px}}
@media(prefers-reduced-motion:reduce){.bx-hero::before,.bx-live i,.bx-sk,.bx-c.is-new,.bx-f.is-new{animation:none}}
.calm .bx-hero::before,.calm .bx-live i,.calm .bx-c.is-new,.calm .bx-f.is-new{animation:none}
/* v2: тоглоомын цэс, Steam зураг, эффект */
.bx-games{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:24px}
.bx-games button{position:relative;isolation:isolate;overflow:hidden;min-height:112px;padding:0;border:1px solid var(--line);border-radius:24px;background:var(--bg2);color:var(--text);font:inherit;text-align:left;cursor:pointer;transition:transform .25s,border-color .25s,box-shadow .25s}
.bx-games button::before{content:"";position:absolute;inset:0;z-index:-2;background:var(--art) center/cover;opacity:.34;filter:saturate(.7);transition:opacity .3s,transform .5s,filter .3s}
.bx-games button::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(8,10,13,.92) 15%,rgba(8,10,13,.2))}
.bx-games button:hover{transform:translateY(-2px)}.bx-games button:hover::before{transform:scale(1.05)}
.bx-games button.on{border-color:var(--lime);box-shadow:0 18px 50px -24px var(--lime),inset 0 0 0 1px var(--lime)}
.bx-games button.on::before{opacity:.72;filter:none}
.bx-games span{display:grid;gap:2px;padding:20px 22px}.bx-games .i{width:22px;height:22px;color:var(--lime)}
.bx-games b{font-size:24px;line-height:1.1}.bx-games small{color:var(--muted);font-size:13px}.bx-games em{font-style:normal;font-weight:800;color:var(--text)}
.bx-c{position:relative;isolation:isolate;overflow:hidden;--r:var(--pink);animation:bx-up .5s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(min(var(--i,0),10)*35ms)}
.bx-c.k-y{--r:var(--lime)}
.bx-c::before{content:"";position:absolute;inset:-40px;z-index:-2;background:var(--av,none) center/cover no-repeat;filter:blur(34px) saturate(1.6);opacity:.3;-webkit-mask-image:linear-gradient(90deg,#000,transparent 52%);mask-image:linear-gradient(90deg,#000,transparent 52%)}
.bx-c::after,.bx-f::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:0;background:radial-gradient(260px circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.1),transparent 70%);transition:opacity .25s}
.bx-c:hover::after,.bx-f:hover::after{opacity:1}
.bx-f{position:relative;isolation:isolate;overflow:hidden;animation:bx-up .4s ease both;animation-delay:calc(min(var(--i,0),12)*22ms)}
@keyframes bx-up{from{opacity:0;transform:translateY(10px)}}
.bx-av{position:relative;flex:none;width:64px;height:64px;border-radius:19px;padding:0;overflow:visible;background:linear-gradient(140deg,var(--violet),var(--pink));font-size:22px}
.bx-av::before{content:"";position:absolute;inset:-2px;z-index:0;border-radius:21px;background:conic-gradient(from var(--a,0deg),var(--r,var(--violet)),transparent 30%,var(--cyan) 62%,var(--r,var(--violet)));opacity:.85}
.bx-c:hover .bx-av::before,.bx-c.is-new .bx-av::before{animation:bx-spin 2.6s linear infinite}
@property --a{syntax:"<angle>";inherits:false;initial-value:0deg}
@keyframes bx-spin{to{--a:360deg}}
.bx-av img,.bx-av>span{position:relative;z-index:1;grid-area:1/1;width:calc(100% - 2px);height:calc(100% - 2px);display:grid;place-items:center;border-radius:18px;object-fit:cover;background:#181A1D}
.bx-av img{z-index:2}
.bx-av.sm{width:42px;height:42px;border-radius:13px;font-size:15px}.bx-av.sm::before{border-radius:15px;opacity:.5}.bx-av.sm img,.bx-av.sm>span{border-radius:12px}
.bx-h{display:flex;align-items:center;gap:9px;min-width:0}.bx-h h3{min-width:0}
.bx-c .bx-b{min-width:0;padding:4px 9px;border-radius:9px;font-size:11px}
.bx-m small{flex-wrap:wrap}
.bx-t b{font-size:17px;color:var(--r,var(--lime))}
.bx-f .bx-b{min-width:0;width:128px}
@container (max-width:620px){.bx-f .bx-b{width:auto}}
@media(max-width:620px){.bx-games{gap:8px}.bx-games button{min-height:96px;border-radius:18px}.bx-games span{padding:14px}.bx-games b{font-size:19px}.bx-games small{font-size:11.5px}.bx-av{width:54px;height:54px}}
@media(prefers-reduced-motion:reduce){.bx-c,.bx-f,.bx-c:hover .bx-av::before{animation:none}}
.calm .bx-c,.calm .bx-f,.calm .bx-c:hover .bx-av::before,.calm .bx-c.is-new .bx-av::before{animation:none}