/* تالار افتخارات بازی‌ها — هم‌سنگ نسخه اپ (پودیوم، تیکر زنده، شیمر بارگذاری) */
.qh-ticker{overflow:hidden;white-space:nowrap;mask-image:linear-gradient(to left,transparent,#000 6%,#000 94%,transparent)}
.qh-ticker-track{display:inline-block;padding-inline-start:100%;animation:qh-ticker-move 28s linear infinite}
.qh-ticker:hover .qh-ticker-track{animation-play-state:paused}
@keyframes qh-ticker-move{from{transform:translateX(0)}to{transform:translateX(100%)}}
.qh-pill{font:inherit;font-size:11px;font-weight:900;padding:8px 14px;border-radius:12px;border:1px solid #8794ac55;background:#ffffff08;color:inherit;cursor:pointer;min-height:38px;transition:all .15s;white-space:nowrap}
.qh-pill:hover{transform:translateY(-1px);border-color:#f59e0b}
.qh-pill[aria-pressed=true]{background:linear-gradient(135deg,#f59e0b,#d97706);border-color:#fde047;color:#fff;box-shadow:0 4px 14px rgba(245,158,11,.4)}
.qh-podium{display:grid;grid-template-columns:1fr 1.15fr 1fr;gap:10px;align-items:end;max-width:640px;margin:0 auto}
@media(max-width:520px){.qh-podium{gap:6px}}
.qh-podium-card{border-radius:18px;padding:14px 8px;text-align:center;border:1px solid #8794ac44;background:#ffffff06;position:relative;overflow:hidden}
.qh-podium-card.qh-first{background:linear-gradient(180deg,rgba(245,158,11,.22),rgba(245,158,11,.05));border-color:#f59e0b88;box-shadow:0 10px 30px rgba(245,158,11,.25);padding-top:20px;padding-bottom:18px}
.qh-podium-card.qh-second{background:linear-gradient(180deg,rgba(148,163,184,.2),transparent);border-color:#94a3b855}
.qh-podium-card.qh-third{background:linear-gradient(180deg,rgba(180,83,9,.18),transparent);border-color:#b4530955}
.qh-podium-medal{font-size:30px;line-height:1;filter:drop-shadow(0 4px 6px #0005)}
.qh-first .qh-podium-medal{font-size:40px;animation:qh-crown-bounce 1.6s ease-in-out infinite}
@keyframes qh-crown-bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.qh-avatar{width:46px;height:46px;border-radius:50%;object-fit:cover;border:2px solid #f59e0b;background:#fff;margin:8px auto 4px;display:block}
.qh-first .qh-avatar{width:58px;height:58px;border-width:3px}
.qh-rank-row{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:14px;border:1px solid transparent;transition:background .15s}
.qh-rank-row:hover{background:#ffffff08;border-color:#8794ac33}
.qh-rank-num{width:30px;height:30px;border-radius:10px;display:grid;place-items:center;font-size:12px;font-weight:900;background:#8794ac22;flex:none}
.qh-my-rank{background:linear-gradient(135deg,rgba(245,158,11,.18),rgba(217,119,6,.08));border:1px solid #f59e0b66}
.qh-shimmer{border-radius:14px;min-height:64px;background:linear-gradient(90deg,#8794ac22 25%,#8794ac44 50%,#8794ac22 75%);background-size:200% 100%;animation:qh-shimmer 1.2s infinite}
@keyframes qh-shimmer{from{background-position:200% 0}to{background-position:-200% 0}}
@media(prefers-reduced-motion:reduce){.qh-ticker-track,.qh-first .qh-podium-medal,.qh-shimmer{animation:none}}


/* =========================================================================
   QBGameChat — Unified Game Chat & Voice Styles
   ========================================================================= */
@keyframes qbChatFadeIn {
    from { opacity: 0; transform: translateY(4px); }
    to { opacity: 1; transform: translateY(0); }
}
.animate-fade-in {
    animation: qbChatFadeIn 0.22s cubic-bezier(0.16, 1, 0.3, 1) both;
}
.qb-chat-box::-webkit-scrollbar {
    width: 4px;
}
.qb-chat-box::-webkit-scrollbar-track {
    background: transparent;
}
.qb-chat-box::-webkit-scrollbar-thumb {
    background: rgba(148, 163, 184, 0.3);
    border-radius: 99px;
}
.qb-emotes-row::-webkit-scrollbar {
    height: 3px;
}
.qb-emotes-row::-webkit-scrollbar-thumb {
    background: rgba(148, 163, 184, 0.25);
    border-radius: 99px;
}

/* تضمین ۱۰۰٪ عدم سرریز فرم چت و دکمه ارسال پیام در تمام ابعاد و صفحات */
.qb-unified-chat,
.qb-game-chat-wrapper,
[id$="-unified-chat-panel"] {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
}

.qb-chat-form {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 8px !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding-top: 4px !important;
}

.qb-chat-form .qb-chat-input,
.qb-chat-input {
    flex: 1 1 0% !important;
    width: 0 !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

.qb-chat-form .qb-chat-send,
.qb-chat-send {
    flex: 0 0 auto !important;
    flex-shrink: 0 !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
}

#snakes-unified-chat-panel,
#mench-unified-chat-panel,
#duel-live-chat-panel,
#basketball-unified-chat-panel,
#galaxy-unified-chat-panel,
#soccer-unified-chat-panel,
#snake-unified-chat-panel,
#math-unified-chat-panel {
    width: 100%;
}
#snakes-unified-chat-panel .qb-unified-chat,
#mench-unified-chat-panel .qb-unified-chat,
#duel-live-chat-panel .qb-unified-chat,
#basketball-unified-chat-panel .qb-unified-chat,
#galaxy-unified-chat-panel .qb-unified-chat,
#soccer-unified-chat-panel .qb-unified-chat,
#snake-unified-chat-panel .qb-unified-chat,
#math-unified-chat-panel .qb-unified-chat {
    min-height: 280px;
    max-height: min(400px, calc(100vh - 240px));
    display: flex;
    flex-direction: column;
}
#snakes-unified-chat-panel .qb-chat-box,
#mench-unified-chat-panel .qb-chat-box,
#duel-live-chat-panel .qb-chat-box,
#basketball-unified-chat-panel .qb-chat-box,
#galaxy-unified-chat-panel .qb-chat-box,
#soccer-unified-chat-panel .qb-chat-box,
#snake-unified-chat-panel .qb-chat-box,
#math-unified-chat-panel .qb-chat-box {
    flex: 1 1 auto;
    min-height: 140px;
    max-height: 200px;
}

/* شطرنج: سایدبار چپ دارای کارت تاریخچه حرکات است؛ اما سقف ارتفاع چت باعث می‌شد
   محتوای خودش (فرم ارسال/پیام) از باکس بیرون بزند و ستون اسکرول بخورد.
   پس پنل چت به اندازهٔ محتوای خودش باز می‌شود و فقط لیست پیام‌ها داخلش اسکرول می‌شود. */
/* مرغ کهکشانی هم همین مشکل را داشت: مجموع بنر ویس + ایموت‌ها + فرم ارسال از سقف
   ۴۰۰px بلندتر بود و دکمه «ارسال» حدود ۲۷px از کادر بیرون می‌زد. */
#duel-live-chat-panel .qb-unified-chat,
#galaxy-unified-chat-panel .qb-unified-chat {
    min-height: 0;
    max-height: none;
    overflow: visible;
}
#duel-live-chat-panel .qb-chat-box {
    min-height: 100px;
    max-height: 150px;
}
#chess-moves-card {
    max-height: 140px;
    overflow-y: auto;
}

/* ریسپانسیو اختصاصی لپ‌تاپ‌ها (۱۰۲۴ تا ۱۴۴۰ پیکسل): تناسب ارتفاع چت با صفحه لپ‌تاپ جهت جلوگیری از اسکرول عمودی */
@media (min-width: 1024px) and (max-width: 1440px) {
    #snakes-unified-chat-panel .qb-unified-chat,
    #mench-unified-chat-panel .qb-unified-chat,
    #basketball-unified-chat-panel .qb-unified-chat,
    #galaxy-unified-chat-panel .qb-unified-chat,
    #soccer-unified-chat-panel .qb-unified-chat,
    #snake-unified-chat-panel .qb-unified-chat,
    #math-unified-chat-panel .qb-unified-chat {
        min-height: 260px;
        max-height: min(360px, calc(100vh - 260px));
    }
    #duel-live-chat-panel .qb-unified-chat,
    #galaxy-unified-chat-panel .qb-unified-chat {
        min-height: 0;
        max-height: none;
    }
    #snakes-unified-chat-panel .qb-chat-box,
    #mench-unified-chat-panel .qb-chat-box,
    #basketball-unified-chat-panel .qb-chat-box,
    #galaxy-unified-chat-panel .qb-chat-box,
    #soccer-unified-chat-panel .qb-chat-box,
    #snake-unified-chat-panel .qb-chat-box,
    #math-unified-chat-panel .qb-chat-box {
        min-height: 120px;
        max-height: 180px;
    }
    #duel-live-chat-panel .qb-chat-box {
        min-height: 90px;
        max-height: 130px;
    }
    /* بهینه‌سازی تب‌های بالای صفحه برای جاگیری تمیز در یک ردیف در لپ‌تاپ‌ها */
    #bulletin-filters .filter-btn {
        padding: 0.5rem 0.65rem;
        font-size: 0.76rem;
        gap: 0.35rem;
    }
    #bulletin-filters .filter-btn span:first-child {
        font-size: 1rem;
    }
}

@media (max-width: 860px) {
    #snakes-unified-chat-panel .qb-unified-chat,
    #mench-unified-chat-panel .qb-unified-chat,
    #duel-live-chat-panel .qb-unified-chat,
    #basketball-unified-chat-panel .qb-unified-chat,
    #galaxy-unified-chat-panel .qb-unified-chat,
    #soccer-unified-chat-panel .qb-unified-chat,
    #snake-unified-chat-panel .qb-unified-chat,
    #math-unified-chat-panel .qb-unified-chat {
        min-height: auto;
    }
    #snakes-unified-chat-panel .qb-chat-box,
    #mench-unified-chat-panel .qb-chat-box,
    #duel-live-chat-panel .qb-chat-box,
    #basketball-unified-chat-panel .qb-chat-box,
    #galaxy-unified-chat-panel .qb-chat-box,
    #soccer-unified-chat-panel .qb-chat-box,
    #snake-unified-chat-panel .qb-chat-box,
    #math-unified-chat-panel .qb-chat-box {
        min-height: 160px;
        max-height: 220px;
    }
}

/* =========================================================================
   چیدمان ۳ ستونه استاندارد و عریض بازی‌های کوییزبی (شطرنج، منچ، مار و پله، بسکتبال، کهکشان، فوتبال)
   Universal 3-Column Studio Layout for all games
   ========================================================================= */
.qb-chess-3col-layout,
.qb-mench-3col-layout,
.qb-basketball-3col-layout,
.qb-galaxy-3col-layout,
.qb-soccer-3col-layout,
.qb-snake-3col-layout,
.qb-math-3col-layout,
.qb-games-3col-layout {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.25rem;
    align-items: start;
    width: 100%;
}

/* در موبایل و تبلت: تخته و میدان بازی بالاترین اولویت */
.qb-chess-board-col,
.qb-mench-board-col,
.qb-col-stage {
    order: 1;
    width: 100%;
}
.qb-chess-setup-col,
.qb-mench-chat-col,
.qb-col-setup {
    order: 2;
    width: 100%;
}
.qb-chess-chat-col,
.qb-mench-settings-col,
.qb-col-extra {
    order: 3;
    width: 100%;
}

/* ستون‌های سایدبار منچ: هم‌اندازه ماروپله — چیدمان عمودی با فاصله ۱۴ پیکسل بین کارت‌ها */
.qb-mench-chat-col,
.qb-mench-settings-col {
    display: flex !important;
    flex-direction: column !important;
    gap: 14px !important;
}

/* ستون‌های سایدبار شطرنج: چیدمان عمودی با فاصله استاندارد ۱۶ پیکسل بین کارت‌ها */
.qb-chess-setup-col,
.qb-chess-chat-col {
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
}

/* تطبیق کنسول مدرن و شکیل فرمان و تاس منچ درون سایدبار راست بالای چت */
.qb-mench-chat-col .mench-command-deck {
    margin: 0;
    max-width: 100%;
    width: 100%;
    padding: 14px 16px 12px;
    border-radius: 22px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.qb-mench-chat-col .mench-dice-tray,
.qb-mench-chat-col .mench-dice-stage {
    gap: 0;
    margin: 2px 0 6px;
    width: 100%;
    align-items: center;
    justify-content: center;
}
.qb-mench-chat-col .mench-msg-banner {
    padding: 6px 16px;
    width: fit-content;
    max-width: 88%;
    margin: 0 auto;
    border-radius: 9999px;
}
.qb-mench-chat-col .mench-msg-text {
    font-size: 11.5px;
}
.qb-mench-chat-col .mench-chant-control {
    padding: 8px 10px;
}
.qb-mench-chat-col .mench-grand-roll-btn {
    padding: 11px 16px;
    font-size: 14px;
}
.qb-mench-chat-col .mench-meta-bar {
    font-size: 9.5px;
    margin-top: 6px;
    padding-top: 6px;
    gap: 6px;
    justify-content: center;
}

/* بازی مار و پله — چینش ستون وسط و قرارگیری کادر بازیکنان بالای تخته */
.snakes-board-col {
    grid-area: board;
    display: flex;
    flex-direction: column;
    gap: 12px;
    align-items: center;
    width: 100%;
    max-width: 640px;
    margin: 0 auto;
    min-width: 0;
    box-sizing: border-box;
}
.snakes-board-col .topbar {
    width: 100%;
    margin-bottom: 0;
    box-sizing: border-box;
}
#snakes-die,
.snakes-game .die {
    width: 74px !important;
    height: 74px !important;
    max-width: 74px !important;
    max-height: 74px !important;
}
#snakes-die svg,
.snakes-game .die svg {
    width: 100% !important;
    height: 100% !important;
    max-width: 74px !important;
    max-height: 74px !important;
    display: block !important;
}

/* =========================================================================
   سایدبارهای کاملاً متقارن، متوازن و هم‌اندازه (چپ و راست برابر) برای همه لپ‌تاپ‌ها و مانیتورها
   Symmetric, equal-width sidebars with zero overflow across all laptop & desktop sizes
   ========================================================================= */

/* لپ‌تاپ‌های فشرده و کوچک (۱۰۲۴ تا ۱۲۷۹ پیکسل): هر دو سایدبار کاملاً متقارن ۲۴۵px (شطرنج ۲۹۵px؛ منچ و محاسبات سریع ۲۹۰px) */
@media (min-width: 1024px) and (max-width: 1279px) {
    .qb-basketball-3col-layout,
    .qb-galaxy-3col-layout,
    .qb-soccer-3col-layout,
    .qb-snake-3col-layout,
    .snakes-game .snakes-3col-layout,
    .snakes-3col-layout,
    .qb-games-3col-layout {
        grid-template-columns: 245px minmax(0, 1fr) 245px;
        gap: 0.75rem;
    }
    .qb-mench-3col-layout,
    .qb-math-3col-layout {
        grid-template-columns: 290px minmax(0, 1fr) 290px !important;
        gap: 0.85rem;
    }
    .qb-chess-3col-layout {
        grid-template-columns: 295px minmax(0, 1fr) 295px;
        gap: 1rem;
    }
    .qb-chess-setup-col, .qb-col-setup { order: 1; }
    .qb-chess-board-col, .qb-col-stage { order: 2; }
    .qb-chess-chat-col,  .qb-col-extra { order: 3; }

    .qb-mench-chat-col     { order: 1; }
    .qb-mench-board-col    { order: 2; }
    .qb-mench-settings-col { order: 3; }
}

/* لپ‌تاپ‌های استاندارد و متداول (۱۲۸۰ تا ۱۵۳۵ پیکسل): هر دو سایدبار کاملاً متقارن ۲۷۵px (شطرنج ۳۵۰px؛ منچ و محاسبات سریع ۳۳۵px) */
@media (min-width: 1280px) and (max-width: 1535px) {
    .qb-basketball-3col-layout,
    .qb-galaxy-3col-layout,
    .qb-soccer-3col-layout,
    .qb-snake-3col-layout,
    .snakes-game .snakes-3col-layout,
    .snakes-3col-layout,
    .qb-games-3col-layout {
        grid-template-columns: 275px minmax(0, 1fr) 275px;
        gap: 1rem;
    }
    .qb-mench-3col-layout,
    .qb-math-3col-layout {
        grid-template-columns: 335px minmax(0, 1fr) 335px !important;
        gap: 1rem;
    }
    .qb-chess-3col-layout {
        grid-template-columns: 350px minmax(0, 1fr) 350px;
        gap: 1.25rem;
    }
    .qb-chess-setup-col, .qb-col-setup { order: 1; }
    .qb-chess-board-col, .qb-col-stage { order: 2; }
    .qb-chess-chat-col,  .qb-col-extra { order: 3; }

    .qb-mench-chat-col     { order: 1; }
    .qb-mench-board-col    { order: 2; }
    .qb-mench-settings-col { order: 3; }
}

/* مانیتورهای عریض دسکتاپ (۱۵۳۶ پیکسل به بالا): هر دو سایدبار کاملاً متقارن ۳۰۰px (شطرنج ۳۸۵px؛ منچ و محاسبات سریع ۳۶۰px) */
@media (min-width: 1536px) {
    .qb-basketball-3col-layout,
    .qb-galaxy-3col-layout,
    .qb-soccer-3col-layout,
    .qb-snake-3col-layout,
    .snakes-game .snakes-3col-layout,
    .snakes-3col-layout,
    .qb-games-3col-layout {
        grid-template-columns: 300px minmax(0, 1fr) 300px;
        gap: 1.25rem;
    }
    .qb-mench-3col-layout,
    .qb-math-3col-layout {
        grid-template-columns: 360px minmax(0, 1fr) 360px !important;
        gap: 1.25rem;
    }
    .qb-chess-3col-layout {
        grid-template-columns: 385px minmax(0, 1fr) 385px;
        gap: 1.5rem;
    }
    .qb-chess-setup-col, .qb-col-setup { order: 1; }
    .qb-chess-board-col, .qb-col-stage { order: 2; }
    .qb-chess-chat-col,  .qb-col-extra { order: 3; }

    .qb-mench-chat-col     { order: 1; }
    .qb-mench-board-col    { order: 2; }
    .qb-mench-settings-col { order: 3; }
}

/* نمایشگرهای عریض: سایدبارهای منچ و محاسبات سریع فضای خالی کناره‌ها را می‌گیرند و ستون وسط روی سقف ۶۲۰px می‌ماند */
@media (min-width: 1400px) {
    [data-mench-auth] { max-width: 1440px !important; }
    .qb-mench-3col-layout,
    .qb-math-3col-layout {
        grid-template-columns: minmax(0, 1fr) minmax(0, 620px) minmax(0, 1fr) !important;
        gap: 1.25rem;
    }
    .qb-mench-board-col,
    .qb-math-3col-layout .qb-col-stage {
        max-width: 620px !important;
        width: 100% !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
}
@media (min-width: 1600px) {
    [data-mench-auth] { max-width: none !important; padding-left: 2rem; padding-right: 2rem; }
    .qb-mench-3col-layout,
    .qb-math-3col-layout {
        grid-template-columns: minmax(0, 1fr) minmax(0, 620px) minmax(0, 1fr) !important;
        max-width: 100%;
    }
}

.qb-math-3col-layout .qb-col-stage {
    width: 100% !important;
    max-width: 620px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}
.qb-math-3col-layout .qb-col-setup,
.qb-math-3col-layout .qb-col-extra {
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
    min-width: 0 !important;
}

/* جلوگیری از سرریز افقی و تضمین تناسب ارتفاع میدان بازی‌ها */
.qb-chess-board-col,
.qb-mench-board-col,
.qb-col-stage,
.qb-chess-setup-col,
.qb-col-setup,
.qb-chess-chat-col,
.qb-col-extra {
    min-width: 0 !important;
    box-sizing: border-box !important;
}

/* تنظیم دقیق ابعاد تخته شطرنج جهت تضمین مربع بودن ۱:۱ و عدم کشیدگی در تمام رزولوشن‌ها */
.qb-chess-stage {
    width: 100% !important;
    max-width: min(100%, calc(100vh - 280px), 480px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
}
#chessboard-container {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: none !important;
    aspect-ratio: 1 / 1 !important;
    margin: 0 auto !important;
    box-sizing: border-box !important;
}
#chessboard-grid {
    aspect-ratio: 1 / 1 !important;
    width: 100% !important;
    height: 100% !important;
}
.chess-sq {
    aspect-ratio: 1 / 1 !important;
}
@media (min-width: 1280px) and (max-width: 1535px) {
    .qb-chess-stage {
        max-width: min(100%, calc(100vh - 270px), 520px) !important;
    }
}
@media (min-width: 1536px) {
    .qb-chess-stage {
        max-width: min(100%, calc(100vh - 250px), 550px) !important;
    }
}

/* تناسب و تمیزی المان‌های چت */
.qb-unified-chat {
    width: 100%;
    box-sizing: border-box;
}
.qb-unified-chat .qb-mic-btn,
.qb-unified-chat .qb-speaker-btn {
    white-space: nowrap;
    flex-shrink: 0;
}

/* =========================================================================
   قوانین سراسری ضد سرریز افقی برای تمام لابی‌ها و پنل‌های بازی‌های کوییزبی
   Global Anti-Overflow & Robust Responsive Rules for All Game Lobbies & Sidebars
   ========================================================================= */

/* جلوگیری از سرریز در ستون‌های سایدبار و کارت‌های بازی */
.snakes-chat-column,
.snakes-game .side,
.qb-chess-setup-col,
.qb-chess-chat-col,
.qb-mench-settings-col,
.qb-mench-chat-col,
.qbd-hub-lobby,
.lobby-panel,
.bb-card,
#ss-mode-selector-card,
[data-score-duel] {
    max-width: 100%;
    min-width: 0;
    overflow-x: hidden;
    box-sizing: border-box;
}

/* پوستهٔ صفحهٔ بازی‌ها: روی نمایشگرهای عریض از فضای خالی کناره‌ها استفاده می‌کند
   تا سایدبارها (مثل مار و پله) پهن‌تر شوند؛ زیر ۱۶۰۰px همان max-w-[1440px] می‌ماند. */
@media (min-width: 1600px) {
    .qb-games-shell { max-width: 1640px; }
}

/* ستون چت شطرنج: عمداً scroll container نمی‌شود.
   با overflow-x: hidden مرورگر محور y را auto می‌کند و ستون حتی با وجود فضای خالی
   نوار اسکرول می‌گیرد (کارت چت ۴۵px از باکس بیرون می‌زد). clip هر دو محور را
   می‌بُرد ولی ظرف اسکرول نمی‌سازد؛ چون ارتفاع پنل چت حالا با محتوایش هم‌اندازه است،
   چیزی هم بریده نمی‌شود. */
.qb-chess-chat-col {
    overflow: hidden; /* fallback مرورگرهای قدیمی: نوار اسکرول نمی‌سازد */
    overflow: clip;
}

/* کلیه فیلدهای متنی، عددی و دراپ‌داون‌ها در فلکس و گرید */
.qbd-hub-lobby input,
.qbd-hub-lobby select,
.lobby-panel input,
.lobby-panel select,
.bb-card input,
.bb-card select,
#ss-mode-selector-card input,
#ss-mode-selector-card select,
[data-score-duel] input,
[data-score-duel] select,
.qb-mench-settings-col input,
.qb-mench-settings-col select {
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

/* ردیف‌های ورودی و پیوستن با کد */
.qbd-joinrow,
.joinrow,
.qbd-wager-row {
    display: flex;
    gap: 8px;
    align-items: center;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    flex-wrap: wrap;
    box-sizing: border-box;
}
.qbd-joinrow input,
.joinrow input {
    flex: 1 1 130px;
    min-width: 0 !important;
    max-width: 100%;
}
.qbd-joinrow button,
.joinrow button {
    flex-shrink: 0;
}

/* ردیف‌های تنظیم شرط بندی */
.qbd-wager-row select {
    flex: 1 1 110px;
    min-width: 0 !important;
}
.qbd-wager-row input {
    flex: 1 1 70px;
    min-width: 0 !important;
}
.qbd-wager-row button {
    flex: 1 1 100%;
    width: 100%;
    margin-top: 4px;
}

/* تب‌های حالت و شمارش بازیکنان — گرید انعطاف‌پذیر با حداقل صفر */
.qbd-seg-mode,
.qbd-seg-count,
.snakes-game .seg,
#mench-idx-mode-selector,
#bb-mode-tabs,
#ss-mode-tabs {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 6px !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}
.qbd-seg-mode button,
.qbd-seg-count button,
.snakes-game .seg button,
#mench-idx-mode-selector button,
#bb-mode-tabs button,
#ss-mode-tabs button {
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    padding: 8px 4px !important;
    font-size: 11.5px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 3px !important;
    box-sizing: border-box !important;
}

/* گرید ساخت میز و ورود سریع */
.qbd-create-grid,
.qbd-quick-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
}
.qbd-create-grid button,
.qbd-quick-grid button {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    box-sizing: border-box;
}

/* چیپ‌های مبلغ سریع */
.qbd-wager-chips,
.bb-wager-chips {
    display: flex;
    gap: 4px;
    align-items: center;
    flex-wrap: wrap;
    width: 100%;
    min-width: 0;
}

/* =========================================================================
   ویترین قهرمان و کمد پوسته‌های مار آنلاین (Snake.io Arena VIP Showcase & Wardrobe)
   ========================================================================= */
.snake-hero-showcase {
    background: radial-gradient(ellipse at top right, rgba(16, 185, 129, 0.2), transparent 70%),
                radial-gradient(ellipse at bottom left, rgba(6, 182, 212, 0.16), transparent 70%),
                rgba(15, 23, 42, 0.78);
    border: 1px solid rgba(16, 185, 129, 0.35);
    box-shadow: 0 20px 40px -15px rgba(0, 0, 0, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.12);
}
.skin-card {
    transition: all 0.22s cubic-bezier(0.16, 1, 0.3, 1);
}
.skin-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 20px -6px rgba(0, 0, 0, 0.35);
}
.skin-card.active-skin {
    border-color: #10b981 !important;
    background: rgba(16, 185, 129, 0.14) !important;
    box-shadow: 0 0 20px rgba(16, 185, 129, 0.28), inset 0 0 10px rgba(16, 185, 129, 0.15) !important;
    transform: translateY(-1px);
}
#skins-grid::-webkit-scrollbar,
#global-leaderboard-container::-webkit-scrollbar,
#mt-mini-leaderboard::-webkit-scrollbar {
    width: 5px;
}
#skins-grid::-webkit-scrollbar-track,
#global-leaderboard-container::-webkit-scrollbar-track,
#mt-mini-leaderboard::-webkit-scrollbar-track {
    background: rgba(15, 23, 42, 0.2);
    border-radius: 99px;
}
#skins-grid::-webkit-scrollbar-thumb,
#global-leaderboard-container::-webkit-scrollbar-thumb,
#mt-mini-leaderboard::-webkit-scrollbar-thumb {
    background: rgba(148, 163, 184, 0.35);
    border-radius: 99px;
}
#skins-grid::-webkit-scrollbar-thumb:hover {
    background: rgba(16, 185, 129, 0.6);
}




/* =========================================================================
   سالن تمام‌صفحه بازی (QBArenaFS) — پرتاب طلایی، مرغ کهکشانی، فوتبال ستارگان
   ستون وسط این سه بازی فقط «کارت شروع» است؛ با شروع بازی ریشهٔ همان بازی
   تمام‌صفحه می‌شود و سایدبارها کنار می‌روند (public/js/game-arena-fullscreen.js).
   هیچ گره‌ای جابه‌جا نمی‌شود تا CSS اسکوپ‌شدهٔ هر بازی معتبر بماند.
   ========================================================================= */

/* سایدبارهای پهن‌تر برای این سه بازی: ستون وسط فقط کارت شروع است، پس فضا آزاد است */
@media (min-width: 1024px) and (max-width: 1279px) {
    .qb-basketball-3col-layout,
    .qb-galaxy-3col-layout,
    .qb-soccer-3col-layout {
        grid-template-columns: 290px minmax(0, 1fr) 290px;
        gap: 0.85rem;
    }
}
@media (min-width: 1280px) and (max-width: 1535px) {
    .qb-basketball-3col-layout,
    .qb-galaxy-3col-layout,
    .qb-soccer-3col-layout {
        grid-template-columns: 335px minmax(0, 1fr) 335px;
        gap: 1rem;
    }
}
@media (min-width: 1536px) {
    .qb-basketball-3col-layout,
    .qb-galaxy-3col-layout,
    .qb-soccer-3col-layout {
        grid-template-columns: 382px minmax(0, 1fr) 382px;
        gap: 1.25rem;
    }
}
.qb-basketball-3col-layout > .qb-col-stage,
.qb-galaxy-3col-layout > .qb-col-stage,
.qb-soccer-3col-layout > .qb-col-stage {
    min-width: 0;
}

/* میدان بازی‌های پرتاب طلایی، مرغ کهکشانی و ستارگان فوتبال همیشه درون ستون وسط و عادی باز است */
.qb-arena-docked {
    display: flex !important;
}
.qb-arena-launcher {
    display: none !important;
}
.qb-arena-fs-bar {
    display: none !important;
}

/* ------------- کارت شروع در ستون وسط ------------- */
.qb-arena-launcher {
    position: relative;
    width: 100%;
    overflow: hidden;
    border-radius: 26px;
    border: 1px solid var(--qb-border, rgba(148, 163, 184, 0.25));
    background:
        radial-gradient(120% 90% at 85% 0%, rgba(99, 102, 241, 0.22), transparent 62%),
        radial-gradient(90% 80% at 10% 100%, rgba(245, 158, 11, 0.18), transparent 65%),
        var(--qb-card, #101527);
    padding: 22px 18px 20px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
    box-shadow: 0 18px 40px -24px rgba(0, 0, 0, 0.8);
}
.qb-arena-launcher-art {
    width: 84px;
    height: 84px;
    border-radius: 26px;
    display: grid;
    place-items: center;
    font-size: 40px;
    line-height: 1;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.14);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12), 0 12px 26px -14px rgba(0, 0, 0, 0.9);
}
.qb-arena-launcher h3 {
    margin: 0;
    font-size: 17px;
    font-weight: 900;
    color: var(--qb-head, #f8fafc);
    line-height: 1.5;
}
.qb-arena-launcher p {
    margin: 0;
    font-size: 11.5px;
    font-weight: 700;
    line-height: 2;
    color: var(--qb-muted, #94a3b8);
}
.qb-arena-chips {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 6px;
}
.qb-arena-chip {
    font-size: 10px;
    font-weight: 900;
    padding: 5px 9px;
    border-radius: 999px;
    border: 1px solid rgba(148, 163, 184, 0.28);
    background: rgba(255, 255, 255, 0.05);
    color: #cbd5f5;
    white-space: nowrap;
}
.qb-arena-start {
    width: 100%;
    max-width: 320px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 14px 18px;
    border: 0;
    border-radius: 18px;
    font-size: 13.5px;
    font-weight: 900;
    color: #0b1020;
    cursor: pointer;
    background: linear-gradient(135deg, #fbbf24, #f97316);
    box-shadow: 0 14px 30px -14px rgba(249, 115, 22, 0.85);
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.qb-arena-start:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 34px -14px rgba(249, 115, 22, 0.95);
}
.qb-arena-start:active {
    transform: translateY(0) scale(0.99);
}
.qb-arena-launcher-note {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 10px;
    font-weight: 700;
    color: var(--qb-muted, #94a3b8);
}

/* ------------- نوار بالای حالت تمام‌صفحه ------------- */
.qb-arena-fs-bar {
    flex: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 8px 12px;
    padding-top: max(8px, env(safe-area-inset-top));
    background: linear-gradient(180deg, #0f172af7, #0f172adb);
    border-bottom: 1px solid rgba(148, 163, 184, 0.22);
    color: #e2e8f0;
}
.qb-arena-fs-head {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
}
.qb-arena-fs-icon {
    width: 36px;
    height: 36px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    font-size: 19px;
    background: rgba(255, 255, 255, 0.07);
    border: 1px solid rgba(255, 255, 255, 0.12);
    flex: none;
}
.qb-arena-fs-titles {
    display: flex;
    flex-direction: column;
    min-width: 0;
    line-height: 1.6;
}
.qb-arena-fs-titles b {
    font-size: 12.5px;
    font-weight: 900;
    color: #f8fafc;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.qb-arena-fs-titles small {
    font-size: 9.5px;
    font-weight: 700;
    color: #94a3b8;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.qb-arena-fs-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: none;
}
.qb-arena-fs-hint {
    font-size: 9.5px;
    font-weight: 700;
    color: #64748b;
}
@media (max-width: 520px) {
    .qb-arena-fs-hint { display: none; }
}
.qb-arena-fs-close {
    width: 38px;
    height: 38px;
    border-radius: 12px;
    border: 1px solid rgba(248, 113, 113, 0.4);
    background: rgba(248, 113, 113, 0.14);
    color: #fca5a5;
    font-size: 15px;
    font-weight: 900;
    line-height: 1;
    cursor: pointer;
    display: grid;
    place-items: center;
    transition: background 0.15s ease;
}
.qb-arena-fs-close:hover {
    background: rgba(248, 113, 113, 0.26);
    color: #fff;
}

/* ------------- حالت عادی بازی‌ها (بدون تمام‌صفحه و با حفظ کامل سایدبارها) ------------- */
html.qb-arena-open,
html.qb-arena-open body {
    overflow: auto !important;
}
.qb-arena-live {
    position: static !important;
    inset: auto !important;
    z-index: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    display: block !important;
    overflow: visible !important;
}
.qb-arena-live .qb-col-setup,
.qb-arena-live .qb-col-extra {
    display: flex !important;
}
.qb-arena-live .qb-arena-launcher {
    display: none !important;
}
.qb-arena-live .qb-col-stage {
    min-width: 0 !important;
    width: 100% !important;
}
.qb-arena-live #bb-arena-stage,
.qb-arena-live #gc2-arena-stage,
.qb-arena-live #ss-arena-stage {
    display: flex !important;
    width: 100% !important;
}
/* کارت نتیجهٔ فوتبال پس از پایان مسابقه */
#ss-result-modal {
    z-index: 145;
}

/* کارت زمان‌سنج شطرنج: انتخاب فعلی توپر و رنگی (مانند دکمه فعال تم تخته) */
.chess-speed-tile.is-selected {
    background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%) !important;
    border-color: #a5b4fc !important;
    box-shadow: 0 8px 20px -6px rgba(99, 102, 241, 0.65), inset 0 1px 0 rgba(255, 255, 255, 0.25) !important;
}
.chess-speed-tile.is-selected .qb-text-head { color: #fff !important; }
.chess-speed-tile.is-selected .qb-text-muted { color: rgba(255, 255, 255, 0.78) !important; }
.chess-speed-tile.is-selected > span {
    background: rgba(255, 255, 255, 0.2) !important;
    color: #fff !important;
}
#chess-wager-panel .chess-speed-tile.is-selected {
    background: linear-gradient(135deg, #f59e0b 0%, #ea580c 100%) !important;
    border-color: #fcd34d !important;
    box-shadow: 0 8px 20px -6px rgba(245, 158, 11, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.3) !important;
}
#chess-wager-panel .chess-speed-tile.is-selected [class*="text-amber"] { color: #fff !important; }

/* مار آرنا: استیج تمام‌صفحه بالاتر از منوی ثابت سایت + جلوگیری از سرریز افقی لابی در عرض‌های کم */
#snake-stage { z-index: 120 !important; }
#snake-lobby { overflow-x: clip; max-width: 100%; }

/* میدان‌های پرتاب طلایی / مرغ کهکشانی / فوتبال: باز شدن عادی و درون‌صفحه‌ای (بدون تمام‌صفحه) */
.qb-arena-launcher,
.qb-arena-inline .qb-arena-launcher { display: none !important; }
.qb-arena-fs-bar,
.qb-arena-inline .qb-arena-fs-bar { display: none !important; }

/* =========================================================================
   اصلاح کشیدگی میدان‌ها + گیرکردن زیر منوی ثابت (در همه بازی‌های آرنا)
   میدان در حالت باز/تمام‌صفحه با حفظ نسبت تصویر و وسط‌چین می‌شود؛
   عرض از ارتفاع در دسترس محاسبه می‌شود تا هیچ‌گاه کشیده نشود.
   ========================================================================= */
:root { --qb-nav-h: 76px; }

/* نوار آرنا هنگام اسکرول زیر منوی ثابت پنهان نشود */
.qb-arena-inline,
.qb-arena-live { scroll-margin-top: calc(var(--qb-nav-h) + 10px); }

/* فوتبال: نسبت زمین ۱۱۲۰×۶۸۰ */
.qb-arena-inline .ss-arena,
.qb-arena-live .ss-arena {
    width: min(100%, calc((100dvh - var(--qb-nav-h) - 120px) * 1120 / 680)) !important;
    max-height: none !important;
    margin-inline: auto !important;
    aspect-ratio: 1120 / 680 !important;
}

/* بسکتبال و مرغ کهکشانی: بوم‌ها با نسبت ۱۶:۹ و وسط‌چین */
.qb-arena-inline #bb-stage,
.qb-arena-live #bb-stage,
.qb-arena-inline #gc2-stage,
.qb-arena-live #gc2-stage {
    width: min(100%, calc((100dvh - var(--qb-nav-h) - 120px) * 16 / 9)) !important;
    height: auto !important;
    aspect-ratio: 16 / 9 !important;
    margin-inline: auto !important;
}

/* در عرض‌های کم (موبایل) تمام عرض بماند ولی ارتفاع از نسبت تصویر نیاید */
@media (max-width: 720px) {
    .qb-arena-inline .ss-arena,
    .qb-arena-live .ss-arena,
    .qb-arena-inline #bb-stage,
    .qb-arena-live #bb-stage,
    .qb-arena-inline #gc2-stage,
    .qb-arena-live #gc2-stage {
        width: 100% !important;
    }
}

/* دکمهٔ تمام‌صفحهٔ آرنا + پنهان‌کردن منوی سایت در حالت تمام‌صفحه */
.qb-arena-fs-fsbtn {
    width: 38px;
    height: 38px;
    border-radius: 12px;
    border: 1px solid rgba(148, 163, 184, 0.35);
    background: rgba(148, 163, 184, 0.12);
    color: #cbd5e1;
    font-size: 15px;
    font-weight: 900;
    line-height: 1;
    cursor: pointer;
    display: grid;
    place-items: center;
    transition: background 0.15s ease;
}
.qb-arena-fs-fsbtn:hover { background: rgba(148, 163, 184, 0.24); color: #fff; }

html.qb-arena-open,
html.qb-arena-open body { overflow: hidden !important; }
html.qb-arena-open .qb-mainnav { display: none !important; }

/* در تمام‌صفحه، منو پنهان است؛ ارتفاع در دسترس فقط نوار آرنا را کم می‌کند */
.qb-arena-live .ss-arena {
    width: min(100%, calc((100dvh - 120px) * 1120 / 680)) !important;
}
.qb-arena-live #bb-stage,
.qb-arena-live #gc2-stage {
    width: min(100%, calc((100dvh - 120px) * 16 / 9)) !important;
}