:root{--ink: #e6f1f7;--muted: #9db6c4;--panel: rgba(8, 22, 33, .86);--edge: rgba(150, 205, 235, .25);--accent: #6cc3ee;font-family:system-ui,-apple-system,Segoe UI,sans-serif;font-size:15px;font-variant-numeric:tabular-nums;color:var(--ink)}html,body{margin:0;height:100%;background:#0b1a26;overflow:hidden}#app,#viewport{position:fixed;inset:0}#canvas{display:block;width:100%;height:100%}#hud{position:fixed;inset:0;pointer-events:none}#hud>*{pointer-events:auto}.topbar{position:absolute;top:0;left:0;right:0;display:flex;gap:18px;align-items:center;padding:8px 14px;background:var(--panel);border-bottom:1px solid var(--edge)}.aquarium-bar{position:absolute;top:calc(var(--topbar-bottom, 48px) + 8px);left:calc(var(--panel-left, 0px) + (100% - var(--panel-left, 0px) - var(--panel-right, 0px)) / 2);transform:translate(-50%);width:max-content;max-width:calc(100% - var(--panel-left, 0px) - var(--panel-right, 0px) - 16px);display:flex;flex-wrap:wrap;justify-content:center;gap:4px 8px;pointer-events:none;z-index:6}.aquarium-bar>*{pointer-events:auto}.aquarium-bar .habitats{display:flex;flex-wrap:wrap;justify-content:center;gap:2px}.aquarium-bar .habitats[hidden]{display:none}.aquarium-bar button{white-space:nowrap}.aquarium-bar .observe{position:relative}.observe-menu{position:absolute;top:calc(100% + 4px);left:50%;transform:translate(-50%);width:min(300px,80vw);display:flex;flex-direction:column;gap:6px;padding:8px 10px;background:var(--panel);border:1px solid var(--edge);border-radius:6px;z-index:2}.observe-menu[hidden]{display:none}.observe-menu .presets,.observe-menu .lengths{display:flex;gap:2px}.observe-menu .presets button,.observe-menu .lengths button{flex:1}.observe-note{color:var(--muted);font-size:12px;white-space:normal}.observe-menu .watch-start{width:100%}.aquarium-bar .watch{display:flex;align-items:center;gap:4px}.aquarium-bar .watch[hidden]{display:none}.watch-progress{width:90px;height:6px;accent-color:var(--accent)}.world-map{position:absolute;inset:calc(var(--topbar-bottom, 46px) + 8px) 12px 12px 12px;display:grid;grid-template-columns:1fr minmax(220px,300px);grid-template-rows:auto auto 1fr;gap:8px 12px;padding:10px 12px;background:#081621;border:1px solid var(--edge);border-radius:8px;z-index:5;overflow:auto}.world-map[hidden]{display:none}.world-head{grid-column:1 / -1;display:flex;justify-content:space-between;align-items:center}.world-canvas{width:100%;aspect-ratio:2 / 1;border-radius:4px;cursor:pointer}.world-site{font-size:13px}.world-site[hidden]{display:none}.world-site dl{display:grid;grid-template-columns:max-content 1fr;gap:2px 8px;margin:6px 0}.world-site dt{color:var(--muted)}.world-site dd{margin:0}.world-note{grid-column:1;margin:0;color:var(--muted);font-size:12px}@media(max-width:760px){.world-map{grid-template-columns:1fr}}.aquarium-bar .visit-note{max-width:min(640px,100%);padding:4px 8px;background:var(--panel);border:1px solid var(--edge);border-radius:6px;font-size:12px;white-space:normal}.aquarium-bar .visit-note[hidden]{display:none}.wildlife{position:absolute;left:calc(var(--panel-left, 0px) + (100% - var(--panel-left, 0px) - var(--panel-right, 0px)) / 2);bottom:calc(var(--aquarium-bottom, 0px) + 12px);transform:translate(-50%);width:min(400px,calc(100% - var(--panel-left, 0px) - var(--panel-right, 0px) - 24px));max-height:40vh;overflow-y:auto;padding:8px 12px;background:var(--panel);border:1px solid var(--edge);border-radius:6px;font-size:13px;z-index:2}.wildlife[hidden]{display:none}.wildlife header{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:4px}.wildlife dl{display:grid;grid-template-columns:max-content 1fr;gap:2px 10px;margin:0}.wildlife dt{color:var(--muted)}.wildlife dd{margin:0}.card.regions .world-open{display:none}@media(min-width:1101px){#hud[data-panels=hidden] .card.sanctuary,#hud[data-panels=hidden] .card.regions{display:none}}.topbar .name{font-weight:600;min-width:0;flex:0 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.topbar .date{color:var(--muted);white-space:nowrap}.topbar .speeds{display:flex;flex:none;gap:2px;margin-left:auto}.topbar .files{flex:none}button{font:inherit;color:var(--ink);background:#ffffff0f;border:1px solid var(--edge);border-radius:4px;padding:3px 9px;cursor:pointer}button.on{background:var(--accent);color:#04131d}.card{position:absolute;background:var(--panel);border:1px solid var(--edge);border-radius:6px;padding:12px 16px}.card.sanctuary{top:calc(var(--topbar-bottom, 46px) + 10px);left:14px;width:340px}.card.regions{top:calc(var(--topbar-bottom, 46px) + 10px);right:14px;width:420px}.card.sanctuary,.card.regions{max-height:calc(100vh - var(--topbar-bottom, 46px) - 10px - 14px - 2 * 12px - 2px);max-height:calc(100dvh - var(--topbar-bottom, 46px) - 10px - 14px - 2 * 12px - 2px);overflow-y:auto;overflow-x:auto}.card h2{margin:0 0 4px;font-size:18px}.card .place,.card .note{margin:0 0 10px;color:var(--muted)}.card dl{display:grid;grid-template-columns:max-content 1fr;gap:4px 12px;margin:0}.card dt{color:var(--muted)}.card dd{margin:0}.card dd.fishes{grid-column:1 / -1;display:flex;align-items:flex-end;gap:12px}.card dd.fishes figure{margin:0;min-width:0}.card dd.fishes canvas{display:block;width:100%}.card dd.fishes figcaption{color:var(--muted);font-size:12px;text-align:center}.card table{width:100%;border-collapse:collapse}.card th,.card td{text-align:left;padding:2px 6px 2px 0}.card th{color:var(--muted);font-weight:400}.card td.num{text-align:right;white-space:nowrap}.card tr.here td{color:var(--accent)}.card .dep{color:var(--muted)}.card tr.here .dep{color:inherit}.card .log{margin:12px 0 0;color:var(--muted)}.menu{position:fixed;inset:0;z-index:10;display:flex;align-items:center;justify-content:center;box-sizing:border-box;padding:max(16px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));background:#040c12b3}.menu[hidden]{display:none}.menu-panel{box-sizing:border-box;width:min(560px,100%);max-height:100%;overflow-y:auto;overscroll-behavior:contain;padding:16px 18px;background:#0b1a26;border:1px solid var(--edge);border-radius:10px}.menu-panel h2{margin:0 0 12px;font-size:18px}.menu-panel .note{margin:0 0 12px;color:var(--muted)}.menu-list{display:flex;flex-direction:column;gap:8px}.menu-list button{padding:11px 14px;text-align:left}.menu-back{position:sticky;top:-16px;margin:-16px -18px 8px;padding:10px 18px;background:#0b1a26;border-bottom:1px solid var(--edge)}.menu-back button{padding:8px 14px}.credits h3{font-size:16px;margin:18px 0 4px;padding-bottom:4px;border-bottom:1px solid var(--edge)}.credits h4{font-size:15px;margin:14px 0 2px}.credits p,.credits dd{line-height:1.45}.credits dl{margin:0}.credits dt{color:var(--muted);font-size:13px;margin-top:6px}.credits dd{margin:2px 0 0;overflow-wrap:anywhere}.credits a{color:var(--accent)}.credits pre{white-space:pre-wrap;overflow-wrap:anywhere;font-size:12px;color:var(--muted);border:1px solid var(--edge);border-radius:6px;padding:8px}.toast{position:absolute;bottom:18px;left:50%;transform:translate(-50%);background:var(--panel);border:1px solid var(--edge);border-radius:6px;padding:8px 14px}.tabs{display:none}button{touch-action:manipulation}@media(max-width:1100px),(max-width:960px)and (max-height:520px){.panels-toggle{display:none}.observe-menu{position:fixed;top:calc(var(--topbar-bottom, 46px) + 48px);left:8px;right:8px;width:auto;max-width:420px;margin:0 auto;transform:none;z-index:6}.aquarium-bar button{padding:5px 8px;font-size:13px}:root{font-size:14px}.topbar{flex-wrap:wrap;gap:6px 10px;padding:calc(6px + env(safe-area-inset-top)) 10px 6px}.topbar .date{margin-left:auto;white-space:nowrap}.topbar .files{display:flex;gap:4px}.topbar .speeds{order:3;width:100%;margin-left:0}.topbar .speeds button{flex:1;padding:9px 0;min-width:0}.topbar .files button{padding:7px 10px}.card.sanctuary,.card.regions{display:none;position:fixed;top:auto;left:0;right:0;bottom:calc(48px + env(safe-area-inset-bottom));width:auto;max-height:42vh;overflow-y:auto;border-radius:12px 12px 0 0;border-bottom:none;padding:12px 14px}#hud[data-panel=sanctuary] .card.sanctuary,#hud[data-panel=world] .card.regions{display:block}.card table{font-size:13px}.card td.num{white-space:nowrap}.tabs{display:flex;position:fixed;left:0;right:0;bottom:0;padding-bottom:env(safe-area-inset-bottom);background:var(--panel);border-top:1px solid var(--edge)}.tabs button{flex:1;height:48px;border:none;border-radius:0;background:none}.tabs button.on{color:var(--accent);background:#6cc3ee1f}.toast{bottom:calc(60px + env(safe-area-inset-bottom));max-width:90vw}}@media(max-width:520px){.topbar .name{display:none}.topbar .date{margin-left:0}.topbar .files{margin-left:auto}.topbar .speeds button{font-size:13px;padding:10px 0}}@media(max-width:960px)and (max-height:520px){.aquarium-bar{flex-wrap:nowrap;width:calc(100% - var(--panel-left, 0px) - var(--panel-right, 0px) - 16px)}.aquarium-bar>*{flex:none}.aquarium-bar .long,.aquarium-bar .world-toggle{display:none}.card.regions .world-open{display:inline-block;margin-bottom:8px}.aquarium-bar:has(.watch:not([hidden])){flex-wrap:wrap}.aquarium-bar .view-toggle{text-transform:capitalize}.aquarium-bar>.habitats{flex:1 1 auto;min-width:0;flex-wrap:nowrap;overflow-x:auto;justify-content:flex-start;scrollbar-width:none}.topbar{flex-wrap:wrap;gap:4px 6px;padding:4px max(8px,env(safe-area-inset-right)) 4px max(8px,env(safe-area-inset-left))}.topbar .name{display:none}.topbar .date{margin-left:0}.topbar .speeds{order:0;width:auto;margin-left:auto}.topbar .speeds button{flex:none;padding:7px 5px;font-size:13px}.topbar .files button{padding:7px 6px}.card.sanctuary,.card.regions{top:var(--topbar-bottom, 46px);bottom:calc(44px + env(safe-area-inset-bottom));left:auto;right:0;width:46%;max-height:none;border-radius:12px 0 0}.tabs button{height:44px}}@media(max-width:360px){.topbar{column-gap:8px}.topbar .files button{padding:7px 6px}.topbar .speeds{gap:2px}.topbar .speeds button{font-size:11px}.card.sanctuary,.card.regions{max-height:36vh}}