/* HUD rails are outside the rendered market, never on top of its objects. */
body[data-mode=sweep] #app:is([data-state=playing],[data-state=paused],[data-state=settling]){--arena-top:calc(74px + env(safe-area-inset-top));--arena-bottom:calc(62px + env(safe-area-inset-bottom))}
body[data-mode=sweep] #app:is([data-state=playing],[data-state=paused],[data-state=settling]) #world{top:var(--arena-top);bottom:var(--arena-bottom);height:calc(100% - var(--arena-top) - var(--arena-bottom))}
body[data-mode=sweep] #app:is([data-state=playing],[data-state=paused],[data-state=settling]) .veil{display:none}
body[data-mode=sweep] #app:is([data-state=playing],[data-state=paused],[data-state=settling]) header{top:calc(8px + env(safe-area-inset-top));right:max(10px,env(safe-area-inset-right));left:auto}
body[data-mode=sweep] #app:is([data-state=playing],[data-state=paused],[data-state=settling]) nav button:not(#pause){display:none}
body[data-mode=sweep] #app:is([data-state=playing],[data-state=paused],[data-state=settling]) #pause{width:44px;height:44px;border-radius:12px;background:#305c4a;border-color:#87a88b80}
body[data-mode=sweep] #hud::before,body[data-mode=sweep] #hud::after{content:"";position:absolute;left:0;right:0;background:#183d34;z-index:-1}
body[data-mode=sweep] #hud::before{top:0;height:var(--arena-top);border-bottom:1px solid #95b48b55}
body[data-mode=sweep] #hud::after{bottom:0;height:var(--arena-bottom);border-top:1px solid #95b48b55}
body[data-mode=sweep] .top-hud{top:calc(8px + env(safe-area-inset-top));left:12px;right:67px;gap:12px}
body[data-mode=sweep] .top-hud .label{font-size:6px;margin-bottom:3px;letter-spacing:.8px;color:#a9c8b2;text-shadow:none}
body[data-mode=sweep] .top-hud strong{font-size:21px;line-height:1;letter-spacing:-.6px;text-shadow:none}
body[data-mode=sweep] .timer strong{font-size:23px;color:#ffdfa1}
body[data-mode=sweep] .top-hud small{font-size:6px;margin-top:3px;line-height:1.1;color:#d0dfbb;text-shadow:none}
body[data-mode=sweep] .growth{top:calc(55px + env(safe-area-inset-top));left:12px;right:auto;transform:none;width:42%;max-width:210px;padding:0;background:none;border:0}
body[data-mode=sweep] .growth-heading{justify-content:flex-start;gap:9px;font-size:7px;line-height:1;letter-spacing:.2px;color:#c5dba9}
body[data-mode=sweep] .growth>small{display:none}
body[data-mode=sweep] .growth-track{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%)}
body[data-mode=sweep] .quest-status{top:calc(53px + env(safe-area-inset-top));bottom:auto;left:auto;right:12px;transform:none;width:50%;max-width:360px;padding:0;border:0;border-radius:0;background:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:right;font:7px/1.2 var(--mono);color:#cfddb5}
body[data-mode=sweep] .orders{left:50%;right:auto;transform:translateX(-50%);width:min(540px,calc(100% - 20px));bottom:calc(8px + env(safe-area-inset-bottom));gap:6px}
body[data-mode=sweep] .order{padding:5px 7px;grid-template-columns:24px 1fr;column-gap:5px;min-height:44px;border-width:1px;border-radius:9px;box-shadow:none;background:#f4e7c7}
body[data-mode=sweep] .order img{width:24px;height:30px}
body[data-mode=sweep] .order span{font-size:6px;letter-spacing:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body[data-mode=sweep] .order strong{font-size:14px}
body[data-mode=sweep] #notice{top:calc(var(--arena-top) + 12px);left:8%;right:8%;font:900 13px/1.25 Arial;letter-spacing:.7px;color:#fff3bc;text-shadow:0 2px 2px #31533a,0 0 8px #31533a;pointer-events:none}
body[data-mode=sweep] #notice[data-kind=burst]{color:#fff4a4;font-size:17px;letter-spacing:1px}
body[data-mode=sweep] #notice[data-kind=celebrate]{color:#ffe3b0;font-size:16px}
body[data-mode=sweep] #first-hint{font-size:10px;color:#fff8da;white-space:normal;width:min(290px,86%)}
body[data-mode=sweep] #first-hint small{font-size:7px;line-height:1.5}
.pause-options{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:12px}
.pause-options button{min-height:44px;padding:8px;border:1px solid #aac49d55;background:#244b40;color:#e1e5c7;font:8px var(--mono)}
body[data-reduced=true] .bite{transition:none}
#clock.urgent{color:#ffad86}
body[data-reduced=false] #clock.urgent{animation:last-call 1s ease-in-out infinite alternate}
@keyframes last-call{from{opacity:.75}to{opacity:1}}
@media(max-height:520px) and (min-width:600px){
 body[data-mode=sweep] #app:is([data-state=playing],[data-state=paused],[data-state=settling]){--arena-top:calc(57px + env(safe-area-inset-top));--arena-bottom:calc(50px + env(safe-area-inset-bottom))}
 body[data-mode=sweep] .top-hud{left:14px;right:70px;top:5px}
 body[data-mode=sweep] .top-hud strong{font-size:19px}
 body[data-mode=sweep] .top-hud small{display:none}
 body[data-mode=sweep] .growth{top:39px}
 body[data-mode=sweep] .quest-status{top:37px;right:70px;width:50%}
 body[data-mode=sweep] .orders{bottom:5px;width:440px}
 body[data-mode=sweep] .order{min-height:38px;padding:3px 6px}
 body[data-mode=sweep] .order img{height:26px}
}

.food-festival{display:block;width:100%;min-height:36px;margin:0 0 9px;border:1px solid #edbc84;background:#edbc8415;color:#f8d2a1;font:10px var(--mono);letter-spacing:.07em;cursor:pointer}