:root {
    --bg-0: #050a1a;
    --bg-1: #0a1430;
    --bg-2: #10244d;
    --glass: rgba(23, 46, 90, 0.35);
    --glass-strong: rgba(19, 40, 82, 0.55);
    --line: rgba(136, 188, 255, 0.28);
    --text: #d8e8ff;
    --text-soft: #9eb7de;
    --primary: #4ba0ff;
    --primary-2: #70c6ff;
    --success: #41e3b1;
    --danger: #ff6f9d;
    --radius: 18px;
}

* {
    box-sizing: border-box;
}

html, body {
    margin: 0;
    padding: 0;
}

body {
    color: var(--text);
    font-family: Inter, "Segoe UI", sans-serif;
    background:
        radial-gradient(circle at 10% 0%, #1b3c79 0%, transparent 42%),
        radial-gradient(circle at 90% 20%, #0f2e66 0%, transparent 40%),
        linear-gradient(135deg, var(--bg-0), var(--bg-1) 45%, var(--bg-0));
    min-height: 100vh;
}

a {
    color: inherit;
    text-decoration: none;
}

.container {
    width: min(1180px, calc(100% - 32px));
    margin: 0 auto;
}

.container.narrow {
    width: min(900px, calc(100% - 32px));
}

.section {
    padding: 44px 0;
}

.navbar {
    position: sticky;
    top: 12px;
    z-index: 20;
    margin: 14px auto 0;
    width: min(1220px, calc(100% - 24px));
    border: 1px solid var(--line);
    border-radius: 22px;
    background: var(--glass-strong);
    backdrop-filter: blur(12px);
    box-shadow: 0 10px 35px rgba(28, 88, 180, 0.3);
}

.nav-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 14px 18px;
}

.nav-left, .nav-right, .nav-links, .nav-user, .user-info {
    display: flex;
    align-items: center;
    gap: 12px;
}

.nav-logo {
    font-family: Rajdhani, Inter, sans-serif;
    font-weight: 700;
    letter-spacing: 0.7px;
    font-size: 1.35rem;
}

.nav-logo span {
    color: var(--primary-2);
}

.nav-link {
    color: var(--text-soft);
    font-size: 0.95rem;
    padding: 8px 10px;
    border-radius: 10px;
}

.nav-link:hover,
.nav-link.active {
    color: var(--text);
    background: rgba(92, 170, 255, 0.14);
}

.nav-balance {
    padding: 8px 12px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: rgba(56, 116, 214, 0.22);
    font-weight: 600;
}

.user-avatar, .user-avatar-placeholder {
    width: 34px;
    height: 34px;
    border-radius: 50%;
}

.user-avatar-placeholder {
    display: grid;
    place-items: center;
    background: rgba(122, 175, 255, 0.18);
}

.user-name {
    max-width: 120px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.btn, .btn-steam, .btn-logout {
    border-radius: 13px;
    border: 1px solid var(--line);
    transition: 0.2s ease;
}

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 16px;
    cursor: pointer;
}

.btn-lg {
    padding: 13px 20px;
    font-weight: 700;
}

.btn-primary {
    color: #001531;
    border-color: transparent;
    background: linear-gradient(120deg, var(--primary), var(--primary-2));
    box-shadow: 0 6px 22px rgba(60, 143, 255, 0.42);
}

.btn-glass, .btn-ghost {
    background: rgba(116, 174, 255, 0.1);
    color: var(--text);
}

.btn-block {
    width: 100%;
}

.btn:hover, .btn-steam:hover, .btn-logout:hover {
    transform: translateY(-1px);
}

.btn-steam {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #fff;
    padding: 10px 14px;
    background: linear-gradient(120deg, #264f85, #3568b4);
}

.steam-icon {
    width: 18px;
    height: 18px;
}

.btn-logout {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    background: rgba(255, 111, 157, 0.12);
    color: #ff9dbd;
}

.hero {
    width: min(1220px, calc(100% - 24px));
    margin: 24px auto 0;
    border: 1px solid var(--line);
    border-radius: 24px;
    position: relative;
    overflow: hidden;
    background: var(--glass);
}

.hero-content {
    display: grid;
    grid-template-columns: 1.2fr 0.8fr;
    gap: 14px;
    padding: 44px;
}

.hero-title {
    margin: 12px 0;
    font-family: Rajdhani, Inter, sans-serif;
    font-size: clamp(2rem, 5vw, 3.6rem);
    line-height: 1.05;
}

.gradient-text {
    background: linear-gradient(120deg, #cde5ff, #65c2ff);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.hero-subtitle, .page-subtitle {
    color: var(--text-soft);
    max-width: 650px;
}

.hero-badge {
    display: inline-block;
    font-size: 0.82rem;
    color: #b8daff;
    border: 1px solid var(--line);
    border-radius: 999px;
    padding: 6px 12px;
    background: rgba(96, 162, 255, 0.12);
}

.hero-actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin: 20px 0 16px;
}

.hero-stats {
    display: flex;
    gap: 12px;
    align-items: center;
    margin-top: 16px;
}

.stat {
    display: grid;
}

.stat-num {
    font-weight: 700;
}

.stat-label {
    color: var(--text-soft);
    font-size: 0.83rem;
}

.stat-divider {
    width: 1px;
    height: 34px;
    background: var(--line);
}

.hero-visual {
    display: grid;
    place-items: center;
}

.trophy-container {
    width: 280px;
    height: 280px;
    position: relative;
    display: grid;
    place-items: center;
}

.trophy-icon {
    font-size: 84px;
    position: relative;
    z-index: 2;
    filter: drop-shadow(0 0 25px rgba(112, 198, 255, 0.9));
}

.trophy-glow {
    position: absolute;
    width: 170px;
    height: 170px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(104, 192, 255, 0.45), transparent 70%);
}

.trophy-ring {
    position: absolute;
    border: 1px solid rgba(120, 190, 255, 0.28);
    border-radius: 50%;
}

.ring-1 { width: 170px; height: 170px; }
.ring-2 { width: 220px; height: 220px; }
.ring-3 { width: 270px; height: 270px; }

.features-grid, .cards-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.feature-card, .tournament-card, .bot-form-card, .active-match-card, .rules-card {
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--glass);
    backdrop-filter: blur(10px);
    box-shadow: 0 8px 30px rgba(20, 52, 108, 0.22);
}

.feature-card {
    padding: 20px;
}

.feature-icon {
    font-size: 1.4rem;
}

.feature-card h3, .tournament-card h3 {
    margin: 12px 0 8px;
    font-family: Rajdhani, Inter, sans-serif;
}

.feature-card p {
    color: var(--text-soft);
    margin: 0;
    line-height: 1.5;
}

.section-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
}

.section-header.center {
    text-align: center;
    justify-content: center;
    flex-direction: column;
}

.tournament-card {
    padding: 16px;
    display: grid;
    gap: 14px;
}

.tc-header, .tc-body, .tc-stat, .tc-progress-header {
    display: flex;
    justify-content: space-between;
    gap: 10px;
}

.badge {
    display: inline-block;
    padding: 4px 8px;
    border-radius: 999px;
    font-size: 0.75rem;
}

.badge-mode {
    background: rgba(69, 218, 182, 0.2);
    color: #97f3d8;
    border: 1px solid rgba(69, 218, 182, 0.35);
}

.progress-bar {
    width: 100%;
    height: 8px;
    border-radius: 999px;
    background: rgba(130, 183, 255, 0.14);
    overflow: hidden;
}

.progress-fill {
    height: 100%;
    background: linear-gradient(90deg, #52a8ff, #80daff);
}

.main-content {
    padding-bottom: 34px;
}

.page-hero h1 {
    margin: 6px 0;
    font-family: Rajdhani, Inter, sans-serif;
    font-size: clamp(1.8rem, 4.2vw, 3rem);
}
.page-hero .container {
    text-align: center;
}
.page-hero .page-subtitle {
    margin: 0 auto;
}

.active-match-card, .bot-form-card, .rules-card {
    padding: 18px;
    margin-bottom: 16px;
}

.dash-card-divider {
    height: 1px;
    margin: 18px 0 14px;
    background: linear-gradient(90deg, transparent, rgba(130, 183, 255, 0.35), transparent);
    border: 0;
}

.dash-subheading {
    margin: 0 0 6px;
    font-size: 1.05rem;
    font-family: Rajdhani, Inter, sans-serif;
}

.readme-key-inline .readme-key-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: stretch;
}

.readme-key-inline .readme-key-row input {
    flex: 1 1 140px;
    min-width: 0;
}

.readme-key-inline .readme-key-row .btn {
    flex: 0 0 auto;
    align-self: center;
    padding-left: 18px;
    padding-right: 18px;
    white-space: nowrap;
}

.readme-key-feedback {
    margin: 10px 0 0;
    font-size: 0.88rem;
    line-height: 1.45;
}

.readme-key-feedback--ok {
    color: #6ee7b7;
}

.readme-key-feedback--err {
    color: #fca5a5;
}

/* Vklad: loga platebnich bran */
.deposit-gw-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.deposit-gw-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 58px;
    padding: 10px 12px;
}

.deposit-gw-btn .deposit-gw-logo {
    display: block;
    max-height: 34px;
    width: auto;
    max-width: min(100%, 180px);
    height: auto;
    object-fit: contain;
}

.deposit-gw-btn--featured {
    border-color: rgba(96, 200, 255, 0.55);
    box-shadow: 0 0 0 1px rgba(96, 200, 255, 0.2), 0 6px 20px rgba(40, 120, 220, 0.18);
}

.deposit-gw-extra {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    color: #8af2c9;
}

/* Vyber: volba vyplatni brany */
.withdraw-payout-fieldset {
    margin: 0;
    padding: 0;
    border: 0;
}

.withdraw-payout-fieldset legend {
    display: block;
    margin-bottom: 8px;
    color: var(--text-soft);
    font-size: 0.95rem;
}

.withdraw-payout-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.withdraw-payout-option {
    cursor: pointer;
    margin: 0;
}

.withdraw-payout-option input {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    pointer-events: none;
}

.withdraw-payout-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 56px;
    padding: 10px 12px;
    border-radius: 12px;
    border: 1px solid var(--line);
    background: rgba(10, 26, 55, 0.45);
    transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.withdraw-payout-option:hover .withdraw-payout-card {
    border-color: rgba(130, 183, 255, 0.45);
}

.withdraw-payout-option input:focus-visible + .withdraw-payout-card {
    outline: 2px solid rgba(96, 200, 255, 0.75);
    outline-offset: 2px;
}

.withdraw-payout-option input:checked + .withdraw-payout-card {
    border-color: rgba(96, 200, 255, 0.65);
    box-shadow: 0 0 0 1px rgba(96, 200, 255, 0.22);
    background: rgba(40, 90, 160, 0.22);
}

.withdraw-payout-option--wide {
    grid-column: 1 / -1;
}

.withdraw-payout-logo {
    max-height: 30px;
    width: auto;
    max-width: min(100%, 170px);
    object-fit: contain;
}

.withdraw-payout-name {
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--text-soft);
    letter-spacing: 0.03em;
}

.vs-header, .player-side, .match-details, .potential-win-box {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    align-items: center;
}

.vs-badge {
    font-family: Rajdhani, Inter, sans-serif;
    font-size: 1.25rem;
    color: #9ecfff;
}

.player-avatar img, .player-avatar {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    object-fit: cover;
}

.player-avatar {
    display: grid;
    place-items: center;
    background: rgba(129, 184, 255, 0.2);
}

.player-avatar.bot {
    font-size: 1.3rem;
}

.form-group {
    margin-top: 14px;
}

label {
    display: block;
    margin-bottom: 8px;
    color: var(--text-soft);
}

input, select, button {
    font: inherit;
}

input, select {
    width: 100%;
    border: 1px solid var(--line);
    border-radius: 12px;
    padding: 10px 11px;
    background: rgba(10, 26, 55, 0.6);
    color: var(--text);
}

.difficulty-picker, .quick-bets {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.diff-btn, .quick-bet {
    border: 1px solid var(--line);
    border-radius: 11px;
    background: rgba(120, 170, 255, 0.1);
    color: var(--text);
    padding: 8px 11px;
    cursor: pointer;
}

.diff-btn.active {
    background: rgba(66, 163, 255, 0.35);
    border-color: rgba(122, 190, 255, 0.7);
}

.potential-win-box {
    margin: 14px 0;
    padding: 13px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: rgba(102, 159, 255, 0.1);
}

.pw-label {
    display: block;
    color: var(--text-soft);
    font-size: 0.8rem;
}

.pw-amount, .win-amount {
    color: var(--success);
    font-weight: 700;
}

.status-badge {
    display: inline-block;
    padding: 6px 10px;
    border-radius: 999px;
    font-size: 0.8rem;
    border: 1px solid var(--line);
}

.status-badge.starting {
    background: rgba(121, 179, 255, 0.16);
}

.status-badge.running {
    background: rgba(64, 226, 178, 0.18);
    border-color: rgba(64, 226, 178, 0.5);
}

.server-info, .match-details > div {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
}

.match-details {
    flex-direction: column;
    margin-top: 10px;
}

.match-details > div {
    width: 100%;
    color: var(--text-soft);
}

.server-ip {
    font-weight: 700;
    color: #bde1ff;
}

.spinner {
    width: 32px;
    height: 32px;
    border: 3px solid rgba(136, 188, 255, 0.25);
    border-top-color: var(--primary-2);
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

.animated {
    animation: pulse 1.4s ease-in-out infinite alternate;
}

.steps-grid {
    display: grid;
    grid-template-columns: 1fr auto 1fr auto 1fr;
    gap: 12px;
    align-items: center;
}

.step {
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--glass);
    padding: 18px;
}

.step-num {
    font-family: Rajdhani, Inter, sans-serif;
    font-size: 1.15rem;
    color: #9ecfff;
}

.step p {
    margin-bottom: 0;
    color: var(--text-soft);
}

.step-arrow {
    color: #8fbeff;
    font-size: 1.25rem;
}

.footer {
    margin-top: 30px;
    border-top: 1px solid rgba(146, 194, 255, 0.15);
    background: rgba(6, 17, 37, 0.66);
}

.footer-container {
    width: min(1180px, calc(100% - 32px));
    margin: 0 auto;
    padding: 30px 0 20px;
    display: flex;
    justify-content: space-between;
    gap: 20px;
}

.footer-links {
    display: flex;
    gap: 26px;
}

.footer-col {
    display: grid;
    gap: 6px;
}

.footer-col h4 {
    margin: 0 0 8px;
    color: #b9d9ff;
}

.footer-col a {
    color: var(--text-soft);
    font-size: 0.92rem;
}

.footer-bottom {
    width: min(1180px, calc(100% - 32px));
    margin: 0 auto;
    padding: 12px 0 20px;
    display: flex;
    justify-content: space-between;
    gap: 8px;
    color: #7da6d8;
    border-top: 1px solid rgba(146, 194, 255, 0.12);
    font-size: 0.84rem;
}

.footer-brand {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    max-width: 360px;
}

.footer-tagline {
    margin: 0;
    color: var(--text-soft);
    font-size: 0.95rem;
}

.footer-social {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

.footer-social-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    padding: 0;
    border-radius: 12px;
    border: 1px solid rgba(120, 175, 255, 0.55);
    background: linear-gradient(165deg, rgba(95, 160, 255, 0.42) 0%, rgba(55, 110, 200, 0.38) 55%, rgba(40, 85, 170, 0.45) 100%);
    box-shadow: inset 0 1px 0 rgba(200, 230, 255, 0.45);
    line-height: 0;
}

.footer-social-btn:hover {
    border-color: rgba(170, 210, 255, 0.85);
    background: linear-gradient(165deg, rgba(130, 190, 255, 0.55) 0%, rgba(75, 140, 230, 0.48) 55%, rgba(55, 110, 200, 0.52) 100%);
}

.footer-social-btn img {
    width: 20px;
    height: 20px;
    object-fit: contain;
    display: block;
}

.footer-tp-wrap {
    margin-top: 24px;
    align-self: flex-start;
    max-width: 100%;
    overflow: visible;
}

.footer-tp-link {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 4px 14px 4px 6px;
    border-radius: 12px;
    border: 1px solid rgba(0, 182, 122, 0.5);
    background: rgba(6, 28, 22, 0.72);
    overflow: visible;
    line-height: 1.1;
    text-decoration: none;
}

.footer-tp-link:hover {
    border-color: rgba(0, 214, 140, 0.75);
    background: rgba(8, 42, 32, 0.82);
}

.footer-tp-mark {
    flex-shrink: 0;
    width: 49px;
    height: 49px;
    object-fit: contain;
    display: block;
    transform: scale(1.12);
    transform-origin: center center;
    margin: -8px 0 -8px -5px;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.35));
}

.footer-tp-word {
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    color: #dfffea;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45);
}

.flash {
    width: min(1220px, calc(100% - 24px));
    margin: 10px auto;
    padding: 10px 12px;
    border-radius: 12px;
    border: 1px solid var(--line);
}

.flash-error {
    background: rgba(255, 111, 157, 0.15);
    color: #ffc0d3;
    border-color: rgba(255, 111, 157, 0.38);
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

@keyframes pulse {
    from { width: 20%; }
    to { width: 80%; }
}

@media (max-width: 1060px) {
    .hero-content {
        grid-template-columns: 1fr;
        padding: 30px;
    }
    .features-grid, .cards-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .steps-grid {
        grid-template-columns: 1fr;
    }
    .step-arrow {
        display: none;
    }
}

@media (max-width: 760px) {
    .nav-links,
    .user-name,
    .footer-tagline,
    .footer-bottom span:last-child {
        display: none;
    }
    .hero-stats {
        flex-wrap: wrap;
    }
    .features-grid, .cards-grid {
        grid-template-columns: 1fr;
    }
    .footer-container,
    .footer-links,
    .footer-bottom {
        flex-direction: column;
    }
}

.lang-switch { display: flex; gap: 6px; }
.lang-btn {
    padding: 6px 8px;
    border-radius: 8px;
    border: 1px solid var(--line);
    color: var(--text-soft);
    font-size: 0.78rem;
}
.lang-btn:hover { color: var(--text); background: rgba(95,170,255,.16); }
.nav-balance-locked { cursor: help; }
.wallet-pill{padding:8px 10px;border:1px solid var(--line);border-radius:12px;background:rgba(74,131,224,.18);font-weight:600}
.wallet-pill.locked{background:rgba(100,136,191,.16);cursor:help}
.lang-dropdown{position:relative}
.lang-current{background:rgba(116,174,255,.15);border:1px solid var(--line);border-radius:10px;padding:6px 8px;cursor:pointer;color:var(--text)}
.lang-menu{display:none;position:absolute;right:0;top:38px;background:#0c1d42;border:1px solid var(--line);border-radius:10px;padding:6px}
.lang-menu a{display:block;padding:4px 6px;border-radius:6px}
.lang-menu a:hover{background:rgba(96,162,255,.2)}
.lang-dropdown:hover .lang-menu{display:block}
.tournament-layout{display:grid;grid-template-columns:320px 1fr;gap:18px;align-items:start}
.tournament-sidebar{position:sticky;top:98px;display:grid;gap:12px}
.tournament-list-wrap{display:grid;gap:12px}
.t-row-card{display:grid;grid-template-columns:84px 1.2fr repeat(4,minmax(110px,1fr));gap:12px;align-items:center;padding:12px;border:1px solid var(--line);border-radius:16px;background:var(--glass)}
.t-logo{width:72px;height:72px;border-radius:12px;object-fit:cover;border:1px solid var(--line)}
.t-main h3{margin:0 0 4px}
.t-main p{margin:0;color:var(--text-soft)}
.t-col span{display:block;font-size:.78rem;color:var(--text-soft)}
.t-col strong{font-size:.95rem}
@media (max-width:1060px){.tournament-layout{grid-template-columns:1fr}.tournament-sidebar{position:static}.t-row-card{grid-template-columns:72px 1fr 1fr}}
.hero-main-image{width:100%;max-width:380px;aspect-ratio:1/1;object-fit:cover;border-radius:18px;border:1px solid var(--line);box-shadow:0 10px 30px rgba(30,90,180,.35)}
.hero-image-fallback{width:100%;max-width:380px;min-height:260px;border:1px dashed var(--line);border-radius:18px;display:grid;place-items:center;color:var(--text-soft);background:rgba(70,120,200,.08)}
.trailer-card{border:1px solid var(--line);border-radius:18px;padding:14px;background:var(--glass)}
.trailer-video{width:100%;max-height:520px;border-radius:14px;border:1px solid var(--line);background:#09142d}
.trailer-features-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}
.features-grid-home{grid-template-columns:repeat(2,minmax(0,1fr))}
.features-column,.trailer-column{min-width:0}
.home-tournament-logo{width:76px;height:76px;border-radius:12px;object-fit:cover;border:1px solid var(--line);display:block;margin:8px 0 8px 12px}
.home-mode-badge{margin-left:0;align-self:flex-start}
@media (max-width:1060px){.trailer-features-grid{grid-template-columns:1fr}.features-grid-home{grid-template-columns:1fr}}
.bot-media-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px}
.bot-media-image{width:100%;height:120px;object-fit:cover;border-radius:10px;border:1px solid var(--line);margin-bottom:8px;background:#0a1530}
.bot-media-video{width:100%;height:250px;object-fit:cover;border-radius:10px;border:1px solid var(--line);background:#0a1530}
.map-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.map-card{display:block;border:1px solid var(--line);border-radius:10px;padding:6px;background:rgba(99,160,255,.08);cursor:pointer}
.map-card input{display:none}
.map-card img{width:100%;height:70px;object-fit:cover;border-radius:6px;display:block}
.map-card span{display:block;margin-top:6px;text-align:center;color:var(--text-soft);font-size:.82rem}
.map-card:has(input:checked){outline:2px solid rgba(120,190,255,.7)}
@media (max-width:900px){.bot-media-grid{grid-template-columns:1fr}.map-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.market-layout{display:grid;grid-template-columns:1.1fr .8fr 1.1fr;gap:12px;align-items:start}
.market-list{display:grid;gap:8px;max-height:620px;overflow:auto;margin-top:10px}
.market-item{display:grid;grid-template-columns:90px 1fr;gap:8px;align-items:center;padding:8px;border:1px solid var(--line);border-radius:10px;background:rgba(83,136,220,.08);cursor:pointer}
.market-item img{width:90px;height:60px;object-fit:cover;border-radius:8px;border:1px solid var(--line)}
.market-item p{margin:0;color:var(--text-soft);font-size:.82rem}
.market-item.selected{outline:2px solid rgba(110,190,255,.7)}
.market-filters{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-top:8px}
.cat-btn{border:1px solid var(--line);background:rgba(95,161,255,.12);color:var(--text);border-radius:8px;padding:6px;cursor:pointer}
.market-filter-panel{margin:12px 0;padding:10px;border:1px solid var(--line);border-radius:12px;background:rgba(80,128,210,.08)}
.market-filter-panel h4{margin:0 0 10px}
.market-filter-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.market-filter-grid label{margin:0;font-size:.86rem}
.market-filter-grid select,.market-filter-grid input[type="number"]{margin-top:4px}
.checkline{display:flex;align-items:center;gap:8px}
.checkline input{width:auto}
.market-filter-grid select,.market-filter-grid input{
  border-radius:10px;
  border:1px solid rgba(138,198,255,.35);
  background:rgba(10,26,55,.75);
}
.subscription-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px;align-items:stretch}
.subscription-card{border:1px solid var(--line);border-radius:18px;background:var(--glass);padding:14px;display:flex;flex-direction:column;gap:10px}
.subscription-card-ultra{box-shadow:0 0 0 2px rgba(112,198,255,.5),0 16px 40px rgba(40,120,220,.25);transform:translateY(-4px)}
.subscription-image{width:100%;height:170px;object-fit:cover;border-radius:12px;border:1px solid var(--line)}
.subscription-price{font-size:1.1rem;font-weight:700;color:#bde9ff}
.subscription-benefits{margin:0;padding-left:0;list-style:none;display:grid;gap:6px;color:var(--text-soft)}
.subscription-info{margin-top:16px;text-align:center}
@media (max-width:980px){.subscription-grid{grid-template-columns:1fr}}
@media (max-width:1100px){.market-layout{grid-template-columns:1fr}}

.dashboard-layout{display:grid;grid-template-columns:320px 1fr;gap:16px;align-items:start}
.dashboard-side{position:sticky;top:96px;display:grid;gap:12px}
.dashboard-center{display:grid;gap:12px}
.dashboard-center .rules-card{max-width:980px}
.leveling-hero-card{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:center;padding:18px;border:1px solid var(--line);border-radius:18px;background:var(--glass)}
.leveling-hero-card h3{margin:6px 0}
.leveling-hero-card p{margin:0;color:var(--text-soft)}
.leveling-hero-card small{display:block;margin-top:8px;color:var(--text-soft)}
.reward-table{display:grid;gap:6px;max-height:680px;overflow:auto;padding-right:4px}
.reward-row{display:grid;grid-template-columns:90px 130px 1fr 90px;gap:8px;align-items:center;padding:10px;border:1px solid var(--line);border-radius:10px;background:rgba(80,130,210,.08)}
.reward-row em{display:block;color:#95c7ff;font-style:normal;font-size:.82rem;margin-top:2px}
.reward-head{background:rgba(110,170,255,.2);font-weight:700}
.reward-unlocked{border-color:rgba(65,227,177,.5)}
.reward-upcoming{border-color:rgba(140,195,255,.45)}
.reward-locked{opacity:.78}
@media (max-width:1020px){
  .dashboard-layout{grid-template-columns:1fr}
  .dashboard-side{position:static}
  .leveling-hero-card{grid-template-columns:1fr}
  .reward-row{grid-template-columns:72px 100px 1fr 70px}
}

.reward-rail{
  display:flex;
  align-items:stretch;
  gap:12px;
  overflow-x:auto;
  padding-bottom:4px;
  scroll-snap-type:x mandatory;
}
.reward-rail{
  scrollbar-width:thin;
  scrollbar-color:rgba(110,190,255,.55) rgba(18,36,72,.35);
}
.reward-rail::-webkit-scrollbar{
  height:10px;
}
.reward-rail::-webkit-scrollbar-track{
  background:rgba(18,36,72,.35);
  border-radius:999px;
  border:1px solid rgba(128,188,255,.16);
}
.reward-rail::-webkit-scrollbar-thumb{
  background:linear-gradient(90deg, rgba(81,154,255,.75), rgba(111,209,255,.75));
  border-radius:999px;
  border:1px solid rgba(170,224,255,.55);
  box-shadow:0 0 12px rgba(89,170,255,.35);
}
.reward-rail::-webkit-scrollbar-thumb:hover{
  background:linear-gradient(90deg, rgba(102,173,255,.9), rgba(131,224,255,.9));
}
.reward-card{
  flex:0 0 210px;
  max-width:210px;
  border:1px solid var(--line);
  border-radius:14px;
  background:rgba(74,122,196,.12);
  padding:9px;
  display:grid;
  gap:7px;
  scroll-snap-align:center;
}
.reward-card img{
  width:100%;
  height:108px;
  object-fit:cover;
  border-radius:10px;
  border:1px solid rgba(130,190,255,.35);
}
.reward-card h4{margin:0}
.reward-card p{margin:0;color:var(--text-soft);font-size:.86rem;min-height:34px}
.reward-unlocked{border-color:rgba(120,200,255,.5)}
.reward-claimed{opacity:.7}
.reward-card-locked{
  opacity:.72;
  border-color:rgba(170,130,190,.35);
  filter:saturate(.7);
}
.reward-rail-four .reward-card{
  flex:0 0 calc((100% - 36px) / 4);
  max-width:calc((100% - 36px) / 4);
}
@media (max-width:1100px){
  .reward-rail-four .reward-card{
    flex-basis:calc((100% - 12px) / 2);
    max-width:calc((100% - 12px) / 2);
  }
}
@media (max-width:700px){
  .reward-rail-four .reward-card{
    flex-basis:100%;
    max-width:100%;
  }
}

.discord-cta{
  border:1px solid var(--line);
  border-radius:18px;
  background:var(--glass);
  display:grid;
  grid-template-columns:1.2fr 1fr;
  gap:12px;
  overflow:hidden;
}
.discord-cta-media img{
  width:100%;
  height:100%;
  min-height:260px;
  object-fit:cover;
  display:block;
}
.discord-cta-content{
  padding:18px;
  display:grid;
  align-content:center;
  gap:10px;
}
.discord-cta-content h2{margin:0}
@media (max-width:900px){
  .discord-cta{grid-template-columns:1fr}
}

.case-tile-link{display:block;text-decoration:none;color:inherit}
.case-tile-link.is-locked{pointer-events:none;opacity:.72}
.case-tile{
  border:1px solid var(--line);
  border-radius:16px;
  padding:14px;
  background:linear-gradient(160deg, rgba(80,132,212,.16), rgba(31,58,110,.28));
  min-height:290px;
  display:grid;
  gap:10px;
  transition:transform .16s ease, border-color .16s ease;
}
.case-tile-image-wrap{
  border:1px solid rgba(131,190,255,.35);
  border-radius:12px;
  overflow:hidden;
  background:rgba(16,34,72,.55);
  min-height:150px;
}
.case-tile-image{
  width:100%;
  height:150px;
  object-fit:cover;
  display:block;
}
.case-tile-link:hover .case-tile{transform:translateY(-2px);border-color:rgba(142,206,255,.6)}
.case-tile-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.case-tile-head h3{margin:0}
.case-price{
  display:inline-block;
  padding:4px 9px;
  border-radius:999px;
  border:1px solid var(--line);
  background:rgba(111,176,255,.2);
  font-weight:700;
}
.case-open-tag{
  justify-self:center;
  border:1px solid var(--line);
  background:rgba(88,160,255,.18);
  border-radius:10px;
  padding:6px 22px;
  font-weight:600;
}

.case-detail-hero{
  margin-top:12px;
  display:flex;
  justify-content:space-between;
  gap:10px;
  align-items:center;
  border:1px solid var(--line);
  border-radius:14px;
  padding:14px;
  background:rgba(86,138,220,.12);
}
.case-detail-hero--center{
  justify-content:center;
  text-align:center;
}
.case-detail-title h2{margin:0}
.case-detail-price{font-size:1.1rem;font-weight:700;color:#c3ebff}
.case-detail-price--inline{margin-top:6px}
.case-detail-locked-msg{text-align:center}
.case-detail-actions{margin-top:12px;display:flex;gap:8px;flex-wrap:wrap}
.case-skins-heading{margin-top:14px;text-align:center}
.case-items-grid{margin-top:14px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.case-item-card{
  border:1px solid var(--line);
  border-radius:12px;
  padding:10px;
  background:rgba(74,122,196,.1);
  display:grid;
  align-content:start;
  justify-items:center;
  gap:8px;
}
.case-item-image{
  width:100%;
  height:140px;
  object-fit:cover;
  border-radius:9px;
  border:1px solid rgba(137,193,255,.36);
  background:#091428;
}
.case-item-info{min-width:0;width:100%;text-align:center}
.case-item-card strong{font-size:.92rem;display:block}
.case-item-card p{margin:2px 0 0}
.case-item-meta{text-align:center;display:grid;gap:2px}
.case-item-meta small{color:var(--text-soft)}
.spin-meta-panel{
  margin-top:12px;
  border:1px solid var(--line);
  border-radius:14px;
  padding:12px;
  background:rgba(68,120,198,.12);
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1fr);
  gap:10px;
  align-items:center;
}
.spin-meta-left{justify-self:start}
.spin-meta-center{justify-self:center}
.spin-meta-right{
  justify-self:end;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:8px;
}
.spin-wallet-row{margin-top:10px;text-align:center}
.spin-result-heading{margin:0 0 8px;text-align:center}
.spin-error-msg{margin-top:8px;color:#ff9dbd;text-align:center}
.spin-controls{display:grid;gap:8px}
.amount-group{display:flex;gap:8px;flex-wrap:wrap}
.amount-btn{
  min-width:36px;
  padding:7px 10px;
  border:1px solid var(--line);
  border-radius:10px;
  background:rgba(93,159,249,.14);
  color:var(--text);
  cursor:pointer;
}
.amount-btn.active{background:rgba(86,190,255,.32);border-color:rgba(124,205,255,.65)}
.spin-result{margin-top:12px;padding:14px;text-align:center}
.spin-result .case-items-grid{
  justify-content:center;
  grid-template-columns:repeat(4,minmax(170px,220px));
}
.spin-result .case-items-grid.won-grid{
  display:flex;
  justify-content:center;
  align-items:stretch;
  flex-wrap:nowrap;
  gap:10px;
  overflow-x:auto;
  padding-bottom:4px;
}
.spin-result .case-items-grid.won-grid .case-item-card{
  width:calc((100% - 40px) / 5);
  min-width:170px;
  max-width:230px;
}
.spin-viewport{
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:10px;
  background:rgba(53,93,156,.12);
  height:270px;
  min-height:270px;
  position:relative;
}
.spin-viewport-single{height:270px;min-height:270px}
.spin-reels.reels-1 .spin-viewport-single{
  width:min(1200px,100%);
  max-width:1200px;
  margin:0 auto;
  height:320px;
  min-height:320px;
  display:flex;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
}
.spin-reels.reels-1 .spin-viewport-single > .spin-track{
  flex:0 0 auto;
}
.spin-reels.reels-1 .spin-viewport-single:not(.spin-viewport--long-strip) > .spin-track{
  margin:0 auto;
}
.spin-reels.reels-1 .spin-viewport-single.spin-viewport--long-strip > .spin-track{
  position:absolute;
  left:0;
  top:50%;
  margin:0;
  right:auto;
  bottom:auto;
}
.spin-pointer{
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  z-index:2;
  color:#c6ebff;
  font-size:22px;
  text-shadow:0 0 14px rgba(120,200,255,.7);
}
.spin-track{
  display:flex;
  flex-direction:column;
  gap:10px;
  width:100%;
  padding:16px;
}
.spin-track-vertical.is-spinning{
  animation:spin-strip-move-y 2.8s cubic-bezier(.12,.75,.2,1) forwards;
  will-change:transform;
}
.spin-track-horizontal{
  flex-direction:row;
  align-items:stretch;
  width:max-content;
}
.spin-track-horizontal .spin-item{
  width:180px;
  min-width:180px;
}
.spin-reels.reels-1 .spin-track-horizontal.is-preview,
.spin-reels.reels-1 .spin-track-horizontal.is-final{
  display:grid;
  grid-template-columns:minmax(64px,1fr) auto minmax(64px,1fr);
  align-items:center;
  column-gap:10px;
  row-gap:0;
  padding:8px clamp(48px,4.5vw,72px);
  width:100%;
  max-width:100%;
  min-height:0;
  box-sizing:border-box;
}
.spin-reels.reels-1 .spin-track-horizontal.is-preview .spin-item-side-left,
.spin-reels.reels-1 .spin-track-horizontal.is-final .spin-item-side-left{
  justify-self:end;
  grid-column:1;
}
.spin-reels.reels-1 .spin-track-horizontal.is-preview .spin-item-hit,
.spin-reels.reels-1 .spin-track-horizontal.is-final .spin-item-hit{
  justify-self:center;
  grid-column:2;
}
.spin-reels.reels-1 .spin-track-horizontal.is-preview .spin-item-side-right,
.spin-reels.reels-1 .spin-track-horizontal.is-final .spin-item-side-right{
  justify-self:start;
  grid-column:3;
}
.spin-reels.reels-1 .spin-track-horizontal .spin-item{
  width:300px;
  min-width:300px;
  align-self:center;
  min-height:188px;
  height:188px;
  box-sizing:border-box;
}
.spin-reels.reels-1 .spin-track-horizontal.is-preview .spin-item,
.spin-reels.reels-1 .spin-track-horizontal.is-final .spin-item{
  width:auto;
}
.spin-reels.reels-1 .spin-track-horizontal .spin-item-side{
  transform:scale(.92);
  opacity:.82;
  filter:saturate(.88);
  min-height:132px;
  height:132px;
  width:148px !important;
  min-width:148px !important;
  padding:8px 6px;
  justify-items:center;
}
.spin-reels.reels-1 .spin-track-horizontal .spin-item-side strong,
.spin-reels.reels-1 .spin-track-horizontal .spin-item-side small{
  display:none;
}
.spin-reels.reels-1 .spin-track-horizontal .spin-item-side .spin-item-image{
  height:96px;
  width:100%;
  object-fit:contain;
  background:transparent;
  border-color:rgba(120,175,240,.2);
}
.spin-reels.reels-1 .spin-track-horizontal .spin-item-hit{
  transform:scale(1);
  opacity:1;
  filter:none;
  padding:14px 16px 12px;
  gap:10px;
  z-index:1;
  min-height:210px;
  height:210px;
  width:min(380px,42vw) !important;
  min-width:280px !important;
}
.spin-reels.reels-1 .spin-track-horizontal .spin-item-hit .spin-item-image{
  height:128px;
  object-fit:contain;
  background:radial-gradient(ellipse at center,rgba(40,70,120,.35),#0c1935);
}
.spin-reels.reels-1 .spin-track-horizontal .spin-item-hit strong{
  font-size:1rem;
  white-space:normal;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.spin-reels.reels-1 .spin-track-horizontal .spin-item-hit small{
  font-size:.82rem;
}
.spin-track-horizontal.is-spinning{
  animation:spin-strip-move-x 2.8s cubic-bezier(.12,.75,.2,1) forwards;
  will-change:transform;
}
.spin-reels.reels-1 .spin-viewport-single.spin-viewport--long-strip{
  display:block;
  overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 1.5%,#000 98.5%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 1.5%,#000 98.5%,transparent);
}
.spin-reels.reels-1 .spin-track-horizontal.is-spinning{
  --spin-shift:0px;
  display:flex;
  flex-direction:row;
  align-items:center;
  padding:12px 0;
  width:max-content;
  max-width:none;
  animation:none !important;
  transform:translateY(-50%) translateX(var(--spin-shift));
  transition:transform 3.45s cubic-bezier(.07,.75,.18,1);
  will-change:transform;
}
.spin-track.is-final{
  animation:none !important;
}
.spin-track.is-preview{
  animation:none !important;
}
.spin-track-horizontal.is-final{
  width:100%;
  justify-content:center;
  align-items:center;
}
.spin-track-horizontal.is-preview{
  width:100%;
  justify-content:center;
  align-items:center;
}
.spin-reels.reels-1 .spin-track-horizontal.is-final,
.spin-reels.reels-1 .spin-track-horizontal.is-preview{
  justify-content:unset;
}
.spin-track-vertical.is-final{
  height:100%;
  justify-content:flex-start;
  padding:4px 10px 6px;
  gap:8px;
  transform:translateY(0);
  box-sizing:border-box;
}
.spin-track-vertical.is-preview{
  height:100%;
  justify-content:flex-start;
  padding:4px 10px 6px;
  gap:8px;
  transform:translateY(0);
  box-sizing:border-box;
}
.spin-track-vertical.is-final .spin-item,
.spin-track-vertical.is-preview .spin-item{
  min-height:108px;
  height:108px;
}
.spin-machine .spin-track-vertical.is-final .spin-item-side,
.spin-machine .spin-track-vertical.is-preview .spin-item-side{
  min-height:86px;
  height:86px;
  transform:scale(.9);
  opacity:.88;
  padding:6px;
  align-self:center;
  width:calc(100% - 4px);
}
.spin-machine .spin-track-vertical.is-final .spin-item-side .spin-item-image,
.spin-machine .spin-track-vertical.is-preview .spin-item-side .spin-item-image{
  height:52px;
}
.spin-machine .spin-track-vertical.is-final .spin-item-hit,
.spin-machine .spin-track-vertical.is-preview .spin-item-hit{
  min-height:132px;
  height:132px;
  transform:scale(1);
  opacity:1;
  padding:10px 8px;
  align-self:center;
  width:calc(100% - 4px);
}
.spin-machine .spin-track-vertical.is-final .spin-item-hit .spin-item-image,
.spin-machine .spin-track-vertical.is-preview .spin-item-hit .spin-item-image{
  height:88px;
}
.spin-machine .spin-track-vertical.is-final .spin-item-hit strong,
.spin-machine .spin-track-vertical.is-preview .spin-item-hit strong{
  font-size:.9rem;
}
.spin-viewport-multi .spin-track-vertical.is-spinning{
  padding:6px 10px;
  gap:10px;
}
.spin-viewport-multi .spin-track-vertical.is-spinning .spin-item{
  min-height:96px;
  height:96px;
}
.spin-result-note{
  margin-top:8px;
  text-align:center;
  width:100%;
  display:block;
}
.spin-item{
  width:100%;
  border:1px solid rgba(124,188,255,.24);
  border-radius:8px;
  background:rgba(37,64,110,.36);
  padding:8px;
  display:grid;
  gap:5px;
}
.spin-item-image{
  width:100%;
  height:70px;
  object-fit:cover;
  border-radius:6px;
  border:1px solid rgba(137,193,255,.24);
  background:#0c1935;
}
.spin-item strong{
  display:block;
  font-size:.84rem;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.spin-item small{color:var(--text-soft);font-size:.78rem}
.spin-item-hit{
  border-color:rgba(157,230,255,.92);
  box-shadow:0 0 0 2px rgba(125,216,255,.28), 0 10px 20px rgba(66,150,240,.2);
}
.spin-hitline{
  position:absolute;
  z-index:3;
  pointer-events:none;
}
.spin-hitline-single{
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  width:3px;
  height:78%;
  border-radius:2px;
  background:linear-gradient(180deg, transparent, rgba(190,240,255,.25) 12%, #e8f8ff 45%, #e8f8ff 55%, rgba(190,240,255,.25) 88%, transparent);
  box-shadow:0 0 18px rgba(120,210,255,.45);
}
.spin-hitline-multi{
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  width:86%;
  height:2px;
  background:linear-gradient(90deg, transparent, #bce7ff 20%, #bce7ff 80%, transparent);
}
.spin-pointer-left{left:25px; top:50%; transform:translateY(-50%)}
.spin-pointer-right{right:25px; left:auto; top:50%; transform:translateY(-50%)}
.spin-reels.reels-1 .spin-pointer{
  font-size:26px;
  color:#dff6ff;
  text-shadow:0 0 20px rgba(100,200,255,.85);
}
.won-card{
  border-color:rgba(126,202,255,.45);
}
.won-card-main{
  transform:scale(1.03);
  box-shadow:0 14px 30px rgba(58,130,224,.28);
  border-color:rgba(151,218,255,.72);
}
.won-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  justify-content:center;
}
.won-actions .btn{padding:7px 10px}
@keyframes spin-strip-move-y{
  from{transform:translateY(-2%)}
  to{transform:translateY(-78%)}
}
.spin-reels{
  display:flex;
  gap:8px;
  justify-content:center;
  overflow-x:hidden;
  padding-bottom:4px;
  scrollbar-width:none;
}
.spin-reels.reels-1{
  width:100%;
  justify-content:center;
}
.spin-single-machine{
  max-width:min(1200px,100%);
  margin:0 auto;
  padding:18px 22px 22px;
  border-radius:18px;
  border:1px solid rgba(124,188,255,.32);
  background:linear-gradient(168deg,rgba(28,52,96,.58) 0%,rgba(10,20,44,.88) 45%,rgba(6,12,28,.94) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    0 14px 40px rgba(0,0,0,.4);
}
.spin-single-machine .spin-reels.reels-1{
  padding-bottom:0;
}
.spin-reels.reels-1 .spin-viewport-single{
  background:
    radial-gradient(ellipse 85% 70% at 50% 45%,rgba(56,100,168,.22),transparent 62%),
    rgba(12,22,48,.72);
  border:1px solid rgba(130,185,255,.35);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.04), inset 0 -20px 50px rgba(0,0,0,.35);
}
.spin-reels.reels-1 .spin-track-horizontal .spin-item-strip strong,
.spin-reels.reels-1 .spin-track-horizontal .spin-item-strip small{
  display:none;
}
.spin-reels.reels-1 .spin-track-horizontal.is-spinning .spin-item-strip{
  width:168px;
  min-width:168px;
  min-height:118px;
  height:118px;
  padding:10px;
  justify-items:center;
}
.spin-reels.reels-1 .spin-track-horizontal.is-spinning .spin-item-strip .spin-item-image{
  height:92px;
}
.spin-reels.spin-machine{
  max-width:min(1200px,100%);
  margin:0 auto;
  padding:14px 16px 16px;
  gap:10px;
  border-radius:16px;
  border:1px solid rgba(124,188,255,.28);
  background:linear-gradient(165deg,rgba(24,48,88,.55) 0%,rgba(8,16,36,.82) 55%,rgba(6,12,28,.92) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.07),
    0 12px 32px rgba(0,0,0,.35);
}
.spin-reels::-webkit-scrollbar{display:none}
.spin-viewport-multi{
  flex:1 1 0;
  min-width:0;
  width:auto;
  max-width:240px;
  height:320px;
  min-height:320px;
}
.spin-reels.reels-2 .spin-viewport-multi{
  max-width:min(360px,calc((100% - 10px) / 2));
}
.spin-reels.reels-3 .spin-viewport-multi{
  max-width:min(280px,calc((100% - 20px) / 3));
}
.spin-reels.reels-4 .spin-viewport-multi{
  max-width:min(220px,calc((100% - 30px) / 4));
}
.spin-reels.reels-5 .spin-viewport-multi{
  max-width:min(188px,calc((100% - 40px) / 5));
}
@keyframes spin-strip-move-x{
  from{transform:translateX(-2%)}
  to{transform:translateX(-72%)}
}
@media (max-width:900px){
  .case-items-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .case-detail-hero{flex-direction:column;align-items:flex-start}
  .case-detail-hero--center{align-items:center}
  .spin-meta-panel{
    grid-template-columns:1fr;
    gap:12px;
  }
  .spin-meta-left{justify-self:stretch}
  .spin-meta-center{display:none}
  .spin-meta-right{align-items:stretch;justify-self:stretch}
  .spin-single-machine{
    padding:14px 12px 16px;
  }
  .spin-reels.reels-1 .spin-viewport-single{
    height:300px;
    min-height:300px;
  }
  .spin-reels.reels-1 .spin-track-horizontal.is-preview,
  .spin-reels.reels-1 .spin-track-horizontal.is-final{
    column-gap:6px;
    padding:6px clamp(40px,6vw,60px);
  }
  .spin-reels.reels-1 .spin-track-horizontal .spin-item{
    width:200px;
    min-width:200px;
    min-height:160px;
    height:160px;
  }
  .spin-reels.reels-1 .spin-track-horizontal .spin-item-side{
    min-height:118px;
    height:118px;
    width:112px !important;
    min-width:112px !important;
    transform:scale(.9);
  }
  .spin-reels.reels-1 .spin-track-horizontal .spin-item-side .spin-item-image{
    height:78px;
  }
  .spin-reels.reels-1 .spin-track-horizontal .spin-item-hit{
    padding:12px;
    min-height:178px;
    height:178px;
    width:min(300px,58vw) !important;
    min-width:200px !important;
  }
  .spin-reels.reels-1 .spin-track-horizontal .spin-item-hit .spin-item-image{
    height:102px;
  }
  .spin-reels.reels-1 .spin-track-horizontal.is-spinning .spin-item-strip{
    width:140px;
    min-width:140px;
    min-height:102px;
    height:102px;
  }
  .spin-reels.reels-1 .spin-track-horizontal.is-spinning .spin-item-strip .spin-item-image{
    height:78px;
  }
  .spin-reels.spin-machine{
    padding:10px 10px 12px;
    gap:8px;
    overflow-x:auto;
    justify-content:center;
    flex-wrap:nowrap;
  }
  .spin-viewport-multi{
    height:280px;
    min-height:280px;
    flex:0 0 auto;
  }
  .spin-reels.reels-5.spin-machine .spin-viewport-multi{
    min-width:118px;
  }
  .spin-machine .spin-track-vertical.is-final .spin-item-side,
  .spin-machine .spin-track-vertical.is-preview .spin-item-side{
    min-height:72px;
    height:72px;
  }
  .spin-machine .spin-track-vertical.is-final .spin-item-side .spin-item-image,
  .spin-machine .spin-track-vertical.is-preview .spin-item-side .spin-item-image{
    height:44px;
  }
  .spin-machine .spin-track-vertical.is-final .spin-item-hit,
  .spin-machine .spin-track-vertical.is-preview .spin-item-hit{
    min-height:120px;
    height:120px;
  }
  .spin-machine .spin-track-vertical.is-final .spin-item-hit .spin-item-image,
  .spin-machine .spin-track-vertical.is-preview .spin-item-hit .spin-item-image{
    height:76px;
  }
  .spin-viewport-multi .spin-track-vertical.is-spinning .spin-item{
    min-height:88px;
    height:88px;
  }
  .spin-result .case-items-grid{grid-template-columns:repeat(2,minmax(140px,1fr))}
  .spin-result .case-items-grid.won-grid .case-item-card{width:190px;min-width:190px}
}

.inventory-topbar{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px}
.inventory-drop-card{position:relative;overflow:hidden}
.inventory-drop-meta{
  display:flex;
  justify-content:space-between;
  gap:8px;
  font-size:.72rem;
  color:var(--text-soft);
}
.inventory-drop-meta div{display:grid;gap:2px}
.inventory-drop-meta strong{font-size:.78rem;color:var(--text)}
/* Skinchanger — 3 sloupce, filtr uprostřed */
.skinchanger-section .container.skinchanger-layout{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(300px,400px) minmax(0,1fr);
    gap:16px;
    align-items:start;
}
.skin-col--filter.rules-card{
    padding:16px 16px 14px;
    overflow:visible;
}
.skin-filter-market{
    display:flex;
    flex-direction:column;
    gap:0;
    overflow:visible;
}
.skin-mf-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    margin-bottom:10px;
    flex-shrink:0;
}
.skin-mf-title{
    margin:0;
    font-size:1rem;
    font-weight:700;
    letter-spacing:-.02em;
}
.skin-mf-pill{
    font-size:.68rem;
    font-weight:700;
    letter-spacing:.06em;
    text-transform:uppercase;
    padding:4px 10px;
    border-radius:999px;
    background:rgba(80,140,220,.2);
    border:1px solid rgba(130,180,255,.28);
    color:#b8d9ff;
}
.skin-mf-badges{
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    align-items:center;
    min-height:32px;
    margin-bottom:10px;
    flex-shrink:0;
}
.skin-mf-hintline{
    margin:0 0 12px;
    font-size:.78rem;
    line-height:1.45;
    color:var(--text-soft);
    flex-shrink:0;
}
.skin-mf-badge-item{
    display:inline-flex;
    align-items:center;
    gap:4px;
    padding:4px 8px 4px 10px;
    border-radius:8px;
    background:rgba(0,0,0,.22);
    border:1px solid rgba(120,160,220,.18);
    font-size:.74rem;
    font-variant-numeric:tabular-nums;
}
.skin-mf-badge-inner .c-usd{color:#9fd4ff;font-weight:600}
.skin-mf-badge-sep{opacity:.4;padding:0 3px}
.skin-mf-badge-remove{
    display:flex;
    align-items:center;
    justify-content:center;
    width:22px;
    height:22px;
    margin:0;
    padding:0;
    border:none;
    border-radius:6px;
    background:transparent;
    color:rgba(255,180,180,.85);
    font-size:1rem;
    line-height:1;
    cursor:pointer;
}
.skin-mf-badge-remove:hover{background:rgba(255,80,80,.12)}
/* Rozbalovací sekce */
.skin-acc{
    border-top:1px solid rgba(120,170,255,.12);
    margin:0;
}
.skin-acc__summary{
    list-style:none;
    cursor:pointer;
    padding:11px 2px 11px 0;
    font-size:.82rem;
    font-weight:600;
    color:rgba(230,238,255,.95);
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    user-select:none;
}
.skin-acc__summary::-webkit-details-marker{display:none}
.skin-acc__summary::after{
    content:'';
    width:7px;
    height:7px;
    border-right:2px solid rgba(160,190,230,.55);
    border-bottom:2px solid rgba(160,190,230,.55);
    transform:rotate(-45deg);
    transition:transform .2s ease;
    flex-shrink:0;
    margin-top:-3px;
}
.skin-acc[open] .skin-acc__summary::after{
    transform:rotate(45deg);
    margin-top:2px;
}
.skin-acc__body{
    padding:0 0 14px;
    display:grid;
    gap:12px;
}
.skin-mf-field{display:grid;gap:6px}
.skin-mf-field__l{font-size:.72rem;color:var(--text-soft);font-weight:500}
.skin-mf-micro{
    font-size:.68rem;
    line-height:1.4;
    color:var(--text-soft);
    margin:0;
}
.skin-mf-chips{display:flex;flex-wrap:wrap;gap:6px}
.skin-mf-chip{
    padding:6px 11px;
    border-radius:8px;
    border:1px solid rgba(110,150,200,.22);
    background:rgba(6,14,32,.4);
    color:var(--text);
    font-size:.72rem;
    font-weight:600;
    cursor:pointer;
    transition:background .15s ease, border-color .15s ease;
}
.skin-mf-chip:hover{border-color:rgba(140,185,240,.35)}
.skin-mf-chip.is-active{
    border-color:rgba(100,175,255,.45);
    background:rgba(50,95,160,.28);
}
.skin-mf-price-row{display:flex;align-items:center;gap:8px}
.skin-mf-input{
    flex:1;
    min-width:0;
    max-width:160px;
    padding:8px 10px;
    border-radius:8px;
    border:1px solid rgba(110,150,200,.2);
    background:rgba(4,12,28,.55);
    color:var(--text);
    font-size:.82rem;
}
.skin-mf-input--block{max-width:none;width:100%}
.skin-mf-input:disabled{opacity:.5;cursor:not-allowed}
.skin-select.skin-mf-input{
    appearance:none;
    -webkit-appearance:none;
    -moz-appearance:none;
    padding-right:36px;
    background-image:
        linear-gradient(45deg, transparent 50%, rgba(190,220,255,.9) 50%),
        linear-gradient(135deg, rgba(190,220,255,.9) 50%, transparent 50%),
        linear-gradient(180deg, rgba(10,22,48,.95), rgba(6,14,30,.95));
    background-position:
        calc(100% - 18px) calc(50% - 1px),
        calc(100% - 12px) calc(50% - 1px),
        0 0;
    background-size:6px 6px, 6px 6px, 100% 100%;
    background-repeat:no-repeat;
    border-color:rgba(125,175,245,.3);
    color:#e8f2ff;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.04), 0 0 0 1px rgba(10,24,50,.25);
}
.skin-select.skin-mf-input:hover{
    border-color:rgba(155,205,255,.45);
}
.skin-select.skin-mf-input:focus{
    outline:none;
    border-color:rgba(120,190,255,.6);
    box-shadow:
        0 0 0 2px rgba(70,140,230,.24),
        inset 0 1px 0 rgba(255,255,255,.05);
}
.skin-select.skin-mf-input option{
    background-color:#0b1530;
    color:#e8f2ff;
}
.skin-select.skin-mf-input option:checked{
    background:linear-gradient(180deg, #204882, #173a6a);
    color:#ffffff;
}
.skin-mf-dash{opacity:.35;font-weight:300;font-size:.9rem}
.skin-mf-seg{
    display:flex;
    border-radius:10px;
    padding:3px;
    gap:2px;
    background:rgba(0,0,0,.22);
    border:1px solid rgba(110,150,200,.18);
}
.skin-mf-seg__btn{
    flex:1;
    margin:0;
    padding:8px 10px;
    border:none;
    border-radius:8px;
    background:transparent;
    color:var(--text-soft);
    font-size:.74rem;
    font-weight:600;
    cursor:pointer;
    transition:background .15s ease, color .15s ease;
}
.skin-mf-seg__btn:hover{color:var(--text)}
.skin-mf-seg__btn.is-active{
    background:rgba(70,120,200,.35);
    color:#e8f2ff;
    box-shadow:0 1px 0 rgba(255,255,255,.06);
}
.skin-mf-pillbtn{
    display:block;
    width:100%;
    margin:0;
    padding:10px 12px;
    border-radius:10px;
    border:1px solid rgba(110,150,200,.22);
    background:rgba(6,14,32,.35);
    color:var(--text-soft);
    font-size:.76rem;
    font-weight:600;
    text-align:left;
    cursor:pointer;
    transition:border-color .15s ease, background .15s ease, color .15s ease;
}
.skin-mf-pillbtn:hover{
    border-color:rgba(140,185,240,.32);
    color:var(--text);
}
.skin-mf-pillbtn.is-on{
    border-color:rgba(100,175,255,.5);
    background:rgba(45,85,145,.32);
    color:#d4e8ff;
}
.skin-mf-refresh{margin-top:6px}
.skin-wx-float{display:inline-block;margin-left:6px;font-size:.68rem;color:var(--text-soft)}
@media (max-width:1100px){
    .skinchanger-section .container.skinchanger-layout{
        grid-template-columns:1fr;
    }
}
.skin-col.rules-card{margin-bottom:0}
.skin-inv-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    margin-bottom:6px;
}
.skin-inv-head h3{margin:0}
.skin-inv-select-all{
    padding:6px 10px;
    min-height:34px;
    font-size:.74rem;
}
.skin-inv-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(120px,1fr));
    gap:10px;
    max-height:min(70vh,640px);
    overflow-y:auto;
    overflow-x:hidden;
    padding:4px 6px 4px 2px;
    scrollbar-width:thin;
    scrollbar-color:rgba(130,185,255,.5) rgba(6,14,32,.5);
}
.skin-inv-grid::-webkit-scrollbar{width:9px}
.skin-inv-grid::-webkit-scrollbar-track{
    background:rgba(6,14,32,.45);
    border-radius:999px;
    margin:4px 0;
}
.skin-inv-grid::-webkit-scrollbar-thumb{
    background:linear-gradient(180deg,rgba(130,190,255,.55),rgba(75,125,210,.45));
    border-radius:999px;
    border:2px solid rgba(6,14,32,.4);
}
.skin-inv-grid::-webkit-scrollbar-thumb:hover{
    background:linear-gradient(180deg,rgba(150,205,255,.7),rgba(90,145,225,.55));
}
.skin-inv-tile{
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:6px;
    padding:8px;
    border-radius:12px;
    border:2px solid var(--line);
    background:rgba(10,26,55,.45);
    color:inherit;
    cursor:pointer;
    text-align:left;
    font:inherit;
    transition:border-color .15s ease, box-shadow .15s ease;
}
.skin-inv-tile:hover{border-color:rgba(130,183,255,.45)}
.skin-inv-tile--selected{
    position:relative;
    border-color:rgba(96,200,255,.85);
    box-shadow:0 0 0 1px rgba(96,200,255,.25);
}
.skin-inv-tile--selected::after{
    content:'';
    position:absolute;
    top:6px;
    right:6px;
    width:10px;
    height:10px;
    border-radius:50%;
    background:linear-gradient(180deg, #6cf0c8, #2ad4a3);
    box-shadow:0 0 0 2px rgba(8,18,42,.9);
}
.skin-inv-tile img{
    width:100%;
    aspect-ratio:16/10;
    object-fit:cover;
    border-radius:8px;
}
.skin-inv-name{font-size:.72rem;line-height:1.25;color:var(--text);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.skin-inv-price{font-size:.8rem;font-weight:700;color:#9fd4ff}
.skin-select{width:100%}
.skin-wx-grid{
    display:flex;
    flex-direction:column;
    gap:12px;
    max-height:min(70vh,680px);
    overflow-y:auto;
}
.skin-wx-card{
    display:flex;
    gap:12px;
    padding:10px;
    border-radius:12px;
    border:1px solid var(--line);
    background:rgba(8,18,42,.5);
}
.skin-wx-card img{
    width:100px;
    min-width:100px;
    height:60px;
    object-fit:cover;
    border-radius:8px;
}
.skin-wx-body{flex:1;min-width:0;display:grid;gap:6px}
.skin-wx-body .btn{margin-top:4px;max-width:140px}

.inventory-status-badge{
    display:inline-block;
    margin-left:8px;
    padding:2px 8px;
    border-radius:999px;
    font-size:.68rem;
    font-weight:600;
    text-transform:uppercase;
    letter-spacing:.04em;
    background:rgba(130,183,255,.2);
    color:#b8d9ff;
    border:1px solid rgba(130,183,255,.35);
}
.inventory-hover-actions{
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(6,14,32,.35), rgba(8,18,42,.94));
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  padding:14px 14px 24px;
  opacity:0;
  pointer-events:none;
  transition:opacity .2s ease;
}
.inventory-hover-actions .btn{
  width:100%;
  max-width:220px;
  margin:0;
  justify-content:center;
  text-align:center;
  font-weight:600;
  border-radius:10px;
}
.inventory-hover-actions a.btn{display:flex}
.inventory-drop-card:hover .inventory-hover-actions{
  opacity:1;
  pointer-events:auto;
}
.event-notice-card{
  display:grid;
  grid-template-columns:minmax(180px,320px) 1fr;
  gap:14px;
  align-items:center;
  background:linear-gradient(145deg,#0f1830,#1a2850);
  border:1px solid rgba(130,180,255,.22);
  border-radius:14px;
  padding:14px;
}
.event-notice-card img{width:100%;max-height:180px;object-fit:cover;border-radius:12px}
.home-events-grid{
  display:grid;
  gap:18px;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));
}
.home-event-card{
  display:flex;
  flex-direction:column;
  background:linear-gradient(165deg,rgba(18,32,58,.92),rgba(8,14,32,.96));
  border:1px solid rgba(120,175,255,.28);
  border-radius:16px;
  overflow:hidden;
  box-shadow:0 12px 36px rgba(0,0,0,.35);
}
.home-event-media{
  aspect-ratio:24/10;
  background:#0a1228;
  border-bottom:1px solid rgba(100,160,240,.15);
}
.home-event-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.home-event-body{
  padding:16px 18px 18px;
  display:grid;
  gap:10px;
}
.home-event-badge{
  justify-self:start;
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  padding:4px 10px;
  border-radius:999px;
  background:rgba(100,190,255,.18);
  border:1px solid rgba(140,210,255,.35);
  color:#d4eeff;
}
.home-event-title{
  margin:0;
  font-size:1.15rem;
  line-height:1.3;
  color:#f0f6ff;
}
.home-event-text{
  margin:0;
  color:var(--text-soft);
  font-size:.92rem;
  line-height:1.5;
}
.home-event-btn{margin-top:4px;justify-self:start}
@media (max-width:560px){
  .home-event-media{aspect-ratio:16/9}
}
.faq-item{border:1px solid rgba(140,170,240,.2);border-radius:10px;padding:10px 12px;margin-bottom:8px;background:rgba(5,12,28,.5)}
.faq-item summary{cursor:pointer;font-weight:700}
.contact-form{display:grid;gap:10px}
.contact-form input,.contact-form textarea{width:100%;border:1px solid rgba(130,170,255,.3);border-radius:10px;background:#0c1730;color:#e7efff;padding:10px 12px}
.xp-ring{
  --p:0;
  --xp-fill:#7dd3ff;
  width:110px;height:110px;border-radius:999px;margin:6px auto 12px;
  display:grid;place-items:center;font-weight:800;
  background:conic-gradient(var(--xp-fill) calc(var(--p) * 1%), rgba(120,170,255,.18) 0);
  position:relative;
}
.xp-ring::after{
  content:"";
  position:absolute; inset:9px; border-radius:999px; background:#0b1630; border:1px solid rgba(130,170,240,.28);
}
.xp-ring span{position:relative;z-index:1}
.overview-cards{display:grid;gap:8px}
.overview-card{border:1px solid rgba(130,170,240,.2);border-radius:10px;padding:9px 10px;background:rgba(15,30,60,.45);display:grid;gap:4px}
.overview-card small{color:var(--text-soft)}
@media (max-width:560px){
  .case-items-grid{grid-template-columns:1fr}
  .spin-result .case-items-grid{grid-template-columns:1fr}
}
