:root{color-scheme:dark;font-family:Arial,Helvetica,sans-serif;background:#183b39;color:#e7f1e9}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;overscroll-behavior:none}#reef{position:fixed;inset:0;width:100%;height:100dvh;display:block;touch-action:none;outline:none}button,select,input{font:inherit}button,select{border:1px solid #7ca38a44;background:#24443c;color:#e2eee5;border-radius:10px;padding:11px 13px;font-size:12px;cursor:pointer}button:hover{background:#34594b}button:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid #cae5b5;outline-offset:3px}button:disabled{opacity:.6;cursor:wait}button[aria-pressed=true]{background:#a8ceb4;color:#173427}.icon-button{width:45px;height:43px;display:grid;place-items:center;padding:0}#menu{position:fixed;right:max(18px,env(safe-area-inset-right));top:max(18px,env(safe-area-inset-top));z-index:5;background:#0f2b26ba;backdrop-filter:blur(12px);border:1px solid #b2d5b53b;box-shadow:0 6px 28px #0002}#menu svg{width:21px;height:21px;stroke:#deebda;fill:none;stroke-width:1.7}body.immersive #menu{display:none}body.immersive #reef{cursor:none}#camera{position:fixed;left:0;top:0;width:2px;height:2px;opacity:.01;pointer-events:none;z-index:0}#stats{position:fixed;left:max(15px,env(safe-area-inset-left));top:max(18px,env(safe-area-inset-top));font-size:11px;background:#08221cba;padding:8px 12px;border-radius:9px;pointer-events:none;font-variant-numeric:tabular-nums}#stats[hidden],body.immersive #stats{display:none}dialog{color:#dce9dc;background:#122c25f5;border:1px solid #9bbb8d55;border-radius:19px;padding:24px;width:min(410px,calc(100vw - 28px));max-height:calc(100dvh - 32px);overflow-y:auto;overscroll-behavior:contain;box-shadow:0 25px 100px #0008}dialog::backdrop{background:#03141040;backdrop-filter:blur(5px)}.menu-heading{display:flex;justify-content:space-between;gap:18px;align-items:center;margin-bottom:20px}.menu-heading small{font-size:9px;letter-spacing:2.4px;color:#9cb398}.menu-heading h1{font-size:22px;font-weight:400;letter-spacing:-.5px;margin:8px 0 0}.menu-heading button{background:transparent;border:0;color:#aec6aa;font-size:20px;padding:4px}.menu-actions{display:flex;gap:9px;margin:14px 0}.menu-actions button{flex:1}#track,#full{background:#b8d5b5;color:#183c2a;font-weight:600}.control-label{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:#d2e1cc;margin-top:17px}.control-label output{color:#a9c59c;font-size:11px;font-variant-numeric:tabular-nums}input[type=range]{display:block;width:100%;accent-color:#bedab0;height:21px;margin:9px 0;cursor:pointer}details{border-top:1px solid #9cb68b2b;margin-top:18px;padding-top:15px}summary{font-size:12px;cursor:pointer;letter-spacing:.3px;color:#cbdcc1;padding:3px 0}details[open] summary{margin-bottom:12px}.select-row{display:flex;justify-content:space-between;align-items:center;gap:14px;margin:12px 0;font-size:12px}.select-row select{min-width:160px;max-width:62%;padding:9px;font-size:11px}.switch-row{display:flex;justify-content:space-between;align-items:center;font-size:12px;margin:15px 0}.switch-row input{accent-color:#afcf9f;width:18px;height:18px}.menu-help,.privacy{font-size:10px;color:#8fa88b;line-height:1.65;text-align:center;margin:17px 0 0}#status{color:#ebc298;font-size:11px;line-height:1.6;margin-top:13px}#status:empty{display:none}.reset{display:block;margin:18px auto 0;border:0;padding:7px;background:none;color:#8fa98a;font-size:10px}#loading{position:fixed;inset:0;background:#112b28;z-index:10;display:flex;flex-direction:column;justify-content:center;align-items:center}#loading h1{font-size:clamp(22px,5vw,32px);font-weight:400;letter-spacing:-.5px;margin:24px 0 6px}#load-text{color:#9cb59e;font-size:12px;max-width:80%;text-align:center;line-height:1.6}.spinner{width:34px;height:34px;border:1px solid #658f773d;border-top-color:#c1d7b1;border-radius:50%;animation:spin 1.5s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media(max-height:550px) and (orientation:landscape){#menu{top:max(10px,env(safe-area-inset-top));right:max(10px,env(safe-area-inset-right));width:39px;height:37px}dialog{padding:19px 23px;max-height:calc(100dvh - 18px)}.menu-heading{margin-bottom:12px}.menu-actions{margin:10px 0}.control-label{margin-top:12px}}

#camera{width:320px;height:240px;opacity:.001}

#start-3d{position:fixed;left:max(18px,env(safe-area-inset-left));top:max(18px,env(safe-area-inset-top));z-index:5;background:#17382fe8;backdrop-filter:blur(12px)}#start-3d[hidden],body.immersive #start-3d{display:none}

.menu-heading h1{font-size:27px;font-weight:600;letter-spacing:-.7px;margin:0 0 7px}.menu-heading small{font-size:9px;letter-spacing:1.8px;color:#a5c2a2}.site-card{display:block;overflow:hidden;margin:23px 0 17px;border:1px solid #b2d19a88;border-radius:13px;background:#24483b;color:#f0f6e8;text-decoration:none;box-shadow:0 8px 25px #0003}.site-card:hover{background:#2e5947;border-color:#d1e7b6}.site-card:focus-visible{outline:2px solid #d1e7b6;outline-offset:4px}.site-card img{display:block;width:100%;height:auto;aspect-ratio:1200/630;object-fit:cover}.site-card-copy{display:grid;gap:7px;padding:15px}.site-card-copy strong{font-size:16px;font-weight:600;display:flex;justify-content:space-between}.site-card-copy>span{font-size:12px;color:#e1edd9}.site-card-copy small{font-size:10px;color:#b7d2ab;letter-spacing:.2px}
/* fish sticks */
.fishsticks{border-top:1px solid rgba(255,255,255,.12);margin-top:14px;padding-top:12px}
.fishsticks h2{font-size:15px;margin:0 0 6px}
.fs-count{margin:0;font-size:13px;opacity:.85}.fs-count b{font-size:26px;color:#ffc24a;margin-right:4px}
.fs-bar{height:8px;border-radius:5px;background:rgba(255,255,255,.12);overflow:hidden;margin:8px 0 4px}.fs-bar i{display:block;height:100%;background:linear-gradient(90deg,#57d4ff,#ffc24a)}
.fs-next,.fs-how{margin:2px 0;font-size:12px;opacity:.75}
.fs-account{display:inline-block;margin-top:8px;color:#8fe0ff;font-size:13px}
.fs-chip{position:fixed;left:16px;bottom:16px;padding:6px 12px;border-radius:999px;background:rgba(10,30,40,.72);color:#ffd67a;font:600 13px system-ui,sans-serif;text-decoration:none;border:1px solid rgba(255,255,255,.14);z-index:5}
body.immersive .fs-chip{display:none}
.fs-toast{position:fixed;left:50%;top:18px;transform:translateX(-50%);padding:10px 16px;border-radius:12px;background:rgba(10,30,40,.9);color:#fff;font:600 14px system-ui,sans-serif;z-index:20;border:1px solid #ffc24a}
.fs-open{margin-top:10px;width:100%;padding:10px;border-radius:10px;border:1px solid rgba(255,194,74,.5);background:rgba(255,194,74,.12);color:#ffd67a;font:600 14px system-ui,sans-serif;cursor:pointer}
.fs-gallery{width:min(920px,calc(100vw - 24px));max-height:calc(100vh - 24px);padding:0;border:1px solid rgba(255,255,255,.14);border-radius:18px;background:#0a1a24;color:#e8f3f6;overflow:auto}
.fs-gallery::backdrop{background:rgba(2,8,12,.6);backdrop-filter:blur(3px)}
.fs-g-head{display:flex;justify-content:space-between;align-items:flex-start;padding:18px 20px 6px;position:sticky;top:0;background:linear-gradient(#0a1a24 75%,transparent);z-index:1}
.fs-g-head h2{margin:0;font-size:22px}.fs-g-head p{margin:2px 0 0;opacity:.8}.fs-g-head b{color:#ffc24a;font-size:18px}
.fs-g-close{background:none;border:0;color:#cfe;font-size:28px;cursor:pointer;line-height:1}
.fs-g-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px;padding:8px 20px 12px}
.fs-card{border:1px solid rgba(255,255,255,.1);border-radius:14px;overflow:hidden;background:rgba(255,255,255,.03);display:flex;flex-direction:column}
.fs-card img,.fs-noimg{width:100%;aspect-ratio:1;object-fit:contain;background:radial-gradient(circle at 50% 40%,#1d4a66,#0b1d29 70%)}
.fs-noimg{display:grid;place-items:center;font-size:42px}
.fs-card:not(.own) img{filter:grayscale(.75) brightness(.78)}
.fs-c-body{padding:10px 12px 12px;display:flex;flex-direction:column;gap:3px}
.fs-c-body b{font-size:15px}.fs-c-body small{opacity:.75;font-size:12px;line-height:1.35}
.fs-kind{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:#7fd8ff}
.fs-c-bar{height:6px;border-radius:4px;background:rgba(255,255,255,.1);overflow:hidden;margin-top:4px}.fs-c-bar i{display:block;height:100%;background:linear-gradient(90deg,#57d4ff,#ffc24a)}
.fs-c-show{display:flex;justify-content:space-between;align-items:center;margin-top:6px;font-size:13px}
.fs-gallery h3{margin:6px 20px;font-size:15px}
.fs-g-badges{display:flex;flex-wrap:wrap;gap:8px;padding:0 20px 20px}
.fs-badge{padding:6px 10px;border-radius:999px;border:1px solid rgba(255,255,255,.12);font-size:13px;opacity:.55}.fs-badge.got{opacity:1;border-color:#ffc24a;color:#ffd67a}
