@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@500;600;700&display=swap');

:root { --ink:#f5f7f3; --muted:#a7b0ae; --lime:#c8ff3d; --glass:rgba(7,16,20,.72); --line:rgba(255,255,255,.15); }
* { box-sizing:border-box; }
html, body, #cesiumContainer { width:100%; height:100%; margin:0; overflow:hidden; }
body { background:#071014; color:var(--ink); font-family:'DM Sans',sans-serif; }
button, input { font:inherit; }
button, a { -webkit-tap-highlight-color:transparent; }
#cesiumContainer { position:fixed; inset:0; background:radial-gradient(circle at 62% 45%,#173d42,#071014 64%); }
.cesium-viewer-bottom, .cesium-viewer-toolbar { display:none!important; }
.vignette { position:fixed; inset:0; pointer-events:none; background:linear-gradient(90deg,rgba(3,9,12,.78) 0%,rgba(3,9,12,.18) 42%,transparent 68%),linear-gradient(0deg,rgba(3,9,12,.5),transparent 25%); }
.topbar { position:fixed; z-index:5; top:0; left:0; right:0; display:grid; grid-template-columns:1fr minmax(320px,560px) 1fr; align-items:center; gap:24px; padding:26px 34px; }
.brand { color:inherit; text-decoration:none; display:flex; align-items:center; gap:12px; width:max-content; }
.brand-mark { width:39px; height:39px; border:2px solid var(--lime); border-radius:50%; display:grid; place-items:center; box-shadow:0 0 24px rgba(200,255,61,.2); }
.brand-mark:before,.brand-mark:after,.brand-mark span { content:""; position:absolute; border:1px solid var(--lime); border-radius:50%; }
.brand-mark:before { width:17px; height:34px; }.brand-mark:after { width:34px; height:11px; }.brand-mark span { width:27px; height:27px; border-top-color:transparent; border-bottom-color:transparent; }
.brand-copy { display:grid; }.brand-copy strong { font:700 21px/1 'Space Grotesk'; letter-spacing:.08em; }.brand-copy small { color:var(--muted); font-size:10px; text-transform:uppercase; letter-spacing:.12em; margin-top:5px; }
.search { height:50px; display:flex; align-items:center; padding:5px 5px 5px 17px; border:1px solid var(--line); border-radius:14px; background:rgba(10,21,24,.78); backdrop-filter:blur(18px); box-shadow:0 12px 40px rgba(0,0,0,.2); }
.search-icon { width:14px; height:14px; border:1.5px solid var(--muted); border-radius:50%; margin-right:12px; position:relative; flex:0 0 auto; }.search-icon:after { content:""; position:absolute; width:6px; height:1.5px; background:var(--muted); transform:rotate(45deg); right:-5px; bottom:-2px; }
.search input { flex:1; min-width:0; background:transparent; border:0; outline:0; color:white; font-size:14px; }.search input::placeholder { color:#899492; }
.search button,.primary-button { border:0; cursor:pointer; background:var(--lime); color:#11180d; font-weight:700; border-radius:10px; }.search button { height:38px; padding:0 18px; font-size:13px; }
.icon-button { justify-self:end; width:42px; height:42px; border:1px solid var(--line); border-radius:50%; background:var(--glass); color:white; cursor:pointer; font-family:serif; font-weight:bold; }
.hero-card { position:fixed; z-index:3; left:8vw; top:50%; transform:translateY(-45%); width:350px; }
.eyebrow { color:var(--lime); text-transform:uppercase; font-size:11px; letter-spacing:.18em; font-weight:700; display:flex; align-items:center; gap:9px; }.eyebrow span { display:inline-block; width:22px; height:2px; background:var(--lime); }
h1 { font:600 clamp(50px,6vw,88px)/.88 'Space Grotesk'; letter-spacing:-.06em; margin:22px 0 18px; text-shadow:0 2px 30px rgba(0,0,0,.3); }
.hero-card p { color:#bec6c4; font-size:15px; }.coordinates { display:flex; gap:10px; margin:25px 0; }.coordinates span { border:1px solid var(--line); background:rgba(6,15,18,.55); border-radius:7px; padding:7px 9px; color:#b8c1bf; font:500 11px 'Space Grotesk'; letter-spacing:.06em; }
.primary-button { display:flex; justify-content:space-between; align-items:center; width:190px; padding:14px 16px; transition:.2s ease; }.primary-button:hover,.search button:hover { filter:brightness(1.08); transform:translateY(-1px); }
.mode-pill { position:fixed; z-index:3; top:99px; left:50%; transform:translateX(-50%); padding:8px 13px; border:1px solid var(--line); border-radius:999px; background:rgba(7,16,20,.64); backdrop-filter:blur(12px); color:#c4cdca; text-transform:uppercase; letter-spacing:.12em; font-size:9px; }.mode-pill span { display:inline-block; width:6px; height:6px; background:var(--lime); border-radius:50%; margin-right:6px; box-shadow:0 0 8px var(--lime); }
.globe-controls { position:fixed; z-index:4; right:32px; top:50%; transform:translateY(-50%); display:grid; padding:5px; background:rgba(7,16,20,.7); border:1px solid var(--line); border-radius:13px; backdrop-filter:blur(14px); }.globe-controls button { width:39px; height:39px; border:0; background:transparent; color:#dfe4e2; font-size:21px; cursor:pointer; border-radius:8px; }.globe-controls button:hover { background:rgba(255,255,255,.1); }.globe-controls>span { height:1px; background:var(--line); margin:5px; }
.status { position:fixed; z-index:8; left:50%; bottom:55px; transform:translate(-50%,20px); background:rgba(7,16,20,.9); border:1px solid var(--line); border-radius:10px; padding:10px 15px; color:#dce2df; font-size:13px; opacity:0; pointer-events:none; transition:.25s; }.status.show { opacity:1; transform:translate(-50%,0); }
.place-card { position:fixed; z-index:6; right:92px; bottom:72px; width:min(360px,calc(100vw - 40px)); padding:25px; background:rgba(7,16,20,.9); border:1px solid var(--line); border-radius:18px; backdrop-filter:blur(20px); box-shadow:0 22px 70px rgba(0,0,0,.42); opacity:0; visibility:hidden; transform:translateY(20px); transition:.35s ease; }.place-card.open{opacity:1;visibility:visible;transform:none}.place-card>button:first-child{position:absolute;right:13px;top:10px;border:0;background:transparent;color:#aeb7b5;font-size:24px;cursor:pointer}.place-label{color:var(--lime);font-size:10px;font-weight:700;letter-spacing:.16em;text-transform:uppercase}.place-card h2{font:600 27px 'Space Grotesk';margin:9px 0}.place-card p{color:#aeb7b5;font-size:13px;line-height:1.6}.place-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin:18px 0}.place-stats span{padding:10px;border:1px solid var(--line);border-radius:9px;color:#75807d;font-size:9px;text-transform:uppercase}.place-stats b{display:block;color:white;font:600 13px 'Space Grotesk';margin-bottom:3px;text-transform:none}.secondary-button{border:1px solid var(--line);border-radius:9px;background:rgba(255,255,255,.04);color:white;padding:10px 13px;cursor:pointer}
footer { position:fixed; z-index:3; bottom:22px; left:34px; right:34px; display:flex; justify-content:space-between; color:#77827f; font-size:10px; letter-spacing:.11em; text-transform:uppercase; }.future i { display:inline-block; width:5px; height:5px; border-radius:50%; background:var(--lime); margin:0 7px 1px 0; }
dialog { max-width:570px; color:white; background:rgba(8,18,21,.96); border:1px solid var(--line); border-radius:20px; padding:38px; backdrop-filter:blur(24px); box-shadow:0 30px 90px #000; }dialog::backdrop { background:rgba(0,0,0,.64); backdrop-filter:blur(4px); }dialog h2 { font:600 36px/1.1 'Space Grotesk'; margin:18px 0; }dialog p { color:#aab4b1; line-height:1.7; }.dialog-close { position:absolute; right:16px; top:13px; background:none; border:0; color:white; font-size:27px; cursor:pointer; }.roadmap { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-top:28px; }.roadmap span { border:1px solid var(--line); padding:13px; border-radius:10px; color:#77827f; font-size:10px; text-transform:uppercase; }.roadmap strong { display:block; color:white; text-transform:none; font-size:12px; margin-top:5px; }
.sr-only { position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0 }.noscript { position:fixed; inset:0; display:grid; place-items:center; background:#071014; z-index:20; }
@media(max-width:720px){.topbar{grid-template-columns:1fr auto;padding:18px;gap:12px}.brand-copy small,.info-button,.mode-pill{display:none}.search{grid-column:1/-1;grid-row:2;height:48px}.hero-card{left:20px;right:20px;top:auto;bottom:75px;transform:none;width:auto}.hero-card h1{font-size:48px;margin:15px 0 12px}.hero-card p{margin:0}.coordinates{margin:14px 0}.primary-button{width:175px}.globe-controls{right:14px;top:46%;}.future{display:none}footer{left:20px;bottom:16px}.vignette{background:linear-gradient(0deg,rgba(3,9,12,.9) 0%,rgba(3,9,12,.12) 65%)}dialog{margin:18px;padding:30px 22px}.roadmap{grid-template-columns:1fr}.place-card{right:20px;left:20px;bottom:55px;width:auto}.hero-card.arrived{opacity:0;visibility:hidden}}
@media(max-height:650px) and (max-width:720px){.coordinates{display:none}.hero-card{bottom:45px}.hero-card h1{font-size:40px}}
