/* Ajustes compartilhados de celular e tablet. As regras de desktop continuam
   nos estilos de cada página. */
.catalog-notices > summary,
.catalog-filters > summary { display:none; }
.catalog-filters,
.catalog-filter-fields { display:contents; }

@media (max-width:1180px) {
  body .main-nav { max-height:calc(100dvh - 170px); overflow-y:auto; overscroll-behavior:contain; }
}

@media (max-width:720px) {
  html { scroll-padding-top:170px; }
  body .site-header { padding:6px 10px; }
  body .header-shell {
    display:grid;
    grid-template-columns:minmax(0,1fr) 44px 44px;
    grid-template-areas:"brand theme menu";
    height:auto;
    min-height:58px;
    padding:6px 8px;
    gap:6px;
  }
  body .header-shell:has(#openCart) { grid-template-columns:repeat(4,minmax(0,1fr)); grid-template-areas:"brand brand theme menu" "favorites favorites cart cart"; }
  body .premium-brand { grid-area:brand; min-width:0; gap:8px; }
  body .brand-logo-frame { width:44px; height:44px; flex:0 0 44px; border-radius:12px; }
  body .logo { width:38px; height:38px; border-radius:9px; }
  body .brand-info { display:block; min-width:0; }
  body .brand-info strong { display:block; font-size:13px; }
  body .brand-info small { display:block; font-size:8px; margin-top:4px; letter-spacing:.06em; }
  body .header-actions { display:contents; }
  body .header-actions .theme-toggle { grid-area:theme; justify-self:end; width:44px; height:44px; min-height:44px; padding:0; }
  body .menu-toggle { grid-area:menu; width:44px; height:44px; min-height:44px; }
  body .header-actions .ghost-btn { grid-area:favorites; }
  body .header-actions .cart-btn { grid-area:cart; }
  body .header-actions .ghost-btn,
  body .header-actions .cart-btn { width:100%; height:44px; min-height:44px; padding:0 10px; font-size:12px; }
  body .main-nav { top:calc(100% + 6px); padding:8px; max-height:calc(100dvh - 170px); }
  body .main-nav a { flex-shrink:0; min-height:46px; font-size:12px; }
  body .container { padding:12px 12px 32px; }
  .container > *, .catalog-content, .config-card, .upgrade-column { min-width:0; }
  body input:not([type="checkbox"]):not([type="radio"]),
  body select, body textarea { min-width:0; font-size:16px; }
  body input[type="checkbox"], body input[type="radio"] { flex-shrink:0; }
  button, a, summary, input, select { touch-action:manipulation; }
  button:focus-visible, a:focus-visible, summary:focus-visible,
  [role="button"]:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }

  /* Catálogo: acesso rápido às skins, sem perder filtros ou condições. */
  .hero-card, .faq-hero-card { padding:18px; border-radius:16px; min-height:0; }
  .hero-card h1 { font-size:32px; margin:8px 0; }
  .hero-card p:not(.eyebrow), .faq-hero-card p:not(.eyebrow) { font-size:13px; line-height:1.5; }
  .badges { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; margin-top:12px; }
  .badges span { width:auto; min-width:0; padding:8px; font-size:10px; white-space:normal; line-height:1.4; }
  .catalog-notices { margin:12px 0; border:1px solid var(--line-soft); border-radius:14px; background:var(--panel); }
  .catalog-notices > summary, .catalog-filters > summary {
    display:flex; align-items:center; gap:8px; min-height:48px; padding:12px;
    color:var(--text); font-size:13px; font-weight:800; cursor:pointer; list-style:none;
  }
  .catalog-notices > summary::-webkit-details-marker,
  .catalog-filters > summary::-webkit-details-marker { display:none; }
  .catalog-notices > summary::after, .catalog-filters > summary::after { content:"+"; margin-left:auto; font-size:20px; color:var(--accent); }
  .catalog-notices[open] > summary::after, .catalog-filters[open] > summary::after { content:"−"; }
  .catalog-notices .notice-panel { margin:0; padding:0 10px 10px; gap:8px; }
  .catalog-notices .notice-card { padding:12px; }
  .catalog-notices .notice-card p { font-size:12px; line-height:1.5; }
  .catalog-layout { gap:12px; }
  .filters-sidebar { display:block; padding:0; border-radius:14px; }
  .catalog-filters { display:block; }
  .catalog-filter-fields { display:grid; grid-template-columns:minmax(0,1fr); gap:12px; padding:0 12px 12px; }
  .catalog-filter-fields .sidebar-title { display:none; }
  #mobileFilterCount { font-size:11px; color:var(--muted); font-weight:400; }
  .filter-field { min-width:0; }
  .filter-field input, .filter-field select, .sort-box select { min-height:44px; }
  .price-range.vertical { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .price-range input { max-width:none; }
  .filter-field .check { min-height:44px; }
  .category-filter-bar { padding:12px; border-radius:14px; }
  .category-filter-title strong { font-size:17px; }
  .category-dropdowns { flex-wrap:wrap; gap:6px; }
  .category-pills .category { height:44px; min-height:44px; font-size:11px; }
  .search-panel { padding:10px 0 0; gap:8px; }
  .search-wrap { min-width:0; grid-template-columns:minmax(0,1fr) 72px; }
  .search-wrap input { min-width:0; min-height:46px; padding-left:10px; }
  .search-wrap button { min-height:46px; }
  .catalog-head { margin:12px 0; }
  .sort-box { width:100%; justify-content:space-between; font-size:12px; }
  .sort-box select { flex:1; max-width:220px; }
  #productsGrid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
  .product-card { min-height:0; border-radius:12px; }
  .product-card:hover { transform:none; }
  .image-box { height:118px; flex-basis:118px; padding:10px; }
  .image-box img { height:100px; }
  .card-body { padding:10px; }
  .product-title { font-size:12px; line-height:1.4; min-height:50px; margin-bottom:8px; overflow-wrap:anywhere; }
  .tags { gap:4px; margin-bottom:10px; }
  .tags span { font-size:9px; padding:4px 5px; }
  .price { font-size:18px; overflow-wrap:anywhere; }
  .card-btn { height:auto; min-height:44px; padding:8px 4px; font-size:10px; line-height:1.3; white-space:normal; }
  .fav-heart { width:44px; height:44px; top:6px; right:6px; }
  .load-more-btn, .side-clear { min-height:46px; }
  .whatsapp-float { position:static; width:calc(100% - 24px); max-width:350px; height:48px; margin:12px auto; border-radius:14px; gap:8px; transform:none; }
  .whatsapp-float svg { width:26px; height:26px; flex-shrink:0; }
  .whatsapp-float::after { content:"Falar no WhatsApp"; font-size:14px; font-weight:800; }
  .drawer { width:100%; max-width:100%; }
  .drawer-head h2 { font-size:22px; }
  .cart-row { grid-template-columns:54px minmax(0,1fr) 44px; gap:8px; }
  .cart-row img { width:54px; }
  .cart-row button, .icon-btn { width:44px; height:44px; }

  /* Montador: dois slots por linha e seleção ocupando a tela disponível. */
  .builder-hero { padding:18px 16px; }
  .builder-hero h1 { font-size:clamp(26px,7.5vw,34px); line-height:1.08; }
  .builder-mode-tabs { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  .builder-mode-tab { padding:12px 10px; min-height:76px; flex-direction:column; align-items:flex-start; justify-content:center; gap:6px; }
  .builder-mode-tab strong { font-size:13px; line-height:1.3; }
  .builder-mode-tab small { font-size:10px; line-height:1.4; }
  .builder-panel, .config-card { padding:12px; }
  .config-heading h2 { font-size:18px; }
  .config-step { flex:0 0 30px; }
  .config-help, .builder-status { font-size:12px; line-height:1.5; }
  .color-picker { gap:10px; }
  .color-option { width:44px; height:44px; }
  .weapon-checkbox { min-height:46px; }
  .weapon-actions button, .secondary-builder-btn, .whatsapp-builder-btn { min-height:46px; white-space:normal; }
  .manual-heading h2, .result-heading h2 { font-size:21px; }
  .manual-total-card, .result-total-card { min-width:0; width:100%; padding:10px 12px; }
  .manual-weapon-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  .manual-slot-card { min-height:174px; min-width:0; padding:8px; }
  .manual-slot-image { height:105px; }
  .manual-slot-image img { max-height:90px; }
  .manual-slot-info h3 { white-space:normal; font-size:12px; overflow-wrap:anywhere; }
  .manual-slot-info p { font-size:11px; line-height:1.4; }
  .manual-remove-btn, .swap-item-btn { width:44px; height:44px; right:4px; top:4px; }
  .manual-slot-card.selected .manual-slot-label { max-width:calc(100% - 56px); overflow-wrap:anywhere; }
  .smart-item-card { grid-template-columns:90px minmax(0,1fr); }
  .smart-item-info { padding-top:30px; }
  .skin-modal { padding:0; }
  .skin-modal-dialog {
    width:100%; height:100dvh; max-height:100dvh; min-height:0; border-radius:0; border:0;
    padding:calc(12px + env(safe-area-inset-top,0px)) 12px calc(12px + env(safe-area-inset-bottom,0px));
  }
  .skin-modal-head { flex-shrink:0; gap:8px; padding-bottom:8px; }
  .skin-modal-head h2 { font-size:20px; }
  .modal-close-btn { width:44px; height:44px; flex:0 0 44px; }
  .modal-search-wrap { flex-shrink:0; margin:10px 0; gap:8px; }
  .modal-search-wrap > input { width:100%; min-width:0; }
  .modal-price-filter { min-width:0; min-height:48px; }
  .modal-price-filter span { font-size:10px; }
  .modal-skin-grid { grid-template-columns:repeat(2,minmax(0,1fr)); min-height:0; flex:1; gap:8px; padding:0 2px 4px 0; overscroll-behavior:contain; align-content:start; }
  .modal-skin-card { min-width:0; }
  .modal-skin-card h3 { font-size:12px; overflow-wrap:anywhere; }
  .modal-skin-image { height:92px; }
  .modal-skin-image img { max-height:85px; }
  .modal-load-more { flex-shrink:0; min-height:44px; }
  .builder-toast { right:12px; left:12px; bottom:calc(12px + env(safe-area-inset-bottom,0px)); max-width:none; }

  /* Consulta e troca: campos legíveis, ações acessíveis e resumos sem cortes. */
  .sale-hero h1, .upgrade-intro h1 { font-size:clamp(27px,8vw,34px); line-height:1.08; }
  .trade-input-row, .target-search-row { grid-template-columns:minmax(0,1fr); }
  .trade-input-row input, .target-search-row input, .trade-input-row button, .target-search-row button { min-height:48px; width:100%; }
  .trade-link-guide__button, .upgrade-trade-link-guide__button { min-height:44px; white-space:normal; text-align:center; padding:10px; font-size:12px; }
  .selection-actions { flex-wrap:wrap; gap:8px; }
  .selection-actions button { min-height:44px; white-space:normal; padding:8px; font-size:12px; }
  .sale-summary, .upgrade-summary { position:static; min-width:0; }
  .sale-summary dd, .summary-result strong { overflow-wrap:anywhere; }
  .finish-sale-btn, .copy-sale-btn, .copy-upgrade-btn, .finish-upgrade-btn, .target-add-btn, .load-more-targets { min-height:46px; white-space:normal; }
  .upgrade-filter-field { font-size:10px; }
  .upgrade-filter-field input, .upgrade-filter-field select, .upgrade-check { min-height:44px; }
  .upgrade-filter-head button { min-height:44px; font-size:11px; }
  .qty-btn, .remove-target-btn { min-width:44px; min-height:44px; }
  .target-results, .upgrade-inventory-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  .target-card, .upgrade-inventory-card { min-width:0; }
  .upgrade-inventory-card { padding:8px; display:flex; flex-direction:column; gap:6px; }
  .upgrade-inventory-image { position:static; width:100%; height:100px; }
  .upgrade-inventory-body { padding-right:0; }
  .upgrade-inventory-check { width:44px; height:44px; top:4px; right:4px; }
  .upgrade-value-row { align-items:flex-start; flex-direction:column; gap:4px; }
  .upgrade-value-row strong { text-align:left; font-size:15px; overflow-wrap:anywhere; }
  .target-card-price { flex-direction:column; align-items:stretch; gap:8px; }
  .target-card-price strong { overflow-wrap:anywhere; }
  .target-add-btn { width:100%; font-size:12px; }
  .chosen-targets-top .chosen-targets { grid-template-columns:minmax(0,1fr); }
  .inventory-check { width:44px; height:44px; left:4px; right:auto; top:4px; }
  .upgrade-page-body .target-card h3, .upgrade-page-body .upgrade-inventory-card h3 { font-size:12px; overflow-wrap:anywhere; }
  .faq-item summary { min-height:56px; }
  .faq-contact-card { padding:18px; }
}

@media (max-width:359px) {
  body .brand-info small { display:none; }
  body .container { padding-left:10px; padding-right:10px; }
  .card-body { padding:8px; }
  .price { font-size:16px; }
  .manual-slot-card { padding:6px; }
  .manual-slot-image { height:90px; }
  .target-results, .upgrade-inventory-grid { grid-template-columns:minmax(0,1fr); }
}

@media (max-width:720px) and (max-height:520px) {
  .skin-modal-dialog { display:block; overflow-y:auto; }
  .skin-modal-head { position:sticky; top:0; z-index:4; background:var(--panel); padding-bottom:8px; }
  .modal-skin-grid { overflow:visible; }
}