:root{--ink:#102e3c;--muted:#718a94;--navy:#062b3a;--deep:#07394a;--sea:#087b87;--aqua:#64d6c7;--foam:#f4faf8;--paper:#fbfdfc;--line:#dcebe8;--coral:#ef9b83;--gold:#e9c57d;--white:#fff;--shadow:0 18px 45px rgba(14,65,74,.09);--radius:24px;--safe-bottom:env(safe-area-inset-bottom,0px)}
*{box-sizing:border-box}html{scroll-behavior:smooth;-webkit-tap-highlight-color:transparent}body{margin:0;background:linear-gradient(140deg,#f3faf9 0%,#f7fafb 48%,#edf8f6 100%);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;font-size:14px;line-height:1.5;min-height:100vh}button,input,select{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid rgba(8,123,135,.3);outline-offset:2px}button:disabled{cursor:not-allowed;opacity:.46}.app-shell{max-width:1240px;margin:0 auto;padding:24px 32px 112px}.topbar{height:66px;display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:26px}.brand-lockup{display:flex;align-items:center;gap:12px}.brand-mark{position:relative;display:grid;place-items:center;width:42px;height:42px;border-radius:15px;background:linear-gradient(145deg,#0b5766,#062b3a);color:#7de5d6;box-shadow:0 8px 20px #0d556333;font-size:26px}.brand-mark span{transform:rotate(-30deg);font-size:28px}.brand-mark i{position:absolute;font-style:normal;font-size:10px;right:8px;top:5px;color:#f7ce88}.brand-name{font-size:18px;font-weight:800;letter-spacing:.01em}.brand-name span{font-size:9px;letter-spacing:.17em;font-weight:700;color:#718b92;margin-left:6px}.brand-subtitle{font-size:11px;color:#81979d;margin-top:1px;letter-spacing:.04em}.wallet-chip{display:flex;align-items:center;gap:7px;border:1px solid #d9e9e5;border-radius:999px;padding:9px 13px;background:#fff;color:var(--ink);box-shadow:0 3px 12px #0c4b5510}.wallet-chip strong{font-size:15px}.wallet-chip>span:not(.shell-icon):not(.wallet-plus){font-size:11px;color:var(--muted)}.shell-icon{display:grid;place-items:center;color:#b77b26;background:#fff3d4;border-radius:50%;width:24px;height:24px;font-size:14px}.wallet-plus{font-size:18px;color:var(--sea);margin-left:2px}.screen{animation:screenIn .32s ease both}.screen[hidden]{display:none!important}@keyframes screenIn{from{opacity:.35;transform:translateY(5px)}to{opacity:1;transform:none}}.welcome-row{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:23px}.eyebrow{margin:0 0 7px;color:#62858c;letter-spacing:.14em;font-size:10px;font-weight:800}.welcome-row h1{font-size:clamp(24px,3vw,34px);letter-spacing:-.04em;margin:0 0 6px;line-height:1.18}.accent-word{color:#07838d}.muted-text{color:var(--muted);font-size:12px;margin:0;line-height:1.7}.streak-pill,.tank-count-pill{display:flex;align-items:center;gap:10px;border:1px solid var(--line);background:#ffffffba;border-radius:18px;padding:11px 14px;flex-shrink:0}.streak-pill>span{display:grid;place-items:center;width:32px;height:32px;border-radius:11px;color:#b87b24;background:#fff1ce;font-size:18px}.streak-pill strong,.tank-count-pill strong{display:block;font-size:14px}.streak-pill small,.tank-count-pill small{display:block;font-size:10px;color:var(--muted)}.focus-layout{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(255px,.75fr);gap:20px}.focus-card{border-radius:var(--radius);background:linear-gradient(155deg,#083d4b,#062a38 68%,#072634);box-shadow:0 20px 48px #062c3b20;color:white;padding:23px 25px 20px;position:relative;overflow:hidden}.focus-card:after{content:"";position:absolute;width:300px;height:300px;right:-120px;top:90px;border:1px solid #ffffff0c;border-radius:50%;box-shadow:0 0 0 30px #ffffff08,0 0 0 70px #ffffff05;pointer-events:none}.focus-card-top{display:flex;align-items:center;gap:8px;position:relative;z-index:1;color:#c4d8da;font-size:11px}.live-dot,.aqua-live{width:7px;height:7px;border-radius:50%;background:#71dec7;box-shadow:0 0 0 4px #71dec71c}.focus-card-top .text-button{margin-left:auto;color:#9dbfc3}.text-button{border:0;background:transparent;padding:4px 0;color:#14828e;font-size:11px;font-weight:700}.text-button:hover{text-decoration:underline}.timer-zone{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;gap:clamp(20px,4vw,52px);padding:25px 0 21px}.timer-ring{width:min(245px,48vw);aspect-ratio:1;position:relative;flex-shrink:0}.timer-ring svg{width:100%;height:100%;transform:rotate(-90deg);overflow:visible}.ring-track,.ring-progress{fill:none;stroke-width:4}.ring-track{stroke:#ffffff13}.ring-progress{stroke:#76e0ce;stroke-linecap:round;stroke-dasharray:659.73;stroke-dashoffset:659.73;transition:stroke-dashoffset .5s ease;filter:drop-shadow(0 0 5px #76e05b33)}.timer-center{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center}.timer-kicker{color:#a5c6ca;font-size:11px;letter-spacing:.12em;margin-bottom:6px}.timer-value{font-size:clamp(35px,5.2vw,48px);font-weight:300;letter-spacing:-.055em;font-variant-numeric:tabular-nums;line-height:1.2}.timer-sub{font-size:10px;color:#9bbfc3;margin-top:9px}.timer-stats{display:flex;flex-direction:column;gap:14px;min-width:120px}.timer-stats>div:not(.stat-divider){display:flex;flex-direction:column;gap:2px}.timer-stats span{font-size:22px;letter-spacing:-.03em;font-weight:700;color:#e4fffa}.timer-stats small{font-size:10px;color:#98b7bb}.stat-divider{height:1px;background:#ffffff1b;width:90px}.duration-area{position:relative;z-index:1;border-top:1px solid #ffffff19;padding-top:17px}.section-label-row{display:flex;justify-content:space-between;align-items:center;font-weight:700;color:#e1f1ef;font-size:12px;margin-bottom:11px}.quiet-label{font-size:10px;color:#789fa5;font-weight:400}.duration-options{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}.duration-option{border:1px solid #ffffff26;background:#ffffff08;border-radius:13px;color:white;min-width:0;padding:9px 3px;display:flex;flex-direction:column;align-items:center;gap:0;transition:.18s ease}.duration-option strong{font-size:15px;font-weight:700}.duration-option small{font-size:9px;color:#9db8bd}.duration-option.selected{background:#bff8e9;color:#093e48;border-color:#bff8e9;box-shadow:0 4px 15px #52c9b326}.duration-option.selected small{color:#3d777c}.custom-row{display:flex;align-items:center;gap:9px;margin-top:12px;font-size:11px;color:#9ebdc1}.custom-row input{width:72px;border:1px solid #ffffff2c;background:#ffffff0d;color:#f3fffc;border-radius:9px;padding:7px 8px;outline:none}.custom-row input:focus{border-color:#78dec9}.small-outline{border:1px solid #ffffff3b;color:#d5f0ec;background:transparent;border-radius:8px;padding:7px 11px;font-size:10px}.session-controls{position:relative;z-index:1;padding-top:16px}.primary-button{width:100%;display:flex;justify-content:center;align-items:center;gap:10px;border:0;border-radius:14px;background:linear-gradient(110deg,#7be2cd,#b6f1df);color:#083b43;padding:14px 18px;font-size:14px;font-weight:800;box-shadow:0 8px 22px #43c9b01e;transition:transform .15s,filter .15s}.primary-button:hover{filter:brightness(1.04);transform:translateY(-1px)}.primary-button span{font-size:11px}.primary-button small{font-size:11px;font-weight:500;opacity:.72}.tiny-note{margin:9px 0 0;text-align:center;font-size:10px;color:#85a7ac}.active-control-row{display:grid;grid-template-columns:1fr 1fr;gap:9px}.secondary-button{border:1px solid #ffffff35;background:#ffffff0c;color:white;border-radius:12px;padding:12px;font-weight:700}.danger-button{border:1px solid #f2a59855;color:#ffd6cd;background:#eb968213;border-radius:12px;padding:12px;font-weight:700}.focus-side{display:flex;flex-direction:column;gap:14px}.mini-stat-card{border:1px solid #e0eeeb;border-radius:20px;background:#fff;padding:17px 19px;box-shadow:0 6px 19px #0d445509;min-height:130px}.mini-card-icon{display:grid;place-items:center;width:31px;height:31px;background:#fff4dc;border-radius:11px;color:#c28a31;font-size:15px;float:right}.mini-stat-card>p{font-size:11px;color:#769098;margin:0 0 4px}.mini-stat-card>strong{font-size:30px;letter-spacing:-.05em}.mini-stat-card>strong span{font-size:11px;color:#82989e;margin-left:5px;font-weight:500;letter-spacing:0}.stat-track,.goal-track,.metric-track{height:5px;border-radius:99px;background:#e7f2ef;overflow:hidden}.stat-track{margin:12px 0 7px}.stat-track i,.goal-track i,.metric-track i{display:block;height:100%;width:0;background:linear-gradient(90deg,#28a5a2,#75d7b9);border-radius:99px;transition:width .4s}.mini-stat-card>small{color:#9aadb1;font-size:10px}.progress-card{min-height:135px}.mini-card-heading{display:flex;justify-content:space-between;align-items:center;font-size:11px;color:#729097;margin-bottom:12px}.target-badge{font-size:9px;padding:4px 7px;border-radius:7px;background:#edf8f5;color:#16818a}.progress-card>strong{font-size:14px}.goal-track{margin:11px 0}.progress-card>p{font-size:10px;color:#82979c;margin:0}.quote-card{flex:1;min-height:100px;border-radius:20px;padding:15px 18px;background:linear-gradient(130deg,#e4f6f0,#f1f9f4);border:1px solid #d6eee7}.quote-stars{color:#35a5a0;font-size:13px;letter-spacing:.2em}.quote-card p{font-size:12px;line-height:1.65;font-weight:650;margin:9px 0 7px;color:#285765}.quote-card small{font-size:9px;color:#89a6a6}.lower-panel{margin-top:23px;background:#ffffffc7;border:1px solid #dfede9;border-radius:22px;padding:20px 22px}.panel-heading{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:12px}.panel-heading .eyebrow{margin-bottom:4px}.panel-heading h2,.tank-care-row h2{font-size:17px;margin:0;letter-spacing:-.03em}.history-list{display:flex;flex-direction:column;gap:8px}.history-row{display:flex;align-items:center;gap:12px;padding:11px 12px;border:1px solid #e7f1ef;border-radius:13px}.history-icon{display:grid;place-items:center;width:37px;height:37px;border-radius:12px;background:#e7f7f2;color:#168b8f;font-size:17px;flex-shrink:0}.history-main{flex:1;min-width:0}.history-main strong{display:block;font-size:12px}.history-main small{color:#94a7ab;font-size:10px}.history-earn{font-weight:800;color:#b77e24;white-space:nowrap;font-size:12px}.empty-state{text-align:center;padding:28px 15px;color:#89a0a6;background:#f7fbfa;border:1px dashed #d8e9e5;border-radius:15px}.empty-state span{font-size:24px;color:#71bdb4}.empty-state p{margin:6px 0;font-size:12px}.empty-state.compact{padding:18px 10px;background:transparent}.bottom-nav{display:none}
/* Ocean */
.ocean-welcome{margin-bottom:21px}.tank-count-pill>span{display:grid;place-items:center;width:34px;height:34px;border-radius:12px;background:#e0f5ef;font-size:18px}.aquarium-card{position:relative;border:1px solid #cde5df;border-radius:25px;overflow:hidden;background:#fff;box-shadow:var(--shadow)}.aquarium-topline{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;background:#fff;position:relative;z-index:3}.aquarium-topline>div{display:flex;align-items:center;gap:8px;color:#41727a;font-size:11px;font-weight:700}.glass-button{border:1px solid #deece8;border-radius:9px;background:#f8fcfb;padding:7px 10px;color:#467e83;font-size:10px}.aquarium-scene{height:285px;position:relative;overflow:hidden;background:linear-gradient(180deg,#68c9cf 0%,#22899f 27%,#0a637a 66%,#084353 100%);isolation:isolate}.aquarium-scene:before{content:"";position:absolute;inset:0;background:linear-gradient(110deg,#ffffff18 0%,transparent 30%,#022e4c18 100%);z-index:0}.water-surface{position:absolute;top:0;left:-5%;width:110%;height:17px;opacity:.65;background:repeating-linear-gradient(175deg,#c5ffed77 0 26px,#ffffff00 26px 58px);animation:waterSlide 12s linear infinite;z-index:2}@keyframes waterSlide{from{transform:translateX(-20px)}to{transform:translateX(50px)}}.sunbeam{position:absolute;top:-80px;left:18%;width:95px;height:280px;transform:rotate(23deg);background:linear-gradient(180deg,#effff85e,transparent);filter:blur(12px);opacity:.7}.beam-two{left:45%;width:130px;transform:rotate(-13deg);opacity:.35}.water-shimmer{position:absolute;inset:0;background:radial-gradient(ellipse at 30% 16%,#e5ffff44,transparent 36%),radial-gradient(ellipse at 78% 45%,#e8ffff22,transparent 35%);z-index:0}.aquarium-fish-layer{position:absolute;inset:0;z-index:3}.aquarium-fish{position:absolute;display:flex;align-items:center;justify-content:center;width:74px;height:66px;font-size:43px;filter:drop-shadow(0 4px 6px #062d4255);animation:fishDrift 7s ease-in-out infinite alternate}.aquarium-fish:nth-child(2n){animation-duration:9s;animation-direction:alternate-reverse}.aquarium-fish:nth-child(3n){animation-duration:11s}.aquarium-fish.dead{filter:grayscale(1);opacity:.5;animation:none}.fish-label{position:absolute;left:50%;transform:translateX(-50%);bottom:-1px;padding:2px 7px;background:#063c4cad;border:1px solid #ffffff30;border-radius:99px;color:#e9fffa;font-size:8px;white-space:nowrap;max-width:85px;overflow:hidden;text-overflow:ellipsis}.fish-health-mini{position:absolute;bottom:-7px;left:10%;right:10%;height:3px;background:#062c3c55;border-radius:8px;overflow:hidden}.fish-health-mini i{display:block;height:100%;background:#91f2b9}.fish-health-mini i.low{background:#ffd18b}@keyframes fishDrift{0%{transform:translate(0,0) rotate(-3deg)}100%{transform:translate(10px,-8px) rotate(3deg)}}.tank-plants{position:absolute;bottom:25px;left:5%;right:5%;display:flex;align-items:flex-end;gap:9px;z-index:2;color:#63d2ad;font-size:30px;filter:drop-shadow(0 3px 5px #05344066)}.tank-bottom{position:absolute;height:38px;bottom:0;left:0;right:0;background:linear-gradient(180deg,#dfd4a228,#887f4a66);border-top:2px solid #e7dfb94c;z-index:1;clip-path:polygon(0 28%,8% 5%,18% 42%,31% 16%,46% 40%,60% 12%,78% 35%,91% 9%,100% 30%,100% 100%,0 100%)}.tank-overlay-label{position:absolute;right:18px;bottom:49px;z-index:4;display:flex;flex-direction:column;align-items:flex-end;color:#e5ffff;text-shadow:0 2px 10px #03425477}.tank-overlay-label span{font-size:8px;letter-spacing:.22em;opacity:.8}.tank-overlay-label strong{font-size:13px;font-weight:600}.tank-bubbles{position:absolute;z-index:1;inset:0;pointer-events:none}.tank-bubbles i{position:absolute;bottom:-18px;left:14%;height:7px;width:7px;border:1px solid #d2fff8ad;border-radius:50%;animation:bubble 7s linear infinite}.tank-bubbles i:nth-child(2){left:35%;width:4px;height:4px;animation-delay:2s;animation-duration:9s}.tank-bubbles i:nth-child(3){left:62%;width:9px;height:9px;animation-delay:1s;animation-duration:8s}.tank-bubbles i:nth-child(4){left:80%;width:5px;height:5px;animation-delay:4s}.tank-bubbles i:nth-child(5){left:50%;width:3px;height:3px;animation-delay:3s;animation-duration:11s}.tank-bubbles i:nth-child(6){left:91%;width:4px;height:4px;animation-delay:1s;animation-duration:10s}.tank-bubbles i:nth-child(7){left:24%;width:6px;height:6px;animation-delay:5s;animation-duration:12s}@keyframes bubble{0%{transform:translateY(0);opacity:0}15%{opacity:.8}85%{opacity:.45}100%{transform:translateY(-330px);opacity:0}}.aquarium-summary{display:grid;grid-template-columns:1fr 1fr 1fr .6fr;gap:17px;align-items:center;padding:17px 20px}.metric-top{display:flex;justify-content:space-between;gap:5px;font-size:10px;color:#759096;margin-bottom:8px}.metric-top strong{color:#285e67;font-size:11px}.metric-track{height:5px}.ecosystem-score{display:flex;align-items:center;gap:7px;padding-left:13px;border-left:1px solid #e0eeeb}.ecosystem-score>span{width:30px;height:30px;border-radius:10px;background:#fff3d5;color:#bf8c35;display:grid;place-items:center}.ecosystem-score small{font-size:9px;color:#869ea2;display:block}.ecosystem-score strong{display:block;font-size:15px;color:#285965}.environment-alert{background:#fff4db;border-top:1px solid #f3e1b6;color:#8c6626;padding:10px 17px;font-size:11px}.environment-alert.danger{background:#fff0ed;color:#a45143;border-color:#f1c9c1}.tank-care-row{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:22px 1px}.tank-care-row .eyebrow{margin-bottom:4px}.care-actions{display:flex;gap:8px}.care-button{min-width:90px;display:flex;flex-direction:column;align-items:center;border:1px solid #dcebe7;border-radius:15px;padding:10px 13px;background:#ffffffc9;color:var(--ink);transition:.18s}.care-button:hover{transform:translateY(-2px);border-color:#a4d9cf}.care-button>span{font-size:20px;margin-bottom:4px}.care-button strong{font-size:11px}.care-button small{font-size:9px;color:#8ba0a4;margin-top:2px}.ocean-workspace{background:#ffffffd9;border:1px solid #deede9;border-radius:22px;padding:16px 17px 19px;box-shadow:0 8px 30px #0d445505}.ocean-tabs{display:flex;gap:7px;overflow:auto;padding:0 0 14px;border-bottom:1px solid #e7f0ee;scrollbar-width:none}.ocean-tabs::-webkit-scrollbar{display:none}.ocean-tab{display:flex;align-items:center;gap:5px;white-space:nowrap;border:1px solid transparent;border-radius:10px;padding:9px 12px;background:transparent;color:#779198;font-size:11px;font-weight:700}.ocean-tab span{background:#edf5f2;border-radius:6px;padding:2px 5px;font-size:9px}.ocean-tab.selected{background:#e3f6f0;border-color:#c7e9df;color:#067b83}.ocean-view-content{padding-top:17px}.subview-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;margin-bottom:15px}.subview-heading h3{margin:0 0 4px;font-size:16px;letter-spacing:-.03em}.subview-heading p{margin:0;color:#849ba0;font-size:11px;line-height:1.6}.view-count{font-size:10px;color:#488089;white-space:nowrap;background:#eff8f6;border-radius:8px;padding:6px 8px}.tank-inventory-grid,.shop-grid,.atlas-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.creature-card,.shop-card,.atlas-card{min-width:0;border:1px solid #e3efec;background:#fff;border-radius:15px;overflow:hidden;position:relative;transition:border-color .18s,transform .18s}.creature-card:hover,.shop-card:hover,.atlas-card:hover{transform:translateY(-2px);border-color:#b7dfd5}.creature-visual{height:84px;display:grid;place-items:center;background:radial-gradient(ellipse at 40% 30%,#dbf9f0,#edf8f7 63%,#e8f3f1);font-size:36px;position:relative}.creature-visual .health-badge{position:absolute;right:6px;top:6px;font-size:8px;color:#287e72;border:1px solid #c6eade;background:#f3fffb;border-radius:6px;padding:3px 5px}.creature-copy,.shop-copy,.atlas-copy{padding:10px 10px 11px}.creature-copy strong,.shop-copy strong,.atlas-copy strong{font-size:11px;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.creature-copy small,.shop-copy small,.atlas-copy small{display:block;font-size:9px;color:#93a5a8;margin-top:4px}.mini-action{margin-top:8px;border:1px solid #d9ebe5;background:#f8fcfa;color:#387b7e;border-radius:8px;padding:6px 8px;font-size:9px;width:100%}.mini-action.primary{background:#e3f7ef;border-color:#c5e8db;color:#087a82;font-weight:700}.mini-action.warning{background:#fff3de;border-color:#f0e0b9;color:#8b6b2b}.shop-toolbar{display:flex;flex-wrap:wrap;gap:9px;align-items:center;margin-bottom:14px}.shop-search{flex:1;min-width:150px;position:relative}.shop-search input{width:100%;border:1px solid #dfece9;background:#fbfdfc;border-radius:10px;padding:10px 12px 10px 33px;outline:none;font-size:11px;color:var(--ink)}.shop-search span{position:absolute;left:11px;top:8px;color:#8aa1a5;font-size:15px}.shop-toolbar select{max-width:145px;border:1px solid #dfece9;background:#fbfdfc;border-radius:10px;padding:9px 10px;font-size:10px;color:#5e7d84}.shop-card{display:flex;flex-direction:column}.shop-card .creature-visual{height:95px}.rarity-chip{position:absolute;top:7px;left:7px;padding:3px 6px;border-radius:6px;background:#ffffffdf;color:#55777e;font-size:8px;font-weight:700}.rarity-常见{color:#4b8279}.rarity-少见{color:#397e9a}.rarity-稀有{color:#7866aa}.rarity-珍稀{color:#b47b2b}.rarity-史诗{color:#bb6b45}.rarity-传奇{color:#ae4d66}.price-line{display:flex;align-items:center;justify-content:space-between;gap:3px;margin-top:9px}.price-tag{font-size:11px;font-weight:800;color:#a77523;white-space:nowrap}.price-tag span{font-size:9px;font-weight:500;color:#be985b}.shop-buy{border:0;background:#0c7883;color:white;border-radius:8px;padding:7px 8px;font-size:9px;font-weight:800;white-space:nowrap}.shop-buy:disabled{background:#edf3f1;color:#91a4a6;opacity:1}.shop-pagination{display:flex;justify-content:center;align-items:center;gap:14px;margin-top:17px;color:#80979b;font-size:10px}.page-button{border:1px solid #dfebe8;background:#fff;color:#3c7d80;border-radius:8px;padding:7px 12px;font-size:10px}.supply-card{display:flex;gap:12px;align-items:center;border:1px solid #e4efec;background:#fff;border-radius:13px;padding:12px;margin-bottom:9px}.supply-icon{width:48px;height:48px;flex-shrink:0;display:grid;place-items:center;border-radius:14px;background:#e8f7f2;font-size:24px}.supply-description{flex:1;min-width:0}.supply-description strong{font-size:12px;display:block}.supply-description p{margin:4px 0;color:#83999d;font-size:10px;line-height:1.6}.stock-text{font-size:9px;color:#8ba1a4}.supply-side{display:flex;flex-direction:column;align-items:flex-end;gap:6px}.atlas-card .creature-visual{height:78px}.atlas-card.locked .creature-visual{filter:grayscale(1);opacity:.42}.atlas-card.locked .creature-visual:after{content:"?";position:absolute;font-weight:800;font-size:24px;color:#6e9599;background:#edf8f5ba;border-radius:100%;width:37px;height:37px;display:grid;place-items:center}.atlas-progress{height:5px;background:#e4f1ed;border-radius:99px;overflow:hidden;margin:4px 0 12px}.atlas-progress i{height:100%;display:block;background:#54c5a9}.eco-empty-note{background:#f4faf8;border:1px dashed #d5e9e3;border-radius:12px;padding:13px;font-size:11px;color:#80999d;margin-bottom:13px}.install-hint{position:fixed;z-index:70;bottom:calc(90px + var(--safe-bottom));left:16px;right:16px;max-width:500px;margin:0 auto;padding:15px;background:#073341;color:white;border-radius:18px;box-shadow:0 15px 40px #031d2c55;display:flex;align-items:center;gap:14px}.install-hint[hidden]{display:none}.install-hint strong{font-size:12px}.install-hint p{font-size:10px;color:#c2dadd;margin:5px 0 0}.install-hint button{border:1px solid #ffffff4a;border-radius:10px;background:transparent;color:white;padding:8px 10px;font-size:10px;white-space:nowrap}.toast{position:fixed;z-index:100;bottom:calc(95px + var(--safe-bottom));left:50%;transform:translate(-50%,12px);opacity:0;pointer-events:none;max-width:calc(100vw - 36px);padding:12px 16px;border-radius:13px;background:#073341;color:#eefffb;box-shadow:0 12px 28px #062b3a38;font-size:12px;transition:opacity .2s,transform .2s;text-align:center}.toast.show{opacity:1;transform:translate(-50%,0)}.modal-backdrop{position:fixed;inset:0;background:#0527338f;backdrop-filter:blur(6px);z-index:90;display:grid;place-items:center;padding:18px}.modal-backdrop[hidden]{display:none}.app-modal{width:min(520px,100%);max-height:min(84vh,800px);overflow:auto;background:#fbfdfc;border-radius:24px;padding:22px;box-shadow:0 25px 70px #03242c55;animation:modalIn .2s ease}@keyframes modalIn{from{opacity:0;transform:translateY(10px) scale(.99)}to{opacity:1;transform:none}}.modal-top{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;border-bottom:1px solid #e4efec;padding-bottom:15px}.modal-top .eyebrow{margin-bottom:4px}.modal-top h2{font-size:19px;margin:0}.close-button{width:32px;height:32px;flex-shrink:0;border:1px solid #e0ece8;border-radius:10px;background:#fff;color:#62878c;font-size:22px;line-height:1}.modal-body{padding:15px 0;color:#45646b;font-size:12px;line-height:1.7}.modal-footer{display:flex;justify-content:flex-end;gap:8px;border-top:1px solid #e4efec;padding-top:14px}.modal-footer:empty{display:none}.modal-copy{font-size:12px;color:#6d888e;line-height:1.8}.modal-item-hero{display:flex;align-items:center;gap:14px;background:#edf8f5;border-radius:15px;padding:13px;margin-bottom:14px}.modal-item-emoji{width:62px;height:62px;display:grid;place-items:center;border-radius:15px;background:#d9f2eb;font-size:34px;flex-shrink:0}.modal-item-hero strong{display:block;font-size:16px;color:var(--ink)}.modal-item-hero small{display:block;color:#789499;margin-top:4px}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:13px 0}.detail-cell{border:1px solid #e0ece8;background:#fff;border-radius:12px;padding:10px}.detail-cell small{font-size:9px;color:#93a8ac;display:block}.detail-cell strong{font-size:11px;color:#426b73;display:block;margin-top:3px}.modal-primary{border:0;background:#0b7b84;color:#fff;border-radius:11px;padding:11px 15px;font-weight:800;font-size:11px}.modal-secondary{border:1px solid #dcebe7;background:#fff;color:#5a7b80;border-radius:11px;padding:11px 15px;font-size:11px}.summary-number{font-size:30px;font-weight:800;color:#0b7a82;letter-spacing:-.04em}.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.setting-action{border:1px solid #deebe7;border-radius:12px;background:#fff;padding:12px;text-align:left;color:#3b656d}.setting-action strong{display:block;font-size:11px}.setting-action small{display:block;color:#8aa0a3;font-size:9px;margin-top:4px}.form-row{display:flex;flex-direction:column;gap:6px;margin-bottom:12px}.form-row label{font-size:11px;font-weight:700;color:#4d7379}.form-row input,.form-row select{border:1px solid #dcebe7;border-radius:10px;background:#fff;padding:11px;color:var(--ink)}.pill-note{display:inline-block;background:#e9f7f2;border-radius:8px;padding:5px 8px;color:#267b7c;font-size:10px}.warning-note{background:#fff4e0;color:#8f6a27;border-radius:10px;padding:10px;font-size:10px}.species-detail-text{white-space:normal}.modal-results-list{display:flex;flex-direction:column;gap:7px}.modal-result-row{display:flex;align-items:center;gap:10px;background:white;border:1px solid #e1ede9;border-radius:10px;padding:9px}.modal-result-row span{font-size:20px}.modal-result-row div{flex:1}.modal-result-row strong{display:block;font-size:11px}.modal-result-row small{font-size:9px;color:#8aa0a4}.primary-button:disabled{opacity:.5;transform:none;filter:none}
@media(max-width:920px){.app-shell{padding:20px 22px 108px}.focus-layout{grid-template-columns:minmax(0,1.25fr) minmax(230px,.75fr);gap:13px}.focus-card{padding:20px}.timer-zone{gap:20px}.timer-stats{min-width:102px}.timer-ring{width:min(218px,43vw)}.tank-inventory-grid,.shop-grid,.atlas-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.aquarium-summary{gap:12px}.care-button{min-width:77px;padding:9px 8px}}
@media(max-width:680px){body{font-size:13px}.app-shell{padding:12px 14px calc(96px + var(--safe-bottom))}.topbar{height:54px;margin-bottom:18px}.brand-mark{height:37px;width:37px;border-radius:13px}.brand-name{font-size:16px}.brand-name span{display:none}.brand-subtitle{font-size:10px}.wallet-chip{padding:7px 9px;gap:5px}.wallet-chip>span:not(.shell-icon):not(.wallet-plus){display:none}.wallet-plus{font-size:16px}.welcome-row{gap:9px;margin-bottom:17px}.welcome-row h1{font-size:25px}.muted-text{font-size:11px}.streak-pill,.tank-count-pill{padding:8px 9px;gap:7px;border-radius:14px}.streak-pill>span,.tank-count-pill>span{width:28px;height:28px;font-size:15px}.streak-pill strong,.tank-count-pill strong{font-size:12px}.streak-pill small,.tank-count-pill small{font-size:9px}.focus-layout{display:flex;flex-direction:column;gap:12px}.focus-card{padding:17px 14px 15px;border-radius:22px}.focus-card-top{font-size:10px}.timer-zone{padding:21px 0 17px;gap:10px;justify-content:space-evenly}.timer-ring{width:min(51vw,195px)}.timer-value{font-size:38px}.timer-kicker{font-size:10px}.timer-sub{font-size:9px;max-width:120px}.timer-stats{min-width:88px;gap:11px}.timer-stats span{font-size:18px}.timer-stats small{font-size:9px}.stat-divider{width:72px}.duration-area{padding-top:13px}.section-label-row{font-size:11px}.quiet-label{font-size:9px}.duration-options{gap:5px}.duration-option{padding:8px 1px;border-radius:10px}.duration-option strong{font-size:14px}.duration-option small{font-size:8px}.custom-row{gap:7px;font-size:10px}.custom-row input{width:67px;padding:6px}.primary-button{padding:13px 10px;font-size:13px}.tiny-note{font-size:9px;line-height:1.5}.focus-side{display:grid;grid-template-columns:1fr 1fr;gap:10px}.mini-stat-card{padding:13px 13px;min-height:125px;border-radius:17px}.mini-card-icon{width:27px;height:27px;border-radius:9px;font-size:13px}.mini-stat-card>p{font-size:10px}.mini-stat-card>strong{font-size:25px}.mini-stat-card>small{font-size:9px}.progress-card>strong{font-size:12px}.mini-card-heading{font-size:10px;margin-bottom:10px}.quote-card{grid-column:1/-1;min-height:unset;padding:12px 15px;border-radius:17px}.quote-card p{font-size:11px;margin:5px 0}.quote-card small{font-size:9px}.lower-panel{padding:15px 13px;margin-top:15px;border-radius:18px}.panel-heading h2{font-size:15px}.history-row{padding:9px}.history-icon{width:33px;height:33px}.history-main strong{font-size:11px}.history-earn{font-size:11px}.bottom-nav{position:fixed;bottom:0;left:0;right:0;z-index:50;display:grid;grid-template-columns:1fr 1fr;padding:7px 18px calc(7px + var(--safe-bottom));background:#fbfdfcf2;border-top:1px solid #dcece7;backdrop-filter:blur(18px)}.nav-item{border:0;background:transparent;color:#8ba0a3;display:flex;flex-direction:column;align-items:center;gap:0;position:relative;padding:4px 0}.nav-icon{font-size:22px;line-height:1.2}.nav-item strong{font-size:10px;margin-top:3px}.nav-item small{font-size:8px;letter-spacing:.1em}.nav-item.active{color:#087e86}.nav-item.active .nav-icon{filter:drop-shadow(0 3px 3px #18a69e33)}.nav-dot{position:absolute;top:2px;left:calc(50% + 21px);width:6px;height:6px;border-radius:50%;background:#ec947c}.aquarium-scene{height:230px}.aquarium-topline{padding:12px 13px}.aquarium-summary{grid-template-columns:1fr 1fr;gap:12px;padding:13px}.ecosystem-score{padding-left:0;border-left:0}.tank-care-row{display:block;padding:18px 1px}.tank-care-row>div:first-child{margin-bottom:13px}.tank-care-row h2{font-size:15px}.care-actions{display:grid;grid-template-columns:repeat(3,1fr)}.care-button{min-width:0;border-radius:13px;padding:9px 4px}.care-button>span{font-size:19px}.care-button strong{font-size:10px}.care-button small{font-size:8px}.ocean-workspace{padding:12px 11px 15px;border-radius:18px}.ocean-tabs{margin-right:-5px;gap:4px;padding-bottom:11px}.ocean-tab{font-size:10px;padding:8px 9px}.subview-heading h3{font-size:14px}.subview-heading p{font-size:10px}.tank-inventory-grid,.shop-grid,.atlas-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.creature-visual{height:80px;font-size:34px}.shop-card .creature-visual{height:86px}.creature-copy,.shop-copy,.atlas-copy{padding:9px}.creature-copy strong,.shop-copy strong,.atlas-copy strong{font-size:10px}.shop-toolbar select{flex:1;max-width:none}.shop-search{min-width:100%}.shop-copy .price-line{gap:4px}.price-tag{font-size:10px}.shop-buy{font-size:9px;padding:7px}.supply-card{padding:9px;gap:9px}.supply-icon{width:41px;height:41px;font-size:21px}.supply-description strong{font-size:11px}.supply-description p{font-size:9px}.supply-side .price-tag{font-size:10px}.install-hint{bottom:calc(80px + var(--safe-bottom));left:10px;right:10px;padding:12px}.install-hint strong{font-size:11px}.install-hint p{font-size:9px}.toast{bottom:calc(82px + var(--safe-bottom));font-size:11px}.app-modal{padding:17px;border-radius:21px;max-height:86vh}.modal-top h2{font-size:17px}.modal-item-hero{padding:10px}.modal-item-emoji{width:52px;height:52px;font-size:29px}.settings-grid{gap:7px}.setting-action{padding:10px}.tank-overlay-label strong{font-size:11px}}
@media(max-width:360px){.app-shell{padding-left:10px;padding-right:10px}.timer-zone{gap:5px}.timer-ring{width:48vw}.timer-stats{min-width:80px}.timer-stats span{font-size:16px}.timer-value{font-size:34px}.duration-option strong{font-size:12px}.duration-option small{font-size:7px}.brand-name{font-size:15px}.welcome-row h1{font-size:22px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
.shell-symbol{display:inline-block;color:#d0a047}.chart-seven-days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:9px;align-items:end;height:150px;padding:10px 3px 0;margin:6px 0 14px;border-bottom:1px solid #e2eeea}.bar-col{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;gap:5px;min-width:0}.bar-col>strong{font-size:9px;color:#8aa1a2;min-height:12px}.bar-track{height:105px;width:100%;max-width:30px;background:#edf6f3;border-radius:7px 7px 3px 3px;display:flex;align-items:flex-end;overflow:hidden}.bar-track i{display:block;width:100%;height:0;background:linear-gradient(180deg,#81ddc8,#0b8088);border-radius:7px 7px 0 0}.bar-col small{font-size:9px;color:#92a6a8;margin-bottom:-20px}.danger-button{border:1px solid #f0c9bd;background:#fff2ed;color:#a75343;border-radius:11px;padding:11px 15px;font-size:11px;font-weight:800}.modal-open{overflow:hidden}
.desktop-nav{display:flex;align-items:center;gap:5px;margin-left:auto;margin-right:20px}.desktop-nav-item{display:flex;align-items:center;gap:8px;border:1px solid transparent;background:transparent;color:#709097;border-radius:11px;padding:10px 13px;font-size:11px;font-weight:700;white-space:nowrap}.desktop-nav-item span{font-size:17px}.desktop-nav-item.active{background:#e1f4ef;border-color:#cae9df;color:#087e85}.desktop-nav-item:hover{background:#eff8f5}@media(max-width:680px){.desktop-nav{display:none}}
.topbar-actions{display:flex;align-items:center;gap:8px}.settings-button{width:38px;height:38px;display:grid;place-items:center;border:1px solid #d9e9e5;border-radius:13px;background:#fff;color:#557e84;font-size:18px;box-shadow:0 3px 12px #0c4b5510}.settings-button:hover{background:#edf8f5;color:#087e86}.modal-footer .danger-button{font-size:11px}.creature-copy .mini-action+.mini-action{margin-top:5px}
