:root{--deep:#061f32;--ocean:#087b96;--cyan:#67d7e8;--lime:#d5ff5f;--paper:#eff2eb;--ink:#0a2638;--line:#d7dedb;--muted:#688087;--coral:#ff856b}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,sans-serif}.eyebrow{margin:0;color:#59d3e7;font-size:10px;font-weight:900;letter-spacing:2px;text-transform:uppercase}.tank-page{overflow:hidden}.tank-hero{min-height:310px;padding:55px 7vw 70px;display:flex;align-items:center;justify-content:space-between;gap:40px;background:linear-gradient(135deg,#061f32,#0b5365);color:#fff}.tank-hero h1{margin:13px 0 10px;font:900 clamp(48px,7vw,86px)/.95 Arial,sans-serif;letter-spacing:-5px}.tank-hero h1 em{color:var(--lime);font-style:normal}.tank-hero p:last-child{color:#bdd6dc;font-size:17px}.hero-tank{position:relative;width:270px;height:160px;flex:0 0 auto;border:6px solid #7ed5df;border-top-width:12px;border-radius:18px 18px 35px 35px;background:linear-gradient(#118ca8,#07546e);box-shadow:inset 0 -25px #063d56,0 24px 45px #001a2780;overflow:hidden}.hero-tank:after{content:"";position:absolute;left:0;right:0;bottom:0;height:20px;background:radial-gradient(circle,#d8bb7e 0 3px,transparent 4px) 0 0/18px 12px,#896e52}.hero-tank>i{position:absolute;bottom:16px;width:10px;height:64px;border-radius:50% 50% 0 0;background:#63b36d;transform-origin:bottom;animation:tankPlant 2.4s ease-in-out infinite}.hero-tank>i:nth-child(1){left:20px;transform:rotate(-12deg)}.hero-tank>i:nth-child(2){left:42px;height:48px;animation-delay:-.8s}.hero-tank>i:nth-child(3){right:25px;height:74px;animation-delay:-1.4s}.hero-fish{position:absolute;width:74px;height:42px;border-radius:60% 45% 45% 60%;background:linear-gradient(#6ce5ef 0 55%,#28a4c0 56%);animation:heroFish 4.6s ease-in-out infinite}.hero-fish:before{content:"";position:absolute;left:-22px;top:7px;border-right:27px solid #42bfd3;border-top:14px solid transparent;border-bottom:14px solid transparent}.hero-fish:after{content:"";position:absolute;right:13px;top:10px;width:5px;height:5px;border:3px solid #fff;border-radius:50%;background:#102f3d}.hero-fish.one{left:62px;top:42px}.hero-fish.two{right:38px;top:92px;transform:scale(.7);filter:hue-rotate(120deg);animation-delay:-2.2s}@keyframes heroFish{50%{translate:18px -5px}}@keyframes tankPlant{50%{rotate:7deg}}
.tank-shell{position:relative;width:min(1080px,94vw);margin:-38px auto 70px}.tank-toolbar{display:grid;grid-template-columns:repeat(5,1fr);border:1px solid var(--line);border-radius:20px 20px 0 0;background:#fff;overflow:hidden}.tank-toolbar span{padding:13px 9px;color:var(--muted);font-size:9px;font-weight:900;letter-spacing:1.1px;text-align:center;text-transform:uppercase}.tank-toolbar span+span{border-left:1px solid var(--line)}.tank-toolbar strong{display:block;margin-top:4px;color:var(--ink);font-size:21px;letter-spacing:0}.tank-toolbar span[data-level="low"] strong{color:#c44f49}.tank-toolbar span[data-level="good"] strong{color:#168265}.tank-stage{position:relative;height:min(67vh,610px);min-height:500px;border:1px solid #0c6075;border-top:0;border-radius:0 0 24px 24px;background:#087b96;box-shadow:0 24px 55px #08243522;overflow:hidden;touch-action:none;user-select:none}.tank-stage canvas{display:block;width:100%;height:100%;touch-action:none}.tank-status{position:absolute;z-index:5;left:50%;bottom:14px;max-width:calc(100% - 28px);padding:8px 13px;border:1px solid #79cbd7;border-radius:99px;background:#062e3ddb;color:#e5fbff;font-size:10px;font-weight:900;transform:translateX(-50%);white-space:nowrap}.tank-offline{position:absolute;z-index:6;left:14px;top:14px;max-width:min(390px,calc(100% - 28px));padding:10px 13px;border:1px solid #b3e7df;border-radius:13px;background:#e9fbf6ee;color:#17584d;font-size:10px;font-weight:800;box-shadow:0 8px 22px #04263733}.tank-overlay{position:absolute;z-index:8;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:28px;background:linear-gradient(#052c3bc9,#041d2ae8);color:#fff;text-align:center;backdrop-filter:blur(4px);overflow-y:auto}.tank-overlay.hidden{display:none}.tank-overlay h2{margin:10px 0;font-size:clamp(30px,5vw,50px);letter-spacing:-2px}.tank-overlay>p:not(.eyebrow){max-width:590px;color:#c4dce2;line-height:1.55}.tank-overlay button{min-width:200px;min-height:50px;margin-top:17px;border:0;border-radius:14px;background:var(--lime);color:#071f2f;font-weight:900}.tank-daily{max-width:520px;margin-top:10px;padding:11px 16px;border:1px solid #4b8190;border-radius:13px;background:#082d3bcc}.tank-daily span{display:block;color:#7ed8e6;font-size:8px;font-weight:900;letter-spacing:1.4px;text-transform:uppercase}.tank-daily strong{display:block;margin-top:4px;font-size:12px}
.tank-controls{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:14px}.tank-controls button{display:grid;grid-template-columns:42px 1fr;grid-template-rows:auto auto;align-items:center;min-height:74px;padding:12px 14px;border:1px solid var(--line);border-radius:16px;background:#fff;color:var(--ink);text-align:left;cursor:pointer}.tank-controls button:disabled{cursor:default;opacity:.5}.tank-controls button.active{border-color:#40b7ca;background:#e8fafb;box-shadow:0 0 0 2px #69d2e733}.tank-controls button>span{grid-row:1/3;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#e2f5f3;color:#16879a;font-size:18px}.tank-controls button.coin-control>span{background:#f0f7d2;color:#64811a;font-weight:900}.tank-controls b{font-size:12px}.tank-controls small{color:var(--muted);font-size:8px;line-height:1.3}.tank-controls .coin-ready{border-color:#a7cd3b;background:#f5ffdc;box-shadow:0 0 0 2px #d5ff5f55}.tank-fishbook,.tank-shop,.tank-how{margin-top:18px;padding:28px;border:1px solid var(--line);border-radius:20px;background:#fff}.tank-section-head{display:flex;align-items:end;justify-content:space-between;gap:20px}.tank-section-head h2,.tank-how h2{margin:7px 0 0;font-size:28px}.tank-section-head>span{padding:8px 11px;border-radius:99px;background:#edf4f2;color:#5e767b;font-size:9px;font-weight:900}.tank-section-head>span b{color:#15869a;font-size:15px}.tank-fishbook .eyebrow,.tank-shop .eyebrow,.tank-how .eyebrow{color:#278a9b}.fishbook-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px;margin-top:20px}.fishbook-card{display:grid;grid-template-columns:54px 1fr auto;align-items:center;gap:11px;min-width:0;padding:13px;border:1px solid #dce5e1;border-radius:14px;background:#f8fbf8}.fishbook-avatar,.shop-fish{--fish-top:#69deeb;--fish-bottom:#1688a8;--fish-tail:#30b9d3;position:relative;width:48px;height:30px;border-radius:60% 45% 45% 60%;background:linear-gradient(var(--fish-top) 0 56%,var(--fish-bottom) 57%)}.fishbook-avatar:before,.shop-fish:before{content:"";position:absolute;left:-14px;top:5px;border-right:18px solid var(--fish-tail);border-top:10px solid transparent;border-bottom:10px solid transparent}.fishbook-avatar:after,.shop-fish:after{content:"";position:absolute;right:8px;top:7px;width:3px;height:3px;border:2px solid #fff;border-radius:50%;background:#102f3d}.fishbook-copy{min-width:0}.fishbook-copy b,.fishbook-copy small{display:block}.fishbook-copy b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}.fishbook-copy small{margin-top:3px;color:#718287;font-size:8px}.growth-track{height:5px;margin-top:8px;border-radius:99px;background:#dfe8e4;overflow:hidden}.growth-track i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#69d2e7,#d5ff5f)}.fishbook-age{color:#278a9b;font-size:9px;font-weight:900;text-transform:uppercase}.tank-shop-intro{max-width:700px;margin:10px 0 0;color:#6d8085;font-size:11px;line-height:1.5}.tank-shop-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:19px}.shop-card{position:relative;display:grid;grid-template-columns:58px 1fr;gap:13px;min-width:0;padding:16px;border:1px solid #dae4e0;border-radius:15px;background:#f7faf8}.shop-card h3{margin:0;font-size:15px}.shop-card p{grid-column:1/-1;margin:0;color:#718489;font-size:9px;line-height:1.45}.shop-card button{grid-column:1/-1;min-height:40px;border:1px solid #137d91;border-radius:10px;background:#0a8095;color:#fff;font-weight:900}.shop-card button:disabled{border-color:#c7d2ce;background:#e7ece9;color:#8a9995}.shop-card .shop-price{display:block;margin-top:5px;color:#6d8588;font-size:9px}.shop-fish{align-self:center;margin-left:5px}.tank-how>div{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:20px}.tank-how article{padding:19px;border-radius:15px;background:#edf6f4}.tank-how article>b{color:#218ba0;font-size:10px}.tank-how h3{margin:10px 0 6px}.tank-how article p{margin:0;color:#647a7c;font-size:12px;line-height:1.5}
.tank-tile{background:linear-gradient(145deg,#0b7183,#064052)!important;color:#fff!important}.tank-tile p{color:#8de8ef!important}.tank-tile strong{color:#c3dce0!important}.tank-tile em{color:var(--lime)!important}.tank-preview{position:absolute;right:23px;bottom:29px;width:185px;height:112px;border:0;border-radius:11px 11px 24px 24px;background:linear-gradient(#1597ae,#07526a);box-shadow:inset 0 -17px #073c50;overflow:hidden}.tank-preview:before{content:"";position:absolute;z-index:4;inset:0;border:4px solid #7bd8e3;border-top-width:8px;border-radius:11px 11px 24px 24px;pointer-events:none}.tank-preview:after{content:"";position:absolute;left:0;right:0;bottom:0;height:14px;background:radial-gradient(circle,#e2c589 0 2px,transparent 3px) 0 0/13px 9px,#8a7156}.tank-preview i{position:absolute;width:54px;height:31px;border-radius:60% 45% 45% 60%;background:linear-gradient(#69deeb 0 55%,#1fa5c0 56%);animation:tankTileFish 3.5s ease-in-out infinite}.tank-preview i:before{content:"";position:absolute;left:-17px;top:5px;border-right:21px solid #36b8cf;border-top:10px solid transparent;border-bottom:10px solid transparent}.tank-preview i:after{content:"";position:absolute;right:9px;top:7px;width:4px;height:4px;border:2px solid #fff;border-radius:50%;background:#102f3d}.tank-preview i:first-child{left:38px;top:27px}.tank-preview i:last-child{right:24px;top:62px;scale:.72;filter:hue-rotate(125deg);animation-delay:-1.7s}@keyframes tankTileFish{50%{translate:12px -4px}}
.tank-preview canvas{position:absolute;z-index:1;inset:0;display:block;width:100%;height:100%;pointer-events:none}.tank-preview:after{z-index:2}
@media(max-width:800px){.tank-controls{grid-template-columns:1fr 1fr}.tank-shop-grid{grid-template-columns:1fr 1fr}.fishbook-grid{grid-template-columns:1fr}.tank-preview{right:16px;bottom:22px;scale:.78;transform-origin:right bottom}}
@media(max-width:620px){.tank-hero{min-height:230px;padding:38px 20px 54px}.tank-hero h1{font-size:48px;letter-spacing:-3px}.hero-tank{display:none}.tank-shell{width:auto;margin:-26px 10px 50px}.tank-toolbar span{padding:10px 3px;font-size:7px;letter-spacing:.4px}.tank-toolbar strong{font-size:16px}.tank-stage{height:58dvh;min-height:440px;max-height:590px}.tank-overlay{justify-content:flex-start;padding:55px 17px 23px}.tank-controls{grid-template-columns:1fr 1fr}.tank-controls button{grid-template-columns:36px 1fr;min-height:66px;padding:10px}.tank-controls button>span{width:30px;height:30px}.tank-fishbook,.tank-shop,.tank-how{padding:21px 17px}.tank-section-head{align-items:flex-start;flex-direction:column;gap:9px}.tank-shop-grid{grid-template-columns:1fr}.tank-how>div{grid-template-columns:1fr}.tank-status{bottom:9px;font-size:8px}.tank-offline{top:9px;font-size:8px}}
@media(max-width:390px){.tank-toolbar strong{font-size:14px}.tank-controls{grid-template-columns:1fr}.tank-stage{min-height:420px}.fishbook-card{grid-template-columns:48px 1fr}.fishbook-age{grid-column:2}.tank-tile strong{max-width:57%!important}.tank-preview{right:12px;scale:.72}}
@media(prefers-reduced-motion:reduce){.hero-tank>i,.hero-fish,.tank-preview i{animation:none}}

/* One shared fish silhouette for the fishbook and shop. It mirrors the canvas fish. */
.fishbook-avatar,.shop-fish{border:1px solid color-mix(in srgb,var(--fish-bottom) 62%,#143d4a);box-shadow:inset -7px -5px 0 color-mix(in srgb,var(--fish-bottom) 34%,transparent),0 5px 9px #092c3820;transform-origin:center}
.fishbook-avatar>i,.shop-fish>i{position:absolute;z-index:2;left:18px;bottom:-7px;width:20px;height:14px;background:var(--fish-bottom);clip-path:polygon(5% 0,100% 25%,65% 100%);opacity:.82;transform:rotate(7deg)}
.fishbook-avatar:before,.shop-fish:before{filter:drop-shadow(0 2px 1px #082d3a28)}
.fishbook-avatar:after,.shop-fish:after{box-shadow:0 0 0 1px #12384755}
.hero-tank canvas{position:absolute;z-index:2;inset:0;display:block;width:100%;height:100%;pointer-events:none}
.hero-tank>i{z-index:3}.hero-tank:after{z-index:4}
canvas.fishbook-avatar,canvas.shop-fish{display:block;width:72px;height:48px;border:0;border-radius:0;background:transparent;box-shadow:none;object-fit:contain}
.fishbook-card{grid-template-columns:76px 1fr auto}
.shop-card{grid-template-columns:76px 1fr}
.shop-fish{margin-left:0}
.tank-controls button.attention{border-color:#f0a44e;background:#fff8e6;box-shadow:0 0 0 3px #ffc66d35;animation:tankHungry 1.5s ease-in-out infinite}
.tank-controls button.attention>span{background:#fff0c7;color:#b7681d}
@keyframes tankHungry{50%{transform:translateY(-2px);box-shadow:0 7px 18px #d98b2826}}
@media(max-width:390px){canvas.fishbook-avatar{width:62px;height:42px}.fishbook-card{grid-template-columns:64px 1fr}}
@media(prefers-reduced-motion:reduce){.tank-controls button.attention{animation:none}}

/* Keep every care action visible on phones; none should be hidden in a carousel. */
@media(max-width:620px){
  .tank-controls{position:static;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));overflow:visible;scroll-snap-type:none;padding:0;border:0;background:transparent;box-shadow:none;backdrop-filter:none}
  .tank-controls button{width:auto;min-width:0;min-height:66px;flex:auto;scroll-snap-align:none}
  .tank-controls button:last-child{grid-column:1/-1}
  .shop-card button{min-height:44px}
}
@media(max-width:350px){.tank-controls{grid-template-columns:1fr}.tank-controls button:last-child{grid-column:auto}}

.tank-decor{margin-top:18px;padding:28px;border:1px solid var(--line);border-radius:20px;background:#fff}.tank-decor .eyebrow{color:#278a9b}.decor-shelf{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px;padding:12px;border:1px dashed #b9cfca;border-radius:14px;background:#f3f8f5}.decor-shelf button{display:flex;align-items:center;gap:8px;min-height:43px;padding:6px 11px;border:1px solid #cbdad6;border-radius:11px;background:#fff;color:var(--ink);cursor:pointer}.decor-shelf button.selected{border-color:#64cad8;background:#e7fbfd;box-shadow:0 0 0 3px #64cad82e}.decor-shelf button b{font-size:9px}.decor-icon{--decor-colour:#ff846d;display:grid;place-items:center;width:32px;height:32px;flex:0 0 auto;border-radius:50%;background:color-mix(in srgb,var(--decor-colour) 20%,#fff);color:var(--decor-colour);font-size:20px;font-weight:900}.decor-shop-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-top:12px}.decor-shop-grid article{display:grid;grid-template-columns:38px 1fr;align-items:center;gap:9px;padding:12px;border:1px solid #dbe5e1;border-radius:13px;background:#f8fbf9}.decor-shop-grid article b,.decor-shop-grid article small{display:block}.decor-shop-grid article b{font-size:11px}.decor-shop-grid article small{margin-top:3px;color:#718489;font-size:8px}.decor-shop-grid article button{grid-column:1/-1;min-height:37px;border:1px solid #16869a;border-radius:9px;background:#0b8ca1;color:#fff;font-size:10px;font-weight:900}.decor-shop-grid article button:disabled{border-color:#cbd6d2;background:#e8edeb;color:#899895}
@media(max-width:800px){.decor-shop-grid{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.tank-decor{padding:21px 17px}.decor-shop-grid{grid-template-columns:1fr}.decor-shelf button{flex:1 1 140px}}

.tank-controls{grid-template-columns:repeat(5,1fr)}.tank-stage.decorating canvas{cursor:grab}.tank-stage.decorating canvas:active{cursor:grabbing}.tank-stage.decorating .tank-status{top:12px;bottom:auto}.tank-decor-tray{position:relative;z-index:7;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;margin-top:10px;padding:11px;border:1px solid #a7d8dc;border-radius:15px;background:#f4fffd;box-shadow:0 10px 24px #032b3d1f}.tank-decor-tray[hidden]{display:none}.tank-decor-tray>div:first-child{min-width:180px}.tank-decor-tray>div:first-child b,.tank-decor-tray>div:first-child small{display:block}.tank-decor-tray>div:first-child b{font-size:12px}.tank-decor-tray>div:first-child small{max-width:250px;margin-top:3px;color:#627a7d;font-size:8px;line-height:1.35}.tank-decor-tray .decor-shelf{flex-wrap:nowrap;min-width:0;margin:0;padding:5px;overflow-x:auto;scrollbar-width:thin}.tank-decor-tray .decor-shelf button{flex:0 0 auto}.tank-decor-tray>button{min-height:40px;padding:0 16px;border:0;border-radius:10px;background:#082d3d;color:#fff;font-weight:900}
.decor-owned-item{display:flex;align-items:stretch;flex:0 0 auto;border-radius:11px}.decor-owned-item>.decor-store{min-height:43px;margin-left:4px;padding:6px 9px;border-color:#e1b6ad;background:#fff7f4;color:#9a4f42;font-size:8px;font-weight:900}.decor-owned-item>.decor-store:hover{border-color:#c56c5d;background:#ffebe5}
@media(max-width:620px){.tank-controls{position:static;z-index:auto;bottom:auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin:10px 2px 0;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;overflow:visible;scroll-snap-type:none;backdrop-filter:none}.tank-controls button{width:auto;min-width:0;min-height:66px;flex:auto;scroll-snap-align:none}.tank-controls button:last-child{grid-column:1/-1}.tank-decor-tray{grid-template-columns:1fr;gap:8px;margin:8px 0 0;padding:9px}.tank-decor-tray>div:first-child{grid-column:1;min-width:0}.tank-decor-tray .decor-shelf{grid-column:1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));min-height:0;overflow:visible}.tank-decor-tray .decor-shelf button,.tank-decor-tray .decor-owned-item{min-width:0;width:100%;flex:auto}.tank-decor-tray>button{grid-column:1;width:100%;min-height:44px}.shop-card button,.decor-shop-grid article button{min-height:44px}}

.tank-section-toggle{display:none;min-width:64px;min-height:44px;padding:0 12px;border:1px solid #b9d4d2;border-radius:999px;background:#eef8f5;color:var(--ink);font:800 11px system-ui,-apple-system,"Segoe UI",sans-serif;cursor:pointer}
@media(max-width:620px){.tank-section-toggle{display:inline-grid;place-items:center;margin-left:auto}.tank-section-head .tank-section-toggle{align-self:flex-start}.tank-how>.tank-section-toggle{float:right;margin-top:-42px}.tank-fishbook.mobile-collapsed>:not(.tank-section-head),.tank-shop.mobile-collapsed>:not(.tank-section-head),.tank-decor.mobile-collapsed>:not(.tank-section-head),.tank-how.mobile-collapsed>:not(.eyebrow):not(h2):not(.tank-section-toggle){display:none!important}.tank-fishbook,.tank-shop,.tank-decor,.tank-how{margin-top:10px;padding-top:17px;padding-bottom:17px}.tank-section-head h2,.tank-how h2{font-size:22px}}
@media(max-width:350px){.tank-controls{grid-template-columns:1fr}.tank-controls button:last-child{grid-column:auto}}