/* ==========================================================================
   Bettaksim — ön yüz
   ========================================================================== */

:root {
    --bg: #070707;
    --surface: #101010;
    --surface-2: #161616;
    --surface-3: #1d1d1d;
    --line: #232323;
    --line-2: #323232;
    --gold: #d6a945;
    --gold-hi: #f5d985;
    --gold-lo: #8d6322;
    --gold-grad: linear-gradient(180deg, #f8df95 0%, #deaa4b 50%, #b07a24 100%);
    --gold-text: linear-gradient(180deg, #fff3c2 0%, #f1c45f 45%, #b27820 62%, #f6d47e 100%);
    --green-grad: linear-gradient(180deg, #62d86e 0%, #2b9d38 100%);
    --text: #f2f2f2;
    --muted: #8b8b8b;
    --muted-2: #b9b9b9;
    --red: #e5383b;
    --green: #2fbf5b;
    --wrap: 1480px;
    --wrap-wide: 1600px;
    color-scheme: dark;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
    min-height: 100vh;
    overflow-x: hidden;
    font: 500 14px/1.4 'Montserrat', 'Noto Color Emoji', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
    color: var(--text);
    background: var(--bg);
}
body::before {
    content: '';
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background:
        linear-gradient(118deg, transparent 38%, rgba(214, 169, 69, .07) 40.5%, transparent 43%),
        linear-gradient(62deg, transparent 57%, rgba(214, 169, 69, .055) 59%, transparent 61%),
        linear-gradient(150deg, transparent 69%, rgba(214, 169, 69, .05) 70.5%, transparent 72%),
        linear-gradient(30deg, transparent 20%, rgba(214, 169, 69, .04) 21.5%, transparent 23%),
        radial-gradient(circle at 12% 55%, rgba(214, 169, 69, .06), transparent 35%),
        radial-gradient(circle at 88% 28%, rgba(214, 169, 69, .05), transparent 35%),
        #060606;
}
a { color: inherit; text-decoration: none; }
button, input, select { font: inherit; color: inherit; }
button { cursor: pointer; background: none; border: 0; }
img { display: block; max-width: 100%; }
[hidden] { display: none !important; }

.sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 16px; }
.wrap--wide { max-width: var(--wrap-wide); padding: 0 12px; }
.main { padding-bottom: 10px; }

.ico { width: 18px; height: 18px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.ico--xs { width: 13px; height: 13px; }
.gold-text { background: var(--gold-text); -webkit-background-clip: text; background-clip: text; color: transparent; }

/* ---------- Butonlar ---------- */
.btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 6px;
    height: 34px; padding: 0 16px; border-radius: 7px;
    font-size: 12.5px; font-weight: 800; letter-spacing: .03em; text-transform: uppercase; white-space: nowrap;
    transition: filter .15s, background .15s, transform .15s;
}
.btn:active { transform: translateY(1px); }
.btn--gold { background: var(--gold-grad); color: #1b1205; box-shadow: inset 0 1px 0 rgba(255, 240, 190, .6), 0 3px 10px rgba(214, 169, 69, .2); }
.btn--green { background: var(--green-grad); color: #06280b; box-shadow: inset 0 1px 0 rgba(200, 255, 200, .5); }
.btn--gold:hover, .btn--green:hover { filter: brightness(1.08); }
.btn--ghost { background: rgba(10, 10, 10, .7); border: 1px solid var(--gold-lo); color: var(--gold-hi); }
.btn--ghost:hover { background: #1c1609; }
.btn--light { background: #fff; color: #111; }
.btn--sm { height: 28px; padding: 0 12px; font-size: 11px; }
.btn--xs { height: 22px; padding: 0 10px; font-size: 9.5px; border-radius: 5px; }
.btn--block { width: 100%; height: 42px; }
.btn:disabled { background: #1c1c1c; color: #5c5c5c; box-shadow: none; cursor: not-allowed; filter: none; }
.btn .ico { width: 15px; height: 15px; }

.ico-btn {
    width: 32px; height: 32px; flex: none; display: grid; place-items: center;
    border-radius: 6px; background: var(--surface-2); border: 1px solid var(--line-2); color: var(--gold);
}
.ico-btn:hover { border-color: var(--gold-lo); color: var(--gold-hi); }

/* ---------- Bayraklar, armalar ---------- */
.fl { width: 18px; height: 12px; flex: none; display: inline-block; border-radius: 2px; box-shadow: 0 0 0 1px rgba(255, 255, 255, .08); }
.fl--it { background: linear-gradient(90deg, #009246 33.3%, #fff 33.3% 66.6%, #ce2b37 66.6%); }
.fl--es { background: linear-gradient(#aa151b 25%, #f1bf00 25% 75%, #aa151b 75%); }
.fl--de { background: linear-gradient(#111 33.3%, #dd0000 33.3% 66.6%, #ffce00 66.6%); }
.fl--en { background: linear-gradient(90deg, transparent 42%, #ce1124 42% 58%, transparent 58%), linear-gradient(transparent 38%, #ce1124 38% 62%, transparent 62%), #fff; }
.fl--fr { background: linear-gradient(90deg, #0055a4 33.3%, #fff 33.3% 66.6%, #ef4135 66.6%); }
.fl--be { background: linear-gradient(90deg, #111 33.3%, #fdda24 33.3% 66.6%, #ef3340 66.6%); }
.crest {
    width: 30px; height: 30px; flex: none; display: grid; place-items: center; border-radius: 50%;
    font-size: 10px; font-weight: 900; color: #fff; letter-spacing: -.02em;
    background: linear-gradient(160deg, var(--c1), var(--c2)); border: 1px solid rgba(255, 255, 255, .18);
}

/* Rulet çarkı (görsel yokken) */
.roulette {
    display: block; aspect-ratio: 1; width: 100%; border-radius: 50%;
    background:
        radial-gradient(circle, #f6d98a 0 7%, #8a5a18 7% 10%, #2a1a08 10% 40%, #c8962f 40% 43%, transparent 43%),
        repeating-conic-gradient(#b1131b 0 9.73deg, #101010 9.73deg 19.46deg);
    border: 4px solid #b47a1e;
    box-shadow: 0 0 0 2px #5a3a0e, 0 10px 24px rgba(0, 0, 0, .55), inset 0 0 12px rgba(0, 0, 0, .6);
}
.roulette--hero { width: min(78%, 300px); margin: 0 auto; animation: spin 18s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

/* ==========================================================================
   Üst bar
   ========================================================================== */
.hdr { position: relative; z-index: 40; }
.notice { position: relative; display: flex; justify-content: center; padding: 13px 56px; background: linear-gradient(180deg, #202020, #171717); border-top: 2px solid var(--gold); }
.notice__msg {
    padding: 9px 16px; border-radius: 9px; background: #0e0e0e; border: 1px solid #4a4130;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04), 0 4px 14px rgba(0, 0, 0, .35);
    font-size: 14px; font-weight: 500; text-align: center; color: #fff;
}
.notice__msg b { font-weight: 600; color: var(--gold); }
.notice__x { position: absolute; right: 10px; top: 6px; width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; color: #cfcfcf; }
.notice__x:hover { color: #fff; background: rgba(255, 255, 255, .08); }
.notice__x .ico { width: 20px; height: 20px; stroke-width: 2; }

.hdr__top { position: relative; overflow: hidden; background: radial-gradient(ellipse 460px 120px at 50% 0, rgba(214, 169, 69, .12), transparent 70%), #000; }
.hdr__deco { position: absolute; left: 50%; top: 0; width: 460px; height: 100%; transform: translateX(-50%); pointer-events: none; }
.hdr__in { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 14px; height: 86px; }

.brand { position: relative; z-index: 1; display: flex; align-items: center; gap: 10px; min-width: 0; }
.brand__mark { width: 56px; height: 56px; flex: none; filter: drop-shadow(0 0 10px rgba(214, 169, 69, .25)); }
.brand__txt { display: flex; flex-direction: column; line-height: 1; min-width: 0; }
.brand__word { font-size: 36px; font-weight: 900; letter-spacing: -.035em; white-space: nowrap; }
.brand__word b { font-weight: 900; color: #fff; }
.brand__word i { font-style: normal; background: var(--gold-text); -webkit-background-clip: text; background-clip: text; color: transparent; }
.brand small { margin-top: 4px; font-size: 10.5px; font-weight: 700; color: #fff; letter-spacing: .02em; white-space: nowrap; }

.hdr__right { position: relative; z-index: 1; display: flex; align-items: center; gap: 9px; }
.sq { width: 36px; height: 36px; flex: none; display: grid; place-items: center; border-radius: 7px; color: #fff; transition: filter .15s; }
.sq:hover { filter: brightness(1.12); }
.sq .ico { width: 20px; height: 20px; }
.sq--gold { background: var(--gold-grad); color: #2a1a04; }
.sq--tg { background: linear-gradient(180deg, #45bdf2, #1b8fd0); }
.sq--wa { background: linear-gradient(180deg, #68e294, #23ad55); }
.hdr__right > .btn { height: 34px; padding: 0 18px; }

.lang__btn { display: flex; align-items: center; gap: 7px; height: 34px; padding: 0 6px; font-size: 13px; font-weight: 600; }
.lang__btn--plain { height: auto; }
.clock-box {
    height: 34px; padding: 0 12px; display: inline-flex; align-items: center; border-radius: 7px;
    background: var(--surface-2); border: 1px solid var(--line-2);
    font-size: 12.5px; font-weight: 600; font-variant-numeric: tabular-nums;
}
.kebab { position: relative; width: 34px; height: 34px; display: grid; place-items: center; border-radius: 7px; background: var(--surface-2); border: 1px solid var(--line-2); }
.kebab__badge {
    position: absolute; top: -6px; right: -6px; min-width: 17px; height: 17px; padding: 0 4px; border-radius: 9px;
    display: grid; place-items: center; background: var(--gold); color: #1b1205; font-size: 10px; font-weight: 800;
}
.hdr__search {
    width: 36px; height: 60px; display: grid; place-items: center; border-radius: 3px;
    background: var(--gold-grad); color: #1b1205; margin-right: -4px;
}
.hdr__search .ico { stroke-width: 2.4; }

/* Açılır menüler */
.dd { position: relative; }
.dd__menu {
    position: absolute; right: 0; top: calc(100% + 8px); z-index: 60; min-width: 220px; padding: 6px;
    display: none; flex-direction: column; gap: 2px;
    background: #121212; border: 1px solid var(--line-2); border-radius: 10px; box-shadow: 0 18px 40px rgba(0, 0, 0, .6);
}
.dd.is-open > .dd__menu { display: flex; }
.dd__menu > a, .dd__menu > button { display: flex; align-items: center; gap: 10px; padding: 9px 10px; border-radius: 6px; font-size: 13px; font-weight: 600; text-align: left; }
.dd__menu > a:hover, .dd__menu > button:hover, .dd__menu > .is-on { background: var(--surface-3); color: var(--gold-hi); }
.dd__menu .ico { color: var(--gold); }
.dd__menu--sm { min-width: 150px; }
.dd__menu--notify { width: 320px; }
.dd__title { padding: 6px 10px 8px; font-size: 12px; text-transform: uppercase; letter-spacing: .06em; color: var(--muted-2); border-bottom: 1px solid var(--line); margin-bottom: 4px; }
.ntf { align-items: flex-start !important; }
.ntf__ic { width: 30px; height: 30px; flex: none; display: grid; place-items: center; border-radius: 50%; background: #1f190d; }
.ntf b { display: block; font-size: 12.5px; color: #fff; }
.ntf small { display: block; margin-top: 2px; font-size: 11.5px; font-weight: 500; color: var(--muted-2); }
.ntf em { margin-left: auto; font-style: normal; font-size: 10.5px; color: var(--muted); white-space: nowrap; }

/* Menü şeridi */
.hdr__nav {
    position: relative;
    background: linear-gradient(180deg, #c9a24f 0%, #9b7a35 22%, #4b3816 58%, #0b0906 100%);
    border-top: 1px solid #f3d27c;
    box-shadow: inset 0 1px 0 rgba(255, 240, 190, .35);
}
.nav__in { display: flex; align-items: center; gap: 10px; }
.nav__list { display: flex; align-items: center; gap: 7px; flex: 1; min-width: 0; padding: 12px 4px 10px; overflow-x: auto; scrollbar-width: none; }
.nav__list::-webkit-scrollbar { display: none; }
.pill {
    position: relative; flex: none; display: inline-flex; align-items: center; gap: 7px;
    height: 36px; padding: 0 12px; border-radius: 7px;
    background: linear-gradient(180deg, #1d1d1d, #0c0c0c); border: 1px solid #4a4a4a;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .45);
    font-size: 13.5px; font-weight: 500; color: #fff; white-space: nowrap; transition: border-color .15s, background .15s;
}
.pill .ico { width: 17px; height: 17px; }
.pill:hover { border-color: var(--gold); }
.pill.is-on { background: linear-gradient(180deg, #e8c370, #a97b2c); border-color: #f3d27c; color: #1b1205; font-weight: 700; }
.pill__badge {
    position: absolute; top: -8px; right: -4px; padding: 1px 5px; border-radius: 3px;
    background: var(--red); color: #fff; font-size: 8px; font-weight: 800; font-style: normal; letter-spacing: .04em; line-height: 1.3;
}
.pill--promo {
    margin-left: 18px; padding-left: 30px;
    background: var(--gold-grad); border-color: #f3d27c; color: #2a1a04;
    font-weight: 900; text-transform: uppercase; letter-spacing: .02em;
}
.pill__coin {
    position: absolute; left: -20px; top: 50%; width: 42px; height: 42px; transform: translateY(-50%);
    display: grid; place-items: center; border-radius: 50%; color: #3a2606;
    background: radial-gradient(circle at 35% 30%, #fff1b0, #d9a443 48%, #7c5418);
    border: 2px solid #f6d98a; box-shadow: 0 2px 8px rgba(0, 0, 0, .5);
}
.pill__coin .ico { width: 19px; height: 19px; stroke-width: 2; }
.pill--more { text-transform: uppercase; font-weight: 600; }
.pill--more .ico { color: var(--gold); }

.subnav { display: flex; justify-content: center; gap: 34px; padding: 0 16px; background: #0a0a0a; border-bottom: 1px solid var(--line); overflow-x: auto; scrollbar-width: none; }
.subnav a { flex: none; padding: 11px 2px 9px; font-size: 14px; font-weight: 600; color: var(--muted); border-bottom: 2px solid transparent; }
.subnav a:hover { color: #fff; }
.subnav a.is-on { color: #fff; font-weight: 700; border-color: var(--gold); }

/* ==========================================================================
   Slider
   ========================================================================== */
.hero { position: relative; overflow: hidden; aspect-ratio: 1600 / 470; min-height: 230px; max-height: 560px; background: #080808; }
.hero--boxed { margin-top: 14px; aspect-ratio: 1328 / 400; border-radius: 12px; border: 1px solid rgba(214, 169, 69, .45); box-shadow: 0 20px 50px rgba(0, 0, 0, .5); }
.slide {
    position: absolute; inset: 0;
    display: grid; grid-template-columns: 18% minmax(0, 1fr) 26% 6%; align-items: center;
    opacity: 0; visibility: hidden; transition: opacity .7s, visibility .7s;
    background:
        radial-gradient(45% 80% at 76% 55%, rgba(214, 169, 69, .28), transparent 70%),
        radial-gradient(30% 60% at 10% 50%, rgba(214, 169, 69, .12), transparent 70%),
        linear-gradient(115deg, #050505 0%, #100c06 55%, #060606 100%);
}
.slide::after {
    content: ''; position: absolute; inset: 0; pointer-events: none;
    background:
        linear-gradient(125deg, transparent 47%, rgba(255, 255, 255, .035) 47.3%, transparent 47.6%),
        linear-gradient(60deg, transparent 63%, rgba(255, 255, 255, .03) 63.3%, transparent 63.6%),
        linear-gradient(160deg, transparent 30%, rgba(255, 255, 255, .025) 30.3%, transparent 30.6%);
}
.slide.is-on { opacity: 1; visibility: visible; }
.slide__deco { height: 100%; width: 100%; filter: drop-shadow(0 0 22px rgba(214, 169, 69, .25)); }
.slide__body { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; text-align: center; padding: 0 10px; }
.slide__kicker {
    margin-bottom: .45em; padding: .12em .7em; border: 2px solid var(--gold); border-radius: 8px;
    background: linear-gradient(#1a1309, #0c0905); font-size: clamp(15px, 2.3vw, 36px); font-weight: 900; line-height: 1.15;
}
.slide__line { display: block; font-size: clamp(20px, 3.6vw, 64px); font-weight: 900; line-height: 1.02; letter-spacing: -.01em; }
.hero--boxed .slide__line { font-size: clamp(18px, 3vw, 46px); }
.slide__line--gold { background: var(--gold-text); -webkit-background-clip: text; background-clip: text; color: transparent; filter: drop-shadow(0 3px 0 rgba(0, 0, 0, .55)); }
.slide__line--white { color: #fff; font-weight: 400; text-shadow: 0 3px 0 rgba(0, 0, 0, .5); }
.slide__line--white b { font-weight: 900; }
.slide__line--plus { color: #fff; font-size: clamp(16px, 2.2vw, 34px); line-height: 1.1; }
.slide__sub { margin-top: .9em; max-width: 34em; font-size: clamp(10px, 1.05vw, 15px); font-weight: 800; color: #fff; text-transform: uppercase; letter-spacing: .02em; }
.slide__cta { margin-top: 1.1em; height: clamp(30px, 2.8vw, 42px); padding: 0 clamp(14px, 1.8vw, 28px); font-size: clamp(10.5px, .95vw, 14px); }
.slide__trust { display: flex; align-items: center; gap: 8px; margin-top: 1.6em; font-size: clamp(8px, .7vw, 11px); font-weight: 600; color: var(--muted-2); white-space: nowrap; }
.slide__trust b { padding: 1px 5px; border: 1px solid var(--red); border-radius: 4px; color: #fff; }
.slide__trust i { width: 1px; height: 12px; background: var(--line-2); }
.slide__art { position: relative; z-index: 1; display: flex; align-items: center; justify-content: center; height: 100%; padding: 4% 0; }
.slide__art svg, .slide__art img { width: 100%; max-height: 100%; filter: drop-shadow(0 12px 30px rgba(0, 0, 0, .6)); }
.slide__art img { object-fit: contain; }
.slide__brand {
    position: relative; z-index: 1; height: 100%; padding: 40px 0 8px; display: flex; align-items: center; justify-content: center; overflow: hidden;
    background: linear-gradient(90deg, rgba(0, 0, 0, .25), rgba(214, 169, 69, .1)); border-left: 1px solid rgba(214, 169, 69, .25);
}
.slide__brand b {
    writing-mode: vertical-rl; transform: rotate(180deg);
    font-size: clamp(26px, 5.2vw, 84px); font-weight: 900; letter-spacing: -.04em; line-height: 1; white-space: nowrap;
    background: linear-gradient(90deg, #fff 0 40%, #e6b552 60%); -webkit-background-clip: text; background-clip: text; color: transparent;
}
.hero__ctrl { position: absolute; z-index: 3; right: 10px; top: 10px; display: flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 700; color: #fff; }
.hero__ctrl button { width: 22px; height: 22px; display: grid; place-items: center; border-radius: 50%; background: rgba(0, 0, 0, .55); border: 1px solid rgba(255, 255, 255, .25); }
.hero__ctrl .ico { width: 13px; height: 13px; stroke-width: 2.4; }
.hero__dots { position: absolute; z-index: 3; left: 50%; bottom: 10px; display: flex; gap: 6px; transform: translateX(-50%); }
.hero__dots button { width: 18px; height: 4px; border-radius: 2px; background: rgba(255, 255, 255, .3); transition: .2s; }
.hero__dots button.is-on { width: 28px; background: var(--gold); }

/* ==========================================================================
   Ana sayfa
   ========================================================================== */
.row-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 8px; }
.row-head h2 { display: flex; align-items: center; gap: 8px; font-size: 13.5px; font-weight: 800; }
.row-head--sec { margin-top: 30px; }
.row-head--sec h2 { text-transform: uppercase; letter-spacing: .03em; }
.more-link { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; font-weight: 700; color: var(--gold-hi); }
.live-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--red); box-shadow: 0 0 0 3px rgba(229, 56, 59, .25); animation: blink 1.2s infinite; }
@keyframes blink { 50% { opacity: .35; } }

.wins { margin-top: 18px; }
.tabs { display: flex; gap: 8px; }
.tab { flex: none; height: 32px; padding: 0 18px; border-radius: 999px; background: #232323; font-size: 13px; font-weight: 600; color: #e8e8e8; transition: background .15s; }
.tab:hover { background: #2e2e2e; }
.tab.is-on { background: #f2f2f2; color: #111; }
.wins__view { overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 2%, #000 98%, transparent); mask-image: linear-gradient(90deg, transparent, #000 2%, #000 98%, transparent); }
/* Kartlar sola doğru yavaşça kayar; liste iki kez basıldığı için yarı yolda başa döner, kesinti görünmez. Üzerine gelince durur. */
.wins__track { display: flex; gap: 12px; width: max-content; padding-right: 12px; animation: marquee 95s linear infinite; }
.wins__view:hover .wins__track { animation-play-state: paused; }
@keyframes marquee { to { transform: translateX(-50%); } }
.win { display: flex; align-items: center; gap: 11px; width: 248px; padding: 9px; border-radius: 10px; background: #1b1b1b; border: 1px solid #242424; transition: border-color .15s; }
.win:hover { border-color: var(--gold-lo); }
.win__thumb { width: 62px; height: 62px; flex: none; display: grid; place-items: center; border-radius: 7px; font-size: 32px; background: radial-gradient(circle at 50% 30%, rgba(255, 255, 255, .25), transparent 60%), linear-gradient(160deg, var(--c1), var(--c2)); }
.win__thumb .roulette { width: 44px; border-width: 3px; }
.win__info { display: grid; min-width: 0; line-height: 1.4; }
.win__user { font-size: 12.5px; color: #c9c9c9; }
.win__game { font-size: 14px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.win__amt { font-size: 14.5px; font-weight: 700; color: var(--gold); }

.quick { display: grid; grid-template-columns: repeat(11, minmax(0, 1fr)); gap: 4px; margin-top: 26px; }
.quick a { display: flex; flex-direction: column; align-items: center; gap: 9px; padding: 8px 2px; text-align: center; font-size: 14.5px; font-weight: 600; color: #fff; transition: transform .2s; }
.quick a:hover { transform: translateY(-3px); }
.qico { width: 68px; height: 68px; color: #f3d68b; filter: drop-shadow(0 4px 10px rgba(0, 0, 0, .55)); transition: color .2s, filter .2s; }
.quick a:hover .qico { color: #ffe6a3; filter: drop-shadow(0 0 14px rgba(243, 214, 139, .45)); }

.cats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px; margin-top: 24px; }
.cat {
    position: relative; overflow: hidden; height: 178px; padding: 0 22px 18px;
    display: flex; flex-direction: column; justify-content: center; align-items: flex-start;
    border-radius: 8px; border: 1px solid rgba(214, 169, 69, .6);
    box-shadow: inset 0 0 60px rgba(0, 0, 0, .55), 0 10px 26px rgba(0, 0, 0, .45);
}
/* Yazının arkasındaki silik halkalar */
.cat::before {
    content: ''; position: absolute; inset: 0; pointer-events: none;
    background: radial-gradient(circle at 22% 50%, transparent 0 18%, rgba(255, 255, 255, .045) 18% 19%, transparent 19% 30%, rgba(255, 255, 255, .035) 30% 31%, transparent 31%);
}
.cat--spor { background: radial-gradient(circle at 76% 55%, #2f9441 0, #11531d 34%, #072d0e 66%, #041a08); }
.cat--slot { background: radial-gradient(circle at 76% 55%, #a82222 0, #520b0b 40%, #230404 74%, #160202); }
.cat--mobil { background: radial-gradient(circle at 76% 55%, #3d3d3d 0, #181818 44%, #0a0a0a 76%); }
.cat--casino { background: radial-gradient(circle at 80% 55%, #8f6c22 0, #43300d 42%, #1a1306 76%, #100c04); }
.cat__t { position: relative; z-index: 1; font-size: clamp(30px, 3.1vw, 48px); font-weight: 900; line-height: .95; letter-spacing: -.01em; text-shadow: 0 4px 14px rgba(0, 0, 0, .65); }
.cat__t small { display: block; margin-top: 4px; font-size: .6em; }
.cat__btn {
    position: absolute; left: 22px; bottom: 20px; z-index: 1; height: 24px; padding: 0 18px;
    display: inline-flex; align-items: center; border-radius: 12px;
    background: rgba(0, 0, 0, .6); border: 1px solid rgba(214, 169, 69, .75); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12);
    font-size: 10px; font-weight: 700; letter-spacing: .02em; color: #fff; text-transform: uppercase;
}
.cat__btn::before { content: ''; position: absolute; top: -1px; left: 28%; right: 28%; height: 1px; background: linear-gradient(90deg, transparent, #fff, transparent); }
.cat__art { position: absolute; right: 10px; top: 50%; height: 86%; display: grid; place-items: center; transform: translateY(-50%); filter: drop-shadow(0 12px 20px rgba(0, 0, 0, .6)); transition: transform .3s; }
.cat:hover .cat__art { transform: translateY(-50%) scale(1.06); }
.cat__art--ball { right: 22px; top: 58%; height: auto; font-size: 94px; line-height: 1; filter: sepia(1) saturate(2.4) hue-rotate(-12deg) brightness(1.08) drop-shadow(0 12px 20px rgba(0, 0, 0, .6)); }
.cat__art--ball i { position: absolute; left: 50%; top: -42%; font-size: 54px; line-height: 1; font-style: normal; transform: translateX(-50%) rotate(-10deg); }
.cat__art--svg { right: -6px; height: 100%; }
.cat__art--svg svg { height: 100%; width: auto; }
.cat__art--phone { right: 26px; top: 60%; height: 118%; transform: translateY(-50%) rotate(14deg); }
.cat:hover .cat__art--phone { transform: translateY(-50%) rotate(14deg) scale(1.05); }
.cat__art--phone svg { height: 100%; width: auto; }
.cat__art--wheel { right: -30px; height: auto; width: 150px; }
.cat__art--wheel .roulette { animation: spin 40s linear infinite; }
.roulette--gold {
    background:
        radial-gradient(circle, #fff1b8 0 5%, #a8721f 5% 8%, #2a1a06 8% 28%, #e2b45a 28% 31%, #6b4a16 31% 46%, #e2b45a 46% 49%, transparent 49%),
        repeating-conic-gradient(#c4922f 0 9.73deg, #1d1407 9.73deg 19.46deg);
    border-color: #e2b45a;
}

.sec-title { position: relative; display: flex; align-items: center; justify-content: center; height: 24px; margin: 32px 0 14px; }
.sec-title::before {
    content: ''; position: absolute; inset: 0; border-radius: 2px;
    background: linear-gradient(90deg, transparent, rgba(141, 99, 34, .5) 14%, #e2b45a 50%, rgba(141, 99, 34, .5) 86%, transparent);
}
.sec-title h2 { position: relative; font-size: 12px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; color: #140d03; }
.sec-title__more { position: absolute; right: 0; display: inline-flex; align-items: center; gap: 4px; font-size: 10.5px; font-weight: 800; color: #fff; text-transform: uppercase; }

/* Öne çıkan etkinlikler */
.events { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 24px) / 3); gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; scroll-behavior: smooth; }
.events::-webkit-scrollbar { display: none; }
.ev { scroll-snap-align: start; padding: 10px; border-radius: 8px; background: var(--surface); border: 1px solid var(--line); }
.ev__lg { display: flex; align-items: center; gap: 7px; font-size: 11px; font-weight: 600; color: var(--muted-2); }
.ev__mid { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 6px; margin: 10px 0; }
.ev__team { display: flex; flex-direction: column; align-items: center; gap: 5px; font-size: 12px; font-weight: 700; text-align: center; }
.ev__time { text-align: center; font-size: 11.5px; font-weight: 800; }
.ev__time small { display: block; font-size: 10.5px; font-weight: 600; color: var(--muted); }
.odds { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
.odd {
    display: flex; flex-direction: column; align-items: center; gap: 1px; padding: 5px 0;
    border-radius: 6px; background: var(--surface-3); border: 1px solid #2a2a2a; transition: background .15s, border-color .15s;
}
.odd small { font-size: 9.5px; font-weight: 600; color: var(--muted); }
.odd b { font-size: 12.5px; font-weight: 800; }
.odd:hover { border-color: var(--gold-lo); }
.odd.is-on { background: var(--gold-grad); border-color: transparent; color: #1b1205; }
.odd.is-on small { color: #4a3510; }
.odd--row { padding: 7px 0; }
.odd.up b, .ob.up { color: var(--green); }
.odd.down b, .ob.down { color: var(--red); }
.odd.is-on.up b, .odd.is-on.down b, .ob.is-on.up, .ob.is-on.down { color: inherit; }

/* Canlı bahis tablosu */
.live { overflow: hidden; border-radius: 8px; background: var(--surface); border: 1px solid var(--line); }
.live__lg { display: flex; align-items: center; gap: 8px; padding: 8px 12px; background: var(--surface-2); border-bottom: 1px solid var(--line); font-size: 11.5px; font-weight: 700; color: var(--muted-2); }
.live__cols { margin-left: auto; display: grid; grid-template-columns: repeat(3, 60px) 44px; gap: 6px; text-align: center; font-size: 10.5px; color: var(--muted); }
.lrow { display: grid; grid-template-columns: 50px minmax(0, 1fr) 26px repeat(3, 60px) 44px; gap: 6px; align-items: center; padding: 7px 12px; border-bottom: 1px solid #191919; }
.live > .lrow:last-child { border-bottom: 0; }
.lrow__min { display: flex; align-items: center; gap: 5px; font-size: 11px; font-weight: 800; color: var(--red); }
.lrow__min::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--red); animation: blink 1.2s infinite; }
.lrow__teams { display: grid; min-width: 0; font-size: 12.5px; font-weight: 600; line-height: 1.5; }
.lrow__teams span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lrow__score { display: grid; text-align: center; font-size: 12.5px; font-weight: 800; color: var(--gold-hi); line-height: 1.5; }
.lrow__more { font-size: 11px; font-weight: 700; color: var(--muted-2); text-align: center; }
.lrow__more:hover { color: var(--gold-hi); }

/* Kombineler */
.combos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.combo { display: flex; flex-direction: column; gap: 10px; padding: 12px; border-radius: 8px; background: var(--surface); border: 1px solid var(--line); }
.combo__head { display: flex; align-items: center; justify-content: space-between; }
.combo__head h3 { font-size: 12.5px; font-weight: 800; }
.combo__bonus { padding: 3px 7px; border-radius: 4px; background: var(--gold-grad); color: #1b1205; font-size: 9.5px; font-weight: 900; }
.pick { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 10px; padding: 8px 0; border-bottom: 1px dashed #282828; font-size: 11.5px; }
.pick__match { font-weight: 700; }
.pick__date { font-size: 10.5px; color: var(--muted); text-align: right; }
.pick__mk { color: var(--muted-2); }
.pick__odd { text-align: right; }
.combo__tot, .combo__win { display: flex; justify-content: space-between; font-size: 11.5px; color: var(--muted-2); }
.combo__tot b { color: var(--gold-hi); }
.combo__win b { color: #fff; }
.inp {
    width: 100%; height: 38px; padding: 0 12px; border-radius: 7px; outline: none;
    background: #0a0a0a; border: 1px solid var(--line-2); font-size: 13px;
}
.inp:focus { border-color: var(--gold-lo); box-shadow: 0 0 0 3px rgba(214, 169, 69, .12); }
.inp--lg { height: 46px; font-size: 15px; padding-right: 44px; }
.warnbox { display: flex; align-items: center; gap: 7px; padding: 8px 9px; border-radius: 7px; background: rgba(214, 169, 69, .08); border: 1px solid rgba(214, 169, 69, .22); font-size: 11px; color: var(--muted-2); }
.warnbox .ico { width: 16px; height: 16px; color: var(--gold); }
.warnbox a { font-weight: 800; color: var(--gold-hi); }

/* Sosyal medya bandı */
.social {
    display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; align-items: center; gap: 20px;
    margin: 32px 0 6px; padding: 16px 22px; border-radius: 12px; border: 1px solid rgba(214, 169, 69, .45);
    background: radial-gradient(55% 140% at 48% 50%, rgba(214, 169, 69, .2), transparent 70%), linear-gradient(90deg, #0c0c0c, #16110a, #0c0c0c);
}
.social__mark { width: 60px; height: 60px; }
.social__txt span { display: block; font-size: 20px; font-weight: 500; }
.social__txt strong { display: block; font-size: 21px; font-weight: 900; }
.social__art { font-size: 54px; filter: drop-shadow(0 6px 14px rgba(0, 0, 0, .6)); }
.social__links { display: flex; gap: 8px; }
.slink { display: inline-flex; align-items: center; gap: 7px; height: 34px; padding: 0 13px; border-radius: 7px; background: #0b0b0b; border: 1px solid var(--gold-lo); font-size: 12px; font-weight: 700; }
.slink .ico { color: var(--gold); }
.slink:hover { border-color: var(--gold); }

/* ==========================================================================
   Oyun kartları ve lobi
   ========================================================================== */
.grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; }
.grid--lobby { gap: 14px; }
.gcard {
    position: relative; display: block; overflow: hidden; aspect-ratio: 250 / 175; border-radius: 6px; isolation: isolate;
    background: radial-gradient(circle at 50% 32%, rgba(255, 255, 255, .24), transparent 55%), linear-gradient(160deg, var(--c1), var(--c2));
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .06), 0 6px 16px rgba(0, 0, 0, .4);
    transition: transform .2s, box-shadow .2s;
}
.gcard--sq { aspect-ratio: 1 / .92; border-radius: 10px; }
.gcard:hover { transform: translateY(-3px); box-shadow: inset 0 0 0 1px rgba(245, 217, 133, .35), 0 10px 22px rgba(0, 0, 0, .5); }
.gcard::after { content: ''; position: absolute; inset: auto 0 0; height: 55%; z-index: 0; background: linear-gradient(transparent, rgba(0, 0, 0, .6)); pointer-events: none; }
.gcard img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.gcard--img::after, .gcard--img .gcard__name, .gcard--img .gcard__prov { display: none; }
.gcard__glyph { position: absolute; left: 0; right: 0; top: 13%; text-align: center; font-size: clamp(30px, 3.2vw, 52px); line-height: 1; filter: drop-shadow(0 6px 10px rgba(0, 0, 0, .45)); transition: transform .3s; }
.gcard--sq .gcard__glyph { top: 16%; font-size: clamp(34px, 3.8vw, 60px); }
.gcard:hover .gcard__glyph { transform: scale(1.1) rotate(-5deg); }
.gcard > .roulette { position: absolute; left: 50%; top: 9%; width: 42%; transform: translateX(-50%); }
.gcard--sq > .roulette { top: 12%; width: 48%; }
.gcard__name {
    position: absolute; left: 6px; right: 6px; bottom: 20px; z-index: 1; text-align: center;
    font-size: clamp(11px, 1.05vw, 15.5px); font-weight: 900; line-height: 1.02; text-transform: uppercase; color: #fff;
    text-shadow: 0 2px 0 rgba(0, 0, 0, .6), 0 0 12px rgba(0, 0, 0, .45);
}
.gcard__prov { position: absolute; left: 0; right: 0; bottom: 7px; z-index: 1; text-align: center; font-size: 8px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: rgba(255, 255, 255, .65); }
.gcard__users, .gcard__live {
    position: absolute; left: 7px; top: 7px; z-index: 2; height: 21px; padding: 0 7px 0 4px;
    display: flex; align-items: center; gap: 3px; border-radius: 11px; background: rgba(0, 0, 0, .68);
    font-size: 10.5px; font-weight: 800;
}
.gcard__users .ico { width: 14px; height: 14px; padding: 1px; border-radius: 50%; background: #2fbf5b; color: #062a0b; stroke-width: 2.6; }
.gcard__live { padding-left: 8px; gap: 5px; font-size: 9.5px; letter-spacing: .03em; }
.gcard__live::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--red); animation: blink 1.2s infinite; }
.gcard__tag { position: absolute; right: 7px; top: 7px; z-index: 2; height: 18px; padding: 0 7px; display: flex; align-items: center; border-radius: 4px; background: var(--red); font-size: 9.5px; font-weight: 800; }
.gcard__tag--yeni { background: #2f7be5; }
.gcard__tag--ozel, .gcard__tag--trend { background: #2fa23c; }
.gcard__tag--jackpot { background: var(--gold); color: #1b1205; }
.gcard__hover {
    position: absolute; inset: 0; z-index: 3; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 7px;
    background: rgba(0, 0, 0, .64); opacity: 0; transition: opacity .2s;
}
.gcard:hover .gcard__hover, .gcard:focus-visible .gcard__hover { opacity: 1; }
.gcard.is-pick { box-shadow: 0 0 0 3px var(--gold), 0 0 30px rgba(214, 169, 69, .6); }
.gcard__hover .btn { min-width: 84px; }

.jackpot {
    position: relative; overflow: hidden; margin: 16px 0 4px; padding: 14px 14px 18px; border-radius: 10px;
    background:
        radial-gradient(circle at 10% 72%, rgba(170, 30, 60, .5), transparent 16%),
        radial-gradient(circle at 26% 30%, rgba(120, 40, 150, .45), transparent 14%),
        radial-gradient(circle at 70% 36%, rgba(40, 100, 220, .5), transparent 15%),
        radial-gradient(circle at 93% 76%, rgba(60, 150, 40, .4), transparent 14%),
        linear-gradient(180deg, #1f2550, #141836);
}
.jackpot__tabs { display: flex; gap: 8px; }
.jackpot__tab { height: 34px; padding: 0 18px; border-radius: 5px; background: rgba(255, 255, 255, .09); font-size: 11px; font-weight: 800; letter-spacing: .08em; color: #cfd3ea; }
.jackpot__tab.is-on { background: #ececf2; color: #1d2245; }
.jackpot__title { margin: 6px 0 12px; text-align: center; font-size: 22px; font-weight: 500; letter-spacing: .03em; }
.jp-row { display: flex; align-items: center; justify-content: center; gap: 10px; padding: 9px 14px; border-radius: 6px; background: rgba(255, 255, 255, .07); }
.jp-row small { display: block; font-size: 11px; font-weight: 600; color: #c9cbe0; letter-spacing: .06em; }
.jp-row b { font-size: 15px; font-weight: 800; font-variant-numeric: tabular-nums; }
.jp-row--top b { font-size: 18px; color: var(--gold-hi); }
.jp-medal { font-size: 26px; line-height: 1; }
.jp-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 10px; }
.jp-grid .jp-row { justify-content: flex-start; }
.jackpot__more { display: table; margin: 14px auto 0; height: 34px; padding: 0 20px; line-height: 34px; border-radius: 5px; background: #2c3260; font-size: 11px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.jackpot__more:hover { background: #3a4180; }

.chips-wrap { position: relative; margin: 16px 0 12px; }
.chips { display: flex; gap: 8px; padding: 10px 48px 4px 2px; overflow-x: auto; scrollbar-width: none; scroll-behavior: smooth; }
.chips::-webkit-scrollbar { display: none; }
.chip {
    position: relative; flex: none; display: inline-flex; align-items: center; gap: 7px; height: 40px; padding: 0 17px;
    border-radius: 999px; background: var(--surface-2); border: 1px solid #272727; font-size: 13.5px; font-weight: 500; white-space: nowrap;
    transition: border-color .15s;
}
.chip .ico { width: 18px; height: 18px; color: #d3d3d3; }
.chip:hover { border-color: #444; }
.chip.is-on { border-color: var(--gold); background: linear-gradient(#211a0d, #141009); }
.chip.is-on .ico { color: var(--gold-hi); }
.chip__tag { position: absolute; top: -9px; right: 14px; padding: 1px 6px; border-radius: 4px; background: var(--red); font-size: 8.5px; font-weight: 800; font-style: normal; line-height: 1.4; }
.chip__tag--ozel { background: #2fa23c; }
.chip__tag--jackpot { background: var(--gold); color: #1b1205; }
.chips-next {
    position: absolute; right: 0; top: 10px; width: 40px; height: 40px; display: grid; place-items: center; border-radius: 50%;
    background: var(--surface-2); border: 1px solid #2a2a2a; box-shadow: -18px 0 18px 4px var(--bg);
}

.gsearch { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(220px, 30%); gap: 12px; margin: 14px 0 18px; }
.gsearch__inp { position: relative; display: block; }
.gsearch__inp input { width: 100%; height: 44px; padding: 0 46px 0 18px; border-radius: 10px; outline: none; background: var(--surface-2); border: 1px solid #222; font-size: 14px; }
.gsearch__inp input:focus { border-color: var(--gold-lo); }
.gsearch__inp .ico { position: absolute; right: 16px; top: 50%; transform: translateY(-50%); color: var(--muted-2); }
.gbtn { height: 44px; padding: 0 20px; display: inline-flex; align-items: center; gap: 9px; border-radius: 10px; background: var(--surface-2); border: 1px solid #222; font-size: 14px; font-weight: 500; white-space: nowrap; }
.gbtn:hover { border-color: #3a3a3a; }
.gbtn--provs { width: 100%; color: var(--muted-2); }
.gbtn--sm { height: 32px; padding: 0 12px; font-size: 12px; border-radius: 7px; }
.provs__menu { left: 0; right: 0; min-width: 0; max-height: 360px; overflow: auto; }
.provs__menu label { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 6px; font-size: 13px; cursor: pointer; }
.provs__menu label:hover { background: var(--surface-3); }
.provs__menu label small { margin-left: auto; color: var(--muted); }
.provs__menu input { width: 16px; height: 16px; accent-color: var(--gold); }
.provs__count { padding: 1px 7px; border-radius: 9px; background: var(--gold); color: #1b1205; font-size: 10.5px; font-weight: 800; font-style: normal; }
.provs__clear { margin-top: 4px; padding: 8px; border-top: 1px solid var(--line); font-size: 12px; font-weight: 700; color: var(--gold-hi); text-align: center !important; justify-content: center; }
.empty { padding: 50px 16px; text-align: center; color: var(--muted); }
.more-btn { display: flex; margin: 22px auto 0; height: 40px; padding: 0 28px; }

/* ==========================================================================
   Spor
   ========================================================================== */
.panel { background: #0e0e0e; border: 1px solid var(--line); border-radius: 8px; }
.sb { display: grid; grid-template-columns: 262px minmax(0, 1fr) 300px; gap: 12px; align-items: start; padding-top: 12px; }
.sb__side, .sb__slip { position: sticky; top: 10px; max-height: calc(100vh - 20px); overflow: auto; scrollbar-width: thin; scrollbar-color: #333 transparent; }
.sb__side { padding: 10px 0 6px; }
.side-search { position: relative; display: block; margin: 0 10px; }
.side-search input { width: 100%; height: 34px; padding: 0 34px 0 12px; border-radius: 6px; outline: none; background: var(--surface-2); border: 1px solid var(--line-2); font-size: 12px; }
.side-search input:focus { border-color: var(--gold-lo); }
.side-search .ico { position: absolute; right: 10px; top: 50%; width: 15px; height: 15px; transform: translateY(-50%); color: var(--muted); }
.seg { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; margin: 8px 10px; }
.seg button { height: 30px; border-radius: 5px; background: var(--surface-3); font-size: 11px; font-weight: 700; color: var(--muted-2); text-transform: uppercase; }
.seg button.is-on { background: var(--gold-grad); color: #1b1205; }
.side-tools { display: flex; gap: 6px; margin: 0 10px 8px; }
.side-sel { flex: 1; height: 30px; padding: 0 8px; border-radius: 5px; outline: none; background: var(--surface-3); border: 1px solid var(--line-2); font-size: 11.5px; font-weight: 600; }
.tree { border-top: 1px solid var(--line); }
.tree__sep { padding: 10px 12px 6px; font-size: 10.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.trow { width: 100%; height: 34px; padding: 0 10px 0 12px; display: flex; align-items: center; gap: 8px; border-bottom: 1px solid #181818; font-size: 12.5px; text-align: left; }
.trow:hover { background: #151515; }
.trow.is-on { background: #1a150b; box-shadow: inset 2px 0 0 var(--gold); }
.trow__ic { width: 18px; flex: none; display: grid; place-items: center; font-size: 14px; }
.trow__n { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.trow__c { font-size: 10.5px; font-weight: 700; color: var(--muted); }
.trow__c--hot { padding: 1px 6px; border-radius: 4px; background: #2fa23c; color: #fff; }
.trow .chev { width: 14px; height: 14px; color: var(--muted); transition: transform .2s; }
.trow.is-open .chev { transform: rotate(90deg); }
.trow--hl { font-size: 11.5px; font-weight: 700; text-transform: uppercase; }
.trow--gold { color: var(--gold-hi); }
.tsub { display: none; background: #0a0a0a; }
.trow.is-open + .tsub { display: block; }
.tsub .trow { padding-left: 22px; font-size: 12px; }

.sb__main { min-height: 480px; overflow: hidden; }
.sb__head { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-bottom: 1px solid var(--line); }
.sb__title { font-size: 14px; font-weight: 800; }
.sb__note { margin-left: auto; font-size: 11px; color: var(--muted); }
.sb__sidebtn { display: none; }
.sb__body { display: grid; grid-template-columns: minmax(0, 1fr) 340px; }
.sb__list { min-width: 0; }
.sb__detail { border-left: 1px solid var(--line); }
.lg__head { display: flex; align-items: center; gap: 8px; padding: 8px 12px; background: var(--surface-2); border-bottom: 1px solid var(--line); font-size: 11.5px; font-weight: 700; color: var(--muted-2); }
.lg__cols { margin-left: auto; display: grid; grid-template-columns: repeat(3, 52px) 36px; gap: 5px; text-align: center; font-size: 10px; color: var(--muted); }
.ev-row { display: grid; grid-template-columns: 52px minmax(0, 1fr) repeat(3, 52px) 36px; gap: 5px; align-items: center; padding: 7px 12px; border-bottom: 1px solid #181818; cursor: pointer; }
.ev-row:hover { background: #131313; }
.ev-row.is-sel { background: #17130a; box-shadow: inset 2px 0 0 var(--gold); }
.ev-row__time { font-size: 10.5px; color: var(--muted-2); line-height: 1.35; }
.ev-row__time b { display: block; color: #fff; font-size: 11.5px; }
.ev-row__time--live { color: var(--red); font-weight: 800; }
.ev-row__teams { display: grid; min-width: 0; font-size: 12.5px; font-weight: 600; line-height: 1.5; }
.ev-row__teams span { display: flex; justify-content: space-between; gap: 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ev-row__teams em { font-style: normal; font-weight: 800; color: var(--gold-hi); }
.ev-row__more { font-size: 10.5px; font-weight: 700; color: var(--muted-2); text-align: center; }
.ev-row--out { grid-template-columns: 80px minmax(0, 1fr) auto; }
.ev-row--out .ev-row__more { color: var(--gold-hi); }
.ob { height: 34px; border-radius: 5px; background: var(--surface-3); border: 1px solid #292929; font-size: 12.5px; font-weight: 800; transition: background .15s, border-color .15s; }
.ob:hover { border-color: var(--gold-lo); }
.ob.is-on { background: var(--gold-grad); border-color: transparent; color: #1b1205; }
.ob s { display: block; font-size: 9.5px; font-weight: 600; color: var(--muted); }
.boost { display: grid; grid-template-columns: minmax(0, 1fr) 90px; gap: 10px; align-items: center; padding: 10px 12px; border-bottom: 1px solid #181818; }
.boost__m { font-size: 12.5px; font-weight: 700; }
.boost__m small { display: block; margin-top: 2px; font-size: 11px; font-weight: 500; color: var(--muted-2); }
.boost__m i { font-style: normal; color: var(--gold-hi); }
.boost .ob { height: 40px; line-height: 1.1; }
.sb-combos { display: grid; gap: 12px; padding: 12px; }
.sb-empty { padding: 60px 20px; text-align: center; color: var(--muted); font-size: 13px; }
.sb-empty b { display: block; margin-bottom: 6px; font-size: 30px; }

.det__hero {
    position: relative; min-height: 132px; padding: 12px; display: flex; flex-direction: column; justify-content: space-between;
    background: radial-gradient(circle at 82% 22%, rgba(255, 255, 255, .14), transparent 38%), linear-gradient(140deg, #0f4a24, #072212 62%, #0a0a0a);
}
.det__lg { display: flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 600; color: #d5e8da; }
.det__vs { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 6px; text-align: center; font-size: 12.5px; font-weight: 800; }
.det__vs .ev__team { font-size: 12px; }
.det__vs > b { font-size: 12px; color: #fff; }
.det__vs > b small { display: block; font-weight: 600; color: #cfd; }
.det__title { font-size: 16px; font-weight: 800; }
.det__tools { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-bottom: 1px solid var(--line); font-size: 12px; font-weight: 700; color: var(--muted-2); }
.det__tools .ico { color: var(--muted); }
.det__tools span { padding: 4px 12px; border-radius: 5px; background: var(--surface-3); color: #fff; }
.mkt { border-bottom: 1px solid var(--line); }
.mkt__head { width: 100%; display: flex; align-items: center; justify-content: space-between; padding: 9px 12px; background: var(--surface-2); font-size: 12px; font-weight: 700; }
.mkt__head .ico { width: 14px; height: 14px; transition: transform .2s; }
.mkt.is-closed .mkt__head .ico { transform: rotate(180deg); }
.mkt.is-closed .mkt__grid { display: none; }
.mkt__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 5px; padding: 8px 10px; }
.mkt__grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.sel { display: flex; align-items: center; justify-content: space-between; gap: 6px; height: 34px; padding: 0 10px; border-radius: 5px; background: var(--surface-3); border: 1px solid #292929; font-size: 11.5px; }
.sel span { min-width: 0; color: var(--muted-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sel b { color: var(--gold-hi); font-weight: 800; }
.sel:hover { border-color: var(--gold-lo); }
.sel.is-on { background: var(--gold-grad); border-color: transparent; }
.sel.is-on span, .sel.is-on b { color: #1b1205; }

.slip__team { padding: 12px; border-bottom: 1px solid var(--line); }
.slip__team strong { display: block; margin-bottom: 9px; font-size: 12px; font-weight: 800; letter-spacing: .04em; }
.slip__tabs { display: flex; border-bottom: 1px solid var(--line); }
.slip__tabs button { flex: 1; height: 38px; display: flex; align-items: center; justify-content: center; gap: 6px; font-size: 12px; font-weight: 800; text-transform: uppercase; color: var(--muted); border-bottom: 2px solid transparent; }
.slip__tabs .is-on { color: var(--gold-hi); border-color: var(--gold); }
.slip__tabs em { min-width: 18px; height: 18px; padding: 0 5px; display: grid; place-items: center; border-radius: 9px; background: var(--gold); color: #1b1205; font-size: 10px; font-style: normal; }
.slip__opt { display: flex; align-items: center; gap: 6px; padding: 8px 12px; font-size: 11px; color: var(--muted-2); }
.slip__opt .side-sel { flex: 1; }
.slip__empty { padding: 26px 16px; text-align: center; font-size: 11.5px; color: var(--muted); }
.slip__empty .ico { width: 40px; height: 40px; margin: 0 auto 8px; display: block; color: #3a3a3a; stroke-width: 1.3; }
.slip__empty b { display: block; margin-bottom: 4px; font-size: 13px; color: var(--muted-2); }
.si { position: relative; padding: 9px 34px 9px 12px; border-bottom: 1px solid #1b1b1b; font-size: 11.5px; }
.si__match { display: block; font-weight: 700; }
.si__mk { display: block; margin-top: 2px; color: var(--muted-2); }
.si__odd { position: absolute; right: 34px; bottom: 9px; font-weight: 800; color: var(--gold-hi); }
.si__x { position: absolute; right: 8px; top: 8px; width: 20px; height: 20px; display: grid; place-items: center; border-radius: 50%; color: var(--muted); }
.si__x:hover { background: var(--surface-3); color: #fff; }
.si__x .ico { width: 13px; height: 13px; }
.slip__foot { display: grid; gap: 8px; padding: 10px 12px; }
.slip__row { display: flex; justify-content: space-between; font-size: 12px; color: var(--muted-2); }
.slip__row b { color: #fff; font-weight: 800; }
.slip__quick { display: grid; grid-template-columns: repeat(4, 1fr); gap: 5px; }
.slip__quick button { height: 26px; border-radius: 5px; background: var(--surface-3); border: 1px solid #2a2a2a; font-size: 11px; font-weight: 700; }
.slip__quick button:hover { border-color: var(--gold-lo); }
.slip__clear { font-size: 11px; font-weight: 700; color: var(--muted); text-decoration: underline; justify-self: start; }
.warnbox--slip { margin: 0 12px; }
.slip__bet { width: calc(100% - 24px); margin: 10px 12px 12px; }
.promo-card { margin-top: 12px; display: flex; align-items: center; gap: 10px; padding: 10px; border-radius: 8px; background: linear-gradient(135deg, #1e46a8, #0b1640); border: 1px solid #2a4aa0; }
.promo-card__art { font-size: 34px; }
.promo-card__txt { flex: 1; min-width: 0; }
.promo-card b { display: block; font-size: 13px; }
.promo-card small { font-size: 11px; color: #c9d4f5; }
.slipbar { display: none; }

/* ==========================================================================
   VIP destek
   ========================================================================== */
.pagebox { margin: 22px 0 10px; padding: 26px 40px 40px; border-radius: 10px; background: #0b0b0b; border: 1px solid var(--line); }
.pagebox__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 22px; }
.pagebox__head h1 { display: flex; align-items: center; gap: 14px; font-size: 16px; font-weight: 700; letter-spacing: .02em; }
.pagebox__head h1 a { display: grid; place-items: center; }
.vipbox { padding: 18px 12px 16px; border-radius: 16px; background: linear-gradient(#121212 0 64%, #b8933f 64%); }
.vipbox__title { display: grid; place-items: center; height: 42px; border: 1px solid #333; border-radius: 8px; background: #0a0a0a; font-size: 18px; font-weight: 900; }
.vipbtn {
    display: flex; align-items: center; justify-content: center; gap: 8px; height: 48px; margin-top: 9px; border-radius: 14px;
    background: linear-gradient(180deg, #e6bd52, #b58a2a); color: #1b1205; font-size: 15px; font-weight: 600;
    box-shadow: inset 0 1px 0 rgba(255, 240, 190, .6), 0 4px 0 rgba(0, 0, 0, .35); transition: filter .15s;
}
.vipbtn:hover { filter: brightness(1.08); }
.vipnote { margin-top: 16px; padding: 18px; border-radius: 10px; background: #4a3c22; text-align: center; font-size: 13.5px; line-height: 1.7; }
.vipnote strong { display: block; margin-bottom: 4px; color: var(--gold-hi); }
.vipnote p + p { margin-top: 12px; }

/* ==========================================================================
   Alt bilgi
   ========================================================================== */
.ftr { position: relative; margin-top: 44px; overflow: hidden; background: #040404; border-top: 1px solid var(--line); }
.ftr::before {
    content: ''; position: absolute; inset: 0; pointer-events: none;
    background-image: radial-gradient(rgba(255, 255, 255, .08) 1px, transparent 1.5px); background-size: 9px 9px;
    -webkit-mask-image: radial-gradient(90% 55% at 25% 75%, #000, transparent 70%); mask-image: radial-gradient(90% 55% at 25% 75%, #000, transparent 70%);
}
.ftr > .wrap { position: relative; }
.ftr__top { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 24px 0 20px; border-bottom: 1px solid var(--line); }
.socials { display: flex; gap: 10px; }
.soc { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 9px; color: #fff; transition: transform .15s; }
.soc:hover { transform: translateY(-2px); }
.soc .ico { width: 22px; height: 22px; }
.soc--ig { background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fd5949 45%, #d6249f 60%, #285aeb 90%); }
.soc--x { background: #1a1a1a; border: 1px solid #3a3a3a; }
.soc--yt { background: #e62117; }
.soc--tg { background: #229ed9; }
.soc--wa { background: #25d366; }
.ftr__tools { display: flex; align-items: center; gap: 14px; }
.ftr__cols { display: grid; grid-template-columns: 1.2fr 1fr 1.1fr .9fr 1fr 1.4fr; gap: 24px; padding: 32px 50px 10px; }
.ftr h4 { margin-bottom: 14px; font-size: 12px; font-weight: 800; letter-spacing: .02em; }
.ftr__cols a, .ftr__sub a { display: block; padding: 5px 0; font-size: 12px; color: #a3a3a3; }
.ftr__cols a:hover, .ftr__sub a:hover { color: var(--gold-hi); }
.ftr__sub { display: flex; justify-content: center; gap: 90px; padding: 24px 0 10px; }
.apps { padding: 30px 0 10px; text-align: center; }
.apps h4 { font-size: 11px; letter-spacing: .14em; color: var(--muted-2); }
.apps__grid { display: inline-grid; grid-template-columns: repeat(3, 160px); gap: 12px 24px; }
.app {
    display: flex; align-items: center; gap: 10px; height: 50px; padding: 0 12px; border-radius: 6px; text-align: left;
    background: linear-gradient(180deg, #232323, #121212); border: 2px solid #a8853e; transition: border-color .15s;
}
.app:hover { border-color: var(--gold-hi); }
.app .ico { width: 30px; height: 30px; color: var(--ac); stroke-width: 1.6; }
.app small { display: block; font-size: 10.5px; font-weight: 600; color: var(--gold-hi); }
.app b { display: block; font-size: 17px; font-weight: 900; line-height: 1.05; text-transform: uppercase; letter-spacing: -.01em; }
.trust { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 14px 30px; padding: 26px 0 18px; }
.trust__18 { width: 46px; height: 46px; display: grid; place-items: center; border-radius: 50%; border: 2px solid var(--red); font-size: 14px; font-weight: 900; }
.trust__18--sm { width: 26px; height: 26px; font-size: 9px; border-width: 1.5px; color: #d1236f; border-color: #d1236f; }
.trust__item { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 700; color: #d9d9d9; }
.trust__item .ico { width: 24px; height: 24px; color: var(--gold); }
.legal { max-width: 920px; margin: 0 auto; padding: 14px 0 22px; border-top: 1px solid var(--line); text-align: center; font-size: 12px; line-height: 1.8; color: var(--muted-2); }
.pays { padding: 10px 0 20px; text-align: center; }
.pays h4 { font-size: 11px; letter-spacing: .14em; color: var(--muted-2); }
.pays__row { display: flex; align-items: center; gap: 8px; padding: 8px; border-radius: 6px; background: #0d0d0d; }
.pays__track { flex: 1; display: flex; gap: 26px; overflow-x: auto; scrollbar-width: none; scroll-behavior: smooth; padding: 6px 4px; }
.pays__track::-webkit-scrollbar { display: none; }
.pay { flex: none; display: flex; align-items: center; gap: 8px; text-align: left; }
.pay i { width: 26px; height: 26px; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #fff8, transparent 40%), var(--pc); box-shadow: 0 0 0 2px rgba(255, 255, 255, .08); }
.pay b { display: block; font-size: 11.5px; font-weight: 900; text-transform: uppercase; line-height: 1.1; }
.pay small { display: block; font-size: 9.5px; font-weight: 700; color: var(--muted-2); }
.arrow { width: 28px; height: 28px; flex: none; display: grid; place-items: center; border-radius: 50%; background: var(--surface-2); border: 1px solid var(--line-2); color: var(--muted-2); }
.arrow:hover { color: var(--gold-hi); border-color: var(--gold-lo); }
.arrow .ico { width: 15px; height: 15px; stroke-width: 2.2; }
.arrows { display: flex; gap: 6px; }
.ftr__bottom { display: flex; align-items: center; justify-content: space-between; padding: 16px 0 22px; border-top: 1px solid var(--line); font-size: 12px; color: var(--muted-2); }

/* ---------- Sabit butonlar, alt menü ---------- */
.fab {
    position: fixed; right: 18px; bottom: 18px; z-index: 45; width: 54px; height: 54px; display: grid; place-items: center;
    border-radius: 50%; background: var(--gold-grad); color: #1b1205; box-shadow: 0 8px 24px rgba(214, 169, 69, .35);
}
.fab .ico { width: 26px; height: 26px; stroke-width: 2; }
.totop {
    position: fixed; left: 50%; bottom: 14px; z-index: 44; width: 40px; height: 40px; display: grid; place-items: center;
    border-radius: 50%; background: rgba(30, 30, 30, .85); border: 1px solid var(--line-2); color: #fff;
    transform: translate(-50%, 80px); transition: transform .25s;
}
.totop.is-on { transform: translate(-50%, 0); }
.bnav { display: none; }

/* ---------- Açılır pencereler ---------- */
.modal { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 16px; background: rgba(0, 0, 0, .74); backdrop-filter: blur(4px); }
.modal__box {
    position: relative; width: 100%; max-width: 410px; max-height: calc(100vh - 32px); overflow: auto;
    padding: 26px 22px 22px; border-radius: 12px; background: #0f0f0f; border: 1px solid var(--line-2); border-top: 3px solid var(--gold);
    animation: pop .2s ease;
}
@keyframes pop { from { transform: translateY(10px); opacity: 0; } }
.modal--wide .modal__box { max-width: 900px; }
.modal__x { position: absolute; right: 10px; top: 10px; width: 32px; height: 32px; display: grid; place-items: center; border-radius: 50%; color: var(--muted-2); }
.modal__x:hover { background: var(--surface-3); color: #fff; }
.modal__logo { display: block; width: 56px; height: 56px; margin: 0 auto 6px; }
.modal h3 { margin-bottom: 18px; text-align: center; font-size: 17px; font-weight: 800; }
.modal__txt { text-align: center; color: var(--muted-2); font-size: 13px; }
.form { display: grid; gap: 11px; }
.form label > span { display: block; margin-bottom: 5px; font-size: 11.5px; font-weight: 600; color: var(--muted-2); }
.form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.form__link { justify-self: end; font-size: 12px; color: var(--gold-hi); }
.form__alt { text-align: center; font-size: 12.5px; color: var(--muted-2); }
.form__alt a { font-weight: 700; color: var(--gold-hi); }
.check { display: flex !important; align-items: flex-start; gap: 9px; font-size: 11.5px; color: var(--muted-2); }
.check > span { margin: 0 !important; font-weight: 500 !important; }
.check input { width: 16px; height: 16px; margin-top: 1px; flex: none; accent-color: var(--gold); }
.grid--search { grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 16px; }
.grid--search:empty::before { content: attr(data-msg); grid-column: 1 / -1; padding: 30px; text-align: center; color: var(--muted); }
.promos { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.promo { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 18px 12px; border-radius: 10px; text-align: center; background: linear-gradient(180deg, #1a150b, #0d0d0d); border: 1px solid rgba(214, 169, 69, .35); }
.promo > b { font-size: 34px; font-weight: 900; line-height: 1; }
.promo strong { font-size: 13.5px; }
.promo p { flex: 1; font-size: 12px; color: var(--muted-2); }
.sheet { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 20px; }
.sheet a { display: flex; flex-direction: column; align-items: center; gap: 7px; padding: 14px 6px; border-radius: 10px; background: var(--surface-2); border: 1px solid var(--line); text-align: center; font-size: 11.5px; font-weight: 600; }
.sheet .ico { width: 26px; height: 26px; color: var(--gold); }

.toast {
    position: fixed; left: 50%; bottom: 26px; z-index: 200; max-width: calc(100% - 32px); padding: 11px 18px;
    border-radius: 9px; background: #171717; border: 1px solid var(--gold-lo); box-shadow: 0 10px 30px rgba(0, 0, 0, .5);
    font-size: 13px; font-weight: 600; opacity: 0; pointer-events: none; transform: translate(-50%, 20px); transition: opacity .25s, transform .25s;
}
.toast.is-on { opacity: 1; transform: translate(-50%, 0); }

body.no-scroll { overflow: hidden; }

/* ==========================================================================
   Duyarlı düzen
   ========================================================================== */
@media (max-width: 1360px) {
    .hide-lg { display: none !important; }
    .sb { grid-template-columns: 236px minmax(0, 1fr) 280px; }
    .sb__body { grid-template-columns: minmax(0, 1fr); }
    .sb__detail { border-left: 0; border-top: 1px solid var(--line); }
    .sb__detail:empty { display: none; }
}
@media (max-width: 1200px) {
    .grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
    .hide-md { display: none !important; }
    .ftr__cols { grid-template-columns: repeat(3, minmax(0, 1fr)); padding: 28px 0 6px; }
    .quick { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 104px; overflow-x: auto; scrollbar-width: none; }
    .qico { width: 58px; height: 58px; }
    .cats { gap: 14px; }
    .quick::-webkit-scrollbar { display: none; }
}
@media (max-width: 1024px) {
    .hdr__deco { display: none; }
    .grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .cats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .events { grid-auto-columns: calc((100% - 12px) / 2); }
    .combos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .social { grid-template-columns: auto minmax(0, 1fr); }
    .social__art { display: none; }
    .social__links { grid-column: 1 / -1; flex-wrap: wrap; }
    .promos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .gsearch { grid-template-columns: minmax(0, 1fr) auto auto; }
    .gbtn--provs { width: auto; }
    .provs__menu { left: auto; width: 280px; }

    .sb { grid-template-columns: minmax(0, 1fr); }
    .sb__side { position: fixed; left: 0; top: 0; bottom: 0; z-index: 90; width: 290px; max-height: none; border-radius: 0; transform: translateX(-105%); transition: transform .25s; box-shadow: 20px 0 40px rgba(0, 0, 0, .6); }
    .sb.is-side-open .sb__side { transform: none; }
    .sb__sidebtn { display: inline-flex; }
    .sb__slip { position: static; max-height: none; }
    .slipbar {
        position: fixed; left: 12px; right: 12px; bottom: 74px; z-index: 44; height: 46px; padding: 0 16px;
        display: flex; align-items: center; gap: 10px; border-radius: 10px;
        background: var(--gold-grad); color: #1b1205; font-weight: 800; box-shadow: 0 10px 26px rgba(0, 0, 0, .5);
    }
    .slipbar em { min-width: 20px; height: 20px; display: grid; place-items: center; border-radius: 10px; background: #1b1205; color: var(--gold-hi); font-size: 11px; font-style: normal; }
    .slipbar b { margin-left: auto; }
}
@media (max-width: 900px) {
    .slide { grid-template-columns: minmax(0, 1fr) 36%; }
    .slide__deco, .slide__brand { display: none; }
    .slide__body { padding-left: 16px; }
    /* min-height + aspect-ratio birlikte genişliği büyütüp taşırıyor; mobilde sabit yükseklik */
    .hero, .hero--boxed { aspect-ratio: auto; min-height: 0; max-height: none; height: clamp(200px, 54vw, 420px); }
    .hero__ctrl { right: 8px; }
    .slide__trust { display: none; }
}
@media (max-width: 768px) {
    body { padding-bottom: 64px; }
    .bnav {
        position: fixed; left: 0; right: 0; bottom: 0; z-index: 46; height: 64px; padding-bottom: env(safe-area-inset-bottom);
        display: grid; grid-template-columns: repeat(5, 1fr);
        background: rgba(8, 8, 8, .97); border-top: 1px solid var(--line-2); backdrop-filter: blur(8px);
    }
    .bnav > a, .bnav > button { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; font-size: 10px; font-weight: 600; color: var(--muted-2); }
    .bnav .ico { width: 22px; height: 22px; color: var(--gold); }
    .bnav .is-on { color: #fff; }
    .bnav__center > span { width: 46px; height: 46px; margin-top: -24px; display: grid; place-items: center; border-radius: 50%; background: var(--gold-grad); box-shadow: 0 0 0 4px #080808; }
    .bnav__center .ico { color: #1b1205; }
    .fab { bottom: 78px; width: 48px; height: 48px; }
    .totop { bottom: 78px; }
    .toast { bottom: 84px; }
    .slipbar { bottom: 74px; right: 74px; }
    .hdr__in { height: 64px; }
    .brand__mark { width: 40px; height: 40px; }
    .brand__word { font-size: 25px; }
    .brand small { display: none; }
    .hdr__right { gap: 7px; }
    .hdr__right > .btn { height: 32px; padding: 0 12px; font-size: 11.5px; }
    .hdr__search { height: 44px; width: 32px; }
    .hide-sm { display: none !important; }
    .wins .row-head { flex-wrap: wrap; }
    .tabs { max-width: 100%; overflow-x: auto; scrollbar-width: none; }
    .pill { height: 32px; font-size: 12.5px; padding: 0 11px; }
    .pill--more { display: none; }
    .subnav { justify-content: flex-start; gap: 22px; }
    .subnav a { font-size: 13px; }
    .grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
    .grid--lobby { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
    .grid--search { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .cat { height: 124px; padding: 0 14px 14px; }
    .cat__t { font-size: 26px; }
    .cat__btn { left: 14px; bottom: 12px; height: 20px; padding: 0 12px; font-size: 8.5px; }
    .cat__art { right: 4px; }
    .cat__art--ball { font-size: 60px; right: 12px; top: 60%; }
    .cat__art--ball i { font-size: 34px; }
    .cat__art--phone { right: 14px; }
    .cat__art--wheel { width: 100px; right: -24px; }
    .quick { grid-auto-columns: 84px; }
    .quick a { font-size: 12px; }
    .qico { width: 48px; height: 48px; }
    .win { width: 210px; }
    .win__thumb { width: 50px; height: 50px; font-size: 26px; }
    .notice { padding: 9px 40px 9px 10px; }
    .notice__msg { padding: 7px 10px; font-size: 12px; }
    .notice__x { right: 4px; top: 50%; transform: translateY(-50%); }
    .events { grid-auto-columns: 86%; }
    .combos { grid-template-columns: minmax(0, 1fr); }
    .lrow { grid-template-columns: 40px minmax(0, 1fr) 20px repeat(3, 48px); padding: 7px 10px; }
    .live__cols { grid-template-columns: repeat(3, 48px); }
    .ev-row { grid-template-columns: 44px minmax(0, 1fr) repeat(3, 48px); }
    .ev-row__more, .lg__cols span:last-child { display: none; }
    .lg__cols { grid-template-columns: repeat(3, 48px); }
    .social { padding: 14px; }
    .social__txt span, .social__txt strong { font-size: 16px; }
    .ftr__top { flex-wrap: wrap; }
    .ftr__cols { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
    .ftr__sub { gap: 40px; }
    .apps__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; gap: 10px; }
    .pagebox { padding: 18px 14px 24px; }
    .pagebox__head h1 { font-size: 14px; }
    .jp-grid { grid-template-columns: 1fr; }
    .sheet { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .modal--sheet { align-items: end; padding: 0; }
    .modal--sheet .modal__box { max-width: none; border-radius: 16px 16px 0 0; }
}
@media (max-width: 480px) {
    .wrap { padding: 0 12px; }
    .brand { gap: 7px; }
    .brand__mark { width: 34px; height: 34px; }
    .brand__word { font-size: 21px; }
    .hdr__right > .btn { padding: 0 10px; }
    .gsearch { grid-template-columns: minmax(0, 1fr) auto; }
    .gsearch .provs { grid-column: 1 / -1; }
    .gbtn--provs { width: 100%; }
    .provs__menu { left: 0; right: 0; width: auto; }
    .form__row { grid-template-columns: 1fr; }
    .promos { grid-template-columns: minmax(0, 1fr); }
    .slide__sub { display: none; }
}
@media (max-width: 360px) {
    .brand__word { font-size: 18px; }
    .hdr__right > .btn--green { display: none; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
    /* Kazananlar şeridi site sahibinin isteğiyle her durumda kayar (daha yavaş); üzerine gelince durur */
    .wins__track { animation: marquee 140s linear infinite !important; }
}

@media print {
    .hdr__nav, .hdr__right, .ftr, .bnav, .fab, .totop, .pagebox__head .btn { display: none !important; }
    body { background: #fff; color: #000; }
    body::before { display: none; }
}