:root{color-scheme:dark;--gold:#dfbb7d;--ivory:#f3eee4;--ink:#07121b;font-family:Arial,Helvetica,sans-serif}
*{box-sizing:border-box}
html,body{width:100%;height:100%;margin:0;overflow:hidden;background:var(--ink)}
button,a{-webkit-tap-highlight-color:transparent}
button:focus-visible,a:focus-visible{outline:2px solid #f7d99f;outline-offset:4px}
.atlas{position:relative;width:100%;height:100vh;height:100dvh;min-height:560px;isolation:isolate;overflow:hidden;color:var(--ivory);background:#07121b}
.map-camera,.map-surface,.map-surface img,.veil,.map-grid{position:absolute;inset:0;width:100%;height:100%}
.map-camera{z-index:-4;overflow:hidden}
.map-surface{transform:scale(1.5);transform-origin:var(--focus-x,37%) var(--focus-y,24%);transition:transform-origin 3.2s cubic-bezier(.2,.7,.2,1),transform 3.2s cubic-bezier(.2,.7,.2,1);will-change:transform}
.map-surface img{object-fit:cover;object-position:center}
.map-surface::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 55% 43%,transparent 22%,#07121b55 95%);pointer-events:none}
.route{position:absolute;inset:0;width:100%;height:100%;opacity:.38;overflow:visible}
.route path{fill:none;stroke:#d2ad70;stroke-width:.75;stroke-dasharray:4 7;filter:drop-shadow(0 0 4px #e2bc70);animation:route 28s linear infinite}
@keyframes route{to{stroke-dashoffset:-220}}
.beacon{position:absolute;width:9px;height:9px;border:1px solid #ffdea0;border-radius:50%;background:#f4c67b;box-shadow:0 0 10px 3px #ffc879aa,0 0 28px 10px #f8aa4566;transform:translate(-50%,-50%);opacity:.45;transition:opacity .8s,box-shadow .8s}
.beacon::after{content:"";position:absolute;inset:-13px;border:1px solid #f5d09288;border-radius:50%;animation:pulse 3s ease-out infinite}
.beacon.active{opacity:1;box-shadow:0 0 12px 4px #ffd28acc,0 0 42px 15px #f4b35e88}
@keyframes pulse{0%{transform:scale(.35);opacity:1}100%{transform:scale(1.8);opacity:0}}
.beacon-1{left:32%;top:23%}.beacon-2{left:57%;top:34%}.beacon-3{left:83%;top:20%}.beacon-4{left:78%;top:69%}.beacon-5{left:50%;top:55%}
.veil{z-index:-3;background:linear-gradient(90deg,#06121bf2 0%,#06121be4 20%,#07141da8 38%,#07151d35 68%,#07141c2b 100%),linear-gradient(0deg,#06121be8 0%,transparent 25%,transparent 75%,#06121b72 100%)}
.map-grid{z-index:-2;opacity:.15;pointer-events:none;background:repeating-linear-gradient(90deg,transparent 0 calc(20% - 1px),#c9b08066 calc(20% - 1px) 20%),repeating-linear-gradient(0deg,transparent 0 calc(25% - 1px),#c9b08055 calc(25% - 1px) 25%);mask-image:linear-gradient(90deg,transparent 0%,#000 55%)}
.masthead{position:absolute;top:0;left:0;right:0;z-index:3;display:flex;justify-content:space-between;align-items:center;padding:clamp(24px,3vw,42px) clamp(24px,5vw,90px)}
.brand{display:flex;align-items:center;gap:13px;color:#f4eee1;text-decoration:none;font-size:21px;font-weight:900;letter-spacing:.26em;line-height:1}
.brand .rune{font:42px/.8 Georgia,serif;color:var(--gold)}.brand small{display:block;margin-top:8px;color:#d8bb89;font-size:8px;font-weight:800;letter-spacing:.22em}
.masthead nav{display:flex;gap:30px}.masthead nav a{color:#e9dec9;text-decoration:none;font-size:10px;font-weight:800;letter-spacing:.16em}.masthead nav a:hover{color:#fff}.masthead nav span{margin-left:7px;color:var(--gold)}
.hero{position:absolute;z-index:2;left:clamp(25px,8vw,160px);top:clamp(130px,19vh,220px);width:min(710px,49vw)}
.eyebrow{display:flex;align-items:center;gap:13px;color:#e6c997;font-size:10px;font-weight:900;letter-spacing:.23em;white-space:nowrap}.eyebrow .line{width:43px;height:1px;background:var(--gold)}.eyebrow .sep{opacity:.45}
h1{margin:26px 0 0;font:400 clamp(56px,5.4vw,104px)/.91 Georgia,'Times New Roman',serif;letter-spacing:-.065em;text-shadow:0 3px 32px #000b}
h1 em{color:#e4bd7a;font-style:normal}
.lead{max-width:570px;margin:28px 0 0;padding-left:20px;border-left:2px solid var(--gold);color:#e8e7de;font:clamp(16px,1.2vw,21px)/1.5 Georgia,serif;text-shadow:0 2px 16px #000}
.signal{display:flex;align-items:center;gap:12px;margin-top:25px;color:#ead3ab}.signal-mark{position:relative;display:block;flex:none;width:9px;height:9px;border-radius:50%;background:#e3bd7b;box-shadow:0 0 11px #e4bd7b}.signal-mark::after{content:"";position:absolute;inset:-7px;border:1px solid #e4bd7b88;border-radius:50%;animation:pulse 2.8s infinite}
.signal strong,.signal small{display:block}.signal strong{font-size:9px;letter-spacing:.19em}.signal small{margin-top:4px;font-size:11px;color:#c5c4bb;letter-spacing:.02em}
.primary{display:inline-flex;align-items:center;justify-content:space-between;gap:40px;margin-top:29px;min-width:276px;min-height:51px;padding:0 20px;background:linear-gradient(120deg,#efd29c,#c3995b);color:#191810;text-decoration:none;font-size:10px;font-weight:900;letter-spacing:.14em;box-shadow:0 8px 40px #0009;transition:transform .2s,filter .2s}.primary:hover{transform:translateY(-3px);filter:brightness(1.12)}.primary span{font-size:19px;font-weight:400}
.coordinates{position:absolute;right:clamp(25px,5vw,90px);top:31%;display:flex;flex-direction:column;align-items:end;gap:17px;color:#f6e1baaa;font-size:9px;font-weight:800;letter-spacing:.28em;text-shadow:0 2px 12px #000}.coordinates span:last-child{font:42px Georgia,serif;color:#e1bc7d88}
.journey{position:absolute;z-index:3;left:clamp(25px,5vw,90px);right:clamp(25px,5vw,90px);bottom:clamp(25px,4vw,57px);padding-top:19px;border-top:1px solid #d7bd8b88}
.journey-top{display:flex;justify-content:space-between;color:#e8c891;font-size:10px;font-weight:900;letter-spacing:.22em}
.journey-controls{display:flex;align-items:center;justify-content:space-between;gap:30px;margin-top:18px}
.worlds{display:flex;gap:9px;width:min(690px,58vw)}
.worlds button{flex:1;min-width:0;padding:0;border:0;background:none;color:#d9c7aa;text-align:left;font-size:10px;font-weight:800;letter-spacing:.1em;cursor:pointer}
.worlds button span{display:block;margin-bottom:7px}.worlds button i{display:block;width:100%;height:2px;background:#d3c5a37a;overflow:hidden}.worlds button[aria-pressed="true"]{color:#ffe1a5}.worlds button[aria-pressed="true"] i{background:#efd095;box-shadow:0 0 13px #f4c879}
.transport{display:flex;gap:12px}.transport button{min-height:37px;padding:0 16px;border:1px solid #d0b8898c;background:#071720ad;color:#f2dec1;font-size:10px;font-weight:800;letter-spacing:.13em;cursor:pointer}.transport button:hover{background:#d7b987;color:#151b1b}.transport button span{margin-left:8px;color:#e8c68e}
.glimpse{margin:13px 0 0;color:#d9d0bf;font:italic 14px Georgia,serif}
@media(max-width:800px){
 .atlas{min-height:0}
 .map-surface{transform:scale(1.75)}
 .map-surface img{object-position:60% center}
 .veil{background:linear-gradient(90deg,#06121bea,#06121bbb 72%,#06121b72),linear-gradient(0deg,#06121bf5 0%,transparent 40%,#06121b8c 100%)}
 .masthead{padding:19px 19px}.brand{font-size:16px;gap:8px}.brand .rune{font-size:31px}.brand small{font-size:6px;letter-spacing:.14em}.masthead nav{gap:13px}.masthead nav a{font-size:8px}.masthead nav a:last-child{display:none}
 .hero{left:22px;right:22px;top:clamp(115px,17vh,160px);width:auto}
 .eyebrow{font-size:8px;gap:8px;letter-spacing:.12em}.eyebrow .line{width:23px}
 h1{margin-top:18px;font-size:clamp(48px,10vw,73px)}
 .lead{margin-top:17px;padding-left:12px;font-size:clamp(14px,3.4vw,18px);line-height:1.4}
 .signal{margin-top:17px}.signal strong{font-size:8px}.signal small{font-size:10px}
 .primary{margin-top:19px;min-height:43px;min-width:0;font-size:9px}
 .coordinates{display:none}
 .journey{left:21px;right:21px;bottom:22px;padding-top:12px}.journey-top{font-size:8px}.journey-controls{gap:12px;margin-top:12px}.worlds{width:auto;flex:1;gap:5px}.worlds button{font-size:8px}.worlds button span{margin-bottom:6px}.transport{gap:5px}.transport button{min-height:34px;padding:0 8px;font-size:8px}.transport button span{margin-left:3px}.transport #pause span{display:none}.glimpse{font-size:11px;margin-top:9px}
}
@media(max-width:420px) and (max-height:700px){
 .hero{top:100px}
 h1{font-size:clamp(42px,10vw,53px);margin-top:12px}
 .lead{font-size:12px;margin-top:12px;line-height:1.32}
 .signal{margin-top:12px}.signal small{font-size:9px}
 .primary{margin-top:13px;min-height:38px}
 .journey{bottom:13px}.glimpse{margin-top:6px}
}
@media(min-width:2200px){.hero{left:clamp(180px,9vw,350px)}}
@media(min-width:801px) and (max-height:980px){
 .hero{top:clamp(112px,15vh,160px)}
 h1{font-size:clamp(60px,4.6vw,87px);margin-top:17px}
 .lead{font-size:clamp(15px,1vw,18px);line-height:1.38;margin-top:19px}
 .signal{margin-top:16px}
 .primary{margin-top:18px;min-height:45px}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.map-surface{transform:scale(1.15)}}

.journey-top{position:relative;align-items:center}.journey-top>.fehu-mini-player{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);letter-spacing:.07em}
@media(max-width:600px){.journey-top{padding-bottom:31px}.journey-top>.fehu-mini-player{top:auto;bottom:0;transform:translateX(-50%)}}
