/* Sea-glass harbor: pixel illustration, readable paper UI. */
:root{color-scheme:light;--ink:#293f50;--paper:#fff3d6;--gold:#edc475;--teal:#438d91;--muted:#657a7c;--coral:#cc7d79}
html,body{background:#1d3b48}body{font-family:Arial,Helvetica,sans-serif;font-size:14px;color:var(--ink)}
button{font-family:PixelTitle,monospace;font-size:16px;min-height:44px}button:focus-visible{outline:3px solid #c05e67;outline-offset:3px}button:active:not(:disabled){translate:0 1px}button:disabled{opacity:.68}
.game{background:#aedbd4;box-shadow:0 0 0 3px #173c48,0 14px 60px #102c35;height:100svh;min-height:640px;max-height:920px}
.vignette{box-shadow:inset 0 0 0 2px #fff1cb30}
.hud{top:calc(18px + env(safe-area-inset-top));left:16px;right:16px;align-items:center;gap:8px}.brand{min-width:0}.brand .eyebrow{font:10px Arial,sans-serif;letter-spacing:1.3px;color:#315d66;font-weight:700;white-space:nowrap}.brand h1{font:28px/1 PixelTitle,monospace;max-width:none;letter-spacing:-1px;color:#294956;text-shadow:1px 2px #fff0ca;margin:6px 0 0}.wallet{padding:0;gap:5px}.currency{font:19px PixelTitle,monospace;height:40px;min-height:40px;min-width:50px;padding:4px 6px;gap:5px;border:2px solid #537b80;background:#fff3d6;box-shadow:0 3px #315762}.currency img{width:17px;height:17px}.gems{min-width:43px;background:#e6e3ef}
.top-tools{top:calc(86px + env(safe-area-inset-top));left:14px;right:14px;display:grid;grid-template-columns:1.12fr 1fr 1fr;gap:7px}.icon-button,.quest-button{height:44px;min-height:44px;min-width:0;width:100%;padding:5px;justify-content:center;gap:5px;border:2px solid #577c7f;background:#fff1d4;box-shadow:0 3px #31535f;font:14px PixelTitle,monospace;color:#294b58}.icon-button b{font:13px PixelTitle,monospace}.icon-button img,.quest-button img{width:18px;height:18px;flex-shrink:0}.icon-button span{font:15px Arial;left:19px;bottom:8px;color:#b66e70}.badge{position:absolute;margin-left:68px;margin-top:-30px;font:12px Arial;background:#c96f70;border:1px solid #fff0cd;border-radius:50%;width:17px;height:17px;line-height:16px}

.place-sign{top:calc(216px + env(safe-area-inset-top));left:22px;text-shadow:0 1px #e3f0d9}.sign-kicker{font:10px Arial,sans-serif;letter-spacing:1.5px;font-weight:700;color:#487a7e}.place-sign h2{font:30px/1.1 PixelTitle,monospace;color:#2b5a64;margin:5px 0}.place-sign .sign-sub{font:13px/1.3 Arial,sans-serif;color:#4b7c80}
.home-panel,.fishing-panel{left:14px;right:14px;bottom:calc(14px + env(safe-area-inset-bottom))}
.inventory-strip{height:48px;min-height:48px;padding:8px 11px;margin-bottom:12px;background:#e7f0db;border:2px solid #537e80;box-shadow:0 3px #294c5c;font:15px PixelTitle,monospace;color:#2f5964}.inventory-strip b{color:#537e80;font-weight:400}.inventory-strip img{width:24px;height:24px}.inventory-strip span{gap:7px}.inventory-strip i{color:#31616c}.inventory-strip #bag-value{font:14px Arial,sans-serif;color:#375c64}
.main-actions{grid-template-columns:1fr 1fr 1.14fr;gap:8px}.action-button{min-height:90px;padding:10px 3px;border:2px solid #345967;background:#fff2d6;box-shadow:inset 0 -4px #dfcfa7,0 4px #2e515e}.action-button.primary{background:#e9be6f;box-shadow:inset 0 -4px #c79658,0 4px #2e515e}.action-button img{width:34px;height:26px;margin-bottom:7px}.action-button span{font:17px/1.1 PixelTitle,monospace;letter-spacing:-.5px}.action-button small{font:11px Arial,sans-serif;color:#577076;margin-top:4px}
.bottom-line{margin-top:14px;min-height:30px;align-items:center;color:#d4e5dc;font:10px Arial,sans-serif}.bottom-line button{font:14px PixelTitle,monospace;color:#fff0c9;min-height:36px}.bottom-line button span{font:13px Arial,sans-serif;color:#c3ded8}
.floating-note{top:auto;bottom:calc(227px + env(safe-area-inset-bottom));width:calc(100% - 36px);padding:9px 11px;min-height:60px;background:#284f64ed;border:1px solid #98c6bb;border-left:4px solid #e1bd75;box-shadow:0 3px #224455;color:#f6f0d8;text-shadow:none}.floating-note b{font:12px PixelTitle,monospace;letter-spacing:.5px;color:#eaca88}.floating-note span{font:14px/1.35 Arial,sans-serif;margin-top:5px}
.back-button,.depth-tag{top:calc(201px + env(safe-area-inset-top));min-height:40px;height:40px;border:1px solid #7dadab;background:#315e6deb;box-shadow:0 2px #234b5a;font:14px PixelTitle,monospace;color:#fff0d0;padding:9px 10px}.back-button{left:14px}.depth-tag{right:14px}
.gear-summary{padding:8px 10px;border:1px solid #87b1aa;border-left:4px solid #e5bd75;background:#284f64ee;color:#f7edcf;font:14px/1.35 Arial,sans-serif;min-height:44px;margin-bottom:8px;text-align:left}
.fishing-status{font:15px/1.3 PixelTitle,monospace;min-height:38px;margin-bottom:8px;gap:8px;color:#fff1d3;text-shadow:1px 1px #244652}.mini-bag{font:13px Arial,sans-serif;padding:6px 7px;border:1px solid #8ebdb1;background:#284e60;white-space:nowrap;color:#f2ce88}
.fishing-meter{padding:11px 12px;background:#fff1d9;border:2px solid #557c81;box-shadow:0 3px #234a59;margin-bottom:10px}.meter-title{color:#345c67;font:14px PixelTitle,monospace;margin-bottom:8px}.meter-title #tension-label{font:13px Arial,sans-serif}.meter-track{height:16px;background:#d8dfcb;border:1px solid #a3b2a6;overflow:hidden}.danger-zone{background:repeating-linear-gradient(135deg,#c98279 0 4px,#dea799 4px 8px);z-index:2;opacity:.75}.meter-track>div{transition:width .06s linear;background:#66a993}.pull-caption{color:#3a7279;font:13px PixelTitle,monospace;margin:10px 0 3px}.pull-progress{height:6px;background:#c7d4ca;margin-top:0;border-radius:6px;overflow:hidden}.pull-progress>div{background:#547eaa;transition:width .06s linear}.meter-help{color:#59777a;font:14px/1.25 Arial,sans-serif;margin-top:10px}.line-danger .fishing-meter{border-color:#b96a67;box-shadow:inset 4px 0 #c27b74,0 3px #234a59}.fish-surge .meter-title{font-weight:bold}.line-danger .fishing-status{color:#fff0cc}
.depth-options{gap:8px;margin-bottom:10px}.depth-options button{min-height:44px;padding:8px 4px;border:1px solid #8cb5b0;background:#315c6b;font:14px PixelTitle,monospace;color:#dce7d3}.depth-options button.active{background:#f0e5c3;border-color:#fff1d4;box-shadow:0 2px #2d5664;color:#375d68}.fish-controls{gap:8px}.cast-button{min-height:64px;font:24px PixelTitle,monospace;letter-spacing:-.7px;border:2px solid #304f60;box-shadow:inset 0 -5px #c29459,0 4px #213d4f;background:#edc475;color:#2f4958}.cast-button.holding{background:#d9ad64;box-shadow:inset 0 4px #be9358,0 2px #213d4f}.cast-button:disabled{color:#596b6c;background:#cfc8a6}.auto-button{width:64px;min-height:64px;border:2px solid #81b1aa;background:#2f5a6c;color:#eaf0d9;font:18px PixelTitle,monospace}.auto-button small{font:12px Arial,sans-serif;color:#bdd5cd;margin-top:5px}.auto-button.on{background:#3e7d81;border-color:#f3d98d}.fishing-footnote{font:12px/1.35 Arial,sans-serif;margin-top:10px;min-height:16px;color:#d1e5dd}
.modal-wrap{padding:16px 12px;background:#193d4ac2}.modal{max-height:calc(100% - 8px);padding:22px 16px 18px;border:2px solid #446873;box-shadow:inset 0 0 0 3px #fff8e4,0 8px #163b4bcc;background:#fff3d6;scrollbar-color:#749f99 #e8dec0;scroll-padding-top:60px}.close-button{position:sticky;top:0;right:0;float:right;margin:-10px -5px 0 5px;width:44px;height:44px;min-height:44px;background:#e9e3c9;border:1px solid #a6b2a0;box-shadow:0 2px #b7bca4;color:#3b666c;font:26px PixelTitle,monospace;z-index:5}
.modal-kicker{font:12px/1.4 PixelTitle,monospace;letter-spacing:1px;color:#667e7a;margin:0 0 8px;padding-right:36px}.modal h2{font:28px/1.12 PixelTitle,monospace;color:#2f5762;margin:0 0 9px}.modal-description{font:14px/1.5 Arial,sans-serif;color:#627a79;margin:10px 0 16px}.modal-footer{font:13px/1.5 Arial,sans-serif;color:#617977;margin-top:16px}.tip-card{font:14px/1.5 Arial,sans-serif;padding:12px;border:1px solid #b2c5b3;border-left:3px solid #609b93;background:#e3ebd7;color:#456d70;margin:12px 0}
.pixel-btn{font:16px/1.25 PixelTitle,monospace;min-height:46px;padding:10px 9px;border:2px solid #426573;background:#e9be72;box-shadow:inset 0 -3px #c49c60,0 3px #315363;color:#2f4f5d}.pixel-btn.secondary{background:#bfd6c8;box-shadow:inset 0 -3px #91b4ae,0 3px #315363}.pixel-btn:disabled{color:#75827d;background:#dddcc5;border-color:#b3bda9;box-shadow:inset 0 -3px #c8ccb5,0 2px #acb6a7;opacity:1}.pixel-btn.wide{margin-top:12px}.tabs{gap:5px;margin:16px 0}.tabs button,.bag-tabs button{font:14px/1.2 PixelTitle,monospace;min-height:44px;padding:8px 4px;border:1px solid #99b3a7;background:#e2e8d3;color:#557a7b}.tabs button.active{background:#427d82;color:#fff4d9;border-color:#335a69;box-shadow:inset 0 -3px #346b76}
.upgrade-card{padding:12px;background:#f3ebd1;border:1px solid #c5cfb9;margin-top:12px}.upgrade-card h3{font:22px/1.15 PixelTitle,monospace;color:#315b65;margin:0}.upgrade-card small{font:13px/1.4 Arial,sans-serif;color:#6b7e78;display:block;margin-top:4px}.upgrade-card p{font:14px/1.5 Arial,sans-serif;color:#657978;margin:10px 0}.upgrade-card .pixel-btn{font-size:15px}.upgrade-title{gap:12px}.rod-art{width:58px;height:87px;background:#e0e8d4;border:1px solid #b9cbb9;flex-shrink:0}.comparison{padding:10px;background:#e0e8d7;border-left:3px solid #89b5a5;font:14px/1.45 Arial,sans-serif;color:#456f73;margin:12px 0}.comparison b,.comparison span,.comparison strong,.comparison small{font:inherit;line-height:1.45}.comparison b{font-size:12px;color:#67807c;margin-bottom:5px}.comparison strong{color:#3c7366;font-weight:700;margin-top:6px}.comparison small{font-size:12px;color:#637d7b;margin-top:5px}.line-spool{width:43px;height:49px;border:4px solid #3e5968;background:repeating-linear-gradient(0deg,var(--line-color) 0 4px,#6e9699 4px 6px);box-shadow:inset 7px 0 #ffffff50,3px 3px #b5c5b7;margin:5px 7px}.bait-packs{gap:7px;margin:12px 0}.bait-packs .pixel-btn{font:14px PixelTitle,monospace;padding:9px 3px;min-height:44px}
.fish-row{padding:12px 0;gap:8px;border-bottom:1px dashed #bec8b2}.fish-row input{width:24px;height:44px;accent-color:#477e81;flex-shrink:0;margin:0 4px 0 0}.fish-row img{width:48px;height:36px;flex-shrink:0}.row-main{min-width:0}.row-main strong,.fish-row .row-main strong{font:18px/1.2 PixelTitle,monospace;color:#315965}.row-main small{font:13px/1.4 Arial,sans-serif;color:#657b77;display:block;margin-top:4px}.fish-value{font:14px PixelTitle,monospace;color:#956c40}.empty{font:14px/1.7 Arial,sans-serif;color:#6c8179;padding:28px 5px}.stack-card{border:1px solid #c5cfb9;background:#f3ebd1;padding:12px;gap:10px;margin:14px 0}.stack-card>img{width:48px;height:48px}.stack-card h3{font:20px/1.25 PixelTitle,monospace;color:#345e67}.stack-card p{font:14px/1.45 Arial,sans-serif;color:#617875;margin:8px 0}.stack-card small{font:13px Arial,sans-serif;color:#637b76}.stack-card .pixel-btn{font:14px PixelTitle,monospace}
.quest-row{padding:12px 10px;gap:9px;margin:12px 0;border:1px solid #c0cdb7;background:#f2ebd1}.quest-symbol{font:14px PixelTitle,monospace;min-width:26px;width:26px;height:30px;border:1px solid #416673;background:#618e92;color:#fff3d6}.quest-row .row-main strong{font:18px/1.2 PixelTitle,monospace}.quest-row .row-main small{font:12px/1.45 Arial,sans-serif}.quest-reward{font:12px/1.45 Arial,sans-serif;min-width:48px;color:#517d7d}.quest-row button{font:12px PixelTitle,monospace;min-height:44px;min-width:50px;padding:6px;border:1px solid #78998e;background:#edc475}.quest-progress{height:4px;background:#d2d8bf;margin-top:8px}.quest-progress div{background:#71a492}.current-goal{border-color:#679a90;box-shadow:inset 3px 0 #699c91}.quest-row.done{opacity:.7}
.location-card{padding:14px 12px;gap:12px;background:#e7ead5;border:1px solid #a8c0af;margin:14px 0}.location-card img{width:58px;height:53px}.location-card b{font:23px PixelTitle,monospace;color:#365f68}.location-card small{font:14px/1.5 Arial,sans-serif;color:#607a77;margin:5px 0}.location-card em{font:12px PixelTitle,monospace;color:#916e43}.location-card:disabled{opacity:.55}
.journal-progress{height:5px;background:#d0d8be;margin-top:15px}.journal-progress div{background:#71a89c}.collection-grid{gap:10px;margin-top:17px}.collection-cell{padding:13px 5px;background:#e6ebd8;border:1px solid #b6cbb9}.collection-cell img{width:100%;max-width:108px;height:65px}.collection-cell strong{font:19px/1.2 PixelTitle,monospace;color:#375d67}.collection-cell .rarity{font:11px PixelTitle,monospace;margin:5px 0}.collection-cell small{font:11px/1.5 Arial,sans-serif;color:#627d78;margin-top:6px}.unknown-fish{font:42px PixelTitle,monospace;color:#97b7a8;height:65px;line-height:65px}.collection-cell.locked strong{color:#819e92}
.catch-modal{padding-top:9px}.catch-modal .modal-kicker{color:#678079;padding-right:0;font-size:12px}.catch-stage{height:185px;margin:16px 0 19px;background:radial-gradient(ellipse at 50% 70%,#aacdb940,transparent 65%),repeating-linear-gradient(0deg,#dde8d5 0 20px,#e5edda 20px 40px);border:1px solid #a9c8b5;box-shadow:inset 0 0 0 5px #fff5d04d}.catch-stage img{width:210px;height:145px;animation:catch-arrive .65s steps(8) both,fishfloat 2.8s steps(10) .65s infinite;filter:drop-shadow(0 7px 0 #43777c22)}.catch-stage:before,.catch-stage:after{content:'+';font:30px PixelTitle,monospace;color:#94b8a7}.catch-modal h2{font:30px/1.1 PixelTitle,monospace;color:#325e67;margin:9px 0}.rarity{font:13px PixelTitle,monospace;letter-spacing:2px;color:#58867a}.rarity.rare{color:#408799}.rarity.epic{color:#836895}.rarity.secret{color:#966ba0}.catch-note{font:14px/1.5 Arial,sans-serif;color:#617a78;margin:9px 0 15px}.new-label{font:11px PixelTitle,monospace;letter-spacing:.5px;background:#bf7c7e;color:#fff3d6;border:1px solid #a16574;padding:5px 9px}.catch-stats{gap:32px;margin:16px 0;padding:12px 0;background:#efe9cf;border-block:1px solid #d0d6bc}.catch-stats b{font:22px PixelTitle,monospace;color:#335c66}.catch-stats small{font:11px Arial,sans-serif;letter-spacing:1px;color:#71837b;margin-bottom:6px}.gem-found{font:14px Arial,sans-serif;color:#796c9a}.secret-reveal .catch-stage{background:radial-gradient(ellipse at 50% 50%,#fff2c5,transparent 70%),repeating-linear-gradient(0deg,#ded9e5 0 20px,#e9e2e5 20px 40px);border-color:#ad96bb;box-shadow:0 0 0 3px #ead293;animation:secret-glow 1s steps(4) 2}.secret-reveal .catch-stage img{filter:drop-shadow(0 7px 0 #8d70a633)}.secret-reveal .rarity{font-size:15px;color:#8b659c}
.toast{top:calc(196px + env(safe-area-inset-top));font:14px/1.4 Arial,sans-serif;background:#fff1d5;color:#385e67;border:2px solid #557c81;box-shadow:0 4px #294955;padding:12px 14px;max-width:calc(100% - 30px)}
@keyframes catch-arrive{from{opacity:0;transform:translateY(22px) scale(.75)}to{opacity:1;transform:none}}
@media(max-height:710px){.game{min-height:580px}.hud{top:14px}.brand h1{font-size:26px}.brand .eyebrow{font-size:9px}.top-tools{top:76px}.place-sign{top:196px;left:20px}.place-sign h2{font-size:25px;margin:4px 0}.place-sign .sign-sub{font-size:12px}.sign-kicker{font-size:9px}.back-button,.depth-tag{top:190px}.floating-note{bottom:218px;min-height:54px;padding:8px 10px}.floating-note span{font-size:14px;margin-top:4px}.floating-note b{font-size:11px}.home-panel,.fishing-panel{bottom:12px}.inventory-strip{height:46px;min-height:46px;margin-bottom:10px}.action-button{min-height:82px;padding:8px 2px}.action-button img{height:24px;margin-bottom:6px}.action-button span{font-size:16px}.bottom-line{margin-top:10px}.fishing-meter{padding:9px 10px}.gear-summary{font-size:14px;min-height:42px;margin-bottom:6px}.fishing-status{min-height:34px;margin-bottom:6px;font-size:14px}.cast-button,.auto-button{min-height:58px}.cast-button{font-size:23px}.meter-help{margin-top:7px;font-size:14px}.fishing-footnote{font-size:11px;margin-top:8px}.catch-stage{height:130px;margin:12px 0}.catch-stage img{height:110px;width:180px}.catch-modal h2{font-size:27px}.catch-note{font-size:14px;margin:7px 0 10px}.catch-stats{margin:10px 0;padding:9px 0}.catch-modal .modal-footer{font-size:12px;margin-top:12px}.modal-wrap{padding:12px}.modal{padding:18px 13px 16px}.modal h2{font-size:27px}}
@media(max-width:360px){.hud{left:14px;right:14px}.currency{font-size:17px;min-width:46px;padding:3px 5px}.gems{min-width:40px}.brand h1{font-size:25px}.brand .eyebrow{letter-spacing:.7px}.icon-button b{font-size:12px}.quest-button{font-size:13px}.top-tools{gap:6px}.action-button span{font-size:15px}.action-button small{font-size:10px}.bottom-line>span{font-size:9px}.modal{padding-inline:12px}.upgrade-title{gap:9px}.upgrade-card h3{font-size:21px}.quest-row{padding:11px 8px;gap:7px}.quest-row .row-main strong{font-size:17px}.quest-symbol{min-width:24px;width:24px}.quest-reward{min-width:46px}.fish-row{gap:6px}.fish-row img{width:42px}.fish-row .row-main strong{font-size:17px}.stack-card{padding:10px;gap:8px}.stack-card>img{width:38px;height:42px}.stack-card h3{font-size:19px}.stack-card .pixel-btn{font-size:13px}.bag-tabs button{font-size:12px}.collection-cell strong{font-size:18px}.collection-cell small{font-size:11px}}
@media(min-width:650px){.game{height:calc(100svh - 40px);width:420px;min-height:680px;max-height:900px}}
@media(prefers-reduced-motion:reduce){.catch-stage img,.secret-reveal .catch-stage{animation:none}.meter-track>div,.pull-progress>div{transition:none}}
/* Information that changes a decision stays readable on the smallest phone. */
.gems{height:44px;min-height:44px}.back-button,.depth-tag{height:44px;min-height:44px}.bottom-line button{min-height:44px}.auto-button small{font-size:14px}.fishing-footnote{font-size:14px;line-height:1.35}.quest-row .row-main small,.quest-reward,.quest-row button,.comparison b,.comparison small,.modal-footer,.collection-cell small,.collection-cell .rarity,.catch-modal .modal-footer,.catch-stats small,.new-label{font-size:14px}.quest-reward{min-width:64px}.quest-row button{min-width:64px}.catch-modal .modal-kicker{font-size:14px}.stack-card .pixel-btn{font-size:14px}.upgrade-card small{font-size:14px}.collection-cell small{line-height:1.5}
.modal-description,.modal-footer,.upgrade-card p,.upgrade-card small,.row-main small,.stack-card p,.stack-card small,.catch-note,.catch-stats small{color:#526e71}.comparison,.comparison b,.comparison small,.collection-cell small{color:#45676c}.fishing-status{background:#284f64;border:1px solid #81aaa5;padding:6px 8px;min-height:44px;text-shadow:none}.mini-bag{border:0;background:transparent;padding:4px 0}.floating-note{bottom:calc(240px + env(safe-area-inset-bottom))}
@media(max-height:710px){.floating-note{bottom:218px}}

/* The active odds mode is a readable action, including at 320px. */


.back-button,.depth-tag{top:calc(216px + env(safe-area-inset-top))}.place-sign{top:calc(220px + env(safe-area-inset-top))}
.danger-zone{width:32%}.chapter-heading{font:20px PixelTitle,monospace;color:#386471;margin:24px 0 12px}.depth-options button{line-height:1.25}
@media(max-height:710px){.back-button,.depth-tag{top:204px}.place-sign{top:204px}.place-sign .sign-kicker{display:none}}