/* =========================
   RESPONSIVE — ≤380px
========================= */

@media (max-width: 380px) {

  /* BASE FONT */
  * { font-size: 9px; }

  /* HEADER */
  /*
  .header { padding: 8px 10px; gap: 6px; }
  .header-name { font-size: 11px; max-width: 100px; }
  .header-id { font-size: 8px; }
  .header-ton { padding: 5px 7px; font-size: 11px; gap: 4px; }
  .header-ton img { height: 12px; }
  .lang-trigger { padding: 5px 7px; font-size: 9px; }
  */

  /* NAV */
  .nav { height: 68px; }
  .nav button img { height: 24px; width: 24px; }
  .nav button span { font-size: 7px; }

  /* CONTENT */
  .content { padding: 10px; padding-bottom: 60px; }

  /* PANELS */
  .panel { padding: 10px; margin-bottom: 10px; }

  /* PVP STATS GRID */
  .pvp-stats-grid { gap: 6px; margin-bottom: 8px; }
  .pvp-stat-card {
    grid-template-columns: 30px 1fr;
    gap: 6px;
    padding: 8px;
  }
  .pvp-stat-card img { padding: 10%; }
  .pvp-stat-label { font-size: 6px; margin-bottom: 4px; }
  .pvp-stat-value { font-size: 9px; }

  /* PVP RECORD 3 COLS */
  .pvp-stats-grid[style*="grid-template-columns:1fr 1fr 1fr"],
  .pvp-stats-grid[style*="grid-template-columns: 1fr 1fr 1fr"] {
    grid-template-columns: 1fr 1fr 1fr !important;
  }

  /* BATTLE BTN */  
  /*#pvp-battle-btn { height: 70px; gap: 10px; padding: 0 14px; }*/
  #pvp-battle-btn img.pvp-battle-icon { width: 28px; height: 28px; }  
  .battle-btn-label { font-size: 12px; letter-spacing: 1px; }
  .battle-btn-timer { font-size: 9px; }

  /* PVP SECONDARY ROW */
  .pvp-secondary-row { gap: 6px; margin: 8px 0; }
  .pvp-secondary-row .btn { font-size: 7px; padding: 8px 4px; height: 34px; }

  /* LEADERBOARD */
  .lb-row { padding: 8px 10px; font-size: 9px; }
  .lb-rank { width: 28px; font-size: 9px; }
  .lb-stats { width: 70px; font-size: 9px; }
  .lb-reward { width: 80px; font-size: 9px; }
  .lb-reward img { height: 10px; }

  /* HERO LAYOUT */
  .hero-layout { gap: 8px; }
  .ronin-gear-stats { gap: 8px; }

  /* STAT ROW */
  .stat-row { grid-template-columns: 1fr 44px 28px; gap: 4px; height: 32px; }
  .stat-name img { height: 16px; margin-right: 6px; }
  .stat-plus { height: 22px; font-size: 12px; }

  /* SLOT GRID */
  .slot-grid { gap: 6px; }
  .slot:not(.slot-buff) { height: 36px; border-radius: 10px; }

  /* SHOP */
  .shop-grid { gap: 6px; }
  .shop-item { padding: 10px; padding-top: 26px; }
  .shop-item-name { font-size: 10px; }
  .shop-item-desc { font-size: 8px; }
  .shop-buy { font-size: 8px; height: 26px; padding: 0 8px; }

  /* XP BAR */
  .xp-bar { height: 18px; }
  .xp-text { font-size: 9px; line-height: 18px; }

  /* POPUP */
  .popup { padding: 14px; }
  .popup-box { padding: 16px 14px; }
  .popup-text { font-size: 9px; line-height: 18px; }

  /* BTN GLOBAL */
  .btn { font-size: 8px; }

  /* PVPSTAT CARD TEXT LEFT */
  .pvp-stat-card .text-left { text-align: left; }

  /* BANNER */
  .page-banner { margin-bottom: 8px; }

  /* ARMORY */
  .armory-tab { font-size: 8px; padding: 8px 4px; }
  .armory-card-img { width: 48px; height: 48px; }

  /* REFERRAL */
  .ref-card { padding: 8px; }
  .ref-value { font-size: 12px; }
  .ref-title { font-size: 9px; }
  .ref-row { padding: 6px; font-size: 9px; }
  .ref-table-header { font-size: 8px; padding: 4px 6px; }

  /* BATTLE HUD */
  .battle-display-name { font-size: 9px; }
  .battle-hp-bg { height: 16px; }
  #hp-text-a, #hp-text-b { font-size: 8px; line-height: 16px; }
  .bstat { font-size: 8px; padding: 6px 4px; }
  .bstat span { font-size: 9px; }

  /* INSPECT */
  .inspect-skin-img { width: 70px; }

  /* SEASON RESULT */
  .season-result-rank { font-size: 18px; padding: 8px 12px 5px; }
  .season-result-stat-value { font-size: 13px; }
  .season-result-stats { gap: 6px; }
}

/* =========================
   RESPONSIVE — ≤340px
========================= */

@media (max-width: 340px) {

  * { font-size: 8px; }

  .header-name { max-width: 80px; font-size: 10px; }
  .header-ton { font-size: 10px; }

  #claim-timer { font-size: 12px; }
  #claim-tonday { font-size: 12px; }
  #claim-tonday-desc { font-size: 8px; }
  .panel-claim img { height: 65%; }

  .pvp-stat-value { font-size: 8px; }
  .battle-btn-label { font-size: 11px; }

  .lb-reward { display: none; }
  .lb-stats { width: 60px; }

  .pvp-secondary-row .btn { font-size: 7px; }

  .shop-item-name { font-size: 9px; }
  .ref-value { font-size: 11px; }

  .slot-pvp { height: 30px !important; }
}