:root{color:#fdf0cf;font-synthesis:none;--ink:#214d53;--cream:#fff0ce;--gold:#f4c46d;--coral:#ec8868;background:#173d47;font-family:Trebuchet MS,Arial,sans-serif}*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;overflow:hidden}body{justify-content:center;align-items:center;display:flex}button,input,select{font:inherit}button,a,input,select{touch-action:manipulation}button{cursor:pointer;color:inherit;border:0}button:disabled{cursor:default;opacity:.42}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline-offset:5px;outline:3px solid #a8fff1}#app{background:#173d47;width:min(100vw,177.778dvh);height:min(100dvh,56.25vw);position:relative;overflow:hidden;container-type:size}#game{position:absolute;inset:0}#game canvas{display:block}#hud,#overlay{pointer-events:none;position:absolute;inset:0}#hud[hidden],#overlay[hidden],#touch[hidden],#dialogue[hidden]{display:none}#overlay{pointer-events:auto;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:linear-gradient(90deg,#153d49de,#173d4970 55%,#173d4920);justify-content:center;align-items:center;padding:30px;display:flex}h1,h2,h3,p{margin:0}h1{letter-spacing:-3px;color:var(--cream);text-shadow:0 4px #25505c,0 7px 16px #1c51524d;font-size:clamp(42px,5vw,74px);font-weight:900;line-height:1.05}h1 span{color:var(--gold);padding:0 4px;font:italic 58px Georgia,serif}h2{letter-spacing:-1.3px;color:var(--cream);font-size:clamp(28px,3vw,42px);line-height:1.15}p{color:#e2eddf;font-size:17px;line-height:1.65}button{background:#234e53d9;border-radius:12px;padding:12px 24px;font-size:17px;font-weight:700;transition:transform .12s,background .12s}button:hover:not(:disabled){background:#37696d;transform:translateY(-2px)}button.primary{background:var(--gold);color:#29454a;padding:17px 32px;font-size:21px;box-shadow:0 5px #9c713a}button.primary:hover{background:#ffe3a1}button.secondary{background:#f8ecd71c;border:1px solid #f8ecd766}button.text{color:#e3f5e6;background:0 0;padding:12px 18px}.danger{color:#ffc5aa!important}a{color:#b4ffef}svg{vertical-align:middle;width:24px;height:24px}.loading{text-align:center}.loading h1{font-size:52px}.loading p{margin-top:25px}.title-screen{justify-content:space-between;align-items:center;width:min(1100px,100%);min-height:min(560px,85cqh);padding:0 24px;display:flex;position:relative}.title-copy{z-index:2;max-width:660px}.title-copy h2{color:#eacd91;letter-spacing:3px;text-transform:uppercase;margin:15px 0 28px;font-size:clamp(25px,3vw,40px);font-weight:500}.title-copy p{margin-bottom:32px;font-size:20px}.title-actions{flex-wrap:wrap;gap:14px;max-width:500px;display:flex}.title-small{gap:8px;margin-top:27px;display:flex}.title-small button{background:0 0;padding-left:0;padding-right:22px;font-size:15px}.title-buddies{filter:drop-shadow(0 14px 10px #173d4955);align-items:center;gap:0;display:flex}.title-buddies img{image-rendering:auto;width:clamp(140px,19vw,260px)}.title-buddies img:first-child{margin-top:35px;margin-right:-45px;transform:rotate(-7deg)}.title-buddies img:last-child{transform:rotate(6deg)}.title-foot{color:#cae7dd;justify-content:space-between;font-size:13px;display:flex;position:absolute;bottom:0;left:24px;right:24px}.menu-panel{text-align:center;background:#1c464dec;border:1px solid #aacdc048;border-radius:24px;width:min(580px,100%);max-height:calc(100cqh - 50px);padding:36px 40px;overflow:auto;box-shadow:0 20px 80px #122f4260}.menu-panel h2{margin-bottom:14px}.menu-panel p{margin:8px 0 18px}.menu-actions{gap:9px;margin-top:25px;display:grid}.menu-actions button{background:#436a6644}.menu-actions .primary{background:var(--gold)}.settings{text-align:left}.settings label{justify-content:space-between;align-items:center;margin:24px 0;font-size:19px;font-weight:700;display:flex}.settings input[type=range]{width:53%;accent-color:var(--gold)}.settings input[type=checkbox]{accent-color:#92d5b6;width:24px;height:24px}.setting-note{color:#b7d4cd!important;font-size:13px!important}.settings-footer{justify-content:space-between;align-items:center;margin-top:30px;display:flex}.controls-panel{width:min(770px,100%)}.controls-panel p{font-size:14px}.control-table>div{text-align:left;border-top:1px solid #c3e0cf20;grid-template-columns:1.4fr 1fr 1fr;align-items:center;gap:12px;padding:4px 0;display:grid}.control-table button{background:#5179745e;padding:8px 10px;font-size:14px}.control-table small{color:#b8d9d4}.controls-panel>.primary{margin-top:12px}.story-screen{grid-template-columns:1fr 1.2fr;align-items:center;gap:60px;width:min(970px,100%);display:grid}.story-screen h2{margin-bottom:22px}.story-screen p{margin-bottom:20px;font-size:19px}.story-art{text-align:center}.story-art img{filter:drop-shadow(0 14px 20px #172f4459);width:340px;transform:rotate(-5deg)}.buddy-line{font-style:italic;color:#f4d28e!important}.map-screen{width:min(1150px,100%);max-height:calc(100cqh - 50px);overflow:auto}.map-heading{justify-content:space-between;align-items:center;margin-bottom:34px;display:flex}.map-heading p{margin-top:8px}.map-heading button svg{margin-right:10px}.island-route{grid-template-columns:repeat(4,1fr);gap:23px;display:grid}.island h3{color:var(--world);min-height:55px;margin:15px 0 20px;font-size:23px;line-height:1.2}.island-picture{background-image:var(--island-bg);border-bottom:5px solid var(--world);background-position:50%;background-size:cover;border-radius:54% 47% 40% 43%;width:100%;height:142px;box-shadow:0 9px 24px #153d4980}.island ol{margin:0;padding:0;list-style:none}.island li button{text-align:left;background:#244953a3;border-radius:8px;align-items:center;gap:12px;width:100%;margin:6px 0;padding:12px 7px;font-size:15px;display:flex}.island b{border:1px solid var(--world);color:var(--world);border-radius:50%;flex:none;place-items:center;width:32px;height:32px;font-size:12px;display:grid}.island small{color:#bdcfcc;margin-top:5px;font-size:11px;line-height:1.3;display:block}.map-note{text-align:center;margin-top:26px;font-size:13px}.results>img{height:120px}.result-stats{justify-content:space-around;gap:14px;margin:25px 0;display:flex}.result-stats div{flex-direction:column;display:flex}.result-stats strong{color:var(--gold);font-size:31px}.result-stats span{color:#b7d4cb;margin-top:6px;font-size:12px}.results>.primary,.results>.secondary{margin:9px}.credits p{font-size:16px}#hud{text-shadow:0 2px 4px #1c535c99;justify-content:space-between;align-items:flex-start;padding:20px 25px;display:flex}#hud button{pointer-events:auto}.hud-left{background:#153e49b8;border-radius:55px 16px 16px 55px;align-items:center;gap:12px;padding:6px 14px 10px 5px;display:flex}.hero-token{background:#8dc7bb;border:3px solid #f1cb82;border-radius:50%;width:76px;height:76px}.hud-left strong{letter-spacing:1px;font-size:20px}.hearts{color:#f66f80;gap:5px;margin:5px 0;display:flex}.hearts svg{filter:drop-shadow(0 2px #a6384c);width:27px;height:25px}.hearts .empty{color:#719593;opacity:.6}.collectibles{align-items:center;gap:11px;font-size:21px;display:flex}.collectibles>span{align-items:center;gap:5px;display:flex}.collectibles svg{color:#b0f9ee;width:19px;height:19px}.collectibles i{background:#d6ddbe8c;width:1px;height:20px}.medallions b{color:#8b937c;border:2px solid #c9b379;border-radius:50%;place-items:center;width:23px;height:23px;font-size:15px;display:grid}.medallions b.found{color:#ffe7a2;background:#b68a44}.level-sign{color:#285359;text-align:center;min-width:280px;text-shadow:none;background:#f6d69a;border:2px solid #c79b60;border-radius:4px 10px 4px 9px;padding:12px 28px;position:absolute;top:16px;left:50%;transform:translate(-50%)rotate(-1deg);box-shadow:0 5px #a77842,0 8px 14px #36626640}.level-sign:before,.level-sign:after{content:"";background:#8d613c;width:5px;height:20px;position:absolute;top:-18px}.level-sign:before{left:28px}.level-sign:after{right:28px}.level-sign strong{font-size:23px;font-weight:900;display:block}.level-sign span{letter-spacing:3px;text-transform:uppercase;margin-top:5px;font-size:12px;display:block}.hud-right{gap:8px;display:flex}.hud-right button{color:#f0efd9;background:#184650c7;border:2px solid #deebd5;border-radius:50%;padding:10px}.hud-right svg{width:23px;height:23px}.route-progress{background:#1c53554d;border-radius:3px;height:3px;position:absolute;top:100px;left:35%;right:35%;overflow:hidden}.route-progress span{background:#ffe2a6;height:3px;display:block}.control-strip{color:#eef8e7;text-shadow:none;background:#183e4d87;border-radius:9px;gap:16px;padding:10px 14px;font-size:12px;display:flex;position:absolute;bottom:24px;left:27px}.control-strip span{align-items:center;gap:4px;display:flex}.control-strip.near-buddy span:last-child{color:#fff4a7}kbd{text-align:center;background:#1e515b66;border:1px solid #b3e1d9;border-radius:4px;min-width:24px;padding:5px 6px;font:12px Trebuchet MS}#dialogue{text-align:center;pointer-events:none;background:#204d53e8;border:1px solid #d6e7cf66;border-radius:15px;max-width:80%;padding:12px 22px;font-size:16px;position:absolute;bottom:85px;left:50%;transform:translate(-50%)}#storage-warning{z-index:30;background:#603d37;border-radius:8px;padding:8px;font-size:12px;position:absolute;bottom:8px;left:50%;transform:translate(-50%)}#rotate{display:none}#touch{pointer-events:none;z-index:15;display:none;position:absolute;inset:0}.touch-move{left:max(15px,env(safe-area-inset-left));bottom:max(18px,env(safe-area-inset-bottom));grid-template-columns:repeat(2,55px);gap:6px;display:grid;position:absolute}.touch-action{right:max(15px,env(safe-area-inset-right));bottom:max(18px,env(safe-area-inset-bottom));grid-template-columns:repeat(2,65px);gap:7px;display:grid;position:absolute}#touch button{pointer-events:auto;background:#224f58ba;border:1px solid #e1e9ce99;border-radius:50%;min-height:52px;padding:6px;font-size:12px}.studio{z-index:50;background:#173d47;min-height:100dvh;padding:30px;position:relative;overflow:auto}.studio h1{font-size:42px}.studio-layout{grid-template-columns:300px 1fr;gap:30px;margin-top:30px;display:grid}.studio label{flex-direction:column;gap:8px;margin:15px 0;display:flex}.studio select{color:#244d54;background:#fff0ce;border-radius:8px;padding:10px}.studio canvas{border-radius:15px;width:min(540px,100%);box-shadow:0 12px 32px #102b3655}.studio .studio-buttons{flex-wrap:wrap;gap:8px;display:flex}.studio .studio-buttons button{font-size:14px}.studio p{margin:10px 0;font-size:14px}:is(html:has(.studio),body:has(.studio)){overflow:auto}#app:has(.studio){width:100vw;height:100dvh;overflow:auto}@media (width<=1000px){#overlay{padding:22px}.title-screen{min-height:min(460px,85cqh);padding:0 14px}.title-copy h1{font-size:56px}.title-copy h2{font-size:25px}.title-copy p{font-size:17px}.title-buddies img{width:180px}.island-route{gap:14px}.island h3{font-size:20px}.island-picture{height:110px}.hud-left strong{font-size:16px}.hero-token{width:62px;height:62px}.level-sign{min-width:240px;padding:8px 14px}.level-sign strong{font-size:20px}.hud-right button{padding:8px}.hud-right svg{width:20px;height:20px}.control-strip{gap:10px}.map-screen h2{font-size:30px}}@media (pointer:coarse),(width<=950px) and (orientation:landscape){#touch:not([hidden]){display:block}.control-strip{display:none}#dialogue{bottom:155px}}@media (height<=560px){#overlay{padding:18px}.title-screen{min-height:calc(100dvh - 40px)}.title-copy h1{font-size:45px}.title-copy h2{margin:10px 0 14px;font-size:23px}.title-copy p{margin-bottom:16px;font-size:16px;line-height:1.5}.title-small{margin-top:12px}.title-foot{display:none}.title-buddies img{width:160px}.title-actions button.primary{padding:12px 22px;font-size:18px}.menu-panel{padding:24px 30px}.menu-panel h2{font-size:29px}.menu-actions{gap:6px;margin-top:13px}.menu-actions button{padding:9px 18px;font-size:15px}.story-screen{gap:30px}.story-art img{width:240px}.story-screen h2{font-size:30px}.story-screen p{margin-bottom:13px;font-size:16px}.hud-left{transform-origin:0 0;transform:scale(.75)}.level-sign{transform-origin:top;transform:translate(-50%)rotate(-1deg)scale(.8)}.hud-right{transform-origin:100% 0;transform:scale(.8)}#hud{padding:12px 15px}.route-progress{top:82px}.map-heading{margin-bottom:16px}.island h3{min-height:40px;margin:9px 0;font-size:18px}.island-picture{height:75px}.island li button{padding:8px 4px;font-size:12px}.map-note{font-size:11px}.control-strip{font-size:10px;bottom:14px}.result-stats{margin:10px 0}.results>img{height:65px}.results h2{font-size:30px}}@media (width<=650px) and (orientation:portrait){#rotate{z-index:100;text-align:center;background:#173d47;flex-direction:column;justify-content:center;align-items:center;gap:16px;padding:25px;display:flex;position:absolute;inset:0}#rotate p{font-size:28px;font-weight:700}.studio-layout{grid-template-columns:1fr}#rotate:has(~.studio){display:none}}@media (prefers-reduced-motion:reduce){button{transition:none}}.title-buddies .buddy-title-art{width:clamp(260px,40vw,520px);margin:0;transform:none}.title-copy{min-width:52%}.title-buddies{max-width:48%}.title-buddies .buddy-title-art{max-width:100%}.hero-token{object-fit:cover}@media (width<=950px) and (orientation:landscape){.touch-move{bottom:max(10px,env(safe-area-inset-bottom));grid-template-columns:repeat(4,44px);gap:5px}.touch-action{bottom:max(10px,env(safe-area-inset-bottom));grid-template-columns:repeat(4,48px);gap:5px}#touch button{min-height:44px}}