/* The river is the playfield. Keep all controls outside the approach corridor. */
body.boat-runner-active #app-shell{visibility:hidden!important;pointer-events:none!important}
#boat-delivery-modal:has(.boat-in-run){padding:0;background:#429fb8;backdrop-filter:none}
#boat-delivery-modal .boat-card.boat-in-run{width:100vw;height:100dvh;max-width:none;max-height:none;border:0;border-radius:0;box-shadow:none;overflow:hidden}
#boat-delivery-modal .boat-in-run :is(.boat-content,.boat-game,.boat-stage){width:100%;height:100%;min-height:0;padding:0;margin:0;border:0;border-radius:0;box-shadow:none;overflow:hidden}
#boat-delivery-modal .boat-stage{isolation:isolate;background:#5db6ce}
#boat-delivery-modal .boat-stage>canvas{position:absolute;inset:0}
#boat-delivery-modal .runner-hud{position:absolute;z-index:3;top:max(16px,env(safe-area-inset-top));left:max(22px,env(safe-area-inset-left));right:max(22px,env(safe-area-inset-right));display:grid;grid-template-columns:185px minmax(190px,530px) 130px 56px;justify-content:space-between;align-items:start;gap:22px;pointer-events:none}
#boat-delivery-modal .runner-cargo,#boat-delivery-modal .runner-score{background:#fff0cfef;border:2px solid #815635;border-radius:16px 6px 16px 6px;padding:10px 16px;box-shadow:0 4px 0 #553c2866}
#boat-delivery-modal .runner-label{display:block;font:700 12px/1.4 'Segoe UI',sans-serif;letter-spacing:1px;color:#815635}
#boat-delivery-modal #boat-hearts{display:block;color:#9a402c;font:700 26px/1.3 'Segoe UI',sans-serif;letter-spacing:4px}
#boat-delivery-modal .runner-score strong{display:block;color:#7b5519;font:700 27px/1.3 Patrick,sans-serif;font-variant-numeric:tabular-nums}
#boat-delivery-modal .runner-score strong b{font-weight:700}
#boat-delivery-modal .runner-route{padding:10px 16px 13px;border:2px solid #e8c991;background:#60422deb;border-radius:7px 7px 17px 17px;box-shadow:0 4px 0 #3f493847;color:#fff3ce}
#boat-delivery-modal .runner-route-title{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px;font:700 22px/1.15 Patrick,sans-serif}
#boat-delivery-modal .runner-route-title b{font:600 12px 'Segoe UI',sans-serif;color:#e5c68f;white-space:nowrap}
#boat-delivery-modal .runner-track{position:relative;height:8px;background:#352c23;border:1px solid #99764e;border-radius:10px}
#boat-delivery-modal .runner-track i{display:block;height:100%;width:0;background:linear-gradient(90deg,#6dab91,#c7d576);border-radius:10px}
#boat-delivery-modal .runner-track span{position:absolute;top:-4px;width:14px;height:14px;border-radius:50%;background:#997347;border:2px solid #f0d69c;transform:translateX(-50%)}
#boat-delivery-modal .runner-track span:nth-of-type(1){left:33.33%}#boat-delivery-modal .runner-track span:nth-of-type(2){left:66.66%}#boat-delivery-modal .runner-track span:nth-of-type(3){left:100%}#boat-delivery-modal .runner-track span.done{background:#95c06b}
#boat-delivery-modal .boat-pause-btn{pointer-events:auto;width:56px;height:58px;padding:7px 5px 5px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;border:2px solid #f0d59f;border-radius:15px;background:linear-gradient(#704e32,#563b28);color:#fff3d4;box-shadow:0 4px #49311fcc,inset 0 1px #9f7955}
#boat-delivery-modal .boat-pause-btn .boat-pause-icon{display:flex;align-items:center;justify-content:center;gap:5px;height:20px}
#boat-delivery-modal .boat-pause-btn .boat-pause-icon i{display:block;width:5px;height:20px;border-radius:2px;background:#fff7d8;box-shadow:0 1px #3d291c}
#boat-delivery-modal .boat-pause-btn small{font:800 12px/1.25 'Segoe UI',sans-serif;letter-spacing:.7px;color:#f5d99f}
#boat-delivery-modal .boat-pause-btn:active{transform:translateY(2px);box-shadow:0 2px #49311fcc,inset 0 1px #9f7955}
#boat-delivery-modal .runner-order{position:absolute;top:112px;left:24px;padding:10px 14px 12px;background:#fff1d5e8;border-left:4px solid #bd793f;border-radius:2px 12px 12px 2px;max-width:210px;pointer-events:none;box-shadow:0 3px 10px #294e4433}
#boat-delivery-modal .runner-order b{display:block;margin:3px 0;font:700 21px/1.15 Patrick,sans-serif;color:#603b24}#boat-delivery-modal .runner-order>span:last-child{font:12px 'Segoe UI',sans-serif;color:#755537}
#boat-delivery-modal .runner-time{position:absolute;top:98px;right:98px;color:#3d5f54;font:600 12px 'Segoe UI',sans-serif;background:#eff7dcdf;border-radius:20px;padding:6px 12px;font-variant-numeric:tabular-nums}
#boat-delivery-modal .runner-time b{font-size:18px}
#boat-delivery-modal .boat-message{top:22%;z-index:4;background:#345e4eed;border:1px solid #d6ebbe;font-size:14px;box-shadow:0 3px 0 #26453555;white-space:normal;text-align:center;width:max-content;max-width:70%}
#boat-delivery-modal .boat-controls{position:absolute;z-index:7;inset:auto max(24px,env(safe-area-inset-right)) max(22px,env(safe-area-inset-bottom)) max(24px,env(safe-area-inset-left));display:flex;align-items:end;justify-content:center;pointer-events:none;margin:0}
/* The two thumb controls sit on opposite sides of the screen's centerline,
   leaving the middle of the river/boat visible. Both remain real buttons. */
#boat-delivery-modal .boat-turn{display:grid;grid-template-columns:84px minmax(64px,1fr) 84px;align-items:center;justify-items:center;width:min(455px,calc(100% - 155px));gap:0;pointer-events:none}
#boat-delivery-modal .boat-turn button{width:84px;min-width:0;pointer-events:auto}
#boat-delivery-modal .boat-turn [data-boat="left"]{grid-column:1;grid-row:1}
#boat-delivery-modal .boat-turn [data-boat="right"]{grid-column:3;grid-row:1}
#boat-delivery-modal .boat-controls button{height:76px;border:3px solid #efcc92;border-radius:22px;background:linear-gradient(145deg,#91623c,#523d2c);box-shadow:0 5px 0 #3c342bd9,inset 0 1px #f8dbaa;color:#fff5d8;font:700 62px/.7 Georgia;touch-action:manipulation;pointer-events:auto;user-select:none;-webkit-user-select:none}
#boat-delivery-modal .boat-turn small{grid-column:2;grid-row:1;text-align:center;font:700 12px/1.3 'Segoe UI',sans-serif;color:#f2ffed;text-shadow:0 1px 3px #275767;letter-spacing:.8px;pointer-events:none}
#boat-delivery-modal .runner-speed{position:absolute;right:0;bottom:10px;display:grid;grid-template-columns:auto auto;align-items:baseline;gap:1px 5px;color:#f2ffff;text-shadow:0 2px 5px #174954;font:600 12px 'Segoe UI',sans-serif;pointer-events:none}#boat-delivery-modal .runner-speed b{font:700 32px Patrick,sans-serif}
#boat-delivery-modal .runner-speed small{grid-column:1/-1;font:700 12px 'Segoe UI',sans-serif;letter-spacing:1px;color:#e3f5d7}
#boat-delivery-modal .runner-countdown{position:absolute;z-index:5;left:50%;top:36%;transform:translateX(-50%);font:700 110px/1.15 Patrick,sans-serif;color:#fff4cf;text-shadow:0 5px 0 #52796b,0 8px 30px #33596d;text-align:center}
#boat-delivery-modal .runner-countdown small{display:block;font:700 20px Patrick,sans-serif;white-space:nowrap}
#boat-delivery-modal .runner-combo{position:absolute;right:24px;top:30%;font:700 25px Patrick,sans-serif;color:#fff4c3;text-shadow:0 2px #54745e;pointer-events:none}
#boat-delivery-modal .boat-dock-dialog{position:absolute;z-index:5;left:50%;top:24%;transform:translateX(-50%);width:min(330px,76vw);padding:14px 22px;border:3px solid #d6b075;border-radius:18px;background:#fff0d0f5;color:#624129;box-shadow:0 5px 0 #79523488;text-align:center;pointer-events:none}
#boat-delivery-modal .boat-dock-dialog b{display:block;font:700 26px Patrick,sans-serif}#boat-delivery-modal .boat-dock-dialog span{display:block;margin:4px 0 10px;font:600 12px 'Segoe UI',sans-serif}
#boat-delivery-modal .runner-dock-meter{height:6px;background:#dcc59c;border-radius:8px;overflow:hidden}#boat-delivery-modal .runner-dock-meter i{display:block;height:100%;background:#70964b;width:0}
#boat-delivery-modal .boat-pause-screen{position:absolute;inset:0;z-index:10;background:#153f48ad;backdrop-filter:blur(5px);display:grid;place-items:center}
#boat-delivery-modal .boat-pause-dialog{width:min(420px,90%);padding:30px;border:3px solid #b18a54;border-radius:22px;background:#fff0ce;text-align:center;box-shadow:0 7px 0 #68492d}
#boat-delivery-modal .boat-pause-dialog .boat-resume-btn{display:flex;align-items:center;justify-content:center;gap:12px;min-height:58px;font-size:22px}
#boat-delivery-modal .boat-play-icon{width:0;height:0;border-top:10px solid transparent;border-bottom:10px solid transparent;border-left:16px solid #fff9dc;filter:drop-shadow(0 1px #496631)}
#boat-delivery-modal .boat-stage.is-paused :is(.runner-order,.runner-time,.boat-message,.boat-dock-dialog,.runner-combo,.runner-countdown){opacity:0!important;visibility:hidden!important}
#boat-delivery-modal [hidden]{display:none!important}
#boat-delivery-modal button:focus-visible{outline:3px solid #fffbe2;outline-offset:4px}
#boat-delivery-modal .runner-brief{padding:0;text-align:left}#boat-delivery-modal .runner-cover{padding:35px 35px 30px;min-height:260px;background:linear-gradient(90deg,#183f40ed,#1d566a70 65%,#23597508),url('assets/boat-scene-reference.webp') center 57%/cover}
#boat-delivery-modal .runner-eyebrow{font:800 12px 'Segoe UI',sans-serif;letter-spacing:2px;color:#75552e}
#boat-delivery-modal .runner-cover .runner-eyebrow{color:#ffe7b2}#boat-delivery-modal .runner-cover h2{color:#fff3d3;font-size:56px;line-height:1.15;margin:12px 0;text-shadow:0 3px #20483e}
#boat-delivery-modal .runner-cover p{color:#e1ecd5;margin:0;font-size:14px}
#boat-delivery-modal .runner-brief .boat-x{top:15px;right:15px}#boat-delivery-modal .runner-brief-body{padding:22px 28px}#boat-delivery-modal .runner-itinerary{display:flex;align-items:center;justify-content:space-between;gap:8px;color:#715633;font:700 12px 'Segoe UI',sans-serif}#boat-delivery-modal .runner-itinerary b{display:block;font:700 18px Patrick,sans-serif;color:#684831;margin-top:2px}#boat-delivery-modal .runner-itinerary i{font-size:19px;font-style:normal}
#boat-delivery-modal .runner-brief .boat-rule-grid{max-width:none;margin:20px 0;text-align:center}#boat-delivery-modal .runner-brief .boat-main{display:flex;justify-content:space-between;align-items:center;padding:15px 20px}#boat-delivery-modal .runner-brief .boat-tip{text-align:center;color:#785b3a!important;line-height:1.8}
@media(max-width:950px),(max-height:550px){
 #boat-delivery-modal .runner-hud{top:10px;left:12px;right:12px;grid-template-columns:125px minmax(170px,340px) 95px 48px;gap:12px}
 #boat-delivery-modal .runner-cargo,#boat-delivery-modal .runner-score{padding:6px 10px;border-radius:10px}
 #boat-delivery-modal .runner-label{font-size:11px;letter-spacing:.5px}#boat-delivery-modal .runner-cargo strong{font-size:21px;letter-spacing:3px}#boat-delivery-modal .runner-score strong{font-size:22px}
 #boat-delivery-modal .runner-route{padding:8px 12px 10px}#boat-delivery-modal .runner-route-title{font-size:19px;margin-bottom:9px}#boat-delivery-modal .runner-route-title b{font-size:11px}
 #boat-delivery-modal .boat-pause-btn{height:48px;width:48px;padding:5px 4px 4px;border-radius:12px}#boat-delivery-modal .boat-pause-btn .boat-pause-icon{height:17px}#boat-delivery-modal .boat-pause-btn .boat-pause-icon i{height:17px;width:4px}#boat-delivery-modal .boat-pause-btn small{font-size:11px}
 #boat-delivery-modal .runner-order{left:12px;top:92px;padding:7px 10px;max-width:165px}#boat-delivery-modal .runner-order b{font-size:17px}#boat-delivery-modal .runner-order>span:last-child{font-size:11px}
 #boat-delivery-modal .runner-time{top:76px;right:68px;font-size:11px;padding:3px 9px}#boat-delivery-modal .runner-time b{font-size:14px}
 #boat-delivery-modal .boat-controls{left:max(14px,env(safe-area-inset-left));right:max(14px,env(safe-area-inset-right));bottom:14px}#boat-delivery-modal .boat-turn{grid-template-columns:72px minmax(55px,1fr) 72px;width:min(425px,calc(100% - 110px));gap:0}
 #boat-delivery-modal .boat-controls button{height:66px;border-radius:17px;font-size:46px}#boat-delivery-modal .boat-turn button{width:72px}#boat-delivery-modal .boat-turn small{font-size:11px}
 #boat-delivery-modal .boat-message{font-size:11px;top:23%;padding:5px 12px}#boat-delivery-modal .runner-combo{font-size:20px;right:18px;top:36%}
 #boat-delivery-modal .runner-countdown{font-size:80px}#boat-delivery-modal .runner-countdown small{font-size:16px}#boat-delivery-modal .runner-speed b{font-size:24px}
}
@media(orientation:portrait){
 #boat-delivery-modal .runner-hud{grid-template-columns:1fr 90px 48px;gap:9px}#boat-delivery-modal .runner-route{grid-column:1/-1;grid-row:2;padding:9px 14px}#boat-delivery-modal .runner-cargo{max-width:155px}#boat-delivery-modal .runner-cargo strong{font-size:22px}
 #boat-delivery-modal .runner-order{top:170px;max-width:170px}#boat-delivery-modal .runner-time{top:171px;right:12px}#boat-delivery-modal .runner-combo{top:27%;font-size:19px}
 #boat-delivery-modal .boat-message{top:33%;max-width:86%}#boat-delivery-modal .boat-dock-dialog{top:30%}#boat-delivery-modal .boat-controls{bottom:max(25px,env(safe-area-inset-bottom))}#boat-delivery-modal .boat-turn{grid-template-columns:72px minmax(50px,1fr) 72px;width:min(340px,calc(100% - 22px))}#boat-delivery-modal .runner-speed{bottom:88px;right:4px}
 #boat-delivery-modal .runner-cover{padding:35px 22px 22px;min-height:225px}#boat-delivery-modal .runner-cover h2{font-size:43px}#boat-delivery-modal .runner-brief-body{padding:18px 16px}#boat-delivery-modal .runner-itinerary b{font-size:14px}#boat-delivery-modal .runner-itinerary{font-size:11px}
}
@media(orientation:landscape) and (max-height:500px){#boat-delivery-modal .runner-cover{min-height:170px;padding:20px 30px}#boat-delivery-modal .runner-cover h2{font-size:40px}#boat-delivery-modal .runner-brief-body{padding:15px 25px}#boat-delivery-modal .runner-brief .boat-rule-grid{margin:12px 0}}
