/* Phone-only detail layout. Desktop markup, ordering and styles stay intact. */
@media (max-width:600px) {
  /* A centred auto-height dialog moves whenever metadata or credits change. */
  html #card-detail-dialog { box-sizing:border-box; height:calc(100dvh - 18px); max-height:calc(100dvh - 18px); margin:9px auto; top:0; bottom:auto; scrollbar-gutter:stable; }
  #card-detail-dialog .card-detail-navigation { justify-content:flex-start; gap:5px; padding:5px 44px 5px 10px; }
  #card-detail-dialog .card-detail-navigation button { min-height:30px; padding:4px 7px; font-size:10px; }
  #card-detail-dialog .card-detail-navigation > span { font-size:9px; }
  #card-detail-dialog .admin-view-toggle-dialog { order:1; margin-left:0; }
  html #card-detail-dialog .card-detail-layout {
    grid-template-columns:minmax(0,60fr) minmax(0,40fr);
    grid-template-rows:auto auto minmax(min-content,1fr) auto auto auto auto;
    container-type:inline-size;
    gap:6px 8px;
    align-items:start;
    padding:12px 10px;
  }
  html #card-detail-dialog .card-detail-copy,
  #card-detail-dialog .card-detail-summary-row { display:contents; }
  #card-detail-dialog .card-detail-preview {
    grid-column:1; grid-row:1 / 7; width:100%; min-width:0; margin:0;
  }
  #card-detail-dialog .card-detail-preview .card-shell { width:100%; height:auto; aspect-ratio:2 / 3; margin:0; }
  #card-detail-dialog .card-detail-badges { grid-column:2; grid-row:1; gap:4px; margin-top:3cqw; }
  #card-detail-dialog .card-detail-badges :is(strong,span) { padding:4px 5px; font-size:11px; }
  #card-detail-title { grid-column:2; grid-row:2; min-width:0; margin:0; font-size:clamp(16px,4.3vw,22px); line-height:1.1; overflow-wrap:anywhere; }
  #card-detail-category { grid-column:2; grid-row:3; margin:0; font-size:10px; line-height:1.3; overflow-wrap:anywhere; }
  #card-detail-dialog .card-detail-links { grid-column:2; grid-row:5; margin:0; gap:4px; flex-direction:column; }
  #card-detail-dialog .card-detail-links a { box-sizing:border-box; display:flex; align-items:center; justify-content:center; min-height:28px; padding:3px; text-align:center; font-size:9px; }
  #card-detail-dialog .card-detail-links a[hidden] { display:none; }
  #card-detail-prestige-conditions { grid-column:2; grid-row:4; margin:0; padding:6px; font-size:10px; }
  #card-detail-sell { box-sizing:border-box; margin:0; min-height:32px; padding:3px 5px; font-size:10px; line-height:1.15; }
  /* Reserve the same reading space for short and long texts when navigating. */
  #card-detail-description { grid-column:1 / -1; grid-row:7; margin:8px 0 4px; box-sizing:border-box; height:clamp(90px,calc(100dvh - 90cqw - 160px),260px); min-height:0; max-height:none; overflow:auto; scrollbar-gutter:stable; font-size:14px; line-height:1.6; }
  #card-detail-dialog .card-detail-facts { grid-column:2; grid-row:6; min-width:0; margin:0 0 4.5cqw; grid-template-columns:minmax(0,1fr); }
  #card-detail-dialog .card-detail-facts div { padding:6px; }
  #card-detail-dialog .card-detail-facts dt { font-size:8px; line-height:1.4; }
  #card-detail-dialog .card-detail-facts dd { font-size:13px; margin-top:3px; }
  #card-detail-dialog .card-detail-credit,
  #card-detail-remove,
  #card-detail-remove-feedback { grid-column:1 / -1; min-width:0; overflow-wrap:anywhere; }
  #card-detail-map-panel { grid-column:1 / -1; grid-row:20; }
}