/* Compact landscape keeps the desktop composition and the complete bitmap frame. */
@media (orientation:landscape) and (max-height:700px), (orientation:landscape) and (max-width:1050px) {
  #game-window:is([data-panel="bag"],[data-panel="pets"]) {
    --iu:.7px;
    --pu:.7px;
    width:min(1180px, 100%);
    height:100%;
    max-width:100%;
    max-height:min(690px, 100%);
    background-size:100% 100%;
    background-position:center;
  }
  #game-window:is([data-panel="bag"],[data-panel="pets"]) .window-header>div {
    left:17%;
    top:3%;
    width:21%;
    height:13%;
    min-height:36px;
    background:none;
  }
  #game-window:is([data-panel="bag"],[data-panel="pets"]) .window-header { height:100%; }
  #game-window:is([data-panel="bag"],[data-panel="pets"]) .window-header h1 { font-size:24px;letter-spacing:0; }
  html[lang="en"] #game-window[data-panel="bag"] .window-header h1 { font-size:21px; }
  #game-window:is([data-panel="bag"],[data-panel="pets"]) #panel-close {
    top:22%;
    right:0;
    width:58px;
    height:44px;
    min-width:44px;
    min-height:44px;
  }
  #game-window:is([data-panel="bag"],[data-panel="pets"]) #panel-content {
    position:absolute;
    inset:20% 7% 3% 10%;
    padding:0;
    overflow:hidden;
  }
  #game-window[data-panel="bag"] #panel-content { overflow:visible; }

  #game-window[data-panel="bag"] .inventory-art-layout.inventory-layout,
  #game-window[data-panel="bag"] .inventory-art-layout.inventory-layout:has(.potion-inventory-detail) {
    --bag-preview-size:76px;
    display:grid;
    grid-template-columns:minmax(0, 1.7fr) minmax(0, 1fr);
    grid-template-rows:minmax(0, 1fr);
    grid-template-areas:"items detail";
    gap:12px;
    height:100%;
    min-height:0;
    padding:12px 10px 8px 34px;
    border-radius:24px;
    background:#fff3bd;
  }
  #game-window[data-panel="bag"] .inventory-art-layout::before { display:block;inset:12px 10px 8px 34px; }
  #game-window[data-panel="bag"] .inventory-categories {
    grid-area:auto;
    position:absolute;
    left:-48px;
    top:18px;
    bottom:12px;
    display:grid;
    grid-template-columns:78px;
    grid-template-rows:repeat(4, minmax(0, 1fr));
    align-content:start;
    gap:7px;
    max-height:240px;
    z-index:3;
  }
  #game-window[data-panel="bag"] .inventory-categories .bag-tab[data-filter] {
    width:78px;
    height:44px;
    max-height:100%;
    min-height:0;
    padding:0;
    margin:0;
    border-radius:0;
    background-color:transparent;
    background-position:left center;
    background-size:auto 100%;
    background-repeat:no-repeat;
    box-shadow:none;
    justify-content:flex-start;
    align-self:center;
  }
  #game-window[data-panel="bag"] .inventory-categories .bag-tab[data-filter].active { width:87px;margin-left:-9px; }
  #game-window[data-panel="bag"] .inventory-categories .bag-tab[data-filter="all"] { background-image:url("../assets/ui-user/bag-tab-all-inactive.png"); }
  #game-window[data-panel="bag"] .inventory-categories .bag-tab[data-filter="fruit"] { background-image:url("../assets/ui-user/bag-tab-crops-inactive.png"); }
  #game-window[data-panel="bag"] .inventory-categories .bag-tab[data-filter="seed"] { background-image:url("../assets/ui-user/bag-tab-seeds-inactive.png"); }
  #game-window[data-panel="bag"] .inventory-categories .bag-tab[data-filter="tool"] { background-image:url("../assets/ui-user/bag-tab-tools-inactive.png"); }
  #game-window[data-panel="bag"] .inventory-categories .bag-tab[data-filter="all"].active { background-image:url("../assets/ui-user/bag-tab-all.png"); }
  #game-window[data-panel="bag"] .inventory-categories .bag-tab[data-filter="fruit"].active { background-image:url("../assets/ui-user/bag-tab-crops.png"); }
  #game-window[data-panel="bag"] .inventory-categories .bag-tab[data-filter="seed"].active { background-image:url("../assets/ui-user/bag-tab-seeds.png"); }
  #game-window[data-panel="bag"] .inventory-categories .bag-tab[data-filter="tool"].active { background-image:url("../assets/ui-user/bag-tab-tools.png"); }
  #game-window[data-panel="bag"] .inventory-categories .bag-tab .bag-tab-label { width:42px;margin:0 0 0 34px;padding:0 2px;font-size:13px;line-height:1.2; }
  #game-window[data-panel="bag"] .inventory-categories .bag-tab.active .bag-tab-label { width:49px;margin-left:36px; }
  #game-window[data-panel="bag"] .inventory-main { padding:5px 3px 0;background:none;border-radius:0; }
  #game-window[data-panel="bag"] .inventory-grid { grid-template-columns:repeat(3, minmax(0, 1fr));grid-auto-rows:108px;gap:7px 5px;padding:5px;flex:1 1 0;min-height:0;overflow:auto; }
  #game-window[data-panel="bag"] .inventory-slot,
  #game-window[data-panel="bag"] .inventory-slot.active { padding:4px 0;gap:4px; }
  #game-window[data-panel="bag"] .item-art { width:68px;height:68px; }
  #game-window[data-panel="bag"] .inventory-item-name { font-size:13px;line-height:1.3; }
  #game-window[data-panel="bag"] .inventory-footer { min-height:28px;margin:0;font-size:11px; }
  #game-window[data-panel="bag"] .inventory-footer button { min-height:28px;padding:3px 8px;font-size:12px; }
  #game-window[data-panel="bag"] .inventory-detail,
  #game-window[data-panel="bag"] .inventory-detail.potion-inventory-detail {
    grid-area:detail;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:3px;
    height:100%;
    min-height:0;
    padding:0 5px 3px;
    border-radius:0;
    background:none;
    overflow:hidden;
  }
  #game-window[data-panel="bag"] .inventory-detail .inventory-selected-preview { width:100%;height:var(--bag-preview-size);margin:0;flex:none; }
  #game-window[data-panel="bag"] .inventory-detail .detail-art { width:var(--bag-preview-size);height:var(--bag-preview-size); }
  #game-window[data-panel="bag"] .inventory-detail .inventory-step { top:calc((var(--bag-preview-size) - 36px) / 2);width:28px;height:36px;min-width:28px;min-height:36px; }
  #game-window[data-panel="bag"] .inventory-step.previous { left:0; }
  #game-window[data-panel="bag"] .inventory-step.next { right:0; }
  #game-window[data-panel="bag"] .inventory-detail .inventory-selected-count { left:4px;top:0;max-width:100%;height:22px;font-size:12px; }
  #game-window[data-panel="bag"] .inventory-detail .detail-name { flex:none;align-self:center;max-width:100%;padding:4px 10px;margin:0;font-size:17px;line-height:1.2; }
  #game-window[data-panel="bag"] .inventory-detail .quality-tag { flex:none;align-self:center;padding:2px 6px;margin:0;font-size:11px;line-height:1.2; }
  #game-window[data-panel="bag"] .inventory-detail .detail-facts { flex:1 1 0;min-height:0;overflow:auto;padding:0 5px 0 0;margin:0; }
  #game-window[data-panel="bag"] .inventory-detail .detail-facts>div { min-height:25px;padding:3px 0;gap:6px;border-bottom-width:2px; }
  #game-window[data-panel="bag"] .inventory-detail .detail-facts>div>:is(span,strong) { font-size:12px;line-height:1.4; }
  #game-window[data-panel="bag"] .inventory-detail .detail-actions { width:100%;flex:none;margin:0;gap:4px; }
  #game-window[data-panel="bag"] .inventory-detail .detail-actions button { min-height:36px;padding:6px 4px;font-size:13px; }

  #game-window[data-panel="pets"] #panel-content { left:8%;right:8%; }
  #game-window[data-panel="pets"] .pet-layout {
    --pet-preview-size:78px;
    --pet-roster-size:52px;
    --pet-button-height:36px;
    display:grid;
    grid-template-columns:minmax(0, 1.7fr) minmax(0, 1fr);
    grid-template-rows:100px minmax(0, 1fr);
    grid-template-areas:"roster detail" "workspace detail";
    height:100%;
    min-height:0;
    gap:7px 14px;
    padding:10px 12px;
    border-radius:24px;
    background:#fff3bd;
  }
  #game-window[data-panel="pets"] .pet-layout::before { display:block;inset:10px 12px; }
  #game-window[data-panel="pets"] .pet-roster { display:grid;grid-template-columns:repeat(3, minmax(0, 1fr));grid-template-rows:minmax(0, 1fr);gap:4px;padding:0;border:0; }
  #game-window[data-panel="pets"] .pet-roster-item { display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;padding:0 2px; }
  #game-window[data-panel="pets"] .pet-roster-art { width:var(--pet-roster-size);height:var(--pet-roster-size); }
  #game-window[data-panel="pets"] .pet-roster-item strong { font-size:14px;line-height:1.2; }
  #game-window[data-panel="pets"] .pet-roster-item small { display:block;font-size:10px;line-height:1.2; }
  #game-window[data-panel="pets"] .pet-roster-status { display:block;padding:1px 4px;font-size:10px;line-height:1.2; }
  #game-window[data-panel="pets"] .pet-detail { display:flex;flex-direction:column;min-height:0;padding:0 4px 2px;gap:5px;border-radius:0;background:none; }
  #game-window[data-panel="pets"] .pet-profile { display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:3px;flex:none; }
  #game-window[data-panel="pets"] .pet-preview { width:calc(var(--pet-preview-size) + 8px);height:var(--pet-preview-size);flex:none; }
  #game-window[data-panel="pets"] .pet-main-portrait { top:-4px;height:calc(var(--pet-preview-size) + 8px); }
  #game-window[data-panel="pets"] .pet-profile h2 { width:auto;max-width:100%;align-self:center;padding:4px 12px;font-size:18px;line-height:1.2; }
  #game-window[data-panel="pets"] .pet-form { display:block;align-self:center;padding:1px 6px;font-size:10px;line-height:1.2; }
  #game-window[data-panel="pets"] .pet-detail-scroll { flex:1 1 0;min-height:0;overflow:auto;padding:0 3px; }
  #game-window[data-panel="pets"] .pet-hunger-label,
  #game-window[data-panel="pets"] .pet-mutation-label { font-size:11px;line-height:1.35;gap:3px; }
  #game-window[data-panel="pets"] .pet-buff p { font-size:12px;line-height:1.4; }
  #game-window[data-panel="pets"] .pet-detail-actions { display:flex;flex-direction:column;gap:4px;padding:0;flex:none; }
  #game-window[data-panel="pets"] .pet-detail-actions button { min-height:var(--pet-button-height);padding:5px 7px;font-size:13px; }
  #game-window[data-panel="pets"] .pet-detail-actions .pet-upgrade { flex-direction:row;align-items:center;justify-content:space-between;gap:3px;padding:4px 6px;font-size:12px; }
  #game-window[data-panel="pets"] .pet-upgrade strong { font-size:11px; }
  #game-window[data-panel="pets"] .pet-upgrade img { width:16px;height:16px; }
  #game-window[data-panel="pets"] .pet-workspace { min-height:0;gap:5px;padding:0;border:0; }
  #game-window[data-panel="pets"] .pet-tabs { grid-template-columns:repeat(3, minmax(0, 1fr));gap:4px; }
  #game-window[data-panel="pets"] .pet-tabs button { height:34px;min-height:34px;padding:3px;font-size:13px;gap:4px; }
  #game-window[data-panel="pets"] .pet-tabs .crop-icon { width:20px;height:20px; }
  #game-window[data-panel="pets"] .pet-section-heading { gap:3px;padding:0 2px 3px; }
  #game-window[data-panel="pets"] .pet-section-heading h3 { display:block;font-size:13px; }
  #game-window[data-panel="pets"] .pet-section-heading>span { font-size:10px; }
  #game-window[data-panel="pets"] .pet-food-list,
  #game-window[data-panel="pets"] .pet-effect-list { grid-template-columns:repeat(3, minmax(0, 1fr));flex:1 1 0;min-height:0;max-height:none;overflow:auto;gap:5px 3px;padding:3px; }
  #game-window[data-panel="pets"] .pet-food-art { width:44px;height:44px; }
  #game-window[data-panel="pets"] .pet-food strong,
  #game-window[data-panel="pets"] .pet-effect strong { font-size:11px; }
  #game-window[data-panel="pets"] .pet-feed-footer { flex:none;gap:5px;margin-top:3px;padding:3px 1px 0; }
  #game-window[data-panel="pets"] .pet-feed-footer label { font-size:12px; }
  #game-window[data-panel="pets"] .pet-feed-footer input { width:52px;height:36px;font-size:16px; }
  #game-window[data-panel="pets"] .pet-feed-footer .pet-primary { min-height:36px;height:36px;min-width:68px;padding:4px 10px;font-size:13px; }
  #game-window[data-panel="pets"] .pet-work-scroll { min-height:0;overflow:auto; }
}

@media (orientation:landscape) and (max-height:360px) {
  #game-window:is([data-panel="bag"],[data-panel="pets"]) .window-header h1 { font-size:21px; }
  #game-window:is([data-panel="bag"],[data-panel="pets"]) #panel-close { width:50px; }
  #game-window[data-panel="bag"] .inventory-art-layout.inventory-layout,
  #game-window[data-panel="bag"] .inventory-art-layout.inventory-layout:has(.potion-inventory-detail) { --bag-preview-size:52px;gap:8px;padding:8px 6px 6px 29px; }
  #game-window[data-panel="bag"] .inventory-art-layout::before { inset:8px 6px 6px 29px; }
  #game-window[data-panel="bag"] .inventory-categories { left:-42px;top:8px;bottom:8px;grid-template-columns:68px;gap:5px; }
  #game-window[data-panel="bag"] .inventory-categories .bag-tab[data-filter] { width:68px; }
  #game-window[data-panel="bag"] .inventory-categories .bag-tab[data-filter].active { width:75px;margin-left:-7px; }
  #game-window[data-panel="bag"] .inventory-categories .bag-tab .bag-tab-label { width:37px;margin-left:30px;font-size:12px; }
  #game-window[data-panel="bag"] .inventory-categories .bag-tab.active .bag-tab-label { width:42px;margin-left:31px; }
  #game-window[data-panel="bag"] .inventory-grid { grid-auto-rows:88px;padding:3px;gap:4px; }
  #game-window[data-panel="bag"] .item-art { width:52px;height:52px; }
  #game-window[data-panel="bag"] .inventory-item-name { font-size:12px; }
  #game-window[data-panel="bag"] .inventory-detail .detail-name { font-size:14px;padding:3px 6px; }
  #game-window[data-panel="bag"] .inventory-detail .quality-tag { font-size:10px; }
  #game-window[data-panel="bag"] .inventory-detail .detail-facts>div>:is(span,strong) { font-size:11px; }
  #game-window[data-panel="pets"] .pet-layout { --pet-preview-size:48px;--pet-roster-size:34px;--pet-button-height:32px;grid-template-rows:76px minmax(0, 1fr);padding:7px;gap:5px 9px; }
  #game-window[data-panel="pets"] .pet-layout::before { inset:7px; }
  #game-window[data-panel="pets"] .pet-roster-item strong { font-size:13px; }
  #game-window[data-panel="pets"] .pet-profile h2 { font-size:15px;padding:3px 8px; }
  #game-window[data-panel="pets"] .pet-profile { gap:2px; }
  #game-window[data-panel="pets"] .pet-detail { gap:4px;padding:0 3px; }
  #game-window[data-panel="pets"] .pet-detail-actions button { padding:3px 5px;font-size:12px; }
  #game-window[data-panel="pets"] .pet-detail-actions .pet-upgrade { font-size:11px;padding:3px 4px; }
  #game-window[data-panel="pets"] .pet-tabs button { min-height:30px;height:30px;font-size:12px;gap:2px; }
  #game-window[data-panel="pets"] .pet-tabs .crop-icon { width:17px;height:17px; }
  #game-window[data-panel="pets"] .pet-section-heading h3 { font-size:12px; }
  #game-window[data-panel="pets"] .pet-section-heading>span { font-size:9px; }
  #game-window[data-panel="pets"] .pet-food-art { width:34px;height:34px; }
  #game-window[data-panel="pets"] .pet-feed-footer input,
  #game-window[data-panel="pets"] .pet-feed-footer .pet-primary { min-height:32px;height:32px; }
}

/* Story keeps its reserved space; decorations yield before the action buttons do. */
@media (orientation:landscape) and (max-height:430px) {
  body[data-story-panel=true] #game-window:is([data-panel="bag"],[data-panel="pets"]) #panel-content { inset:18% 7% 2% 10%; }
  body[data-story-panel=true] #game-window[data-panel="pets"] #panel-content { left:8%;right:8%; }
  body[data-story-panel=true] #game-window[data-panel="bag"] .inventory-art-layout.inventory-layout,
  body[data-story-panel=true] #game-window[data-panel="bag"] .inventory-art-layout.inventory-layout:has(.potion-inventory-detail) { --bag-preview-size:32px;grid-template-areas:"items detail";grid-template-rows:minmax(0, 1fr);padding-top:5px;padding-bottom:5px; }
  body[data-story-panel=true] #game-window[data-panel="bag"] .inventory-categories { top:4px;bottom:4px;gap:3px; }
  body[data-story-panel=true] #game-window[data-panel="bag"] .inventory-detail { gap:2px;padding-top:0;padding-bottom:0; }
  body[data-story-panel=true] #game-window[data-panel="bag"] .inventory-detail .detail-name { font-size:13px;padding:2px 6px; }
  body[data-story-panel=true] #game-window[data-panel="bag"] .inventory-detail .quality-tag { font-size:10px;padding:1px 4px; }
  body[data-story-panel=true] #game-window[data-panel="bag"] .inventory-detail .detail-actions button { min-height:32px;padding:4px;font-size:12px; }
  body[data-story-panel=true] #game-window[data-panel="pets"] .pet-layout { --pet-preview-size:30px;--pet-roster-size:24px;--pet-button-height:30px;grid-template-columns:minmax(0, 1.7fr) minmax(0, 1fr);grid-template-rows:42px minmax(0, 1fr);grid-template-areas:"roster detail" "workspace detail";padding:5px 7px;gap:4px 9px; }
  body[data-story-panel=true] #game-window[data-panel="pets"] .pet-layout::before { inset:5px 7px; }
  body[data-story-panel=true] #game-window[data-panel="pets"] .pet-roster { grid-template-columns:repeat(3, minmax(0, 1fr));grid-template-rows:minmax(0, 1fr); }
  body[data-story-panel=true] #game-window[data-panel="pets"] .pet-roster-item { display:flex;gap:1px; }
  body[data-story-panel=true] #game-window[data-panel="pets"] .pet-roster-item strong { font-size:12px; }
  body[data-story-panel=true] #game-window[data-panel="pets"] .pet-roster-item small,
  body[data-story-panel=true] #game-window[data-panel="pets"] .pet-roster-status { display:none; }
  body[data-story-panel=true] #game-window[data-panel="pets"] .pet-profile { gap:2px; }
  body[data-story-panel=true] #game-window[data-panel="pets"] .pet-profile h2 { font-size:14px;padding:2px 7px; }
  body[data-story-panel=true] #game-window[data-panel="pets"] .pet-form { display:none; }
  body[data-story-panel=true] #game-window[data-panel="pets"] .pet-detail { gap:3px;padding-bottom:0; }
  body[data-story-panel=true] #game-window[data-panel="pets"] .pet-detail-actions button { min-height:30px;font-size:12px;padding:3px 5px; }
  body[data-story-panel=true] #game-window[data-panel="pets"] .pet-detail-actions .pet-upgrade { padding:2px 4px;font-size:11px; }
  body[data-story-panel=true] #game-window[data-panel="pets"] .pet-workspace { gap:3px; }
  body[data-story-panel=true] #game-window[data-panel="pets"] .pet-tabs button { min-height:28px;height:28px;padding:2px;font-size:12px; }
  body[data-story-panel=true] #game-window[data-panel="pets"] .pet-section-heading { display:none; }
  body[data-story-panel=true] #game-window[data-panel="pets"] .pet-feed-footer { margin-top:2px;padding-top:2px; }
  body[data-story-panel=true] #game-window[data-panel="pets"] .pet-feed-footer input,
  body[data-story-panel=true] #game-window[data-panel="pets"] .pet-feed-footer .pet-primary { min-height:30px;height:30px; }
}