/* Cozy fishing instruments. The surrounding original HUD and encyclopedia stay scoped. */
#powerWrap,#reelWrap,#fightWrap{--cream:#fff0c5;--mint:#9ee6bf;position:absolute;pointer-events:none;color:#eaf4ec;background:radial-gradient(ellipse at 14% 0%,#427e879c,transparent 65%),linear-gradient(150deg,#244954f5,#142f45fa);border:2px solid #9dd5d5;border-radius:25px;box-shadow:0 7px 0 #0b243ac9,0 14px 28px #04162966,inset 0 0 0 4px #eef5d315}
#powerWrap:before,#reelWrap:before,#fightWrap:before{content:'✦';position:absolute;right:18px;top:-15px;width:28px;height:28px;display:grid;place-items:center;background:#ffe8a5;border:2px solid #fff4d4;border-radius:50%;color:#af723e;font-size:17px;transform:rotate(12deg);box-shadow:0 3px 0 #13364f}
#powerWrap{bottom:83px;left:50%;transform:translateX(-50%);padding:20px 24px 14px;width:min(480px,90vw)}
.castHeading{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;font-size:16px;gap:8px}.castHeading>span{color:#abe2d9}.castHeading>span:before{content:'◌ ';color:#ffb4a1}.castHeading b{font-weight:400;color:#ffebac}
#powerGauge{height:23px;overflow:visible;border:3px solid #d5eee0;border-radius:12px;background:linear-gradient(to right,#5f92b1 0 62%,#84c7a0 62% 84%,#f2d77e 84% 94%,#df8b82 94%);box-shadow:0 3px 0 #0e283d,inset 0 2px 4px #26495766}
#powerGauge .sweetZone{left:84%;width:10%;inset-block:0;right:auto;height:auto;border:0;border-inline:1px dashed #fff9df;background:#ffe8a34d;box-shadow:0 0 12px #ffdb7333}
#powerFill{height:100%;max-width:100%;border-radius:9px;background:linear-gradient(90deg,transparent,#ffffff33);transition:none}
#powerNeedle{position:absolute;top:-11px;bottom:-8px;width:3px;background:#fff5d3;transform:translateX(-50%);box-shadow:0 0 3px #163850;z-index:2}
#powerNeedle:before{content:'';position:absolute;width:12px;height:20px;left:-5px;top:-1px;border:2px solid #fff7dd;border-radius:9px;background:linear-gradient(#fa9e8a 0 48%,#fff5d7 48%);box-shadow:0 2px 2px #13304466}
#powerText{position:static;display:block;inset:auto;font-size:17px;text-shadow:0 2px #1b3745}
.castScale{position:relative;height:20px;margin-top:10px;color:#bad6dd;font-size:10px}.castScale>*{position:absolute;white-space:nowrap;font-weight:400}.castScale>:first-child{left:0}.castScale>:nth-child(2){left:65%}.castScale>:nth-child(3){left:88%;transform:translateX(-50%);color:#ffecb0}.castScale>:last-child{right:-9px}
.castInstruction{text-align:center;font-size:13px;margin:7px 0 0;color:#bddadf}.castInstruction strong{color:#fff0b2;font-weight:400}
#powerWrap[data-grade=perfect]{border-color:#ffe19a}#powerWrap[data-grade=over] #powerText{color:#ffc1af}
#reelWrap{left:22px;bottom:26px;width:350px;padding:19px 20px 13px;transform:none}
#reelWrap .reelTop{display:flex;align-items:center;justify-content:space-between;line-height:1.4;gap:8px;margin:0}#reelFishName{font-size:17px;color:#f0edd0;text-shadow:0 2px #163044}
#fishSize{font-family:'Gowun Dodum',sans-serif;font-size:11px;color:#b8d1d8;white-space:nowrap}
.reelMeta{display:flex;align-items:center;justify-content:space-between;margin:7px 0 9px;font-size:11px;color:#afced4;gap:7px}#wheelChallenge{letter-spacing:.03em;color:#d5e9c2}#timerText{color:#e5efdd;font-weight:400;font-size:13px;font-variant-numeric:tabular-nums}
.reelClock{height:4px;border-radius:5px;background:#0e293f;margin-bottom:13px;overflow:hidden}.reelClock #timerFill{height:100%;background:#b1e7cf;transition:none}
#gaugeBox{isolation:isolate}#reelSvg{max-height:none;width:100%;overflow:visible}#reelSvg path{fill:none;stroke-width:14;stroke-linecap:butt}
#reelSvg path.dialFace{fill:#17344bed;stroke:#a1cfc9;stroke-width:2}#reelSvg path.dialRim{stroke:#d4edcf;stroke-width:3}
#reelSvg .tick{stroke:#9fc8c68c;stroke-width:1}#reelSvg .tick.major{stroke:#e6edd0;stroke-width:2}
#reelSvg .zTrack{stroke:#0b2338;stroke-width:21}#reelSvg .zDanger{stroke:#d68c85}#reelSvg .zSafe{stroke:#80b9d0}#reelSvg .zGood{stroke:#9addb0}#reelSvg .zPerfect{stroke:#ffe09a;stroke-width:21;filter:drop-shadow(0 0 4px #ffe7a155)}
#needleG line{stroke:#fff1c5;stroke-width:3;filter:drop-shadow(0 2px 1px #082033)}#needleG polygon{fill:#fff4ce;filter:drop-shadow(0 0 2px #12334a);transition:none}#needleG circle{fill:#efb58d;stroke:#fff0c3;stroke-width:2}#needleG circle.hubInner{fill:#315d68;stroke:#eaf0c8}
#gaugeCaption{bottom:45px;left:15px;right:15px;font-size:12px;color:#b9d5da;text-shadow:0 1px 3px #082438}
#captureChance{position:absolute;left:0;right:0;bottom:63px;text-align:center;font-size:23px;text-shadow:0 2px #122e43;color:#e0f3df}
#reelWrap[data-grade=perfect] #captureChance{color:#ffdfa0}#reelWrap[data-grade=danger] #captureChance{color:#f4b5ab}
#judgeLabel{position:static;text-align:center;display:block;opacity:1;min-height:25px;height:auto;font-size:20px;line-height:1.3;margin:9px 0;color:#ffebae}
#reelWrap .gaugeTip{border-top:1px dashed #a1d4d146;padding-top:8px;display:flex;justify-content:space-between;color:#b4cbd5;font-size:10px;line-height:1.5}#reelWrap .gaugeTip b{font-weight:400;color:#f6ddb2}
#reelWrap.settled{border-color:#ffe2a6}#reelWrap[data-result=miss]{border-color:#e6a9a0}
#fightWrap{bottom:26px;left:22px;width:350px;padding:18px 20px 12px}
.fightHeading{display:flex;justify-content:space-between;align-items:center;font-size:20px;color:#fff0c5}.fightHeading b{font-size:13px;font-weight:400;color:#bedce1;margin-right:3px;font-variant-numeric:tabular-nums}
#fightJudgments,.resultJudgments{display:flex;flex-wrap:wrap;gap:6px 12px;font-size:11px;color:#b9d4dd;margin:7px 0 12px}#fightJudgments b,.resultJudgments b{font-weight:400;color:#f0e9ba;margin-left:4px}.resultJudgments{justify-content:center;font-size:14px}
.fightDial{position:relative}#fightSvg{display:block;width:100%;overflow:visible}.fightFace{fill:#143147;stroke:#99cfc9;stroke-width:2}.fightRail{fill:none;stroke:#375b72;stroke-width:20;stroke-linecap:round}#fightTargetZone{fill:none;stroke:#a4e3a9;stroke-width:23;stroke-linecap:round;filter:drop-shadow(0 0 5px #a5ffac33)}#fightTargetMarker circle{fill:#d5f0bc;stroke:#70b4a2;stroke-width:2}#fightTargetMarker text{fill:#407865;text-anchor:middle;font-family:inherit;font-size:16px}
#fightNeedle line{stroke:#fff0c8;stroke-width:3}#fightNeedle path{fill:#ffb59b;stroke:#fff2cd;stroke-width:2}#fightNeedle circle{fill:#f4c29d;stroke:#ffefc4;stroke-width:2}#fightNeedle circle:last-child{fill:#2f5969;stroke:none}
.fightScore{position:absolute;inset:54px 0 auto;display:flex;flex-direction:column;align-items:center;pointer-events:none;text-shadow:0 2px #153345}.fightScore small{font-size:11px;color:#b2d3d9}.fightScore strong{font-size:31px;line-height:1.2;font-weight:400;color:#fff1ca}.fightScore span{font-size:10px;color:#b6d9d8;margin-top:1px}#fightWrap.onTarget .fightScore strong{color:#c7f7b2}
#fightEvent{font-size:16px;line-height:1.4;min-height:23px;text-align:center;color:#ffe6b3;margin:7px 0 9px}#fightWrap.onTarget #fightEvent{color:#b9efb8}
.fightTrack{height:9px;background:#123044;border:1px solid #90b7b885;border-radius:7px;overflow:hidden}#fightProgress{height:100%;background:linear-gradient(90deg,#81cbb3,#deeda6);border-radius:7px;transition:none}
.fightTrackLabels{display:flex;justify-content:space-between;font-size:10px;color:#c3dde0;margin-top:4px}.fightTrackLabels b{font-weight:400;color:#e6f3c3}
.fightRiskRow{display:flex;gap:14px;margin:9px 0 11px}.fightRiskRow>span{display:flex;align-items:center;gap:6px;flex:1;font-size:10px;color:#bdd5d9}.fightRiskRow i{flex:1;height:4px;border-radius:3px;background:#102b40;overflow:hidden}.fightRiskRow b{display:block;height:100%;background:#e9a797}#fightSlack{background:#b0c3e8}
#fightControl{pointer-events:auto;touch-action:none;user-select:none;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;min-height:51px;border:2px solid #d0f0df;border-radius:16px;background:linear-gradient(#81bdb5,#4b8a90);color:#f6f5d5;font:inherit;cursor:pointer;box-shadow:0 4px 0 #0d2b42;transition:none;text-shadow:0 1px #376a77}
#fightControlText{font-size:15px}#fightControl small{font-size:10px;margin-top:3px;color:#d7ece4}#fightWrap.holding #fightControl{background:linear-gradient(#e0b77f,#bc8e64);border-color:#ffefc3;transform:translateY(2px);box-shadow:0 2px 0 #0d2b42}#fightControl:focus-visible{outline:3px solid #fff1a8;outline-offset:3px}
#fightOdds{font-size:10px;color:#c8e4c7;margin:11px 0 0;text-align:center}#fightWrap.strained{border-color:#f0aa95}
body:is([data-state=reeling],[data-state=striking],[data-state=fighting]) #hint{left:calc(50% + 150px);width:calc(100vw - 450px);max-width:calc(100vw - 450px);bottom:29px;font-size:14px;white-space:normal;text-align:center}
.fightResultScore{text-align:center;color:#cce9b0;font-size:21px;margin:10px 0}.fightResultScore small{display:block;color:#aabfbc;font-size:11px;margin-top:5px}.salvageIcon{font-size:92px;margin:18px 0 8px;text-align:center}.salvageName{text-align:center;color:#e9d199;font-size:25px;margin:10px 0}.salvageRecords{border-top:1px solid #fff2;margin-top:20px;padding-top:12px}
.chanceSummary{padding:12px 14px;background:#96b4cf0e;border:1px solid #afcedc24;border-radius:12px;line-height:1.7;font-family:'Gowun Dodum',sans-serif;font-size:13px;color:#c4d2dc}
.chanceControls{display:flex;gap:12px;margin:16px 0;flex-wrap:wrap}.chanceControls label{display:flex;align-items:center;gap:8px;font-size:13px}.chanceControls select{padding:8px;background:#172b40;color:#f1dfb5;border:1px solid #59738a;border-radius:8px;font:inherit}
.chanceTable{width:100%;border-collapse:collapse;font-size:13px}.chanceTable th{text-align:left;font-weight:400;color:#a6bdcf;font-size:11px;padding:10px 7px;border-bottom:1px solid #fff2}.chanceTable td{padding:12px 7px;border-bottom:1px solid #fff1}.chanceTable td small{display:block;font-size:10px;color:#9eafbd;margin-top:4px}.chanceTable tr.unavailable{color:#abacac}.chanceTable .zeroChance{color:#deaa99}
.chanceNote{font-family:'Gowun Dodum',sans-serif;font-size:12px;line-height:1.8;color:#b7c7d1}.chanceTable td:nth-child(2){font-size:17px;color:#e9d598;white-space:nowrap}
@media(max-width:760px){
 #reelWrap,#fightWrap{left:50%;transform:translateX(-50%);bottom:65px;width:min(340px,calc(100vw - 26px));padding:17px 18px 12px}
 #powerWrap{padding:18px 20px 12px;bottom:88px;width:min(440px,calc(100vw - 28px))}
 body:is([data-state=reeling],[data-state=striking],[data-state=fighting]) #hint{left:50%;bottom:15px;width:calc(100vw - 28px);max-width:calc(100vw - 28px);font-size:12px}
 body:is([data-state=reeling],[data-state=striking],[data-state=fighting]) :is(#fishStrip,#rodPanel,#baitPanel,#wheelPanel,#badgeBox){display:none}
 body:is([data-state=reeling],[data-state=striking],[data-state=fighting]) #menu button:not(#btnPause){display:none}
 .chanceTable{font-size:12px}.chanceTable th,.chanceTable td{padding:10px 4px}.chanceTable td:nth-child(2){font-size:15px}
}
@media(min-width:761px) and (max-height:900px){body:is([data-state=reeling],[data-state=striking],[data-state=fighting]) :is(#fishStrip,#rodPanel,#baitPanel,#wheelPanel,#badgeBox){display:none}}
@media(max-height:650px){
 #reelWrap,#fightWrap{width:290px;padding:12px 16px;bottom:45px}#reelSvg{max-height:120px}#captureChance{bottom:49px;font-size:19px}#gaugeCaption{bottom:31px;font-size:10px}#judgeLabel{font-size:17px;margin:4px 0}#reelWrap .gaugeTip{display:none}
 #fightJudgments{display:none}#fightSvg{max-height:128px}.fightScore{top:37px}.fightScore strong{font-size:25px}.fightScore span{font-size:9px}#fightEvent{margin:3px 0;font-size:14px}.fightHeading{font-size:17px}.fightRiskRow{margin:6px 0}#fightControl{min-height:43px}#fightOdds{margin-top:6px}
}

/* A special bite keeps the normal timing colors; the gold frame signals its stakes. */
#reelWrap.doubleChance,#fightWrap.doubleChance{border-color:#ffe396;box-shadow:0 7px 0 #523d38,0 0 28px #ffd2673d,inset 0 0 0 4px #ffe49920}
.doubleChanceBanner{margin:-5px -6px 10px;padding:6px 10px;border:1px solid #e5bd65;border-radius:12px;background:linear-gradient(110deg,#73562d,#3c4750);text-align:center;color:#fff0c0;line-height:1.35}
.doubleChanceBanner strong{display:block;font-size:18px;font-weight:400}.doubleChanceBanner strong b{display:inline-block;margin-left:6px;background:#ffe7a8;color:#573e31;border-radius:8px;padding:0 6px;font-size:19px}.doubleChanceBanner span{display:block;font-size:10px;color:#f0dfb6;margin-top:2px}
#biteAlert small{display:block;white-space:nowrap;font-size:23px;color:#ffe7a6;text-shadow:0 3px #483229;line-height:1.4}#gameDialog .eventResult{color:#ffe39c;margin-top:8px}#gameDialog .eventExplanation{font-family:'Gowun Dodum',sans-serif;font-size:11px;line-height:1.8;color:#e8d7ad;padding-top:10px;border-top:1px dashed #e4c27155}
#rodPanel{border-left:3px solid var(--rod-accent)}#rodPanel>span:first-child{width:55px;height:32px;display:inline-flex;align-items:center}#rodPanel svg{width:66px;height:36px;flex-shrink:0}
#gameDialog .rodCard{position:relative;display:grid;grid-template-columns:120px minmax(0,1fr) auto;border-left:3px solid var(--rod-accent);gap:14px}#gameDialog .rodPortrait{border-radius:12px;background:radial-gradient(ellipse,#48616c66,#142337);border:1px solid #c6e1db26;overflow:hidden}#gameDialog .rodPortrait svg{display:block;width:100%;height:92px}#gameDialog .rodFeatures{display:block;font-size:11px;line-height:1.6;margin-top:7px;color:var(--rod-accent)}
@media(max-width:760px){#gameDialog .rodCard{grid-template-columns:minmax(0,1fr) auto;gap:8px}#gameDialog .rodPortrait{grid-column:1/-1;height:76px}#gameDialog .rodPortrait svg{height:76px}#rodPanel>span:first-child{width:38px;height:22px}#rodPanel svg{width:46px;height:26px}}
@media(max-height:700px){.doubleChanceBanner{margin-bottom:5px;padding:3px}.doubleChanceBanner strong{font-size:15px}.doubleChanceBanner strong b{font-size:16px}.doubleChanceBanner span{font-size:9px}}
