/* iPhone 15 Pro baseline: 393 x 852 CSS px. Keep the shell fixed between pages. */
@media (max-width:700px) and (orientation:portrait){
  body{min-height:100svh;overflow-x:hidden}
  .desk{width:calc(100% - 12px);min-height:100svh;padding:calc(20px + env(safe-area-inset-top,0px)) 0 calc(18px + env(safe-area-inset-bottom,0px))}
  .desk-header{margin-bottom:20px;padding-inline:10px;min-height:27px}
  .console-area{padding-top:8px}
  .console{height:clamp(450px,calc(100svh - 180px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px)),650px);grid-template-columns:9% 82% 9%}
  .console-body{padding:17px 7px 23px}
  .game-page{padding:16px 10px 12px;min-width:0}
  .desk-footer{margin-top:20px;gap:10px;padding-inline:4px}
  .desk-footer p{font-size:10px;gap:4px;white-space:normal;flex-wrap:wrap;justify-content:center}
  .desk-footer>span:first-child{font-size:4px}
  .orientation-note{display:none}
  .capture,.home-button{width:70%;left:15%;right:auto;min-height:27px;bottom:15%}
  .capture{font-size:16px}.home-button svg{width:65%;height:65%}
  .unlock-page{grid-template-rows:auto minmax(100px,1fr) auto auto;gap:14px}
  #birthday-title{font-size:3.6cqw;white-space:normal;line-height:1.8;letter-spacing:-.35px;margin-top:13px}
  .portrait-row{gap:18px}.portrait-frame{width:36cqw;max-width:145px}
  .portrait-frame figcaption{font-size:4.5px}
  .unlock-form{width:calc(100% - 4px);padding:16px 10px 10px}
  .unlock-form label{font-size:19px;white-space:normal;margin-bottom:12px}
  .answer-row input,.wish-panel input{font-size:16px;min-height:44px}
  .answer-row .pixel-button{height:44px;font-size:17px}
  .answer-status{font-size:12px;line-height:1.5;min-height:42px;padding-top:8px}
  .screen-navigation{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:5px;align-items:center}
  .screen-navigation .pixel-button,.cards-page .screen-navigation .pixel-button,.mini-page .screen-navigation .pixel-button{font-size:11px;line-height:1.35;padding:7px 4px;min-height:40px;white-space:normal;gap:2px}
  .page-dots,.cards-page .page-dots,.mini-page .page-dots{gap:3px}.page-dots i{width:3px;height:3px}
  .cards-page{grid-template-rows:auto minmax(200px,1fr) auto auto;gap:12px;padding:16px 9px 12px}
  .cards-page .game-header h2{font-size:20px;max-width:200px;line-height:1.3}
  .cards-page .chapter-label{max-width:200px;font-size:4.5px}
  .cards-page .count-badge{font-size:7px;padding:6px 4px}
  .wish-atlas{padding:10px 6px 8px}
  .map-viewport{display:flex;align-items:center;touch-action:pan-x pan-y;-webkit-overflow-scrolling:touch}
  .map-canvas{margin:auto 0;min-width:540px}
  .map-hint{font-size:11px;line-height:1.5;padding-top:8px}
  .map-draw-bar>.pixel-button{min-height:44px;font-size:16px}
  .card-overlay{padding:18px 11px;gap:16px}
  .reveal-card{width:calc(100% - 22px);height:min(69cqh,420px);max-height:none;min-height:0;padding:26px 12px 14px}
  .reveal-card.has-copy .reveal-illustration{height:43%;flex-shrink:0}
  .reveal-copy{font-size:16px;line-height:1.65;margin-top:12px}
  .reveal-copy h3{font-size:21px}
  .reveal-actions{gap:8px}.reveal-actions .pixel-button{min-height:44px;font-size:14px;padding:8px 7px;white-space:normal}
  .summon-panel{gap:18px;padding:20px 8px}.summon-image{width:min(67cqw,34cqh);height:min(67cqw,34cqh)}
  #completion-title{font-size:clamp(16px,6.2cqw,20px)}.summon-panel .pixel-button{min-height:44px}
  .letter-page{gap:16px;grid-template-rows:auto minmax(0,1fr) auto}
  .letter-header #letter-heading{font-size:10px;line-height:1.7;letter-spacing:-.45px}
  .letter-paper{padding:18px 14px}.letter-text{font-size:16px;line-height:1.8}
  .finale-page{padding:22px 11px 12px;gap:15px}.finale-title{font-size:9.1cqw}
  .finale-navigation{grid-template-columns:minmax(0,1fr) auto 20px}.finale-heart{justify-self:end}
  .mini-page{padding:16px 10px 12px;gap:12px}
  .mini-heading h2{font-size:21px;max-width:210px}.mini-heading .chapter-label{font-size:4.5px;max-width:200px}
  .gift-hud>span{font-size:12px;padding:5px}.gift-player{width:42px}
  .gift-intro,.gift-result{width:94%;padding:16px 10px;gap:12px}
  .gift-intro h3,.gift-result h3{font-size:20px;white-space:normal}
  .gift-intro p,.gift-result>p:last-child{font-size:14px;line-height:1.5}
  .gift-intro .pixel-button{min-height:44px;font-size:16px}
  .gift-touch-controls{gap:5px;justify-content:space-between}
  .gift-touch-controls .pixel-button{width:40px;min-width:0;min-height:44px;font-size:14px;padding:5px 3px}
  .gift-touch-controls #gift-pause{width:58px;font-size:12px}
  .wish-page{grid-template-columns:1fr;grid-template-rows:auto minmax(120px,1fr) auto auto;gap:10px}
  .wish-heading h2{font-size:21px;max-width:none}.wish-heading .chapter-label{max-width:none}
  .birthday-cake{max-height:230px;width:95%}.cake-scene{padding-bottom:0}
  .wish-panel{padding:11px 10px;gap:7px}.wish-panel label{font-size:16px}
  .wish-panel input{padding:8px}.wish-panel .pixel-button{min-height:44px;font-size:16px}
  .wish-panel #wish-status{font-size:12px;line-height:1.4}
}
/* Short Safari viewports (browser chrome visible) keep controls inside the screen. */
@media (max-width:700px) and (orientation:portrait) and (max-height:740px){
  .desk{padding-top:calc(12px + env(safe-area-inset-top,0px));padding-bottom:calc(12px + env(safe-area-inset-bottom,0px))}
  .desk-header{margin-bottom:12px}.desk-footer{margin-top:14px;gap:8px}
  .console{height:clamp(450px,calc(100svh - 155px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px)),650px)}
  .unlock-page{gap:9px;grid-template-rows:auto minmax(80px,1fr) auto auto}
  #birthday-title{margin-top:8px}.pixel-divider{margin-top:7px}
  .portrait-frame{width:31cqw}.unlock-form{padding:10px 9px 7px}.unlock-form label{font-size:18px;margin-bottom:8px}
  .answer-status{font-size:11px;min-height:35px;padding-top:6px}
  .cards-page{gap:9px;grid-template-rows:auto minmax(175px,1fr) auto auto}
  .mini-page{gap:9px}.wish-page{grid-template-rows:auto minmax(90px,1fr) auto auto}
  .wish-panel{padding:8px;gap:5px}.birthday-cake{max-height:155px}
  .wish-panel #wish-status{font-size:11px}.gift-intro,.gift-result{padding:10px 8px;gap:8px}
}
@media (max-height:600px) and (orientation:landscape){
  .desk{padding-left:env(safe-area-inset-left,0px);padding-right:env(safe-area-inset-right,0px)}
  .answer-row input,.wish-panel input{font-size:16px}
}