/* Mobile layouts live after the desktop theme so breakpoints cannot inherit
   desktop pixel/vh geometry, clipped icon backgrounds, or fixed popup heights. */
.save-controls{padding:0 24px 18px;text-align:center}
.save-controls p{margin:4px 0 10px;color:#bdd6ee;font:400 12px/1.5 'Poppins',sans-serif}
.save-controls>div{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}
.save-controls button{min-height:36px;padding:6px 12px;border:1px solid #72a8d044;border-radius:9px;background:#10385d;color:#ddecfa;font:500 12px 'Poppins',sans-serif;cursor:pointer}
.save-controls [hidden]{display:none}
.mobile-menu-toggle{display:none}
#mobile-menu:not([open]){display:none}
#mobile-menu{box-sizing:border-box;width:min(380px,calc(100% - 24px - var(--safe-left) - var(--safe-right)));max-height:calc(100dvh - 24px - var(--safe-top) - var(--safe-bottom));margin:auto;padding:20px;border:1px solid #5585b4;border-radius:24px;background:#174571;color:#f7faff;font-family:'Poppins',sans-serif;box-shadow:0 20px 60px #031b3866;overflow:auto;overscroll-behavior:contain}
.mobile-menu-header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.mobile-menu-header h2{font:600 24px/1.2 'Poppins';margin:0;letter-spacing:-.5px}
.mobile-menu-header-actions{display:flex;align-items:center;gap:8px}
#mobile-fullscreen[hidden]{display:none}
#mobile-menu-close,#mobile-fullscreen{width:44px;height:44px;min-width:44px;display:grid;place-items:center;padding:0;border:1px solid #5f8db544;border-radius:13px;background:#10365b;color:white;box-shadow:none}
#mobile-menu-close .material-symbols-rounded{font-size:26px}
#mobile-menu-account{padding-bottom:18px;margin-bottom:10px;border-bottom:1px solid #99bee52b}
#mobile-menu .home-account{position:relative;inset:auto;display:grid;grid-template-columns:44px minmax(0,1fr) auto;align-items:center;gap:10px;width:100%;height:64px;padding:0;background:none;border:0;border-radius:0;pointer-events:auto}
#mobile-menu .home-account[hidden]{display:none}
#mobile-menu .home-avatar{width:44px;height:44px;border-radius:12px}
#mobile-menu .home-account-copy{grid-column:2;gap:4px}
#mobile-menu .home-account-copy strong{font:600 16px/1.2 'Poppins';letter-spacing:-.3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#mobile-menu .home-account-copy small{font:500 11px/1.2 'Poppins'}
#mobile-menu .home-connect{width:100px;height:44px;padding:0 8px;gap:5px;font:600 13px/1 'Poppins'}
#mobile-menu .home-account-exit{width:44px;height:44px}
.mobile-menu-actions{display:flex;flex-direction:column;gap:6px}
.mobile-menu-actions>button{display:flex;align-items:center;gap:12px;width:100%;min-height:48px;padding:10px 12px;border:1px solid #82acd51a;border-radius:12px;background:#10365b66;color:#f4f8fd;box-shadow:none;font:500 15px/1.3 'Poppins';text-align:left;clip-path:none;transform:none}
.mobile-menu-actions>button:hover{background:#ffffff0a}
.mobile-menu-actions .material-symbols-rounded{font-size:25px;font-variation-settings:'FILL' 1,'wght' 500;flex:none;color:#bddaf2}
.mobile-menu-actions .menu-chevron{margin-left:auto;font-size:22px;color:#95bada}
.mobile-menu-status{margin-left:auto;min-width:46px;padding:6px 10px;border-radius:9px;background:#2e6796;color:white;font-size:12px;text-align:center}
#mobile-menu-sound[aria-pressed=false] .mobile-menu-status{background:#0f3456;color:#9ab6d0}
body.at-home .mobile-menu-game-action{display:none}
.mobile-menu-session{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:14px;padding-top:14px;border-top:1px solid #99bee52b}
.mobile-menu-session>button{font-size:13px;gap:8px;padding:10px 8px;justify-content:center}
body.at-home .mobile-menu-session{display:none}
#mobile-menu button:focus-visible,.mobile-menu-toggle:focus-visible{outline:2px solid #d7ebff;outline-offset:3px}
@media (min-width:1101px) and (min-height:601px){
  .home-level-card-content{right:20vh}
}
#result .balanced-close{width:44px;height:44px}
@media (max-width:1100px), (max-height:600px){
  button{touch-action:manipulation;user-select:none;-webkit-user-select:none}
  #kick-button{touch-action:none}
  #home-screen{font-family:'Poppins',sans-serif}
  .home-level-rail{min-width:0;clip-path:none;border-radius:20px}
  .home-account{position:relative;inset:auto;display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:10px;height:56px;transform:none;z-index:2}
  .home-account[hidden]{display:none}
  .home-account>*{transform:none}
  .home-avatar{width:44px;height:44px;border-radius:12px;flex:none}
  .home-account-guest .home-avatar>img{width:32px;height:32px;object-fit:contain}
  .home-account-player .home-avatar>img{width:100%;height:100%;object-fit:cover}
  .home-account-copy,.home-account-player .home-account-copy{width:auto;max-width:none;height:auto;gap:3px;justify-content:center;min-width:0}
  .home-account-copy strong{height:auto;font:600 17px/1.25 'Poppins';letter-spacing:-.4px}
  .home-account-copy small{height:auto;font:500 12px/1.4 'Poppins';letter-spacing:0;color:#bfd5ee}
  .home-connect{width:108px;height:44px;padding:0 10px;gap:6px;border-radius:12px;font:600 14px/1 'Poppins'}
  .home-connect>img{width:22px;height:22px}
  .home-account-exit{width:44px;height:44px;border-radius:12px}
  .home-account-exit>img{width:25px;height:25px}
  .home-account-player .home-account-exit{grid-column:3}
  .home-level-list{scrollbar-width:none;overscroll-behavior:contain;pointer-events:auto}
  .home-level-card{min-width:0;padding:0;border:2px solid #6d9dd0;border-radius:18px;background:#194f88;box-shadow:none;contain:paint}
  .home-level-card:hover:not(:disabled),.home-level-card[aria-current=true]{transform:none;box-shadow:none;filter:none}
  .home-level-image{inset:0;width:100%;height:100%;object-fit:cover;clip-path:none;z-index:0}
  .home-level-card::before,.home-card-star::before{content:none;display:none}
  .home-level-card::after{content:'';position:absolute;inset:0;border-radius:inherit;z-index:1;pointer-events:none;background:linear-gradient(180deg,transparent 35%,#1b5392bf 65%,#15467f 100%)}
  .home-level-card.is-locked .home-level-image{opacity:1;filter:none}
  .home-level-card.is-locked::after{background:linear-gradient(180deg,#123c7770,#184b8de8 80%)}
  .home-level-card-content{left:12px;right:96px;bottom:12px;width:auto;height:auto;gap:3px;z-index:2;text-shadow:none;justify-content:center}
  .home-level-card-number{height:auto;font:700 18px/1.15 'Poppins';letter-spacing:-.5px}
  .home-level-card-name{height:auto;font:500 12px/1.3 'Poppins';letter-spacing:-.2px}
  .home-level-card-stars{right:10px;bottom:14px;width:auto;height:30px;padding:0;gap:2px;z-index:2}
  .home-level-card-stars .home-card-star,.home-level-card-stars .home-card-star.earned{flex:0 0 26px;width:26px;height:26px;object-fit:contain;background:none;clip-path:none;filter:none;opacity:1}
  .home-card-lock{right:14px;bottom:16px;width:24px;height:24px;z-index:2;object-fit:contain}
  .home-utilities{display:flex;gap:8px;height:44px}
  .home-utility,.home-utilities #home-levels.home-utility{display:grid;place-items:center;flex:0 0 44px;width:44px;height:44px;padding:0;border:1.5px solid #5285bb;border-radius:13px;background:#164575;box-shadow:0 3px 10px #08284733;clip-path:none}
  #home-sound>img.sound-on,#home-help>img,#home-levels>img{width:24px;height:24px;object-fit:contain}
  #home-sound .sound-off{font-size:24px;line-height:1}
  .home-actions{min-width:0;max-width:none;height:60px}
  #home-play{width:100%;height:60px;min-height:0;padding:0 20px;gap:10px;border:3px solid #ffc03b;border-radius:18px;background:linear-gradient(#ffad2b,#ff8f1d 78%,#ed6812);font:700 25px/1 'Poppins';letter-spacing:-.5px;box-shadow:0 6px 18px #08284740}
  #home-play>img{width:30px;height:30px;flex:none;margin:0;object-fit:contain}
  body:not(.at-home) .campaign-hud{top:calc(10px + var(--safe-top));left:calc(10px + var(--safe-left));height:44px;gap:6px}
  body:not(.at-home) .hud-blue-control{height:44px;border:1.5px solid #5285bb;border-radius:13px}
  body:not(.at-home) .game-home-button{flex:0 0 44px;width:44px;height:44px}
  body:not(.at-home) .level-button{width:72px;height:44px;padding:0;font:600 16px/1 'Poppins';letter-spacing:-.5px}
  body:not(.at-home) .hud-stage-pill{width:44px;padding:0;font:600 16px/1 'Poppins'}
  body:not(.at-home) .bottom-hud{top:calc(10px + var(--safe-top));right:calc(10px + var(--safe-right));height:44px}
  body:not(.at-home) .utility-controls{height:44px;gap:6px}
  body:not(.at-home) .text-button,body:not(.at-home) .round-button,body:not(.at-home) .reset-button{flex:0 0 44px;width:44px;height:44px;padding:0}
  body:not(.at-home) .game-home-button>img,body:not(.at-home) .utility-controls button>img{width:24px;height:24px}
  body:not(.at-home) #sound-button .sound-off{font-size:24px}
  body:not(.at-home) .shot-progress{top:calc(66px + var(--safe-top));left:50%;right:auto;height:38px;padding:0 10px;transform:translateX(-50%)}
  body:not(.at-home) #shot-stars{gap:3px}
  body:not(.at-home) #shot-stars .rating-star{width:25px;height:25px}
  body:not(.at-home) .controls{bottom:calc(14px + var(--safe-bottom));width:min(340px,calc(100% - 40px - var(--safe-left) - var(--safe-right)))}
  body:not(.at-home) .power-track{height:8px;margin-bottom:10px}
  body:not(.at-home) #kick-button{height:60px;min-height:0;border-width:3px;border-radius:18px;font:700 24px/1 'Poppins';box-shadow:0 6px 18px #08284740}
  #levels-dialog{max-height:calc(100dvh - 24px - var(--safe-top) - var(--safe-bottom));overscroll-behavior:contain;scrollbar-gutter:auto}
  #levels-dialog .close-button{width:44px;height:44px;flex-basis:44px;border-radius:12px}
  #levels-dialog .campaign-total{height:44px}
  #levels-dialog .close-button .material-symbols-rounded{font-size:28px}
  #levels-dialog .target-arrow{width:44px;height:44px}
  #how-dialog .balanced-close,#result .balanced-close{width:44px;height:44px;right:-12px;top:-5px}
  #how-dialog.balanced-popup,#result.balanced-popup{max-height:calc(100dvh - 24px - var(--safe-top) - var(--safe-bottom));max-width:calc(100% - 24px - var(--safe-left) - var(--safe-right));border-radius:22px}
}
/* Portrait: a light header and a compact bottom carousel leave the street visible. */
@media (max-width:1100px) and (orientation:portrait){
  #home-screen{--card-height:clamp(148px,22dvh,208px)}
  .home-level-rail{inset:calc(12px + var(--safe-top)) calc(12px + var(--safe-right)) calc(12px + var(--safe-bottom)) calc(12px + var(--safe-left));width:auto;height:auto;padding:0;border:0;border-radius:0;background:none;box-shadow:none;overflow:visible;pointer-events:none}
  .home-level-rail::before,.home-level-rail::after,.home-rail-divider{display:none;content:none}
  .home-account{height:72px;padding:12px;background:#205486f5;border:1px solid #6a98c5;border-radius:18px;pointer-events:auto}
  .home-level-list{position:absolute;inset:auto 0 76px;height:var(--card-height);padding:0;display:flex;flex-direction:row;gap:12px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity;scroll-padding:0;touch-action:pan-x}
  .home-level-card{flex:0 0 min(82%,320px);width:min(82%,320px);height:100%;aspect-ratio:auto;scroll-snap-align:start}
  .home-utilities{top:calc(96px + var(--safe-top));right:calc(12px + var(--safe-right))}
  .home-actions{left:calc(12px + var(--safe-left));right:calc(12px + var(--safe-right));bottom:calc(12px + var(--safe-bottom));width:auto;transform:none}
  #levels-dialog{width:min(520px,calc(100% - 24px - var(--safe-left) - var(--safe-right)));border-radius:22px}
  #levels-dialog .popup-header{display:grid;grid-template-columns:minmax(0,1fr) auto 44px;gap:10px;padding:16px 14px;position:sticky;top:0;z-index:5;background:#174974;border-radius:20px 20px 0 0;align-items:center}
  #levels-dialog #levels-title{font-size:20px;letter-spacing:-.5px;grid-column:1;grid-row:1;line-height:1.2}
  #levels-dialog .campaign-total{grid-column:2;grid-row:1;justify-self:end;padding:0 8px;gap:2px;border-radius:12px;font-size:11px}
  #levels-dialog .campaign-total strong{font-size:16px}
  #levels-dialog .campaign-total .rating-star{width:20px;height:20px;margin:0}
  #levels-dialog .close-button{grid-column:3;grid-row:1;align-self:center}
  #levels-dialog .target-browser{display:flex;padding:0 12px 14px;gap:14px}
  #levels-dialog .target-preview{aspect-ratio:auto;height:clamp(180px,27dvh,236px);flex:none;border-radius:16px}
  #levels-dialog .target-preview:after{inset:40% 0 0;background:linear-gradient(transparent,#144780 82%)}
  #levels-dialog .selected-target-image{object-position:center 40%}
  #levels-dialog .target-arrow{top:36%}
  #levels-dialog .target-arrow-prev{left:8px}
  #levels-dialog .target-arrow-next{right:8px}
  .selected-target-heading{left:12px;right:12px;bottom:10px;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:4px 8px;align-items:center}
  #selected-target-level{font-size:25px;grid-column:1;grid-row:1}
  #levels-dialog #stage-picker-title{font-size:18px;line-height:1.2;grid-column:2;grid-row:1;letter-spacing:-.4px}
  #selected-target-lock{width:20px;height:20px;grid-column:3;grid-row:1}
  #selected-target-stars{width:auto;grid-column:1 / 4;grid-row:2;justify-content:flex-start;gap:3px}
  #selected-target-stars .rating-star{width:24px;height:24px}
  #levels-dialog .stage-grid{grid-template-columns:1fr;gap:12px}
  #levels-dialog .stage-card{aspect-ratio:auto;height:clamp(88px,13dvh,108px);border-radius:15px;background:#174774}
  #levels-dialog .stage-route-image{width:42%;height:100%;aspect-ratio:auto;object-position:center}
  #levels-dialog .stage-card:after{display:none}
  #levels-dialog .stage-card-action{top:0;bottom:0;right:0;width:40px;height:100%;border-radius:0;background:#0d335c66;z-index:3}
  #levels-dialog .stage-card-action img{width:23px;height:23px}
  #levels-dialog .stage-card-copy{left:calc(42% + 12px);right:44px;top:50%;bottom:auto;transform:translateY(-50%);flex-direction:column;align-items:flex-start;gap:8px}
  #levels-dialog .stage-card-copy strong{font-size:16px}
  #levels-dialog .stage-card .rating-star{width:22px;height:22px}
  #how-dialog.balanced-popup{--popup-pad:20px;--popup-head:44px;--popup-action:52px;width:390px;height:516px;min-height:0;padding:20px;overflow:auto}
  #how-dialog[open]{grid-template-rows:44px auto 52px;gap:16px}
  #how-dialog .balanced-header h2{font-size:25px}
  #how-dialog .help-content{transform:none;gap:16px}
  #how-dialog .help-reward{width:100%;font-size:16px;gap:10px;padding:8px 12px;min-height:48px}
  #how-dialog .help-reward img{width:28px;height:28px}
  #how-dialog .help-steps{grid-template-columns:1fr;gap:10px}
  #how-dialog .help-steps li{display:grid;grid-template-columns:90px minmax(0,1fr);gap:14px;align-items:center;width:100%;height:84px}
  #how-dialog .help-art{width:90px;height:84px}
  #how-dialog .help-steps p{font-size:17px;white-space:normal;text-align:left;letter-spacing:-.3px}
  #how-dialog .dialog-play{width:100%;font-size:20px}
  #result.balanced-popup{width:360px;height:320px;--popup-pad:20px;--popup-head:40px;--popup-action:50px}
  #result #result-title{font-size:25px}
  #result #result-stars .rating-star{width:64px;height:64px}
  #result .result-actions button{width:100%}
}
@media (max-width:1100px) and (orientation:portrait) and (max-height:650px){
  #levels-dialog .popup-header{padding-top:12px;padding-bottom:12px}
  #levels-dialog .target-preview{height:156px}
  #levels-dialog .target-browser{gap:10px;padding-bottom:12px}
  #levels-dialog .stage-grid{gap:10px}
  #levels-dialog .stage-card{height:84px}
}
@media (max-width:359px) and (orientation:portrait){
  .home-account{gap:8px;padding:10px;grid-template-columns:40px minmax(0,1fr) auto}
  .home-avatar{width:40px;height:40px}
  .home-account-copy strong{font-size:15px}
  .home-connect{width:96px;font-size:13px}
  .home-level-card-content{right:84px;left:10px}
  .home-level-card-number{font-size:16px}
  .home-level-card-stars{right:8px;gap:0}
  .home-level-card-stars .home-card-star{flex-basis:23px;width:23px;height:23px}
  body:not(.at-home) .bottom-hud{top:calc(64px + var(--safe-top))}
  body:not(.at-home) .shot-progress{top:calc(64px + var(--safe-top));left:calc(10px + var(--safe-left));height:44px;transform:none}
  #levels-dialog #levels-title{font-size:18px}
  #levels-dialog .popup-header{gap:8px;padding:14px 12px}
  #levels-dialog .campaign-total{padding:0 6px}
  #levels-dialog .campaign-total strong{font-size:14px}
}
/* Landscape phones retain a vertical level rail and keep dialogs short. */
@media (max-width:1100px) and (orientation:landscape), (max-height:600px) and (orientation:landscape){
  .save-controls{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 14px 12px;text-align:left}
  .save-controls p{margin:0;flex:1;font-size:11px}
  .save-controls>div{gap:6px;flex:none}
  .save-controls button{min-height:32px;font-size:11px;padding:5px 9px}
  .home-level-rail{left:calc(12px + var(--safe-left));top:calc(12px + var(--safe-top));bottom:calc(12px + var(--safe-bottom));right:auto;width:min(300px,36vw);height:auto;padding:10px;background:#205486f5;border:1px solid #6a98c5;display:flex;flex-direction:column}
  .home-account{flex:none;grid-template-columns:36px minmax(0,1fr) auto;gap:6px;height:48px}
  .home-avatar{width:36px;height:36px;border-radius:10px}
  .home-account-copy strong{font-size:14px}
  .home-account-copy small{font-size:10px}
  .home-connect{width:76px;padding:0 6px;gap:4px;font-size:11px}
  .home-connect>img{width:18px;height:18px}
  .home-account-exit{width:44px;height:44px}
  .home-rail-divider{position:static;inset:auto;flex:0 0 1px;width:100%;margin:8px 0 10px}
  .home-level-list{position:relative;inset:auto;display:flex;flex-direction:column;flex:1;min-height:0;height:auto;width:100%;gap:10px;padding:0;overflow-y:auto;overflow-x:hidden;scroll-snap-type:none;touch-action:pan-y}
  .home-level-card{flex:0 0 142px;height:142px;width:100%;aspect-ratio:auto;border-radius:14px}
  .home-level-card-content{left:10px;right:10px;bottom:37px}
  .home-level-card-number{font-size:17px}
  .home-level-card-name{font-size:11px}
  .home-level-card-stars{bottom:8px;left:10px;right:auto;height:24px;gap:2px}
  .home-level-card-stars .home-card-star{flex-basis:22px;width:22px;height:22px}
  .home-card-lock{bottom:10px;right:10px;width:22px;height:22px}
  .home-utilities{top:calc(12px + var(--safe-top));right:calc(12px + var(--safe-right))}
  .home-actions{left:auto;right:calc(16px + var(--safe-right));bottom:calc(16px + var(--safe-bottom));width:190px;transform:none}
  body:not(.at-home) .shot-progress{top:calc(10px + var(--safe-top));height:44px}
  body:not(.at-home) .controls{width:250px;bottom:calc(10px + var(--safe-bottom))}
  body:not(.at-home) #kick-button{height:52px;font-size:22px}
  body:not(.at-home) .power-track{margin-bottom:8px;height:6px}
  #levels-dialog{width:min(900px,calc(100% - 24px - var(--safe-left) - var(--safe-right)));border-radius:20px}
  #levels-dialog .popup-header{padding:10px 14px;gap:12px}
  #levels-dialog #levels-title{font-size:22px;letter-spacing:-.6px}
  #levels-dialog .campaign-total{padding:6px 8px;font-size:12px;border-radius:10px}
  #levels-dialog .campaign-total strong{font-size:16px}
  #levels-dialog .campaign-total .rating-star{width:22px;height:22px;margin:0}
  #levels-dialog .target-browser{display:grid;grid-template-columns:1.4fr 1fr;gap:12px;padding:0 14px 12px}
  #levels-dialog .target-preview{aspect-ratio:auto;min-height:210px;border-radius:15px}
  #levels-dialog .target-arrow{top:36%}
  #levels-dialog .target-arrow-prev{left:8px}
  #levels-dialog .target-arrow-next{right:8px}
  .selected-target-heading{left:12px;right:12px;bottom:12px;gap:6px 10px;flex-wrap:wrap}
  #selected-target-level{font-size:24px}
  #levels-dialog #stage-picker-title{font-size:18px}
  #selected-target-stars{width:100%;justify-content:flex-end;gap:3px}
  #selected-target-stars .rating-star{width:26px;height:26px}
  #levels-dialog .stage-grid{grid-template-columns:1fr;gap:8px}
  #levels-dialog .stage-card{aspect-ratio:auto;height:64px;min-height:64px;border-radius:12px;background:#174774}
  #levels-dialog .stage-card:after{display:none}
  .stage-route-image{height:100%;width:42%;aspect-ratio:auto;object-position:center}
  .stage-card-copy{left:calc(42% + 10px);right:38px;top:50%;bottom:auto;transform:translateY(-50%);flex-direction:column;align-items:flex-start;gap:4px}
  .stage-card-copy strong{font-size:14px}
  #levels-dialog .stage-card .rating-star{width:18px;height:18px}
  .stage-card-action{width:32px;height:100%;border-radius:0;background:#0d335c66}
  .stage-card-action img{width:20px;height:20px}
  #how-dialog.balanced-popup{width:600px;height:min(336px,calc(100dvh - 24px - var(--safe-top) - var(--safe-bottom)));--popup-pad:16px;--popup-head:38px;--popup-action:48px}
  #how-dialog[open]{gap:12px}
  #how-dialog .help-content{transform:none}
  #how-dialog .help-steps{gap:12px}
  #how-dialog .help-steps li{gap:8px}
  #how-dialog .help-content{gap:8px}
  #how-dialog .help-art{height:50px}
  #how-dialog .help-reward{width:260px;min-height:32px;padding:5px 12px;border-radius:10px;font-size:13px;gap:8px}
  #how-dialog .help-reward img{width:20px;height:20px}
  #how-dialog .help-steps p{font-size:15px;white-space:normal}
  #how-dialog .balanced-header h2{font-size:25px}
  #how-dialog .dialog-play{font-size:20px}
  #result.balanced-popup{width:360px;height:min(310px,calc(100dvh - 24px - var(--safe-top) - var(--safe-bottom)));--popup-pad:16px;--popup-head:36px;--popup-action:48px;gap:10px}
  #result #result-title{font-size:24px}
  #result .result-art{width:174px;height:126px;max-height:100%;min-height:0}
  #result[data-outcome=complete] .result-art{width:92px;height:86px;flex-shrink:1;min-height:0}
  #result .result-content{gap:6px}
  #result #result-stars .rating-star{width:64px;height:64px}
  #result #result-description{font-size:19px;flex:none}
}


/* Consolidated mobile navigation: keep secondary controls inside one menu. */
@media (max-width:1100px), (max-height:600px){
  .mobile-menu-toggle{position:absolute;top:calc(12px + var(--safe-top));right:calc(12px + var(--safe-right));z-index:12;display:grid;place-items:center;width:44px;height:44px;padding:0;border:1.5px solid #5285bb;border-radius:13px;background:#164575;color:white;box-shadow:0 3px 10px #08284733;clip-path:none}
  .mobile-menu-toggle .material-symbols-rounded{font-size:26px}
  body.entering-game .mobile-menu-toggle{visibility:hidden;pointer-events:none}
  .home-utilities,.home-rail-divider,body:not(.at-home) .bottom-hud,body:not(.at-home) #home-button{display:none}
  #home-screen{--card-height:clamp(144px,20dvh,176px)}
  body:not(.at-home) .campaign-hud{top:calc(12px + var(--safe-top));left:calc(12px + var(--safe-left));height:44px;gap:0;border:0;border-radius:13px;background:#164575;box-shadow:inset 0 0 0 1.5px #5285bb;overflow:hidden}
  body:not(.at-home) .campaign-hud .hud-blue-control{height:44px;border:0;border-radius:0;background:none;box-shadow:none}
  body:not(.at-home) .hud-stage-pill{border-left:1px solid #84a8ca40!important;width:42px;font-size:14px;color:#bdd6ee}
  body:not(.at-home) .shot-progress{top:calc(12px + var(--safe-top));left:auto;right:calc(72px + var(--safe-right));height:44px;padding:0 8px;transform:none}
  body:not(.at-home) #shot-stars .rating-star{width:22px;height:22px}
}
@media (max-width:1100px) and (orientation:landscape), (max-height:600px) and (orientation:landscape){
  .home-level-rail{padding:0;background:none;border:0;box-shadow:none;overflow:hidden}
  #mobile-menu{width:min(600px,calc(100% - 24px - var(--safe-left) - var(--safe-right)));max-width:none;padding:14px 18px;border-radius:20px}
  .mobile-menu-header{margin-bottom:8px}
  .mobile-menu-main{display:grid;grid-template-columns:minmax(0,1fr);gap:8px}
  #mobile-menu-account{padding:8px 10px;margin:0;border:1px solid #82acd540;border-radius:14px;background:#10365b66}
  #mobile-menu .home-account{height:44px;grid-template-columns:44px minmax(0,1fr) auto;gap:10px}
  #mobile-menu .home-connect{grid-column:3;width:108px}
  #mobile-menu .home-account-exit{grid-column:3;justify-self:end}
  .mobile-menu-main .mobile-menu-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
  .mobile-menu-actions>button{min-width:0;min-height:52px;font-size:14px;gap:7px;padding:8px;border-color:#82acd540}
  .mobile-menu-main .menu-chevron{display:none}
  .mobile-menu-main .mobile-menu-status{min-width:30px;padding:5px 6px;font-size:11px}
  .mobile-menu-session{margin-top:8px;padding-top:8px;gap:8px}
  .mobile-menu-session>button{min-height:44px;font-size:14px}
}

/* Compact outcomes leave space around the dialog, even on a rotated phone. */
@media (max-width:1100px), (max-height:600px){
  #result.balanced-popup{width:300px;height:260px;--popup-pad:18px;--popup-head:36px;--popup-action:46px;border-radius:20px}
  #result.balanced-popup:not([hidden]){gap:10px}
  #result #result-title{font-size:22px;letter-spacing:-.5px}
  #result .balanced-close{top:-4px;right:-8px;width:44px;height:44px}
  #result .result-art{width:144px;height:110px;max-height:100%}
  #result #result-stars{gap:10px}
  #result #result-stars .rating-star{width:54px;height:54px}
  #result[data-outcome=complete] .result-art{width:76px;height:72px}
  #result .result-content{gap:6px}
  #result #result-description{font-size:18px}
  #result #result-description .rating-star{width:24px;height:24px}
  #result .result-actions button{width:100%;font-size:18px;border-radius:13px}
}
@media (max-height:600px) and (orientation:landscape){
  #result.balanced-popup{height:244px;max-height:calc(100dvh - 48px);--popup-pad:16px;--popup-head:32px;--popup-action:44px}
  #result .result-art{width:132px;height:100px}
  #result[data-outcome=complete] .result-art{width:68px;height:64px}
}

/* Portrait home: branded header, live street hero and one anchored target tray. */
.mobile-home-logo,.mobile-target-heading{display:none}
.home-topbar{display:contents}
@media (min-width:1101px) and (min-height:601px){
  .home-topbar{
    display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;
    position:absolute;z-index:2;top:3.4vh;left:56.05vh;right:3.4vw
  }
  #home-screen .home-topbar .home-utilities{position:static;margin-top:1.9vh}
  #home-screen .mobile-home-logo{
    display:block;position:static;justify-self:center;
    width:min(300px,calc(100% - 48px));height:auto;
    filter:drop-shadow(0 3px 5px #0a294b44);pointer-events:none
  }
}
@media (max-width:1100px) and (orientation:portrait){
  #home-screen{--card-height:clamp(160px,24dvh,220px);--home-tray-height:calc(var(--card-height) + 140px + var(--safe-bottom))}
  #home-screen::before{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,#0a294b66,transparent 22%,transparent 65%,#0a294b33)}
  .mobile-home-logo{display:block;position:absolute;top:calc(2px + var(--safe-top));left:calc(12px + var(--safe-left));width:clamp(132px,38vw,190px);height:auto;filter:drop-shadow(0 3px 5px #0a294b44);pointer-events:none}
  #home-screen .home-utilities{display:flex;top:calc(16px + var(--safe-top));right:calc(68px + var(--safe-right));height:44px;width:auto;gap:0}
  #home-screen .home-utilities #home-sound,#home-screen .home-utilities #home-help{display:none}
  #home-screen .home-utilities #home-levels.home-progress{height:44px;padding:0 10px;gap:6px;border:1.5px solid #5285bb;border-radius:13px;background:#164575;font-size:21px;box-shadow:0 3px 10px #08284733}
  #home-screen .home-utilities #home-levels.home-progress>img{width:23px;height:23px}
  body.at-home .mobile-menu-toggle{top:calc(16px + var(--safe-top))}
  #home-screen .home-level-rail{inset:auto 0 0;width:100%;height:var(--home-tray-height);padding:0;border:1px solid #6b98c16b;border-bottom:0;border-radius:26px 26px 0 0;background:linear-gradient(160deg,#205486f5,#123a63fa);box-shadow:0 -8px 28px #06274730;pointer-events:none;overflow:hidden}
  .mobile-target-heading{display:block;position:absolute;top:17px;left:20px;margin:0;color:#f4f8ff;font:600 18px/1.3 'Poppins',sans-serif;letter-spacing:-.4px}
  #home-screen .home-level-list{inset:52px 0 auto;height:var(--card-height);padding:0 16px;gap:12px;scroll-padding-inline:16px}
  #home-screen .home-level-card{flex:0 0 min(86%,400px);width:min(86%,400px);height:100%;border-radius:17px}
  #home-screen .home-level-card-content{left:14px;bottom:14px;right:96px;gap:4px}
  #home-screen .home-level-card-number{font-size:18px}
  #home-screen .home-level-card-name{font-size:12px}
  #home-screen .home-level-card-stars{right:12px;bottom:16px;left:auto;gap:2px;height:25px}
  #home-screen .home-card-star{width:25px;height:25px;flex-basis:25px}
  #home-screen .home-card-lock{right:15px;bottom:17px;width:24px;height:24px}
  #home-screen .home-actions{left:calc(16px + var(--safe-left));right:calc(16px + var(--safe-right));bottom:calc(14px + var(--safe-bottom));width:auto}
  #home-screen #home-play{height:54px;border:3px solid #ffc03b;border-radius:16px;font-size:25px;gap:10px;box-shadow:0 4px 12px #091f3c44}
  #home-screen #home-play>img{width:26px;height:26px}
}
@media (max-width:360px) and (orientation:portrait){
  .mobile-home-logo{width:128px;left:10px;top:calc(7px + var(--safe-top))}
  #home-screen .home-utilities #home-levels.home-progress{padding:0 8px;gap:4px;font-size:18px}
  #home-screen .home-utilities #home-levels.home-progress>img{width:21px;height:21px}
  #home-screen .home-level-card-content{right:88px}
  #home-screen .home-level-card-number{font-size:17px}
  #home-screen .home-card-star{width:22px;height:22px;flex-basis:22px}
}
@media (max-height:700px) and (orientation:portrait){
  #home-screen{--card-height:clamp(130px,22dvh,154px)}
}

/* Selected mobile direction: full live street and two simple stacked actions. */
.mobile-home-summary,.mobile-home-levels{display:none}
/* Rotated phones use the desktop composition, with touch-sized controls. */
@media (max-width:1100px) and (orientation:landscape), (max-height:600px) and (orientation:landscape){
  #home-screen{--landscape-rail-width:clamp(180px,28vw,300px)}
  body.at-home .mobile-menu-toggle{display:grid}
  #home-screen .home-level-rail{
    width:var(--landscape-rail-width);padding:10px;
    border:1px solid #6a98c5;border-radius:18px;background:#205486ed;
    box-shadow:0 8px 24px #08284726
  }
  #home-screen .home-topbar{
    display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;
    position:absolute;z-index:2;top:calc(12px + var(--safe-top));
    left:calc(12px + var(--safe-left) + var(--landscape-rail-width));
    right:calc(64px + var(--safe-right))
  }
  #home-screen .mobile-home-logo{
    display:block;position:static;justify-self:center;
    width:min(180px,calc(100% - 20px));height:auto;
    filter:drop-shadow(0 3px 5px #0a294b44);pointer-events:none
  }
  #home-screen .home-utilities{display:flex;position:static;width:auto;height:44px;gap:6px}
  #home-screen .home-utilities #home-sound,#home-screen .home-utilities #home-help{display:none}
  #home-screen .home-utilities #home-levels.home-progress{
    height:44px;padding:0 9px;gap:5px;font-size:20px;border-radius:13px
  }
  #home-screen .home-utilities #home-levels.home-progress>img{width:22px;height:22px}
  #home-screen .home-actions{height:auto;width:clamp(160px,24vw,220px)}
  #home-screen #home-play{height:52px;font-size:23px;border-radius:16px}
  #home-screen #home-play>img{width:25px;height:25px}
}
@media (max-width:740px) and (orientation:landscape){
  #home-screen .home-level-card{flex-basis:130px;height:130px}
}
@media (max-width:1100px) and (orientation:portrait){
  #home-screen::before{background:linear-gradient(180deg,#0a294b22,transparent 20%,transparent 57%,#103866c9 78%,#103866 100%)}
  #home-screen .home-level-rail{display:none}
  #home-screen .mobile-home-logo{top:calc(clamp(14px,3.5dvh,30px) + var(--safe-top));width:clamp(132px,40vw,190px)}
  #home-screen .home-utilities,body.at-home .mobile-menu-toggle{top:calc(clamp(22px,5dvh,44px) + var(--safe-top))}
  #home-screen .home-actions{display:flex;flex-direction:column;align-items:stretch;gap:8px;top:auto;left:calc(18px + var(--safe-left));right:calc(18px + var(--safe-right));bottom:calc(20px + var(--safe-bottom));width:auto;height:auto;max-width:500px;margin-inline:auto}
  .mobile-home-summary{display:flex;flex-direction:column;align-items:center;gap:12px;margin-bottom:14px;color:#fff;text-align:center;pointer-events:none}
  #mobile-home-location{margin:0;font:700 15px/1.4 'Poppins',sans-serif;letter-spacing:1.2px}
  #mobile-home-stars{display:flex;align-items:center;justify-content:center;gap:10px;height:32px}
  #mobile-home-stars .rating-star{width:32px;height:32px;object-fit:contain}
  #home-screen #home-play{height:54px;min-height:54px;font-size:26px;border-radius:17px;box-shadow:none}
  #home-screen .mobile-home-levels{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;height:54px;min-height:54px;padding:0 16px;background:#19497c;border:2px solid #73a8e8;border-radius:17px;color:#fff;font:600 20px/1 'Poppins',sans-serif;box-shadow:none;pointer-events:auto;clip-path:none}
  #home-screen .mobile-home-levels:hover{background:#205889}
  .mobile-home-levels .material-symbols-rounded{font-size:27px;font-variation-settings:'FILL' 1,'wght' 600,'GRAD' 0,'opsz' 24}
}
@media (max-width:360px) and (orientation:portrait){
  #home-screen .mobile-home-logo{width:128px;left:10px}
  #mobile-home-location{font-size:14px;letter-spacing:.8px}
}
@media (max-height:650px) and (orientation:portrait){
  #home-screen .home-actions{bottom:calc(16px + var(--safe-bottom))}
  .mobile-home-summary{gap:8px;margin-bottom:8px}
  #mobile-home-stars,#mobile-home-stars .rating-star{height:28px}
  #mobile-home-stars .rating-star{width:28px}
}