@charset "UTF-8";
:root{color-scheme:dark;--ink:#edf1e9;--muted:#abb8b8;--gold:#dbba79;--line:#ffffff24;--surface:#10232bf2;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:#0d2029}
*{box-sizing:border-box}body{margin:0}a{color:inherit;text-underline-offset:4px}button,input,select{font:inherit}button,a,input,summary{-webkit-tap-highlight-color:transparent}button{color:inherit;cursor:pointer;background:none;border:0}button:disabled{cursor:wait;opacity:.45}a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible,select:focus-visible{outline:2px solid var(--gold);outline-offset:5px}button svg,a svg{width:22px;height:22px;flex:none}::selection{background:#b58f4e70}[hidden]{display:none!important}
.home{min-height:100svh;display:flex;flex-direction:column;position:relative;isolation:isolate}
/* The backdrop is a photograph of a rendered scene, preloaded and then blurred 3px by this
   rule, so it is served as a JPEG: the same picture as a PNG was 2.3 MB on the critical path
   and 306 KB as a JPEG at quality 84, and at this size behind this blur the two are
   indistinguishable (PSNR 48.8 dB measured through the blur). */
.harbour-background{position:fixed;inset:0;z-index:-2;background:url('assets/harbour.jpg') center 62%/cover no-repeat;filter:blur(3px);transform:scale(1.025)}
.harbour-background::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#071820de,#0c1e27c9 55%,#11242a9c),linear-gradient(0deg,#071820ec,transparent 40%,#081a239c)}
.home-content{width:min(1020px,calc(100% - 100px));margin:auto;padding:100px 0 70px}.home-hero{display:grid;grid-template-columns:245px 1fr;gap:74px;align-items:center}
.crest-frame{position:relative;transform:rotate(-3deg);padding:7px;background:linear-gradient(140deg,#f4ddae45,#ffffff0b);border:1px solid #e8d4ad52;border-radius:30px;box-shadow:0 30px 80px #0008,0 0 60px #e7a13d0c}.crest-frame img{display:block;width:100%;height:auto;border-radius:23px}.crest-frame::after{content:"";position:absolute;inset:11px;border:1px solid #fff2;border-radius:20px;pointer-events:none}
.eyebrow{display:flex;gap:10px;align-items:center;text-transform:uppercase;letter-spacing:.21em;font-size:10px;font-weight:600;color:var(--gold);margin:0 0 22px}.eyebrow>span{width:18px;height:1px;background:var(--gold)}h1{font-family:Georgia,"Times New Roman",serif;letter-spacing:-.045em;font-size:clamp(42px,4.9vw,66px);font-weight:400;line-height:1.07;margin:0 0 30px;text-shadow:0 3px 30px #0003}h1 em{font-weight:400;color:#dfc99f}
.map-link{display:inline-flex;align-items:center;gap:70px;border:1px solid #d7ba7d75;background:linear-gradient(120deg,#e6c98f,#c8a565);color:#192a2e;padding:17px 22px;border-radius:10px;font-size:14px;font-weight:650;text-decoration:none;box-shadow:0 8px 30px #0003;transition:transform .2s,box-shadow .2s}.map-link:hover{transform:translateY(-3px);box-shadow:0 13px 35px #0005}.map-caption{color:#bbc6c1a8;font-size:11px;margin:13px 0 0;letter-spacing:.01em}
.home-below{margin-top:52px;display:grid;grid-template-columns:1fr auto;align-items:center;gap:25px;padding-top:30px;border-top:1px solid var(--line)}.home-description{font-size:14px;line-height:1.9;color:#c1ccc8;margin:0}.text-link{padding:9px 0;color:#c8d3cc;font-size:11px;text-decoration:none;white-space:nowrap}.text-link>span{color:var(--gold);margin-left:6px}.text-link:hover{color:var(--gold)}
.home-notes{display:flex;align-items:center;gap:12px;color:#9caaa4a6;font-size:10px;letter-spacing:.02em;margin-top:32px}.home-notes i{width:3px;height:3px;background:#ccb78680;border-radius:50%}.home-footer{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;align-items:center;margin:0 auto;padding:0 0 25px;width:min(1020px,calc(100% - 100px));font-size:10px;color:#a6b5b08f;letter-spacing:.04em}.home-footer>span:first-child{text-align:left}.home-footer>span:nth-child(2){text-align:center}.home-footer>span:last-child{text-align:right;font-family:Georgia,serif;font-style:italic;letter-spacing:.06em}
.home-story{display:grid;grid-template-columns:1fr 1fr;gap:70px;margin-top:38px;padding-top:30px;border-top:1px solid var(--line)}.story-intro .eyebrow{font-size:8px;margin-bottom:14px;letter-spacing:.17em}.path-dot.navy{background:#6ca6d1}.path-dot.pirate{background:#c67463}.path-dot.hunter{background:#d6bc80}
.home-description p{margin:0}.home-description p+p{margin-top:12px}.home-description a{color:#d7c8a8;text-decoration-color:#d7c8a855}
.home-below{grid-template-columns:minmax(0,1fr)300px;gap:55px;align-items:start}.raid-note .eyebrow{font-size:8px;margin:0 0 10px}
dialog{width:min(580px,calc(100% - 32px));max-height:calc(100dvh - 40px);overflow:auto;border:1px solid #d6bc8550;border-radius:22px;background:#10232b;color:var(--ink);padding:40px;box-shadow:0 25px 100px #0009}dialog::backdrop{background:#041219b8;backdrop-filter:blur(8px)}.dialog-close{position:absolute;right:18px;top:12px;font-size:28px;color:var(--muted);width:36px;height:36px}dialog h2{font:34px Georgia,serif;letter-spacing:-.03em;margin:0 0 20px}dialog p{font-size:13px;line-height:1.8;color:var(--muted)}dialog .eyebrow{font-size:9px;margin-bottom:14px}.install-steps{padding-left:20px;margin:25px 0}.install-steps li{padding-left:7px;margin:18px 0;color:var(--gold);font-size:12px}.install-steps strong{color:var(--ink);display:block;font-size:13px;margin-bottom:7px}.install-steps span{color:var(--muted);line-height:1.8}.install-steps a,.dependencies a{color:#d4c09c}.dependencies{border-top:1px solid var(--line);padding-top:18px;font-size:12px}.dependencies summary{cursor:pointer;color:#d6c39e}.dependencies ul{padding-left:20px;line-height:2.1;color:var(--muted)}
/* The atlas has compact controls; the landing page has no navigation bar. */
.atlas{height:100dvh;overflow:hidden;background:#0a1a21}.atlas-stage{position:relative;width:100%;height:100%;overflow:hidden;isolation:isolate}#terrain{display:block;width:100%;height:100%;touch-action:none;cursor:grab;outline-offset:-4px}#terrain:active{cursor:grabbing}
.map-controls{position:absolute;right:22px;top:22px;display:grid;gap:3px;border:1px solid var(--line);border-radius:14px;padding:5px;background:var(--surface);box-shadow:0 5px 25px #0004;backdrop-filter:blur(14px)}.map-controls button{width:39px;height:39px;display:grid;place-items:center;border-radius:9px}.map-controls button:hover{background:#ffffff0e}.map-controls svg{width:19px;height:19px}.map-controls hr{width:25px;border:0;border-top:1px solid var(--line);margin:3px auto}.compass{position:absolute;right:39px;top:245px;text-align:center;color:#e4d5b7;font:24px Georgia,serif;pointer-events:none;text-shadow:0 2px 6px #000}.compass span{display:block;font:8px system-ui;margin-top:4px;letter-spacing:.1em}
.map-key{position:absolute;left:22px;top:100px;background:var(--surface);border:1px solid var(--line);border-radius:12px;max-width:calc(100% - 100px);box-shadow:0 5px 25px #0003;backdrop-filter:blur(14px)}.map-key summary{padding:12px 15px;font-size:11px;list-style:none;cursor:pointer;display:flex;align-items:center;gap:10px}.map-key summary::-webkit-details-marker{display:none}.map-key summary::after{content:'+';color:var(--gold);margin-left:auto}.map-key[open] summary::after{content:'−'}.key-content{width:232px;padding:3px 15px 15px}.legend{display:grid;grid-template-columns:1fr 1fr;gap:14px 12px}.legend label{font-size:10px;color:#c0ccc7;display:flex;align-items:center;gap:7px;cursor:pointer}.legend input{accent-color:var(--gold);margin:0;width:12px;height:12px}.legend i{width:6px;height:6px;background:var(--color);border-radius:50%;flex:none}.legend .region-dot{border:1px solid #d8c9a7;background:none;border-radius:0}.key-content p{font-size:9px;line-height:1.8;color:#93a5a2;border-top:1px solid var(--line);padding-top:12px;margin:15px 0 0}
.map-location{position:absolute;left:50%;top:24px;transform:translateX(-50%);border-radius:25px;padding:9px 16px;background:#0b1e26c9;border:1px solid #ffffff15;max-width:calc(100% - 600px);text-align:center;font-size:11px;color:#d8d8c6;pointer-events:none;backdrop-filter:blur(12px)}.map-location:empty{display:none}.map-bottom{position:absolute;bottom:20px;left:22px;right:22px;display:flex;align-items:flex-end;justify-content:space-between;gap:15px;pointer-events:none}.map-bottom>div{background:var(--surface);border:1px solid var(--line);border-radius:11px;padding:11px 14px;backdrop-filter:blur(14px);max-width:calc(100% - 155px);pointer-events:auto}.map-bottom strong{display:block;font-size:10px;font-weight:500;color:#d1c5ac}.map-bottom small{display:block;font-size:9px;color:#8fa4a1;margin-top:6px;line-height:1.7}.map-bottom a{color:#b7c4bd}.map-coordinates{font:10px ui-monospace,monospace;color:#c4d0c6;text-shadow:0 1px 4px #000;white-space:nowrap;padding:8px 0}.map-status{position:absolute;left:50%;bottom:100px;transform:translateX(-50%);background:var(--surface);padding:9px 15px;border:1px solid var(--line);border-radius:30px;font-size:10px;color:#d1c4a5;text-align:center;max-width:calc(100% - 32px);pointer-events:none}.map-tooltip{position:absolute;display:none;padding:12px 15px;border:1px solid #d7bd8160;border-radius:12px;background:#0e2028f5;pointer-events:none;box-shadow:0 10px 30px #0005;max-width:260px}.map-tooltip strong{font-size:12px;font-weight:500;color:#e7d8b9;display:block}.map-tooltip small{font-size:10px;line-height:1.7;color:#9eb0ab;display:block;margin-top:5px}
@media(min-width:1600px){.home-content{padding-top:140px;padding-bottom:100px}.home-hero{grid-template-columns:270px 1fr;gap:90px}.home-below{margin-top:70px}}
@media(max-width:900px){.home-content{width:calc(100% - 70px);padding:85px 0 60px}.home-hero{grid-template-columns:200px 1fr;gap:40px}h1{font-size:49px}.home-below{grid-template-columns:1fr;gap:26px}.home-footer{width:calc(100% - 70px)}.home-notes{font-size:9px}.map-location{max-width:calc(100% - 400px);left:auto;right:90px;transform:none}}
@media(max-width:600px){.home-content{width:calc(100% - 48px);padding:65px 0 45px}.home-hero{grid-template-columns:1fr;gap:37px}.crest-frame{width:158px;justify-self:center;border-radius:24px;padding:5px;transform:rotate(-3deg)}.crest-frame img{border-radius:18px}.crest-frame::after{inset:8px;border-radius:16px}.hero-copy{text-align:center}.eyebrow{justify-content:center;font-size:8px;letter-spacing:.18em;margin-bottom:20px}h1{font-size:45px;line-height:1.07;margin-bottom:28px}.map-link{padding:16px 22px;gap:86px;font-size:13px}.map-caption{font-size:10px;margin-top:12px}.home-below{margin-top:35px;padding-top:26px;text-align:center;gap:25px}.home-description{font-size:12px;line-height:1.9}.text-link{font-size:10px}.home-notes{justify-content:center;flex-wrap:wrap;gap:7px;margin-top:26px;font-size:8px}.home-footer{width:calc(100% - 48px);padding-bottom:22px;font-size:8px}.harbour-background{background-position:57% 60%}.harbour-background::after{background:linear-gradient(0deg,#071820f2,#071820c5 50%,#071820d9)}dialog{padding:32px 24px}dialog h2{font-size:29px}dialog .eyebrow{justify-content:flex-start}.map-controls{top:12px;right:12px}.map-controls button{width:36px;height:36px}.compass{top:230px;right:28px}.map-key{top:80px;left:12px}.map-key summary{padding:11px 14px;font-size:10px}.map-location{left:50%;right:auto;transform:translateX(-50%);max-width:calc(100% - 32px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;top:127px;font-size:10px}.map-key[open]~.map-location{top:auto;bottom:145px}.map-bottom{left:12px;right:12px;bottom:12px;gap:10px}.map-bottom>div{max-width:calc(100% - 110px);padding:10px 12px}.map-bottom strong{font-size:9px}.map-bottom small{font-size:8px}.map-coordinates{font-size:8px}.map-status{bottom:115px;font-size:9px}.key-content{width:220px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
@media(max-width:900px){.home-story{gap:35px}}
@media(max-width:600px){.home-story{grid-template-columns:1fr;gap:26px;margin-top:32px;padding-top:28px;text-align:center}.story-intro .eyebrow{justify-content:center}}
@media(min-width:601px) and (max-width:900px){}
@media(max-width:600px){.raid-note .eyebrow{justify-content:center}}
.raid-note>p:not(.eyebrow){font-size:11px;color:#a7b7b0;line-height:1.8;margin:12px 0 0}
/* A full-screen opening scene leads into a quieter, readable world introduction. */
.home-content{width:min(1120px,calc(100% - 96px));padding:50px 0 70px}.home-hero{min-height:calc(100svh - 100px);grid-template-columns:260px 1fr;gap:86px}.hero-copy h1{font-size:clamp(50px,5.7vw,82px);line-height:1.02;letter-spacing:-.05em}.hero-copy{animation:scene-enter 1s ease-out both}.crest-frame{animation:crest-float 8s ease-in-out infinite;box-shadow:0 30px 90px #0009,0 0 60px #e7a13d14}.home::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,transparent 0,transparent 55vh,#0b1f28e0 100vh,#0b1f28 145vh)}.harbour-background{filter:none;transform:translate3d(var(--scene-x,0px),var(--scene-y,0px),0) scale(1.06);will-change:transform;background-position:center center}.harbour-background::after{background:linear-gradient(90deg,#071820d9,#0c1e279e 50%,#11242a33),linear-gradient(0deg,#071820a6,transparent 50%,#081a2355)}.map-link{border-radius:9px;box-shadow:0 8px 35px #0005,0 0 0 1px #ffe7b414 inset}.map-link:hover{box-shadow:0 13px 40px #0007,0 0 35px #e6c98f25}.home-below{margin-top:10px;padding-top:45px}.home-story{margin-top:45px;padding-top:40px}.home-footer{width:min(1120px,calc(100% - 96px))}
@keyframes scene-enter{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
@keyframes crest-float{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-9px) rotate(-1deg)}}
@media(min-width:601px) and (max-width:900px){.home-content{width:calc(100% - 70px)}.home-hero{grid-template-columns:210px 1fr;gap:40px}.hero-copy h1{font-size:56px}.home-footer{width:calc(100% - 70px)}}
@media(max-width:600px){.home-content{width:calc(100% - 48px);padding:20px 0 45px}.home-hero{min-height:calc(100svh - 40px);grid-template-columns:1fr;gap:34px;align-content:center;padding:30px 0 75px}.hero-copy h1{font-size:48px;line-height:1.04}.crest-frame{width:164px}.home-description{font-size:13px;line-height:1.9}.home-below{padding-top:30px;margin-top:0;gap:28px}.home-footer{width:calc(100% - 48px)}.harbour-background{background-position:68% center}.harbour-background::after{background:linear-gradient(0deg,#071820dd,#071820a3 50%,#071820b8)}.home-story{margin-top:35px;padding-top:30px}}

/* Homepage arrival: several translucent banks of water mist pass the camera. */
.arrival-mist{display:none;position:fixed;inset:0;z-index:10;overflow:hidden;pointer-events:none;background:#9caeb500}
.arrival-mist i{position:absolute;inset:-30%;display:block;will-change:transform,opacity;background:radial-gradient(ellipse at 28% 66%,#c2d0cbd9 0%,#afc4c0a8 25%,transparent 58%),radial-gradient(ellipse at 80% 35%,#d0d9d2dd 0%,#bccbc6a3 27%,transparent 62%)}
.arrival-mist i:nth-child(2){inset:-45%;background:radial-gradient(ellipse at 65% 64%,#c8d9d1ed, #b4ccc3a8 28%,transparent 65%)}
.arrival-mist i:nth-child(3){inset:-35%;background:radial-gradient(ellipse at 35% 70%,#c7d8d0e8,#c7d8d080 23%,transparent 62%)}
.skip-arrival{position:fixed;right:25px;bottom:24px;z-index:11;padding:11px 16px;border:1px solid #e1e9dd60;border-radius:24px;background:#0b202ad9;backdrop-filter:blur(8px);color:#e5e5d9;font-size:11px;letter-spacing:.04em}.skip-arrival span{margin-left:16px;color:var(--gold)}
.is-arriving .arrival-mist{display:block;animation:mist-veil 4.6s ease-out both}
.is-arriving .arrival-mist i{animation:mist-port 4.6s cubic-bezier(.22,.45,.3,1) both}
.is-arriving .arrival-mist i:nth-child(2){animation-name:mist-starboard}
.is-arriving .arrival-mist i:nth-child(3){animation-name:mist-waterline}
.is-arriving .harbour-background{animation:harbour-approach 4.6s cubic-bezier(.2,.55,.25,1) both}
.is-arriving .home-content,.is-arriving .home-footer{animation:arrival-content 4.6s ease-out both}
@keyframes mist-veil{0%{background:#aebfb7;opacity:1}30%{background:#819e9c55;opacity:1}85%,100%{background:transparent;opacity:0}}
@keyframes mist-port{0%{transform:translate3d(0,8%,0) scale(1.12);opacity:1}100%{transform:translate3d(-48%,12%,0) scale(1.5);opacity:0}}
@keyframes mist-starboard{0%{transform:translate3d(0,0,0) scale(1);opacity:1}100%{transform:translate3d(43%,-10%,0) scale(1.55);opacity:0}}
@keyframes mist-waterline{0%{transform:translate3d(0,14%,0) scale(1);opacity:.9}100%{transform:translate3d(-12%,42%,0) scale(1.65);opacity:0}}
@keyframes harbour-approach{0%{filter:blur(8px);transform:translate3d(0,2%,0) scale(1.23)}55%{filter:blur(1px)}100%{filter:blur(0);transform:translate3d(var(--scene-x,0px),var(--scene-y,0px),0) scale(1.06)}}
@keyframes arrival-content{0%,42%{opacity:0;transform:translate3d(0,18px,0)}85%,100%{opacity:1;transform:translate3d(0,0,0)}}
@media(prefers-reduced-motion:reduce){.arrival-mist,.skip-arrival{display:none!important}.harbour-background{will-change:auto;transform:scale(1.06)}}
/* THE SIGN-IN SPLASH. The account API's callback sends a finished sign-in back to this page as
   `/?signed-in=1`, and the inline script at the end of site/index.html's head sets
   `data-signed-in="1"` on the root element while that head is still being parsed - before the body
   exists, so before any frame of the homepage or of the arrival above can be painted. Everything
   visual is decided by the rules below: the splash is hidden markup on an ordinary visit, and the
   attribute makes it the only thing on screen. No module, no script and no second request stands
   between the flag and the first paint. */
.signed-in-splash{display:none;position:fixed;inset:0;z-index:60;padding:clamp(24px,6vw,56px);place-content:center;justify-items:center;gap:24px;text-align:center;background:radial-gradient(ellipse at 50% 30%,#16323c 0%,#0a1a21 72%)}
html[data-signed-in="1"] .signed-in-splash{display:grid}
.signed-in-splash-mark{width:clamp(72px,9vw,104px);height:auto}
.signed-in-splash-title{font:400 clamp(30px,4.6vw,56px)/1.06 Georgia,"Times New Roman",serif;letter-spacing:-.03em;color:#e8dcc0;margin:0;text-shadow:0 3px 30px #0003}
.signed-in-splash-fallback{max-width:32ch;margin:0;font-size:13px;line-height:1.7;color:var(--muted)}
/* The stage the splash replaces, including both surfaces the arrival owns - the mist and the Skip
   intro button site/home.js drives - so an intro that starts anyway cannot paint under it. */
html[data-signed-in="1"] .site-header,html[data-signed-in="1"] .home-content,html[data-signed-in="1"] .home-footer,html[data-signed-in="1"] .harbour-background,html[data-signed-in="1"] .arrival-mist,html[data-signed-in="1"] .skip-arrival,html[data-signed-in="1"] .home::after{display:none!important}

/* Shared navigation keeps the atlas and future Wiki familiar and easy to revisit. */
.site-header{position:relative;z-index:2;flex:none;height:72px;display:flex;align-items:center;justify-content:space-between;gap:24px;width:min(1120px,calc(100% - 96px));margin:0 auto;border-bottom:1px solid #e4dcc121}
.site-wordmark{display:inline-flex;align-items:center;font:23px Georgia,serif;letter-spacing:-.04em;text-decoration:none;color:#e5d4b1;white-space:nowrap}.site-wordmark .wordmark-mark{width:26px;height:26px;flex:0 0 auto;display:block;margin-right:9px;filter:drop-shadow(0 1px 2px rgba(0,0,0,.45))}.site-wordmark span{font:8px system-ui;letter-spacing:.2em;margin-left:10px;color:#a7b8b2}
.site-header nav{display:flex;align-items:center;gap:6px}.site-header nav>a,.site-header nav>button{display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:11px 17px;border-radius:8px;font-size:12px;text-decoration:none;color:#becbc5;line-height:1.2;white-space:nowrap}.site-header nav>a:hover{background:#ffffff0a;color:#f1e2c1}.site-header nav>a[aria-current="page"]{color:var(--gold);background:#d6bc850d}.site-header nav>button:disabled{cursor:not-allowed;opacity:.46}.site-header nav small{font-size:7px;letter-spacing:.04em;border:1px solid #ffffff35;border-radius:4px;padding:3px}
.home .home-hero{min-height:calc(100svh - 172px)}.is-arriving .site-header{animation:arrival-content 4.6s ease-out both}
.atlas .site-header{width:100%;height:64px;padding:0 24px;background:#10232b;border-bottom:1px solid var(--line)}.atlas .atlas-stage{height:calc(100dvh - 64px)}.atlas .atlas-stage:fullscreen{height:100dvh}
@media(max-width:900px){.site-header{width:calc(100% - 70px)}}
@media(max-width:600px){.site-header{width:calc(100% - 32px);height:60px;justify-content:center}.site-wordmark{display:none}
/* Five nav destinations — Home, Download, Map, Wiki, Store — have to fit 288px of header at
   320px wide. At the old 12px padding and 3px gap the row measured 330px and pushed the page
   sideways; 9px and 2px keeps the same type size inside the viewport. */
.site-header nav{gap:2px;width:100%;justify-content:space-between}.site-header nav>a,.site-header nav>button{font-size:11px;padding:11px 9px}.home .home-hero{min-height:calc(100svh - 100px)}.atlas .site-header{height:60px;padding:0 16px}.atlas .atlas-stage{height:calc(100dvh - 60px)}}

.hero-copy h1{font-size:clamp(44px,4.8vw,68px);text-wrap:balance}.hero-copy h1 em{display:block}
@media(min-width:601px) and (max-width:900px){.hero-copy h1{font-size:40px}}
@media(max-width:600px){.hero-copy h1{font-size:clamp(32px,9.8vw,45px)}}

.hero-actions{display:flex;align-items:stretch;gap:14px;flex-wrap:wrap}.launcher-button{display:flex;align-items:center;justify-content:center;gap:16px;min-width:258px;padding:19px 25px;border:1px solid #ffe5a9;border-radius:9px;background:linear-gradient(120deg,#f2d99d,#d3ae66);color:#192a2e;box-shadow:0 10px 40px #0006,0 0 40px #e6c98f28;font-size:16px;font-weight:700;text-align:left}.launcher-button:disabled{opacity:1;cursor:not-allowed}.launcher-button>svg{width:25px;height:25px}.launcher-button small{display:block;margin-top:5px;font-size:9px;text-transform:uppercase;letter-spacing:.13em;font-weight:600;color:#485047}
.hero-actions .map-link{background:#0b202b70;color:#e1d4b5;border:1px solid #d7ba7d65;gap:30px;box-shadow:0 6px 22px #0003;font-size:12px;font-weight:500;padding:17px 20px}.hero-actions .map-link:hover{background:#132c35b0;box-shadow:0 10px 25px #0005}
@media(max-width:600px){.hero-actions{justify-content:center;gap:12px}.launcher-button{width:100%;max-width:320px;font-size:16px;padding:18px 23px}.hero-actions .map-link{padding:13px 20px;gap:45px}}

.launcher-button{min-height:72px}.launcher-button>span{white-space:nowrap}.site-header nav>button:disabled{opacity:.7}

.hero-welcome{max-width:440px;font-size:13px;line-height:1.8;color:#c5d0c8;margin:-7px 0 25px;text-wrap:pretty}
@media(max-width:600px){.hero-welcome{font-size:12px;margin:-5px auto 23px;max-width:310px}}

.launcher-button:hover{background:linear-gradient(120deg,#ffe6ae,#dfbb76);box-shadow:0 12px 45px #0007,0 0 45px #e6c98f40}.download-chevron{font-size:18px;margin-left:5px}.site-header nav>button:not(:disabled){cursor:pointer}.site-header nav>button:not(:disabled):hover{background:#ffffff0a;color:#f1e2c1}
.launcher-downloads{position:fixed;inset:auto;margin:0;width:min(310px,calc(100vw - 24px));max-height:calc(100dvh - 24px);overflow:auto;padding:20px 10px 10px;border:1px solid #d7ba7d50;border-radius:15px;background:linear-gradient(145deg,#19333cf7,#0c202afc);color:var(--ink);box-shadow:0 25px 80px #0008,0 1px 0 #fff1 inset;backdrop-filter:blur(22px)}.launcher-downloads::backdrop{background:#07182030}.download-menu-title{font-size:8px;text-transform:uppercase;letter-spacing:.2em;color:var(--gold);margin:0 12px 8px}.launcher-downloads h2{font:23px Georgia,serif;margin:0 12px 18px;color:#ede2c9}.platform-download{display:flex;align-items:center;gap:13px;width:100%;padding:15px 12px;text-align:left;text-decoration:none;border-radius:9px;border:1px solid transparent}.platform-download+.platform-download{border-top:1px solid #ffffff0b}.platform-download:disabled{opacity:1;cursor:not-allowed}.platform-download:not(:disabled):hover{background:#d6bc8512;border-color:#d6bc8530}.platform-icon{display:grid;place-items:center;width:34px;height:34px;flex:none;font-size:25px;color:#d6c295;background:#d6bc850d;border:1px solid #d6bc8520;border-radius:8px}.platform-download strong{display:block;font-size:12px;font-weight:500;color:#e7decb}.platform-download small{display:block;font-size:9px;color:#8fa7a0;margin-top:6px}.platform-arrow{margin-left:auto;color:var(--gold);font-size:19px}
@media(prefers-reduced-motion:no-preference){.launcher-downloads:popover-open{animation:download-open .18s ease-out both}@keyframes download-open{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}}

.launcher-control{display:flex;border-radius:9px;box-shadow:0 10px 40px #0006,0 0 40px #e6c98f28}.launcher-control .launcher-button{border-radius:9px 0 0 9px;border-right:0;box-shadow:none;min-width:235px}.launcher-picker{display:grid;place-items:center;width:46px;flex:none;border:1px solid #ffe5a9;border-left:1px solid #8b733f55;border-radius:0 9px 9px 0;background:linear-gradient(120deg,#e5c88b,#d3ae66);color:#192a2e;font-size:24px}.launcher-picker:hover{background:#f2d99d}.launcher-control .launcher-button small{font-size:9px;letter-spacing:.06em;text-transform:none;font-weight:500;margin-top:6px}.recommended-platform{background:#d6bc850b;border-color:#d6bc8525}.recommended-platform .platform-icon{border-color:#d6bc8550;color:#edd7a5}
@media(max-width:600px){.launcher-control{width:100%;max-width:320px}.launcher-control .launcher-button{min-width:0;max-width:none;width:auto;flex:1;padding:18px 16px;font-size:15px;gap:12px}}

/* Keep map furniture anchored to its content, including after tools are removed. */
.map-key{top:22px}.map-navigation{position:absolute;top:22px;right:22px;display:grid;justify-items:center;gap:24px}.map-navigation .map-controls,.map-navigation .compass{position:static}
@media(max-width:600px){.map-key{top:12px}.map-navigation{top:12px;right:12px;gap:24px}}

/* The drawing palette sits at a designed distance from the chart's left edge, and the two rules
   below are the whole story of where that is: 166px on a wide chart, 148px below 600px. The media
   query wins because nothing writes an inline left for it unless the open map key has to be cleared,
   which site/map/map.js re-reads from here on every resize instead of keeping the width the chart
   loaded at. How tall the panel it opens may be is the room left above the first edge under it -
   the chart's footer, and the launcher's sticky bar where it spans the palette's columns - which
   site/map/map.js measures and publishes as --drawing-panel-room. That number already carries the
   notice band's reserved height, because the band moves this whole strip. The plain viewport
   subtraction stays as the other term of the min(): it is what this rule has always used, it is
   correct whenever nothing is docked under the panel, and keeping it means a measured room that is
   one frame stale during a resize can only ever be tightened, never loosened. */
.atlas .compass{left:22px;right:auto;top:24px;width:25px}.map-key{left:62px}.map-drawing{position:absolute;top:22px;left:166px;z-index:2;color:#e7decb}.map-drawing>summary{display:flex;gap:18px;align-items:center;list-style:none;cursor:pointer;padding:12px 14px;font-size:11px;border:1px solid var(--line);border-radius:12px;background:var(--surface);box-shadow:0 5px 25px #0003;backdrop-filter:blur(14px)}.map-drawing>summary::-webkit-details-marker{display:none}.map-drawing>summary span{color:var(--gold);font-size:14px}.drawing-panel{position:absolute;top:calc(100% + 8px);left:-104px;width:280px;max-height:min(var(--drawing-panel-room,100dvh),calc(100dvh - 240px));overflow:auto;padding:18px;border:1px solid var(--line);border-radius:12px;background:#10252ef5;box-shadow:0 12px 45px #0005;backdrop-filter:blur(18px)}.drawing-heading>strong{font:20px Georgia,serif;color:#e7d4ad}.drawing-heading label{display:flex;align-items:center;gap:7px;font-size:10px;margin:15px 0;color:#b9c7bc}.drawing-heading input{accent-color:var(--gold)}.drawing-tools{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.drawing-tools button{border:1px solid #cdb68725;border-radius:8px;padding:9px 3px;background:#ffffff03;color:#bacac1}.drawing-tools button[aria-pressed=true]{background:#cfb88b1c;border-color:#d9bf89;color:#f2daa7}.drawing-tools button>span{font:23px Georgia,serif;display:block;line-height:1.2}.drawing-tools small{display:block;font-size:9px;margin-top:5px}.drawing-options{display:flex;gap:16px;margin:18px 0}.drawing-options label{font-size:10px;flex:1;color:#b9c7bc}.drawing-options input,.drawing-options select{display:block;width:100%;height:30px;margin-top:8px;background:#18333c;border:1px solid var(--line);border-radius:5px;color:#ded5bf}.drawing-history{display:flex;gap:8px}.drawing-history button{flex:1;padding:8px 3px;border:1px solid #cfb88b30;border-radius:6px;font-size:10px}.drawing-history button:disabled{opacity:.4}.drawing-help{font-size:9px;line-height:1.8;color:#9bafa6;margin:17px 0 12px}.drawing-saved{display:block;font-size:9px;line-height:1.6;color:#d8c38f}#terrain[data-drawing-tool]:not([data-drawing-tool=view]){cursor:crosshair}
@media(max-width:600px){.atlas .compass{left:12px;top:15px;width:22px}.map-key{left:48px}.map-drawing{top:12px;left:148px}.map-drawing>summary{font-size:10px;padding:10px 12px;gap:12px}.drawing-panel{left:-136px;width:min(280px,calc(100vw - 92px));padding:14px;max-height:min(var(--drawing-panel-room,100dvh),calc(100dvh - 210px))}}

.key-content{width:min(232px,calc(100vw - 124px))}@media(max-width:600px){.key-content{width:min(220px,calc(100vw - 124px))}}

.download-chevron-icon{width:18px;height:18px;display:block;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
.site-header nav>button[popovertarget]{display:inline-flex;align-items:center;justify-content:center;gap:8px}
.launcher-picker{padding:0;align-items:center;justify-content:center;line-height:1}
.platform-icon{width:30px;height:30px;object-fit:contain;padding:4px;box-sizing:content-box}
#launcher-setup{max-height:calc(100dvh - 40px);overflow:auto}
.setup-instructions{font-size:14px;line-height:1.65}.setup-instructions .install-steps li{display:list-item;margin:18px 0}.setup-instructions strong{display:block}.setup-instructions pre{white-space:pre-wrap;overflow-wrap:anywhere;background:#07151b;padding:12px;border-radius:6px;line-height:1.6}.setup-instructions code{font-size:12px}.fuse-packages{margin:16px 0}.fuse-packages dt{font-weight:600}.fuse-packages dd{margin:0 0 14px}

.download-icon-credit{display:block;font-size:10px;opacity:.6;margin:12px 6px 2px;text-align:right}

.platform-icon{filter:invert(89%) sepia(20%) saturate(550%) hue-rotate(345deg)}

/* Legal links in the page footers, and on the 404 page, have to be readable links rather than
   the faint grey the rest of the footer uses. Colour, underline and hover match the legal
   documents' own footer in site/legal/legal.css so all five footers read as one set; the focus
   ring is deliberately not touched, because the base stylesheet already draws it for every link.
   The separator owns its own space, so a footer can wrap between spans without a stray dot, and
   the links themselves never break across lines. */
.legal-links{white-space:nowrap}.legal-links>span[aria-hidden]{margin:0 .5em}
.legal-links a,.not-found-footer a{color:#c8bd9e;text-decoration-color:#c8bd9e55}
/* Spelt out for the chart too: its own `.map-bottom a` rule is earlier in this file, and a reorder
   of these blocks must not quietly hand the legal links back to the faint footer grey. */
.map-bottom .legal-links a{color:#c8bd9e}
.legal-links a:hover,.legal-links a:focus-visible,.not-found-footer a:hover,.not-found-footer a:focus-visible{color:var(--gold);text-decoration-color:currentColor}
/* The 404 page has no footer of its own; this line sits under the page's own content, on the
   same measure, and is only ever served by the website (the launcher's easter:// handler answers
   a missing file with plain text). */
.not-found-footer{display:flex;align-items:center;gap:.5em;width:min(1120px,calc(100% - 96px));margin:0 auto;padding:0 0 30px;font-size:10px;letter-spacing:.04em;color:#a6b5b08f}
.not-found-footer>span[aria-hidden]{margin:0}
@media(max-width:900px){.not-found-footer{width:calc(100% - 70px)}}
@media(max-width:600px){.not-found-footer{width:calc(100% - 48px);padding-bottom:24px;font-size:9px}}

/* Centre the complete website hero as a unit; the launcher has its own home grid. */
html:not(.desktop-mode) .home-content{padding-top:0}
html:not(.desktop-mode) .home .home-hero{min-height:calc(100svh - 72px);grid-template-columns:260px minmax(0,max-content);justify-content:center;gap:64px;padding:48px 0}
@media(min-width:601px) and (max-width:1000px){html:not(.desktop-mode) .home .home-hero{grid-template-columns:190px minmax(0,1fr);gap:36px}}
@media(max-width:600px){html:not(.desktop-mode) .home .home-hero{min-height:calc(100svh - 60px);grid-template-columns:minmax(0,1fr);gap:32px;padding:44px 0;align-content:center}}

/* Shared scrollbars for every page and nested launcher panel. Keep a usable
   track width; visual styling must not hide or replace native scrolling. */
:root{--scrollbar-track:#0a1c24;--scrollbar-thumb:#899b93;--scrollbar-hover:#b8a67d;--scrollbar-active:#dfc18a}
*{scrollbar-width:auto;scrollbar-color:var(--scrollbar-thumb) var(--scrollbar-track)}
@supports selector(::-webkit-scrollbar){
 *{scrollbar-color:auto}
 *::-webkit-scrollbar{width:12px;height:12px}
 *::-webkit-scrollbar-track{background:var(--scrollbar-track)}
 *::-webkit-scrollbar-thumb{min-height:32px;min-width:32px;background:var(--scrollbar-thumb);border:3px solid var(--scrollbar-track);border-radius:10px;background-clip:padding-box}
 *::-webkit-scrollbar-thumb:hover{background-color:var(--scrollbar-hover)}
 *::-webkit-scrollbar-thumb:active{background-color:var(--scrollbar-active)}
 *::-webkit-scrollbar-corner{background:var(--scrollbar-track)}
}
/* High-contrast users keep the browser's native scrollbar presentation. */
@media(forced-colors:active){
 *{scrollbar-color:auto;scrollbar-width:auto}
 *::-webkit-scrollbar,*::-webkit-scrollbar-track,*::-webkit-scrollbar-thumb,*::-webkit-scrollbar-thumb:hover,*::-webkit-scrollbar-thumb:active,*::-webkit-scrollbar-corner{all:revert}
}
