*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#00060d;color:#8dbfc0;font-family:Inter,"PingFang SC","Microsoft YaHei",sans-serif;overscroll-behavior:none}#ocean,canvas{position:fixed;inset:0;width:100%;height:100%;display:block}#ocean{touch-action:none}canvas:focus{outline:none}.vignette{position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 42%,transparent 42%,#00071158 100%)}.hud{position:fixed;display:flex;align-items:center;justify-content:space-between;pointer-events:none;opacity:.38;transition:opacity 1.1s;color:#73a9ad}.hud-active .hud,.hud:focus-within{opacity:.94}header{left:30px;right:30px;top:max(22px,env(safe-area-inset-top))}.identity{display:flex;align-items:center;gap:13px}.mark{font-size:33px;opacity:.48}h1{font-size:18px;font-weight:400;letter-spacing:8px;margin:0 0 8px}.identity p{font-size:8px;letter-spacing:2.5px;margin:0;opacity:.55}.top-tools{align-self:flex-start}.modes{display:flex;gap:10px;pointer-events:auto}.modes button{border:0;background:transparent;border-radius:0;width:auto;min-width:64px;height:44px;padding:0 10px;font-size:11px;letter-spacing:1px;opacity:.72}.modes button:hover,.modes button[aria-pressed=true]{background:transparent;opacity:1;color:#add7d7;text-decoration:underline;text-decoration-color:#53969770;text-underline-offset:7px}.modes button[aria-pressed=true]{text-shadow:0 0 12px #3d989441}button{-webkit-tap-highlight-color:transparent;color:inherit;border:1px solid #5b959634;background:#05232d73;border-radius:50%;cursor:pointer;font-family:inherit;transition:background .25s,color .25s}button:focus-visible{outline:1px solid #8ac9c9;outline-offset:4px}button:hover{background:#183e4866}button[hidden]{display:none}footer{left:0;bottom:max(18px,env(safe-area-inset-bottom))}.journey{width:249px;padding:12px 17px 13px 22px;border:1px solid #5d979732;border-left:0;border-radius:0 6px 6px 0;background:linear-gradient(105deg,#03212aaf,#071c2770);box-shadow:0 6px 24px #00081430;backdrop-filter:blur(3px)}.instrument-label{font-size:8px;letter-spacing:2px;display:flex;align-items:center;gap:7px;padding-bottom:10px;border-bottom:1px solid #4e80822e}.instrument-label i{width:3px;height:3px;border-radius:50%;background:#87c6b3;box-shadow:0 0 6px #7bd3b94a}.instrument-label>span{margin-left:auto;font-size:7px;opacity:.5;letter-spacing:1px}.instruments{display:grid;grid-template-columns:1.25fr 1fr;gap:20px;margin-top:11px}.eyebrow{font-size:8px;letter-spacing:2px;opacity:.66}.reading{display:flex;gap:5px;align-items:baseline;margin-top:5px;color:#8cc1c3}.reading>span{font-size:21px;letter-spacing:2px;font-variant-numeric:tabular-nums;font-weight:300}.reading small{font-size:9px;opacity:.5}.ticks{height:4px;margin-top:9px;background:repeating-linear-gradient(90deg,#6ea8aa66 0 1px,transparent 1px 8px);opacity:.5}.touch-pad{position:fixed;right:23px;bottom:max(25px,env(safe-area-inset-bottom));display:grid;grid-template-columns:repeat(3,44px);gap:5px;opacity:.35;color:#82b7bb;transition:opacity 1.1s}.hud-active .touch-pad,.touch-pad:focus-within{opacity:.88}.touch-pad button{width:44px;height:44px;touch-action:none;user-select:none;font-size:17px}.touch-pad button:first-child{grid-column:2}.touch-pad button:nth-child(2){grid-column:1}.held{background:#366e7580!important;border-color:#96d6d48c!important}#contact-flash{position:fixed;inset:0;pointer-events:none;opacity:0;box-shadow:inset 0 0 100px 30px #ffbca499}#pilot-view{position:fixed;inset:0;pointer-events:none;display:none;background:radial-gradient(ellipse at center,transparent 48%,#0107108c 100%)}.first-person #pilot-view{display:block}#pilot-view>span{position:absolute;top:120px;left:50%;transform:translateX(-50%);font-size:8px;letter-spacing:3px;opacity:.26}.reticle{position:absolute;top:50%;left:50%;width:12px;height:12px;border:1px solid #72a5a12b;border-radius:50%;transform:translate(-50%,-50%)}.reticle:after{content:'';width:2px;height:2px;border-radius:50%;background:#9bccb842;position:absolute;left:4px;top:4px}#loading{position:fixed;inset:0;background:radial-gradient(ellipse at 50% 10%,#123b50,#02101e 80%);display:flex;align-items:center;justify-content:center;flex-direction:column;transition:opacity 1s;z-index:10}#loading.finished{opacity:0;pointer-events:none}#loading h2{font-weight:300;font-size:21px;letter-spacing:6px;margin:30px 0 14px}#progress{font-size:11px;letter-spacing:2px;opacity:.6}.loader-ring{height:48px;width:48px;border:1px solid #c4e9e722;border-top-color:#c4e9e7aa;border-radius:50%;animation:turn 3s linear infinite}@keyframes turn{to{transform:rotate(360deg)}}#retry{width:120px;height:38px;border-radius:20px;font-size:13px;margin-top:20px}@media(max-width:600px){header{left:18px;right:18px}.identity{gap:7px}.mark{font-size:27px}h1{font-size:17px;letter-spacing:6px}.identity p{font-size:7px;letter-spacing:1.5px}.modes{flex-direction:column;gap:0}.modes button{padding:0 6px;font-size:10px}.journey{width:183px;padding:10px 10px 11px 14px}.instruments{gap:12px}.instrument-label{font-size:7px;letter-spacing:1px}.reading>span{font-size:17px;letter-spacing:1px}.eyebrow{font-size:7px;letter-spacing:1px}.touch-pad{right:15px;gap:3px}.hud{opacity:.50}.touch-pad{opacity:.50}#pilot-view>span{top:170px;font-size:7px}}@media(max-height:500px){header{top:8px}.identity p{display:none}.mark{font-size:25px}h1{font-size:16px}.journey{padding-top:8px;padding-bottom:8px;width:220px}.instrument-label{display:none}.instruments{margin-top:0}.reading>span{font-size:18px}.ticks{margin-top:5px}footer{bottom:12px}#pilot-view>span{top:30px}.touch-pad{bottom:15px}}
#flash{position:fixed;inset:0;background:#f4fbff;opacity:0;pointer-events:none;transition:opacity .55s ease-out;z-index:20}#flash.on{opacity:.9;transition:none}
.photo-mode header,.photo-mode footer,.photo-mode #pilot-view{opacity:0!important;pointer-events:none!important}.photo-mode .vignette{opacity:.4}
#photo-bar{position:fixed;left:50%;bottom:max(26px,env(safe-area-inset-bottom));transform:translateX(-50%);display:none;align-items:center;gap:16px;padding:9px 16px 9px 9px;border:1px solid #9fd6d62b;border-radius:40px;background:#021a22a6;color:#b9e2e1;z-index:15}.photo-mode #photo-bar{display:flex}
#shutter{width:54px;height:54px;border:2px solid #d9f4f2c0;background:transparent;display:grid;place-items:center}#shutter i{display:block;width:40px;height:40px;border-radius:50%;background:#e8fbfa;transition:transform .12s}#shutter:active i{transform:scale(.86)}
.photo-copy{display:flex;flex-direction:column;gap:4px}.photo-copy b{font-weight:400;font-size:12px;letter-spacing:3px}.photo-copy span{font-size:9px;letter-spacing:1px;opacity:.6}
#photo-exit{width:auto;height:36px;padding:0 14px;border-radius:18px;font-size:11px;letter-spacing:1px}
#photo-preview{position:fixed;right:24px;top:22px;width:min(300px,64vw);margin:0;padding:9px 9px 0;background:#eef3f1;box-shadow:0 18px 40px #0008;transform:rotate(-1.6deg);z-index:16;animation:develop .6s ease-out}#photo-preview[hidden]{display:none}#photo-preview img{display:block;width:100%}
#photo-preview figcaption{display:flex;align-items:center;gap:10px;padding:9px 2px 10px;font-size:11px;color:#20383d}#photo-preview figcaption span{margin-right:auto;letter-spacing:2px;opacity:.6}#photo-save{color:#0b5a60;text-decoration:none;border-bottom:1px solid #0b5a6055}#photo-close{width:auto;height:26px;padding:0 10px;border-radius:13px;background:#0b2f351a;border-color:#0b2f3530;color:#20383d;font-size:11px}
@keyframes develop{from{opacity:0;transform:rotate(-1.6deg) translateY(-12px)}}
@media(max-width:600px){#photo-bar{left:14px;transform:none;padding-right:10px;gap:10px}.photo-copy span{display:none}#photo-preview{right:14px;top:14px}}