:root{font-family:"Trebuchet MS","Arial Rounded MT Bold",system-ui,sans-serif;color:#31484b;background:#59c8e9}*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;overflow:hidden}button,a{font:inherit}.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important}.routes-shell{width:100%;height:100svh;overflow:hidden}.routes-scene{--ratio:1.7777778;position:absolute;left:50%;top:50%;width:max(100%,calc(100svh * var(--ratio)));aspect-ratio:16/9;overflow:clip;isolation:isolate;transform:translate(-50%,-50%);background:#59c8e9}.routes-art{position:absolute;z-index:0;inset:0;background:var(--pw-ferry-routes-bg,url('/sky-ferry-routes.webp')) center/100% 100% no-repeat;transform:scale(1.006)}.routes-back,.routes-isles,.routes-wallet,.routes-prompt{position:absolute;z-index:25;border:3px solid rgba(255,255,255,.9);background:rgba(255,250,231,.96);box-shadow:0 5px 0 rgba(60,72,58,.25)}.routes-back,.routes-isles{top:2.3%;display:flex;align-items:center;gap:7px;min-height:50px;border-radius:999px;color:#365d58;padding:5px 15px;text-decoration:none;font-weight:1000}.routes-back{left:2%}.routes-back span{font-size:32px;line-height:.7}.routes-isles{left:11.5%}.routes-wallet{right:2%;top:2.3%;display:flex;align-items:center;gap:6px;min-width:92px;height:52px;border-radius:999px;padding:6px 15px;font-size:21px}.routes-wallet span{display:grid;place-items:center;width:29px;height:29px;border-radius:50%;background:#f2c953;color:#644d24;font-weight:1000}.routes-prompt{left:50%;top:2%;width:min(46%,700px);min-height:59px;border-radius:24px;padding:8px 18px;color:#34554f;font-size:clamp(20px,1.55vw,27px);font-weight:1000;line-height:1.15;transform:translateX(-50%);cursor:pointer}.route-progress{position:absolute;z-index:20;left:50%;top:10%;display:flex;gap:8px;transform:translateX(-50%)}.route-progress i{width:25px;height:15px;border:3px solid rgba(255,255,255,.9);border-radius:50%;background:#98a897;box-shadow:0 3px 0 rgba(50,67,54,.2)}.route-progress i.active,.route-progress i.done{background:#f4d267;box-shadow:0 0 10px rgba(255,224,100,.9)}.painted-map{position:absolute;z-index:5;left:2.4%;top:28%;width:34%;height:36%;pointer-events:none}.route-pin{position:absolute;display:grid;place-items:center;width:55px;height:55px;border:4px solid #fff7c2;border-radius:50%;background:#f2cb61;box-shadow:0 5px 0 rgba(83,63,31,.25),0 0 18px rgba(255,229,110,.84);font-size:26px;cursor:pointer;pointer-events:auto;touch-action:manipulation;animation:routePulse 2.4s ease-in-out infinite}.route-pin small{position:absolute;left:50%;top:106%;width:max-content;border-radius:999px;background:rgba(42,70,69,.94);color:white;padding:5px 9px;font-size:11px;font-weight:1000;opacity:0;transform:translateX(-50%);transition:opacity .18s}.route-pin:hover small,.route-pin:focus-visible small{opacity:1}.route-cloudberry{left:15%;top:47%}.route-lantern{left:48%;top:18%}.route-storm{right:4%;top:52%}.cargo-deck{position:absolute;z-index:7;left:33%;bottom:4%;width:39%;height:43%;pointer-events:none}.cargo-bay{position:absolute;left:25%;top:8%;width:52%;height:55%;display:grid;place-items:center;border:6px dashed rgba(255,237,165,.72);border-radius:50%;color:rgba(255,246,197,.8);font-size:60px;opacity:0;transition:opacity .2s}.cargo-deck.is-active .cargo-bay{opacity:1}.cargo-piece{position:absolute;display:grid;place-items:center;width:70px;height:70px;border:0;border-radius:20px;background:linear-gradient(#c18a4e,#8c5e32);box-shadow:inset 0 0 0 5px #e0b66d,0 8px 0 rgba(80,51,29,.25);font-size:39px;cursor:pointer;pointer-events:auto;touch-action:none;opacity:0;transform:translateY(15px);transition:opacity .25s,transform .25s}.cargo-deck.is-active .cargo-piece{opacity:1;transform:none}.cargo-berries{left:-4%;bottom:3%}.cargo-lanterns{left:18%;bottom:0}.cargo-seedlings{left:40%;bottom:2%}.cargo-piece.is-loaded{left:45%!important;top:24%!important;bottom:auto!important;transform:scale(1.12)!important;box-shadow:inset 0 0 0 5px #e0b66d,0 0 20px 7px rgba(255,230,123,.7)}.fuel-station{position:absolute;z-index:10;right:1.5%;top:29%;width:16%;height:39%;display:flex;align-items:flex-end;justify-content:center;gap:8px;padding-bottom:5%;pointer-events:none;opacity:0;transition:opacity .25s}.fuel-station.is-active{pointer-events:auto;opacity:1}.fuel-station button{display:grid;place-items:center;width:66px;height:78px;border:4px solid rgba(255,255,255,.92);border-radius:50% 50% 42% 42%;background:rgba(31,118,118,.25);color:white;filter:drop-shadow(0 0 10px #66e9e0);cursor:pointer}.fuel-station button span{font-size:37px}.fuel-station button b{font-size:13px}.fuel-station output{position:absolute;left:50%;bottom:-4%;min-width:78px;border:3px solid white;border-radius:999px;background:#355f5a;color:white;padding:7px;text-align:center;font-size:20px;font-weight:1000;transform:translateX(-50%)}.safety-pouches{position:absolute;z-index:15;left:42%;bottom:6%;display:flex;gap:10px}.safety-pouches button{display:grid;place-items:center;width:72px;height:72px;border:4px solid #fff0b3;border-radius:50%;background:#ae7643;color:white;box-shadow:0 6px 0 rgba(73,45,26,.25);cursor:pointer}.safety-pouches span{font-size:30px}.safety-pouches b{font-size:14px}.safety-pouches button[aria-pressed="true"]{background:#5e996f;box-shadow:0 0 18px 7px rgba(136,226,151,.65)}.flight-wheel{position:absolute;z-index:16;right:24.7%;top:28%;display:grid;place-items:center;width:84px;height:84px;border:5px solid #fff0a5;border-radius:50%;background:radial-gradient(circle,#fff5b4,#bb772d);box-shadow:0 7px 0 rgba(73,49,27,.3),0 0 22px rgba(255,220,102,.8);color:#67451d;font-weight:1000;cursor:pointer;animation:wheelGlow 1.8s ease-in-out infinite}.flight-wheel[hidden],.safety-pouches[hidden]{display:none}.flight-wheel span{font-size:31px}.flight-wheel b{font-size:12px}.routes-scene.is-flying .routes-art{animation:skyRush 2.1s ease-in-out}.routes-scene.is-flying .flight-wheel{animation:wheelSpin 1s linear 2}.weather-effect{position:absolute;z-index:12;inset:10% 0 0;overflow:hidden;pointer-events:none;opacity:0}.weather-effect i{position:absolute;top:-10%;width:5px;height:50px;border-radius:999px;background:#b8f0ff;transform:rotate(17deg);animation:rainFall .7s linear infinite}.weather-effect i:nth-child(1){left:15%}.weather-effect i:nth-child(2){left:31%;animation-delay:.2s}.weather-effect i:nth-child(3){left:49%;animation-delay:.4s}.weather-effect i:nth-child(4){left:67%;animation-delay:.1s}.weather-effect i:nth-child(5){left:85%;animation-delay:.3s}.routes-scene.has-weather .weather-effect{opacity:.78}@keyframes routePulse{50%{transform:scale(1.11);box-shadow:0 5px 0 rgba(83,63,31,.2),0 0 26px 7px rgba(255,229,110,.58)}}@keyframes wheelGlow{50%{transform:scale(1.08)}}@keyframes wheelSpin{to{transform:rotate(360deg)}}@keyframes skyRush{50%{filter:brightness(1.16) saturate(1.18);transform:scale(1.04)}}@keyframes rainFall{to{transform:translate(70px,850px) rotate(17deg)}}
.routes-dialog{width:min(650px,calc(100vw - 28px));max-height:min(92dvh,780px);overflow:auto;border:5px solid #c5a664;border-radius:30px;background:#fffaf0;padding:clamp(20px,4vw,34px);color:#3f453e;text-align:center;box-shadow:0 25px 80px rgba(30,45,43,.42)}.routes-dialog::backdrop{background:rgba(34,55,58,.64);backdrop-filter:blur(5px)}.routes-dialog .dialog-icon{display:grid;place-items:center;width:78px;height:78px;margin:0 auto 10px;border:4px solid white;border-radius:50%;background:#f1d16c;box-shadow:0 6px 0 rgba(94,73,33,.18);font-size:40px}.dialog-eyebrow{margin:0;color:#66836f;font-size:12px;font-weight:1000;letter-spacing:.12em}.routes-dialog h2{margin:5px 0 10px;font-size:clamp(30px,6vw,45px);line-height:1}.routes-dialog>p:not(.dialog-eyebrow){font-size:clamp(17px,2.5vw,21px);line-height:1.4}.dialog-close{position:absolute;right:13px;top:13px;width:48px;height:48px;border:0;border-radius:50%;background:#e8dfce;color:#594f42;font-size:31px;font-weight:1000;cursor:pointer}.dialog-primary{display:inline-grid;place-items:center;min-height:58px;border:0;border-radius:999px;background:#4e8064;color:white;padding:11px 24px;font-size:19px;font-weight:1000;text-decoration:none;cursor:pointer;box-shadow:0 5px 0 rgba(44,77,57,.25)}.route-numbers{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:18px 0}.route-numbers div{display:grid;gap:4px;border:3px solid #d5c498;border-radius:18px;background:#fff6d6;padding:13px}.route-numbers small{font-size:10px;font-weight:1000}.route-numbers strong{font-size:25px}.route-weather{border-radius:16px;background:#e7f3e1;padding:11px;font-weight:900}.weather-equation{border:3px solid #b9cda8;border-radius:18px;background:#eff7e8;padding:14px;font-size:22px;font-weight:1000}.profit-equation{display:flex;align-items:center;justify-content:center;gap:9px;margin:20px 0}.profit-equation span{display:grid;gap:4px;min-width:105px;border:3px solid #d9c58f;border-radius:17px;background:#fff5d4;padding:12px}.profit-equation small{font-size:10px;font-weight:1000}.profit-equation strong{font-size:25px}.profit-equation>b{font-size:26px}.profit-choices,.allocation-options{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.profit-choices button,.allocation-options button{min-height:58px;border:3px solid #d1b56d;border-radius:18px;background:#fff1bd;color:#544425;font-size:22px;font-weight:1000;cursor:pointer}.profit-choices button:focus-visible,.allocation-options button:focus-visible,.route-pin:focus-visible,.cargo-piece:focus-visible,.fuel-station button:focus-visible,.flight-wheel:focus-visible,.routes-prompt:focus-visible,.routes-back:focus-visible,.routes-isles:focus-visible,.routes-dialog button:focus-visible,.routes-dialog a:focus-visible{outline:4px solid #72b9aa;outline-offset:3px}.allocation-result{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:16px 0}.allocation-result span{display:grid;border:3px solid #c6c89c;border-radius:18px;background:#f5f6dd;padding:12px}.allocation-result small{font-size:11px;font-weight:1000}.allocation-result strong{font-size:25px}.allocation-options button[aria-pressed="true"]{border-color:#fff;background:#5f9a71;color:white;box-shadow:0 0 16px 5px rgba(111,190,128,.6)}
@media(orientation:portrait){.routes-scene{left:50%;top:0;width:calc(100svh * var(--ratio));height:100svh;max-width:none;aspect-ratio:auto;transform:translateX(-50%)}.routes-back{left:calc((100% - 100vw)/2 + 14px);top:calc(env(safe-area-inset-top) + 10px)}.routes-isles{left:calc((100% - 100vw)/2 + 142px);top:calc(env(safe-area-inset-top) + 10px)}.routes-wallet{right:calc((100% - 100vw)/2 + 14px);top:calc(env(safe-area-inset-top) + 10px)}.routes-prompt{top:calc(env(safe-area-inset-top) + 9px);width:min(34%,650px)}}@media(orientation:landscape) and (max-aspect-ratio:5/3){.routes-scene{width:calc(100svh * var(--ratio));height:100svh;max-width:none;aspect-ratio:auto}.routes-back{left:calc((100% - 100vw)/2 + 14px)}.routes-isles{left:calc((100% - 100vw)/2 + 142px)}.routes-wallet{right:calc((100% - 100vw)/2 + 14px)}}@media(max-width:650px){.routes-back b,.routes-isles b{display:none}.routes-isles{padding:5px 12px}.route-numbers,.profit-choices,.allocation-options{grid-template-columns:1fr}.profit-equation{flex-wrap:wrap}.routes-dialog{padding:20px 16px}}@media(prefers-reduced-motion:reduce){.route-pin,.flight-wheel,.weather-effect i,.routes-scene.is-flying .routes-art{animation:none!important}}
.route-pin[aria-disabled="true"]{filter:grayscale(1);opacity:.62;animation:none}.route-pin[aria-pressed="true"]{background:#68a777;box-shadow:0 5px 0 rgba(47,78,53,.25),0 0 19px rgba(134,225,147,.8)}.complete-actions{display:grid;gap:9px}.complete-actions a{display:grid;place-items:center;min-height:50px;border:3px solid #b4c9ae;border-radius:999px;background:#eff6e6;color:#466d5d;text-decoration:none;font-weight:1000}.route-complete-dialog .dialog-icon{background:#7fc58e;color:white}
.route-upgrade{margin:-5px 0 15px!important;border-radius:15px;background:#f2e4ff;padding:10px!important;color:#654e70;font-size:14px!important;font-weight:900}
.cargo-piece.is-dragging{z-index:30;transition:none;filter:drop-shadow(0 15px 8px rgba(64,45,29,.34))}
.route-logbook{position:absolute;left:68%;top:76%;display:grid;place-items:center;width:72px;height:58px;border:3px solid #f3d896;border-radius:8px 13px 13px 8px;background:linear-gradient(90deg,#70472c 0 10%,#9b673b 11% 100%);box-shadow:0 7px 0 rgba(64,41,25,.28),inset -5px 0 rgba(255,224,157,.18);font-size:35px;pointer-events:auto;cursor:pointer;touch-action:manipulation;transform:rotate(-6deg);transition:transform .18s,filter .18s}.route-logbook:hover,.route-logbook:focus-visible{filter:brightness(1.16);transform:rotate(-3deg) scale(1.08)}.route-logbook.has-routes{animation:logbookGlow 2.8s ease-in-out 2}@keyframes logbookGlow{50%{box-shadow:0 7px 0 rgba(64,41,25,.28),0 0 24px 8px rgba(255,222,108,.8)}}
.logbook-dialog{width:min(760px,calc(100vw - 28px));background:linear-gradient(90deg,#fff9e8 0 49.4%,#dfc994 49.5% 50.5%,#fff9e8 50.6%);border-color:#8d633e}.logbook-dialog .dialog-icon{background:#98633d}.logbook-totals{display:flex;align-items:center;justify-content:center;gap:10px;margin:18px 0}.logbook-totals span,.logbook-split span{display:grid;gap:4px;min-width:120px;border:3px solid #cfb87f;border-radius:15px;background:rgba(255,247,210,.9);padding:11px}.logbook-totals small,.logbook-split small{font-size:11px;font-weight:1000}.logbook-totals strong,.logbook-split strong{font-size:25px}.logbook-totals>b{font-size:26px}.logbook-split{display:grid;grid-template-columns:1fr 1fr;gap:12px}.logbook-challenge,.logbook-insight{margin:14px 0 0!important;border-radius:15px;padding:12px!important;font-size:17px!important;font-weight:1000}.logbook-challenge{background:#e4f1db;color:#42644b}.logbook-insight{background:#e9e1f5;color:#5c4d6e}.logbook-insight:empty{display:none}.logbook-empty{font-weight:900}.logbook-empty[hidden]{display:none}.logbook-history{display:grid;gap:9px;margin-top:14px;text-align:left}.logbook-entry{display:grid;grid-template-columns:minmax(135px,1.2fr) minmax(180px,1.8fr) minmax(150px,1fr);align-items:center;gap:10px;border-bottom:2px dashed #c6aa70;padding:9px 5px}.logbook-entry:last-child{border-bottom:0}.logbook-entry-title{display:flex;align-items:center;gap:8px;font-weight:1000}.logbook-entry-title i{font-style:normal;font-size:26px}.logbook-entry-equation{font-size:18px;font-weight:1000}.logbook-entry-split{text-align:right;color:#516858;font-size:14px;font-weight:900}
@media(max-width:650px){.logbook-totals{flex-wrap:wrap}.logbook-totals span{min-width:95px}.logbook-entry{grid-template-columns:1fr}.logbook-entry-split{text-align:left}}
@media(prefers-reduced-motion:reduce){.route-logbook.has-routes{animation:none!important}}
@media(orientation:portrait){.painted-map{left:calc((100% - 100vw)/2 + 14px)}.fuel-station{right:calc((100% - 100vw)/2 + 14px)}}
@media(orientation:landscape) and (max-aspect-ratio:5/3){.painted-map{left:calc((100% - 100vw)/2 + 14px)}.fuel-station{right:calc((100% - 100vw)/2 + 14px)}}
/* Clip the oversized painted scene to its own screen, including tablet widths. */
.routes-shell{position:relative;isolation:isolate}
