/* Primary fishing screen; the approved artwork and water contact are shared. */
.fp-entry{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:15px 17px}
.fp-entry strong{font:500 17px Georgia,serif}.fp-entry p{font:12px/1.5 system-ui;color:var(--muted);margin:5px 0 0}.fp-entry>.btn{flex:none;min-height:44px}
body.fishing-focused{overflow:hidden;padding:0}
.fp-screen{position:fixed;inset:0;z-index:20;width:100%;max-width:680px;margin:auto;height:100vh;height:var(--tg-viewport-stable-height,100dvh);padding-top:max(var(--safe-top),env(safe-area-inset-top,0px));padding-bottom:max(var(--safe-bottom),env(safe-area-inset-bottom,0px));background:#e9e3ce;color:#333b30;display:flex;flex-direction:column;isolation:isolate;font-family:system-ui,sans-serif}
.fp-screen button,.fp-screen select{-webkit-tap-highlight-color:transparent;font-family:inherit}
.fp-header{display:flex;align-items:center;gap:10px;padding:9px 12px;min-height:62px;flex:none;background:#3b4436;color:#f3ecdb}
.fp-header>div{flex:1;min-width:0}.fp-header h1{font:500 19px/1.2 Georgia,serif;margin:3px 0 0}.fp-header>div>span{font:10px/1.2 system-ui;letter-spacing:1.3px;text-transform:uppercase;color:#cbd1bc}
.fp-back{border:1px solid #748064;border-radius:5px;color:inherit;background:#4b5642;min-width:44px;height:44px;font-size:21px;flex:none}.fp-screen button:disabled{cursor:default;opacity:.5}.fp-screen button:focus-visible,.fp-screen select:focus-visible{outline:3px solid #ccac5a;outline-offset:2px}
.fp-scene{position:relative;flex:1;min-height:155px;overflow:hidden;background:#36484a var(--fp-art) center top/cover no-repeat}
.fp-scene:before{content:"";position:absolute;inset:0;background:linear-gradient(#172a2b55,transparent 40%,#172a2b44);pointer-events:none}
.fp-scene>.scene-night{height:100%;object-position:center top;pointer-events:none}
.fp-scene-top{position:absolute;z-index:2;inset:12px 12px auto;display:flex;justify-content:space-between;gap:8px;font:11px/1.4 system-ui;color:#fff8e5;text-shadow:0 1px 3px #172222}
.fp-scene-top>span{background:#253c38d9;padding:5px 8px;border-radius:4px}
.fp-tackle{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.fp-rod{fill:none;stroke:#7c542f;stroke-width:5;stroke-linecap:round;vector-effect:non-scaling-stroke}.fp-line{fill:none;stroke:#f1e5c7;stroke-width:1.25;vector-effect:non-scaling-stroke;opacity:.85}
.fp-rod-texture{display:none}.fp-rod-ready .fp-rod-texture{display:block}.fp-rod-ready .fp-rod{visibility:hidden}
.fp-scene[data-phase="idle"] .fp-tackle,.fp-scene[data-phase="result"] .fp-tackle{visibility:hidden}
.fp-bobber{position:absolute;z-index:4;width:48px;height:48px;transform:translate(-50%,-50%);border:0;padding:0;background:transparent!important;opacity:1!important;touch-action:manipulation}
.fp-water-contact{position:absolute;z-index:5;width:84px;height:28px;transform:translate(-50%,-50%);pointer-events:none;overflow:visible}
.fp-water-contact path{fill:none;stroke-linecap:round;vector-effect:non-scaling-stroke}
.fp-water-light{stroke:#c6d7ce;stroke-width:1.1;opacity:.78}
.fp-water-dark{stroke:#213b3c;stroke-width:1.2;opacity:.58}
.fp-water-faint{stroke:#bacdc4;stroke-width:.85;opacity:.38}
/* The waterline stays still; only the painted sprite bobs and dips behind it. */
.fp-float-window{position:absolute;left:0;top:0;width:48px;height:24px;overflow:hidden;pointer-events:none;-webkit-mask-image:linear-gradient(#000 0 calc(100% - 1px),transparent 100%);mask-image:linear-gradient(#000 0 calc(100% - 1px),transparent 100%)}
.fp-float-sprite{position:absolute;left:21px;top:6px;width:6px;height:30px;border:1px solid #efe4ce;border-radius:4px;background:linear-gradient(#a64f34 0 45%,#eee8ce 45% 65%,#738854 65%)}
.fp-float-art{display:none}.fp-float-ready .fp-float-sprite{left:15px;top:0;width:18px;height:40px;border:0;border-radius:0;background:none}.fp-float-ready .fp-float-art{display:block;width:100%;height:100%;overflow:visible}
.fp-scene[data-phase="waiting"] .fp-float-sprite{animation:fp-bob 1.8s ease-in-out infinite}
.fp-scene[data-phase="bite"] .fp-float-sprite{animation:fp-bite .35s ease-in-out infinite}
.fp-scene[data-danger="true"] .fp-line{stroke:#f1ae8b;stroke-width:2}
.fp-scene-caption{position:absolute;bottom:13px;left:12px;right:12px;text-align:center;font:13px/1.45 system-ui;color:#fff5df;text-shadow:0 1px 3px #182527}
.fp-controls{flex:none;display:grid;gap:7px;padding:12px 16px 8px;background:#eee8d5;border-top:1px solid #ada48a}
.fp-supplies{display:flex;justify-content:flex-end;min-height:18px}
.fp-status{display:grid;gap:3px;min-height:54px;align-content:center}.fp-status>strong{font:500 19px/1.2 Georgia,serif}.fp-status>span{font-size:12px;line-height:1.4;color:#626954}
.fp-gauge-head,.fp-landing-head{display:flex;justify-content:space-between;gap:10px;font-size:12px}.fp-gauge-head>span:last-child,.fp-landing-head>span:last-child{font-variant-numeric:tabular-nums}
.fp-tension{display:flex;position:relative;height:14px;margin:2px 0}.fp-slack-zone{width:15%;background:#bdbbad}.fp-safe-zone{width:65%;background:#96a679}.fp-risk-zone{width:20%;background:repeating-linear-gradient(120deg,#b87558 0 5px,#c88a67 5px 9px)}
.fp-tension>i{position:absolute;left:35%;top:-4px;bottom:-4px;width:4px;transform:translateX(-50%);background:#374534;box-shadow:0 0 0 1px #fff4d4}.fp-tension[data-level="danger"]>i{background:#8e3829}
.fp-gauge-labels{display:flex;justify-content:space-between;gap:8px;font-size:10px;color:#626954;margin-bottom:2px}
.fp-landing{height:6px;background:#d2cdb9;overflow:hidden}.fp-landing>span{display:block;height:100%;width:0;background:#6d8353}
.fp-action{width:100%;height:57px;margin-top:5px;border:1px solid #37452e;border-radius:5px;background:linear-gradient(#63744e,#475a38);color:#fff8e7;font-size:16px;font-weight:500;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;box-shadow:0 2px 0 #34422a}
.fp-action[data-holding="true"]{background:#354b2e;box-shadow:inset 0 2px 6px #18221555}
.fp-practice{margin:3px 0 0;text-align:center;font:10px/1.4 system-ui;color:#6d715e}
.fp-bait{align-self:center;text-align:right;font-size:13px;color:#626954}
.fp-stats{min-height:32px;border:0;background:transparent;color:#526245;font-size:11px;text-decoration:underline;text-underline-offset:3px}
.fp-collection{width:min(420px,calc(100% - 24px));max-height:80dvh;overflow:auto;border:1px solid #ada48a;border-radius:7px;padding:14px;background:#eee8d5;color:#394632}
.fp-collection::backdrop{background:#15232499}.fp-collection-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.fp-collection h2{font:500 20px Georgia,serif;margin:0}
.fp-collection-fish{display:flex;align-items:center;gap:12px;border-bottom:1px solid #c6c1ad;padding:7px 0}.fp-collection-fish img{width:54px;height:54px;object-fit:contain}.fp-collection-fish small{display:block;font-size:11px;margin-top:4px}.fp-collection-fish.locked{opacity:.5}
.fp-result{position:absolute;z-index:5;left:50%;top:50%;transform:translate(-50%,-50%);width:min(270px,calc(100% - 28px));display:grid;justify-items:center;gap:6px;padding:14px;background:#eee8d7f5;border:1px solid #bfb496;border-radius:7px;box-shadow:0 4px 25px #14262233;text-align:center;color:#394632}
.fp-result>img{width:88px;height:88px;object-fit:contain;border-radius:5px}.fp-result>strong{font:500 23px/1.2 Georgia,serif}.fp-result>span{font-size:16px}.fp-result>small{font-size:12px;line-height:1.5}
.fp-screen [hidden]{display:none!important}
@keyframes fp-bob{50%{transform:translateY(3px) rotate(-5deg)}}@keyframes fp-bite{50%{transform:translateY(10px) rotate(20deg)}}
@media(max-width:400px){.fp-entry{flex-wrap:wrap}.fp-entry>.btn{width:100%}.fp-header h1{font-size:17px}.fp-controls{padding:9px 12px 7px;gap:6px}}
@media(max-height:650px){.fp-header{min-height:55px;padding:5px 10px}.fp-controls{gap:4px;padding:7px 12px 5px}.fp-status{min-height:48px}.fp-status>strong{font-size:17px}.fp-action{height:50px}.fp-result>small{display:none}.fp-result>img{width:44px;height:44px}.fp-result{padding:8px;gap:4px}.fp-result>strong{font-size:19px}.fp-scene{min-height:125px}}
@media(prefers-reduced-motion:reduce){.fp-screen *{animation:none!important}.fp-water-wave{display:none}}

.fp-result-close{position:absolute;right:3px;top:3px;min-width:44px;min-height:44px;padding:0;border:1px solid #b9b29b;border-radius:4px;background:#f8f3e5;color:#526245;font:25px/1 system-ui}
