/* Classic's phone HUD keeps the field clear and touch targets within reach. */
.compact-label{display:none}
@media(max-width:700px),(pointer:coarse) and (max-height:600px){
  html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
  #game{min-height:0}
  body.playing .topbar{padding:0;top:calc(8px + env(safe-area-inset-top));left:max(10px,env(safe-area-inset-left));right:max(10px,env(safe-area-inset-right));gap:8px;height:44px}
  body.playing .brand{min-width:0;font-size:14px;gap:7px;min-height:44px}
  body.playing .brand-mark{width:36px;height:36px;flex-shrink:0;font-size:20px}
  body.playing .brand-logo{width:36px;height:36px}
  body.playing .brand #brand-title{max-width:calc(100vw - 162px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;overflow-wrap:normal}
  body.playing .edition{display:none}
  body.playing .top-actions{gap:6px;flex-shrink:0}
  body.playing .icon-button{width:44px;height:44px;border-radius:12px}
  .hud .full-label{display:none}.hud .compact-label{display:inline}
  .hud .stats{top:calc(60px + env(safe-area-inset-top));left:max(10px,env(safe-area-inset-left));width:calc(54% - 13px - env(safe-area-inset-left));display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:6px;align-items:stretch}
  .hud .score-panel,.hud .timer-panel{min-width:0;width:auto;padding:7px 8px;border-radius:12px;box-shadow:0 2px 0 #174c3625}
  .hud .stat-label{font:12px/1.25 Arial,sans-serif;font-weight:700;letter-spacing:0;max-width:none;white-space:nowrap}
  .hud .score-panel>strong,.hud .timer-panel>strong{font-size:20px;line-height:1.25;letter-spacing:-.5px;margin:4px 0 0;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
  .hud .combo{display:none}
  .hud .combo.active{display:block;position:absolute;top:calc(100% + 7px);left:0;max-width:calc(100vw - 180px);width:max-content;font-size:12px;line-height:1.3;padding:5px 8px;border-radius:8px;color:#794018;background:#fff0b4;pointer-events:none}
  .hud .objectives{top:calc(60px + env(safe-area-inset-top));right:max(10px,env(safe-area-inset-right));width:calc(46% - 13px - env(safe-area-inset-right))}
  .hud .egg-objective{display:grid;grid-template-columns:minmax(0,1.2fr) 1px minmax(0,.8fr);gap:6px;padding:7px 8px;border-radius:12px;box-shadow:0 2px 0 #174c3625;align-items:center}
  .hud .egg-icon{display:none}
  .hud .egg-objective strong{font-size:20px;line-height:1.25;letter-spacing:-.5px;white-space:nowrap}
  .hud .egg-objective div>span{font:12px/1.25 Arial,sans-serif;font-weight:700;max-width:none;letter-spacing:0;margin-top:4px;white-space:nowrap}
  .hud .objective-divider{height:29px}
  .hud .nuisance{position:absolute;top:calc(100% + 7px);right:0;width:148px;margin:0;padding:6px 8px;border-radius:9px}
  .hud .nuisance>span{font:12px/1.25 Arial,sans-serif;font-weight:700;letter-spacing:0;margin-bottom:4px}
  .hud .nuisance-track{height:4px}
  .hud .minimap-panel{top:calc(171px + env(safe-area-inset-top));right:max(10px,env(safe-area-inset-right));bottom:auto;width:78px;border-width:3px;border-radius:11px;box-shadow:0 2px 0 #174c3625}
  .hud .minimap-panel canvas{width:72px;height:72px;border-radius:8px}
  .hud .minimap-panel>span{display:none}
  .hud .nest-direction{top:calc(256px + env(safe-area-inset-top));right:max(10px,env(safe-area-inset-right));left:auto;bottom:auto;gap:6px;max-width:110px}
  .hud .nest-direction>span{width:28px;height:28px;font-size:18px;box-shadow:0 0 0 2px #ffda4230}
  .hud .nest-direction div{display:block}.hud .nest-direction strong{font-size:12px;letter-spacing:0}.hud .nest-direction div>span{display:none}
  .hud .quack-panel{bottom:calc(122px + env(safe-area-inset-bottom));width:min(260px,calc(100vw - 32px));padding:9px 12px;border-radius:12px;box-shadow:0 2px 0 #174c3625}
  .hud .quack-heading{gap:8px;font:12px/1.25 Arial,sans-serif;font-weight:700;letter-spacing:0}
  .hud .quack-heading>span{min-width:0}.hud .quack-heading strong{font-size:14px;white-space:nowrap;flex-shrink:0}
  .hud .energy-track{height:8px;margin:6px 0}
  .hud .quack-caption{font:12px/1.3 Arial,sans-serif;gap:0}.hud .quack-caption>span:last-child{display:none}
  .hud .play-help{display:none}
  .hud .joystick{left:max(12px,env(safe-area-inset-left));bottom:calc(24px + env(safe-area-inset-bottom));width:88px;height:88px}
  .hud .joystick i{width:34px;height:34px}
  .hud .touch-actions{right:max(12px,env(safe-area-inset-right));bottom:calc(24px + env(safe-area-inset-bottom));gap:10px}
  .hud .touch-actions button{min-width:54px;width:54px;height:54px;font-size:14px;padding:4px}
  .hud .touch-actions #quack-touch{width:72px;height:72px;font-size:14px;border-width:2px}
  body.playing .toast{top:32%;max-width:calc(100vw - 40px);width:max-content;padding:8px 12px;font-size:14px;line-height:1.35;border-width:2px;border-radius:11px;box-shadow:2px 2px 0 var(--ink);transform:translate(-50%,-8px)}
  body.playing .toast.show{transform:translate(-50%,0)}
  body.playing .modal-wrap{padding:12px}
  body.playing .modal-card{max-height:calc(100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom));overflow:auto;overscroll-behavior:contain;padding:22px 20px;border-radius:20px}
  body.playing .modal-card h2{font-size:28px;margin:12px 0}
  body.playing .modal-card button{min-height:44px}
}
@media(max-width:360px){
  .hud .score-panel>strong,.hud .timer-panel>strong,.hud .egg-objective strong{font-size:18px}
  .hud .score-panel,.hud .timer-panel,.hud .egg-objective{padding:7px 6px}
  .hud .combo.active{max-width:130px}
}
/* In landscape, status occupies the top and the thumbs stay in the corners. */
@media(max-height:500px) and (max-width:700px) and (orientation:landscape),(max-height:500px) and (pointer:coarse) and (orientation:landscape){
  body.playing .brand #brand-title{display:none}
  .hud .stats{top:calc(8px + env(safe-area-inset-top));left:calc(56px + env(safe-area-inset-left));width:calc((100% - 170px - env(safe-area-inset-left) - env(safe-area-inset-right)) * .5)}
  .hud .objectives{top:calc(8px + env(safe-area-inset-top));right:calc(110px + env(safe-area-inset-right));width:calc((100% - 170px - env(safe-area-inset-left) - env(safe-area-inset-right)) * .5 - 6px)}
  .hud .nuisance{width:148px}
  .hud .minimap-panel{display:block;top:calc(65px + env(safe-area-inset-top));width:62px}
  .hud .minimap-panel canvas{width:56px;height:56px}
  .hud .nest-direction{display:flex;top:calc(133px + env(safe-area-inset-top))}
  .hud .quack-panel{bottom:calc(20px + env(safe-area-inset-bottom));width:min(250px,calc(100vw - 280px))}
  .hud .quack-caption{display:none}
  .hud .joystick{width:80px;height:80px;bottom:calc(20px + env(safe-area-inset-bottom))}
  .hud .touch-actions{bottom:calc(20px + env(safe-area-inset-bottom))}
  .hud .touch-actions #quack-touch{width:66px;height:66px}
  body.playing .toast{top:35%;max-width:60vw}
}