:root{--ink:#effbff;--muted:#96b5c0;--line:rgba(213,244,255,.16);--glass:rgba(2,16,25,.56);--accent:#b5f2ff;--depth:0;--flesh:1;--bone:0}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#020912;color:var(--ink);font-family:system-ui,-apple-system,"Hiragino Sans","Yu Gothic",sans-serif}.game{position:relative;width:100%;height:100svh;overflow:hidden;touch-action:none;background:#061c2a}.ocean{position:absolute;inset:0;overflow:hidden;background:linear-gradient(#5dcbe5 0%,#126584 42%,#072d47 70%,#031722 100%);transition:background 1.1s ease}.phase-descent .ocean{background:linear-gradient(#237c9d 0%,#0a3957 35%,#041d2f 68%,#010a12 100%)}.phase-floor .ocean,.phase-scavenge .ocean,.phase-enrich .ocean,.phase-bone .ocean,.phase-chemo .ocean,.phase-ending .ocean{background:radial-gradient(circle at 50% 54%,#0b3542 0,#051e2a 35%,#010a11 80%)}.surface-glow{position:absolute;inset:-10% -20% 45%;background:radial-gradient(ellipse at 50% 0,rgba(219,252,255,.8),transparent 65%);opacity:1;transition:opacity 1s}.phase-descent .surface-glow{opacity:calc(1 - var(--depth))}.phase-floor .surface-glow,.phase-scavenge .surface-glow,.phase-enrich .surface-glow,.phase-bone .surface-glow,.phase-chemo .surface-glow,.phase-ending .surface-glow{opacity:0}.light-rays{position:absolute;inset:-20% -15% 0;background:repeating-linear-gradient(105deg,transparent 0 8%,rgba(222,251,255,.10) 9% 11%,transparent 13% 20%);filter:blur(6px);opacity:.95;transition:opacity .8s}.phase-descent .light-rays{opacity:calc(.8 - var(--depth)*.7)}.phase-floor .light-rays,.phase-scavenge .light-rays,.phase-enrich .light-rays,.phase-bone .light-rays,.phase-chemo .light-rays,.phase-ending .light-rays{opacity:0}.snow{position:absolute;z-index:5;inset:0;pointer-events:none}.snow i{position:absolute;width:2px;height:2px;border-radius:50%;background:rgba(235,252,255,.55);animation:snowFall linear infinite}@keyframes snowFall{from{transform:translateY(-12vh)}to{transform:translateY(112vh)}}.distant-life{position:absolute;z-index:4;inset:0;opacity:.5}.fish-sil{position:absolute;width:42px;height:13px;border-radius:60% 45% 45% 60%;background:rgba(105,190,208,.22);animation:fishDrift 14s linear infinite}.fish-sil:before{content:"";position:absolute;left:-10px;top:1px;border-right:11px solid rgba(105,190,208,.22);border-top:6px solid transparent;border-bottom:6px solid transparent}@keyframes fishDrift{from{translate:-20vw 0}to{translate:120vw 0}}.whale{position:absolute;z-index:12;left:50%;top:44%;width:min(96vw,900px);transform:translate(-50%,-50%);filter:drop-shadow(0 26px 28px rgba(0,0,0,.22));overflow:visible;transition:top .8s cubic-bezier(.2,.75,.2,1),transform .8s,filter .8s,opacity .8s}.living-whale{opacity:var(--flesh);transition:opacity 1s,filter 1s;transform-origin:center;animation:whaleFloat 5s ease-in-out infinite}.body{fill:url(#bodyGrad)}.belly{fill:url(#bellyGrad);opacity:.76}.tail,.fin{fill:#52788a;transform-origin:156px 176px;animation:tail 2.2s ease-in-out infinite}.fin{fill:#4a7082;transform-origin:400px 212px;animation-duration:3.2s}.eye{fill:#102735}.mouth{fill:none;stroke:#385c6c;stroke-width:5;stroke-linecap:round}.skeleton{opacity:var(--bone);transition:opacity 1s}.skeleton .spine,.skeleton .rib,.skeleton .tailbone{fill:none;stroke:#d7d1bd;stroke-linecap:round}.skeleton .spine{stroke-width:25}.skeleton .rib{stroke-width:10}.skeleton .tailbone{stroke-width:14}.skeleton .skull{fill:#d8d1ba}.phase-descent .living-whale{animation:deadDrift 5.8s ease-in-out infinite}.phase-descent .tail,.phase-descent .fin,.phase-floor .tail,.phase-floor .fin,.phase-scavenge .tail,.phase-scavenge .fin,.phase-enrich .tail,.phase-enrich .fin,.phase-bone .tail,.phase-bone .fin,.phase-chemo .tail,.phase-chemo .fin{animation:none}.phase-floor .whale,.phase-scavenge .whale,.phase-enrich .whale,.phase-bone .whale,.phase-chemo .whale{top:68%;transform:translate(-50%,-50%) rotate(1.5deg)}.phase-scavenge .living-whale{filter:saturate(.75) brightness(.78)}.phase-enrich .living-whale{filter:saturate(.45) brightness(.65)}.phase-bone .living-whale,.phase-chemo .living-whale{filter:saturate(.2) brightness(.55)}.phase-ending .whale{top:65%;transform:translate(-50%,-50%) scale(.62);opacity:.75}@keyframes whaleFloat{50%{transform:translateY(10px) rotate(.35deg)}}@keyframes tail{50%{transform:rotate(5deg)}}@keyframes deadDrift{50%{transform:rotate(3deg) translateY(10px)}}.decay-marks path{fill:#233f48;opacity:.72;filter:blur(.3px)}.seafloor{position:absolute;z-index:3;left:-6%;right:-6%;height:38%;bottom:-43%;background:linear-gradient(#4b5b61,#2b3f46 20%,#162d35 58%,#0b1c23);border-radius:48% 52% 0 0/9% 11% 0 0;transition:bottom 1.3s cubic-bezier(.2,.8,.2,1),background 1s}.phase-floor .seafloor,.phase-scavenge .seafloor,.phase-enrich .seafloor,.phase-bone .seafloor,.phase-chemo .seafloor,.phase-ending .seafloor{bottom:-9%}.phase-enrich .seafloor,.phase-bone .seafloor,.phase-chemo .seafloor,.phase-ending .seafloor{background:linear-gradient(#59645e,#354b45 20%,#193330 58%,#0d2422)}.silt-cloud{position:absolute;left:18%;right:18%;top:-18px;height:60px;background:radial-gradient(ellipse,rgba(206,214,207,.35),transparent 70%);filter:blur(9px);opacity:.2}.ridge{position:absolute;background:#132832;border-radius:55% 45% 40% 60%;bottom:58%}.ridge-a{width:110px;height:48px;left:5%;rotate:-8deg}.ridge-b{width:78px;height:34px;right:7%;bottom:66%;rotate:12deg}.foreground{position:absolute;z-index:24;inset:0;pointer-events:none}.foreground i{position:absolute;bottom:-15px;width:105px;height:70px;border-radius:55% 45% 0 0;background:#04131b}.foreground i:nth-child(1){left:-32px}.foreground i:nth-child(2){right:-46px;width:160px;height:88px}.foreground i:nth-child(3){left:52%;width:70px;height:42px;opacity:.68}.hud{position:absolute;z-index:40;top:0;left:0;right:0;padding:calc(12px + env(safe-area-inset-top)) 14px 12px;display:grid;grid-template-columns:82px 1fr 76px 46px;gap:8px;align-items:start;background:linear-gradient(rgba(0,10,17,.55),transparent);pointer-events:none;font-variant-numeric:tabular-nums}.hud>*{pointer-events:auto}.stat small{display:block;font-size:9px;letter-spacing:.12em;opacity:.55}.stat strong{display:block;font-size:15px;margin-top:2px}.stat.right{text-align:right}.phase-head{text-align:center}.phase-head>strong{font-size:11px;letter-spacing:.09em}.phase-dots{display:flex;justify-content:center;gap:4px;margin-top:8px}.phase-dots i{width:4px;height:4px;border-radius:50%;background:rgba(255,255,255,.22)}.phase-dots i.on{background:#ccf8ff;box-shadow:0 0 8px #a7edff}.round-btn{height:34px;min-width:42px;border-radius:99px;border:1px solid var(--line);background:rgba(2,21,31,.35);color:white;backdrop-filter:blur(9px);font-size:12px}.round-btn b{font-size:9px;margin-left:3px}.intro-card{position:absolute;z-index:50;left:18px;right:18px;bottom:calc(22px + env(safe-area-inset-bottom));max-width:560px;margin:auto;padding:21px;background:rgba(0,18,29,.56);border:1px solid rgba(224,249,255,.2);border-radius:27px;backdrop-filter:blur(18px);box-shadow:0 18px 55px rgba(0,0,0,.24);transition:.4s}.intro-card.hide{opacity:0;translate:0 30px;pointer-events:none}.kicker{font-size:10px;letter-spacing:.23em;font-weight:850;color:#a9e4f4}.intro-card h1{font-size:clamp(32px,9vw,49px);letter-spacing:-.05em;margin:8px 0 7px}.intro-card p{font-size:13px;line-height:1.75;color:#c2d7de;margin:0 0 16px}.primary,.secondary{appearance:none;border:0;border-radius:999px;padding:14px 19px;font-weight:850;font-size:14px}.primary{background:#edfbff;color:#06202a}.primary span{font-size:9px;letter-spacing:.12em;opacity:.52;margin-left:7px}.secondary{background:rgba(255,255,255,.07);border:1px solid var(--line);color:white}.story-caption{position:absolute;z-index:34;left:18px;right:18px;top:calc(86px + env(safe-area-inset-top));max-width:540px;margin:auto;text-align:center;font-size:14px;line-height:1.6;font-weight:700;text-shadow:0 2px 14px #000;opacity:0;transform:translateY(-8px);transition:.4s;pointer-events:none}.story-caption.show{opacity:.95;transform:none}.action-dock{position:absolute;z-index:35;left:16px;bottom:calc(18px + env(safe-area-inset-bottom));min-width:225px;max-width:calc(100% - 32px);display:grid;grid-template-columns:40px minmax(130px,1fr);gap:10px;align-items:center;padding:10px 13px;border:1px solid var(--line);border-radius:20px;background:rgba(1,15,23,.58);backdrop-filter:blur(12px);box-shadow:0 10px 35px rgba(0,0,0,.2)}.action-icon{grid-row:1/3;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:rgba(188,240,255,.12);font-size:21px;animation:nudge 1.5s ease-in-out infinite}.action-copy strong{display:block;font-size:12px}.action-copy small{display:block;font-size:10px;color:#91b3bf;margin-top:2px}.action-progress{grid-column:2;height:3px;background:rgba(255,255,255,.1);border-radius:99px;overflow:hidden;margin-top:-2px}.action-progress i{display:block;width:0;height:100%;background:#b6f2ff;border-radius:99px;transition:width .2s}@keyframes nudge{50%{transform:translateY(4px)}}.time-button{position:absolute;z-index:36;right:17px;bottom:calc(18px + env(safe-area-inset-bottom));width:86px;height:86px;border-radius:50%;border:1px solid rgba(212,246,255,.25);background:rgba(3,23,33,.65);color:white;backdrop-filter:blur(14px);display:grid;place-content:center;gap:2px}.time-button b{font-size:12px}.time-button small{font-size:8px;opacity:.65}.time-button .ring{position:absolute;inset:5px;border:2px solid rgba(190,239,255,.2);border-radius:50%;clip-path:inset(0 100% 0 0)}.time-button.holding{transform:scale(.96);background:rgba(20,60,69,.72)}.time-button.holding .ring{animation:fillRing 1.15s linear forwards}.scavengers.fast .animal{animation-duration:.65s!important}@keyframes fillRing{to{clip-path:inset(0 0 0 0)}}.hidden{display:none!important}.scent{position:absolute;z-index:8;inset:0;pointer-events:none}.scent i{position:absolute;width:13px;height:13px;border-radius:50%;background:radial-gradient(circle,rgba(174,231,165,.8),rgba(91,179,145,.18),transparent 72%);animation:scent 2s ease-out forwards}@keyframes scent{to{transform:scale(10);opacity:0}}.approaching{position:absolute;z-index:9;inset:0;pointer-events:none;opacity:0;transition:opacity .6s}.approaching.show{opacity:.65}.approaching i{position:absolute;width:85px;height:26px;background:#102d38;clip-path:polygon(0 50%,18% 18%,69% 25%,100% 48%,70% 70%,18% 82%);filter:blur(2px);animation:approach 4s ease-in-out infinite}.approaching i:nth-child(1){left:-12px;top:48%}.approaching i:nth-child(2){right:-15px;top:58%;transform:scaleX(-1)}.approaching i:nth-child(3){right:4%;top:34%;scale:.7}@keyframes approach{50%{translate:16px -4px}}.scavengers{position:absolute;z-index:17;inset:0;pointer-events:none}.animal{position:absolute;pointer-events:auto;cursor:pointer;filter:drop-shadow(0 8px 10px rgba(0,0,0,.35));animation:arrive .7s ease-out both}.animal .tag{position:absolute;left:50%;top:-27px;transform:translateX(-50%);white-space:nowrap;font-size:9px;background:rgba(0,8,13,.78);padding:5px 8px;border-radius:99px;opacity:0;transition:.2s}.animal.found .tag{opacity:1}.shark{width:145px;height:45px;background:#456571;clip-path:polygon(0 46%,12% 28%,36% 21%,54% 0,63% 24%,88% 34%,100% 14%,96% 49%,100% 82%,85% 62%,57% 68%,35% 83%,13% 70%);animation:sharkMove 7s ease-in-out infinite}.hagfish{width:110px;height:13px;border-radius:50%;background:linear-gradient(90deg,#826c83,#bd95a5,#6a576f);animation:hagMove 2.1s ease-in-out infinite}.grenadier{width:82px;height:25px;background:#708b98;clip-path:polygon(0 50%,18% 18%,60% 25%,100% 48%,62% 65%,18% 80%);animation:smallMove 4s ease-in-out infinite}.amphipod{width:14px;height:8px;border-radius:50%;background:#d4b49f;box-shadow:6px 4px 0 -3px #d4b49f;animation:smallMove 1.7s ease-in-out infinite}@keyframes arrive{from{opacity:0;transform:scale(.35)}to{opacity:1;transform:scale(1)}}@keyframes sharkMove{50%{translate:42px -12px}}@keyframes hagMove{50%{translate:17px 3px;rotate:7deg}}@keyframes smallMove{50%{translate:9px -5px}}.bloom-layer{position:absolute;inset:0;pointer-events:none}.bloom-patch{position:absolute;width:58px;height:34px;border-radius:50%;border:1px solid rgba(191,244,222,.35);background:radial-gradient(ellipse,rgba(141,222,185,.24),transparent 68%);box-shadow:0 0 22px rgba(116,221,180,.14);pointer-events:auto;animation:pulsePatch 1.7s ease-in-out infinite}.bloom-patch.done{border-color:transparent;background:transparent;box-shadow:none;animation:none}.bloom-patch.done:before{content:"";position:absolute;inset:-10px;background:radial-gradient(circle at 20% 60%,#e2caa6 0 2px,transparent 3px),radial-gradient(circle at 43% 30%,#c5d7a0 0 2px,transparent 3px),radial-gradient(circle at 68% 65%,#e0b897 0 2px,transparent 3px),radial-gradient(circle at 83% 36%,#d8cca8 0 2px,transparent 3px);filter:drop-shadow(0 0 5px rgba(209,235,184,.45))}@keyframes pulsePatch{50%{transform:scale(1.16);opacity:.68}}.osedax .worm{transform-box:fill-box;transform-origin:bottom;animation:worm 1.7s ease-in-out infinite alternate}@keyframes worm{to{transform:rotate(7deg)}}.energy-canvas{position:absolute;z-index:19;inset:0;width:100%;height:100%;opacity:0;transition:opacity .7s,filter .3s;pointer-events:none}.phase-chemo .energy-canvas,.phase-ending .energy-canvas{opacity:.9}.whale.energy-view{filter:drop-shadow(0 0 28px rgba(126,241,216,.5))}.field-guide{position:absolute;z-index:75;inset:0;background:#03121b;padding:calc(28px + env(safe-area-inset-top)) 20px calc(20px + env(safe-area-inset-bottom));transform:translateY(105%);transition:.4s cubic-bezier(.2,.8,.2,1);overflow:auto}.field-guide.open{transform:none}.field-guide h2{font-size:34px;letter-spacing:-.04em;margin:7px 0 22px}.close-guide{position:absolute;right:18px;top:calc(16px + env(safe-area-inset-top));width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:rgba(255,255,255,.04);color:white;font-size:24px}.guide-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;max-width:700px}.guide-item{min-height:118px;border:1px solid rgba(185,229,243,.11);border-radius:18px;background:#071d29;padding:14px}.guide-item.locked{opacity:.27;filter:grayscale(1)}.guide-icon{font-size:29px}.guide-name{font-size:13px;font-weight:800;margin-top:15px}.guide-role{font-size:10px;color:#85a9b6;margin-top:4px;line-height:1.5}.ending{position:absolute;z-index:65;inset:0;background:radial-gradient(circle at 50% 65%,rgba(7,57,63,.25),rgba(0,7,12,.9) 67%);display:grid;place-items:center;padding:26px;text-align:center;backdrop-filter:blur(3px)}.ending-inner{max-width:530px}.ending h2{font-size:clamp(30px,8vw,53px);letter-spacing:-.045em;line-height:1.2;margin:12px 0}.ending p{color:#afc8d0;line-height:1.8;font-size:13px}.ending-actions{display:flex;justify-content:center;gap:10px;margin-top:23px}@media(min-width:700px){.whale{width:min(76vw,900px)}.hud{padding-left:24px;padding-right:24px}.guide-grid{grid-template-columns:repeat(3,1fr)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}}