.map-screen{--map-accent:#76dee6;--map-sky:#253b52;--map-land:#274d55;width:420px;overflow:hidden;border:1px solid #43566b;border-radius:20px;background:#132436;box-shadow:0 20px 75px #0004,0 0 0 5px #ffffff02;position:relative}
.map-header{display:flex;align-items:center;justify-content:space-between;padding:20px 22px 13px;background:#132436}.map-eyebrow{font-size:9px;letter-spacing:1.8px;color:var(--map-accent);font-weight:700}.map-header h2{font:600 25px var(--display);margin-top:7px;letter-spacing:-.5px}.map-return{background:#21374a;border:1px solid #40586d;border-radius:12px;width:37px;height:37px;font-size:22px;color:#bbd1e1}.map-meta{padding:0 22px 17px;display:flex;align-items:center;justify-content:space-between;font-size:10px;color:#a0b4c8}.map-meta>span:first-child{padding:5px 9px;border:1px solid #6d99a744;border-radius:20px;color:var(--map-accent)}.map-meta b{font-weight:500;color:#e6d2a5}.map-meta i{margin:0 6px;color:#597389;font-style:normal}.map-viewport{height:630px;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#a5cedd44 transparent;background:var(--map-sky);touch-action:pan-y;position:relative;outline-offset:-3px!important}.map-world{position:relative;overflow:hidden}.map-terrain{position:absolute;inset:0;background:radial-gradient(ellipse at 0 180px,#ffffff0b 0,transparent 180px),radial-gradient(ellipse at 100% 480px,#070c2325 0,transparent 220px),repeating-linear-gradient(170deg,transparent 0 300px,#ffffff03 300px 480px,transparent 480px 850px);background-size:100% 780px;pointer-events:none}.map-terrain:before,.map-terrain:after{content:'';position:absolute;top:0;bottom:0;width:39%;opacity:.8;background:var(--map-land);clip-path:polygon(0 0,70% 0,100% 4%,60% 8%,80% 12%,30% 16%,90% 20%,65% 24%,100% 28%,60% 32%,85% 36%,30% 40%,90% 44%,60% 48%,100% 52%,65% 56%,85% 60%,30% 64%,90% 68%,60% 72%,100% 76%,65% 80%,85% 84%,30% 88%,90% 92%,60% 96%,100% 100%,0 100%)}.map-terrain:after{right:0;transform:scale(-1,1);opacity:.65}.map-road{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}.map-road path{fill:none;stroke-linecap:round;stroke-linejoin:round}.road-shadow{stroke:#0c17292c;stroke-width:66;transform:translateY(8px)}.road-edge{stroke:#b2bbb276;stroke-width:60}.road-surface{stroke:#839c9860;stroke-width:54}.road-dashes{stroke:#d6dcca8c;stroke-width:3;stroke-dasharray:5 12}.map-stop{position:absolute;transform:translate(-50%,-50%);z-index:2;width:72px;height:66px;text-align:center}.map-node{width:66px;height:59px;position:relative;display:flex;align-items:center;justify-content:center;border-radius:50%;background:linear-gradient(145deg,#6c8191,#4c637b);border:3px solid #9aacba;box-shadow:0 6px 0 #30465d,0 9px 0 2px #10283a45,inset 0 2px 1px #ffffff44;font:600 24px var(--display);color:#dbe5eb;text-shadow:0 2px #122a4544;margin:auto;transition:transform .16s,filter .16s}.map-node:disabled{opacity:1;cursor:not-allowed;color:#b8cad6;border-color:#7c98ac;background:linear-gradient(135deg,#607d94,#476177)}.map-node:disabled svg{position:absolute;bottom:-6px;right:-3px;width:20px;height:20px;background:#263c50;padding:3px;border-radius:50%;border:1px solid #668097;color:#b6c9d2}.map-node:disabled>span{opacity:.75}.map-node:hover:not(:disabled){filter:brightness(1.15);transform:translateY(-2px)}.is-complete .map-node{background:linear-gradient(145deg,#ffdfa5,#d9a365);border-color:#ffeac7;box-shadow:0 6px 0 #8f664b,0 9px 0 2px #10283a45,inset 0 2px 1px #ffffff88;color:#6a4535;text-shadow:none}.is-current .map-node{width:75px;height:66px;border-color:#dbfcff;background:linear-gradient(145deg,#b3f6f1,#6bc1d1);color:#18485d;box-shadow:0 7px 0 #397b97,0 0 0 7px #b9f5ef27,0 0 35px #92eee43b,inset 0 2px #fff;text-shadow:none}.map-node-stars{position:absolute;bottom:-21px;left:50%;transform:translateX(-50%);font-size:19px;letter-spacing:1px;color:#ffe1a5;text-shadow:0 2px 2px #382c3c;white-space:nowrap}.map-node-label{position:absolute;bottom:-26px;left:50%;transform:translateX(-50%);color:#d5ffff;font-size:10px;white-space:nowrap;font-weight:600;text-shadow:0 1px 5px #000}.map-you{position:absolute;top:-67px;left:50%;transform:translateX(-50%);display:flex;align-items:center;flex-direction:column;gap:5px;width:110px;pointer-events:none}.map-you i{display:block;width:27px;height:27px;border-radius:50%;border:1px solid #ffd0cf;background:radial-gradient(circle at 32% 24%,#fff1dd 0,#ffabab 17%,#f47789 45%,#bb4871 100%);box-shadow:0 2px 12px #ff98a64d}.map-you>span{font-size:8px;background:#143d4e;padding:4px 7px;border:1px solid #76dbe080;border-radius:6px;color:#d3f9f4;white-space:nowrap}.map-you:after{content:'';width:6px;height:6px;background:#76dbe0;clip-path:polygon(0 0,100% 0,50% 100%);margin-top:-5px}.map-milestone{position:absolute;right:-15px;top:-33px;font-size:37px;color:#f5c9bd;text-shadow:0 3px #542f5c;z-index:-1}.map-more,.map-origin{position:absolute;left:50%;transform:translateX(-50%);white-space:nowrap;color:#c7dddb91;font-size:9px;letter-spacing:.3px;z-index:1}.map-more{display:flex;align-items:center;gap:9px}.map-more b{font-size:21px;font-weight:400}.map-decoration{position:absolute;width:54px;height:90px;pointer-events:none;filter:drop-shadow(0 7px 1px #09182825);opacity:.87}.map-decoration i{position:absolute;bottom:0;width:24px;height:59px;background:linear-gradient(90deg,#639894,#326765);clip-path:polygon(50% 0,100% 45%,78% 45%,100% 70%,76% 70%,100% 93%,58% 93%,58% 100%,42% 100%,42% 93%,0 93%,24% 70%,0 70%,22% 45%,0 45%)}.map-decoration i:nth-child(2){left:17px;bottom:8px;height:84px;width:32px;background:linear-gradient(90deg,#76a6a0,#467c77)}.map-decoration i:nth-child(3){left:35px;height:49px;background:linear-gradient(90deg,#96b5a2,#628b80)}.map-decoration.crystals{height:65px}.crystals i{clip-path:polygon(45% 0,85% 15%,100% 77%,50% 100%,0 76%,5% 18%);background:linear-gradient(100deg,#85bad0 0 42%,#598cba 42% 65%,#405b96 65%)}.crystals i:nth-child(2){background:linear-gradient(100deg,#bacbe4 0 42%,#869ecb 42% 65%,#52699d 65%);height:71px}.crystals i:nth-child(3){background:linear-gradient(100deg,#9db9d8 0 42%,#6588b9 42% 65%,#405580 65%)}.map-spark{position:absolute;color:#e9dfa890;font-size:18px;pointer-events:none}.map-float-controls{position:relative;display:flex;justify-content:space-between;align-items:center;padding:10px 15px;background:#192d3f;border-top:1px solid #adcbd017;gap:8px}.map-float-controls button{background:#2d4758;border:1px solid #526b79;border-radius:20px;padding:7px 11px;font-size:10px;color:#c5e4e7}.map-float-controls>span{color:#829caa;font-size:9px}.map-footer{padding:17px 19px;display:flex;align-items:center;justify-content:space-between;gap:12px;background:#122334}.map-footer>div{display:flex;flex-direction:column;gap:4px}.map-footer>div span{font-size:9px;color:#819eb1}.map-footer strong{font:500 18px var(--display)}.map-footer>button{padding:13px 16px;min-height:44px;border:1px solid #ddfff7;border-radius:10px;background:#a4e5df;color:#194657;font-size:12px;font-weight:700;display:flex;align-items:center;gap:14px;box-shadow:0 3px 0 #4a8d97}.map-footer>button:hover{background:#c6f9eb}.map-footer button>span{font-size:10px}.mini-journey{height:292px;position:relative}.mini-journey>svg{position:absolute;width:100%;height:290px}.mini-journey>svg path{fill:none;stroke:#486675;stroke-width:3;stroke-dasharray:4 5}.mini-node{position:absolute;transform:translate(-50%,-50%);width:35px;height:32px;border-radius:50%;background:#274454;border:1px solid #648193;box-shadow:0 3px 0 #142b3b;color:#9fb7c5;font:500 12px var(--display)}.mini-node.active{background:#8dd9dc;border:2px solid #ceffff;color:#214951;box-shadow:0 3px #366474,0 0 0 5px #8bd9dd13}.mini-node small{position:absolute;bottom:-15px;left:13px;font-size:11px;color:#ffe1a5}.mini-node:active:not(:disabled){transform:translate(-50%,calc(-50% + 1px))}
.map-viewport{overflow-anchor:none}.map-world{overflow-anchor:none}
@media(min-width:1100px) and (max-height:950px){.map-screen{width:380px}.map-viewport{height:510px}}
@media(max-width:1140px){.map-screen{width:400px}}
@media(max-width:970px){.map-screen{width:100%}.map-viewport{height:580px}}
@media(max-width:500px){.map-screen{border-radius:15px;width:100%}.map-header{padding:16px 16px 10px}.map-header h2{font-size:23px}.map-meta{padding:0 16px 12px;font-size:9px}.map-viewport{height:calc(100svh - 302px);min-height:330px}.map-footer{padding:14px 15px}.map-footer>button{padding:12px;font-size:11px}.map-float-controls{padding:8px 12px}.map-eyebrow{font-size:8px}.map-you>span{font-size:9px}}