.bakery-games button[data-game="listen"]{background:#d3a367 url('assets/delivery/bakery.webp') center/cover;border:5px solid #c5924d}
.bakery-games button[data-game="listen"]:before{content:"";position:absolute;inset:5% 1% 10%;background:url('assets/delivery/sef.webp') center/contain no-repeat}
.bakery-games button[data-game="listen"] span{position:relative;z-index:2}
.delivery-game{height:100dvh;min-height:520px;display:flex;flex-direction:column;overflow:hidden;background:#efe4ce;color:#193e36}
.delivery-game .topbar{position:relative!important;inset:auto!important;flex:none;z-index:20;margin:6px}
.delivery-message{flex:none;text-align:center;margin:0;padding:8px 12px;font-size:clamp(15px,2vw,23px);font-weight:700;background:#fff6df;min-height:42px}
.delivery-stage{position:relative;flex:1;min-height:0;overflow:hidden;background-size:cover;background-position:center}
.delivery-stage.is-parking{background-image:url('assets/delivery/parking.webp')}
.delivery-stage.is-loading{background-image:url('assets/delivery/bakery.webp')}
.delivery-stage[data-phase="intro"] .delivery-loading{width:60%;height:70%}
.delivery-stage[data-phase="intro"] .delivery-panel{left:auto;right:3%;top:50%;transform:translateY(-50%);width:35%;box-sizing:border-box}
.delivery-intro-words{position:absolute;left:4%;bottom:4%;width:52%;height:24%;display:flex;justify-content:center;gap:18px;padding:10px;box-sizing:border-box;background:#fff4deeb;border:3px solid #b79050;border-radius:20px}
.delivery-intro-words img{width:30%;height:100%;object-fit:contain;background:white;border-radius:12px}
.delivery-truck{position:relative;width:100%;aspect-ratio:1672/941}
.delivery-body{display:block;width:100%;height:100%;object-fit:contain}
.delivery-cargo{position:absolute;display:grid;grid-template-columns:repeat(4,1fr);overflow:hidden}
.delivery-slot{position:relative;min-width:0;display:flex;align-items:flex-end;justify-content:center;padding:2% 4% 2%}
.delivery-box{position:relative;width:100%;height:auto;aspect-ratio:965/917;display:flex;align-items:flex-end;justify-content:center}
.delivery-box>img:first-child{width:100%;height:100%;object-fit:fill}
.delivery-box .delivery-label{position:absolute;left:8%;top:38%;width:84%;height:53%;object-fit:contain;background:white}
.delivery-box .delivery-extra{object-fit:contain}
.delivery-shutter{position:absolute;inset:0;background:repeating-linear-gradient(to bottom,transparent 0,transparent 8px,#0005 9px,#ffffff50 10px),linear-gradient(100deg,#ffffff40,transparent 45%,#0002);background-color:var(--truck-color);transform:translateY(-102%);border:2px solid #263c36;box-shadow:inset 0 0 9px #0005}
.delivery-shutter.closed{transform:translateY(0)}
.delivery-shutter span{position:absolute;bottom:8%;left:44%;width:12%;height:5%;border:2px solid #ddd;border-radius:10px;box-shadow:0 2px 2px #333}
.delivery-loading{height:72%;display:flex;align-items:center;justify-content:center;position:relative}
.delivery-driver-name{position:absolute;top:10px;left:50%;transform:translateX(-50%);padding:5px 18px;background:#fff6dfeb;border-radius:12px;font-weight:700;white-space:nowrap}
.delivery-active-van{width:min(1100px,94%);max-height:100%}
.delivery-choices{position:absolute;bottom:2%;left:50%;transform:translateX(-50%);display:flex;gap:12px;width:min(820px,94%);height:26%;align-items:center;justify-content:center;padding:10px;background:#fff4deec;border:3px solid #b79050;border-radius:20px}
.delivery-choices button{background:white;border:3px solid #bd995f;border-radius:14px;min-width:0;flex:1;height:100%;padding:5px;cursor:pointer}
.delivery-choices button img{width:100%;height:100%;object-fit:contain}
.delivery-choices .delivery-repeat{flex:0 0 50px;height:60px;padding:8px;display:flex;align-items:center;justify-content:center;color:#196875;box-sizing:border-box}.delivery-repeat svg{display:block;width:30px;height:30px;flex:none}
.delivery-choices .wrong{border:5px solid #ad453c}
.delivery-game button:focus-visible{outline:4px solid #0c7692;outline-offset:4px}
.delivery-panel{position:absolute;z-index:15;left:50%;top:50%;transform:translate(-50%,-50%);width:min(600px,90%);background:#fff4df;border:3px solid #af8245;border-radius:22px;text-align:center;padding:25px;box-shadow:0 8px 30px #0003}
.delivery-panel h2{font-size:clamp(20px,3vw,32px);margin:0 0 12px}
.delivery-panel p{font-size:clamp(16px,2vw,22px);line-height:1.5}
.delivery-panel button{padding:12px 24px;border:2px solid #9a733e;border-radius:12px;background:#f6d99d;color:#193e36;font-size:20px;margin:6px;cursor:pointer}
.delivery-parking{position:absolute;inset:0}
.delivery-spaces{position:absolute;z-index:1;left:2%;top:12%;width:76%;height:83%;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:repeat(3,1fr);gap:2% 4%}
.delivery-space{position:relative;min-height:0;border:0;background:transparent;display:flex;align-items:center;justify-content:center}
.delivery-space .delivery-truck{height:auto;width:100%;max-width:100%;aspect-ratio:1672/941;z-index:3;flex-shrink:1}
.delivery-space{min-width:0}
.delivery-space-name{position:absolute;bottom:1px;left:50%;transform:translateX(-50%);font-size:clamp(11px,1.4vw,19px);white-space:nowrap;background:#fff5dfdf;padding:2px 8px;border-radius:7px}
.delivery-exit-road{position:absolute;right:0;top:15%;bottom:0;width:20%;border:0;background:transparent}
.delivery-gate{position:absolute;z-index:8;right:1%;top:23%;width:21%;height:29%;padding:0;background:transparent;border:0;color:#193e36;cursor:pointer;overflow:visible}
.delivery-gate:disabled{opacity:1;cursor:default}
.delivery-gate-post{position:absolute;left:5%;top:18%;height:62%;width:16%;min-width:20px;border-radius:7px 7px 3px 3px;background:linear-gradient(90deg,#58725c,#91a38a 45%,#536950);border:2px solid #3b5142;box-shadow:3px 4px 5px #0003}
.delivery-gate-post i{position:absolute;top:18%;left:20%;width:60%;aspect-ratio:1;background:#b85538;border:2px solid #f6d99d;border-radius:50%}
.delivery-gate-arm{position:absolute;left:13%;top:22%;width:85%;height:12%;min-height:12px;border-radius:6px;background:repeating-linear-gradient(125deg,#fff6df 0,#fff6df 24px,#b8513e 25px,#b8513e 48px);border:2px solid #836339;transform-origin:0 50%;box-shadow:0 3px 4px #0003;z-index:2}
.delivery-gate.is-open .delivery-gate-arm{transform:rotate(-85deg)}
.delivery-gate.is-open i{background:#4f995b}
.delivery-gate-label{position:absolute;top:86%;left:-15%;width:110%;background:#fff4df;border:2px solid #ac8244;border-radius:10px;padding:7px;font-size:clamp(12px,1.6vw,21px);font-weight:bold}
.delivery-gate:not(:disabled) .delivery-gate-label{box-shadow:0 0 0 4px #f1cb66}
@media(max-width:700px){.delivery-game{min-height:480px}.delivery-game .topbar{flex-wrap:wrap;font-size:13px}.delivery-message{min-height:56px}.delivery-loading{height:68%}.delivery-choices{height:28%;gap:5px;padding:6px}.delivery-choices .delivery-repeat{flex-basis:35px;font-size:20px}.delivery-spaces{width:74%;gap:4% 2%;top:16%;height:78%}.delivery-gate{right:1%;width:23%;height:23%}.delivery-panel{padding:16px}.delivery-panel button{font-size:17px}.delivery-space-name{font-size:10px}.delivery-driver-name{font-size:13px}}
@media(prefers-reduced-motion:reduce){.delivery-game *{animation:none!important;transition:none!important}}
@media(max-width:600px){.delivery-game .topbar{height:auto;min-height:100px;display:flex;flex-wrap:wrap;padding:6px;gap:5px}.delivery-game .topbar .title{width:100%}.delivery-game .topbar-actions{width:100%;justify-content:space-between;gap:4px}.delivery-game .topbar .score{font-size:12px}.delivery-game .topbar-progress-stars{display:none}}