/* Food Truck Merge V4.4 — production interface, NOT a static screenshot.
   On phones the GAME viewport has 6 real rows. The 5x7 grid and 4 generators
   take the remaining available screen height. No document scrolling during play. */
@media (max-width:525px) and (orientation:portrait){
 html,body {height:100%;width:100%;max-width:100%;min-height:0!important;overflow:hidden!important;overscroll-behavior:none;}
 body {display:block;background:#411921;}
 .app {
   width:100%!important;max-width:100%!important;
   height:100vh!important;height:100dvh!important;
   min-height:0!important;max-height:100dvh!important;
   overflow:hidden!important;overflow:clip!important;
   display:grid!important;
   grid-template-rows:
      clamp(46px,6.3dvh,55px)
      clamp(72px,14dvh,120px)
      clamp(94px,13.1dvh,112px)
      clamp(37px,5.1dvh,43px)
      minmax(0,1fr)
      calc(clamp(58px,8dvh,72px) + env(safe-area-inset-bottom));
   gap:0!important;padding:0!important;border:0!important;
   background:linear-gradient(180deg,#7c212b 0,#f39a50 23%,#ffd18e 64%,#f0a052 100%)!important;
 }
 .glow-beams {display:none!important}
 .header {
   grid-row:1;display:flex!important;flex-direction:row!important;align-items:center!important;
   padding:2px 5px!important;margin:0!important;min-height:0!important;height:100%!important;
   border-bottom:2px solid #ffdf87!important;
   background:linear-gradient(180deg,#751e30,#4a1825)!important;
   box-shadow:inset 0 2px #c65e44,0 3px 6px #38121755!important;
 }
 .header:before {display:none!important}
 .brand-line {display:contents!important;min-height:0!important;height:auto!important}
 .premium-logo {display:block!important;width:clamp(67px,20vw,86px)!important;height:100%!important;max-width:none!important;flex:0 0 clamp(67px,20vw,86px);margin:0 2px 0 0;object-fit:contain;filter:drop-shadow(0 2px 1px #36110e)}
 .resources {display:flex!important;flex:1 1 0!important;min-width:0;order:2;align-items:center;gap:3px!important;margin:0!important;padding:0!important;min-height:0!important;height:100%;}
 .resource {height:clamp(29px,4.4dvh,37px)!important;min-height:0!important;min-width:0;flex:1 1 0!important;padding:0 2px!important;gap:2px!important;border:1.5px solid #ffd177!important;
    background:linear-gradient(#78372b,#4b1c24)!important;box-shadow:inset 0 1px #ffeeb05a,0 2px #2d1317!important;}
 .resource b {font-size:clamp(9px,2.8vw,12px)!important;line-height:1;}
 .resource small {font-size:clamp(5.5px,1.6vw,7px)!important;line-height:1;letter-spacing:-.02em}
 .resource-icon {font-size:clamp(11px,3.5vw,15px)!important}
 .header-menu {position:relative!important;top:0!important;right:0!important;flex:0 0 clamp(29px,8.2vw,36px)!important;order:3;width:clamp(29px,8.2vw,36px)!important;height:clamp(29px,8.2vw,36px)!important;margin-left:3px!important;align-self:center;padding:0!important;border-radius:9px;overflow:hidden;}
 .header-menu img {max-width:100%;height:100%;object-fit:contain}
 .skyline,.skyline.truck-stage-0,.skyline.truck-stage-1,.skyline.truck-stage-2,.skyline.truck-stage-3,.skyline.truck-stage-4,.skyline.truck-stage-5 {
   grid-row:2;height:100%!important;min-height:0!important;margin:0!important;border-bottom:2px solid #ffd477!important;
 }
 .skyline:before{filter:saturate(1.25) brightness(1.14) contrast(1.03)!important;background-position:center 47%!important;}
 .skyline.terrace-ready:after {background-size:43% auto,auto!important}
 .truck-caption {left:6px;right:6px;bottom:5px;display:flex!important;align-items:end;justify-content:space-between;gap:4px;z-index:5;}
 .truck-caption span {max-width:67%;padding:4px 6px!important;border-radius:11px!important;background:linear-gradient(125deg,#29131acb,#4c231fb9)!important}
 .truck-caption small {font-size:clamp(6px,1.8vw,8px)!important}
 .truck-caption strong{font-size:clamp(8px,2.7vw,11px)!important;line-height:1.12!important;display:block;}
 .truck-caption button {display:flex!important;flex-direction:column;align-items:center;justify-content:center;
    min-width:clamp(68px,21vw,85px);max-width:27%;height:clamp(48px,7.8dvh,66px)!important;min-height:0!important;padding:2px 4px!important;
    font-size:clamp(8px,2.3vw,10px)!important;font-weight:1000;border-radius:12px!important;
    background:linear-gradient(160deg,#fffac5 0%,#ffd562 31%,#fbaf20 62%,#d7741c 100%)!important;
    box-shadow:inset 0 2px #fff9cf,0 3px 0 #8f3c1a,0 0 9px #ffc531dd!important;
 }
 .upgrade-wrench {font-size:clamp(17px,5.8vw,24px)!important;line-height:1.1}
 .customers {grid-row:3;display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));height:100%!important;min-height:0!important;margin:0!important;gap:4px!important;padding:5px 5px 4px!important;overflow:hidden;}
 .customer {height:100%!important;min-height:0!important;max-height:none!important;padding:3px 3px 4px!important;gap:1px!important;overflow:hidden;
   border:1.5px solid #ffd58a!important;border-radius:12px!important;box-shadow:0 2px 0 #bb6732,0 3px 5px #64332270!important;
 }
 .customer:before {height:3px!important;opacity:.6}
 .customer-top {height:39%!important;min-height:0!important;max-height:none!important;margin:0!important;display:flex;flex:0 0 39%;gap:1px!important;}
 .customer-portrait,.customer-food{height:100%!important;max-height:100%!important;max-width:none!important;width:49%;min-width:0;object-fit:contain!important;border-radius:7px!important}
 .customer-title {flex:0 0 auto;font-size:clamp(8px,2.5vw,10px)!important;line-height:1!important;min-height:0!important;height:clamp(15px,2dvh,19px)!important;overflow:hidden}
 .customer-progress-label {font-size:clamp(6px,1.5vw,7px)!important;min-height:7px!important;line-height:1!important}
 .customer-progress-label b{font-size:clamp(7px,1.8vw,8px)!important}
 .customer-wait {height:6px!important;min-height:6px!important;flex:0 0 6px;}
 .customer button {height:clamp(19px,2.9dvh,25px)!important;min-height:0!important;margin-top:auto;font-size:clamp(7px,2.3vw,10px)!important;line-height:1!important;padding:0!important;border-radius:7px!important}
 .customer .served-mark{font-size:clamp(16px,4vw,23px)!important;min-height:0!important;height:55%;text-align:center;}
 .chapter-strip {grid-row:4;height:auto!important;min-height:0!important;margin:2px 5px 4px!important;padding:3px 36px 3px 7px!important;border:2px solid #ffd777!important;border-radius:10px!important;
   background:linear-gradient(#fffbe8,#ffe0a9)!important;box-shadow:0 2px #b65f37!important;}
 .chapter-strip-main {font-size:clamp(9px,2.6vw,11px)!important;color:#803018!important;}
 .chapter-strip-main strong{font-size:clamp(9px,2.5vw,11px)!important;}
 .chapter-strip-main span{font-size:clamp(8px,2.2vw,10px)!important;color:#733b22!important;}
 .chapter-bar{height:clamp(6px,1.1dvh,9px)!important;margin-top:3px!important;}
 .story-mini{width:clamp(28px,7.9vw,35px)!important;height:calc(100% - 4px)!important;right:2px!important;top:2px!important;}
 .story-mini img{width:100%;height:100%;object-fit:contain}
 .game-area{grid-row:5;position:relative;height:100%!important;min-height:0!important;max-height:100%!important;overflow:hidden;
   grid-template-columns:clamp(64px,18vw,78px) minmax(0,1fr)!important;
   gap:4px!important;margin:0 5px!important;align-items:stretch!important;}
 .stations {height:100%!important;min-height:0!important;max-height:100%!important;display:grid!important;grid-template-rows:repeat(4,minmax(0,1fr))!important;
    gap:4px!important;padding:3px 2px!important;border:2px solid #ffdd85!important;border-radius:13px!important;overflow:hidden;}
 .station {height:100%!important;min-height:0!important;max-height:100%!important;overflow:hidden!important;justify-content:space-evenly!important;gap:0!important;padding:3px 0 2px!important;border-radius:9px!important;}
 .station img{flex:0 1 auto;height:clamp(22px,5.2dvh,49px)!important;max-height:47%!important;width:97%!important;object-fit:contain!important}
 .station b {font-size:clamp(7px,2.05vw,9px)!important;line-height:1.0!important}
 .station .lvl{font-size:clamp(7px,1.85vw,8px)!important;line-height:1.0!important}
 .station .gen-charge{font-size:clamp(7px,2vw,10px)!important;line-height:1.0!important;padding:1px 2px!important;}
 .station .gen-track{flex:0 0 3px;height:3px!important;min-height:3px!important;}
 .station .more{width:clamp(17px,4.7vw,21px)!important;height:clamp(17px,4.7vw,21px)!important;font-size:15px!important;top:0;right:0}
 .board-shell{height:100%!important;min-height:0!important;max-height:100%!important;width:100%;overflow:hidden;padding:3px!important;border:3px solid #ffdd91!important;
    border-radius:14px!important;box-shadow:inset 0 1px #fff6d0,0 2px #ad5835,0 0 10px #fca24d6b!important;}
 .board {height:100%!important;min-height:0!important;width:100%;display:grid!important;
   grid-template-columns:repeat(5,minmax(0,1fr))!important;grid-template-rows:repeat(7,minmax(0,1fr))!important;
   gap:3px!important;}
 .tile{aspect-ratio:auto!important;min-width:0!important;min-height:0!important;height:100%!important;width:100%!important;border-radius:9px!important;
   background:linear-gradient(160deg,#fff3d8,#ffddae)!important;border:1px solid #dd9759!important;}
 .tile img{height:88%!important;width:88%!important;object-fit:contain}
 .instruction-bar{display:none!important}
 .bottom{grid-row:6;margin:0!important;height:100%!important;min-height:0!important;position:relative!important;bottom:auto!important;display:grid!important;
   grid-template-columns:repeat(5,minmax(0,1fr))!important;align-items:start!important;gap:3px!important;padding:5px 5px env(safe-area-inset-bottom)!important;
   border-top:1px solid #ffda93!important;background:linear-gradient(#ec9559,#a74839)!important;overflow:hidden;}
 .bottom-btn,.bottom-btn.special{height:100%!important;min-height:0!important;max-height:100%!important;padding:0!important;margin:0!important;aspect-ratio:auto!important;
   border:0!important;border-radius:10px!important;box-shadow:none!important;background:none!important;}
 .bottom-btn img {width:100%!important;height:100%!important;object-fit:contain!important;object-position:center!important;display:block;}
 .toast{bottom:calc(80px + env(safe-area-inset-bottom));}
 .ftm-launch,.ftm-chapters{height:100dvh;max-height:100dvh;}
 .ftm-launch{background:linear-gradient(#0000,#120b1478),url('assets/launch/couverture-officielle.webp') center center/cover no-repeat!important;
     padding:calc(env(safe-area-inset-top) + 12px) 15px calc(env(safe-area-inset-bottom) + 20px)!important;}
 .ftm-launch:after,.ftm-launch-glow {display:none!important}
 .ftm-launch-content{min-height:0!important;height:100%!important;max-width:500px;width:100%;justify-content:end!important;padding-bottom:2dvh;}
 .ftm-launch-logo,.ftm-launch-illustration,.ftm-launch-tag {display:none!important}
 .ftm-loading-card{width:100%;max-width:350px;margin:0 auto;background:linear-gradient(#fff2cd,#ffd69c);border:3px solid #ffce72;
     box-shadow:0 5px 0 #a14c24,0 7px 22px #24090cb3;border-radius:22px;padding:14px 15px 12px;color:#663023;}
 .ftm-launch-headline{font-size:clamp(16px,4.6vw,21px)!important;text-shadow:none!important;color:#71301f!important;margin:0 0 10px!important;}
 .ftm-load-row{font-size:10px!important;text-shadow:none!important;color:#67341e!important;margin-bottom:5px!important;}
 .ftm-load-row strong{color:#a85a15!important}
 .ftm-load-track{border-color:#cd762f!important;background:#784133!important;max-width:none!important;height:21px!important;}
 .ftm-launch-footnote{color:#8b4c32!important;font-size:10px!important;text-shadow:none!important;margin:8px 0 0!important;}
}
@media(max-width:525px) and (max-height:710px) and (orientation:portrait){
 .app{grid-template-rows:44px 68px 89px 36px minmax(0,1fr) calc(58px + env(safe-area-inset-bottom))!important;}
 .truck-caption button {height:44px!important}
 .customer-top{height:35%!important;flex-basis:35%!important}
 .customer-title{font-size:8px!important;height:15px!important}
 .customer button{height:19px!important}
 .station img{height:clamp(19px,4dvh,29px)!important}
}
@media(max-width:352px) and (orientation:portrait){
 .premium-logo{width:61px!important;flex-basis:61px!important}
 .resource small{display:none!important}
 .resource b{font-size:10px!important}
 .game-area{grid-template-columns:61px minmax(0,1fr)!important;gap:3px!important;margin:0 3px!important}
 .board{gap:2px!important}
 .customer-title{font-size:7.5px!important}
}
