:root{--ink:#e7e3d7;--muted:#908f87;--line:#292c2a;--gold:#c7a965;--red:#c05b50;--green:#819e75;--bg:#101211}
*{box-sizing:border-box}
html{background:var(--bg);color:var(--ink);color-scheme:dark}
body{margin:0;font-family:Arial,Helvetica,sans-serif;background:radial-gradient(circle at 68% 16%,#25251f 0,transparent 31%),linear-gradient(135deg,#0d100f,#151713 65%,#0c0e0d);min-height:100vh}
button,input{font:inherit;color:inherit}
button{-webkit-tap-highlight-color:transparent;touch-action:manipulation}
main{max-width:1280px;margin:auto;padding:0 36px}
header{height:92px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:13px}
.brand b{display:block;letter-spacing:.28em;font-family:Georgia,serif;font-size:18px}
.brand small{font-size:9px;color:var(--muted);letter-spacing:.22em}
.sigil{font-size:29px;color:var(--gold)}
.round{height:40px;width:40px;border:1px solid #3a3d39;border-radius:50%;background:transparent;font-size:23px;cursor:pointer}
.hero{min-height:620px;position:relative;display:grid;grid-template-columns:.8fr 1.2fr;align-items:center;border-bottom:1px solid var(--line);overflow:hidden}
.intro{z-index:2;padding-bottom:58px}
.intro>p:first-child,.label{font-size:10px;letter-spacing:.25em;color:var(--gold)}
h1{font-family:Georgia,serif;font-size:clamp(52px,6vw,88px);line-height:.9;font-weight:400;margin:24px 0}
h1 i{font-weight:400;color:#989890}
.lede{color:#a7a89f;line-height:1.7;max-width:410px;font-family:Georgia,serif;font-size:17px}
.activate{margin-top:28px;background:transparent;border:1px solid #56584f;border-radius:100px;padding:13px 18px;text-transform:uppercase;letter-spacing:.15em;font-size:9px;cursor:pointer}
.activate span{color:var(--gold);font-size:17px;margin-right:10px}
.activate b{font-weight:400}
.notice{min-height:20px;max-width:390px;margin:12px 0 0;color:#a7a89f;font-size:12px;line-height:1.45}
.dial{width:min(52vw,530px);aspect-ratio:1;border:1px solid #42443e;border-radius:50%;position:relative;justify-self:center;box-shadow:0 0 0 20px #151713,0 0 0 21px #282b27,inset 0 0 90px #090a09}
.dial:before,.dial:after{content:"";position:absolute;inset:10%;border:1px solid #343731;border-radius:50%}
.dial:after{inset:22%;border-color:#262924}
.ticks i{position:absolute;top:2%;left:49.8%;height:4%;width:1px;background:#54564d;transform-origin:50% 1200%}
.ticks i:nth-child(9n+1){height:7%;background:var(--gold)}
.cardinals{position:absolute;inset:0;transition:transform .2s}
.cardinals b{position:absolute;font:20px Georgia,serif;color:#8f9086}
.cardinals .north{top:8%;left:49%;color:var(--red)}
.east{right:9%;top:48%}.south{bottom:8%;left:49%}.west{left:9%;top:48%}
.needle{position:absolute;left:50%;top:13%;height:37%;width:2px;background:linear-gradient(var(--red) 0 54%,#777 54%);transform-origin:bottom center;z-index:3}
.needle span{position:absolute;width:7px;height:7px;top:-2px;left:-3px;background:var(--red);transform:rotate(45deg)}
.dial-center{position:absolute;inset:32%;border:1px solid #353832;border-radius:50%;background:#141614;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:4}
.status{font-size:8px;letter-spacing:.14em;color:#919489}
.status i{display:inline-block;width:5px;height:5px;background:var(--green);border-radius:50%;margin-right:5px;box-shadow:0 0 8px var(--green)}
.dial-center strong{font:clamp(42px,5vw,66px) Georgia,serif;letter-spacing:-.04em;margin:7px 0}
.dial-center em{font:12px Arial;color:var(--gold);font-style:normal}
.bearing{position:absolute;bottom:15%;width:100%;text-align:center;letter-spacing:.2em;color:#777a71;font-size:8px}
.quick{position:absolute;bottom:24px;right:0;width:58%;display:flex;justify-content:space-between;border-top:1px solid var(--line);padding-top:16px}
.quick span,.metrics span{font-size:8px;color:#777a73;letter-spacing:.14em}
.quick b,.metrics b{display:block;color:#d2d2c8;font-size:11px;margin-top:7px;letter-spacing:.04em}
.instruments{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin:46px 0}
.panel{background:linear-gradient(145deg,#181b19,#121513);min-height:300px;padding:25px;position:relative}
.label{display:flex;justify-content:space-between}
.label span{color:#73766f}
.bigrow{display:flex;align-items:flex-end;gap:19px;margin:39px 0}
.bigrow>strong{font:74px Georgia,serif}
.bigrow div b{display:block;font:18px Georgia,serif}
.bigrow div small{display:block;color:var(--muted);margin-top:7px}
.metrics{position:absolute;left:25px;right:25px;bottom:23px;display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line);padding-top:14px}
.spectrum{height:130px;display:flex;align-items:center;gap:4px;margin-top:30px}
.spectrum i{display:block;flex:1;background:linear-gradient(to top,var(--green),var(--gold));min-height:3px;transition:height .08s}
.soundfoot,.pulsefoot{display:flex;justify-content:space-between;align-items:end}
.soundfoot strong,.pulsefoot strong{font:52px Georgia,serif}
.soundfoot small,.pulsefoot small{display:block;color:var(--muted);font-size:9px}
.soundfoot button,.pulsefoot button{border:1px solid #4c5049;background:transparent;border-radius:100px;padding:9px 13px;text-transform:uppercase;font-size:8px;letter-spacing:.12em;cursor:pointer}
.pulsewave{height:130px;display:flex;align-items:center}
.pulsewave svg{width:100%;overflow:visible}
.pulsewave path{fill:none;stroke:var(--red);stroke-width:1.5;filter:drop-shadow(0 0 5px #c05b5066)}
.heart{color:#e17c70}
.skyfield{height:180px;position:relative;overflow:hidden;margin:23px 0}
.skyfield:before{content:"";position:absolute;width:260px;height:260px;border:1px solid #343933;border-radius:50%;left:50%;transform:translateX(-50%)}
.horizon{position:absolute;left:0;right:0;bottom:18px;border-top:1px solid #53564f}
.sunmark{position:absolute;color:var(--gold);font-size:26px;text-shadow:0 0 20px var(--gold);transform:translate(-50%,50%)}
.skyfield>span{position:absolute;bottom:0;font:11px Georgia,serif;color:#777}
.skyfield>span:nth-last-child(3){left:0}.skyfield>span:nth-last-child(2){left:49%}.skyfield>span:last-child{right:0}
.gauge{height:185px;position:relative;margin-top:22px;overflow:hidden}
.gaugeArc{position:absolute;width:240px;height:240px;border:1px solid #444840;border-radius:50%;left:50%;top:5px;transform:translateX(-50%)}
.gaugeNeedle{position:absolute;width:2px;height:87px;background:var(--gold);left:50%;top:40px;transform-origin:bottom;transition:.2s}
.gauge strong{position:absolute;left:0;right:0;bottom:9px;text-align:center;font:34px Georgia,serif}
.gauge small{font-size:11px;color:var(--muted)}
input[type=range]{width:100%;accent-color:var(--gold)}
.hint{color:#70736b;display:block;text-align:center;margin-top:8px}
.coord{display:flex;flex-direction:column;gap:20px;margin-top:42px}
.coord strong{font:35px Georgia,serif}
.coord i{font:12px Arial;color:var(--gold);font-style:normal}
footer{display:flex;align-items:center;justify-content:space-between;padding:12px 0 45px;color:#74776f}
footer span{color:var(--gold);font-family:Georgia,serif;letter-spacing:.2em}
footer p{font:italic 16px Georgia,serif}
footer small{font-size:8px;max-width:240px;line-height:1.5}
.noscript{position:fixed;inset:auto 12px 12px;padding:12px;background:#442b27;color:#fff;border:1px solid var(--red);z-index:10}
@media(max-width:850px){main{padding:0 18px}header{height:72px}.hero{display:flex;flex-direction:column;padding:56px 0 85px;min-height:auto}.intro{padding:0;width:100%}.dial{width:min(84vw,480px);margin:55px auto}.quick{bottom:20px;width:100%}.instruments{grid-template-columns:1fr 1fr}.panel{min-height:290px}footer{gap:20px;align-items:flex-start;flex-wrap:wrap}}
@media(max-width:560px){h1{font-size:56px}.lede{font-size:15px}.dial-center strong{font-size:41px}.quick span:nth-child(2){display:none}.quick{justify-content:space-around}.instruments{grid-template-columns:1fr;margin-top:28px}.panel{min-height:285px}footer{padding-bottom:30px}.brand small{letter-spacing:.11em}.label{font-size:9px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}