/* Phone-only deck builder. The desktop panel layout remains untouched. */
@media (max-width: 700px) {
  body.mobile-deck-builder .builder-page { padding: 12px 8px 70px; }
  body.mobile-deck-builder .builder-toolbar { display: block; padding: 13px; margin-bottom: 10px; }
  body.mobile-deck-builder .builder-title-block h1 { font-size: 29px; }
  body.mobile-deck-builder .builder-title-block p { font-size: 13px; }
  body.mobile-deck-builder .toolbar-actions { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 6px !important; }
  body.mobile-deck-builder .toolbar-actions > * { min-width: 0; }
  body.mobile-deck-builder .toolbar-actions .deck-name-label { grid-column: span 2; }
  body.mobile-deck-builder .toolbar-actions select { grid-column: auto; }
  body.mobile-deck-builder .toolbar-actions button { min-height: 36px; padding: 5px 3px; white-space: normal; font-size: 10px; }

  body.mobile-deck-builder .builder-layout { display: grid !important; grid-template-columns: minmax(0, 34%) minmax(0, 1fr) !important; gap: 7px; align-items: start; min-width: 0; }
  body.mobile-deck-builder .builder-layout > * { display: flex !important; min-width: 0; width: auto; }
  body.mobile-deck-builder .preview-panel,
  body.mobile-deck-builder .deck-panel { height: min(72dvh, 690px) !important; max-height: min(72dvh, 690px) !important; overflow: hidden !important; }
  body.mobile-deck-builder .preview-panel { overflow-y: auto !important; }
  body.mobile-deck-builder .browser-panel { grid-column: 1 / -1; }

  body.mobile-deck-builder .panel-heading { padding: 12px; }
  body.mobile-deck-builder .filters { padding: 7px; gap: 5px; }
  body.mobile-deck-builder .card-browser { height: min(78dvh, 900px) !important; max-height: min(78dvh, 900px) !important; min-height: 0 !important; overflow-y: auto !important; grid-template-columns: repeat(6, minmax(0, 1fr)) !important; gap: 3px; padding: 4px; }
  body.mobile-deck-builder .browser-card { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 2px; min-width: 0; }
  body.mobile-deck-builder .browser-thumb { width: 100%; height: auto; aspect-ratio: 2.5 / 3.5; object-fit: contain; }
  body.mobile-deck-builder .browser-info { display: none; }
  body.mobile-deck-builder .browser-card-controls { display: flex; justify-content: space-between; align-items: center; width: 100%; gap: 1px; }
  body.mobile-deck-builder .browser-quantity { font-size: 9px; }
  body.mobile-deck-builder .browser-add { position: static; min-width: 20px; width: 20px; min-height: 20px; height: 20px; padding: 0; font-size: 16px; }

  body.mobile-deck-builder .deck-list { flex: 1 1 auto; max-height: none !important; min-height: 0 !important; overflow-y: auto !important; grid-template-columns: repeat(6, minmax(0, 1fr)) !important; gap: 3px; padding: 4px; }
  body.mobile-deck-builder .deck-entry.compact-card { min-width: 0; padding: 2px; gap: 2px; }
  body.mobile-deck-builder .deck-entry.compact-card .qty-controls { grid-template-columns: 1fr 12px 1fr; gap: 0; }
  body.mobile-deck-builder .deck-entry.compact-card .qty-btn { min-width: 0; padding: 2px 0; font-size: 12px; line-height: 1; }
  body.mobile-deck-builder .deck-entry.compact-card .qty { font-size: 10px; }
  body.mobile-deck-builder .army-slots { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; }
  body.mobile-deck-builder .army-slots .special-slot { min-width: 0; aspect-ratio: 2.5 / 3.5; padding: 2px; position: relative; overflow: hidden; }
  body.mobile-deck-builder .army-slots .special-slot.filled { display: block; }
  body.mobile-deck-builder .army-slots .special-slot.filled img { width: 100%; max-width: none; height: 100%; object-fit: contain; }
  body.mobile-deck-builder .army-slots .special-slot.filled > div,
  body.mobile-deck-builder .army-slots .special-slot.empty small { display: none; }
  body.mobile-deck-builder .army-slots .special-remove { position: absolute; top: 2px; right: 2px; z-index: 1; }
  body.mobile-deck-builder .deck-breakdown { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  body.mobile-deck-builder .deck-breakdown div { padding: 3px 0; }
  body.mobile-deck-builder .deck-breakdown span { font-size: 6px; }
  body.mobile-deck-builder .deck-breakdown strong { font-size: 10px; }
  body.mobile-deck-builder .preview-image-wrap { min-height: 0; padding: 7px 5px 2px; }
  body.mobile-deck-builder .preview-image-wrap img { width: 100%; max-width: 100%; cursor: zoom-in; }
  body.mobile-deck-builder .preview-copy { padding: 7px 5px 10px; }
  body.mobile-deck-builder .preview-copy h3 { font-size: 13px; }
  body.mobile-deck-builder .preview-meta, body.mobile-deck-builder .preview-copy p { font-size: 9px; }
  body.mobile-deck-builder .stat-row { gap: 2px; margin: 6px 0; }
  body.mobile-deck-builder .stat { padding: 3px 0; }
  body.mobile-deck-builder .stat small { font-size: 7px; }
  body.mobile-deck-builder .stat strong { font-size: 10px; }
  body.mobile-deck-builder .tag { font-size: 8px; padding: 2px; }
  body.mobile-deck-builder .effect-box { padding: 5px; font-size: 9px; }
  body.mobile-deck-builder .panel-heading { padding: 7px 6px; gap: 3px; }
  body.mobile-deck-builder .panel-heading h2 { font-size: 12px; }
  body.mobile-deck-builder .gold-pill { font-size: 8px; padding: 3px; }
  body.mobile-deck-builder .deck-status { margin: 5px; padding: 5px; font-size: 9px; }
  body.mobile-deck-builder .special-section-heading, body.mobile-deck-builder .main-deck-heading { padding: 5px; }
  body.mobile-deck-builder .special-section-heading h3, body.mobile-deck-builder .main-deck-heading h3 { font-size: 11px; }
  body.mobile-deck-builder .special-section-heading span, body.mobile-deck-builder .main-deck-heading span, body.mobile-deck-builder .deck-sort-label { font-size: 8px; }
  body.mobile-deck-builder .stronghold-slot, body.mobile-deck-builder .army-slots { padding: 4px; }
  body.mobile-deck-builder .special-slot.filled { grid-template-columns: 28px 1fr 22px; gap: 3px; font-size: 9px; }
  body.mobile-deck-builder .special-slot.filled img { max-width: 28px; }
  .mobile-deck-image-viewer { position: fixed; inset: 0; z-index: 20000; display: grid; place-items: center; padding: 20px; background: #02050be8; }
  .mobile-deck-image-viewer[hidden] { display: none; }
  .mobile-deck-image-viewer img { max-width: 92vw; max-height: 85dvh; object-fit: contain; }
  .mobile-deck-image-viewer button { position: absolute; top: 15px; right: 15px; width: 42px; height: 42px; border: 1px solid #d6ab57; border-radius: 50%; background: #182134; color: white; font-size: 27px; }
}
