/* Landscape keeps the desktop HUD's four edge groups. These final rules share
   one safe viewport; the centre is reserved for the garden and selected crop. */
@media (orientation:landscape) and (max-height:700px), (orientation:landscape) and (max-width:1050px) {
 :root {
  --landscape-hud-width:clamp(144px,22vw,192px);
  --hud-stick-size:78px;
  --hud-stick-bottom:12px;
  --hud-record-top:136px;
  --catalysis-panel-width:clamp(224px,31vw,340px);
 }
 body .hud-resources {left:calc(var(--ui-viewport-left) + var(--ui-safe-left) + 8px);top:calc(var(--ui-viewport-top) + var(--ui-safe-top) + 8px);width:auto;height:auto;padding:0;background:none}
 body .hud-resources .coin-pill {width:var(--landscape-hud-width);height:38px;min-height:38px;padding:3px 9px 3px 4px;gap:7px}
 body .hud-resources .coin-pill .hud-icon {width:32px;height:32px}
 body .hud-resources .coin-pill strong {font-size:17px;line-height:1.1;white-space:nowrap;font-variant-numeric:tabular-nums}
 body .hud-system {top:calc(var(--ui-viewport-top) + var(--ui-safe-top) + 8px);right:calc(var(--ui-safe-right) + 8px);grid-template-columns:repeat(3,40px);gap:4px;width:auto}
 body .hud-system .square-button {width:40px;height:40px;min-width:40px;min-height:40px;padding:3px}

 body #main-quest {left:calc(var(--ui-viewport-left) + var(--ui-safe-left) + 8px);top:calc(var(--ui-viewport-top) + var(--ui-safe-top) + 54px);width:var(--landscape-hud-width);max-width:none;height:74px;min-height:0;padding:6px 8px;gap:3px;translate:none;transform:none;overflow:hidden;grid-template-rows:auto minmax(0,1fr) auto}
 body #main-quest .main-quest-emblem,body #main-quest .main-quest-emblem>.crop-icon {width:18px;height:18px}
 body #main-quest .main-quest-title>strong {font-size:11px;line-height:1.2}
 body #main-quest .main-quest-description {font-size:10px;line-height:1.25;-webkit-line-clamp:2}
 body #main-quest .main-quest-rewards,body #main-quest .main-quest-claim {font-size:10px}
 body #main-quest .main-quest-claim {padding:3px 6px;line-height:1.2}
 body #main-quest .main-quest-rewards .crop-icon {width:14px;height:14px}
 body #main-quest {grid-template-rows:18px minmax(12px,1fr) 22px;padding:4px 8px;gap:2px}
 body #main-quest .main-quest-description {display:block;min-height:0;max-height:12px;align-self:center;line-height:12px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}
 body #main-quest .main-quest-footer {height:22px;min-height:0;overflow:hidden}
 body #main-quest .main-quest-claim {max-width:72px;height:22px;min-height:22px;padding:1px 3px;font-size:9px;line-height:10px;white-space:normal;overflow:hidden}
 body #garden-record {
  left:calc(var(--ui-viewport-left) + var(--ui-safe-left) + 8px);top:calc(var(--ui-viewport-top) + var(--ui-safe-top) + var(--hud-record-top));
  width:var(--landscape-hud-width);min-width:0;min-height:0;height:auto;
  max-height:max(0px,calc(var(--ui-viewport-height) - var(--ui-safe-top) - var(--ui-safe-bottom) - var(--hud-record-top) - var(--hud-stick-size) - var(--hud-stick-bottom) - 12px));
  padding:27px 6px 6px;border-radius:12px;background:#fff8dcdb;overflow-x:hidden;overflow-y:auto;touch-action:pan-y;overscroll-behavior:contain;
 }
 body #garden-record.quest-board .quest-header {width:100%;height:23px;font-size:13px;line-height:1.3;letter-spacing:0}
 body #garden-record :is(.quest-item,.quest-reward) {height:24px;min-height:24px;margin-bottom:4px;padding:2px 6px;gap:5px}
 body #garden-record .record-label {font-size:10px;line-height:1.2;white-space:normal}
 body #garden-record :is(.quest-item,.quest-reward) strong {font-size:12px;white-space:nowrap}
 body #garden-record .record-best {padding:4px 6px;gap:2px}
 body #garden-record #record-best {font-size:10px;line-height:1.3}

 body .quickbar {left:calc(var(--ui-viewport-left) + var(--ui-safe-left) + 108px);right:calc(var(--ui-safe-right) + 120px);bottom:calc(var(--ui-safe-bottom) + 3px);width:auto;max-width:none;min-width:0;transform:none;translate:none;justify-items:center;gap:3px}
 body #seed-dock {--h:.65px;width:max-content;max-width:100%;min-width:0;padding:4px 7px;gap:5px;overflow-x:auto;overflow-y:hidden;touch-action:pan-x;overscroll-behavior:contain}
 html body .quickbar #seed-dock .seed-slot {flex:0 0 clamp(40px,5.2vw,52px);width:clamp(40px,5.2vw,52px);height:70px;min-height:70px;gap:2px;padding:0}
 html body .quickbar #seed-dock .slot-art {width:clamp(40px,5.2vw,52px);height:40px;min-height:40px;flex:none}
 html body .quickbar #seed-dock .seed-name {width:100%;max-width:100%;height:26px;min-height:26px;max-height:26px;font-size:10px;line-height:13px;-webkit-line-clamp:2;overflow-wrap:break-word}
 body #garden-hint {max-width:100%;font-size:10px;line-height:1.3;padding:3px 8px;white-space:normal;text-align:center}
 body #joystick {left:calc(var(--ui-viewport-left) + var(--ui-safe-left) + 16px);bottom:calc(var(--ui-safe-bottom) + var(--hud-stick-bottom));top:auto;width:var(--hud-stick-size);height:var(--hud-stick-size);transform:none}
 body #joystick-knob {width:34px;height:34px}
 body #tabs.game-actions {top:auto;bottom:calc(var(--ui-safe-bottom) + 8px);right:calc(var(--ui-safe-right) + 8px);flex-direction:row;gap:6px;transform:none}
 body #interact-button {left:auto;right:calc(var(--ui-safe-right) + 10px);top:auto;bottom:calc(var(--ui-safe-bottom) + 72px);width:108px;height:44px;min-height:44px;transform:none;translate:none;font-size:13px}

 /* Keep the same right-hand catalyst panel and vertical potion column as PC.
    JS still positions the card group from the measured panel and safe bounds. */
 body.catalysis-mode #catalysis-panel {width:var(--catalysis-panel-width);padding:9px;gap:5px}
 body #catalysis-panel h2 {font-size:16px;line-height:1.25}
 body #catalysis-panel .catalysis-content {font-size:12px;line-height:1.4;min-width:0;min-height:0;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain}
 body #catalysis-panel .catalysis-content :is(p,small,strong) {overflow-wrap:break-word}
 body #catalysis-potions {gap:4px;overflow-x:hidden;overflow-y:auto}
 body #catalysis-potions button {width:60px;height:52px;min-height:52px;padding:3px;gap:1px;flex:none}
 body #catalysis-potions .potion-slot-art {width:30px;height:30px;min-height:30px;flex:none}
 body #catalysis-scene-cards {width:min(320px,40vw);gap:5px}
 body #catalysis-scene-cards .catalysis-stat-card,
 body #catalysis-scene-cards .catalysis-stat-card[data-card=value] {height:64px;min-height:64px;padding:5px 4px;gap:2px;border-radius:12px}
 body #catalysis-scene-cards strong {font-size:19px;line-height:1.15;white-space:nowrap;overflow-wrap:normal}
 body #catalysis-scene-cards .catalysis-stat-card {grid-template-rows:minmax(0,1fr) 22px 15px;overflow:hidden}
 body #catalysis-scene-cards .stat-heading {font-size:9px;line-height:1.2;min-height:0;overflow:hidden}
 body #catalysis-scene-cards .yield-range {height:15px;line-height:15px;font-size:9px}
 body #catalysis-scene-cards small {font-size:9px;line-height:1.2}
 body #story-guide[data-catalysis=true] {max-height:max(0px,min(110px,calc(var(--catalysis-guide-floor,50dvh) - var(--guide-top))));padding:8px 13px;gap:3px 7px}
 body #story-guide[data-catalysis=true]::before {border-image:url('../assets/ui/quest-board.png') 52 72 32 72 fill / 16px 22px 12px stretch}
 body #story-guide[data-catalysis=true] .story-guide-copy {min-width:0;min-height:0;overflow:auto;touch-action:pan-y}
 body #story-guide[data-catalysis=true] h2 {font-size:12px;line-height:1.25}
 body #story-guide[data-catalysis=true] p {font-size:10px;line-height:1.4}
 body #story-guide[data-catalysis=true] small {font-size:10px;line-height:1.4;margin-top:3px}
}

@media (orientation:landscape) and (max-height:340px) {
 :root {--hud-record-top:136px;--hud-stick-size:70px}
 body #main-quest {height:74px;gap:2px}
 body #garden-record {padding-top:23px}
 body #garden-record.quest-board .quest-header {height:20px;font-size:12px}
 html body .quickbar #seed-dock .seed-slot {height:62px;min-height:62px}
 html body .quickbar #seed-dock .slot-art {height:34px;min-height:34px}
 body #catalysis-scene-cards .catalysis-stat-card,
 body #catalysis-scene-cards .catalysis-stat-card[data-card=value] {height:58px;min-height:58px}
 body #catalysis-scene-cards .catalysis-stat-card {grid-template-rows:minmax(0,1fr) 20px 12px;padding:3px 4px;gap:1px}
 body #catalysis-scene-cards .yield-range {height:12px;line-height:12px}
 body #story-guide[data-catalysis=true] {max-height:max(0px,min(94px,calc(var(--catalysis-guide-floor,50dvh) - var(--guide-top))))}
}
