/* Responsive Update 1.0 – mobile overrides only */
*,*::before,*::after{box-sizing:border-box}
html,body{max-width:100%;overflow-x:hidden}
img,video,canvas,svg{max-width:100%}
.container{width:min(1220px,calc(100% - 28px));margin-inline:auto}

/* Mobile navigation */
.game-nav-toggle{display:none;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border:1px solid rgba(255,255,255,.14);border-radius:12px;background:rgba(12,12,14,.94);color:#fff;font-size:1.35rem;cursor:pointer}
.game-nav-mobile-label{display:none;color:#fff;font-weight:900;font-size:.92rem;letter-spacing:.04em}

/* Generic responsive helpers */
.table-wrap,.rules-table-wrap{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
input,select,textarea,button{max-width:100%}
pre,code{max-width:100%;overflow-wrap:anywhere}

@media (max-width:900px){
  .container{width:min(100% - 22px,1220px)}

  .game-nav{position:sticky;top:0;z-index:1000;display:grid!important;grid-template-columns:52px 1fr 52px;align-items:center;min-height:66px;padding:8px 11px!important;background:rgba(7,7,9,.97);backdrop-filter:blur(14px);border-bottom:1px solid rgba(255,255,255,.08)}
  .game-nav-logo{grid-column:2;grid-row:1;justify-self:center;position:static!important;transform:none!important;margin:0!important}
  .game-nav-logo img{display:block;width:auto!important;height:48px!important;max-width:170px;object-fit:contain}
  .game-nav-toggle{display:flex;grid-column:1;grid-row:1}
  .game-nav-mobile-label{display:block;grid-column:3;grid-row:1;text-align:right;font-size:.72rem;color:rgba(255,255,255,.68)}
  .game-nav-side{display:none!important;grid-column:1/-1;width:100%!important;flex-direction:column!important;align-items:stretch!important;gap:7px!important;padding:10px 0 0!important;margin:0!important}
  .game-nav.is-open .game-nav-side{display:flex!important}
  .game-nav-left{grid-row:2}
  .game-nav-right{grid-row:3;padding-top:7px!important}
  .game-nav-side a{display:flex!important;align-items:center;justify-content:center;width:100%;min-height:44px;padding:10px 14px!important;border-radius:10px;text-align:center;white-space:normal!important}
  body.nav-open{overflow:hidden}

  /* Shared heroes and panels */
  .arena-new-hero-inner,.cards-hero,.leaderboard-hero,.rules-hero-inner,.card-detail-hero,.shop-header-content{padding-inline:18px!important}
  .arena-new-hero h1,.cards-hero h1,.leaderboard-hero h1,.rules-hero h1,.card-detail-hero h1,.shop-header h1{font-size:clamp(1.75rem,7vw,2.65rem)!important;line-height:1.08}
  .arena-modern-grid,.leaderboard-grid,.card-detail-layout,.profile-modern-grid,.customize-grid{grid-template-columns:1fr!important}
  .arena-side-column{order:2}
  .arena-main-column{order:1}

  .arena-hero-actions,.rules-hero-actions,.btn-row{display:grid!important;grid-template-columns:1fr!important;width:100%;gap:10px!important}
  .arena-hero-actions a,.arena-hero-actions button,.rules-hero-actions a,.btn-row .btn{width:100%;justify-content:center;text-align:center}
  .arena-hero-stats,.shop-xp-cards{grid-template-columns:repeat(2,minmax(0,1fr))!important}

  /* Arena */
  .arena-page{padding-inline:0!important}
  .arena-new-hero{border-radius:16px!important}
  .arena-hero-top{display:grid!important;grid-template-columns:1fr!important;gap:15px!important}
  .arena-user-card{width:100%;justify-content:flex-start!important}
  .arena-modern-grid{gap:16px!important}
  .arena-panel{padding:16px!important;border-radius:15px!important}
  .arena-panel-head{align-items:flex-start!important;gap:12px!important;flex-wrap:wrap}
  .arena-live-tools{width:100%;justify-content:space-between!important}
  .arena-fight-list{grid-template-columns:1fr!important}
  .arena-fight-header,.arena-fight-footer{display:grid!important;grid-template-columns:1fr!important;gap:12px!important}
  .arena-fight-meta{text-align:left!important}
  .arena-hidden-cards{justify-content:center!important;gap:8px!important}
  .arena-hidden-cards img{width:clamp(52px,18vw,78px)!important}
  .arena-button{min-height:44px}
  .arena-modal,.arena-create-modal,.modal-content{width:min(96vw,720px)!important;max-height:90vh!important;overflow-y:auto!important;margin:5vh auto!important}
  .arena-card-grid,.card-selection-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:9px!important}
  .arena-card{min-width:0!important}
  .arena-card img{width:100%!important;height:auto!important}

  /* Cards */
  .cards-page{padding-inline:0!important}
  .cards-overview-bar,.cards-panel-head{display:grid!important;grid-template-columns:1fr!important;gap:12px!important}
  .season-tabs,.cards-tabs{display:flex!important;overflow-x:auto;justify-content:flex-start!important;scroll-snap-type:x proximity;padding-bottom:5px}
  .season-tab,.cards-tab{flex:0 0 auto;scroll-snap-align:start}
  .premium-card-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:12px!important}
  .premium-card-link{min-width:0}

  /* Leaderboard */
  .leaderboard-page{padding-inline:0!important}
  .leaderboard-grid{gap:16px!important}
  .leaderboard-column{padding:16px!important}
  .leaderboard-filters{display:flex!important;overflow-x:auto;justify-content:flex-start!important;padding-bottom:4px}
  .leaderboard-filter{flex:0 0 auto;white-space:nowrap}
  .leaderboard-card{grid-template-columns:46px minmax(0,1fr) auto!important;gap:10px!important;padding:12px!important}
  .leaderboard-avatar{width:40px!important;height:40px!important}
  .leaderboard-user-content strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .leaderboard-score{min-width:58px;text-align:right}

  /* Profile */
  .profile-modern-page{padding-inline:0!important}
  .profile-modern-hero{padding:20px!important}
  .profile-modern-hero-content{grid-template-columns:1fr!important;text-align:center;gap:18px!important}
  .profile-modern-player{display:flex!important;flex-direction:column!important;align-items:center!important}
  .profile-modern-level-card{width:100%!important;max-width:520px;margin-inline:auto}
  .profile-modern-grid{gap:14px!important}
  .profile-modern-stat-grid,.profile-modern-result-grid,.profile-modern-cosmetics{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .profile-modern-card-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:11px!important}

  /* XP shop */
  .shop-wrap{width:min(100% - 22px,1220px)!important;padding-inline:0!important}
  .shop-header{padding:20px!important}
  .shop-tabs{display:flex!important;overflow-x:auto;justify-content:flex-start!important;padding-bottom:5px}
  .shop-tab{flex:0 0 auto;white-space:nowrap}
  .shop-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:13px!important}
  .shop-item{min-width:0;padding:15px!important}
  .shop-actions{display:grid!important;grid-template-columns:1fr!important}
  .shop-actions .arena-button{width:100%}
  .shop-card-preview{grid-template-columns:1fr!important}

  /* Battle */
  .battle-player-v1{padding:14px 8px 20px!important;border-radius:14px!important}
  .battle-match-header{grid-template-columns:minmax(0,1fr) 44px minmax(0,1fr)!important;padding:10px 7px!important}
  .battle-match-name{font-size:.9rem!important}
  .battle-round-block{padding:10px 5px 13px!important}
  .battle-arena-board{min-height:0!important;overflow:hidden}
  .battle-arena-row{grid-template-columns:minmax(0,1fr) 34px minmax(0,1fr)!important;gap:4px!important}
  .battle-board-deck{display:none!important}
  .battle-center-vs{font-size:.8rem!important}
  .battle-board-card img,.battle-card-image{max-height:58vh!important;width:auto!important;max-width:100%!important}
  .battle-log-card{grid-template-columns:30px minmax(0,1fr)!important;padding:8px!important}
  .fight-cards{flex-wrap:wrap;justify-content:center}
  .card-selection{grid-template-columns:repeat(3,minmax(0,1fr))!important}

  /* Card detail and rules */
  .card-detail-page,.rules-page{padding-inline:0!important}
  .card-detail-layout{gap:16px!important}
  .card-render-panel,.card-info-panel{padding:16px!important}
  .card-detail-rendered img{max-height:72vh;width:auto}
  .card-arena-stats,.rules-info-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .rules-grid{grid-template-columns:1fr!important}
  .rules-panel{grid-column:auto!important}
}

@media (max-width:600px){
  .container{width:min(100% - 14px,1220px)}
  .game-nav{min-height:60px;padding:6px 8px!important;grid-template-columns:48px 1fr 48px}
  .game-nav-logo img{height:42px!important;max-width:145px}
  .game-nav-toggle{width:40px;height:40px}

  .arena-hero-stats,.shop-xp-cards,.profile-modern-stat-grid,.profile-modern-result-grid,.profile-modern-cosmetics,.card-arena-stats,.rules-info-grid{grid-template-columns:1fr 1fr!important}
  .premium-card-grid,.profile-modern-card-grid,.arena-card-grid,.card-selection-grid,.card-selection{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .shop-grid{grid-template-columns:1fr!important}
  .shop-xp-card{padding:13px!important}
  .arena-panel,.leaderboard-column,.profile-modern-panel,.profile-modern-cards-panel,.cards-panel{padding:14px!important;border-radius:13px!important}

  .leaderboard-card{grid-template-columns:40px minmax(0,1fr)!important}
  .leaderboard-score{grid-column:2;text-align:left;margin-top:2px}
  .leaderboard-rank{grid-row:1/3}

  .arena-fight-card{border-radius:13px!important}
  .arena-player-heading{font-size:1rem!important}
  .arena-player-avatar{width:32px!important;height:32px!important}
  .arena-hidden-cards img{width:58px!important}

  .battle-replay-title{gap:8px!important}
  .battle-match-header{grid-template-columns:minmax(0,1fr) 36px minmax(0,1fr)!important}
  .battle-match-name{font-size:.78rem!important}
  .battle-arena-row{grid-template-columns:minmax(0,1fr) 26px minmax(0,1fr)!important}
  .battle-player-avatar{width:20px!important;height:20px!important;min-width:20px!important;max-width:20px!important}

  .profile-modern-hero{padding:15px!important}
  .profile-modern-card-info strong{font-size:.82rem!important}
  .profile-modern-card-info span{font-size:.72rem!important}
  .profile-modern-cards-head,.cards-panel-head,.shop-section-head{align-items:flex-start!important}

  .rules-table{min-width:680px}
}

@media (max-width:390px){
  .arena-hero-stats,.shop-xp-cards,.profile-modern-stat-grid,.profile-modern-result-grid,.profile-modern-cosmetics{grid-template-columns:1fr!important}
  .premium-card-grid,.profile-modern-card-grid,.arena-card-grid,.card-selection-grid,.card-selection{gap:8px!important}
  .arena-hidden-cards img{width:50px!important}
  .battle-match-name{font-size:.7rem!important}
}
@media (max-width: 768px) {

    .battle-player-avatar,
    .battle-player-image,
    .battle-player img,
    .battle-player-avatar img {
        width: 42px !important;
        height: 42px !important;
        min-width: 42px !important;
        border-radius: 50%;
        object-fit: cover;
    }

}


/* Responsive Update 1.1 – kleine Displays und Touch-Bedienung */
@media (max-width:900px){
  .game-nav.is-open{max-height:100dvh;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
  input:not([type="checkbox"]):not([type="radio"]),select,textarea{font-size:16px!important}
  button,a,.arena-button,.trade-btn{touch-action:manipulation}
  .season-tabs,.cards-tabs,.leaderboard-filters,.shop-tabs,.trade-tabs{scrollbar-width:none;-ms-overflow-style:none}
  .season-tabs::-webkit-scrollbar,.cards-tabs::-webkit-scrollbar,.leaderboard-filters::-webkit-scrollbar,.shop-tabs::-webkit-scrollbar,.trade-tabs::-webkit-scrollbar{display:none}
  .trade-tabs{display:flex!important;flex-wrap:nowrap!important;overflow-x:auto!important;justify-content:flex-start!important;padding-bottom:7px!important;-webkit-overflow-scrolling:touch}
  .trade-tabs a{flex:0 0 auto;white-space:nowrap}
  .trade-status-grid strong,.trade-card h3,.trade-history strong{overflow-wrap:anywhere}
  .trade-btn{min-height:44px}
}

@media (max-width:600px){
  .trade-hero{padding:20px!important;border-radius:20px!important}
  .trade-wallet{padding:17px 16px!important}
  .trade-panel__head{gap:12px!important}
}

@media (max-width:390px){
  .trade-card-grid{grid-template-columns:1fr!important}
  .trade-card__image{min-height:230px!important}
  .trade-card__image img{height:220px!important}
}