:root{color-scheme:dark;--bg:#07151f;--panel:#0e2530;--line:#29434b;--text:#e6efdf;--muted:#91aba8;--mint:#87d3c0;--amber:#edc085;--red:#ec9d8f;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text)}.game-page{overflow:hidden;overscroll-behavior:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
button,a,input{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer;border:1px solid var(--line);background:#17343e;border-radius:10px;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;touch-action:manipulation}
button:hover{background:#274b53}button:disabled{opacity:.4;cursor:not-allowed}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--amber);outline-offset:3px}
button>span,button>small{pointer-events:none}a{color:inherit;text-decoration:none}button[hidden],[hidden]{display:none!important}
.app{padding:0 18px;max-width:2100px;margin:auto}.topbar{height:72px;display:flex;align-items:center;gap:25px}.catalog-link{font-size:12px;color:#a2bbb7;padding:12px 0;white-space:nowrap}.brand{display:flex;align-items:center;gap:11px;font-size:16px;font-weight:750;letter-spacing:2px}.brand-mark{font-size:29px;color:var(--amber)}.brand small{font:7px ui-monospace,monospace;letter-spacing:2px;display:block;margin-top:5px;color:#92b7ad}.version-tag{font:9px monospace;border:1px solid #3d5859;border-radius:5px;padding:5px;color:#9eb8af}
.top-status{margin-left:auto;font-size:10px;color:var(--muted);display:flex;align-items:center;gap:8px}.status-dot{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--mint);flex-shrink:0;box-shadow:0 0 10px #87d3c055}
.topbar nav{display:flex;gap:7px}.icon-button{width:40px;height:40px;background:transparent}.menu-button{padding:0 17px;background:#17323b;font-size:12px}
.workspace{display:block}.stage{position:relative;isolation:isolate;width:100%;height:calc(100dvh - 111px - env(safe-area-inset-bottom));min-height:280px;border:1px solid #304953;border-radius:18px;overflow:hidden;background:#092532;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
#ocean{display:block;position:absolute;width:100%;height:100%;inset:0;touch-action:none;user-select:none;-webkit-user-select:none}
.hud{position:absolute;top:20px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:28px;padding:16px 24px;border:1px solid #5b88814a;background:#071d29e8;border-radius:12px;backdrop-filter:blur(14px);width:min(640px,90%);pointer-events:none}
.meter{flex:1;min-width:70px}.meter>div{display:flex;justify-content:space-between;gap:9px;font-size:10px;margin-bottom:8px;color:var(--mint)}.meter b,.cargo-meter b{font-size:8px;font-weight:500;letter-spacing:1px}.meter strong{font:11px monospace;color:#e6efdf}.hull-meter>div{color:var(--amber)}
progress{appearance:none;border:0;display:block;height:4px;width:100%;border-radius:3px;background:#29444b;overflow:hidden}progress::-webkit-progress-bar{background:#29444b}progress::-webkit-progress-value{background:var(--mint)}progress::-moz-progress-bar{background:var(--mint)}.hull-meter progress::-webkit-progress-value{background:var(--amber)}.hull-meter progress::-moz-progress-bar{background:var(--amber)}.low progress::-webkit-progress-value{background:var(--red)}
.cargo-meter{display:grid;gap:5px;color:var(--muted);font-size:10px}.cargo-meter strong{font:16px monospace;color:var(--text)}.cargo-meter small{font-size:10px;color:var(--muted)}.wallet{padding-left:23px;border-left:1px solid #345057;display:grid;gap:4px}.wallet>span{font-size:7px;letter-spacing:1.2px;color:var(--muted)}.wallet strong{font:18px monospace;color:var(--amber)}
.dive-info{position:absolute;top:100px;left:50%;transform:translateX(-50%);display:flex;gap:9px;align-items:center;font-size:10px;white-space:nowrap;color:#b2c9be}.dive-info strong{color:var(--amber);font:12px monospace}
.sidebar{position:absolute;right:18px;top:126px;width:203px;padding:17px;border:1px solid #64868130;background:#081e29bd;border-radius:12px;pointer-events:auto}
.eyebrow{font:8px ui-monospace,monospace;letter-spacing:1.8px;color:var(--muted)}.amber{color:var(--amber)}.mission-box h2{font-size:14px;font-weight:550;line-height:1.4;margin:13px 0 8px}.mission-box p{font-size:10px;line-height:1.8;color:#94b2ab;margin:0 0 15px}.mission-progress{height:2px;background:#35514f;margin-bottom:9px}.mission-progress span{display:block;background:var(--amber);height:100%;width:0}.mission-bottom{display:flex;justify-content:space-between;font:7px monospace;color:#9bb3ab;gap:8px}.record{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:12px 0;border-bottom:1px solid #2d4b4d66;font-size:9px;color:var(--muted)}.record strong{font:10px monospace;color:#d9e5d6}
.collection-button{display:grid;gap:7px;width:100%;border:0;background:transparent;padding:15px 0 0;font-size:10px;text-align:left}.collection-button span:last-child{font-size:8px;color:#8faba6}
.boss-hud{position:absolute;left:50%;top:132px;transform:translateX(-50%);width:min(390px,88%);padding:13px 16px;border:1px solid #b58b7277;border-radius:10px;background:#172a34ed;z-index:3}.boss-hud>div{display:flex;gap:12px;justify-content:space-between;align-items:center;margin-bottom:10px;font-size:11px}.boss-hud span{font:8px monospace;color:#f2c390;white-space:nowrap}.boss-hud progress::-webkit-progress-value{background:#ce9585}.boss-hud progress::-moz-progress-bar{background:#ce9585}
.controls{position:absolute;left:24px;right:24px;bottom:25px;display:flex;justify-content:space-between;align-items:flex-end;gap:18px;pointer-events:none}.controls button{pointer-events:auto;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
.dpad{display:grid;grid-template-columns:47px 47px 47px;grid-template-rows:43px 43px 43px;gap:5px}.dpad button{font-size:23px;background:#0b2936e3;border-color:#8cb0a755;border-radius:10px}.dpad [data-dir=up]{grid-column:2}.dpad [data-dir=left]{grid-column:1;grid-row:2}.dpad [data-dir=right]{grid-column:3;grid-row:2}.dpad [data-dir=down]{grid-column:2;grid-row:3}.dpad-center{grid-column:2;grid-row:2;display:grid;place-items:center;font-size:22px;color:#9bc1b1;background:#0b293670;border-radius:10px}
.controls .held{background:#446c65;border-color:#b1dcc4;box-shadow:0 0 15px #9bdac329}.keyboard-hint{display:block;text-align:center;color:#8da9a4;font:7px monospace;letter-spacing:1px;margin-top:10px}
.action-controls{display:grid;grid-template-columns:repeat(3,66px);gap:6px}.action-controls button{height:59px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;position:relative;background:#0b2936ee;border-color:#8cb0a755}.action-controls button>span:nth-child(2){font-size:8px;color:#becfc3}.action-symbol{font-size:22px;line-height:1;color:#d5dcc0}.action-controls small{position:absolute;top:5px;right:6px;font:8px monospace;color:var(--amber)}.action-controls [data-action=fire]{background:#34504a;border-color:#97b4a45e}.action-controls .available{border-color:var(--amber);box-shadow:0 0 17px #e3b97822}
.waypoint{position:absolute;left:50%;bottom:55px;transform:translateX(-50%);max-width:40%;padding:9px 13px;border:1px solid #bbad7e3b;border-radius:8px;background:#0b2430d9;color:#dbcaa1;font-size:10px;line-height:1.7;text-align:center;pointer-events:none}
.hint-chip{position:absolute;bottom:15px;left:50%;transform:translateX(-50%);font-size:8px;color:#91b0a6;white-space:nowrap;pointer-events:none}
.dock-button{position:absolute;bottom:60px;left:50%;transform:translateX(-50%);padding:16px 25px;background:var(--amber);border-color:var(--amber);color:#18303b;font-weight:700;z-index:3}
.toast-stack{position:absolute;left:50%;top:144px;transform:translateX(-50%);width:min(430px,85%);display:flex;flex-direction:column;align-items:center;gap:7px;pointer-events:none;z-index:5}.toast{padding:11px 16px;border:1px solid #809d7255;border-radius:10px;background:#142f38f2;font-size:11px;line-height:1.7;color:#dedfc6;box-shadow:0 10px 25px #0003}.toast.warning{color:#f1c79f;border-color:#c7966f77}.stage:has(.boss-hud:not([hidden])) .toast-stack{top:205px}
.splash{position:absolute;inset:0;z-index:6;display:flex;align-items:center;justify-content:center;background:linear-gradient(90deg,#06141bf0,#06141b99 50%,#06141b55);padding:25px;overflow-y:auto}.splash-card{width:410px;max-width:100%;text-align:center}.splash h1{font-size:88px;line-height:.86;font-weight:800;letter-spacing:4px;margin:28px 0 20px}.splash h1 span{font-weight:250;color:#c1d7cc}.splash-subtitle{font-size:9px;color:#a8c2b3}.splash p{font-size:14px;line-height:1.9;color:#a9bfb4;margin:24px 0 27px}.primary{display:flex;align-items:center;justify-content:space-between;gap:25px;padding:15px 22px;background:var(--amber);border-color:var(--amber);color:#18303b;font-weight:700;font-size:13px;border-radius:9px}.primary:hover{background:#f5cf96}.splash .primary{width:100%}.text-button{background:none;border:0;padding:14px 0;font-size:11px;color:#b5c8b9}.text-button:hover{background:none;color:var(--amber)}.legacy-button{display:block;width:100%;padding-bottom:0;color:#ddbf88}.splash-facts{display:flex;justify-content:center;gap:22px;border-top:1px solid #81a89a33;padding-top:20px;margin-top:15px;font:7px monospace;letter-spacing:1.4px;color:#819c93}
.footer{height:39px;display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:8px;letter-spacing:.5px;color:#8ca59b;padding-bottom:env(safe-area-inset-bottom)}.muted{color:#63837e}
dialog{user-select:text;-webkit-user-select:text;touch-action:pan-y}dialog button{user-select:none;-webkit-user-select:none}.requirements{font-size:10px;line-height:1.7;color:#d7b587;margin-bottom:14px}
.volume-control{display:flex;align-items:center;gap:20px;margin-top:22px;font-size:12px;color:#accbc1}.volume-control input{accent-color:#e3bb78;flex:1;min-width:80px;touch-action:auto}
.journal-title{font-size:15px;color:#e3be82;margin:26px 0 15px}.journal-goal{padding:17px;border-left:2px solid #deb66d;background:#15353b}.journal-goal h3{font-size:17px;margin:10px 0}
.supply-second{margin-top:9px}.rescue-summary{margin-top:20px}.quartz{color:#c5ebe5}.copper{color:#e6a06a}.silver{color:#d2dfeb}.gold{color:#ffd26e}.emerald{color:#74efb1}.ruby{color:#ff7c99}.diamond{color:#9fdcff}.relic{color:#d7a3ff}
.modal-notice{position:sticky;top:0;z-index:2;background:#34514b;border-bottom:1px solid #87ae8e;color:#f1dfb4;padding:12px 20px;font-size:12px;line-height:1.6}
dialog{width:min(780px,calc(100vw - 30px));max-height:calc(100dvh - 40px);padding:0;color:var(--text);border:1px solid #526c68;border-radius:18px;background:#0b242e;box-shadow:0 30px 120px #0009;overscroll-behavior:contain}dialog::backdrop{background:#021018b8;backdrop-filter:blur(7px)}.modal-head{padding:25px 28px 18px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:15px;align-items:flex-start}.modal-head h2{font-size:25px;font-weight:500;margin:7px 0 0;letter-spacing:-.5px}.modal-head p{font-size:11px;color:var(--muted);margin:9px 0 0;line-height:1.5}.close-button{width:30px;height:30px;background:transparent;color:var(--muted);flex-shrink:0}.modal-body{padding:23px 28px}.modal-foot{padding:17px 28px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;background:#091f29}.modal-foot p{color:var(--muted);font-size:10px;line-height:1.7;margin:0;max-width:330px}.dock-summary{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:20px}.pill{background:#173640;color:#bad6cd;border:1px solid #375854;padding:9px 12px;border-radius:7px;font-size:11px}.pill strong{color:var(--amber);margin-left:5px}.tabs{display:flex;gap:4px;margin-bottom:20px;border-bottom:1px solid var(--line)}.tabs button{background:none;border:0;border-radius:0;padding:10px 14px 13px;color:var(--muted);font-size:12px}.tabs button.active{color:var(--amber);border-bottom:2px solid var(--amber)}.upgrade-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.upgrade-card{padding:17px;border:1px solid #335058;border-radius:10px;background:#102d37}.upgrade-top{display:flex;justify-content:space-between;gap:8px;align-items:center}.upgrade-card h3{font-size:14px;font-weight:600;margin:0}.upgrade-card .level{font:9px ui-monospace,monospace;color:var(--amber);white-space:nowrap}.upgrade-card p{font-size:11px;line-height:1.7;color:var(--muted);margin:10px 0 14px;min-height:36px}.upgrade-card .spec{font-size:10px;line-height:1.6;color:#c2d7ce;margin-bottom:14px}.buy-button{padding:10px 13px;font-size:11px;width:100%;display:flex;justify-content:space-between;background:#234440;border-color:#44675c;color:#d4e5d0}.buy-button:disabled{background:#14303a}.guide-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.guide-grid h3{font-size:13px;color:var(--amber);margin:0 0 7px}.guide-grid p,.prose{font-size:12px;line-height:1.9;color:#b1c7c0;margin:0}.keys{display:flex;justify-content:space-between;font-size:11px;padding:8px 0;border-bottom:1px solid var(--line);color:var(--muted)}.keys code{color:var(--amber)}.menu-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.menu-grid button{padding:15px;font-size:12px;text-align:left}.danger{color:#efac9e!important;border-color:#79524b!important}.save-note{font-size:10px;line-height:1.8;color:var(--muted);margin-top:17px}.collection-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.mineral{padding:15px 8px;text-align:center;border:1px solid var(--line);border-radius:10px}.mineral .gem{font-size:30px;display:block;margin-bottom:9px}.mineral strong{font-size:10px;display:block}.mineral small{display:block;font-size:9px;color:var(--muted);margin-top:6px}.win-mark{font-size:65px;color:var(--amber);text-align:center;padding:8px 0 20px}.noscript{position:fixed;inset:0;background:var(--bg);display:grid;place-items:center;z-index:100}
.tabs{overflow-x:auto}.tabs button{white-space:nowrap;min-height:44px}.close-button{min-width:38px;min-height:38px}.buy-button{min-height:42px}
@media(max-width:1100px){.sidebar{display:none}.top-status{display:none}.topbar nav{margin-left:auto}.hud{width:min(620px,94%)}}
@media(max-width:650px){.app{padding:0 6px}.topbar{height:57px;gap:12px}.brand{font-size:12px;gap:7px;letter-spacing:1px}.brand small{font-size:5px;letter-spacing:1.3px}.brand-mark{font-size:23px}.version-tag{display:none}.catalog-link{font-size:19px;padding:10px 3px}.catalog-link span{display:none}.topbar nav{gap:4px}.icon-button{width:34px;height:36px}.menu-button{padding:0 10px;font-size:11px}.stage{height:calc(100dvh - 87px - env(safe-area-inset-bottom));border-radius:12px;min-height:300px}.hud{top:10px;padding:13px 12px;gap:14px;width:calc(100% - 20px)}.meter{min-width:45px}.meter b,.cargo-meter b{display:none}.meter strong{font-size:10px}.wallet{padding-left:12px}.wallet strong{font-size:14px}.wallet>span{font-size:6px}.cargo-meter strong{font-size:13px}.cargo-meter small{font-size:9px}.dive-info{top:79px;font-size:8px;gap:7px}.dive-info strong{font-size:10px}.controls{left:13px;right:13px;bottom:22px;gap:12px}.dpad{grid-template-columns:42px 42px 42px;grid-template-rows:42px 42px 42px;gap:4px}.keyboard-hint{display:none}.action-controls{grid-template-columns:repeat(2,59px);gap:5px}.action-controls button{height:44px}.action-symbol{font-size:18px}.action-controls button>span:nth-child(2){font-size:7px}.waypoint{bottom:182px;max-width:90%;font-size:9px;white-space:normal;width:max-content}.hint-chip{font-size:7px;bottom:6px;max-width:96%;overflow:hidden;text-overflow:ellipsis}.boss-hud{top:103px;padding:11px 12px}.boss-hud>div{font-size:10px;gap:8px}.boss-hud span{font-size:7px}.toast-stack{top:111px}.stage:has(.boss-hud:not([hidden])) .toast-stack{top:173px}.toast{font-size:10px;padding:9px 12px}.splash h1{font-size:65px}.splash-card{max-width:320px}.splash p{font-size:12px;margin:19px 0}.splash .eyebrow{font-size:7px}.splash-facts{margin-top:6px;padding-top:16px}.footer{height:30px;font-size:6px}.footer>span:nth-child(2){display:none}.modal-head{padding:20px}.modal-body{padding:18px}.modal-foot{padding:16px 18px}.guide-grid,.upgrade-grid{grid-template-columns:1fr}.collection-grid{grid-template-columns:repeat(2,1fr)}.menu-grid{grid-template-columns:1fr 1fr}.upgrade-card p{min-height:0}}
@media(max-width:350px){.brand{font-size:10px}.topbar{gap:7px}.dpad{grid-template-columns:38px 38px 38px;grid-template-rows:40px 40px 40px}.action-controls{grid-template-columns:repeat(2,55px)}.hud{gap:10px}.menu-grid{grid-template-columns:1fr}}
@media(max-height:560px) and (orientation:landscape){.app{padding:0 6px}.topbar{height:44px}.footer{display:none}.stage{height:calc(100dvh - 49px);min-height:240px}.sidebar{display:none}.brand small{display:none}.hud{top:8px;padding:10px 15px;width:460px;gap:20px}.dive-info{top:67px}.controls{bottom:10px;left:14px;right:14px}.dpad{grid-template-columns:38px 38px 38px;grid-template-rows:32px 32px 32px;gap:3px}.action-controls{grid-template-columns:repeat(3,49px);gap:4px}.action-controls button{height:40px}.keyboard-hint,.hint-chip{display:none}.waypoint{bottom:13px;width:40%;max-width:40%;font-size:8px}.splash{padding:12px}.splash h1{font-size:42px;margin:12px 0}.splash-subtitle{font-size:7px}.splash p{font-size:11px;margin:10px}.splash-facts{display:none}.splash-card{width:285px}.splash .primary{padding:10px 16px}.splash .text-button{padding:8px}.boss-hud{top:88px;padding:8px 12px}.toast-stack{top:97px}.stage:has(.boss-hud:not([hidden])) .toast-stack{top:146px}.toast{font-size:9px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
