.hatch-notice{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 15px;background:#24383c;border-bottom:1px solid #736c4c;color:#e2ce9d;font-size:11px;flex-shrink:0}.hatch-notice .text-link{color:#e2ce9d;white-space:nowrap}
#shop{overflow-y:auto;scrollbar-width:thin}#shop .page-heading .muted{font-size:8px;letter-spacing:1px}.mystery-intro{position:relative;padding:25px 18px 26px;margin:0 15px;border:1px solid #385761;background:radial-gradient(ellipse at 94% 60%,#35616866,transparent 64%),#112e3b;flex-shrink:0;overflow:hidden}.mystery-eyebrow{font-size:8px;letter-spacing:1.8px;color:#b8c6aa}.mystery-intro h2{font-size:27px;line-height:1.16;font-weight:400;letter-spacing:-.6px;color:#e3e9d6;margin:13px 0}.mystery-intro p{color:#8faeb5;font-size:11px;line-height:1.8}.mystery-intro canvas{position:absolute;right:12px;top:49px;width:96px;height:116px;filter:drop-shadow(0 7px 6px #0003)}#shop-list{flex:none;overflow:visible;padding-bottom:0}.mystery-shop-card{padding:15px 3px;border-bottom:1px solid #3c5758}.mystery-shop-card strong{color:#dce8d7}.pool-caption{display:flex;align-items:center;justify-content:center;gap:8px;padding:12px 15px;color:#90acb4;font-size:10px;flex-shrink:0}.color-collection{margin:23px 15px 18px;padding-top:16px;border-top:1px solid #294650;flex-shrink:0}.collection-heading{display:flex;justify-content:space-between;gap:8px;color:#93b2b5;font-size:9px}.collection-heading>span:first-child{font-size:8px;letter-spacing:1px}.color-collection>p{font-size:9px;color:#7796a0;line-height:1.7;text-align:center;margin-top:14px}#color-notes{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px;margin-top:16px}#color-notes figure{position:relative;margin:0;padding:6px 1px 7px;text-align:center;border:1px solid #29444e;background:#102a36}#color-notes canvas{width:100%;height:39px;object-fit:contain}#color-notes figcaption{font-size:9px;color:#a8bfc3;margin-top:4px}#color-notes figure[data-found=false] canvas{opacity:.45}#color-notes figure[data-found=true]{border-color:#5a7e77;background:#17353c}.discovery-mark{display:block;font-size:8px;color:#73918f;margin-top:8px}#color-notes [data-found=true] .discovery-mark{color:#cddaba}#detail-pool{border-bottom:1px solid var(--line);padding-left:0;padding-right:0}
.hatch-page{padding:25px 15px 20px;overflow-y:auto;scrollbar-width:thin}.hatch-heading{text-align:center;flex-shrink:0}.hatch-heading h1{font-size:27px;font-weight:400;letter-spacing:-.5px;margin:15px 0 9px;color:#e6ecdf}.hatch-heading p{font-size:11px;line-height:1.7;color:#99b7be;max-width:250px;margin:auto}.hatch-results{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:23px 0 16px;flex-shrink:0}.hatch-results:has(>:only-child){grid-template-columns:minmax(0,1fr);max-width:260px;width:100%;margin-left:auto;margin-right:auto}.hatch-card{position:relative;overflow:hidden;border:1px solid #45676b;background:radial-gradient(ellipse at 50% 32%,#38667266,transparent 70%),#14323d;padding:13px 8px 17px;text-align:center;animation:hatch-arrive .6s ease-out both}.hatch-card canvas{display:block;width:100%;height:96px;object-fit:contain;animation:fish-arrive .8s ease-out both}.hatch-card h2{font-size:19px;font-weight:400;color:var(--fish-accent);margin-top:5px}.hatch-card p{font-size:10px;color:#94b3b9;margin-top:7px}.hatch-badge{font-size:7px;letter-spacing:1.2px;color:#c9d6b9}.hatch-footnote{text-align:center;font-size:10px;line-height:1.8;color:#86a7b0;margin:0 0 20px}.hatch-page>.primary{flex-shrink:0;min-height:39px;margin-top:auto}
@keyframes hatch-arrive{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}@keyframes fish-arrive{from{opacity:0;transform:translateY(8px) scale(.85)}to{opacity:1;transform:none}}
@media(max-width:320px){.mystery-intro{padding:20px 13px}.mystery-intro h2{font-size:24px}.mystery-intro canvas{width:72px;height:96px;right:2px;top:53px}#shop .page-heading .muted{font-size:7px;letter-spacing:.5px}.color-collection{margin-top:15px}#color-notes{gap:3px}#color-notes canvas{height:30px}.hatch-card{padding:11px 5px}.hatch-card canvas{height:75px}.hatch-heading h1{font-size:24px}}
@media(prefers-reduced-motion:reduce){.hatch-card,.hatch-card canvas{animation:none}}
/* Return summaries belong to the aquarium; do not crowd purchases or reveals. */
#app:has(#tanks[hidden]) #offline-note{display:none}

/* Field guide: bounded cards, independent of the shop and aquarium. */
.mystery-intro h2{font-size:25px;max-width:240px;position:relative;z-index:1}
.mystery-intro canvas{right:3px;top:59px;width:78px;height:96px;opacity:.9}
.collection-entry{display:flex;align-items:center;gap:12px;text-align:left;margin:17px 15px 0;padding:15px 13px;background:#15333c;border:1px solid #4b706e;color:#d4e4d9;flex-shrink:0}
.collection-entry>span:nth-child(2){flex:1}.collection-entry strong{font-size:13px;font-weight:500;display:block}.collection-entry small{display:block;font-size:10px;color:#98b7b8;margin-top:6px}.collection-entry-icon{font-size:27px;color:#b4cab4}.shop-egg-note{font-size:10px;color:#80a1aa;line-height:1.7;padding:13px 18px 20px}
.egg-shop-waters{margin:16px 15px 0;padding:12px;border:1px solid #365861;background:#14303b;flex-shrink:0}.egg-shop-waters>label{display:block;font-size:9px;color:#a9c5bd;letter-spacing:.5px;margin-bottom:8px}.egg-shop-waters select{width:100%;max-width:100%;min-height:36px;background:#0f2632;border:1px solid #527772;color:#d8e4d5;padding:7px 9px;font:inherit;font-size:12px}.egg-shop-waters p{font-size:9px;line-height:1.65;margin:7px 0 0}.egg-shop-collection{color:#91aeb4}.egg-shop-chances{color:#c6d4ae}.egg-shop-route{padding-top:8px;border-top:1px solid #36535a;color:#bad0c0}.egg-shop-waters select:focus-visible{outline:2px solid #b6d3be;outline-offset:3px}.egg-detail-summary{font-size:9px;line-height:1.7;text-align:center;color:#a6c3b7;margin:8px 0 12px;overflow-wrap:anywhere}.egg-detail-summary[data-available=false]{color:#e0bd9c;text-align:left}#detail-pool[hidden]+.egg-detail-summary{display:none}.mystery-shop-card>span:nth-child(2){min-width:0}.mystery-shop-card strong{overflow-wrap:anywhere}
.collection-page{padding:12px 15px 20px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#365560 transparent}
.collection-page>.back{flex-shrink:0;margin-bottom:15px}#guide-browse{flex-shrink:0}.guide-heading h1{font-size:25px;font-weight:400;letter-spacing:-.4px;margin:9px 0}.guide-heading p{font-size:11px;color:#a3bcbd}.guide-meter{height:3px;background:#203f48;margin:15px 0 20px}.guide-meter span{display:block;height:100%;background:#a8cbb6}
.guide-filters{display:flex;gap:6px;margin-bottom:10px}.guide-filters button{padding:7px 10px;background:#102c38;color:#90acb4;border:1px solid #2f505b;font-size:10px}.guide-filters button[aria-pressed=true]{background:#24494b;color:#d3e6d7;border-color:#648d7f}
#guide-search{width:100%;padding:9px 10px;background:#0d2733;border:1px solid #31505d;border-radius:3px;font-size:11px;margin-bottom:13px}
.guide-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.guide-card{min-width:0;text-align:center;padding:7px 3px 10px;background:#102d38;border:1px solid #31525d;border-radius:2px}.guide-card canvas{width:100%;height:61px;object-fit:contain;display:block}.guide-card strong{font-size:10px;font-weight:400;line-height:1.35;min-height:27px;display:flex;align-items:center;justify-content:center;color:#b9ced0}.guide-card small{font-size:6px;letter-spacing:.7px;color:#82a5aa;display:block;margin-top:7px}.guide-card[data-found=false] canvas{opacity:.4;filter:saturate(.25)}.guide-card[data-found=true]{border-color:#598178;background:#17363d}.guide-card[data-secret=true]{border-color:#716347;background:#292f32}.guide-card[data-secret=true] small{color:#d5bf8d}.guide-card[data-secret=true][data-found=false] canvas{opacity:.6;filter:none}
.guide-pager{display:flex;align-items:center;justify-content:space-between;gap:7px;margin:17px 0 0}.guide-pager span{font-size:10px;color:#88a9b1}.guide-pager button{font-size:10px;min-height:31px;padding:6px 9px}
.guide-detail{padding:25px 8px;text-align:center;flex-shrink:0}.guide-detail canvas{display:block;width:100%;height:215px;object-fit:contain;margin:16px auto 10px;background:radial-gradient(ellipse,#24475166,transparent 70%)}.guide-detail h2{font-size:23px;font-weight:400;color:#dfebdd}.guide-detail p{font-size:12px;line-height:1.8;color:#9fb9bd;margin:15px auto;max-width:275px}.guide-detail #guide-detail-stock{font-size:11px;padding:17px 0;border-block:1px solid #2b4852;color:#b2ccc8;margin:23px 0 17px}.guide-detail small{font-size:10px;color:#adbbac}.guide-detail #guide-legacy-colors{font-size:10px;color:#849fa8}
.hatch-card[data-secret=true]{border-color:#a89160;background:radial-gradient(ellipse at 50% 32%,#725b3a55,transparent 75%),#1c323b}.hatch-card[data-secret=true] .hatch-badge{color:#f0d69b}
@media(max-width:320px){.collection-page{padding-inline:11px}.guide-grid{gap:5px}.guide-card canvas{height:51px}.guide-card strong{font-size:9px}.guide-card small{letter-spacing:.25px;font-size:6px}.mystery-intro h2{font-size:21px}.mystery-intro canvas{width:61px;right:-1px;top:66px}.hatch-card h2{font-size:13px}}
.hatch-card{padding:10px 8px 12px}.hatch-card canvas{height:70px}.hatch-card h2{font-size:17px;margin-top:2px}.hatch-card p{margin-top:5px}.hatch-results{margin-top:18px;gap:9px}.hatch-heading h1{margin-top:11px}.hatch-page{padding-top:22px}.hatch-results:has(>:only-child) .hatch-card{padding:22px 12px}.hatch-results:has(>:only-child) canvas{height:115px}
.selected-egg-shop{margin:0 15px 15px;padding:13px;border:1px solid #49695f;background:#163139;flex-shrink:0;min-width:0}.selected-egg-shop>strong{font-size:13px;font-weight:400;color:#dce6cf}.selected-egg-shop>p{font-size:10px;line-height:1.7;color:#a3bdb6;margin:8px 0}.selected-egg-shop>label{display:block;font-size:9px;margin:10px 0 6px;color:#b4c9bd}.selected-egg-shop select{width:100%;max-width:100%;min-height:36px;font:inherit;font-size:11px;background:#102a33;color:#dce6d7;border:1px solid #527772;padding:7px}.selected-egg-shop>.secondary{width:100%;margin-top:9px;min-height:36px;font-size:11px}.selected-egg-shop select:focus-visible{outline:2px solid #bbd4bb;outline-offset:2px}
.selected-egg-dialog{box-sizing:border-box;width:calc(100% - 28px);max-width:350px;max-height:calc(100dvh - 24px);padding:16px;background:#112e38;color:#d8e6d4;border:1px solid #64897c;border-radius:3px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#46685e transparent}.selected-egg-dialog::backdrop{background:#06171fbb}.selected-egg-dialog #selected-egg-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.selected-egg-dialog h2{font-size:19px;font-weight:400;margin:0;line-height:1.35}.selected-egg-dialog #selected-egg-close{width:28px;min-width:28px;height:28px;padding:0;background:none;color:#adcdc5;font-size:20px}.selected-egg-dialog canvas{display:block;width:100px;height:68px;image-rendering:pixelated;margin:13px auto 9px}.selected-egg-dialog #selected-egg-name{display:block;font-size:17px;font-weight:400;text-align:center}.selected-egg-dialog p{font-size:11px;line-height:1.7;margin:11px 0;color:#adc4bc;overflow-wrap:anywhere}.selected-egg-dialog #selected-egg-price{color:#dfd4ad}.selected-egg-dialog #selected-egg-status{color:#e1c3a0}.selected-egg-dialog>.primary{display:block;width:100%;min-height:38px;font-size:12px;margin-top:12px}.selected-egg-dialog>.text-link{font-size:11px;min-height:31px}.selected-egg-dialog #selected-egg-cancel{display:block;margin:7px auto 0}
