:root{--ink:#f6f0e7;--gold:#d9b068;--panel:rgba(13,13,11,.89);--line:rgba(255,255,255,.14)}
*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;overflow:hidden;background:#11110f;color:var(--ink);font-family:Inter,Arial,sans-serif}button,a{font:inherit}.topbar{position:fixed;z-index:20;inset:0 0 auto;height:94px;display:flex;align-items:center;justify-content:space-between;padding:0 34px;border-bottom:1px solid var(--line);background:linear-gradient(180deg,rgba(13,13,11,.94),rgba(13,13,11,.55));backdrop-filter:blur(10px)}.brand{color:#fff;text-decoration:none;font-weight:900;font-size:23px;letter-spacing:-1px}.title-block{text-align:center}.title-block span,.eyebrow{color:var(--gold);font-weight:800;font-size:10px;letter-spacing:2.2px}.title-block h1{font:600 25px/1.05 Georgia,serif;margin:5px 0 0}.tools{display:flex;gap:9px}.tools button{width:43px;height:43px;border:1px solid rgba(255,255,255,.2);border-radius:50%;color:#fff;background:rgba(18,18,16,.72);cursor:pointer;font-size:16px}.tools button:hover{border-color:var(--gold);color:var(--gold)}#scene{display:block;width:100%;height:100%;touch-action:none}.routes-panel{position:fixed;z-index:18;top:124px;left:32px;width:294px;max-height:calc(100vh - 185px);padding:20px 12px 14px 18px;border-left:1px solid var(--gold);background:linear-gradient(90deg,rgba(8,8,7,.92),rgba(8,8,7,.2));overflow:auto;scrollbar-width:thin;scrollbar-color:#80683e transparent}.routes-panel h2{font:500 24px/1.15 Georgia,serif;margin:8px 0}.intro{margin:0 0 15px;color:#aaa59c;font-size:13px;line-height:1.5}.route-button{position:relative;width:100%;display:block;text-align:left;color:#dedad2;padding:11px 11px 11px 18px;border:0;border-top:1px solid rgba(255,255,255,.08);background:transparent;cursor:pointer;transition:.2s}.route-button:before{content:"";position:absolute;width:7px;height:7px;border-radius:50%;background:var(--route);left:1px;top:17px;box-shadow:0 0 0 3px rgba(255,255,255,.06)}.route-button b{display:block;font-size:13px}.route-button small{display:block;color:#8f8a82;margin-top:4px}.route-button:hover,.route-button.active{color:#fff;background:linear-gradient(90deg,rgba(217,176,104,.15),transparent);padding-left:23px}.warning{margin:14px 4px 0;padding:12px;border:1px solid rgba(217,176,104,.25);color:#9d9890;font-size:10px;line-height:1.5}.warning strong{color:var(--gold);text-transform:uppercase;letter-spacing:1px}.marker{position:absolute;z-index:10;transform:translate(-50%,-100%);pointer-events:none;white-space:nowrap;text-align:center;transition:opacity .15s}.marker span{display:block;padding:6px 9px;color:#fff;font-size:10px;font-weight:800;letter-spacing:.3px;background:rgba(15,15,13,.84);border:1px solid rgba(255,255,255,.15);box-shadow:0 5px 15px rgba(0,0,0,.25)}.marker.major span{font-size:12px;color:#f5ddb0;border-color:rgba(217,176,104,.55)}.marker:after{content:"";display:block;width:1px;height:18px;margin:auto;background:linear-gradient(var(--gold),transparent)}.route-card{display:none;position:fixed;z-index:22;right:30px;bottom:58px;width:360px;padding:18px 20px 18px 31px;background:var(--panel);border:1px solid rgba(255,255,255,.13);box-shadow:0 18px 50px #0008;backdrop-filter:blur(12px)}.route-card.open{display:block}.route-card h3{font:500 23px/1.1 Georgia,serif;margin:6px 0 10px}.route-color{position:absolute;inset:0 auto 0 0;width:5px;background:var(--route)}#closeCard{position:absolute;right:9px;top:7px;color:#aaa;background:none;border:0;font-size:24px;cursor:pointer}.route-stats{display:flex;gap:6px;flex-wrap:wrap}.route-stats span,.marking{padding:5px 7px;border:1px solid rgba(255,255,255,.12);font-size:10px;color:#d8d3ca}.route-card p{color:#aaa59c;font-size:12px;line-height:1.5;margin:11px 0}.marking{display:inline-block;color:#fff}.compass{position:fixed;z-index:18;right:30px;bottom:175px;width:54px;height:54px;border-radius:50%;border:1px solid #ffffff28;background:#111e;box-shadow:0 5px 18px #0006}.compass span{position:absolute;top:5px;width:100%;text-align:center;font-size:9px;color:#ddd}.compass i{position:absolute;left:24px;top:17px;width:6px;height:25px;clip-path:polygon(50% 0,100% 55%,50% 44%,0 55%);background:linear-gradient(var(--gold) 0 50%,#888 50%);transform-origin:50% 50%}.legend,.help,.credits{position:fixed;z-index:15;bottom:18px;font-size:9px;color:#716e68}.legend{left:32px}.legend i{display:inline-block;width:8px;height:8px;border-radius:50%;margin:0 5px 0 12px}.legend i:first-child{margin-left:0}.rock{background:#d4cab2}.forest{background:#214a2c}.water{background:#287d95}.help{left:50%;transform:translateX(-50%)}kbd{padding:2px 4px;border:1px solid #777;border-radius:3px}.credits{right:24px}.loading-mark{font-weight:900;font-size:25px}.loading-title{font:500 24px Georgia,serif;margin:15px 0}.loading-track{width:240px;height:2px;background:#ffffff22;margin:0 auto 12px}.loading-track span{display:block;width:0;height:100%;background:var(--gold);transition:width .35s}#loading{position:fixed;z-index:100;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#11110f;text-align:center;transition:opacity .7s}#loading.done{opacity:0;pointer-events:none}#loadingText{font-size:10px;color:#888;letter-spacing:1px;text-transform:uppercase}#mobileRoutes{display:none}
@media(max-width:760px){.topbar{height:75px;padding:0 15px}.brand{font-size:18px}.title-block span{display:none}.title-block h1{font-size:18px}.tools{gap:5px}.tools button{width:36px;height:36px}.routes-panel{top:0;left:0;width:min(330px,88vw);height:100%;max-height:none;padding:90px 18px 30px;background:#0c0c0b;transform:translateX(-105%);transition:transform .3s}.routes-panel.open{transform:none}.route-card{left:12px;right:12px;bottom:70px;width:auto}.route-card h3{font-size:19px}.compass{right:14px;bottom:18px}.legend,.credits{display:none}.help{left:13px;bottom:21px;transform:none;font-size:8px}#mobileRoutes{display:block;position:fixed;z-index:21;left:14px;bottom:52px;padding:11px 14px;color:#fff;border:1px solid #ffffff30;background:#111d;border-radius:2px;text-transform:uppercase;font-size:10px;letter-spacing:1px}#mobileRoutes span{display:inline-grid;place-items:center;width:19px;height:19px;margin-left:5px;border-radius:50%;background:var(--gold);color:#111}.marker span{font-size:8px;padding:4px 6px}.marker:not(.major){display:none}}