/* Keep the same library on laptops and landscape phones; only spacing changes. */
@media (max-height:760px) {
  .at-prototype.sanctuary #sanctuary-drawer[data-category="skins"] { --wardrobe-header:72px; }
  .wardrobe-view-controls { flex-basis:52px; }
  #wardrobe-gallery,.wardrobe-assets { padding-block:20px; }
}
@media (max-width:1200px) {
  .wardrobe-view-list { gap:20px; }
  .wardrobe-utilities { gap:16px; }
  #wardrobe-gallery { grid-template-columns:280px minmax(0,1fr); gap:24px; }
  .sanctuary #sanctuary-drawer[data-category="skins"] #codex-skins .wardrobe-rail > button { grid-template-columns:76px minmax(0,1fr) 12px; gap:10px; padding:8px; min-height:74px; }
  .wardrobe-list-art { width:76px; height:50px; }
  .wardrobe-action-row { gap:12px; }
  .wardrobe-actions { right:16px; bottom:16px; padding:10px 12px; }
  .wardrobe-brand { left:20px; bottom:20px; width:25%; }
}
@media (max-width:900px) {
  .at-prototype.sanctuary #sanctuary-drawer[data-category="skins"] { --wardrobe-gutter:20px; --wardrobe-header:64px; }
  .sanctuary #sanctuary-drawer[data-category="skins"] .sanctuary-modal-identity strong { font-size:23px; }
  .sanctuary #sanctuary-drawer[data-category="skins"] #sanctuary-modal-emblem { width:32px; height:32px; }
  .wardrobe-view-controls { flex-basis:48px; gap:12px; }
  .wardrobe-view-list { gap:18px; }
  .sanctuary #sanctuary-drawer[data-category="skins"] #codex-skins .wardrobe-view-list button { gap:6px; font-size:13px; }
  .wardrobe-album { display:none; }
  .wardrobe-utilities { gap:0; }
  #wardrobe-gallery { grid-template-columns:240px minmax(0,1fr); gap:20px; padding-block:16px; }
  .sanctuary #sanctuary-drawer[data-category="skins"] #codex-skins .wardrobe-list-copy strong { font-size:13px; }
  .sanctuary #sanctuary-drawer[data-category="skins"] #codex-skins .wardrobe-list-copy small { font-size:10px; }
  .sanctuary #sanctuary-drawer[data-category="skins"] #codex-skins .wardrobe-primary { padding:9px 12px; font-size:12px; }
}
@media (orientation:landscape) and (max-height:480px) {
  .at-prototype.sanctuary #sanctuary-drawer[data-category="skins"] { --wardrobe-header:54px; --wardrobe-gutter:16px; }
  .sanctuary #sanctuary-drawer[data-category="skins"] .sanctuary-modal-top { padding-block:5px; }
  .sanctuary #sanctuary-drawer[data-category="skins"] .sanctuary-modal-identity { display:flex; flex-direction:row; align-items:center; gap:12px; }
  .sanctuary #sanctuary-drawer[data-category="skins"] .sanctuary-modal-identity strong { font-size:20px; }
  .sanctuary #sanctuary-drawer[data-category="skins"] .sanctuary-modal-identity span { font-size:12px; }
  .sanctuary #sanctuary-drawer[data-category="skins"] #sanctuary-modal-emblem { display:none; }
  .wardrobe-view-controls { flex-basis:44px; }
  #wardrobe-gallery { grid-template-columns:220px minmax(0,1fr); padding-block:10px; gap:16px; }
  .wardrobe-library-summary { padding:4px 0; }
  .sanctuary #sanctuary-drawer[data-category="skins"] #codex-skins .wardrobe-search input { min-height:36px; padding:7px 10px; font-size:12px; }
  .sanctuary #sanctuary-drawer[data-category="skins"] #codex-skins .wardrobe-filter select { min-height:28px; max-width:130px; font-size:11px; }
  .sanctuary #sanctuary-drawer[data-category="skins"] #codex-skins p.wardrobe-collection-info { display:none; }
  .wardrobe-brand { left:12px; bottom:12px; width:26%; }
  .sanctuary #sanctuary-drawer[data-category="skins"] #codex-skins .wardrobe-brand > .skin-family-logo { max-height:82px; }
  .wardrobe-actions { right:10px; bottom:10px; padding:8px; max-width:65%; }
  .wardrobe-image-tools { top:10px; right:10px; gap:6px; }
  .sanctuary #sanctuary-drawer[data-category="skins"] #codex-skins .wardrobe-action-row strong { font-size:16px; }
  .sanctuary #sanctuary-drawer[data-category="skins"] #codex-skins .csk-assets-row { grid-template-columns:120px minmax(0,1fr); }
}
@media (max-width:700px) {
  .wardrobe-view-list { gap:14px; }
  .sanctuary #sanctuary-drawer[data-category="skins"] #codex-skins .wardrobe-view-list button { gap:4px; font-size:12px; }
  .sanctuary #sanctuary-drawer[data-category="skins"] #codex-skins .wardrobe-view-list small { font-size:10px; }
  .wardrobe-hero-nav { gap:4px; }
  .sanctuary #sanctuary-drawer[data-category="skins"] #codex-skins .wardrobe-hero-nav button { width:32px; min-height:36px; }
  #wardrobe-gallery { grid-template-columns:205px minmax(0,1fr); gap:12px; }
  .sanctuary #sanctuary-drawer[data-category="skins"] #codex-skins .wardrobe-rail > button { grid-template-columns:64px minmax(0,1fr); gap:8px; }
  .wardrobe-list-art { width:64px; height:44px; }
  .wardrobe-selection-mark { display:none; }
}
/* Artwork labels sit above the variants on compact screens. */
@media (max-width:900px) {
  .sanctuary #sanctuary-drawer[data-category="skins"] #codex-skins .csk-assets-row { grid-template-columns:minmax(0,1fr); gap:12px; padding:18px 0; }
}
/* An already open combat image remains usable when a phone is rotated. */
@media (orientation:portrait) and (max-width:1100px) {
  .sanctuary:has(#csk-image-modal.is-asset-preview:not(.is-hidden)) > #csk-image-modal { display:grid!important; }
  .sanctuary:has(#csk-image-modal.is-asset-preview:not(.is-hidden)) > .sanctuary-rotate { display:none!important; }
}
@media (prefers-reduced-motion:reduce) {
  .sanctuary #sanctuary-drawer[data-category="skins"] #codex-skins * { scroll-behavior:auto!important; transition:none!important; }
}