@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700;800;900&family=Nunito:wght@500;600;700;800;900&display=swap');
:root{--ink:#09293f;--yellow:#ffdb45;--pink:#ff7eca;--purple:#6839ba;--muted:#a9d9e5}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#062c47;color:white;font-family:Nunito,Arial,sans-serif}button{font:800 13px Nunito,Arial,sans-serif;cursor:pointer;border:0;color:inherit}button:focus-visible,a:focus-visible{outline:3px solid #fff;outline-offset:5px}button:disabled{cursor:wait;opacity:.6}#game{position:relative;width:100%;height:100%;overflow:hidden}#world{display:block;width:100%;height:100%;touch-action:none}.vignette{pointer-events:none;position:absolute;inset:0;box-shadow:inset 0 0 130px #00284066;background:linear-gradient(#022b4b80,transparent 23%,transparent 78%,#031c3c77)}header{position:absolute;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;padding:22px 32px;pointer-events:none}header>*{pointer-events:auto}.brand{font-family:'Barlow Condensed',Impact,sans-serif;font-size:42px;font-weight:900;line-height:.8;background:none;text-shadow:2px 3px #06293c,-1px -1px #06293c;color:var(--yellow);letter-spacing:-1px;text-align:left}.crown{font-size:30px;color:var(--yellow);vertical-align:5px}.brand-sub{font:800 8px Nunito,sans-serif;display:block;letter-spacing:2px;margin:10px 0 0 36px;color:white;text-shadow:none}nav{display:flex;gap:10px;align-items:center}nav button{border:2px solid #102a43;background:var(--yellow);color:var(--ink);border-radius:12px;padding:12px 20px;box-shadow:0 4px #07233980}nav button span{margin-left:15px}.icon{width:44px;height:44px;padding:0!important;background:#082e49d9!important;color:white!important;font-size:23px}.location{position:absolute;top:108px;left:34px;display:flex;align-items:center;gap:9px;font:800 10px Nunito;letter-spacing:1.5px;background:#082e49df;padding:10px 14px;border-radius:30px;border:1px solid #80d6e648;pointer-events:none}.live-dot{width:6px;height:6px;border-radius:50%;background:#ffdd4a;box-shadow:0 0 10px #ffdd4a}.bottom{position:absolute;bottom:20px;left:32px;right:26px;display:flex;align-items:flex-end;justify-content:space-between;pointer-events:none;gap:14px}.bottom button{pointer-events:auto}.instructions{font-size:10px;letter-spacing:1px;background:#06283bd4;border:1px solid #b3f5ff44;border-radius:30px;padding:12px 18px;align-self:flex-end}.instructions i{margin:0 8px;color:#ffdb45}.key{color:#ffdb45;font-size:17px;vertical-align:-1px;margin-right:9px}.inflate{position:absolute;left:50%;transform:translateX(-50%);bottom:0;background:#28204aeb;border:2px solid var(--pink);padding:11px 20px;border-radius:16px;box-shadow:0 4px #06283b;color:var(--pink);font-size:19px;line-height:1.1}.inflate span{font-size:11px;margin-left:7px}.inflate small{font-size:8px;letter-spacing:2px;display:block;margin-top:4px;color:white}.map{background:#08283de8;border:2px solid #ffdb45;border-radius:20px;padding:7px;width:137px;box-shadow:0 5px #041b30}.map-art{height:91px;display:block;background:linear-gradient(140deg,#73d5df,#2192b3);position:relative;border-radius:13px;overflow:hidden}.map-path{position:absolute;left:23%;top:18%;width:60%;height:64%;border:8px solid #ead89a;border-radius:50%;transform:rotate(-20deg)}.pin{position:absolute;color:#813f9f;font-size:22px;text-shadow:0 1px #ffdf77}.p1{left:13%;top:23%}.p2{left:47%;top:1%}.p3{right:12%;top:30%}.p4{right:20%;bottom:8%}#map-player{position:absolute;color:#ffe14c;font-size:18px;text-shadow:0 0 4px black;left:50%;top:62%}.map>span:last-child{font-size:9px;display:block;letter-spacing:1px;margin-top:7px}.map em{font-style:normal;color:#ffdb45;margin-left:12px}.back{position:absolute;left:32px;bottom:85px;padding:10px 15px;background:#08283de8;border:1px solid #9ae8f1;border-radius:25px;font-size:10px}.hotspot{position:absolute;transform:translate(-50%,-50%);background:#102843ed;color:white;border:1.5px solid #fff7;border-radius:25px;padding:9px 15px;white-space:nowrap;font-size:11px;box-shadow:0 4px #031d3290;transition:background .2s,border-color .2s}.hotspot:before{content:'✦';color:var(--yellow);margin-right:8px}.hotspot:hover{background:#422b74;border-color:var(--yellow)}.hotspot small{display:block;font-size:8px;letter-spacing:1px;color:#bde1ed;margin:3px 0 0 15px}.hotspot.near{border-color:#ffe056;box-shadow:0 0 20px #ffdd452a}.hotspot.near:before{content:'↳'}.hotspot[hidden]{display:none}#speech{position:absolute;left:50%;top:21%;transform:translateX(-50%) translateY(-10px);max-width:350px;padding:13px 22px;background:#fff7dc;color:#172a3e;border:3px solid #112e44;border-radius:18px;font-weight:900;font-size:14px;opacity:0;pointer-events:none;transition:opacity .25s,transform .25s;text-align:center;box-shadow:0 5px #04263a33}#speech.show{opacity:1;transform:translateX(-50%) translateY(0)}#speech:after{content:'';position:absolute;bottom:-11px;left:49%;border-top:10px solid #172a3e;border-right:10px solid transparent}.welcome{position:absolute;inset:0;background:linear-gradient(90deg,#02344ce8 0%,#05344bb3 43%,#022c4940 75%);display:flex;align-items:center;justify-content:space-between;padding:90px 9vw 90px;z-index:20}.welcome-copy{position:relative;z-index:2}.eyebrow{font-size:10px;letter-spacing:4px;font-weight:900;color:#b7f2f3}h1{font:900 clamp(55px,7.1vw,112px)/.88 'Barlow Condensed',Impact,sans-serif;letter-spacing:-1px;margin:24px 0;color:#fff8dc;text-shadow:3px 5px #032a3c}h1 span{color:var(--yellow)}.welcome p{color:#d2eff0;font-size:16px;line-height:1.7;margin:26px 0 30px}.primary{background:var(--yellow);color:#123044;border:2px solid #092a3e;border-radius:12px;padding:17px 25px;box-shadow:0 5px #002439;font-size:13px;letter-spacing:.5px}.primary span{margin-left:30px;font-size:20px}.welcome-copy>small{display:block;font-size:8px;letter-spacing:1.5px;color:#b0d7de;margin-top:22px}.welcome-puff{width:40%;position:relative;animation:bob 4s ease-in-out infinite}.welcome-puff img{width:100%;filter:drop-shadow(0 15px 30px #07293666)}.welcome-puff>span{position:absolute;right:0;top:-20px;transform:rotate(5deg);background:#fff6d9;border:3px solid #07293b;color:#1b2d3c;font-weight:900;padding:12px 18px;border-radius:18px}.welcome-foot{position:absolute;bottom:28px;left:9vw;font-size:9px;letter-spacing:2px;color:#a5d5e1}.welcome-foot span{color:#ffdb45;margin:0 20px}.welcome[hidden]{display:none}.loading{position:absolute;inset:0;background:#07364b;z-index:50;display:flex;justify-content:center;align-items:center;flex-direction:column;gap:20px}.loading strong{color:#ffdb45;font:900 70px 'Barlow Condensed',Impact}.loading span{font-size:10px;letter-spacing:4px}.loading small{font-size:11px;color:#9bd8dc}progress{width:200px;height:5px;accent-color:#ffdb45}.loading[hidden]{display:none}#transition{position:absolute;inset:0;background:#023a4b;opacity:0;pointer-events:none;z-index:25;transition:opacity .35s;display:grid;place-items:center}#transition span{font-size:10px;letter-spacing:4px;color:var(--yellow)}#transition.active{opacity:1;pointer-events:auto}dialog{color:#fff8e5;background:#102e46;border:2px solid #79d2db80;border-radius:24px;padding:38px;max-width:550px;width:calc(100% - 36px);box-shadow:0 30px 120px #0008;max-height:85vh;overflow:auto}dialog::backdrop{background:#001a34bb;backdrop-filter:blur(7px)}.close{position:absolute;top:10px;right:13px;font-size:27px;color:#b6d8df;background:none}.panel-kicker{font-size:10px;letter-spacing:3px;color:#7cd6e3}dialog h2{font:900 42px/.95 'Barlow Condensed',Impact;margin:17px 0 20px;color:var(--yellow)}dialog p{font-size:14px;line-height:1.8;color:#c1dfe4}dialog .primary{margin-top:15px}dialog .destinations{display:grid;grid-template-columns:1fr 1fr;gap:12px}.destination{background:#1c4257;border:1px solid #7dc9d144;text-align:left;border-radius:14px;padding:15px}.destination b{display:block;color:#ffdc49;margin:9px 0 5px}.destination small{color:#a1d5df;font-size:10px}.destination img{width:100%;height:85px;object-fit:contain}.stats{display:flex;gap:10px;margin:25px 0}.stats>div{flex:1;padding:15px 8px;background:#041f32;border-radius:10px;text-align:center}.stats small{font-size:9px;display:block;color:#96bfc8;margin-bottom:8px}.stats b{color:#ffdc49}.meme-card{background:#79d3de;border:3px solid #0b283b;border-radius:14px;overflow:hidden;text-align:center;color:#0b283b;padding:16px}.meme-card img{height:160px;max-width:100%;object-fit:contain}.meme-card strong{font:900 27px/1 'Barlow Condensed',Impact;display:block}.choice{background:#4b337c;padding:12px 16px;border:1px solid #ac80d8;border-radius:9px;margin:5px}.small-note{font-size:11px!important;color:#8cb6c2!important}a{color:#ffdc49}.badge{display:inline-block;padding:5px 9px;border-radius:20px;background:#2b5060;font-size:10px;color:#e5e7bc}@keyframes bob{50%{transform:translateY(-14px) rotate(-2deg)}}@media(max-width:700px){header{padding:17px 17px}.brand{font-size:34px}.brand-sub{font-size:6px;letter-spacing:1px;margin-left:26px}.crown{font-size:24px}nav{gap:6px}nav button{padding:10px;font-size:10px}.icon{width:36px;height:36px;font-size:19px}.location{top:90px;left:18px;font-size:8px;max-width:75%;letter-spacing:1px}.bottom{left:15px;right:15px;bottom:18px}.instructions{font-size:8px;padding:9px 12px;max-width:135px;line-height:1.6}.instructions .key{display:none}.instructions i{display:none}.map{width:100px;border-radius:16px}.map-art{height:65px}.inflate{padding:8px 12px;left:49%;bottom:1px}.inflate span{font-size:9px}.inflate small{font-size:7px}.back{left:17px;bottom:93px;font-size:8px}.hotspot{font-size:9px;padding:8px 10px}.hotspot small{font-size:7px}.welcome{padding:110px 25px 80px;align-items:flex-start}.welcome h1{font-size:70px;margin-top:17px}.welcome p{font-size:13px;margin:20px 0}.welcome .eyebrow{font-size:8px;letter-spacing:2px}.welcome-puff{position:absolute;right:10px;bottom:8%;width:43%;opacity:.95}.welcome-puff>span{font-size:10px;padding:8px;top:0}.welcome-copy>small{font-size:6px;max-width:200px;line-height:1.8}.welcome-foot{left:25px;font-size:6px;letter-spacing:1px;bottom:22px}.welcome-foot span{margin:0 7px}#speech{font-size:12px;width:80%;top:23%}dialog{padding:30px 23px}.destination img{height:65px}dialog h2{font-size:35px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
