.sub-page-inner{max-width:1320px;margin:auto;padding:28px 24px 60px}
.fr-submarine{--sub-ink:#102650;--sub-muted:#60789e;--sub-border:#dce5f5;--sub-accent:#6250ff;--sub-paper:#fff;color:var(--sub-ink);font-size:14px;line-height:1.65;font-family:inherit;min-width:0}
.fr-submarine *{box-sizing:border-box}
.fr-submarine [hidden]{display:none!important}
.fr-submarine h2,.fr-submarine h3,.fr-submarine p{margin:0}
.fr-submarine h2{font-size:19px;line-height:1.5;border:0;padding:0;background:none;color:var(--sub-ink)}
.fr-submarine h3{font-size:16px;line-height:1.5}
.fr-submarine button,.fr-submarine input{font:inherit}
.fr-submarine button{border:1px solid var(--sub-border);border-radius:8px;background:var(--sub-paper);color:var(--sub-ink);padding:8px 12px;cursor:pointer;line-height:1.4;text-align:center;box-shadow:none}
.fr-submarine button:hover{border-color:var(--sub-accent);background:#f6f4ff}
.fr-submarine button:focus-visible,.fr-submarine input:focus-visible,.fr-submarine summary:focus-visible,.fr-submarine a:focus-visible{outline:3px solid #f2ac38;outline-offset:3px}
.fr-submarine button:disabled{opacity:.45;cursor:default}
.sub-intro{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:18px}
.sub-eyebrow{display:block;font-size:10px;letter-spacing:.1em;color:var(--sub-muted);font-weight:700;margin-bottom:5px}
.sub-intro p{font-size:14px}
.sub-total{white-space:nowrap;border-left:2px solid var(--sub-border);padding-left:20px;color:var(--sub-muted);font-size:12px}
.sub-total b{font-size:29px;color:var(--sub-accent);margin:0 6px}
.sub-seas{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:7px;margin-bottom:18px}
.sub-seas button{padding:12px 4px;background:#f7f8ff}
.sub-seas strong,.sub-seas small{display:block}
.sub-seas strong{font-size:14px}.sub-seas small{font-size:10px;margin-top:4px;opacity:.8}
.sub-seas button[aria-pressed=true]{background:var(--sub-accent);color:#fff;border-color:var(--sub-accent);box-shadow:0 3px 10px #6250ff20}
.sub-searchbar{display:flex;align-items:center;justify-content:space-between;gap:18px;background:#f1f5fe;border:1px solid var(--sub-border);border-radius:10px;padding:14px 18px;margin-bottom:20px}
.sub-searchbar label{font-weight:700}.sub-searchbar small{font-weight:400;display:block;color:var(--sub-muted);font-size:11px}
.sub-searchbar>div{display:flex;gap:8px;flex:1;max-width:600px}
.sub-searchbar input{width:100%;min-width:0;border:1px solid #ccd8ef;border-radius:7px;padding:10px 12px;color:var(--sub-ink);background:var(--sub-paper)}
.sub-searchbar button{white-space:nowrap}
.sub-results{padding:16px;border:1px solid var(--sub-border);background:#fff;border-radius:10px;margin-bottom:20px}
.sub-result-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;max-height:300px;overflow-y:auto;margin-top:10px;padding:3px}
.sub-result-list button{text-align:left}.sub-result-list small{display:block;color:var(--sub-muted);font-size:10px}.sub-result-list strong{font-size:13px}
.sub-layout{display:grid;grid-template-columns:minmax(0,1fr) 335px;gap:20px;align-items:start}
.sub-main,.sub-aside{min-width:0;display:grid;gap:20px}
.sub-card{background:var(--sub-paper);border:1px solid var(--sub-border);border-radius:12px;padding:18px;box-shadow:0 3px 12px #10265003;min-width:0}
.sub-section-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px}
.sub-section-head>span,.sub-sea-meta{font-size:11px;color:var(--sub-muted)}
.sub-section-head>button{font-size:12px;white-space:nowrap}
.sub-mode{display:flex;gap:5px;padding:4px;background:#f1f3fc;border-radius:8px;margin-bottom:12px}
.sub-mode button{flex:1;border-color:transparent;background:none;font-size:12px}
.sub-mode button[aria-pressed=true]{background:#fff;color:var(--sub-accent);border-color:#d9d3ff;font-weight:700}
.sub-chart{position:relative;aspect-ratio:1;isolation:isolate;border:1px solid #bcd6e2;border-radius:8px;overflow:hidden;background:#ede3c4}
.sub-chart .sub-chart-image{position:absolute;left:-7.8947368421%;top:0;width:115.7894736842%;max-width:none;height:100%;pointer-events:none;user-select:none;z-index:0}
.sub-chart svg{position:absolute;width:100%;height:100%;inset:0;overflow:visible;z-index:1;pointer-events:none}
.sub-chart line{stroke:#273858;stroke-width:2.5;opacity:.8}
.sub-chart line.is-active{stroke:#7051ee;stroke-width:4;opacity:1}
.sub-chart line.is-returning{stroke-dasharray:9 8;opacity:.65}
.sub-compass{position:absolute;top:10px;left:15px;font-size:12px;line-height:1.3;text-align:center;color:#466880}
.fr-submarine .sub-pin{position:absolute;transform:translate(-50%,-50%);min-width:30px;height:30px;padding:0 4px;display:flex;align-items:center;justify-content:center;border-radius:50%;border:2px solid #fff;background:#314c7e;color:#fff;font-weight:700;font-size:12px;box-shadow:0 2px 5px #15345230;z-index:2}
.fr-submarine .sub-pin:hover{background:#523ce9;z-index:4}
.fr-submarine .sub-pin.is-selected{background:var(--sub-accent);outline:3px solid #aa9dff;outline-offset:2px;z-index:3}
.fr-submarine .sub-pin.is-checked{background:#14675c}
.fr-submarine .sub-pin.is-selected.is-checked{background:var(--sub-accent)}
.sub-pin.is-dim{opacity:.32}
.sub-pin i,.sub-pin b{position:absolute;top:-10px;right:-8px;background:#fff;color:#167467;border:1px solid #d4e4e0;border-radius:50%;font-size:10px;line-height:17px;width:18px;font-style:normal}
.sub-pin b{color:#fff;background:#d16d11;border-color:#fff;right:auto;left:-8px}
.sub-port{position:absolute;transform:translate(-50%,-50%);background:#fff;border:1px solid #446e89;color:#446e89;border-radius:5px;padding:3px 6px;font-size:11px;font-weight:700;z-index:2}
.sub-map-caption{font-size:11px;color:var(--sub-muted);margin-top:10px!important}
.sub-map-legend{display:flex;flex-wrap:wrap;gap:14px;color:var(--sub-muted);font-size:10px;margin-top:8px}
.sub-map-legend span:first-child{color:var(--sub-accent)}
.sub-game-map{border-top:1px solid var(--sub-border);margin-top:14px;padding-top:12px}
.sub-game-map summary{color:var(--sub-accent);cursor:pointer;font-size:12px}
.sub-game-map figure{margin:14px 0 0;text-align:center;background:#f2f6fb;border-radius:8px;padding:12px}
.sub-game-map img{display:block;width:100%;max-width:880px;height:auto;margin:auto}

.sub-detail h2{font-size:18px;display:flex;gap:10px;align-items:center;margin-bottom:15px}
.sub-code{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;flex-shrink:0;border-radius:7px;background:#eeebff;color:var(--sub-accent);font-size:13px;font-weight:700}
.sub-stats{margin:0 0 14px;font-size:12px}
.sub-stats>div{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid #edf0f8}
.sub-stats dt{color:var(--sub-muted);flex-shrink:0}.sub-stats dd{margin:0;text-align:right;font-weight:700;overflow-wrap:anywhere}
.fr-submarine .sub-text-button{padding:0;border:0;border-radius:2px;background:none;text-align:inherit;color:var(--sub-accent);font-size:12px}
.sub-check{display:flex;gap:8px;align-items:center;font-size:12px;cursor:pointer;margin-bottom:12px}
.sub-check input{accent-color:var(--sub-accent);width:17px;height:17px}
.fr-submarine .sub-back-map{display:none}
.fr-submarine .sub-primary{background:var(--sub-accent);color:#fff;width:100%;font-weight:700;padding:11px}
.sub-unlocks{margin-top:12px;font-size:12px}.sub-unlocks summary{cursor:pointer;color:var(--sub-muted)}
.sub-unlocks ol,.sub-unlocks ul{padding-left:22px;margin:10px 0}.sub-unlocks li{padding:4px 0}
.sub-detail h3{margin-top:22px!important;margin-bottom:6px!important;display:flex;justify-content:space-between;align-items:center;gap:8px}
.sub-detail h3 span{font-weight:400;font-size:11px;color:var(--sub-muted)}
.sub-muted{font-size:11px!important;color:var(--sub-muted);font-weight:400}
.sub-loot{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:0}
.sub-loot li{display:flex;justify-content:space-between;align-items:center;gap:8px;border-bottom:1px solid #ecf0f8;padding:9px 0;font-size:12px;overflow-wrap:anywhere}
.sub-loot li.is-match{background:#fff4cc}
.sub-loot button{flex-shrink:0;padding:5px 7px;font-size:10px}
.sub-sector-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:14px}
.fr-submarine .sub-sector-row{display:flex;text-align:left;align-items:center;gap:10px;padding:10px}
.sub-sector-row>span:nth-child(2){flex:1;min-width:0}.sub-sector-row strong{display:block;font-size:12px}.sub-sector-row small{display:block;font-size:10px;color:var(--sub-muted);margin-top:4px}
.fr-submarine .sub-sector-row.is-selected{background:#f4f1ff;border-color:#998aff}
.sub-route-list{padding:0;list-style:none;display:grid;gap:8px;margin:12px 0}
.sub-route-list li{display:grid;grid-template-columns:20px minmax(0,1fr);gap:5px;align-items:center;background:#f7f8fc;border-radius:6px;padding:8px}
.sub-route-list li>span{font-size:12px;color:var(--sub-accent);font-weight:700}
.sub-route-list li>div{grid-column:2;display:flex;gap:4px;justify-content:flex-end}
.sub-route-list li>div button{font-size:11px;padding:3px 7px}
.fr-submarine .sub-route-name{font-size:12px;text-align:left;background:none;padding:0;border:0}
.sub-route-actions{display:flex;gap:8px;margin-top:15px;margin-bottom:8px}.sub-route-actions button{flex:1;font-size:12px}
.sub-empty{color:var(--sub-muted);padding:20px 0;font-size:13px}
.sub-progress-content{margin:12px 0}.sub-progress-content strong{font-size:26px;color:var(--sub-accent)}
.sub-progress progress{width:100%;height:9px;accent-color:var(--sub-accent)}
.sub-status{padding:14px 0;color:var(--sub-accent);font-size:12px;min-height:44px}
.sub-sources{border-top:1px solid var(--sub-border);padding:14px 0;font-size:12px;color:var(--sub-muted)}
.sub-sources summary{cursor:pointer}.sub-sources p{margin-top:12px!important}.sub-sources a{color:var(--sub-accent)}
.sub-dialog{width:min(94vw,900px);max-height:94vh;border:0;border-radius:12px;padding:20px;color:var(--sub-ink);background:#fff;overflow:auto}
.sub-dialog::backdrop{background:#12203be0}.sub-dialog .sub-chart{max-width:720px;margin:auto}.sub-zoom-name{margin-top:10px!important;font-weight:700}
.sub-copy-fallback{width:100%;min-height:100px;border:1px solid var(--sub-border);padding:10px}
.sub-fallback img{max-width:100%;height:auto}.sub-fallback details{margin:15px 0}.sub-fallback li{margin-bottom:12px}
@media(min-width:1500px){.sub-layout{grid-template-columns:minmax(0,1fr) 360px}}
@media(max-width:1000px){.sub-layout{grid-template-columns:minmax(0,1fr) 300px;gap:14px}.sub-card{padding:14px}.sub-sector-list{grid-template-columns:1fr}.sub-seas strong{font-size:12px}}
@media(max-width:760px){.sub-page-inner{padding:18px 12px 40px}.sub-intro{gap:12px}.sub-total{display:none}.sub-seas{display:flex;overflow:auto;padding-bottom:5px;gap:6px}.sub-seas button{flex:0 0 100px}.sub-searchbar{display:block;padding:12px}.sub-searchbar label{display:block;margin-bottom:8px}.sub-searchbar small{display:inline;margin-left:8px}.sub-searchbar input{font-size:16px}.sub-layout{display:flex;flex-direction:column;gap:16px}.sub-main,.sub-aside{width:100%}.sub-result-list{grid-template-columns:repeat(2,minmax(0,1fr))}.sub-sector-list{grid-template-columns:repeat(2,minmax(0,1fr))}.sub-sector-row{gap:6px!important}.sub-card{padding:14px}.sub-section-head h2{font-size:18px}.sub-aside .sub-detail{scroll-margin-top:85px}.sub-dialog{padding:12px}.sub-chart{overflow:hidden}.sub-dialog .sub-chart{overflow:hidden}}
@media(max-width:420px){.sub-sector-list{grid-template-columns:1fr}.sub-searchbar small{display:block;margin-left:0}.fr-submarine .sub-pin{min-width:25px;height:25px;font-size:10px}.sub-pin i,.sub-pin b{width:15px;line-height:14px;font-size:9px}.sub-sea-meta{font-size:10px}.sub-section-head>button{padding:7px;font-size:11px}}
@media(max-width:760px){.sub-layout{display:grid;grid-template-columns:minmax(0,1fr)}.sub-main,.sub-aside{display:contents}.sub-map-card{order:1;scroll-margin-top:85px}.sub-detail{order:2}.sub-route{order:3}.sub-sector-card{order:4}.sub-progress{order:5}.fr-submarine .sub-back-map{display:block;width:100%;margin-bottom:9px;font-size:12px}}
@media(prefers-reduced-motion:reduce){.fr-submarine *{scroll-behavior:auto!important}}

/* Match the page report action, including keyboard focus. */
.fr-submarine .sub-primary:not(:disabled):hover,.fr-submarine .sub-primary:not(:disabled):focus-visible{background:#fff!important;color:#6250ff!important;border-color:#6250ff!important}
.fr-submarine .sub-aside>.fr-feedback-card{margin:0;align-self:start}
@media(max-width:760px){.fr-submarine .sub-aside>.fr-feedback-card{order:6}}

/* Copy feedback matches the crafter leve toast. */
.fr-copy-toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:10000;width:max-content;max-width:calc(100vw - 32px);box-sizing:border-box;margin:0;padding:12px 18px;border-radius:10px;background:#262358;color:#fff;box-shadow:0 4px 20px #11194330;font:13px/1.7 system-ui,sans-serif;overflow-wrap:anywhere;pointer-events:none}.fr-copy-toast[hidden]{display:none!important}@media(max-width:700px){.fr-copy-toast{bottom:calc(76px + env(safe-area-inset-bottom))}}

/* Manual dark mode: keep map imagery intact while adapting its surrounding UI. */
html[data-fr-theme="dark"] .fr-submarine{
 --sub-ink:#e8ecff;--sub-muted:#b6c2dc;--sub-border:#3b4662;--sub-accent:#c6b9ff;--sub-paper:#191f33;
 color-scheme:dark
}
html[data-fr-theme="dark"] .fr-submarine :is(.sub-seas button,.sub-searchbar,.sub-mode,.sub-route-list li,.sub-game-map figure){background:#242c42}
html[data-fr-theme="dark"] .fr-submarine :is(.sub-results,.sub-dialog){background:var(--sub-paper);color:var(--sub-ink);border:1px solid var(--sub-border)}
html[data-fr-theme="dark"] .fr-submarine :is(.sub-searchbar input,.sub-copy-fallback){background:#222a40;color:var(--sub-ink);border-color:#45516e}
html[data-fr-theme="dark"] .fr-submarine input::placeholder{color:var(--sub-muted);opacity:1}
html[data-fr-theme="dark"] .fr-submarine button:not(:disabled):hover{background:#343953;border-color:var(--sub-accent)}
html[data-fr-theme="dark"] .fr-submarine .sub-mode button[aria-pressed="true"],
html[data-fr-theme="dark"] .fr-submarine .sub-sector-row.is-selected,
html[data-fr-theme="dark"] .fr-submarine .sub-code{background:#34304f;color:var(--sub-accent);border-color:#9b8ae4}
html[data-fr-theme="dark"] .fr-submarine .sub-seas button[aria-pressed="true"],
html[data-fr-theme="dark"] .fr-submarine .sub-primary,
html[data-fr-theme="dark"] .fr-submarine .sub-pin.is-selected{background:#6250ff;color:#fff;border-color:#a99aff}
html[data-fr-theme="dark"] .fr-submarine .sub-primary:not(:disabled):hover,
html[data-fr-theme="dark"] .fr-submarine .sub-primary:not(:disabled):focus-visible{background:#34304f!important;color:#e8ecff!important;border-color:#c6b9ff!important}
html[data-fr-theme="dark"] .fr-submarine .sub-stats>div,
html[data-fr-theme="dark"] .fr-submarine .sub-loot li{border-color:var(--sub-border)}
html[data-fr-theme="dark"] .fr-submarine .sub-loot li.is-match{background:#493d24;color:#fff0c2}
html[data-fr-theme="dark"] .fr-submarine .sub-dialog::backdrop{background:#080e20db}