/* Zaplat Gaming — V3.7K.1B Public Mobile & Tablet Surfaces
   Touch-first public UI only. Desktop/laptop pointer layouts are intentionally
   excluded by the activation contract. */

@media (max-width:1366px){
  html.zg-mobile-ui{
    --zg-touch-edge:clamp(10px,2.7vw,18px);
    --zg-touch-gap:clamp(8px,2vw,12px);
    --zg-touch-radius:16px;
  }

  /* Shared public-page rhythm. */
  html.zg-mobile-ui :where(
    .account-page,.join-page,.profile-page,.support-page,.giveaway-page-head,
    .zg-lib-shell,.zg-game-detail-shell,.zg-tournament-engine
  ){
    padding-top:18px!important;
  }

  html.zg-mobile-ui :where(
    .account-card,.join-form-card,.support-hero,.giveaway-current,
    .profile-hero,.tour-engine-hero,.zg-lib-hero
  ){
    border-radius:var(--zg-touch-radius)!important;
  }

  html.zg-mobile-ui :where(
    input,select,textarea,.field input,.field select,
    .zg-lib-search input,.zg-lib-filter-row select
  ){
    font-size:16px!important; /* prevents iOS input zoom */
  }

  html.zg-mobile-ui :where(.modal,.public-modal-backdrop,.media-modal-backdrop,.tour-modal-backdrop,.tour-stream-viewer-backdrop){
    padding:0!important;
    align-items:end!important;
    z-index:1100!important;
  }

  html.zg-mobile-ui :where(.modal-card,.public-modal,.media-modal,.tour-modal,.tour-stream-viewer){
    width:100%!important;
    max-width:720px!important;
    max-height:88dvh!important;
    border-radius:24px 24px 0 0!important;
    padding-bottom:max(18px,env(safe-area-inset-bottom))!important;
  }

  html.zg-mobile-ui .media-modal{
    padding:14px!important;
    padding-bottom:calc(14px + env(safe-area-inset-bottom))!important;
  }

  html.zg-mobile-ui .media-modal-layout{
    min-height:0!important;
  }

  html.zg-mobile-ui .media-modal-frame{
    max-height:56dvh!important;
  }

  /* ------------------------------------------------------------
     Game Library + Game Detail
     ------------------------------------------------------------ */
  html.zg-mobile-ui .zg-lib-shell{
    padding-bottom:calc(var(--zg-mobile-nav-h) + 26px)!important;
  }

  html.zg-mobile-ui .zg-lib-hero{
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:12px!important;
    padding:18px!important;
    margin-bottom:10px!important;
  }

  html.zg-mobile-ui .zg-lib-hero:after{
    font-size:96px!important;
    bottom:-28px!important;
  }

  html.zg-mobile-ui .zg-lib-hero h1{
    margin:5px 0 6px!important;
    font-size:clamp(27px,6vw,39px)!important;
  }

  html.zg-mobile-ui .zg-lib-hero p{
    max-width:58ch!important;
    font-size:10.5px!important;
    line-height:1.6!important;
  }

  html.zg-mobile-ui .zg-lib-hero-stat{
    min-width:104px!important;
    padding:12px!important;
    border-radius:14px!important;
  }

  html.zg-mobile-ui .zg-lib-hero-stat b{
    font-size:27px!important;
  }

  html.zg-mobile-ui .zg-lib-controls{
    position:relative!important;
    top:auto!important;
    z-index:12!important;
    padding:9px!important;
    border-radius:14px!important;
    -webkit-backdrop-filter:none!important;
    backdrop-filter:none!important;
  }

  html.zg-mobile-ui .zg-lib-search{
    margin-bottom:7px!important;
  }

  html.zg-mobile-ui .zg-lib-search input{
    height:46px!important;
    border-radius:12px!important;
  }

  html.zg-mobile-ui .zg-lib-search button{
    width:34px!important;
    height:34px!important;
  }

  html.zg-mobile-ui .zg-lib-filter-row{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:7px!important;
  }

  html.zg-mobile-ui .zg-lib-filter-row select{
    min-height:44px!important;
    height:44px!important;
  }

  html.zg-mobile-ui .zg-lib-results-head{
    min-height:40px!important;
    padding-block:7px!important;
  }

  html.zg-mobile-ui .zg-lib-grid{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:9px!important;
  }

  html.zg-mobile-ui .zg-lib-card{
    border-radius:14px!important;
  }

  html.zg-mobile-ui .zg-lib-card-body{
    min-height:78px!important;
    padding:8px!important;
  }

  html.zg-mobile-ui .zg-lib-card-body h3{
    font-size:10px!important;
    line-height:1.35!important;
  }

  html.zg-mobile-ui .zg-lib-card-body p{
    margin-top:3px!important;
    font-size:7.5px!important;
  }

  html.zg-mobile-ui .zg-game-detail-shell{
    padding-bottom:calc(var(--zg-mobile-nav-h) + 26px)!important;
  }

  html.zg-mobile-ui .zg-game-detail-backdrop{
    height:330px!important;
    opacity:.15!important;
  }

  html.zg-mobile-ui .zg-game-back{
    min-height:38px!important;
    margin-bottom:8px!important;
  }

  html.zg-mobile-ui .zg-game-hero-card{
    grid-template-columns:130px minmax(0,1fr)!important;
    gap:14px!important;
    padding:12px!important;
    border-radius:18px!important;
    align-items:center!important;
  }

  html.zg-mobile-ui .zg-game-hero-copy{
    padding:2px!important;
  }

  html.zg-mobile-ui .zg-game-hero-copy h1{
    margin:7px 0!important;
    font-size:clamp(22px,4.8vw,32px)!important;
    line-height:1.08!important;
  }

  html.zg-mobile-ui .zg-game-tabs{
    position:relative!important;
    margin:9px 0!important;
    padding:5px!important;
    gap:4px!important;
    overflow-x:auto!important;
    scroll-snap-type:x proximity!important;
    scrollbar-width:none!important;
  }

  html.zg-mobile-ui .zg-game-tabs::-webkit-scrollbar{display:none}

  html.zg-mobile-ui .zg-game-tabs button{
    min-height:42px!important;
    padding-inline:11px!important;
    scroll-snap-align:start!important;
  }

  html.zg-mobile-ui .zg-game-detail-grid{
    grid-template-columns:1fr!important;
    gap:10px!important;
  }

  html.zg-mobile-ui :where(.zg-game-section,.zg-game-overview-card,.zg-game-facts-card){
    padding:13px!important;
    border-radius:15px!important;
  }

  html.zg-mobile-ui .zg-game-related-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:7px!important;
  }

  html.zg-mobile-ui .zg-game-addon-list{
    grid-template-columns:1fr!important;
  }

  html.zg-mobile-ui .zg-game-world-cta{
    min-height:70px!important;
    margin-top:10px!important;
  }

  html.zg-mobile-ui .zg-journal-status-grid{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
  }

  /* ------------------------------------------------------------
     Profile, account, join and member-facing forms.
     ------------------------------------------------------------ */
  html.zg-mobile-ui .account-page{
    min-height:calc(100dvh - 150px)!important;
    place-items:start center!important;
  }

  html.zg-mobile-ui .account-card{
    width:100%!important;
    padding:20px!important;
  }

  html.zg-mobile-ui .account-card h1{
    font-size:clamp(25px,5.5vw,34px)!important;
  }

  html.zg-mobile-ui .account-card form{
    gap:10px!important;
    margin-top:15px!important;
  }

  html.zg-mobile-ui .join-page{
    padding-bottom:calc(var(--zg-mobile-nav-h) + 28px)!important;
  }

  html.zg-mobile-ui .join-head{
    margin-bottom:14px!important;
  }

  html.zg-mobile-ui .join-head h1{
    font-size:clamp(28px,6vw,40px)!important;
  }

  html.zg-mobile-ui .join-layout{
    grid-template-columns:1fr!important;
    gap:10px!important;
  }

  html.zg-mobile-ui .join-form-card{
    padding:17px!important;
  }

  html.zg-mobile-ui .join-benefits{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
  }

  html.zg-mobile-ui .join-benefits article{
    padding:14px!important;
  }

  html.zg-mobile-ui .youtube-join-step,
  html.zg-mobile-ui .giveaway-join-box{
    gap:10px!important;
    padding:13px!important;
  }

  html.zg-mobile-ui .profile-page{
    padding-bottom:calc(var(--zg-mobile-nav-h) + 28px)!important;
  }

  html.zg-mobile-ui .profile-hero{
    gap:12px!important;
    padding:16px!important;
  }

  html.zg-mobile-ui .profile-avatar{
    width:60px!important;
    height:60px!important;
    border-radius:17px!important;
    font-size:19px!important;
  }

  html.zg-mobile-ui .profile-main h1{
    font-size:clamp(24px,5vw,34px)!important;
  }

  html.zg-mobile-ui .profile-meta{
    gap:5px!important;
  }

  html.zg-mobile-ui .profile-meta span{
    padding:4px 7px!important;
    font-size:8px!important;
  }

  html.zg-mobile-ui .profile-kpis,
  html.zg-mobile-ui .profile-page .profile-hero-kpis{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:7px!important;
  }

  html.zg-mobile-ui .profile-kpis article,
  html.zg-mobile-ui .profile-page .profile-hero-kpis article{
    padding:10px!important;
  }

  html.zg-mobile-ui .profile-kpis b,
  html.zg-mobile-ui .profile-page .profile-hero-kpis b{
    font-size:20px!important;
  }

  html.zg-mobile-ui .profile-grid{
    grid-template-columns:1fr!important;
    gap:9px!important;
  }

  html.zg-mobile-ui .profile-page .profile-hero-side{
    min-width:0!important;
    max-width:none!important;
    width:100%!important;
  }

  html.zg-mobile-ui .profile-v31-identity{
    max-width:none!important;
  }

  html.zg-mobile-ui .profile-v31-panel-trigger{
    min-height:58px!important;
    padding:9px!important;
  }

  html.zg-mobile-ui .profile-security-strip,
  html.zg-mobile-ui .profile-games-strip{
    min-height:64px!important;
    padding:10px 12px!important;
  }

  html.zg-mobile-ui .profile-security-strip{
    grid-template-columns:40px minmax(0,1fr) auto 24px!important;
    gap:8px!important;
  }

  html.zg-mobile-ui .profile-security-state{
    min-width:0!important;
    padding:6px 8px!important;
    font-size:8px!important;
  }

  /* ------------------------------------------------------------
     Messages and notifications: coexist with the app bottom nav.
     ------------------------------------------------------------ */
  html.zg-mobile-ui .message-dock{
    inset-inline-end:var(--zg-touch-edge)!important;
    inset-inline-start:auto!important;
    bottom:calc(var(--zg-mobile-nav-h) + 18px + env(safe-area-inset-bottom))!important;
    z-index:966!important;
  }

  html.zg-mobile-ui body.zg-arena-open .message-dock{
    display:none!important;
  }

  html.zg-mobile-ui .message-dock>.message-dock-button{
    width:46px!important;
    min-width:46px!important;
    height:46px!important;
    min-height:46px!important;
    padding:0!important;
    border-radius:14px!important;
    gap:0!important;
  }

  html.zg-mobile-ui .message-dock>.message-dock-button .member-utility-label{
    position:absolute!important;
    width:1px!important;
    height:1px!important;
    margin:-1px!important;
    padding:0!important;
    overflow:hidden!important;
    clip:rect(0 0 0 0)!important;
    white-space:nowrap!important;
    border:0!important;
  }

  html.zg-mobile-ui .message-dock>.message-dock-button .member-utility-count{
    inset-inline-start:-5px!important;
    top:-6px!important;
  }

  html.zg-mobile-ui.zg-mobile-input-focus .message-dock>.message-dock-button{
    opacity:0!important;
    pointer-events:none!important;
  }

  html.zg-mobile-ui.zg-mobile-input-focus .message-dock .social-inbox{
    bottom:max(8px,env(safe-area-inset-bottom))!important;
  }

  html.zg-mobile-ui .member-live-notice{
    position:fixed!important;
    z-index:960!important;
    top:calc(64px + env(safe-area-inset-top))!important;
    inset-inline:var(--zg-touch-edge)!important;
    width:auto!important;
    max-width:none!important;
  }

  /* Arena's closed mobile launcher must remain reachable above the new app nav.
     When Arena opens, its existing full-screen mobile UI stays authoritative. */
  html.zg-mobile-ui .arena-dock{
    z-index:965!important;
  }

  html.zg-mobile-ui .arena-dock:not(.panel-open) .arena-dock-button{
    bottom:calc(var(--zg-mobile-nav-h) + 18px + env(safe-area-inset-bottom))!important;
  }

  html.zg-mobile-ui.zg-mobile-input-focus .arena-dock:not(.panel-open) .arena-dock-button{
    opacity:0!important;
    pointer-events:none!important;
  }

  html.zg-mobile-ui .member-center-head{
    gap:8px!important;
    padding:11px 12px!important;
  }

  html.zg-mobile-ui .member-center-head-actions{
    min-width:0!important;
    gap:5px!important;
  }

  html.zg-mobile-ui .member-center-text-btn{
    max-width:120px!important;
    white-space:normal!important;
    line-height:1.25!important;
    font-size:8px!important;
  }
  html.zg-mobile-ui .message-dock .social-inbox{
    position:fixed!important;
    inset-inline:var(--zg-touch-edge)!important;
    top:66px!important;
    bottom:calc(var(--zg-mobile-nav-h) + 18px + env(safe-area-inset-bottom))!important;
    width:auto!important;
    height:auto!important;
    max-height:none!important;
    border-radius:18px!important;
  }

  html.zg-mobile-ui .social-notification-center,
  html.zg-mobile-ui #notificationsCenter.notification-portal{
    position:fixed!important;
    inset-inline:var(--zg-touch-edge)!important;
    top:66px!important;
    bottom:calc(var(--zg-mobile-nav-h) + 18px + env(safe-area-inset-bottom))!important;
    width:auto!important;
    max-width:none!important;
    max-height:none!important;
    border-radius:18px!important;
  }

  html.zg-mobile-ui .member-center-body{
    max-height:none!important;
  }

  html.zg-mobile-ui .social-inbox-head{
    padding:11px 12px 9px!important;
  }

  html.zg-mobile-ui .social-inbox-head h3{
    font-size:18px!important;
  }

  html.zg-mobile-ui .social-inbox-search-wrap{
    padding:8px!important;
  }

  html.zg-mobile-ui .social-inbox-search input{
    height:44px!important;
  }

  html.zg-mobile-ui .social-thread-row{
    min-height:60px!important;
    padding:7px 8px!important;
  }

  html.zg-mobile-ui .social-compose textarea,
  html.zg-mobile-ui .member-center-compose input{
    font-size:16px!important;
  }

  /* ------------------------------------------------------------
     Tournament engine + legacy tournament route.
     ------------------------------------------------------------ */
  html.zg-mobile-ui .zg-tournament-engine{
    padding-bottom:calc(var(--zg-mobile-nav-h) + 24px)!important;
  }

  html.zg-mobile-ui .tour-engine-hero{
    grid-template-columns:minmax(0,1fr) minmax(180px,240px)!important;
    gap:12px!important;
    padding:17px!important;
    border-radius:18px!important;
  }

  html.zg-mobile-ui .tour-engine-hero h1{
    font-size:clamp(25px,5vw,34px)!important;
  }

  html.zg-mobile-ui .tour-engine-seatbox{
    padding:13px!important;
    border-radius:15px!important;
  }

  html.zg-mobile-ui .tour-engine-seatbox strong{
    font-size:28px!important;
  }

  html.zg-mobile-ui .tour-toolbar{
    margin:14px 0 9px!important;
  }

  html.zg-mobile-ui .tour-toolbar nav{
    overflow-x:auto!important;
    flex-wrap:nowrap!important;
    max-width:100%!important;
    padding-bottom:3px!important;
    scrollbar-width:none!important;
  }

  html.zg-mobile-ui .tour-toolbar nav::-webkit-scrollbar{display:none}

  html.zg-mobile-ui .tour-toolbar nav>*{
    flex:0 0 auto!important;
  }

  html.zg-mobile-ui .tour-card-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:9px!important;
  }

  html.zg-mobile-ui .tour-engine-card{
    padding:14px!important;
    border-radius:16px!important;
  }

  html.zg-mobile-ui .tour-detail-grid{
    grid-template-columns:1fr!important;
    gap:9px!important;
  }

  html.zg-mobile-ui .tour-detail-side{
    order:0!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  html.zg-mobile-ui .tour-side-card{
    padding:11px!important;
    border-radius:14px!important;
  }

  html.zg-mobile-ui .tour-bracket-shell{
    min-height:360px!important;
    padding:12px!important;
    touch-action:pan-x pan-y!important;
    -webkit-overflow-scrolling:touch;
  }

  html.zg-mobile-ui .tour-round{
    width:210px!important;
  }

  html.zg-mobile-ui .tour-modal,
  html.zg-mobile-ui .tour-stream-viewer{
    max-height:91dvh!important;
  }

  html.zg-mobile-ui .current-tournament{
    grid-template-columns:minmax(180px,.65fr) minmax(0,1fr)!important;
    min-height:0!important;
    border-radius:18px!important;
  }

  html.zg-mobile-ui .current-tournament-media{
    min-height:180px!important;
  }

  html.zg-mobile-ui .current-tournament-copy{
    padding:18px!important;
  }

  html.zg-mobile-ui .current-tournament h2{
    font-size:24px!important;
  }

  html.zg-mobile-ui .tour-kpis{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:7px!important;
  }

  html.zg-mobile-ui .tour-kpis article{
    padding:11px!important;
  }

  html.zg-mobile-ui .tour-kpis b{
    font-size:24px!important;
  }

  /* ------------------------------------------------------------
     Giveaways, completed games and support.
     ------------------------------------------------------------ */
  html.zg-mobile-ui .giveaway-current{
    grid-template-columns:minmax(0,1fr) minmax(190px,.45fr)!important;
    gap:12px!important;
    padding:18px!important;
  }

  html.zg-mobile-ui .giveaway-current-copy h1{
    font-size:clamp(29px,6vw,42px)!important;
  }

  html.zg-mobile-ui .giveaway-current-copy>p{
    font-size:13px!important;
  }

  html.zg-mobile-ui .giveaway-progress-card{
    padding:14px!important;
    border-radius:15px!important;
  }

  html.zg-mobile-ui .giveaway-progress-card>b{
    font-size:34px!important;
  }

  html.zg-mobile-ui .tier-info-grid{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:8px!important;
  }

  html.zg-mobile-ui .tier-info{
    padding:13px!important;
  }

  html.zg-mobile-ui .prize-grid{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:8px!important;
  }

  html.zg-mobile-ui .completed-grid{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:9px!important;
  }

  html.zg-mobile-ui .game-tile{
    border-radius:14px!important;
  }

  html.zg-mobile-ui .game-tile .info{
    padding:9px!important;
  }

  html.zg-mobile-ui .game-tile h3{
    font-size:11px!important;
  }

  html.zg-mobile-ui .game-tile p{
    font-size:8px!important;
  }

  html.zg-mobile-ui .support-page{
    padding-bottom:calc(var(--zg-mobile-nav-h) + 24px)!important;
  }

  html.zg-mobile-ui .support-hero{
    grid-template-columns:1fr!important;
    gap:10px!important;
    padding:20px!important;
  }

  html.zg-mobile-ui .support-hero h1{
    font-size:clamp(30px,6vw,44px)!important;
  }

  html.zg-mobile-ui .support-reasons{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:8px!important;
  }

  html.zg-mobile-ui .support-reasons article{
    padding:14px!important;
  }

  html.zg-mobile-ui .support-band{
    margin-top:20px!important;
  }

  html.zg-mobile-ui .support-band-inner{
    min-height:0!important;
    padding-block:14px!important;
  }

  /* ------------------------------------------------------------
     Game World + editorial site-shell pages.
     These rules intentionally use !important because editorial-v1.css can
     arrive after the shared shell bundle on Cloudflare-rendered pages.
     ------------------------------------------------------------ */
  html.zg-mobile-ui .gw-shell{
    width:calc(100% - (var(--zg-touch-edge) * 2))!important;
  }

  html.zg-mobile-ui .gw-hero,
  html.zg-mobile-ui .gw-world-hero{
    min-height:0!important;
    padding:30px 0 24px!important;
    align-items:center!important;
  }

  html.zg-mobile-ui .gw-hero-grid{
    grid-template-columns:minmax(0,1fr) minmax(160px,220px)!important;
    gap:16px!important;
    align-items:center!important;
  }

  html.zg-mobile-ui .gw-world-art{
    width:min(46vw,460px)!important;
    opacity:.22!important;
  }

  html.zg-mobile-ui .gw-world-identity{
    margin-bottom:10px!important;
    padding:6px 9px 6px 6px!important;
    border-radius:14px!important;
    gap:8px!important;
  }

  html.zg-mobile-ui .gw-world-identity-mark{
    width:42px!important;
    height:42px!important;
    flex-basis:42px!important;
    border-radius:12px!important;
    font-size:14px!important;
  }

  html.zg-mobile-ui .gw-world-identity-copy strong{
    max-width:46vw!important;
    font-size:18px!important;
  }

  html.zg-mobile-ui .gw-hero h1{
    margin:8px 0 9px!important;
    font-size:clamp(31px,6.2vw,48px)!important;
  }

  html.zg-mobile-ui .gw-hero p{
    font-size:11px!important;
    line-height:1.65!important;
  }

  html.zg-mobile-ui .gw-hero-card{
    padding:15px!important;
    border-radius:16px!important;
  }

  html.zg-mobile-ui .gw-hero-card b{
    font-size:25px!important;
  }

  html.zg-mobile-ui .gw-library-link{
    min-height:44px!important;
    margin-top:10px!important;
    padding:9px 10px!important;
  }

  html.zg-mobile-ui .gw-tools{
    position:relative!important;
    top:auto!important;
    padding:9px 0!important;
  }

  html.zg-mobile-ui .gw-search-wrap{
    grid-template-columns:minmax(0,1fr) minmax(140px,190px)!important;
    gap:7px!important;
  }

  html.zg-mobile-ui .gw-search input,
  html.zg-mobile-ui .gw-filter{
    height:44px!important;
    font-size:16px!important;
  }

  html.zg-mobile-ui .gw-section-tabs{
    flex-wrap:nowrap!important;
    overflow-x:auto!important;
    scroll-snap-type:x proximity!important;
    padding:7px 0 10px!important;
    scrollbar-width:none!important;
  }

  html.zg-mobile-ui .gw-section-tabs::-webkit-scrollbar{display:none}

  html.zg-mobile-ui .gw-tab{
    flex:0 0 auto!important;
    min-height:40px!important;
    display:inline-flex!important;
    align-items:center!important;
    scroll-snap-align:start!important;
  }

  html.zg-mobile-ui .gw-community-games,
  html.zg-mobile-ui .gw-discovery,
  html.zg-mobile-ui .gw-franchise-hub{
    padding-top:19px!important;
  }

  html.zg-mobile-ui .gw-community-game-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
  }

  html.zg-mobile-ui .gw-world-strip{
    grid-auto-columns:minmax(175px,220px)!important;
    gap:8px!important;
  }

  html.zg-mobile-ui .gw-franchise-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
  }

  html.zg-mobile-ui .gw-franchise-card{
    min-height:96px!important;
    grid-template-columns:58px minmax(0,1fr) 26px!important;
    gap:8px!important;
    border-radius:14px!important;
  }

  html.zg-mobile-ui .gw-franchise-art{
    height:76px!important;
  }

  html.zg-mobile-ui .gw-content-head{
    margin:14px 0 10px!important;
  }

  html.zg-mobile-ui .gw-content-head h2{
    font-size:23px!important;
  }

  html.zg-mobile-ui .gw-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:9px!important;
    padding-bottom:calc(var(--zg-mobile-nav-h) + 28px)!important;
  }

  html.zg-mobile-ui .gw-card{
    border-radius:14px!important;
  }

  html.zg-mobile-ui .gw-card-body{
    padding:11px!important;
  }

  html.zg-mobile-ui .gw-card h3{
    font-size:13px!important;
    line-height:1.45!important;
  }

  html.zg-mobile-ui .gw-card p{
    font-size:9px!important;
    line-height:1.55!important;
  }

  html.zg-mobile-ui .gw-card-meta{
    gap:7px!important;
    margin-top:8px!important;
    font-size:7.5px!important;
    flex-wrap:wrap!important;
  }

  /* Editorial article readability. */
  html.zg-mobile-ui .article-hero{
    padding:22px 0 14px!important;
  }

  html.zg-mobile-ui .article-head{
    grid-template-columns:minmax(0,1fr) minmax(220px,34vw)!important;
    gap:16px!important;
    align-items:center!important;
  }

  html.zg-mobile-ui .article-title h1{
    margin:8px 0!important;
    font-size:clamp(28px,5.5vw,42px)!important;
  }

  html.zg-mobile-ui .article-title p{
    font-size:11.5px!important;
    line-height:1.7!important;
  }

  html.zg-mobile-ui .article-layout{
    grid-template-columns:minmax(0,1fr) minmax(200px,260px)!important;
    gap:14px!important;
    padding-bottom:calc(var(--zg-mobile-nav-h) + 24px)!important;
  }

  html.zg-mobile-ui .article-content{
    padding:20px!important;
    border-radius:17px!important;
  }

  html.zg-mobile-ui .editorial-paragraph{
    font-size:15px!important;
    line-height:1.9!important;
  }

  html.zg-mobile-ui .editorial-image{
    margin:20px auto!important;
  }

  html.zg-mobile-ui .editorial-image img{
    max-height:55svh!important;
  }

  html.zg-mobile-ui .article-content table{
    display:block!important;
    max-width:100%!important;
    overflow-x:auto!important;
    -webkit-overflow-scrolling:touch;
  }
}

/* Phone-specific composition. */
@media (max-width:1366px){
  html.zg-mobile-ui .zg-lib-hero{
    grid-template-columns:1fr!important;
  }

  html.zg-mobile-ui .zg-lib-hero-stat{
    width:100%!important;
    display:grid!important;
    grid-template-columns:auto auto 1fr!important;
    align-items:baseline!important;
    gap:8px!important;
    text-align:start!important;
  }

  html.zg-mobile-ui .zg-lib-hero-stat b{
    margin:0!important;
  }

  html.zg-mobile-ui .zg-lib-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
  }

  html.zg-mobile-ui .zg-game-hero-card{
    grid-template-columns:96px minmax(0,1fr)!important;
    gap:10px!important;
  }

  html.zg-mobile-ui .zg-game-hero-copy h1{
    font-size:20px!important;
  }

  html.zg-mobile-ui .zg-game-chip-row.genres{
    display:none!important;
  }

  html.zg-mobile-ui .zg-game-related-grid{
    grid-template-columns:1fr!important;
  }

  html.zg-mobile-ui .zg-journal-status-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  html.zg-mobile-ui .join-benefits{
    grid-template-columns:1fr!important;
  }

  html.zg-mobile-ui .profile-security-strip{
    grid-template-columns:38px minmax(0,1fr) 24px!important;
  }

  html.zg-mobile-ui .profile-security-state{
    grid-column:2!important;
    justify-self:start!important;
  }

  html.zg-mobile-ui .tour-engine-hero{
    grid-template-columns:1fr!important;
  }

  html.zg-mobile-ui .tour-engine-seatbox{
    grid-template-columns:auto minmax(0,1fr)!important;
    align-items:center!important;
  }

  html.zg-mobile-ui .tour-engine-seatbox .tour-seat-progress{
    grid-column:1/-1!important;
  }

  html.zg-mobile-ui .tour-card-grid{
    grid-template-columns:1fr!important;
  }

  html.zg-mobile-ui .tour-detail-side{
    grid-template-columns:1fr!important;
  }

  html.zg-mobile-ui .current-tournament{
    grid-template-columns:1fr!important;
  }

  html.zg-mobile-ui .current-tournament-media{
    min-height:0!important;
    height:clamp(145px,42vw,180px)!important;
  }

  html.zg-mobile-ui .tour-kpis{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  html.zg-mobile-ui .giveaway-current{
    grid-template-columns:1fr!important;
  }

  html.zg-mobile-ui .giveaway-progress-card{
    min-height:120px!important;
  }

  html.zg-mobile-ui .tier-info-grid{
    grid-template-columns:1fr!important;
  }

  html.zg-mobile-ui .prize-grid,
  html.zg-mobile-ui .completed-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  html.zg-mobile-ui .support-reasons{
    grid-template-columns:1fr!important;
  }

  html.zg-mobile-ui .support-reasons article{
    min-height:0!important;
  }

  html.zg-mobile-ui .gw-hero-grid{
    grid-template-columns:1fr!important;
    gap:10px!important;
  }

  html.zg-mobile-ui .gw-world-art{
    inset-inline:25% -12%!important;
    width:80vw!important;
    opacity:.13!important;
  }

  html.zg-mobile-ui .gw-hero-card{
    width:100%!important;
    max-width:none!important;
  }

  html.zg-mobile-ui .gw-search-wrap{
    grid-template-columns:1fr!important;
  }

  html.zg-mobile-ui .gw-community-game-grid{
    display:grid!important;
    grid-template-columns:none!important;
    grid-auto-flow:column!important;
    grid-auto-columns:minmax(220px,72vw)!important;
    gap:8px!important;
    overflow-x:auto!important;
    scroll-snap-type:x mandatory!important;
  }

  html.zg-mobile-ui .gw-franchise-grid{
    grid-template-columns:1fr!important;
  }

  /* Mobile editorial feed becomes compact horizontal rows instead of giant
     full-width 16:9 cards stacked one per screen. */
  html.zg-mobile-ui .gw-grid{
    grid-template-columns:1fr!important;
    gap:8px!important;
  }

  html.zg-mobile-ui .gw-card>a{
    display:grid!important;
    grid-template-columns:112px minmax(0,1fr)!important;
    min-height:112px!important;
  }

  html.zg-mobile-ui .gw-card-cover{
    aspect-ratio:auto!important;
    min-height:112px!important;
    height:100%!important;
  }

  html.zg-mobile-ui .gw-card-cover img{
    object-fit:cover!important;
  }

  html.zg-mobile-ui .gw-card-type{
    top:7px!important;
    inset-inline-start:7px!important;
    padding:4px 6px!important;
    font-size:6px!important;
  }

  html.zg-mobile-ui .gw-card-body{
    align-self:center!important;
    padding:9px 10px!important;
  }

  html.zg-mobile-ui .gw-card-kicker{
    min-height:0!important;
    font-size:7px!important;
  }

  html.zg-mobile-ui .gw-card h3{
    margin:4px 0!important;
    font-size:11px!important;
    line-height:1.35!important;
  }

  html.zg-mobile-ui .gw-card p{
    -webkit-line-clamp:2!important;
    font-size:8px!important;
  }

  html.zg-mobile-ui .gw-card-meta{
    margin-top:5px!important;
    font-size:6.5px!important;
  }

  html.zg-mobile-ui .article-head{
    grid-template-columns:1fr!important;
    gap:11px!important;
  }

  html.zg-mobile-ui .article-cover{
    max-width:100%!important;
    aspect-ratio:16/9!important;
    border-radius:15px!important;
  }

  html.zg-mobile-ui .article-layout{
    grid-template-columns:1fr!important;
    gap:10px!important;
  }

  html.zg-mobile-ui .article-side{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  html.zg-mobile-ui .article-content{
    padding:16px!important;
  }

  html.zg-mobile-ui .editorial-paragraph{
    font-size:14.5px!important;
  }
}

@media (max-width:420px){
  html.zg-mobile-ui .zg-lib-filter-row{
    grid-template-columns:1fr!important;
  }

  html.zg-mobile-ui .zg-lib-card-body{
    min-height:70px!important;
  }

  html.zg-mobile-ui .profile-kpis,
  html.zg-mobile-ui .profile-page .profile-hero-kpis{
    gap:6px!important;
  }

  html.zg-mobile-ui .prize-grid,
  html.zg-mobile-ui .completed-grid{
    gap:7px!important;
  }

  html.zg-mobile-ui .article-side{
    grid-template-columns:1fr!important;
  }
}

/* Short landscape phones: preserve usable content height without changing desktop. */
@media (max-width:899px) and (max-height:560px){
  html.zg-mobile-ui{--zg-mobile-nav-h:58px}
  html.zg-mobile-ui .topbar-inner.shell{min-height:50px!important;padding-block:4px!important}
  html.zg-mobile-ui .topbar-inner>.brand .brand-logo{width:36px!important;height:36px!important;flex-basis:36px!important}
  html.zg-mobile-ui .member-utility-btn,
  html.zg-mobile-ui .member-profile-shortcut{width:36px!important;min-width:36px!important;height:36px!important;min-height:36px!important}
  html.zg-mobile-ui .member-profile-avatar{width:30px!important;height:30px!important}
  html.zg-mobile-ui .zg-mobile-bottom-nav{min-height:58px!important;inset-block-end:max(4px,env(safe-area-inset-bottom))!important}
  html.zg-mobile-ui .zg-mobile-nav-item{min-height:48px!important;grid-template-rows:20px auto!important}
  html.zg-mobile-ui .zg-mobile-nav-item svg{width:19px!important;height:19px!important}
  html.zg-mobile-ui .message-dock{bottom:calc(58px + 12px + env(safe-area-inset-bottom))!important}
}

/* V3.7K.4 — S23 Ultra / Tab S8 visual-density and overlay polish. */
@media (max-width:1366px){
  /* Compact floating actions above the app nav instead of oversized detached pills. */
  html.zg-mobile-ui .arena-dock{
    position:fixed!important;
    inset-inline-start:var(--zg-touch-edge)!important;
    inset-inline-end:auto!important;
    top:auto!important;
    bottom:calc(var(--zg-mobile-nav-h) + 16px + env(safe-area-inset-bottom))!important;
    width:auto!important;
    height:auto!important;
    z-index:965!important;
    pointer-events:none!important;
  }

  html.zg-mobile-ui .arena-dock:not(.panel-open) .arena-dock-button{
    position:relative!important;
    inset:auto!important;
    width:108px!important;
    min-width:108px!important;
    height:46px!important;
    min-height:46px!important;
    padding:6px 9px!important;
    display:flex!important;
    flex-direction:row!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:7px!important;
    border-radius:14px!important;
    pointer-events:auto!important;
  }

  html.zg-mobile-ui .arena-dock:not(.panel-open) .arena-dock-logo{
    width:29px!important;
    min-width:29px!important;
    height:29px!important;
    min-height:29px!important;
    border-radius:9px!important;
    font-size:9px!important;
    transform:none!important;
  }

  html.zg-mobile-ui .arena-dock:not(.panel-open) .arena-dock-logo>span{
    transform:none!important;
  }

  html.zg-mobile-ui .arena-dock:not(.panel-open) .arena-dock-logo::after{
    inset:4px!important;
    border-radius:6px!important;
  }

  html.zg-mobile-ui .arena-dock:not(.panel-open) .arena-dock-title{
    display:block!important;
    max-width:58px!important;
    margin:0!important;
    font-size:9px!important;
    line-height:1.15!important;
    white-space:normal!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    text-align:start!important;
  }

  html.zg-mobile-ui .arena-dock:not(.panel-open) .arena-dock-subtitle{
    display:none!important;
  }

  html.zg-mobile-ui .message-dock{
    inset-inline-end:var(--zg-touch-edge)!important;
    inset-inline-start:auto!important;
    bottom:calc(var(--zg-mobile-nav-h) + 16px + env(safe-area-inset-bottom))!important;
  }

  /* Messages/notifications become real full-screen mobile layers. */
  html.zg-mobile-ui .message-dock .social-inbox,
  html.zg-mobile-ui .social-notification-center,
  html.zg-mobile-ui #notificationsCenter.notification-portal{
    position:fixed!important;
    top:max(8px,env(safe-area-inset-top))!important;
    bottom:max(8px,env(safe-area-inset-bottom))!important;
    inset-inline:8px!important;
    width:auto!important;
    height:auto!important;
    max-width:none!important;
    max-height:none!important;
    border-radius:19px!important;
    z-index:1120!important;
  }

  html.zg-mobile-ui:has(#messagesCenter:not([hidden])) .zg-mobile-bottom-nav,
  html.zg-mobile-ui:has(#notificationsCenter:not([hidden])) .zg-mobile-bottom-nav,
  html.zg-mobile-ui:has(#messagesCenter:not([hidden])) .arena-dock,
  html.zg-mobile-ui:has(#notificationsCenter:not([hidden])) .arena-dock{
    opacity:0!important;
    pointer-events:none!important;
  }

  html.zg-mobile-ui .social-inbox-layout{
    min-height:0!important;
  }

  html.zg-mobile-ui .social-inbox-main,
  html.zg-mobile-ui .social-inbox-sidebar{
    min-height:0!important;
  }

  html.zg-mobile-ui .social-conversation-pane{
    min-height:0!important;
  }

  /* Game World hero: informative but no longer consumes most of the phone. */
  html.zg-mobile-ui .gw-hero,
  html.zg-mobile-ui .gw-world-hero{
    padding:22px 0 16px!important;
  }

  html.zg-mobile-ui .gw-hero h1{
    margin:7px 0 8px!important;
    font-size:clamp(28px,5.4vw,38px)!important;
    line-height:1.06!important;
  }

  html.zg-mobile-ui .gw-hero p{
    font-size:10.5px!important;
    line-height:1.65!important;
  }

  html.zg-mobile-ui .gw-hero-card{
    padding:12px!important;
    border-radius:14px!important;
  }

  html.zg-mobile-ui .gw-library-link{
    min-height:40px!important;
    margin-top:7px!important;
    padding:7px 9px!important;
    border-radius:10px!important;
    font-size:10px!important;
  }

  html.zg-mobile-ui .gw-library-link i{
    font-size:16px!important;
  }

  html.zg-mobile-ui .gw-content-head h2{
    font-size:21px!important;
  }
}

@media (max-width:1366px){
  html.zg-mobile-ui .message-dock .social-inbox,
  html.zg-mobile-ui .social-notification-center,
  html.zg-mobile-ui #notificationsCenter.notification-portal{
    inset-inline:6px!important;
    top:max(6px,env(safe-area-inset-top))!important;
    bottom:max(6px,env(safe-area-inset-bottom))!important;
    border-radius:18px!important;
  }

  html.zg-mobile-ui .member-center-head{
    padding:9px 10px!important;
  }

  html.zg-mobile-ui .member-center-head h3,
  html.zg-mobile-ui .social-inbox-head h3{
    font-size:16px!important;
  }

  html.zg-mobile-ui .social-inbox-search-wrap{
    padding:7px!important;
  }

  html.zg-mobile-ui .social-inbox-search input{
    height:42px!important;
  }

  html.zg-mobile-ui .social-thread-row{
    min-height:56px!important;
  }

  html.zg-mobile-ui .social-compose{
    padding-top:7px!important;
  }

  html.zg-mobile-ui .social-compose input{
    min-height:44px!important;
  }

  html.zg-mobile-ui .gw-hero-grid{
    gap:9px!important;
  }

  html.zg-mobile-ui .gw-hero h1{
    font-size:clamp(29px,8.2vw,35px)!important;
  }

  html.zg-mobile-ui .gw-hero-card{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    grid-template-areas:
      "eyebrow count"
      "label count"
      "cta cta"!important;
    align-items:center!important;
    column-gap:10px!important;
    row-gap:3px!important;
  }

  html.zg-mobile-ui .gw-hero-card>.gw-eyebrow{
    grid-area:eyebrow!important;
    font-size:7px!important;
  }

  html.zg-mobile-ui .gw-hero-card>b{
    grid-area:count!important;
    margin:0!important;
    font-size:27px!important;
    line-height:1!important;
  }

  html.zg-mobile-ui .gw-hero-card>small{
    grid-area:label!important;
    margin:0!important;
    font-size:8px!important;
  }

  html.zg-mobile-ui .gw-hero-card>.gw-library-link{
    grid-area:cta!important;
    margin-top:6px!important;
  }

  html.zg-mobile-ui .gw-community-games,
  html.zg-mobile-ui .gw-discovery,
  html.zg-mobile-ui .gw-franchise-hub{
    padding-top:14px!important;
  }

  html.zg-mobile-ui .gw-content-head{
    margin:11px 0 8px!important;
  }

  html.zg-mobile-ui .gw-content-head h2{
    font-size:19px!important;
  }

  html.zg-mobile-ui .gw-card>a{
    grid-template-columns:92px minmax(0,1fr)!important;
    min-height:96px!important;
  }

  html.zg-mobile-ui .gw-card-cover{
    min-height:96px!important;
  }

  html.zg-mobile-ui .gw-card h3{
    font-size:10.5px!important;
  }

  html.zg-mobile-ui .gw-card p{
    display:none!important;
  }
}

/* Tablet now shares the phone composition below. */

/* V3.7K.4B — consistent mobile type/spacing scale across secondary routes. */
@media (max-width:1366px){
  html.zg-mobile-ui .giveaway-current{
    padding:14px!important;
    gap:9px!important;
  }

  html.zg-mobile-ui .giveaway-current-copy h1{
    margin:6px 0!important;
    font-size:clamp(25px,7vw,31px)!important;
    line-height:1.08!important;
  }

  html.zg-mobile-ui .giveaway-current-copy>p{
    font-size:10.5px!important;
    line-height:1.65!important;
  }

  html.zg-mobile-ui .giveaway-choice-chips{
    margin:10px 0 0!important;
    gap:5px!important;
  }

  html.zg-mobile-ui .giveaway-choice-chips span{
    padding:5px 7px!important;
    font-size:7.5px!important;
  }

  html.zg-mobile-ui .giveaway-progress-card{
    min-height:92px!important;
    padding:11px!important;
  }

  html.zg-mobile-ui .giveaway-progress-card>b{
    margin:2px 0 5px!important;
    font-size:27px!important;
  }

  html.zg-mobile-ui .support-hero{
    padding:15px!important;
  }

  html.zg-mobile-ui .support-hero h1{
    margin:6px 0 8px!important;
    font-size:clamp(26px,7vw,32px)!important;
    line-height:1.08!important;
  }

  html.zg-mobile-ui .support-hero p{
    font-size:10.5px!important;
    line-height:1.65!important;
  }

  html.zg-mobile-ui .tour-engine-hero{
    gap:8px!important;
    padding:13px!important;
  }

  html.zg-mobile-ui .tour-engine-hero h1{
    font-size:clamp(24px,6.5vw,30px)!important;
    line-height:1.1!important;
  }

  html.zg-mobile-ui .tour-engine-card{
    padding:11px!important;
    border-radius:13px!important;
  }

  html.zg-mobile-ui .tour-engine-card h3{
    margin:5px 0 3px!important;
    font-size:14px!important;
  }

  html.zg-mobile-ui .tour-engine-card .tour-card-meta{
    margin:8px 0!important;
    gap:4px!important;
  }

  html.zg-mobile-ui .tour-engine-card .tour-card-meta span{
    padding:4px 6px!important;
    font-size:7px!important;
  }

  html.zg-mobile-ui .profile-hero{
    padding:12px!important;
  }

  html.zg-mobile-ui .profile-main h1{
    font-size:clamp(22px,6vw,28px)!important;
  }

  html.zg-mobile-ui .account-card{
    padding:15px!important;
  }

  html.zg-mobile-ui .account-card h1,
  html.zg-mobile-ui .join-head h1{
    font-size:clamp(24px,6.5vw,30px)!important;
  }

  html.zg-mobile-ui .zg-lib-hero{
    padding:13px!important;
  }

  html.zg-mobile-ui .zg-lib-hero h1{
    font-size:clamp(24px,6.5vw,30px)!important;
  }

  html.zg-mobile-ui .zg-lib-hero p{
    font-size:9.5px!important;
  }
}

/* Tablet now shares the phone composition below. */

/* V3.7K.5/K.7 — floating controls repair + Arena mobile-first social pass. */
@media (max-width:1366px){
  /* Use physical sides on mobile so RTL does not swap the intended controls. */
  html.zg-mobile-ui #arenaDock.arena-dock{
    position:fixed!important;
    left:var(--zg-touch-edge)!important;
    right:auto!important;
    inset-inline-start:auto!important;
    inset-inline-end:auto!important;
    top:auto!important;
    bottom:calc(var(--zg-mobile-nav-h) + 16px + env(safe-area-inset-bottom))!important;
    width:auto!important;
    height:auto!important;
    z-index:1020!important;
    pointer-events:none!important;
  }

  html.zg-mobile-ui #arenaDock:not(.panel-open) #arenaDockBtn{
    position:relative!important;
    inset:auto!important;
    width:112px!important;
    min-width:112px!important;
    height:48px!important;
    min-height:48px!important;
    padding:6px 9px!important;
    display:grid!important;
    grid-template-columns:31px minmax(0,1fr)!important;
    grid-template-areas:"logo title"!important;
    align-items:center!important;
    gap:7px!important;
    border-radius:15px!important;
    overflow:hidden!important;
    pointer-events:auto!important;
  }

  html.zg-mobile-ui #arenaDock:not(.panel-open) #arenaDockBtn .arena-dock-logo{
    grid-area:logo!important;
    width:31px!important;
    min-width:31px!important;
    height:31px!important;
    min-height:31px!important;
    margin:0!important;
    border-radius:9px!important;
    transform:none!important;
  }

  html.zg-mobile-ui #arenaDock:not(.panel-open) #arenaDockBtn .arena-dock-title{
    grid-area:title!important;
    display:block!important;
    max-width:none!important;
    margin:0!important;
    color:#fff!important;
    font:900 9px/1.18 Inter,Cairo,sans-serif!important;
    white-space:normal!important;
    text-align:start!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  html.zg-mobile-ui #arenaDock:not(.panel-open) #arenaDockBtn .arena-dock-subtitle,
  html.zg-mobile-ui #arenaDock:not(.panel-open) #arenaDockBtn .arena-v33-launch-presence,
  html.zg-mobile-ui #arenaDock:not(.panel-open) #arenaDockBtn .arena-platform-presence,
  html.zg-mobile-ui #arenaDock:not(.panel-open) #arenaDockBtn .arena-v33-launch-cta{
    display:none!important;
  }

  html.zg-mobile-ui .message-dock{
    position:fixed!important;
    right:var(--zg-touch-edge)!important;
    left:auto!important;
    inset-inline-start:auto!important;
    inset-inline-end:auto!important;
    bottom:calc(var(--zg-mobile-nav-h) + 16px + env(safe-area-inset-bottom))!important;
    z-index:1021!important;
  }

  html.zg-mobile-ui.zg-mobile-arena-open .message-dock{
    display:none!important;
  }

  html.zg-mobile-ui .message-dock>.message-dock-button{
    width:48px!important;
    min-width:48px!important;
    height:48px!important;
    min-height:48px!important;
    border-radius:15px!important;
    box-shadow:0 14px 36px rgba(0,0,0,.38),0 0 0 1px rgba(255,255,255,.025) inset!important;
  }

  /* The old body flag is not trusted for mobile visibility; actual panel state is. */
  html.zg-mobile-ui body.zg-arena-open .message-dock{
    display:block!important;
  }

  html.zg-mobile-ui.zg-mobile-arena-open body.zg-arena-open .message-dock{
    display:none!important;
  }

  /* Arena is a full-screen social product on mobile/tablet. */
  html.zg-mobile-ui #arenaPanel.arena-panel.arena-v33:not([hidden]){
    position:fixed!important;
    inset:0!important;
    width:100vw!important;
    height:100dvh!important;
    max-width:none!important;
    max-height:none!important;
    margin:0!important;
    border:0!important;
    border-radius:0!important;
    z-index:1400!important;
    background:#08090d!important;
    padding-top:env(safe-area-inset-top)!important;
    padding-bottom:env(safe-area-inset-bottom)!important;
    overflow:hidden!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-panel-head{
    min-height:58px!important;
    padding:7px 9px!important;
    border-bottom:1px solid rgba(255,255,255,.065)!important;
    background:rgba(10,11,16,.98)!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-brand{
    gap:7px!important;
    min-width:0!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-emblem{
    width:32px!important;
    height:32px!important;
    flex-basis:32px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-brand-copy>small{
    font-size:6px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-brand-copy>strong{
    font-size:13px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-brand-copy>em{
    max-width:34vw!important;
    font-size:8.5px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-head-controls{
    gap:4px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-close,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-settings-btn,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-search-btn,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-live-drawer-btn{
    width:35px!important;
    min-width:35px!important;
    height:35px!important;
    min-height:35px!important;
    padding:0!important;
    border-radius:10px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-shell{
    position:relative!important;
    display:block!important;
    width:100%!important;
    height:calc(100dvh - 58px - env(safe-area-inset-top) - env(safe-area-inset-bottom))!important;
    min-height:0!important;
    padding:0!important;
    overflow:hidden!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-content{
    position:absolute!important;
    inset:0 0 64px 0!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    border:0!important;
    border-radius:0!important;
    background:#0a0b10!important;
    padding:0!important;
    overflow:hidden!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-left{
    position:absolute!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
    z-index:95!important;
    width:100%!important;
    height:64px!important;
    min-height:64px!important;
    padding:5px 6px calc(5px + env(safe-area-inset-bottom))!important;
    border:0!important;
    border-top:1px solid rgba(255,255,255,.07)!important;
    border-radius:0!important;
    background:rgba(12,13,18,.985)!important;
    -webkit-backdrop-filter:blur(18px)!important;
    backdrop-filter:blur(18px)!important;
    overflow:visible!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-context{
    display:none!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-nav-title,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-divider,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-explore-label,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-secondary-nav{
    display:none!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-primary-nav{
    height:100%!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-around!important;
    gap:3px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-primary-nav>button,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-rooms-group{
    flex:1 1 0!important;
    min-width:0!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-primary-nav>button,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-rooms-heading,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-lounge-entry{
    min-height:52px!important;
    padding:4px 3px!important;
    border-radius:11px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-primary-nav>button b,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-rooms-heading b,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-lounge-entry b{
    font-size:9px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-content .arena-thread{
    min-height:0!important;
    padding:8px 8px 14px!important;
    gap:8px!important;
    overscroll-behavior:contain!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-content .arena-media-composer{
    padding:8px 8px 3px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-content .arena-media-create-btn{
    min-height:54px!important;
    padding:7px 8px!important;
    grid-template-columns:36px minmax(0,1fr) auto!important;
    border-radius:14px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-composer-avatar,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-composer-add{
    width:36px!important;
    height:36px!important;
    min-width:36px!important;
    flex-basis:36px!important;
    border-radius:11px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-composer-prompt b{
    font-size:11.5px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-composer-prompt small{
    font-size:8.5px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-feed-hero{
    grid-template-columns:1fr!important;
    gap:6px!important;
    padding:4px 1px 2px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-feed-filter{
    display:flex!important;
    flex-wrap:nowrap!important;
    gap:5px!important;
    overflow-x:auto!important;
    padding-bottom:2px!important;
    scrollbar-width:none!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-feed-filter::-webkit-scrollbar{
    display:none!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-feed-filter button{
    flex:0 0 auto!important;
    min-height:30px!important;
    padding:0 10px!important;
    font-size:8.5px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-gamer-media-thread>.arena-gamer-media-card,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-gamer-media-thread>.arena-official-card,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-gamer-media-thread>.arena-achievement-card{
    width:100%!important;
    max-width:none!important;
    margin-inline:0!important;
    border-radius:14px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-gamer-media-card>header{
    padding:9px 10px!important;
    grid-template-columns:36px minmax(0,1fr)!important;
    gap:8px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-avatar{
    width:36px!important;
    height:36px!important;
    border-radius:11px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-gamer-media-copy{
    padding-inline:10px!important;
    font-size:13px!important;
    line-height:1.65!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-gamer-media-card img,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-gamer-media-card video{
    max-height:62dvh!important;
    object-fit:contain!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-social-actions{
    min-height:44px!important;
    padding:5px 8px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-chat-thread{
    width:100%!important;
    max-width:none!important;
    padding:8px 4px 18px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-chat-thread>.arena-message.arena-chat-message{
    grid-template-columns:34px minmax(0,1fr)!important;
    gap:8px!important;
    padding:5px 7px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-chat-thread>.arena-message.arena-chat-message>.arena-avatar{
    width:32px!important;
    height:32px!important;
    border-radius:10px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-chat-message .arena-member-name{
    font-size:11.5px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-chat-message .arena-message-meta small{
    font-size:8px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-room-list{
    left:6px!important;
    right:6px!important;
    bottom:64px!important;
    max-height:52dvh!important;
    overflow:auto!important;
    border-radius:16px!important;
  }
}

@media (max-width:1366px){
  html.zg-mobile-ui #arenaDock:not(.panel-open) #arenaDockBtn{
    width:104px!important;
    min-width:104px!important;
  }

  html.zg-mobile-ui #arenaDock:not(.panel-open) #arenaDockBtn .arena-dock-title{
    font-size:8.5px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-panel-head{
    min-height:56px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-shell{
    height:calc(100dvh - 56px - env(safe-area-inset-top) - env(safe-area-inset-bottom))!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-content{
    bottom:62px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-left{
    height:62px!important;
    min-height:62px!important;
  }
}

/* V3.7K.7 tablet Arena uses the extra canvas instead of phone composition. */
/* Tablet now shares the phone composition below. */


/* V3.7K.8 — launcher parity, horizontal completions and mobile footer cleanup. */
@media (max-width:1366px){
  html.zg-mobile-ui #arenaDock.arena-dock{
    left:12px!important;
    right:auto!important;
    bottom:calc(var(--zg-mobile-nav-h) + 12px + env(safe-area-inset-bottom))!important;
  }

  html.zg-mobile-ui #arenaDock:not(.panel-open) #arenaDockBtn{
    width:154px!important;
    min-width:154px!important;
    height:58px!important;
    min-height:58px!important;
    display:grid!important;
    grid-template-columns:38px minmax(0,1fr) 38px!important;
    grid-template-rows:1fr 1fr!important;
    grid-template-areas:
      "logo title presence"
      "logo subtitle presence"!important;
    gap:1px 7px!important;
    padding:7px 8px!important;
    border-radius:17px!important;
    overflow:hidden!important;
    background:linear-gradient(145deg,rgba(22,17,26,.98),rgba(47,8,17,.97))!important;
    border:1px solid rgba(255,70,96,.58)!important;
    box-shadow:0 0 0 2px rgba(239,35,60,.12),0 12px 34px rgba(0,0,0,.42),0 0 24px rgba(239,35,60,.12)!important;
  }

  html.zg-mobile-ui #arenaDock:not(.panel-open) #arenaDockBtn .arena-dock-logo{
    grid-area:logo!important;
    width:38px!important;
    min-width:38px!important;
    height:38px!important;
    min-height:38px!important;
    align-self:center!important;
    border-radius:12px!important;
  }

  html.zg-mobile-ui #arenaDock:not(.panel-open) #arenaDockBtn .arena-dock-title{
    grid-area:title!important;
    align-self:end!important;
    max-width:none!important;
    color:#fff!important;
    font:900 10px/1.08 Inter,Cairo,sans-serif!important;
    letter-spacing:.02em!important;
    white-space:nowrap!important;
    text-align:start!important;
  }

  html.zg-mobile-ui #arenaDock:not(.panel-open) #arenaDockBtn .arena-dock-subtitle{
    grid-area:subtitle!important;
    display:block!important;
    align-self:start!important;
    margin:0!important;
    max-width:70px!important;
    color:#a7a8b2!important;
    font:700 6.4px/1.2 Cairo,Inter,sans-serif!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    text-align:start!important;
  }

  html.zg-mobile-ui #arenaDock:not(.panel-open) #arenaDockBtn .arena-dock-mobile-presence{
    grid-area:presence!important;
    align-self:center!important;
    justify-self:center!important;
    min-width:34px!important;
    display:grid!important;
    grid-template-columns:auto auto!important;
    grid-template-areas:"dot count" "now now"!important;
    place-items:center!important;
    gap:2px 4px!important;
    color:#fff!important;
  }

  html.zg-mobile-ui #arenaDock:not(.panel-open) #arenaDockBtn .arena-dock-mobile-presence .arena-platform-dot{
    grid-area:dot!important;
    width:7px!important;
    height:7px!important;
    margin:0!important;
    border-radius:999px!important;
    background:#3dd995!important;
    box-shadow:0 0 10px rgba(61,217,149,.72)!important;
  }

  html.zg-mobile-ui #arenaDock:not(.panel-open) #arenaDockBtn .arena-dock-mobile-presence b{
    grid-area:count!important;
    font:900 12px/1 Inter,system-ui,sans-serif!important;
  }

  html.zg-mobile-ui #arenaDock:not(.panel-open) #arenaDockBtn .arena-dock-mobile-presence small{
    grid-area:now!important;
    color:#9ea1ac!important;
    font:800 6px/1 Cairo,Inter,sans-serif!important;
  }

  html.zg-mobile-ui #arenaDock .arena-platform-presence{
    display:none!important;
  }

  html.zg-mobile-ui #arenaDock.arena-presence-hidden .arena-dock-mobile-presence{
    opacity:.46!important;
  }

  /* Completed games are a compact swipe rail on touch layouts. */
  html.zg-mobile-ui .completed-grid,
  html.zg-mobile-ui .smart-home-completed{
    display:flex!important;
    grid-template-columns:none!important;
    flex-wrap:nowrap!important;
    gap:9px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    scroll-snap-type:x mandatory!important;
    overscroll-behavior-inline:contain!important;
    -webkit-overflow-scrolling:touch!important;
    padding:2px 1px 9px!important;
    scrollbar-width:none!important;
  }

  html.zg-mobile-ui .completed-grid::-webkit-scrollbar,
  html.zg-mobile-ui .smart-home-completed::-webkit-scrollbar{
    display:none!important;
  }

  html.zg-mobile-ui .completed-grid>.game-tile,
  html.zg-mobile-ui .smart-home-completed>.game-tile{
    flex:0 0 clamp(150px,38vw,195px)!important;
    width:clamp(150px,38vw,195px)!important;
    max-width:195px!important;
    min-width:0!important;
    scroll-snap-align:start!important;
  }

  /* Footer becomes one deliberate mobile block instead of scattered rows. */
  html.zg-mobile-ui .footer{
    margin-top:26px!important;
    padding:24px 0 calc(var(--zg-mobile-nav-h) + 94px + env(safe-area-inset-bottom))!important;
    border-top-color:rgba(255,255,255,.075)!important;
    background:linear-gradient(180deg,rgba(9,10,14,.35),rgba(6,7,10,.98))!important;
  }

  html.zg-mobile-ui .footer .footer-inner{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:16px!important;
    align-items:center!important;
    justify-items:center!important;
  }

  html.zg-mobile-ui .footer .brand{
    order:1!important;
    justify-self:center!important;
    gap:9px!important;
  }

  html.zg-mobile-ui .footer .brand .brand-logo{
    width:46px!important;
    height:46px!important;
  }

  html.zg-mobile-ui .footer .brand strong{
    font-size:14px!important;
  }

  html.zg-mobile-ui .footer .brand small{
    display:block!important;
    margin-top:2px!important;
    font-size:7px!important;
    letter-spacing:.08em!important;
  }

  html.zg-mobile-ui .footer .footer-copy{
    order:2!important;
    width:100%!important;
    max-width:720px!important;
    gap:11px!important;
    text-align:center!important;
    font-size:11px!important;
    line-height:1.7!important;
  }

  html.zg-mobile-ui .footer .footer-legal{
    justify-content:center!important;
    gap:6px!important;
  }

  html.zg-mobile-ui .footer .footer-legal a{
    min-height:32px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    padding:5px 8px!important;
    border:1px solid rgba(255,255,255,.08)!important;
    border-radius:999px!important;
    background:rgba(255,255,255,.025)!important;
    color:#b9bbc4!important;
    font-size:8.5px!important;
    text-decoration:none!important;
  }

  html.zg-mobile-ui .footer .footer-copyright{
    font-size:8.5px!important;
    color:#7e818d!important;
  }

  html.zg-mobile-ui .footer .socials{
    order:3!important;
    width:100%!important;
    max-width:720px!important;
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:7px!important;
    align-items:stretch!important;
  }

  html.zg-mobile-ui .footer .socials>a,
  html.zg-mobile-ui .footer .socials>button{
    width:100%!important;
    min-width:0!important;
    min-height:44px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:6px!important;
    margin:0!important;
    padding:7px 8px!important;
    border:1px solid rgba(255,255,255,.095)!important;
    border-radius:12px!important;
    background:#111219!important;
    color:#e5e6ea!important;
    font-size:9px!important;
    text-align:center!important;
    box-sizing:border-box!important;
  }

  html.zg-mobile-ui .footer .social-icon{
    width:17px!important;
    height:17px!important;
    flex:0 0 17px!important;
  }

  html.zg-mobile-ui .footer .social-icon img{
    width:16px!important;
    height:16px!important;
  }

  html.zg-mobile-ui #arenaPanel .arena-state-banner.preview-demo{
    margin:7px 8px 0!important;
    padding:8px 10px!important;
    border:1px solid rgba(255,193,82,.2)!important;
    border-radius:11px!important;
    background:rgba(255,193,82,.055)!important;
    color:#d6bd85!important;
    font-size:8px!important;
    text-align:center!important;
  }

  html.zg-mobile-ui #arenaPanel .arena-preview-demo-card{
    pointer-events:none!important;
  }

  html.zg-mobile-ui #arenaPanel .arena-preview-demo-card .arena-social-actions button{
    opacity:.8!important;
  }

  html.zg-mobile-ui #arenaPanel .arena-preview-visual{
    display:block!important;
    width:100%!important;
    overflow:hidden!important;
    background:#090a0e!important;
  }

  html.zg-mobile-ui #arenaPanel .arena-preview-visual img{
    display:block!important;
    width:100%!important;
    max-height:280px!important;
    object-fit:cover!important;
  }
}

@media (max-width:1366px){
  html.zg-mobile-ui #arenaDock.arena-dock{
    left:10px!important;
  }

  html.zg-mobile-ui #arenaDock:not(.panel-open) #arenaDockBtn{
    width:148px!important;
    min-width:148px!important;
    height:56px!important;
    min-height:56px!important;
    grid-template-columns:36px minmax(0,1fr) 36px!important;
    padding:6px 7px!important;
  }

  html.zg-mobile-ui #arenaDock:not(.panel-open) #arenaDockBtn .arena-dock-logo{
    width:36px!important;
    min-width:36px!important;
    height:36px!important;
    min-height:36px!important;
  }

  html.zg-mobile-ui .completed-grid>.game-tile,
  html.zg-mobile-ui .smart-home-completed>.game-tile{
    flex-basis:clamp(142px,42vw,170px)!important;
    width:clamp(142px,42vw,170px)!important;
    max-width:170px!important;
  }

  html.zg-mobile-ui .footer .socials{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }

  html.zg-mobile-ui .footer .socials>a,
  html.zg-mobile-ui .footer .socials>button{
    min-height:42px!important;
    padding-inline:5px!important;
    font-size:8px!important;
  }
}

@media (max-width:380px){
  html.zg-mobile-ui .footer .socials{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}


/* V3.7K.10 — bottom floating controls + dense Arena phone composition. */
@media (max-width:1366px){
  html.zg-mobile-ui #arenaDock.arena-dock{
    left:10px!important;
    right:auto!important;
    bottom:max(10px,env(safe-area-inset-bottom))!important;
  }

  html.zg-mobile-ui .message-dock{
    right:10px!important;
    left:auto!important;
    bottom:max(10px,env(safe-area-inset-bottom))!important;
  }
}

@media (max-width:1366px){
  /* Arena header and content chrome: keep social content visible, not the chrome. */
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-panel-head{
    min-height:50px!important;
    height:50px!important;
    padding:5px 7px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-emblem{
    width:27px!important;
    height:27px!important;
    flex-basis:27px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-brand-copy>small{
    font-size:5.5px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-brand-copy>strong{
    font-size:11.5px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-brand-copy>em{
    max-width:30vw!important;
    font-size:7px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-close,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-settings-btn,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-search-btn,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-live-drawer-btn{
    width:32px!important;
    min-width:32px!important;
    height:32px!important;
    min-height:32px!important;
    border-radius:9px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-shell{
    height:calc(100dvh - 50px - env(safe-area-inset-top) - env(safe-area-inset-bottom))!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-content{
    bottom:56px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-left{
    height:56px!important;
    min-height:56px!important;
    padding:4px 5px calc(4px + env(safe-area-inset-bottom))!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-primary-nav>button,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-rooms-heading,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-lounge-entry{
    min-height:46px!important;
    padding:3px 2px!important;
    border-radius:10px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-primary-nav>button b,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-rooms-heading b,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-lounge-entry b{
    font-size:8px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-content .arena-thread{
    padding:5px 7px 11px!important;
    gap:7px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-content .arena-media-composer{
    padding:5px 7px 2px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-feed-hero{
    gap:6px!important;
    margin-bottom:5px!important;
    padding:7px 8px!important;
    border-radius:13px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-feed-copy{
    gap:2px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-feed-copy small{
    font-size:6px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-feed-copy h4{
    font-size:14px!important;
    line-height:1.15!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-feed-copy p{
    font-size:9px!important;
    line-height:1.45!important;
    display:-webkit-box!important;
    -webkit-line-clamp:1!important;
    -webkit-box-orient:vertical!important;
    overflow:hidden!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-feed-chips{
    gap:4px!important;
    flex-wrap:nowrap!important;
    overflow-x:auto!important;
    scrollbar-width:none!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-feed-chips::-webkit-scrollbar{
    display:none!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-feed-chips span{
    flex:0 0 auto!important;
    min-height:24px!important;
    padding:0 8px!important;
    font-size:8px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-content .arena-media-create-btn{
    min-height:48px!important;
    grid-template-columns:32px minmax(0,1fr) 22px!important;
    gap:7px!important;
    padding:6px 7px!important;
    border-radius:12px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-composer-avatar,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-composer-add{
    width:32px!important;
    min-width:32px!important;
    height:32px!important;
    min-height:32px!important;
    border-radius:10px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-composer-prompt b{
    font-size:10px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-composer-prompt small{
    font-size:7px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  /* Community Pulse remains visible but no longer dominates the feed/chat canvas. */
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-gamer-media-card.pulse-top-ten{
    border-radius:12px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-gamer-media-card.pulse-top-ten>header{
    padding:7px 8px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-gamer-media-card.pulse-top-ten .arena-gamer-media-copy{
    padding:2px 8px 7px!important;
    font-size:10.5px!important;
    line-height:1.45!important;
    display:-webkit-box!important;
    -webkit-line-clamp:2!important;
    -webkit-box-orient:vertical!important;
    overflow:hidden!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-gamer-media-card.pulse-top-ten .arena-gamer-media-visual,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-gamer-media-card.pulse-top-ten .arena-gamer-media-youtube{
    max-height:130px!important;
    margin:0 8px 7px!important;
    border-radius:10px!important;
    overflow:hidden!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-gamer-media-card.pulse-top-ten .arena-gamer-media-visual img,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-gamer-media-card.pulse-top-ten .arena-gamer-media-youtube img{
    max-height:130px!important;
    object-fit:cover!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-gamer-media-card.pulse-top-ten .arena-social-actions{
    min-height:34px!important;
    padding:3px 7px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-gamer-media-card.pulse-top-ten .arena-post-expiry{
    min-height:28px!important;
    padding:4px 8px!important;
    font-size:7px!important;
  }

  /* Achievements are deliberately denser on phones. */
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-gamer-media-thread>.arena-achievement-card{
    border-radius:12px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-gamer-media-thread>.arena-achievement-card>header{
    padding:8px 9px 6px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-gamer-media-thread>.arena-achievement-card .arena-achievement-copy{
    padding:2px 9px 8px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-gamer-media-thread>.arena-achievement-card .arena-achievement-copy>small{
    min-height:22px!important;
    padding:0 7px!important;
    font-size:7.5px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-gamer-media-thread>.arena-achievement-card .arena-achievement-copy h4{
    margin:5px 0 3px!important;
    font-size:13px!important;
    line-height:1.25!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-gamer-media-thread>.arena-achievement-card .arena-achievement-copy p{
    font-size:9.5px!important;
    line-height:1.45!important;
    display:-webkit-box!important;
    -webkit-line-clamp:2!important;
    -webkit-box-orient:vertical!important;
    overflow:hidden!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-gamer-media-thread>.arena-achievement-card .arena-achievement-image{
    margin:0 8px 7px!important;
    max-height:150px!important;
    border-radius:10px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-gamer-media-thread>.arena-achievement-card .arena-achievement-image img{
    max-height:150px!important;
    object-fit:cover!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-gamer-media-thread>.arena-achievement-card>footer{
    padding:6px 8px 8px!important;
  }

  /* Chat stays readable; only wasted chrome is reduced. */
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-chat-thread{
    padding:5px 2px 10px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-chat-thread>.arena-message.arena-chat-message{
    padding:4px 5px!important;
    gap:6px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-compose{
    padding:6px 7px!important;
    gap:5px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-compose-row{
    gap:6px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-compose-row textarea{
    min-height:44px!important;
    max-height:100px!important;
    padding:9px 10px!important;
    border-radius:13px!important;
    font-size:12px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-compose-row>button[type="submit"]{
    width:46px!important;
    min-width:46px!important;
    height:46px!important;
    min-height:46px!important;
    border-radius:13px!important;
  }

  /* Room picker stays above the compact Arena navigation. */
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-room-list{
    bottom:56px!important;
  }
}


/* V3.7K.11 — compact Arena launcher keeps the full name + live count without growing taller. */
@media (max-width:1366px){
  html.zg-mobile-ui #arenaDock:not(.panel-open) #arenaDockBtn{
    width:150px!important;
    min-width:150px!important;
    height:54px!important;
    min-height:54px!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 34px!important;
    grid-template-rows:18px 22px!important;
    grid-template-areas:
      "presence logo"
      "title logo"!important;
    column-gap:8px!important;
    row-gap:0!important;
    align-items:center!important;
    padding:6px 8px!important;
    direction:ltr!important;
  }

  html.zg-mobile-ui #arenaDock:not(.panel-open) #arenaDockBtn .arena-dock-logo{
    grid-area:logo!important;
    width:32px!important;
    min-width:32px!important;
    height:32px!important;
    min-height:32px!important;
  }

  html.zg-mobile-ui #arenaDock:not(.panel-open) #arenaDockBtn .arena-v33-launch-presence,
  html.zg-mobile-ui #arenaDock:not(.panel-open) #arenaDockBtn .arena-platform-presence{
    grid-area:presence!important;
    display:flex!important;
    min-width:0!important;
    width:auto!important;
    height:18px!important;
    align-items:center!important;
    justify-content:center!important;
    gap:5px!important;
    padding:0!important;
    margin:0!important;
    border:0!important;
    background:transparent!important;
    box-shadow:none!important;
    color:#fff!important;
    font:900 9px/1 Inter,Arial,sans-serif!important;
    direction:ltr!important;
  }

  html.zg-mobile-ui #arenaDock:not(.panel-open) #arenaDockBtn .arena-v33-launch-presence [data-v33-online-label],
  html.zg-mobile-ui #arenaDock:not(.panel-open) #arenaDockBtn .arena-platform-presence [data-v33-online-label]{
    display:none!important;
  }

  html.zg-mobile-ui #arenaDock:not(.panel-open) #arenaDockBtn .arena-v33-launch-presence .arena-platform-dot,
  html.zg-mobile-ui #arenaDock:not(.panel-open) #arenaDockBtn .arena-platform-presence .arena-platform-dot{
    width:7px!important;
    height:7px!important;
    flex:0 0 7px!important;
    border-radius:50%!important;
    background:#ef233c!important;
    box-shadow:0 0 10px rgba(239,35,60,.72)!important;
  }

  html.zg-mobile-ui #arenaDock:not(.panel-open) #arenaDockBtn .arena-dock-title{
    grid-area:title!important;
    display:block!important;
    width:100%!important;
    max-width:none!important;
    overflow:visible!important;
    text-overflow:clip!important;
    white-space:nowrap!important;
    text-align:center!important;
    direction:ltr!important;
    font:900 9px/1.05 Inter,Arial,sans-serif!important;
    letter-spacing:.045em!important;
  }

  html.zg-mobile-ui #arenaDock:not(.panel-open) #arenaDockBtn .arena-dock-subtitle,
  html.zg-mobile-ui #arenaDock:not(.panel-open) #arenaDockBtn .arena-v33-launch-cta{
    display:none!important;
  }
}





/* V3.7K.13 — exact mobile Arena launcher composition requested in live QA. */
@media (max-width:1366px){
  html.zg-mobile-ui #arenaDock.arena-dock{
    left:10px!important;
    right:auto!important;
    top:auto!important;
    bottom:max(10px,env(safe-area-inset-bottom))!important;
    width:150px!important;
    height:54px!important;
  }

  html.zg-mobile-ui #arenaDock:not(.panel-open) #arenaDockBtn{
    position:relative!important;
    width:150px!important;
    min-width:150px!important;
    height:54px!important;
    min-height:54px!important;
    display:block!important;
    padding:0!important;
    overflow:hidden!important;
    border-radius:17px!important;
  }

  html.zg-mobile-ui #arenaDock:not(.panel-open) #arenaDockBtn .arena-dock-logo{
    position:absolute!important;
    right:8px!important;
    left:auto!important;
    top:50%!important;
    width:34px!important;
    min-width:34px!important;
    height:34px!important;
    min-height:34px!important;
    margin:0!important;
    transform:translateY(-50%)!important;
  }

  html.zg-mobile-ui #arenaDock:not(.panel-open) #arenaDockBtn .arena-dock-title{
    position:absolute!important;
    left:10px!important;
    right:48px!important;
    bottom:8px!important;
    width:auto!important;
    max-width:none!important;
    margin:0!important;
    display:block!important;
    overflow:visible!important;
    text-overflow:clip!important;
    white-space:nowrap!important;
    color:#fff!important;
    text-align:center!important;
    direction:ltr!important;
    font:900 10px/1 Inter,Arial,sans-serif!important;
    letter-spacing:.055em!important;
  }

  html.zg-mobile-ui #arenaDock:not(.panel-open) #arenaDockBtn .arena-platform-presence.arena-v33-launch-presence{
    position:absolute!important;
    left:10px!important;
    right:auto!important;
    top:7px!important;
    bottom:auto!important;
    width:auto!important;
    min-width:0!important;
    min-height:15px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:5px!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    background:transparent!important;
    box-shadow:none!important;
    backdrop-filter:none!important;
    color:#fff!important;
    direction:ltr!important;
    font:900 10px/1 Inter,Arial,sans-serif!important;
  }

  html.zg-mobile-ui #arenaDock:not(.panel-open) #arenaDockBtn .arena-v33-launch-presence [data-v33-online-label]{
    display:none!important;
  }

  html.zg-mobile-ui #arenaDock:not(.panel-open) #arenaDockBtn .arena-v33-launch-presence .arena-platform-dot{
    width:7px!important;
    height:7px!important;
    flex:0 0 7px!important;
    margin:0!important;
    border-radius:50%!important;
    background:#3dd995!important;
    box-shadow:0 0 0 3px rgba(61,217,149,.10),0 0 10px rgba(61,217,149,.56)!important;
  }

  html.zg-mobile-ui #arenaDock:not(.panel-open) #arenaDockBtn .arena-v33-launch-presence b{
    min-width:0!important;
    color:#fff!important;
    font:900 11px/1 Inter,Arial,sans-serif!important;
  }

  html.zg-mobile-ui #arenaDock:not(.panel-open) #arenaDockBtn .arena-dock-subtitle,
  html.zg-mobile-ui #arenaDock:not(.panel-open) #arenaDockBtn .arena-v33-launch-cta,
  html.zg-mobile-ui #arenaDock:not(.panel-open) #arenaDockBtn .arena-dock-mobile-presence{
    display:none!important;
  }

  html.zg-mobile-ui .message-dock{
    right:10px!important;
    left:auto!important;
    bottom:max(10px,env(safe-area-inset-bottom))!important;
  }
}


/* V3.7K.15 — Arena phone density pass.
   Every selector is gated by the mobile runtime; desktop Arena remains the approved baseline. */
@media (max-width:1366px){
  /* Compact launcher: [متصلون الآن] [green dot] [count] above the centered title. */

  html.zg-mobile-ui #arenaDock.arena-v33-dock.arena-presence-integrated #arenaDockBtn{
    overflow:hidden!important;
  }
  html.zg-mobile-ui #arenaDock.arena-v33-dock #arenaDockBtn{
    width:150px!important;
    min-width:150px!important;
    height:54px!important;
    min-height:54px!important;
    overflow:hidden!important;
  }

  html.zg-mobile-ui #arenaDock.arena-v33-dock #arenaDockBtn>.arena-dock-title{
    left:8px!important;
    right:48px!important;
    bottom:7px!important;
    width:auto!important;
    text-align:center!important;
    font-size:10px!important;
    line-height:1!important;
  }

  html.zg-mobile-ui #arenaDock.arena-v33-dock #arenaDockBtn>#platformPresenceBadge.arena-v33-launch-presence,
  html.zg-mobile-ui #arenaDock.arena-v33-dock #arenaDockBtn>#platformPresenceBadge.arena-v33-launch-presence.arena-presence-restored{
    position:absolute!important;
    inset:auto 48px auto 8px!important;
    top:6px!important;
    width:auto!important;
    max-width:none!important;
    min-width:0!important;
    min-height:14px!important;
    height:14px!important;
    display:flex!important;
    flex-direction:row!important;
    align-items:center!important;
    justify-content:center!important;
    gap:4px!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
    backdrop-filter:none!important;
    direction:rtl!important;
    white-space:nowrap!important;
    pointer-events:none!important;
  }

  html.zg-mobile-ui #arenaDock.arena-v33-dock #arenaDockBtn>#platformPresenceBadge [data-v33-online-label]{
    display:inline!important;
    order:1!important;
    color:#aab0bc!important;
    font:800 6.6px/1 Cairo,Inter,Arial,sans-serif!important;
  }

  html.zg-mobile-ui #arenaDock.arena-v33-dock #arenaDockBtn>#platformPresenceBadge .arena-platform-dot{
    display:block!important;
    order:2!important;
    width:6px!important;
    height:6px!important;
    flex:0 0 6px!important;
    margin:0!important;
    border-radius:50%!important;
    background:#31d690!important;
    box-shadow:0 0 0 3px rgba(49,214,144,.08),0 0 9px rgba(49,214,144,.60)!important;
  }

  html.zg-mobile-ui #arenaDock.arena-v33-dock #arenaDockBtn>#platformPresenceBadge b[data-platform-presence-value]{
    display:block!important;
    order:3!important;
    min-width:8px!important;
    color:#fff!important;
    font:950 9px/1 Inter,Arial,sans-serif!important;
    text-align:center!important;
  }

  /* Live-layer counters: keep the information, remove the oversized cards. */
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-pulse{
    width:100%!important;
    min-height:0!important;
    margin:3px 0 5px!important;
    padding:3px!important;
    border-radius:10px!important;
    grid-template-columns:1fr!important;
    gap:3px!important;
    box-shadow:none!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-pulse::before,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-pulse-head{
    display:none!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-metrics{
    width:100%!important;
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:4px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-metrics>span{
    min-width:0!important;
    min-height:30px!important;
    height:30px!important;
    padding:2px 4px!important;
    border-radius:9px!important;
    grid-template-columns:12px auto!important;
    grid-template-rows:auto auto!important;
    column-gap:4px!important;
    align-content:center!important;
    justify-content:center!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-metrics svg{
    width:11px!important;
    height:11px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-metrics i{
    font-size:9px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-metrics b{
    max-width:74px!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    font-size:6.2px!important;
    line-height:1.05!important;
  }

  /* "Community posts" becomes a slim control strip rather than a hero. */
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-media-composer.arena-v33-feed-composer{
    padding:5px 7px 3px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-feed-hero{
    min-height:42px!important;
    margin:0 0 4px!important;
    padding:4px 2px 5px!important;
    display:grid!important;
    grid-template-columns:minmax(112px,1fr) minmax(0,1.15fr)!important;
    align-items:center!important;
    gap:5px!important;
    border-radius:0!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-feed-copy{
    gap:1px!important;
    min-width:0!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-feed-copy small,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-feed-copy p{
    display:none!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-feed-copy h4{
    margin:0!important;
    font-size:12.5px!important;
    line-height:1.15!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-feed-filter{
    min-width:0!important;
    display:flex!important;
    flex-wrap:nowrap!important;
    justify-content:flex-start!important;
    gap:3px!important;
    overflow-x:auto!important;
    scrollbar-width:none!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-feed-filter::-webkit-scrollbar{
    display:none!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-feed-filter button{
    flex:0 0 auto!important;
    min-height:25px!important;
    height:25px!important;
    padding:0 7px!important;
    border-radius:8px!important;
    font-size:7.5px!important;
  }

  /* Composer button stays entirely inside its rectangle. */
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-media-create-btn{
    min-height:44px!important;
    height:44px!important;
    padding:5px 7px!important;
    grid-template-columns:30px minmax(0,1fr) 30px!important;
    gap:6px!important;
    border-radius:11px!important;
    overflow:hidden!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-composer-avatar{
    width:30px!important;
    min-width:30px!important;
    height:30px!important;
    min-height:30px!important;
    border-radius:9px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-composer-avatar img{
    border-radius:8px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-composer-prompt{
    gap:1px!important;
    overflow:hidden!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-composer-prompt b{
    font-size:9.5px!important;
    line-height:1.15!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-composer-prompt small{
    font-size:6.8px!important;
    line-height:1.2!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-composer-add{
    width:28px!important;
    min-width:28px!important;
    height:28px!important;
    min-height:28px!important;
    border-radius:9px!important;
    box-shadow:none!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-composer-add::before,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-composer-add::after{
    display:none!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-composer-add i{
    font-size:18px!important;
    line-height:1!important;
    transform:translateY(-1px)!important;
  }

  /* Faster feed scanning: compress card chrome and previews, not opened media/modals. */
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-gamer-media-thread{
    gap:7px!important;
    padding:3px 6px 10px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-gamer-media-thread>.arena-gamer-media-card{
    border-radius:13px!important;
    box-shadow:0 8px 20px rgba(0,0,0,.13)!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-gamer-media-card>header{
    padding:6px 7px 5px!important;
    grid-template-columns:30px minmax(0,1fr) auto!important;
    gap:6px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-gamer-media-card>header .arena-avatar{
    width:30px!important;
    height:30px!important;
    min-width:30px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-gamer-media-copy{
    padding:1px 8px 7px!important;
    font-size:11.5px!important;
    line-height:1.48!important;
    display:-webkit-box!important;
    -webkit-line-clamp:3!important;
    -webkit-box-orient:vertical!important;
    overflow:hidden!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-gamer-media-visual,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-gamer-media-youtube{
    max-height:235px!important;
    margin:0 7px 7px!important;
    border-radius:10px!important;
    overflow:hidden!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-gamer-media-visual img,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-gamer-media-visual video,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-gamer-media-youtube img{
    width:100%!important;
    max-height:235px!important;
    object-fit:cover!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-social-actions{
    min-height:34px!important;
    padding:4px 7px!important;
    gap:5px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-like-btn,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-comment-btn{
    min-height:30px!important;
    padding:0 8px!important;
    border-radius:9px!important;
    font-size:8px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-gamer-media-card>footer{
    padding:5px 8px 7px!important;
  }

  /* Bottom Arena navigation: exactly three equal destinations across the full width. */
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-left{
    width:100%!important;
    height:56px!important;
    min-height:56px!important;
    padding:4px 6px calc(4px + env(safe-area-inset-bottom))!important;
    box-sizing:border-box!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-nav-title,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-lounge-zone{
    display:none!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-primary-nav{
    width:100%!important;
    height:100%!important;
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    align-items:stretch!important;
    justify-content:stretch!important;
    gap:6px!important;
    margin:0!important;
    padding:0!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-primary-nav>button,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-primary-nav>.arena-v33-rooms-group{
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    height:100%!important;
    margin:0!important;
    flex:none!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-primary-nav>button,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-rooms-heading{
    min-height:46px!important;
    height:46px!important;
    padding:3px 4px!important;
    border-radius:10px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-primary-nav>button b,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-rooms-heading b{
    font-size:8.2px!important;
    white-space:nowrap!important;
  }
}


/* V3.7K.16 — phone-only Community Pulse collapse + animated Zaplat Lounge nav. */
@media (max-width:1366px){
  /* Keep the existing three Arena destinations unless Lounge is actually visible. */
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-primary-nav:has(> .arena-v33-mobile-lounge:not([hidden])){
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:4px!important;
  }

  /* Promote the existing, permission-aware Lounge portal into the phone bottom nav. */
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-primary-nav>.arena-v33-mobile-lounge.arena-final-b-lounge-portal{
    position:relative!important;
    z-index:4!important;
    width:100%!important;
    min-width:0!important;
    height:48px!important;
    min-height:48px!important;
    margin:0!important;
    padding:2px 2px 3px!important;
    display:grid!important;
    grid-template-columns:1fr!important;
    grid-template-rows:32px 10px!important;
    place-items:center!important;
    align-content:center!important;
    gap:1px!important;
    overflow:visible!important;
    border:1px solid rgba(239,68,91,.42)!important;
    border-radius:12px!important;
    background:
      radial-gradient(circle at 50% 18%,rgba(154,101,255,.22),transparent 44%),
      linear-gradient(155deg,rgba(45,17,43,.96),rgba(32,10,20,.98))!important;
    box-shadow:0 -3px 18px rgba(239,35,60,.10),inset 0 0 0 1px rgba(255,255,255,.025)!important;
    transform:translateY(-3px)!important;
    color:#fff!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-primary-nav>.arena-v33-mobile-lounge.arena-final-b-lounge-portal::before{
    content:""!important;
    position:absolute!important;
    inset:4px 12px!important;
    border-radius:10px!important;
    background:radial-gradient(circle,rgba(173,126,255,.10),transparent 68%)!important;
    opacity:.9!important;
    pointer-events:none!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-primary-nav>.arena-v33-mobile-lounge.arena-final-b-lounge-portal::after{
    content:""!important;
    position:absolute!important;
    z-index:0!important;
    width:36px!important;
    height:36px!important;
    top:0!important;
    left:50%!important;
    right:auto!important;
    bottom:auto!important;
    transform:translateX(-50%)!important;
    border-radius:13px!important;
    border:1px solid rgba(182,157,255,.16)!important;
    box-shadow:0 0 0 4px rgba(151,118,255,.025)!important;
    pointer-events:none!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-mobile-lounge .arena-final-b-lounge-logo{
    z-index:2!important;
    width:30px!important;
    height:30px!important;
    min-width:30px!important;
    border-radius:10px!important;
    background:linear-gradient(145deg,rgba(142,104,255,.34),rgba(239,35,60,.24))!important;
    border:1px solid rgba(182,157,255,.38)!important;
    box-shadow:0 0 0 3px rgba(126,91,255,.035),0 0 14px rgba(239,35,60,.11)!important;
    overflow:hidden!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-mobile-lounge .arena-final-b-lounge-logo::before{
    width:19px!important;
    height:19px!important;
    border-radius:5px!important;
    border-color:rgba(205,187,255,.34)!important;
    animation:zgE7Diamond 7s linear infinite!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-mobile-lounge .arena-final-b-lounge-logo::after{
    width:11px!important;
    height:11px!important;
    border-radius:4px!important;
    border-color:rgba(255,83,108,.42)!important;
    animation:zgE7DiamondReverse 5s linear infinite!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-mobile-lounge .arena-final-b-lounge-logo>b{
    font-size:11px!important;
    line-height:1!important;
    text-shadow:0 0 10px rgba(255,255,255,.34)!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-mobile-lounge .arena-final-b-lounge-logo>i,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-mobile-lounge .arena-final-b-lounge-logo>em{
    width:3px!important;
    height:3px!important;
    top:13px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-mobile-lounge .arena-final-b-lounge-logo>i{inset-inline-start:4px!important}
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-mobile-lounge .arena-final-b-lounge-logo>em{inset-inline-end:4px!important}

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-mobile-lounge .arena-final-b-lounge-main{
    z-index:2!important;
    width:100%!important;
    min-width:0!important;
    display:block!important;
    padding:0!important;
    overflow:visible!important;
    text-align:center!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-mobile-lounge .arena-final-b-lounge-main>small,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-mobile-lounge .arena-final-b-lounge-main>em,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-mobile-lounge .arena-final-b-lounge-features,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-mobile-lounge .arena-final-b-lounge-status{
    display:none!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-mobile-lounge .arena-final-b-lounge-main>strong{
    display:block!important;
    max-width:100%!important;
    color:#fff!important;
    font:900 7.6px/1 Cairo,Inter,sans-serif!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    text-align:center!important;
    text-shadow:0 0 10px rgba(239,35,60,.18)!important;
  }

  /* Community Pulse is a single readable strip by default; Top 10 opens only on demand. */
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-spotlight-flow.arena-final-b-spotlight-mobile{
    display:block!important;
    margin:7px 8px 3px!important;
    padding:0!important;
    min-width:0!important;
    border:1px solid rgba(143,99,255,.18)!important;
    border-radius:14px!important;
    overflow:hidden!important;
    background:
      radial-gradient(circle at 92% 0,rgba(129,84,230,.12),transparent 35%),
      linear-gradient(160deg,rgba(18,19,28,.985),rgba(10,11,17,.995))!important;
    box-shadow:0 9px 24px rgba(0,0,0,.18)!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-spotlight-mobile-toggle{
    width:100%!important;
    min-height:62px!important;
    display:grid!important;
    grid-template-columns:34px minmax(0,1fr) 42px 16px!important;
    align-items:center!important;
    gap:7px!important;
    padding:7px 8px!important;
    border:0!important;
    background:transparent!important;
    color:#fff!important;
    text-align:start!important;
    cursor:pointer!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-spotlight-mobile-icon{
    width:32px!important;
    height:32px!important;
    display:grid!important;
    place-items:center!important;
    border:1px solid rgba(166,123,255,.24)!important;
    border-radius:11px!important;
    background:linear-gradient(145deg,rgba(116,73,214,.18),rgba(239,35,60,.07))!important;
    box-shadow:0 0 15px rgba(118,79,220,.08)!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-spotlight-mobile-icon svg{
    width:16px!important;
    height:16px!important;
    fill:none!important;
    stroke:#c6adff!important;
    stroke-width:1.8!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-spotlight-mobile-copy{
    min-width:0!important;
    display:grid!important;
    gap:3px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-spotlight-mobile-copy>b{
    color:#f8f6ff!important;
    font-size:13px!important;
    line-height:1.15!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-spotlight-mobile-copy>small{
    color:#8f95a5!important;
    font-size:8.7px!important;
    line-height:1.3!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-spotlight-mobile-leader{
    position:relative!important;
    width:40px!important;
    height:40px!important;
    display:grid!important;
    place-items:center!important;
    border-radius:12px!important;
    border:1px solid rgba(255,65,92,.26)!important;
    background:rgba(239,35,60,.07)!important;
    overflow:visible!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-spotlight-mobile-leader img{
    width:100%!important;
    height:100%!important;
    border-radius:11px!important;
    object-fit:cover!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-spotlight-mobile-leader>b{
    color:#fff!important;
    font:950 10px/1 Inter,sans-serif!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-spotlight-mobile-leader>i{
    position:absolute!important;
    inset-inline-end:-4px!important;
    inset-block-start:-5px!important;
    min-width:20px!important;
    height:16px!important;
    display:grid!important;
    place-items:center!important;
    padding:0 4px!important;
    border-radius:999px!important;
    background:#b51431!important;
    color:#fff!important;
    border:1px solid rgba(255,255,255,.12)!important;
    font:950 7px/1 Inter,sans-serif!important;
    font-style:normal!important;
    box-shadow:0 3px 10px rgba(0,0,0,.28)!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-spotlight-mobile-chevron{
    color:#7e8494!important;
    font:900 18px/1 Inter,sans-serif!important;
    transition:transform .18s ease!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-spotlight-mobile.is-mobile-open .arena-final-b-spotlight-mobile-chevron{
    transform:rotate(180deg)!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-spotlight-mobile-body[hidden]{
    display:none!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-spotlight-mobile-body{
    display:grid!important;
    gap:7px!important;
    padding:0 7px 8px!important;
    border-top:1px solid rgba(255,255,255,.045)!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-spotlight-mobile-meta{
    min-height:34px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:7px!important;
    padding:5px 1px 0!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-spotlight-mobile-meta>span{
    min-width:0!important;
    color:#8c92a1!important;
    font-size:8px!important;
    line-height:1.3!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-spotlight-mobile-meta .arena-final-b-memory-btn{
    flex:0 0 auto!important;
    min-height:28px!important;
    padding:0 8px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-spotlight-mobile-meta .arena-final-b-memory-btn>span{
    display:none!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-spotlight-mobile .arena-final-b-spotlight-list{
    display:grid!important;
    grid-auto-flow:row!important;
    grid-template-columns:1fr!important;
    grid-auto-columns:auto!important;
    gap:6px!important;
    max-height:min(50dvh,430px)!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    padding:0 1px 2px!important;
    scroll-snap-type:none!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-spotlight-mobile .arena-final-b-spotlight-card{
    width:100%!important;
    min-height:62px!important;
    padding:6px!important;
    border-radius:11px!important;
    scroll-snap-align:none!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-spotlight-mobile .arena-final-b-spotlight-media{
    width:48px!important;
    height:46px!important;
    border-radius:9px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-spotlight-mobile .arena-final-b-spotlight-copy>strong{
    font-size:9px!important;
    line-height:1.35!important;
    display:-webkit-box!important;
    -webkit-line-clamp:2!important;
    -webkit-box-orient:vertical!important;
    overflow:hidden!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-spotlight-mobile .arena-final-b-spotlight-person b{
    font-size:10px!important;
  }
}

@media (max-width:1366px) and (prefers-reduced-motion:reduce){
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-mobile-lounge .arena-final-b-lounge-logo::before,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-mobile-lounge .arena-final-b-lounge-logo::after{
    animation:none!important;
  }
}


/* V3.7K.16b — phone Arena Lounge emphasis + Pulse card readability. */
@media (max-width:1366px){
  /* Four destinations, with the Lounge physically taking the wider far-left slot in RTL Arena. */
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-primary-nav:has(> .arena-v33-mobile-lounge:not([hidden])){
    grid-template-columns:repeat(3,minmax(0,1fr)) minmax(0,1.42fr)!important;
    gap:4px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-primary-nav>.arena-v33-mobile-lounge.arena-final-b-lounge-portal{
    height:54px!important;
    min-height:54px!important;
    padding:2px 4px 4px!important;
    grid-template-rows:35px 11px!important;
    border-radius:14px!important;
    transform:translateY(-6px)!important;
    border-color:rgba(239,68,91,.52)!important;
    background:
      radial-gradient(circle at 50% 14%,rgba(158,106,255,.29),transparent 47%),
      radial-gradient(circle at 12% 88%,rgba(239,35,60,.16),transparent 44%),
      linear-gradient(155deg,rgba(48,18,48,.985),rgba(30,9,20,.99))!important;
    box-shadow:0 -5px 22px rgba(239,35,60,.14),0 0 22px rgba(127,84,225,.08),inset 0 0 0 1px rgba(255,255,255,.03)!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-mobile-lounge .arena-final-b-lounge-logo{
    width:34px!important;
    min-width:34px!important;
    height:34px!important;
    border-radius:11px!important;
    box-shadow:0 0 0 4px rgba(126,91,255,.04),0 0 17px rgba(239,35,60,.14)!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-mobile-lounge .arena-final-b-lounge-logo::before{
    width:22px!important;
    height:22px!important;
    border-radius:6px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-mobile-lounge .arena-final-b-lounge-logo::after{
    width:13px!important;
    height:13px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-mobile-lounge .arena-final-b-lounge-logo>b{
    font-size:12px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-mobile-lounge .arena-final-b-lounge-logo>i,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-mobile-lounge .arena-final-b-lounge-logo>em{
    top:15px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-mobile-lounge .arena-final-b-lounge-main>strong{
    font-size:8.5px!important;
    line-height:1.05!important;
    letter-spacing:0!important;
  }

  /* The expanded Pulse cards use four explicit columns:
     rank | media | useful text area | open arrow.
     This prevents the text/rank collision visible on narrow phones. */
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-spotlight-mobile .arena-final-b-spotlight-card{
    min-height:76px!important;
    display:grid!important;
    grid-template-columns:22px 56px minmax(0,1fr) 12px!important;
    grid-template-rows:auto!important;
    align-items:center!important;
    gap:8px!important;
    padding:8px!important;
    overflow:hidden!important;
    text-align:start!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-spotlight-mobile .arena-final-b-rank{
    width:22px!important;
    min-width:22px!important;
    height:22px!important;
    align-self:center!important;
    justify-self:center!important;
    font-size:8.5px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-spotlight-mobile .arena-final-b-spotlight-media,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-spotlight-mobile .arena-final-b-spotlight-fallback{
    width:56px!important;
    min-width:56px!important;
    height:56px!important;
    border-radius:10px!important;
    align-self:center!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-spotlight-mobile .arena-final-b-spotlight-copy{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    display:grid!important;
    align-content:center!important;
    gap:4px!important;
    overflow:hidden!important;
    padding:1px 0!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-spotlight-mobile .arena-final-b-spotlight-person{
    width:100%!important;
    min-width:0!important;
    display:flex!important;
    align-items:center!important;
    gap:4px!important;
    overflow:hidden!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-spotlight-mobile .arena-final-b-spotlight-person>b{
    flex:1 1 auto!important;
    min-width:0!important;
    max-width:100%!important;
    font-size:10.5px!important;
    line-height:1.2!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-spotlight-mobile .arena-final-b-leader-badge{
    flex:0 0 18px!important;
    width:18px!important;
    min-width:18px!important;
    max-width:18px!important;
    height:18px!important;
    padding:0!important;
    justify-content:center!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-spotlight-mobile .arena-final-b-leader-badge>span{
    display:none!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-spotlight-mobile .arena-final-b-spotlight-copy>strong{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    margin:0!important;
    color:#d7dbe4!important;
    font-size:10.5px!important;
    line-height:1.45!important;
    font-weight:720!important;
    text-align:start!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    word-break:normal!important;
    display:-webkit-box!important;
    -webkit-line-clamp:2!important;
    -webkit-box-orient:vertical!important;
    overflow:hidden!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-spotlight-mobile .arena-final-b-spotlight-copy>small{
    min-width:0!important;
    display:flex!important;
    align-items:center!important;
    gap:8px!important;
    overflow:hidden!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-spotlight-mobile .arena-final-b-spotlight-copy>small i{
    font-size:8px!important;
    white-space:nowrap!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-spotlight-mobile .arena-final-b-spotlight-card>svg{
    width:12px!important;
    height:12px!important;
    align-self:center!important;
    justify-self:center!important;
  }
}


/* V3.7K.16c — phone Lounge wide lockup + Pulse last-card clearance. */
@media (max-width:1366px){
  /* Give Lounge the widest physical slot at the far-left of the RTL bottom bar. */
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-primary-nav:has(> .arena-v33-mobile-lounge:not([hidden])){
    grid-template-columns:repeat(3,minmax(0,1fr)) minmax(0,1.72fr)!important;
    gap:4px!important;
  }

  /* Horizontal Lounge lockup: larger animated logo on the right, label to its left. */
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-primary-nav>.arena-v33-mobile-lounge.arena-final-b-lounge-portal{
    height:54px!important;
    min-height:54px!important;
    padding:4px 9px!important;
    display:grid!important;
    grid-template-columns:44px minmax(0,1fr)!important;
    grid-template-rows:1fr!important;
    align-items:center!important;
    justify-items:stretch!important;
    column-gap:7px!important;
    direction:rtl!important;
    border-radius:14px!important;
    transform:translateY(-6px)!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-mobile-lounge .arena-final-b-lounge-logo{
    grid-column:1!important;
    grid-row:1!important;
    justify-self:center!important;
    align-self:center!important;
    width:42px!important;
    min-width:42px!important;
    height:42px!important;
    border-radius:13px!important;
    box-shadow:0 0 0 4px rgba(126,91,255,.045),0 0 20px rgba(239,35,60,.16)!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-mobile-lounge .arena-final-b-lounge-logo::before{
    width:26px!important;
    height:26px!important;
    border-radius:7px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-mobile-lounge .arena-final-b-lounge-logo::after{
    width:15px!important;
    height:15px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-mobile-lounge .arena-final-b-lounge-logo>b{
    font-size:14px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-mobile-lounge .arena-final-b-lounge-logo>i,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-mobile-lounge .arena-final-b-lounge-logo>em{
    width:4px!important;
    height:4px!important;
    top:19px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-mobile-lounge .arena-final-b-lounge-main{
    grid-column:2!important;
    grid-row:1!important;
    width:100%!important;
    min-width:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    padding:0!important;
    overflow:hidden!important;
    text-align:start!important;
    direction:rtl!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-mobile-lounge .arena-final-b-lounge-main>strong{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    color:#fff!important;
    font:900 10.3px/1.1 Cairo,Inter,sans-serif!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    text-align:start!important;
    text-shadow:0 0 12px rgba(239,35,60,.18)!important;
  }

  /* Ensure the final Pulse entry can always scroll fully above the fixed bottom navigation. */
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-spotlight-mobile .arena-final-b-spotlight-list{
    padding-bottom:78px!important;
    scroll-padding-bottom:78px!important;
    overscroll-behavior-y:contain!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-final-b-spotlight-mobile .arena-final-b-spotlight-card:last-child{
    scroll-margin-bottom:78px!important;
  }
}


/* V3.7K.16d — phone Lounge full-label width guarantee. */
@media (max-width:1366px){
  /* Reserve enough real width for the full Arabic Lounge label.
     Normal destinations stay compact; Lounge becomes the deliberate hero slot. */
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-primary-nav:has(> .arena-v33-mobile-lounge:not([hidden])){
    grid-template-columns:repeat(3,minmax(0,.88fr)) minmax(0,2.35fr)!important;
    gap:4px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-primary-nav>.arena-v33-mobile-lounge.arena-final-b-lounge-portal{
    padding-inline:10px!important;
    grid-template-columns:46px minmax(88px,1fr)!important;
    column-gap:8px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-mobile-lounge .arena-final-b-lounge-logo{
    width:44px!important;
    min-width:44px!important;
    height:44px!important;
    border-radius:14px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-mobile-lounge .arena-final-b-lounge-main{
    min-width:88px!important;
    overflow:visible!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-mobile-lounge .arena-final-b-lounge-main>strong{
    width:auto!important;
    min-width:88px!important;
    max-width:none!important;
    overflow:visible!important;
    text-overflow:clip!important;
    white-space:nowrap!important;
    font-size:10.7px!important;
    line-height:1!important;
  }
}


/* V3.7K.16e — phone Arena bottom-nav full-width distribution. */
@media (max-width:1366px){
  /* Use the whole footer width. Flex is intentional here: the previous grid
     left unused space on some Samsung/Chrome layouts after the Lounge hero slot. */
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-primary-nav:has(> .arena-v33-mobile-lounge:not([hidden])){
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    height:100%!important;
    margin:0!important;
    padding:0!important;
    box-sizing:border-box!important;
    display:flex!important;
    flex-direction:row!important;
    align-items:stretch!important;
    justify-content:space-between!important;
    gap:7px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-primary-nav:has(> .arena-v33-mobile-lounge:not([hidden])) > button,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-primary-nav:has(> .arena-v33-mobile-lounge:not([hidden])) > .arena-v33-rooms-group{
    flex:1 1 0!important;
    width:auto!important;
    min-width:0!important;
    max-width:none!important;
    margin:0!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-primary-nav:has(> .arena-v33-mobile-lounge:not([hidden])) > .arena-v33-mobile-lounge.arena-final-b-lounge-portal{
    flex:1.82 1 0!important;
    width:auto!important;
    min-width:142px!important;
    max-width:none!important;
    margin:0!important;
    padding-inline:11px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-mobile-lounge .arena-final-b-lounge-main{
    flex:1 1 auto!important;
    min-width:0!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-mobile-lounge .arena-final-b-lounge-main>strong{
    min-width:0!important;
    width:100%!important;
    max-width:none!important;
    white-space:nowrap!important;
    overflow:visible!important;
    text-overflow:clip!important;
    text-align:start!important;
  }
}


/* V3.7K.16f — phone Arena footer hard edge-to-edge anchor. */
@media (max-width:1366px){
  /* Hard-anchor the footer itself to both viewport edges. Width:auto with left/right
     avoids the Samsung/Chrome case where width:100% plus prior layout constraints
     left a dead strip on the physical left side. */
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-left{
    left:0!important;
    right:0!important;
    inset-inline:0!important;
    width:auto!important;
    min-width:0!important;
    max-width:none!important;
    margin:0!important;
    transform:none!important;
    box-sizing:border-box!important;
    overflow:visible!important;
  }

  /* Fill the footer's usable box directly rather than relying on intrinsic nav width. */
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-primary-nav:has(> .arena-v33-mobile-lounge:not([hidden])){
    position:absolute!important;
    left:6px!important;
    right:6px!important;
    inset-inline:6px!important;
    top:4px!important;
    bottom:calc(4px + env(safe-area-inset-bottom))!important;
    width:auto!important;
    min-width:0!important;
    max-width:none!important;
    height:auto!important;
    margin:0!important;
    padding:0!important;
    box-sizing:border-box!important;
    display:flex!important;
    flex-direction:row!important;
    align-items:stretch!important;
    justify-content:space-between!important;
    gap:8px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-primary-nav:has(> .arena-v33-mobile-lounge:not([hidden])) > button,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-primary-nav:has(> .arena-v33-mobile-lounge:not([hidden])) > .arena-v33-rooms-group{
    flex:1 1 0!important;
    min-width:0!important;
    width:auto!important;
    max-width:none!important;
    margin:0!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-primary-nav:has(> .arena-v33-mobile-lounge:not([hidden])) > .arena-v33-mobile-lounge.arena-final-b-lounge-portal{
    flex:1.75 1 0!important;
    min-width:140px!important;
    width:auto!important;
    max-width:none!important;
    margin:0!important;
  }
}


/* V3.7M.24 — Arena mobile scroll + Lounge reliability.
   Touch-only safety: keep the Arena feed/chat vertically scrollable even when
   large media cards are present. Desktop/laptop presentation is untouched. */
@media (max-width:1366px){
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-content .arena-thread{
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    touch-action:pan-y!important;
    overscroll-behavior-y:contain!important;
    overscroll-behavior-x:none!important;
    min-height:0!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-gamer-media-thread,
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-chat-thread{
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    touch-action:pan-y!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-primary-nav>.arena-v33-lounge-entry:not([hidden]){
    display:flex!important;
    flex:1 1 0!important;
    min-width:0!important;
  }

  /* Chat composer containment: width includes its padding/border, so the send
     button can never escape the Arena canvas on RTL phones/tablets. */
  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-v33-content .arena-compose{
    box-sizing:border-box!important;
    width:calc(100% - 16px)!important;
    max-width:calc(100% - 16px)!important;
    margin-inline:8px!important;
    min-width:0!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-compose-row{
    box-sizing:border-box!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    grid-template-columns:minmax(0,1fr) 46px!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-compose-row textarea[name="body"]{
    box-sizing:border-box!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }

  html.zg-mobile-ui #arenaPanel.arena-v33 .arena-compose-row>button[type="submit"]{
    box-sizing:border-box!important;
    width:46px!important;
    min-width:46px!important;
    max-width:46px!important;
    justify-self:stretch!important;
    margin:0!important;
    transform:none!important;
  }
}
