.abl-hero{isolation:isolate;background:#071624;align-items:flex-end;min-height:124px;display:flex;position:relative;overflow:hidden}.abl-hero__bg{z-index:-2;object-fit:cover;object-position:50% 45%;width:100%;height:100%;animation:1.2s cubic-bezier(.2,.7,.2,1) both abl-drift;position:absolute;inset:0}.abl-hero:after{content:"";z-index:-1;background:linear-gradient(#07162433 0%,#0716248c 45%,#071624 100%),linear-gradient(90deg,#071624bf 0%,#07162400 70%);position:absolute;inset:0}[dir=rtl] .abl-hero:after{background:linear-gradient(#07162433 0%,#0716248c 45%,#071624 100%),linear-gradient(270deg,#071624bf 0%,#07162400 70%)}.abl-hero__in{width:100%;max-width:80rem;margin:0 auto;padding:14px 16px 10px;animation:.6s cubic-bezier(.2,.7,.2,1) .1s both abl-rise}.abl-crumbs{color:#ffffff9e;flex-wrap:wrap;align-items:center;gap:6px;font-size:13px;display:flex}.abl-crumbs a{color:#fffc}.abl-crumbs a:hover,.abl-crumbs [aria-current]{color:#fff}.abl-title{font-family:var(--font-display);color:#fff;letter-spacing:-.03em;text-shadow:0 2px 12px #000000d9;margin-top:6px;font-size:clamp(26px,7.4vw,42px);font-weight:800;line-height:1.08}:lang(ar) .abl-title{letter-spacing:0;overflow-wrap:anywhere}.abl-sub{color:#ffffffd1;text-shadow:0 1px 6px #000000e6;max-width:46ch;margin-top:4px;font-size:14px}.abl-meta{flex-wrap:wrap;align-items:center;gap:8px;margin-top:8px;display:flex}.abl-count{color:#e9c77b;font-variant-numeric:tabular-nums;background:#07162499;border:1px solid #35dfce73;border-radius:999px;align-items:center;height:26px;padding:0 10px;font-size:12px;font-weight:700;display:inline-flex}.abl-extra{min-height:44px;color:var(--color-brand-500);text-shadow:0 1px 6px #000000e6;align-items:center;padding:0 4px;font-size:13px;font-weight:800;display:inline-flex}.abl-extra:hover{text-decoration:underline}.abl-extra:focus-visible{outline:3px solid var(--color-brand-500);outline-offset:2px;border-radius:10px}@media (min-width:900px){.abl-hero{min-height:220px}.abl-hero__in{padding:28px 24px 18px}}.abl-halls{scroll-snap-type:x proximity;scrollbar-width:none;overscroll-behavior-x:contain;background:#071624;gap:2px;max-width:80rem;margin:0 auto;padding:4px 10px 10px;display:flex;overflow-x:auto}.abl-halls::-webkit-scrollbar{display:none}.abl-halls>li{flex:none}.abl-alcove{scroll-snap-align:center;text-align:center;-webkit-tap-highlight-color:transparent;border-radius:14px;flex-direction:column;align-items:center;width:80px;min-height:44px;padding:2px 2px 6px;display:flex}.abl-alcove__box{aspect-ratio:1;background:#16202c9e;border:1px solid #35dfce33;border-radius:16px;width:52px;transition:transform .35s cubic-bezier(.2,.7,.2,1),border-color .3s;display:block;position:relative;overflow:hidden}.abl-alcove__win{color:#35dfcecc;place-items:center;display:grid;position:absolute;inset:0}.abl-alcove__win:before{content:"";opacity:0;background:radial-gradient(circle at 50% 60%,#2ee6d68c,#2ee6d614 70%,#0000 85%);transition:opacity .35s;position:absolute;inset:0}.abl-alcove__win svg{width:20px;height:20px;position:relative}.abl-alcove__label{color:#ffffffc7;margin-top:5px;font-size:12px;font-weight:800;line-height:1.15}.abl-alcove__count{color:#ffffff8c;font-variant-numeric:tabular-nums;margin-top:1px;font-size:11px}.abl-alcove:hover .abl-alcove__box{transform:translateY(-3px)}.abl-alcove:hover .abl-alcove__win:before{opacity:.45}.abl-alcove:active .abl-alcove__box{transform:scale(.96)}.abl-alcove.is-on .abl-alcove__box{border-color:#2ee6d6bf;transform:translateY(-2px);box-shadow:0 0 20px #2ee6d638}.abl-alcove.is-on .abl-alcove__win:before{opacity:1}.abl-alcove.is-on .abl-alcove__win,.abl-alcove.is-on .abl-alcove__label{color:#fff}.abl-alcove.is-on .abl-alcove__count{color:var(--color-brand-400)}.abl-alcove:focus-visible{outline:3px solid var(--color-brand-500);outline-offset:2px}@media (min-width:900px){.abl-halls{gap:6px;padding:8px 20px 14px}.abl-alcove{width:92px}.abl-alcove__box{width:58px}}@media (min-width:1200px){.abl-halls{flex-wrap:wrap;overflow:visible}}.abl-body{max-width:80rem;margin:0 auto;padding:8px 12px 0}@media (min-width:900px){.abl-body{padding:12px 24px 0}}.abl-body input,.abl-body select{background-color:#16202ceb!important;border-color:#35dfce38!important}.abl-body input:focus,.abl-body select:focus{box-shadow:0 0 0 3px #2ee6d638;border-color:var(--color-brand-500)!important}.abl-body .game-card{background:#071624;border-radius:16px;box-shadow:inset 0 0 0 1px #35dfce47,0 10px 22px -14px #000000e6}.abl-body .game-card:nth-child(-n+8){animation:.45s cubic-bezier(.2,.7,.2,1) both abl-tile}.abl-body .game-card:after{content:"";border-radius:inherit;pointer-events:none;position:absolute;inset:0;box-shadow:inset 0 0 0 1px #35dfce59}.abl-body .game-card:nth-child(2n){animation-delay:40ms}.abl-body .game-card:nth-child(3n){animation-delay:80ms}.abl-body .game-card .live{top:18%;bottom:auto;right:auto;inset-inline-start:8px}.abl-body .game-card .live:before{animation:none}.abl-body .game-card:hover,.abl-body .game-card:focus-visible{box-shadow:0 0 0 2px var(--color-brand-500), 0 0 24px #2ee6d666;transform:translateY(-4px)}.abl-body .game-card:active{transform:scale(.97)}.abl-body .game-card .label{background:linear-gradient(#07162400,#071624f5 85%);padding:22px 10px 9px}.abl-body .game-card .label-name{font-size:13px;font-weight:700}.abl-body .game-card .label-provider{color:#e9c77b;opacity:.85;font-size:11px}.abl-body .game-card .play-btn{background:var(--color-brand-500);color:#04211d}@keyframes abl-drift{0%{opacity:0;transform:scale(1.08)}to{opacity:1;transform:none}}@keyframes abl-rise{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@keyframes abl-tile{0%{opacity:0;transform:translateY(12px)scale(.98)}to{opacity:1;transform:none}}@media (prefers-reduced-motion:reduce){.abl-hero__bg,.abl-hero__in,.abl-body .game-card{animation:none}.abl-alcove__box,.abl-alcove__win:before,.abl-body .game-card{transition:none}.abl-alcove:hover .abl-alcove__box,.abl-alcove.is-on .abl-alcove__box,.abl-body .game-card:hover{transform:none}}@media (max-width:899px){.abl-hero{min-height:0}.abl-hero__in{padding-top:8px;padding-bottom:6px}.abl-title{margin-top:2px;font-size:clamp(22px,6.2vw,30px)}.abl-meta{margin-top:4px}}.abl-hero--ring{flex-direction:column;align-items:stretch;min-height:0}.abr{perspective:1000px;touch-action:pan-y;-webkit-user-select:none;user-select:none;cursor:grab;height:calc(1.333*clamp(118px,30vw,150px) + 46px);margin-top:-6px;position:relative;overflow:hidden}.abr:active{cursor:grabbing}.abr__floor{filter:blur(4px);background:radial-gradient(closest-side,#35dfce73,#35dfce00);border-radius:50%;height:46px;position:absolute;bottom:4px;left:10%;right:10%}.abr__tilt{transform-style:preserve-3d;position:absolute;inset:0;transform:rotateX(-8deg)}.abr__ring{--w:clamp(118px, 30vw, 150px);--r:calc(var(--w) * .5 / tan(180deg / var(--n)) + 10px);width:var(--w);aspect-ratio:3/4;margin:calc(var(--w) * -.667) 0 0 calc(var(--w) * -.5);transform-style:preserve-3d;transform:translateZ(calc(var(--r) * -1)) rotateY(var(--drag,0deg));position:absolute;top:50%;left:50%}.abr__spin{transform-style:preserve-3d;animation:48s linear infinite abr-spin;position:absolute;inset:0}.abr:hover .abr__spin,.abr:focus-within .abr__spin{animation-play-state:paused}.abr__card{backface-visibility:hidden;transform:rotateY(var(--a)) translateZ(var(--r));border:1px solid #35dfce59;border-radius:12px;transition:border-color .3s,box-shadow .3s;position:absolute;inset:0;overflow:hidden;box-shadow:0 14px 30px -10px #000000b3,0 0 0 1px #07162499}.abr__card img{object-fit:cover;pointer-events:none;width:100%;height:100%}.abr__card:hover,.abr__card:focus-visible{border-color:#35dfce;outline:none;box-shadow:0 0 24px #35dfce99}.abr__shine{animation:6s ease-in-out infinite abr-shine;animation-delay:calc(var(--a) / 60deg * .5s);background:linear-gradient(115deg,#0000 35%,#ffffff47 50%,#0000 65%);position:absolute;inset:0;transform:translate(-120%)}@keyframes abr-spin{to{transform:rotateY(-360deg)}}@keyframes abr-shine{0%,70%{transform:translate(-120%)}85%,to{transform:translate(120%)}}@media (min-width:900px){.abl-hero--ring{flex-direction:row;align-items:center;min-height:340px}.abl-hero--ring .abl-hero__in{flex:none;width:auto;max-width:30rem;margin:0;padding-inline-start:max(24px,50% - 40rem + 24px)}.abr{perspective:1300px;flex:auto;height:340px;margin:0;overflow:visible}.abr__ring{--w:150px}}@media (prefers-reduced-motion:reduce){.abr__spin,.abr__shine{animation:none}}
