@font-face{font-family:Rod;src:local('Trebuchet MS');font-display:swap}
:root{--cream:#f5eacb;--ink:#3f4734;--brown:#60452f;--muted:#787758;--gold:#dbb363;--green:#365b43;--dark:#243e35;--line:#d4c59e;--vh:100dvh;color-scheme:light}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;width:100%;height:100%;overflow:hidden;overscroll-behavior:none;background:#233f37;color:var(--ink);font-family:Rod,'Trebuchet MS',system-ui,sans-serif}button,input{font:inherit}button{cursor:pointer;touch-action:manipulation}button:disabled{cursor:default;opacity:.62}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #e5b75c;outline-offset:4px}button{border:0}button,input{border-radius:2px}button{color:inherit}svg{display:block}h1,h2,h3,p{margin:0}h1,h2,h3{font-family:Georgia,'Times New Roman',serif;font-weight:normal}h2{font-size:clamp(24px,5vw,34px);line-height:1.1}p{line-height:1.5}small{font-size:11px;line-height:1.5}button[hidden],[hidden]{display:none!important}
#game{position:fixed;inset:0;height:var(--vh);isolation:isolate;overflow:hidden;touch-action:none}#world{position:absolute;width:100%;height:100%;inset:0;image-rendering:pixelated;z-index:-3}.vignette{position:absolute;inset:0;z-index:-2;pointer-events:none;background:linear-gradient(#123d343b,transparent 35%,#173d3226 70%,#143127a6)}
#scene{height:100%;position:relative}.eyebrow{display:block;font:700 10px/1.4 'Trebuchet MS',sans-serif;letter-spacing:2.3px;text-transform:uppercase}.spark{color:#e6bb66}.wordmark{width:min(66vw,280px);color:#fff0c3;filter:drop-shadow(0 4px 0 #4c5132) drop-shadow(3px 0 0 #4c5132);margin:auto auto 15px}.tagline{color:#f8edcc;font-size:14px;letter-spacing:.15px;text-shadow:0 2px 2px #305346}.hero-copy{text-align:center}.hero-copy>.eyebrow{color:#e3e4bb;margin-bottom:20px}.hero-copy .quiet{color:#e1e5c9;font-size:11px;letter-spacing:1.2px;margin-top:10px}.welcome{height:100%;display:flex;flex-direction:column;justify-content:space-between;align-items:center;padding:max(22px,env(safe-area-inset-top)) 22px max(15px,env(safe-area-inset-bottom));gap:12px}.welcome-top{width:100%;display:flex;justify-content:space-between;color:#efebcc;align-items:center;font-size:10px;letter-spacing:1.2px}.small-brand{font-weight:800;letter-spacing:2px}.build-tag{border:1px solid #d7dfb44f;padding:5px 8px;background:#264b3c66}.welcome .hero-copy{margin-top:auto;margin-bottom:auto}.welcome .account-board{margin-top:auto}
.paper{background:#f4e8c9;box-shadow:0 3px 0 #cfba8a,0 5px 0 #674e34,0 11px 28px #17352c40;border:2px solid #7e6340;padding:24px;position:relative}.paper:before,.paper:after{content:'';position:absolute;width:5px;height:5px;top:8px;background:#9a8158;box-shadow:inset 1px 1px #d9bf87}.paper:before{left:9px}.paper:after{right:9px}.account-board{width:min(100%,370px);padding:21px 25px 17px;border:5px solid #805b38;box-shadow:0 0 0 2px #4f412d,0 5px 0 #55402d,0 10px 30px #163c3260;background:repeating-linear-gradient(0deg,#efdfba 0 54px,#ecdbb4 55px 56px)}.account-board h2{font-size:25px;text-align:center}.account-board .intro{text-align:center;font-size:11px;color:var(--muted);margin:6px 0 15px}.account-board label{display:block;font-weight:700;font-size:10px;text-transform:uppercase;letter-spacing:1px;margin:9px 0 5px}.account-board input{width:100%;border:1px solid #b8a780;box-shadow:inset 0 2px 0 #d8c6a3;background:#faf2db;padding:11px 12px;color:#394632;font-size:14px;min-height:42px;touch-action:auto}.account-board input::placeholder{color:#9b9277}.primary,.secondary{width:100%;min-height:46px;font-size:12px;font-weight:800;letter-spacing:.8px;text-transform:uppercase;border:2px solid #304d37;background:#466847;color:#fff0c9;box-shadow:0 3px 0 #29432f;padding:11px 16px;display:flex;align-items:center;justify-content:center;gap:10px}.primary:hover{background:#52774e}.primary:active,.secondary:active{transform:translateY(2px);box-shadow:0 1px 0 #29432f}.secondary{background:#e4d1a2;color:#5c4c32;border-color:#a18b61;box-shadow:0 3px 0 #826c48}.account-board .primary{margin-top:14px}.privacy{font-size:10px;color:#767356;text-align:center;margin:10px 0;line-height:1.45}.text-button{background:transparent;color:#4e6545;font-size:11px;text-decoration:underline;text-underline-offset:3px;padding:6px}.account-links{display:flex;justify-content:center;align-items:center;gap:8px}.practice-button{display:block;margin:7px auto 0;background:none;color:#4f6546;font-size:11px;letter-spacing:.3px;padding:7px 12px;border:1px dashed #a99d76}.form-error{font-size:11px;line-height:1.4;color:#8b4936;margin-top:10px}.checkmark{font-size:32px;display:block;text-align:center;color:#57704b;margin:10px 0}
#hud{position:absolute;top:max(14px,env(safe-area-inset-top));left:max(17px,env(safe-area-inset-left));right:max(17px,env(safe-area-inset-right));height:44px;display:flex;align-items:center;gap:10px;z-index:10;color:#fff0d0}.hud-title{flex:1;text-shadow:0 2px 2px #1e3f35}.hud-title strong{font:700 13px Georgia,serif;display:block}.hud-title small{font-size:9px;letter-spacing:1.3px;color:#d1dbb5;text-transform:uppercase}.icon-button{width:39px;height:39px;display:grid;place-items:center;background:#244a3de0;color:#ebdfb7;border:1px solid #9ca7776e;box-shadow:0 2px 0 #16372b}.icon{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:square;stroke-linejoin:miter}.gold{display:flex;align-items:center;gap:6px;border:1px solid #c5ae6c77;background:#294c39e0;padding:8px 10px;color:#f1cf77;font-size:12px;font-weight:700}.coin{width:13px;height:13px;display:inline-block;border:2px solid #f2d68c;background:#c69441;box-shadow:1px 1px 0 #765731;transform:rotate(45deg)}
#nav{position:absolute;bottom:max(13px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);display:flex;gap:4px;width:min(calc(100% - 30px),420px);background:#efdfb9;border:3px solid #725334;box-shadow:0 3px 0 #473b29,0 5px 15px #1d3f3266;padding:5px;z-index:10}#nav button{flex:1;background:none;font-size:9px;font-weight:700;color:#777651;text-transform:uppercase;letter-spacing:.9px;padding:6px 3px;display:grid;justify-items:center;gap:4px}#nav button.active{background:#d4d5aa;color:#3f6043;box-shadow:inset 0 0 0 1px #a7b07e}#nav .icon{width:19px;height:19px}
.scene-heading{position:absolute;top:clamp(78px,13vh,120px);left:24px;right:24px;text-align:center;color:#fff0c9;text-shadow:0 2px 3px #284f3b}.scene-heading .eyebrow{color:#d5dfba;margin-bottom:8px}.scene-heading p{font-size:12px;color:#e2e5bf;margin-top:8px}.setup{height:100%;display:grid;place-items:center;padding:24px}.setup .paper{max-width:380px;width:100%;padding:29px}.board-icon{display:flex;justify-content:center;margin-bottom:15px;color:#6d7c47}.board-icon .icon{width:32px;height:32px}.setup .eyebrow{text-align:center;color:#89905a;margin-bottom:8px}.setup h2{text-align:center}.setup .lead{text-align:center;font-size:12px;color:#7a7858;margin:9px 0 20px}.setup-step{display:flex;gap:13px;align-items:center;padding:13px 0;border-top:1px solid var(--line)}.setup-step .icon{flex-shrink:0;color:#778650;width:26px;height:26px}.setup-step strong{display:block;font-size:12px;margin-bottom:3px}.setup-step p{font-size:11px;color:#807b5c}.setup .primary{margin-top:15px}.setup .footnote{font-size:10px;color:#898062;text-align:center;margin-top:12px}
.map-location{position:absolute;transform:translate(-50%,-50%);background:none;display:flex;flex-direction:column;align-items:center;gap:8px;color:#f6eccb;min-width:130px}.map-marker{width:24px;height:24px;background:#e9c06c;border:3px solid #f6e0a2;box-shadow:0 0 0 2px #697d46,0 4px 0 #315342;transform:rotate(45deg);animation:marker-bob 3s ease-in-out infinite}.map-marker .dot{width:6px;height:6px;background:#526d43;display:block;margin:6px}.map-label{background:#f2e3bb;color:#465b3b;padding:9px 14px;border:2px solid #83653d;box-shadow:0 3px 0 #53462c;font:700 12px Georgia,serif;position:relative}.map-label small{display:block;text-transform:uppercase;letter-spacing:1px;font:700 8px 'Trebuchet MS',sans-serif;color:#889052;margin-top:4px}.map-location.locked{filter:saturate(.5);opacity:.8}.map-location.locked .map-label{font-size:11px;background:#e2d7b7}.map-location.locked .icon{width:17px;height:17px;color:#e7e3bf;filter:drop-shadow(0 2px #48644f)}.map-note{position:absolute;bottom:114px;left:20px;right:20px;text-align:center;color:#e3e4bd;font-size:10px;letter-spacing:1px}.map-note span{color:#d9b96d;margin-right:6px}@keyframes marker-bob{50%{translate:0 -4px}}
.hub-board{position:absolute;bottom:112px;left:50%;transform:translateX(-50%);width:min(calc(100% - 34px),430px);padding:23px 20px 18px}.hub-board .eyebrow{color:#929761;font-size:9px}.hub-board h2{margin-top:4px}.water-note{display:flex;align-items:center;gap:7px;font-size:10px;color:#838261;margin:8px 0 19px}.live-dot{width:5px;height:5px;background:#7c9754;box-shadow:0 0 0 3px #89994c20}.modes{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.mode{background:#ded4ad;border:1px solid #b9ad81;min-height:92px;padding:12px 4px;display:grid;justify-items:center;gap:7px}.mode .icon{width:26px;height:26px}.mode strong{font-size:11px;letter-spacing:1.3px}.mode small{font-size:9px;color:#888363}.mode.active{background:#54734b;color:#ffefbf;border:2px solid #3c593b;box-shadow:0 3px 0 #354e35}.mode.active small{color:#d7ddb0}.hub-shop{position:absolute;left:20%;top:45%;transform:translate(-50%,-50%);background:#a37b45;color:#f8e7b8;border:2px solid #614b31;padding:10px 16px;box-shadow:0 3px 0 #51422d;font-size:10px;font-weight:bold;letter-spacing:1.2px}.hub-shop:before{content:'';position:absolute;left:8px;top:-17px;width:2px;height:15px;background:#584b36}.pond-badge{position:absolute;right:6%;top:34%;border:1px solid #d3e0b24f;color:#e2e5bd;font-size:9px;padding:6px 9px;background:#355f4d80;letter-spacing:.7px}
.content-board{position:absolute;top:85px;bottom:110px;left:50%;transform:translateX(-50%);width:min(calc(100% - 32px),570px);display:flex;flex-direction:column;padding:23px 22px 16px;gap:12px}.content-board>.eyebrow{color:#8a9160;font-size:9px}.board-title{display:flex;align-items:center;justify-content:space-between;gap:12px}.board-title h2{font-size:27px}.board-title .icon{color:#8d955d;width:25px;height:25px}.board-intro{font-size:11px;color:#81795b}.tabs{display:flex;gap:5px}.tabs button{flex:1;background:#e6d8b4;color:#807656;border:1px solid #cabe95;font-weight:700;font-size:10px;padding:8px}.tabs button.active{background:#688052;color:#fff1c6;border-color:#597047}.items{flex:1;display:flex;flex-direction:column;justify-content:space-evenly;gap:8px;min-height:0}.item{display:flex;align-items:center;gap:12px;border-top:1px solid #d6c7a1;padding:12px 0}.item:first-child{border-top:0}.item-art{width:54px;height:54px;background:#e2d6b1;flex-shrink:0;display:grid;place-items:center;border:1px solid #cabc8e}.item-art .icon{width:30px;height:30px;color:#7b7f49}.item-copy{flex:1;min-width:0}.item-copy h3{font-family:'Trebuchet MS',sans-serif;font-weight:700;font-size:12px;line-height:1.3}.item-copy p{font-size:10px;color:#81775a;margin-top:4px;line-height:1.4}.item-action{background:#60794c;border:1px solid #4f663f;color:#fff1c3;font-size:10px;font-weight:700;min-width:65px;padding:9px 8px;white-space:nowrap;box-shadow:0 2px 0 #455e39}.item-action.equipped{color:#768250;background:transparent;box-shadow:none;border:1px solid #b7b78c}.pager{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #d3c299;padding-top:9px;font-size:10px;color:#8a805b}.pager button{background:#e3d4ac;border:1px solid #baaa7e;width:31px;height:27px;font-size:16px}.journal-fish{width:83px;height:47px;image-rendering:pixelated;flex-shrink:0}.record-size{font-size:12px;color:#657749;font-weight:700;white-space:nowrap}.unseen{opacity:.4;filter:brightness(.4)}.empty-records{margin:auto;text-align:center;padding:20px;max-width:330px}.empty-records .icon{margin:0 auto 20px;width:42px;height:42px;color:#9a9f6a}.empty-records p{font-size:12px;color:#82795e;margin:12px 0}.record-row{display:flex;align-items:center;gap:12px;border-top:1px solid var(--line);padding:10px 0}.rank-number{font:22px Georgia;color:#a39561}.records-footnote{font-size:10px;color:#8a805d;line-height:1.45;border-top:1px solid var(--line);padding-top:10px}
.fishing-top{position:absolute;top:85px;left:22px;right:22px;text-align:center;color:#fff0cd;text-shadow:0 2px 2px #274f40}.fishing-top .eyebrow{font-size:9px;color:#d5dfb4;margin-bottom:7px}.fishing-top h2{font-size:28px}.fishing-top p{font-size:12px;margin:8px auto 0;max-width:320px;color:#e3e8c5;line-height:1.5}.fishing-bottom{position:absolute;bottom:max(22px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);width:min(calc(100% - 36px),370px);text-align:center}.instruction-strip{background:#294d3ee8;border:1px solid #9dad7666;padding:13px 15px;color:#eee5ba;font-size:11px;line-height:1.5;box-shadow:0 3px 0 #1c382c}.fishing-bottom>.primary{background:#ead39c;color:#4a5334;border-color:#c3ac73;box-shadow:0 3px 0 #7d7549}.fishing-bottom .text-button{color:#e9e3bb;font-size:10px;display:inline-block;margin-top:8px}.practice-badge{display:inline-block;background:#264c3dd9;color:#d8dcb5;font-size:9px;letter-spacing:1.2px;padding:5px 8px;border:1px solid #a6b18150;margin-top:10px;text-transform:uppercase}.cast-hold{min-height:57px;touch-action:none;user-select:none;-webkit-user-select:none}.power-track{height:6px;background:#d7c9a0;overflow:hidden;margin-top:11px}.power-track span{display:block;background:#71874b;height:100%;width:0}.bite-alert{animation:bite-pulse .5s ease-in-out infinite alternate;color:#ffe1a0}.bite-alert h2{font-size:44px}.bite-flash{box-shadow:inset 0 0 0 5px #e0b96399}.fishing-bottom .strike-button{background:#cfaa61;color:#3f4930;font-size:16px;min-height:60px}.cast-readout{margin:12px auto;color:#eae9be;font-size:11px}.cast-readout strong{font-family:Georgia;font-size:24px;margin-right:4px}@keyframes bite-pulse{to{transform:scale(1.035);color:#fff0c6}}
.rotate-icon{width:65px;height:65px;margin:0 auto 15px;color:#e9d59d;animation:rotate-phone 2s ease-in-out infinite}.rotate-icon .icon{width:100%;height:100%}@keyframes rotate-phone{0%,20%{transform:rotate(0)}70%,100%{transform:rotate(90deg)}}
.fight-status{position:absolute;top:78px;left:25px;color:#f4e9c0;max-width:47%;text-shadow:0 2px 2px #234838}.fight-status .eyebrow{color:#d6dfb7;font-size:9px}.fight-status h2{margin-top:6px;font-size:26px}.fight-status p{font-size:11px;margin-top:7px;color:#d7e0bb}.fight-stats{position:absolute;left:max(25px,env(safe-area-inset-left));bottom:max(28px,env(safe-area-inset-bottom));width:44%;max-width:360px;color:#efe6c3}.distance-stat{font:30px Georgia,serif;margin-bottom:16px}.distance-stat small{font:9px 'Trebuchet MS';letter-spacing:1px;margin-left:5px}.tension-label{display:flex;justify-content:space-between;font-size:9px;letter-spacing:1px;margin-bottom:7px}.tension-track{height:12px;background:linear-gradient(90deg,#c29e52 0 13%,#6e925c 13% 76%,#c39a52 76% 90%,#b75f46 90%);border:2px solid #e6dfb4;position:relative;box-shadow:0 2px 0 #203f30}.tension-needle{height:18px;width:3px;background:#fff3ce;position:absolute;top:-5px;left:42%;box-shadow:1px 0 #284734}.tension-help{font-size:10px;color:#d6dfb8;margin-top:9px;min-height:28px}.stamina-label{font-size:8px;letter-spacing:1px;color:#c0d0a8;margin:12px 0 5px}.stamina-track{height:4px;background:#244d3e}.stamina-track span{height:100%;display:block;background:#aac18a;width:100%}.reel-wrap{position:absolute;right:max(9%,env(safe-area-inset-right));bottom:13%;width:min(31vw,220px);aspect-ratio:1;display:grid;place-items:center}.reel{width:100%;height:100%;border-radius:50%;background:radial-gradient(circle,#536347 0 10%,#d5bd7c 11% 16%,#3b5546 17% 26%,#263f35 27% 50%,#6e7451 51% 53%,#2c473a 54% 65%,#a58f5e 66% 71%,#d7bf82 72% 76%,#7a6d47 77%);box-shadow:0 6px 0 #243a2c,0 10px 25px #142f2c66;touch-action:none;position:relative;user-select:none}.reel:after{content:'';position:absolute;inset:27%;border:2px dashed #a0a67c;border-radius:50%;pointer-events:none}.reel-handle{position:absolute;left:50%;top:50%;width:38%;height:7px;background:#c6ad73;transform-origin:0 50%;box-shadow:0 2px #6f6041;pointer-events:none;z-index:2}.reel-handle:after{content:'';position:absolute;right:-7px;top:-7px;width:20px;height:20px;background:#6b4c33;border:3px solid #b39a64;box-shadow:0 2px #302e23;border-radius:40%}.reel-label{position:absolute;bottom:-29px;color:#eee6bb;font-size:9px;letter-spacing:1.6px;white-space:nowrap}.reel-arrow{position:absolute;top:-27px;color:#dce2bd;font-size:20px;opacity:.7}.rotate-back{position:absolute;inset:0;background:#294e40e8;display:grid;place-content:center;text-align:center;color:#eee5be;z-index:15;padding:28px}.rotate-back p{font-size:13px;margin:12px 0}
.result-screen{position:absolute;inset:0;display:grid;place-items:center;padding:24px;background:#143d3266;z-index:11}.result-card{width:min(100%,390px);text-align:center;padding:26px 24px}.result-card .eyebrow{color:#8f965f;font-size:9px}.result-card h2{margin:10px 0 4px;font-size:33px}.result-card .fish-large{display:block;margin:15px auto;width:230px;height:115px;image-rendering:pixelated;filter:drop-shadow(0 6px #ad9d6a33)}.catch-measures{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:12px 0;margin-bottom:13px}.catch-measures strong{font:27px Georgia,serif}.catch-measures small{display:block;color:#8c805c;letter-spacing:1px;text-transform:uppercase;font-size:8px;margin-top:3px}.catch-measures div+div{border-left:1px solid var(--line)}.reward-line{display:flex;justify-content:center;gap:20px;font-size:12px;color:#7c814a;margin:12px 0 18px}.pb-badge{font-size:9px;letter-spacing:1.1px;color:#8e6f34;background:#e9d7a1;display:inline-block;padding:5px 10px;margin-top:7px;border:1px solid #cabb82}.result-card .text-button{margin-top:10px}.lost-fish{margin:25px auto 20px;color:#87925d}.lost-fish .icon{width:45px;height:45px;margin:auto}.result-card .loss-reason{font-size:12px;color:#83785b;line-height:1.6;margin:14px 0 24px}
#toast{position:absolute;bottom:110px;left:50%;transform:translateX(-50%) translateY(12px);background:#253f31f5;color:#f4e7b9;border:1px solid #a09c69;font-size:11px;line-height:1.5;padding:11px 16px;max-width:min(90%,380px);width:max-content;text-align:center;box-shadow:0 4px 14px #193b2e50;opacity:0;pointer-events:none;transition:.2s;z-index:40}#toast.show{opacity:1;transform:translateX(-50%)}dialog{padding:25px;border:3px solid #785d3a;background:#f3e5c2;color:var(--ink);width:min(88vw,380px);max-height:90dvh;box-shadow:0 9px 35px #173c3277}dialog::backdrop{background:#173b3299}dialog h2{margin-bottom:13px}dialog p{font-size:12px;margin-bottom:13px}dialog button{margin-top:10px}dialog .text-button{display:block;margin:auto}#debug{position:absolute;top:64px;bottom:80px;left:12px;right:12px;max-width:420px;overflow:auto;background:#18372ef5;border:1px solid #c4cc9a;color:#e5ebc8;z-index:50;padding:16px;font:10px/1.8 ui-monospace,monospace;touch-action:pan-y}#debug button{padding:8px;margin-right:5px;background:#d6d7ac;color:#354b34}#debug h3{font:15px Georgia;margin-bottom:10px}#pause{position:absolute;inset:0;z-index:60;background:#193e32bb;display:grid;place-items:center;padding:24px}#pause .paper{max-width:360px;text-align:center}#pause h2{margin:10px 0}#pause p{font-size:12px;margin-bottom:20px}
@media(min-width:760px) and (min-height:600px){.welcome{padding:28px 46px 23px;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto 1fr auto;gap:20px 8%;align-items:center}.welcome-top{grid-column:1/-1}.welcome .hero-copy{grid-column:1;grid-row:2;margin:0 auto 50px;max-width:430px}.wordmark{width:350px;margin-bottom:26px}.hero-copy .tagline{font-size:17px}.hero-copy>.eyebrow{margin-bottom:26px}.hero-copy .quiet{margin-top:18px}.welcome .account-board{grid-column:2;grid-row:2;margin:20px auto 0;padding:29px 28px 22px;max-width:380px}.account-board input{min-height:46px}.account-board h2{font-size:29px}.account-board .intro{margin-bottom:23px}.account-board .privacy{margin:14px 0}.account-board .primary{margin-top:20px}.scene-heading{top:100px}.scene-heading h2{font-size:39px}.hub-board{bottom:120px;width:470px}.hub-shop{left:28%;top:56%}.pond-badge{right:23%;top:45%}.map-location.active{left:49%!important}.content-board{top:100px;bottom:120px}.fishing-top{top:100px}.fishing-top h2{font-size:34px}.fishing-bottom{bottom:35px}.map-note{bottom:120px}}
@media(max-height:740px) and (orientation:portrait){.welcome{padding-top:max(15px,env(safe-area-inset-top));gap:8px}.hero-copy>.eyebrow{margin-bottom:10px;font-size:9px}.wordmark{width:205px;margin-bottom:10px}.tagline{font-size:12px}.hero-copy .quiet{display:none}.account-board{padding:16px 21px 12px}.account-board h2{font-size:23px}.account-board .intro{margin:5px 0 10px}.account-board input{min-height:38px;padding:8px 10px}.account-board label{margin:7px 0 4px;font-size:9px}.account-board .primary{min-height:41px;margin-top:10px}.privacy{font-size:9px;margin:7px 0}.practice-button{margin-top:2px;padding:5px 9px}.content-board{top:76px;bottom:99px;padding:18px 17px 13px;gap:8px}.item{padding:7px 0}.item-art{width:43px;height:43px}.item-copy p{font-size:9px}.board-intro{font-size:10px}.board-title h2{font-size:24px}.scene-heading{top:82px}.scene-heading h2{font-size:27px}.scene-heading p{font-size:11px}.hub-board{bottom:101px;padding:19px 17px 14px}.hub-board h2{font-size:26px}.mode{min-height:82px}.water-note{margin-bottom:12px}.result-card{padding:20px}.result-card .fish-large{width:180px;height:90px;margin:9px auto}.result-card h2{font-size:29px}.setup .paper{padding:23px}.setup-step{padding:10px 0}.setup .lead{margin-bottom:14px}}
@media(max-height:590px) and (orientation:portrait){.welcome .hero-copy>.eyebrow,.wordmark{width:155px;margin-bottom:7px}.account-board .intro{display:none}.account-board h2{font-size:22px}.welcome .hero-copy{margin:2px auto}.welcome .account-board{margin:0 auto}.welcome-top{font-size:8px}.privacy{font-size:8px}.content-board{gap:6px}.board-intro{display:none}.item-copy p{display:none}.scene-heading p{display:none}.setup-step p{font-size:10px}.setup .lead{font-size:10px}.setup .board-icon{display:none}.result-card .fish-large{width:140px;height:70px}.result-card{padding:17px}.result-card h2{font-size:26px}.result-card .catch-measures{padding:9px 0}.result-card .reward-line{margin:9px 0}.fishing-top h2{font-size:25px}}
@media(orientation:landscape) and (max-height:599px){.welcome{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto 1fr auto;padding:12px 28px;gap:8px 35px}.welcome-top{grid-column:1/-1;font-size:8px}.welcome .hero-copy{grid-column:1;grid-row:2;margin:0 auto}.wordmark{width:190px;margin-bottom:12px}.hero-copy .eyebrow{font-size:8px;margin-bottom:12px}.hero-copy .quiet{display:none}.tagline{font-size:11px}.welcome .account-board{grid-column:2;grid-row:2;margin:0 auto;padding:12px 20px 10px;max-width:330px}.account-board h2{font-size:22px}.account-board .intro{display:none}.account-board label{font-size:8px;margin-top:5px}.account-board input{padding:7px 9px;min-height:33px;font-size:12px}.account-board .primary{margin-top:10px;min-height:35px;padding:7px}.privacy{font-size:8px;margin:7px 0}.text-button{font-size:10px;padding:3px}.practice-button{font-size:9px;padding:5px 8px;margin-top:4px}.form-error{font-size:9px}.scene-heading{top:64px;left:16px;right:auto;text-align:left;max-width:35%}.scene-heading h2{font-size:25px}.scene-heading p{font-size:10px}.scene-heading .eyebrow{font-size:8px}.hub-board{width:360px;right:35px;left:auto;transform:none;bottom:83px;padding:17px}.hub-board h2{font-size:24px}.hub-board .water-note{margin-bottom:10px}.mode{min-height:70px;padding:9px 3px;gap:5px}.mode .icon{width:22px;height:22px}.hub-shop{top:58%;left:24%}.pond-badge{top:38%;right:15%}#nav{bottom:max(8px,env(safe-area-inset-bottom));width:310px;padding:3px}#nav button{padding:4px;font-size:8px;gap:3px}#nav .icon{width:16px;height:16px}#hud{top:max(9px,env(safe-area-inset-top));height:34px;left:max(20px,env(safe-area-inset-left));right:max(20px,env(safe-area-inset-right))}.icon-button{width:33px;height:33px}.hud-title strong{font-size:12px}.hud-title small{font-size:8px}.gold{padding:6px 8px}.map-location .map-label{padding:6px 9px;font-size:10px}.map-label small{font-size:7px}.map-marker{width:18px;height:18px}.map-marker .dot{margin:3px}.map-note{left:20px;right:auto;bottom:22px;font-size:8px}.map-location.locked .map-label{font-size:9px}.content-board{top:53px;bottom:73px;width:min(calc(100% - 130px),660px);padding:13px 20px;gap:7px}.content-board>.eyebrow,.board-intro{display:none}.board-title h2{font-size:24px}.tabs{position:absolute;top:15px;right:20px;width:210px}.items{flex-direction:row;align-items:stretch;gap:15px}.item{flex:1;flex-direction:column;align-items:flex-start;gap:7px;padding:7px 0 0;border:0}.item-art{display:none}.item-copy h3{font-size:11px}.item-copy p{font-size:9px}.item-action{padding:6px 9px;font-size:9px;min-width:65px}.pager{padding-top:4px}.journal-fish{width:70px;height:35px}.record-size{font-size:10px}.empty-records{padding:0}.empty-records .icon{display:none}.empty-records p{font-size:10px;margin:7px 0}.records-footnote{font-size:9px;padding-top:6px}.record-row{padding:3px}.setup .paper{width:560px;max-width:90vw;padding:18px 25px}.setup .board-icon,.setup .lead{display:none}.setup .eyebrow{font-size:8px;margin-bottom:4px}.setup h2{font-size:25px;margin-bottom:8px}.setup-step{padding:7px 0;gap:12px}.setup-step strong{font-size:11px}.setup-step p{font-size:10px}.setup-step .icon{width:21px;height:21px}.setup .primary{min-height:37px;margin-top:10px;padding:8px}.setup .footnote{font-size:9px;margin-top:7px}.fishing-top{left:25px;top:63px;right:auto;max-width:42%;text-align:left}.fishing-top h2{font-size:25px}.fishing-top p{font-size:11px;max-width:260px}.fishing-bottom{right:30px;left:auto;transform:none;bottom:25px;width:260px}.fishing-top .eyebrow{font-size:8px}.instruction-strip{font-size:10px}.cast-readout strong{font-size:22px}.fight-status{top:61px;left:25px}.fight-status h2{font-size:25px}.fight-stats{bottom:23px}.distance-stat{font-size:25px;margin-bottom:9px}.reel-wrap{width:min(29vw,210px);bottom:17%;right:12%}.tension-help{margin-top:7px}.stamina-label{margin-top:7px}.result-card{width:540px;padding:18px 25px;display:grid;grid-template-columns:1fr 1fr;gap:8px 20px;align-items:center}.result-card>.eyebrow{grid-column:1/-1;font-size:8px}.result-card h2{grid-column:1;font-size:26px;margin:0}.result-card .pb-badge{grid-column:1;margin:0 auto;font-size:8px}.result-card .fish-large{grid-column:1;width:180px;height:80px;grid-row:3 / span 2;margin:0 auto}.result-card .catch-measures{grid-column:2;grid-row:2/span 2;margin:0;padding:10px 0}.catch-measures strong{font-size:24px}.result-card .reward-line{grid-column:2;margin:4px 0;font-size:11px}.result-card .primary{grid-column:2;min-height:39px;padding:8px}.result-card .text-button{grid-column:1;margin:0}.result-card .loss-reason{margin:5px 0;font-size:11px;grid-column:1/-1}.result-card .lost-fish{grid-column:1/-1;margin:2px auto}.result-card .lost-fish .icon{width:28px;height:28px}.result-card.loss h2{grid-column:1/-1}.result-card.loss .primary{grid-column:1/-1}#toast{bottom:80px}#debug{top:50px;bottom:15px;max-width:520px}}
@media(orientation:portrait){.reel-wrap{width:46vw;max-width:230px;right:8%;bottom:29%}.fight-stats{width:calc(100% - 50px);max-width:none;bottom:max(35px,env(safe-area-inset-bottom))}.fight-status{max-width:85%}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
/* Pocket Rod 0.2: illustrated world, pond pegs and first-person float fishing. */
#game{user-select:none;-webkit-user-select:none}#game input{user-select:text;-webkit-user-select:text}
.vignette{background:linear-gradient(#123d3433,transparent 23%,transparent 72%,#14312766)}
.world-heading{top:82px;pointer-events:none}
.world-heading h2{font-size:clamp(25px,5vw,34px)}
.world-heading .eyebrow{font-size:8px;margin-bottom:5px}
.world-heading p{font-size:11px;margin-top:5px}
.map-location{min-width:0;gap:6px;max-width:150px;z-index:2}
.map-location.active{left:var(--marker-x)!important;z-index:3}
.map-location .map-label{padding:7px 10px;font-size:11px;white-space:nowrap}
.map-location .map-label small{font-size:7px;letter-spacing:.6px}
.map-location.locked{opacity:.93;filter:none;gap:3px}
.map-location.locked .map-label{font:10px Georgia,serif;background:#244f43e8;color:#f1e6c4;border:1px solid #d1c59888;box-shadow:0 2px 0 #193e33;padding:5px 7px}
.map-location.locked small{color:#c6d1aa;font-size:6px;letter-spacing:.6px;margin-top:3px}
.map-location.locked .icon{width:13px;height:13px}
.map-note{font-size:9px;bottom:107px;text-shadow:0 2px 3px #153d32}
.pond-heading{top:77px;pointer-events:none}
.pond-heading .eyebrow{font-size:7px;letter-spacing:1.1px;margin-bottom:5px}
.pond-heading h2{font-size:28px}
.peg-markers{position:absolute;inset:0;pointer-events:none}
.pond-marker{position:absolute;transform:translate(-50%,-50%);display:flex;align-items:center;flex-direction:column;gap:5px;background:transparent;min-width:74px;min-height:62px;padding:4px;pointer-events:auto;z-index:2;color:#f8edc8}
.peg-number{display:grid;place-items:center;width:30px;height:30px;background:#2b5848;border:2px solid #dfd9a6;box-shadow:0 0 0 2px #234735,0 3px 0 #1b3e32;font:700 16px Georgia,serif}
.peg-label{font:700 10px 'Trebuchet MS',sans-serif;background:#234f42f0;padding:5px 7px;border:1px solid #b9c194aa;box-shadow:0 2px 0 #203e30;white-space:nowrap}
.pond-marker.selected .peg-number{background:#e6bf6d;color:#34523a;border-color:#f9e5ad;box-shadow:0 0 0 2px #715d38,0 3px 0 #234735}
.pond-marker.selected .peg-label{background:#f4e4b7;color:#405936;border-color:#ba9c5e}
.peg-card{position:absolute;bottom:102px;left:50%;transform:translateX(-50%);width:min(calc(100% - 30px),400px);padding:17px 17px 14px}
.peg-summary{display:flex;align-items:center;gap:12px}
.peg-thumbnail{width:78px;height:67px;object-fit:cover;image-rendering:pixelated;border:2px solid #8a8055;box-shadow:0 2px #cabc8d}
.peg-summary .eyebrow{font-size:7px;letter-spacing:1.1px;color:#81894e;margin-bottom:4px}
.peg-summary h2{font-size:25px}
.peg-summary p{font-size:9px;line-height:1.5;color:#7d7858;margin-top:5px}
.peg-description{font-size:10px;color:#777657;line-height:1.5;margin:10px 0 7px}
.peg-fish{display:flex;align-items:center;gap:5px;font-size:9px;color:#5c7045;margin:8px 0 11px}
.peg-fish .icon{width:13px;height:13px}
.peg-card .primary{min-height:44px;font-size:11px}
.cast-surface{position:absolute;inset:0;width:100%;height:100%;background:transparent;border:0;box-shadow:none;touch-action:none;user-select:none;-webkit-user-select:none;cursor:grab}
.cast-surface:active{cursor:grabbing}
.casting-back{position:absolute;top:max(16px,env(safe-area-inset-top));left:max(16px,env(safe-area-inset-left));width:44px;height:44px;background:#173b3125;color:#fbf1d4;opacity:.65;display:grid;place-items:center;z-index:4}
.casting-back:hover,.casting-back:focus-visible{opacity:1;background:#173b31a0}
.swim-intro{position:absolute;left:50%;transform:translateX(-50%);bottom:max(25px,env(safe-area-inset-bottom));width:min(calc(100% - 36px),365px);padding:21px 22px 15px;text-align:center}
.swim-intro .eyebrow{color:#8a9159;font-size:8px}
.swim-intro h2{font-size:28px;margin:6px 0 9px}
.swim-intro p{font-size:11px;color:#737457;margin-bottom:16px;line-height:1.65}
.control-choice{display:flex;justify-content:center;align-items:center;gap:8px;font-size:9px;color:#8a805e;margin-top:11px}
.control-choice .text-button{font-size:9px;padding:6px}
.float-note{position:absolute;top:84px;left:20px;right:20px;color:#f6edce;text-shadow:0 2px 3px #143b30;font-size:11px;text-align:center;letter-spacing:.3px}
.reel{border:3px solid #5a6755;background:radial-gradient(circle at 34% 26%,#e7e8c52b,transparent 55%),radial-gradient(circle,#233b32 0 7%,#bba26c 8% 10%,#e0cd94 11% 14%,#667867 15% 17%,#304c40 18% 48%,#263e34 49% 52%,#8c9b7a 53% 54%,#344d40 55% 64%,#a89b70 65% 68%,#e1cd96 69% 71%,#897f5c 72% 74%,#c1b585 75% 77%,#56674f 78%);box-shadow:inset 2px 2px 0 #d9d4a5aa,inset -3px -4px 0 #172f2b88,0 4px 0 #8a805b,0 7px 0 #243b2e,0 12px 23px #142f2c77}
.reel:before{content:'';position:absolute;inset:17%;border-radius:50%;background:repeating-conic-gradient(#152e27 0 11deg,transparent 12deg 45deg);mask:radial-gradient(transparent 0 54%,#000 55% 72%,transparent 73%);opacity:.7;pointer-events:none}
.reel:after{border-color:#bdc69a77;border-style:dotted}
.reel-handle{background:linear-gradient(#e2cc91,#9b8656 70%,#d5c087);height:8px;box-shadow:0 2px 0 #213b2e,0 4px 3px #182e2980}
.reel-handle:after{background:linear-gradient(100deg,#3a4536,#6d7353 40%,#2d3b30);border-color:#c1b685;box-shadow:1px 2px 0 #172d26,inset 1px 1px #a0aa7b}
#game[data-fishing="ready"] .vignette,#game[data-fishing="cast_primed"] .vignette,#game[data-fishing="casting"] .vignette,#game[data-fishing="line_in_air"] .vignette{background:linear-gradient(#143d3215,transparent 70%,#143d3233)}
@media(max-height:720px) and (orientation:portrait){.peg-description{display:none}.peg-thumbnail{width:64px;height:54px}.peg-card{padding:14px 16px 12px;bottom:97px}.peg-summary h2{font-size:23px}.peg-summary p{font-size:8px}.peg-fish{margin:8px 0}.pond-heading{top:72px}.pond-heading h2{font-size:24px}.pond-heading .eyebrow{display:none}.world-heading{top:76px}.world-heading p{font-size:10px}.world-heading .eyebrow{display:none}}
@media(max-height:600px) and (orientation:portrait){.pond-heading{display:none}}
@media(min-width:760px) and (min-height:600px){.world-heading{top:93px}.pond-heading{top:78px}.map-note{bottom:109px}}
@media(orientation:landscape){.pond-heading{left:20px;right:49%;top:59px}.pond-heading .eyebrow{display:none}.pond-heading h2{font-size:22px}.peg-card{left:auto;right:25px;transform:none;bottom:80px;width: min(40%,340px);padding:15px 17px 12px}.peg-description{font-size:9px;margin:8px 0 6px}.peg-thumbnail{width:66px;height:55px}.peg-summary h2{font-size:23px}.peg-fish{font-size:8px;margin:8px 0}.peg-card .primary{min-height:39px;padding:8px}.world-heading{left:25px;right:auto;top:65px;text-align:left;max-width:29%}.world-heading h2{font-size:26px}.world-heading .eyebrow{display:none}.world-heading p{font-size:10px}.map-location.locked .map-label{font-size:9px}.map-note{bottom:24px;left:24px;right:auto;font-size:8px}.pond-marker{min-width:65px;min-height:54px}.peg-number{width:26px;height:26px;font-size:14px}.peg-label{font-size:9px}.swim-intro{left:auto;right:25px;transform:none;bottom:24px;width:310px;padding:17px 20px 12px}.swim-intro h2{font-size:24px}.swim-intro p{font-size:10px;margin-bottom:12px}.swim-intro .primary{min-height:39px}.control-choice{margin-top:6px}.float-note{text-align:left;top:62px;left:26px;right:auto}}
/* Readable fight information and portrait-led peg selection. */
.fight-status,.fight-stats{background:#203b32f5;border:1px solid #bac29999;box-shadow:0 3px 0 #142e26,0 7px 20px #15382a40;text-shadow:none;padding:12px 15px}
.fight-status h2{font-size:24px}
.fight-status .eyebrow{color:#e4c88b}
.fight-status p{color:#f0eacb}
.fight-stats{padding:14px 16px;color:#fff0cc}
.tension-help{color:#e2e9ca;font-size:11px}
.stamina-label{color:#d0dfb7}
.reel-label{background:#203b32f5;border:1px solid #bac29999;box-shadow:0 2px 0 #142e26;padding:7px 10px;bottom:-39px;color:#f4ebcc;letter-spacing:1px}
#game[data-fishing="fighting"] .hud-title{background:#203b32ed;border:1px solid #bac29966;padding:6px 10px;text-shadow:none;flex:0 1 auto}
#game[data-fishing="fighting"] .gold{margin-left:auto}
@media(orientation:portrait){
  .pond-marker{min-width:84px;min-height:70px}
  .peg-number{width:34px;height:34px;font-size:18px}
  .peg-label{font-size:11px;padding:6px 8px}
  .peg-summary p{font-size:11px}
  .peg-description{font-size:12px;line-height:1.5}
  .peg-fish{font-size:11px;margin:10px 0 13px}
  .peg-summary .eyebrow{font-size:8px}
  .peg-card .primary{font-size:12px;min-height:46px}
  .fight-status{top:79px;left:20px;right:20px;max-width:none}
  .fight-status h2{font-size:25px}
  .fight-stats{left:20px;width:calc(100% - 40px);bottom:max(25px,env(safe-area-inset-bottom))}
  .reel-wrap{bottom:35%}
}
@media(max-height:720px) and (orientation:portrait){
  .pond-heading{top:65px}.pond-heading h2{font-size:20px}
  .pond-marker{min-width:78px;min-height:64px}
  .peg-number{width:30px;height:30px;font-size:16px}
  .peg-label{font-size:10px;padding:5px 7px}
  .peg-summary p{font-size:10px}
  .peg-summary .eyebrow{font-size:7px}
  .peg-fish{font-size:10px;margin:8px 0 10px}
  .peg-card .primary{font-size:11px;min-height:44px}
  .fight-status{top:67px;left:16px;right:16px;padding:10px 12px}
  .fight-status h2{font-size:22px}.fight-status p{font-size:10px}
  .fight-stats{left:16px;width:calc(100% - 32px);bottom:18px;padding:10px 12px}
  .distance-stat{font-size:26px;margin-bottom:9px}
  .reel-wrap{width:42vw;right:10%;bottom:40%}
  .reel-label{font-size:8px;letter-spacing:.6px}
}
@media(orientation:landscape){.fight-status{padding:10px 13px}.fight-status h2{font-size:23px}.fight-status p{font-size:11px}.fight-stats{padding:12px 14px}.tension-help{font-size:10px}.reel-label{font-size:9px}}
@media(orientation:landscape) and (max-width:700px){.fight-status h2{font-size:20px}.fight-status p{font-size:10px}.fight-stats{padding:10px 12px}.fight-status{max-width:46%}.distance-stat{font-size:23px;margin-bottom:8px}.reel-label{font-size:8px;letter-spacing:.6px}}
/* 0.2.1: solid text surfaces; separate reeling columns in short landscape views. */
:root{--muted:#596047;--paper-muted:#596047;--panel:#203b32;--panel-text:#fff0ce;--panel-soft:#e2e8c8}
button:disabled{opacity:1}
.primary:hover{background:#456746}
.paper :is(p,small,.eyebrow,.board-intro,.privacy,.record-size,.rank-number,.pager,.reward-line,.peg-fish,.peg-description){color:var(--paper-muted)}
.paper .form-error{color:#843c2d}
.paper .text-button,.paper .practice-button{color:#36583c}
.control-choice{color:var(--paper-muted)}
.paper .item-action{background:#456442;color:#fff1cc}
.paper .item-action.equipped{background:#e5dbba;color:#425a39}
.paper .tabs button{color:#48563b}
.paper .tabs button.active{background:#456442;color:#fff1cc}
.paper .pb-badge{color:#67502c}
.paper .pager button:disabled{color:#596047;background:#e5dbba}
.paper .pager button{color:#4b533b}
.account-board{background:#f2e4c2}
.account-board input{font-size:16px;background:#faf2db;color:#354731}
.account-board input::placeholder{color:#62664f;opacity:1}
.account-board label{font-size:11px}
.account-board .intro,.privacy{font-size:11px}
.welcome{justify-content:space-evenly;gap:12px;overflow-y:auto;touch-action:pan-y;overscroll-behavior:contain}
.welcome>*{flex-shrink:0}
.welcome .hero-copy{width:min(100%,430px);margin:0 auto;padding:14px;background:var(--panel);border:1px solid #b6bf8c88;box-shadow:0 3px 0 #142c25}
.hero-copy>.eyebrow{color:#efd79d;font-size:9px;margin-bottom:12px}
.hero-copy .wordmark{width:min(59vw,260px);margin:0 auto 12px}
.hero-copy .tagline{color:#fff0ce;text-shadow:none}
.hero-copy .quiet{color:#e2e8c8;letter-spacing:.4px}
.welcome .account-board{margin:0 auto}
.small-brand,.build-tag,
.small-brand{font-size:9px;letter-spacing:1px}
.build-tag{font-size:8px;letter-spacing:.5px}

.hud-title,#game[data-fishing="fighting"] .hud-title{background:var(--panel);border:1px solid #b6bf8c88;padding:6px 9px;text-shadow:none;min-width:0;flex:1}
.hud-title strong{overflow-wrap:anywhere}
.hud-title small{color:var(--panel-soft);letter-spacing:.7px}
.icon-button,.gold{background:var(--panel);flex-shrink:0}
#nav button{color:#4c573d;font-size:10px}
#nav button.active{color:#304d37}
.scene-heading{background:var(--panel);border:1px solid #b6bf8c88;box-shadow:0 3px 0 #142c25;text-shadow:none;padding:9px 14px;width:fit-content;max-width:calc(100% - 40px);margin:0 auto}
.scene-heading .eyebrow,.scene-heading p{color:var(--panel-soft)}
.world-heading .eyebrow,.pond-heading .eyebrow{display:none}
.pond-heading h2{font-size:24px}
.map-note{background:var(--panel);border:1px solid #b6bf8c77;padding:7px 10px;color:var(--panel-soft);width:max-content;max-width:calc(100% - 40px);margin:0 auto;text-shadow:none}
.map-location.active .map-label small{color:#52603e}
.map-location.locked{opacity:1}
.map-location.locked .map-label{background:#244f43}
.map-location.locked .map-label small{color:#e2e8c8}
.peg-label{background:#234f42}
.float-note,.fishing-top{background:var(--panel);color:var(--panel-text);border:1px solid #b6bf8caa;box-shadow:0 3px 0 #142c25;text-shadow:none;padding:11px 15px;line-height:1.45;width:fit-content;max-width:min(calc(100% - 40px),380px);left:20px;right:20px;margin:0 auto}
.float-note{font-size:12px;pointer-events:none}
.fishing-top .eyebrow,.fishing-top p{color:var(--panel-soft)}
.fishing-top h2{font-size:26px}
.fishing-top.bite-alert h2{font-size:36px;color:#ffcf83}
.cast-readout{background:var(--panel);color:var(--panel-text);border:1px solid #b6bf8c99;box-shadow:0 2px 0 #142c25;padding:7px 12px;width:fit-content;max-width:100%;font-size:12px}
.instruction-strip,.reel-label,.fight-status,.fight-stats,#toast,#debug,.rotate-back{background:var(--panel)}
.fishing-bottom>.primary:hover{background:#ead39c;color:#3a4b32}
.fishing-bottom .strike-button,.fishing-bottom .strike-button:hover{background:#cfaa61;color:#253c2c}
.fight-layout,.fight-right,.fight-reel-stage{display:contents}
.future-waters{display:none}
.fight-status,.fight-stats{color:var(--panel-text)}
.fight-status p,.tension-help,.stamina-label{color:var(--panel-soft)}
.reel-arrow{background:var(--panel);border:1px solid #b6bf8c88;width:22px;height:22px;display:grid;place-items:center;opacity:1}
.tension-label,.stamina-label,.distance-stat small{font-size:10px}
.catch-measures small,.pb-badge,.content-board>.eyebrow{font-size:10px}
.map-location.locked .map-label small{font-size:8px}
.map-location.active .map-label small{font-size:9px}
.hud-title small{font-size:9px}
.content-board{overflow:auto;touch-action:pan-y;overscroll-behavior:contain}
.content-board .items{flex:1 0 auto}
.content-board>*{flex-shrink:0}
.content-board .item-copy p{font-size:11px}
.setup,.result-screen,#pause{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;overflow:auto;touch-action:pan-y}
.setup .paper,.result-card,#pause .paper{flex-shrink:0;margin:auto}
.swim-intro{max-height:calc(var(--vh) - 90px);overflow:auto;touch-action:pan-y}
@media(orientation:portrait){
  .item-copy p{font-size:11px}
  .board-intro{font-size:12px}
  .records-footnote{font-size:11px}
}
@media(max-width:360px){.hud-title small{display:none}.hud-title strong{font-size:12px}#hud{gap:7px}}
@media(max-height:600px) and (orientation:portrait){
  .world-heading p{display:none}.world-heading h2{font-size:22px}
  .welcome{padding:16px;gap:12px}.hero-copy>.eyebrow{display:none}
}
@media(orientation:landscape){
  .welcome{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);gap:10px 24px;align-items:start;padding:12px 24px}
  .welcome-top{grid-column:1/-1}
  .welcome .hero-copy{grid-column:1;grid-row:2;padding:18px;margin:0 auto;align-self:center}
  .welcome .account-board{grid-column:2;grid-row:2;margin:0 auto;max-width:380px;width:100%;padding:20px;align-self:center}
  .hero-copy .wordmark{width:min(30vw,260px)}
  .world-heading{margin:0;max-width:29%}
  .pond-heading{max-width:45%}
  .float-note{top:58px;text-align:center}
  .fishing-top{left:20px;right:auto;margin:0;max-width:min(43%,360px);text-align:left;top:58px}
  .fishing-top h2{font-size:24px}
  .fight-layout{position:absolute;top:max(56px,calc(env(safe-area-inset-top) + 48px));bottom:max(12px,env(safe-area-inset-bottom));left:max(18px,env(safe-area-inset-left));right:max(18px,env(safe-area-inset-right));display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(18px,5vw,60px)}
  .fight-layout .fight-stats{position:static;align-self:end;width:100%;max-width:400px;max-height:100%;padding:12px 14px;overflow:auto;touch-action:pan-y}
  .fight-right{display:flex;flex-direction:column;gap:8px;min-height:0;min-width:0}
  .fight-layout .fight-status{position:static;flex-shrink:0;width:100%;max-width:none;padding:8px 11px}
  .fight-layout .fight-status h2{font-size:20px;margin:3px 0 0}
  .fight-layout .fight-status p{font-size:11px;line-height:1.35;margin-top:4px}
  .fight-layout .fight-status .eyebrow{font-size:9px;letter-spacing:1.1px}
  .fight-reel-stage{display:flex;align-items:center;justify-content:center;flex:1;min-height:0;padding:16px 0 34px}
  .fight-layout .reel-wrap{position:relative;inset:auto;width:auto;height:100%;max-height:220px;aspect-ratio:1;max-width:100%;flex-shrink:0}
  .fight-layout .reel-label{bottom:-31px;left:50%;transform:translateX(-50%);padding:6px 9px;font-size:10px;letter-spacing:.6px}
  .fight-layout .reel-arrow{top:-21px;font-size:16px}
}
@media(orientation:landscape) and (max-height:360px){
  .fight-layout{top:max(52px,calc(env(safe-area-inset-top) + 44px));bottom:max(10px,env(safe-area-inset-bottom));gap:24px}
  .fight-layout .fight-status .eyebrow{display:none}
  .fight-layout .fight-status h2{font-size:18px;margin:0}
  .fight-layout .fight-status p{font-size:11px}
  .fight-layout .fight-stats{padding:10px 12px}
  .fight-layout .distance-stat{font-size:23px;margin-bottom:8px}
  .fight-layout .tension-help{min-height:24px;font-size:10px}
  .fight-layout .stamina-label{margin-top:7px}
  .fight-layout .reel-label{font-size:10px}
  .float-note{top:52px;padding:8px 12px;font-size:11px}
  .fishing-top .rotate-icon{width:40px;height:40px;margin-bottom:8px}
  .map-note{display:none}
}



/* Water/style collections stay readable and scroll as a single board. */
.progress-board{gap:11px}
.progress-board .board-title h2{font-size:25px}
.progress-selectors{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:10px}
.progress-selectors .scope-field{min-width:0;font-size:10px;letter-spacing:.7px;font-weight:bold;color:#4e5b40;display:flex;flex-direction:column;gap:5px}
.progress-selectors .scope-trigger{width:100%;min-width:0;min-height:42px;border:1px solid #a79870;background:#fff6dc;color:#344731;padding:8px;font:12px 'Trebuchet MS',sans-serif;border-radius:0;touch-action:manipulation}

.progress-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:1px solid #b6a87d;background:#e8dbb6}
.progress-summary.tutorial-progress{grid-template-columns:repeat(3,minmax(0,1fr))}
.progress-summary>div{display:flex;flex-direction:column;text-align:center;padding:9px 3px;gap:4px}
.progress-summary>div+div{border-left:1px solid #b6a87d}
.progress-summary strong{font:20px Georgia,serif;color:#314b34}
.progress-summary span{font-size:10px;color:#4f593d}
.progress-summary .progress-xp{background:var(--panel);justify-content:center}
.progress-summary .progress-xp strong{color:#f4e8c6;font-size:clamp(16px,5.2vw,20px)}
.progress-summary .progress-xp span{display:flex;align-items:center;justify-content:center;gap:4px;color:#c5dfac;font-weight:bold;line-height:1}
.xp-symbol{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.compact-board-title h2{flex:1;min-width:0;white-space:nowrap;line-height:1.2}
.compact-board-title .icon{flex-shrink:0}
.scope-note{font-size:11px;line-height:1.45;color:#505b40}
.tackle-board .item-actions{grid-column:2;display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.tackle-board .item-actions .item-action{margin-top:0;padding:8px 10px}
.paper .item-action.bait-refill{background:#e5dbba;color:#314b34;border-color:#8d9b70;box-shadow:0 2px 0 #b5a77d}
.tackle-board .bait-supply{color:#365337;font-weight:bold;font-size:10px}
.cast-readout{display:flex;align-items:center;justify-content:center;gap:12px;padding:6px 12px}
.cast-distance{white-space:nowrap}
.cast-bait{display:flex;align-items:center;gap:5px}
.cast-bait .tackle-art{width:38px;height:34px;grid-row:auto;border:0;background:#e8dbb6;box-shadow:none}
.cast-readout .bait-quantity{font:700 16px 'Trebuchet MS',sans-serif;white-space:nowrap}
.casting-bait{position:absolute;bottom:max(22px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);pointer-events:none}
.casting-bait.with-cast-button{bottom:max(112px,calc(env(safe-area-inset-bottom) + 100px))}
.casting-bait .cast-readout{margin:0}
@media(orientation:landscape){
  .casting-bait,.casting-bait.with-cast-button{left:max(25px,env(safe-area-inset-left));bottom:max(20px,env(safe-area-inset-bottom));transform:none}
  .tackle-board .item-actions{margin-top:auto}
}
.progress-board .tabs{position:static;width:100%}
.progress-board .items{flex:1 0 auto}
.progress-board .item{min-height:86px}
.progress-board .record-size small{display:block;font-size:9px;font-weight:normal;margin-top:4px;color:#526046}
.fish-mystery{width:112px;height:56px;flex-shrink:0;display:grid;place-items:center;font:34px Georgia,serif;color:#65734e;border:1px dashed #a29b74;background:#e5d9b7}
.fish-trophies{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px}
.fish-trophies span{font-size:9px;line-height:1.4;padding:2px 4px;color:#596047;border:1px solid #b7ad8a;background:#e9dfc3}
.fish-trophies .earned{color:#4e3b20;background:#eed5a1;border-color:#b68c47}
.peg-fish{line-height:1.45}
@media(max-width:360px){
  .progress-selectors{gap:7px;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr)}
  .progress-selectors .scope-trigger{font-size:11px;padding:7px 4px}
  .progress-board .board-title h2{font-size:23px}
  .fish-mystery{width:84px;height:42px}
}
@media(orientation:landscape){
  .progress-board{width:min(calc(100% - 90px),760px);gap:9px}
  .progress-selectors{gap:12px}
  .progress-selectors .scope-field{flex-direction:row;align-items:center;gap:8px}
  .progress-selectors .scope-trigger{min-height:36px}
  .progress-summary>div{padding:6px 3px}
  .progress-summary strong{font-size:18px}
  .progress-board .items{gap:14px}
  .progress-board .item{min-height:0}
  .progress-board .record-row{flex-direction:column;align-items:flex-start;flex:1}
  .progress-board .journal-fish,.fish-mystery{width:110px;height:55px}
  .progress-board .item-copy p{display:block;font-size:11px}
  .progress-board .fish-trophies{gap:3px}
}
@media(orientation:landscape) and (max-height:500px){
  .world-heading{left:16px;top:64px;max-width:24%;padding:8px 10px}
  .world-heading h2{font-size:22px}.world-heading p{display:none}
  .map-location.locked .map-label{display:none}
  .map-location.locked{min-width:30px;min-height:30px;justify-content:center}
  .future-waters{display:block;position:absolute;right:16px;top:64px;bottom:82px;width:min(28%,210px);padding:10px;background:var(--panel);border:1px solid #b6bf8c88;overflow:auto;touch-action:pan-y}
  .future-waters .eyebrow{font-size:9px;letter-spacing:1px;color:var(--panel-soft)}
  .future-waters ul{list-style:none;margin:5px 0 0;padding:0}
  .future-waters li{font-size:11px;line-height:1.4;color:var(--panel-text);border-top:1px solid #b6bf8c44;padding:6px 0}
}

/* Portrait puts information above the reel, with the largest fitting square
   down near the thumb and clear of the bottom safe area. */
.fight-layout{position:absolute;top:max(76px,calc(env(safe-area-inset-top) + 64px));bottom:max(18px,env(safe-area-inset-bottom));left:max(18px,env(safe-area-inset-left));right:max(18px,env(safe-area-inset-right));display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);gap:14px}
.fight-layout .fight-stats{position:static;inset:auto;grid-row:1;width:100%;max-width:none;max-height:100%;align-self:end;padding:12px 14px;overflow:auto;touch-action:pan-y}
.fight-right{display:flex;grid-row:2;flex-direction:column;min-height:0;min-width:0;gap:0}
.fight-reel-stage{display:flex;align-items:center;justify-content:center;flex:1;min-height:0;padding:24px 0 38px}
.fight-layout .reel-wrap{position:relative;inset:auto;width:var(--reel-size,0px);height:var(--reel-size,0px);max-width:none;max-height:none;aspect-ratio:1;flex-shrink:0}
.fight-layout .reel-label{bottom:-31px;left:50%;transform:translateX(-50%);padding:6px 9px;font-size:10px;letter-spacing:.6px}
.fight-layout .reel-arrow{top:-23px;font-size:16px}
.reel-handle{will-change:transform;backface-visibility:hidden}
.field-guide .fish-size-tabs{position:static;width:100%;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}
.fish-size-tabs button{min-height:36px;padding:7px 3px}
.field-guide .journal-fish{width:112px;height:56px}
.catch-size{font-size:12px;color:var(--muted);margin:0 0 4px}
.discovery-message{display:block;color:#36543a;font-size:10px;font-weight:bold;margin-top:5px;letter-spacing:.5px}
.result-card .fish-large{width:min(100%,290px);height:auto;aspect-ratio:2}
.result-card .fish-large[data-size="trophy"]{width:min(100%,310px)}
@media(orientation:portrait){.fight-layout .fight-reel-stage{align-items:flex-end}}
@media(orientation:portrait) and (max-width:360px){.field-guide .item{gap:8px}.field-guide .journal-fish{width:84px;height:42px}.field-guide .record-size{font-size:10px}}
@media(orientation:landscape){
  .fight-layout{top:max(56px,calc(env(safe-area-inset-top) + 48px));bottom:max(12px,env(safe-area-inset-bottom));grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:minmax(0,1fr);gap:clamp(18px,5vw,60px)}
  .fight-layout .fight-stats{grid-row:1;max-width:440px}
  .fight-right{grid-row:1;grid-column:2}
  .field-guide .journal-fish{width:min(100%,135px);height:auto;aspect-ratio:2}
  .result-card:not(.loss){grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"heading heading" "name measures" "size measures" "badge rewards" "fish cast" "release release";gap:6px 18px}
  .result-card:not(.loss)>.eyebrow{grid-area:heading}
  .result-card:not(.loss)>h2{grid-area:name}
  .result-card .catch-size{grid-area:size;font-size:11px}
  .result-card .fish-large{grid-area:fish;width:min(100%,230px);height:auto;aspect-ratio:2}
  .result-card:not(.loss) .pb-badge{grid-area:badge}
  .result-card:not(.loss) .catch-measures{grid-area:measures}
  .result-card:not(.loss) .reward-line{grid-area:rewards}
  .result-card:not(.loss)>.primary{grid-area:cast}
  .result-card:not(.loss)>.text-button{grid-area:release}
}
@media(orientation:landscape) and (max-height:360px){
  .fight-layout{top:max(52px,calc(env(safe-area-inset-top) + 44px));bottom:max(10px,env(safe-area-inset-bottom));gap:24px}
  .fight-layout .fight-stats{padding:10px 12px}
  .fight-reel-stage{padding:24px 0 34px}
  .field-guide .journal-fish{width:96px;height:48px}
  .field-guide .items{gap:8px}
  .fish-size-tabs button{min-height:30px}
}

/* Keep recovery and settings reachable above the orientation prompt. */
#game[data-scene="fishing"] #hud{z-index:20}
.reset-cast-button{flex-shrink:0;min-height:39px;padding:7px 10px;font-size:11px;font-weight:bold;background:var(--panel);color:var(--panel-text);border:1px solid #b6bf8c99;box-shadow:0 2px 0 #142c25;touch-action:manipulation}
.casting-tools{position:absolute;top:max(14px,env(safe-area-inset-top));left:max(17px,env(safe-area-inset-left));right:max(17px,env(safe-area-inset-right));display:flex;align-items:center;justify-content:space-between;gap:12px;z-index:20;pointer-events:none}
.casting-tools>div{display:flex;align-items:center;gap:9px}
.casting-tools button{pointer-events:auto}
.cast-button{position:absolute;left:50%;transform:translateX(-50%);bottom:max(25px,env(safe-area-inset-bottom));width:min(235px,calc(100% - 44px));min-height:70px;touch-action:none;user-select:none;box-shadow:0 4px 0 #1d392b;z-index:5;padding:12px 16px;background:#d9bb77;color:#253e2d;border:2px solid #ede0aa}
.cast-button strong{display:block;font-size:18px;letter-spacing:2px}
.cast-button small{display:block;font-size:10px;letter-spacing:.2px;margin-top:5px}
.cast-charge{display:block;height:4px;background:#7e8054;margin-top:9px;pointer-events:none}
.cast-charge span{display:block;height:100%;width:0;background:#2f583a}
#settings{width:min(calc(100% - 32px),430px);max-height:calc(var(--vh) - 32px);overflow:auto;overscroll-behavior:contain;touch-action:pan-y}
#settings .eyebrow{color:#526146;font-size:10px}
#settings h2{font-size:27px;line-height:1.2}
.settings-options{display:flex;flex-direction:column;gap:8px;margin:15px 0}
#settings .settings-toggle{display:flex;align-items:center;gap:10px;width:100%;margin:0;padding:12px 10px;text-align:left;background:#e9dfc1;color:#304b35;border:1px solid #ad9f78;min-height:65px}
.settings-copy{flex:1;min-width:0}
.settings-copy strong{display:block;font-size:13px}
.settings-copy small{display:block;font-size:11px;color:#505a40;line-height:1.4;margin-top:4px}
.switch-track{width:35px;height:20px;flex-shrink:0;background:#74775f;border:1px solid #596249;position:relative}
.switch-track span{position:absolute;width:12px;height:12px;left:3px;top:3px;background:#fff1ca;transition:transform .12s}
[aria-checked="true"] .switch-track{background:#436e49;border-color:#305638}
[aria-checked="true"] .switch-track span{transform:translateX(14px)}
.switch-state{width:20px;flex-shrink:0;font-size:10px;text-align:center}
#settings .settings-account{font-size:11px;line-height:1.4;color:#505a40;margin:10px 0}
@media(orientation:portrait){
  .fight-layout .fight-stats{padding:12px 14px}
  .fight-layout .distance-stat{margin-bottom:10px;font-size:27px}
  .fight-layout .tension-help{min-height:30px;font-size:11px;line-height:1.4}
  .fight-layout .stamina-label{margin-top:8px}
  .fight-layout .fight-reel-stage{padding:24px 0 38px}
}
@media(orientation:landscape){
  .casting-tools{top:max(9px,env(safe-area-inset-top));left:max(20px,env(safe-area-inset-left));right:max(20px,env(safe-area-inset-right))}
  .reset-cast-button{min-height:33px;padding:6px 9px}
  .cast-button{left:auto;right:max(25px,env(safe-area-inset-right));transform:none;bottom:max(20px,env(safe-area-inset-bottom));width:210px;min-height:63px}
}
@media(orientation:portrait) and (max-height:640px){
  .fight-layout{gap:9px}
  .fight-layout .fight-stats{padding:9px 12px}
  .fight-layout .distance-stat{font-size:23px;margin-bottom:7px}
  .fight-layout .tension-help{min-height:26px;margin-top:7px}
  .fight-layout .stamina-label{margin-top:5px}
  .fight-layout .fight-reel-stage{padding:22px 0 34px}
}
@media(prefers-reduced-motion:reduce){.switch-track span{transition:none}}

/* 0.7: a compact swim card leaves the peg labels clear. */
.peg-card{bottom:max(90px,calc(env(safe-area-inset-bottom) + 78px));padding:12px 14px;max-height:calc(var(--vh) - 160px);overflow:auto;touch-action:pan-y;overscroll-behavior:contain}
.peg-summary{gap:10px}
.peg-thumbnail{width:58px;height:60px;flex-shrink:0}
.peg-summary h2{font-size:23px}
.peg-summary .eyebrow{font-size:8px;letter-spacing:1px;margin-bottom:3px}
.peg-summary p{font-size:11px;line-height:1.35;margin-top:4px}
.peg-fish{font-size:11px;line-height:1.4;margin:8px 0 10px}
.peg-fish .icon{flex-shrink:0}
.peg-card .primary{font-size:11px;min-height:44px;padding:9px 12px}
@media(orientation:portrait) and (max-height:720px){.pond-heading{display:none}.peg-summary h2{font-size:22px}.peg-thumbnail{height:54px}}
@media(orientation:landscape){.peg-card{bottom:max(74px,calc(env(safe-area-inset-bottom) + 64px));max-height:calc(var(--vh) - 135px)}.peg-summary p,.peg-fish{font-size:10px}.peg-summary h2{font-size:22px}.peg-thumbnail{width:52px;height:54px}.peg-card .primary{min-height:39px}}
.swim-methods{display:flex;gap:6px;margin:0 0 9px}
.swim-methods button{flex:1;min-height:36px;padding:7px 12px;background:#e8dabb;border:1px solid #b7a880;color:#3d563d;font-size:12px;font-weight:700}
.swim-methods button.active{background:#466847;border-color:#304d37;color:#fff0c9}
.progress-board .item-copy .fish-size-requirement{display:block;font-size:12px;line-height:1.4;color:#304e38;margin-top:6px;padding:3px 0}
.fish-size-requirement strong{font-weight:700}
@media(orientation:portrait) and (max-height:600px){.peg-card{max-height:calc(var(--vh) * .35)}.peg-card .primary{position:sticky;bottom:0}.pond-marker{min-height:54px;padding:2px;gap:3px}.peg-number{width:26px;height:26px;font-size:15px}.peg-label{font-size:10px;padding:4px 6px}.swim-methods button{min-height:32px;padding:6px}}

/* Illustrated tackle stays visible in both phone orientations. */
.tackle-board .items{justify-content:flex-start;gap:0}
.tackle-board .tackle-item{display:grid;grid-template-columns:62px minmax(0,1fr);grid-template-rows:auto auto;align-items:center;gap:6px 12px;padding:10px 0;min-height:96px}
.tackle-art{grid-row:1 / 3;width:62px;height:55px;display:grid;grid-template:minmax(0,1fr) / minmax(0,1fr);place-items:center;overflow:hidden;background:radial-gradient(ellipse at 45% 35%,#fff5d8,#e4d5ae);border:1px solid #c5b181;box-shadow:inset 0 0 0 3px #f6e7c555,0 2px 0 #b8a27833}
.tackle-art img{display:block;width:100%;height:100%;object-fit:contain;padding:3px;image-rendering:pixelated}
.tackle-art canvas{display:block;width:100%;height:100%;object-fit:contain;image-rendering:pixelated}
.tackle-art img,.tackle-art canvas{min-width:0;min-height:0;max-width:100%;max-height:100%}
.is-equipped .tackle-art{border-color:#688553;box-shadow:inset 0 0 0 2px #79965b55}
.tackle-board .item-copy{align-self:end}
.tackle-board .item-copy h3{font-size:14px;color:#294833}
.tackle-board .item-copy p{display:block;font-size:11px;line-height:1.5;color:#514e39}
.tackle-board .item-copy .rod-finish{font-size:10px;line-height:1.4;color:#4e6946;margin-top:5px}
.tackle-board .item-action{grid-column:2;justify-self:start;align-self:start;min-height:36px;font-size:11px;padding:8px 13px}
@media(max-width:380px){
  .tackle-board .tackle-item{grid-template-columns:47px minmax(0,1fr);gap:6px 10px;min-height:96px}
  .tackle-art{width:47px;height:50px}
  .tackle-board .item-copy h3{font-size:13px}
}
@media(orientation:landscape){
  .tackle-board .items{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;align-items:stretch}
  .tackle-board .tackle-item{display:flex;flex-direction:column;align-items:stretch;padding:8px 0 0;gap:8px}
  .tackle-board .tackle-art{width:50%;height:56px;flex-shrink:0}
  .tackle-board .tackle-art img{width:100%;max-width:73px;justify-self:center}
  .tackle-board .tackle-art canvas{width:100%;max-width:105px}
  .tackle-board .item-copy{align-self:stretch}
  .tackle-board .item-action{align-self:flex-start;margin-top:auto}
}

/* The pond fills the viewport; measured UI bounds keep every peg accessible. */
#game[data-scene="hub"] .pond-heading{display:block;left:50%;right:auto;transform:translateX(-50%);width:max-content;max-width:calc(100% - 32px);margin:0;padding:8px 15px;pointer-events:none}
#game[data-scene="hub"] .pond-heading h2{font-size:24px;line-height:1.1}
#game[data-scene="hub"] .pond-marker{max-width:calc(100% - 24px)}
@media(orientation:landscape){
  #game[data-scene="hub"] .pond-heading{left:18px;transform:none;max-width:45%;padding:7px 12px}
  #game[data-scene="hub"] .pond-heading h2{font-size:21px}
}
@media(orientation:portrait) and (max-height:640px){
  #game[data-scene="hub"] .pond-heading{padding:6px 12px}
  #game[data-scene="hub"] .pond-heading h2{font-size:21px}
}
@media(orientation:landscape) and (max-height:360px){
  .pond-marker{min-height:44px;padding:2px;gap:2px}
  .peg-number{width:22px;height:22px;font-size:13px}
  .peg-label{font-size:9px;line-height:12px;padding:1px 5px}
}

/* Leave clear water above the shared reel so the spinning tip stays visible. */
.retrieve-layout{padding-top:clamp(110px,calc(var(--vh) * .2),220px)}
.retrieve-stats #retrieve-status{display:block;font-size:13px;line-height:1.3;color:var(--panel-text)}
.retrieve-stats #retrieve-hint{min-height:30px;font-size:11px;line-height:1.4;margin:5px 0;color:var(--panel-soft)}
.retrieve-strike-slot{min-height:48px}
.retrieve-stats .strike-button{min-height:44px;padding:8px 12px;font-size:12px}
.retrieve-stats.is-hit{border-color:#efd080;box-shadow:0 0 0 2px #e0b85c99}
@media(orientation:landscape){.retrieve-layout{padding-top:0}.retrieve-stats .distance-stat{margin-bottom:7px}}
@media(orientation:portrait) and (max-height:640px){
  .retrieve-layout{padding-top:100px;gap:8px}
  .retrieve-layout .retrieve-stats{padding:8px 12px}
  .retrieve-layout .distance-stat{margin-bottom:5px;font-size:23px}
  .retrieve-strike-slot{min-height:44px}
}

/* Keep the welcome screen within the visible phone area; allow overflow only
   when the keyboard, enlarged text or a very short display needs it. */
@media(orientation:portrait) and (max-height:650px){
  .welcome{gap:10px;padding-top:max(12px,env(safe-area-inset-top));padding-bottom:max(12px,env(safe-area-inset-bottom))}
  .welcome .hero-copy{padding:10px 14px}
  .hero-copy .wordmark{width:min(52vw,190px);margin-bottom:8px}
  .hero-copy .tagline{font-size:12px}
  .welcome .account-board{padding:14px 20px 12px}
}
@media(orientation:landscape) and (max-height:599px){
  .welcome .account-board{padding:12px 16px 10px}
}
@media(orientation:landscape) and (max-height:360px){
  .welcome{grid-template-rows:minmax(0,1fr);padding-top:10px;padding-bottom:10px}
  .welcome-top{display:none}
  .welcome .hero-copy,.welcome .account-board{grid-row:1}
  .welcome .account-board{padding:8px 12px}
  .welcome .account-board h2{font-size:20px}
  .welcome .account-board .privacy{font-size:10px;line-height:1.35;margin:6px 0}
}

/* Game-drawn water and style pickers replace platform-native select menus. */
.progress-selectors .scope-trigger{display:flex;align-items:center;justify-content:space-between;gap:8px;text-align:left;min-height:44px;padding:10px;background:#f8edcf;border:1px solid #9b885e;box-shadow:inset 0 1px #fff7df,0 2px 0 #c3b084;color:#304c39;font-size:12px;letter-spacing:0}
.scope-trigger>span{min-width:0;overflow-wrap:anywhere}
.scope-trigger .icon{width:15px;height:15px;flex-shrink:0;color:#796238}
.scope-trigger[aria-expanded="true"]{border-color:#3e6245;background:#e5e6c9}
.scope-trigger[aria-expanded="true"] .icon{transform:rotate(180deg)}
.scope-picker{padding:0;border:2px solid #80633e;border-radius:0;width:min(440px,calc(100vw - 32px));max-width:none;max-height:calc(var(--vh) - max(16px,env(safe-area-inset-top)) - max(16px,env(safe-area-inset-bottom)));margin:auto;background:#f4e8c9;color:#304b38;box-shadow:0 0 0 2px #dac28a,0 5px 0 #493e2c,0 18px 60px #102b2570;overflow:hidden;touch-action:pan-y}
.scope-picker[open]{display:flex;flex-direction:column;animation:picker-appear .14s ease-out}
.scope-picker button,.scope-picker h2{margin:0}
.scope-picker::backdrop{background:#102a24a6}
.scope-picker-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 16px 16px;background:#203b32;border-bottom:3px solid #c8aa68;color:#fff0ce;flex-shrink:0}
.scope-picker-header .eyebrow{font-size:8px;color:#e4cb8e;letter-spacing:1.5px;margin-bottom:7px}
.scope-picker-header h2{font-size:25px;line-height:1.15;color:#fff0ce}
.scope-picker-close{width:44px;height:44px;display:grid;place-items:center;flex-shrink:0;border:1px solid #ae9d6e;background:#2c493c;color:#fff0ce;box-shadow:0 2px 0 #142c25}
.scope-picker-close .icon{width:19px;height:19px}
.scope-picker-options{display:flex;flex-direction:column;gap:6px;padding:12px;overflow-y:auto;overscroll-behavior:contain;min-height:0;touch-action:pan-y}
.scope-option{display:flex;align-items:center;gap:10px;min-height:62px;flex-shrink:0;width:100%;padding:10px 12px;border:1px solid #c5b485;background:#ede0bc;color:#304c39;text-align:left;box-shadow:inset 0 1px #fff5d9}
.scope-option-icon{display:grid;place-items:center;width:32px;height:34px;flex-shrink:0;border:1px solid #ac9d73;background:#e3d5ac;color:#566646}
.scope-option-icon .icon{width:21px;height:21px}
.scope-option-copy{display:flex;flex-direction:column;gap:3px;flex:1;min-width:0}
.scope-option-copy strong{font:700 14px/1.25 'Trebuchet MS',sans-serif;overflow-wrap:anywhere}
.scope-option-copy small{font-size:10px;line-height:1.4;color:#576048}
.scope-option-state{display:flex;align-items:center;gap:4px;flex-shrink:0;font-size:9px;letter-spacing:.2px;color:#675b3e}
.scope-option-state .icon{width:16px;height:16px}
.scope-option[aria-pressed="true"]{border-color:#284735;background:#426345;color:#fff1d0;box-shadow:inset 0 0 0 1px #7f9460,0 2px 0 #243e2d}
.scope-option[aria-pressed="true"] .scope-option-icon{border-color:#b7ad77;background:#2d4b37;color:#f1d796}
.scope-option[aria-pressed="true"] small{color:#f0eaca}
.scope-option[aria-pressed="true"] .scope-option-state{color:#ffe3a0}
.scope-option:disabled{background:#e5d9b8;border-color:#c8bb94;color:#595c48;box-shadow:none;cursor:default}
.scope-option:disabled .scope-option-icon{background:#dfd2ad;border-color:#bbad86;color:#746848}
.scope-option:disabled small{color:#595c48}
.scope-option:not(:disabled):hover{outline:2px solid #a88a4f;outline-offset:-3px}
.scope-picker-note{margin:0;padding:9px 16px 12px;border-top:1px solid #c9b98e;background:#eadcba;font-size:10px;line-height:1.5;color:#4e5a40;flex-shrink:0}
.scope-picker button:focus-visible{outline:3px solid #c99c43;outline-offset:-4px}
.scope-picker .scope-option:focus-visible{outline-color:#294b38;outline-offset:2px}
@keyframes picker-appear{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@media(orientation:portrait){.scope-picker{margin:auto auto max(16px,env(safe-area-inset-bottom))}}
@media(max-width:360px){.scope-option{padding:9px 8px;gap:7px}.scope-option-copy strong{font-size:13px}.scope-option-state span{display:none}.scope-picker-header h2{font-size:23px}.scope-option-state{font-size:9px}}
@media(orientation:landscape) and (max-height:450px){.scope-picker{width:min(520px,calc(100vw - 40px))}.scope-picker-header{padding:10px 14px}.scope-picker-header h2{font-size:22px}.scope-picker-header .eyebrow{margin-bottom:3px}.scope-picker-options{padding:8px;gap:5px}.scope-option{min-height:50px;padding:7px 10px}.scope-option-icon{height:30px}.scope-picker-note{padding:6px 14px}}
@media(prefers-reduced-motion:reduce){.scope-picker[open]{animation:none}}
/* Rowan's guide reserves space for the lesson while controls stay touchable. */
#tutorial-guide{position:absolute;z-index:30;left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));pointer-events:none}
#tutorial-guide[hidden]{display:none}
.tutorial-card{pointer-events:auto;background:#203d32;color:#fff0ce;border:2px solid #c3a365;box-shadow:0 3px 0 #102b24,0 5px 18px #132f2655;padding:12px 14px}
.tutorial-caption{display:flex;justify-content:space-between;gap:8px;font-size:9px;letter-spacing:1px;color:#eed28d;font-weight:700}
.tutorial-caption small{font:inherit;white-space:nowrap}
.tutorial-card h2{font-size:22px;line-height:1.15;margin:7px 0 6px;color:#fff0ce}
.tutorial-card p{font-size:12px;line-height:1.5;margin:0;color:#f4edcf}
.tutorial-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:10px}
.tutorial-actions .primary{width:auto;flex-shrink:0;min-height:40px;min-width:90px;padding:8px 16px;font-size:12px;background:#e7ca85;color:#243e2c;border:1px solid #ffebaf;box-shadow:0 2px 0 #a98e56}
.tutorial-actions .primary:disabled{background:#3f5644;color:#cad1b5;border-color:#6d805c;box-shadow:none;opacity:1}
.tutorial-pause{min-height:40px;padding:8px 0;color:#e8e4c6;background:transparent;font-size:11px;text-decoration:underline;text-underline-offset:3px}
.tutorial-highlight{outline:3px solid #ffdd84!important;outline-offset:4px!important;filter:drop-shadow(0 0 5px #ffdf85);animation:tutorial-glow 1.4s ease-in-out infinite;scroll-margin:14px}
@keyframes tutorial-glow{50%{outline-color:#fff6cc;filter:drop-shadow(0 0 8px #ffdf85)}}
#game[data-tutorial] .world-heading,#game[data-tutorial] .pond-heading{visibility:hidden}
#game[data-tutorial] .content-board{top:calc(var(--guide-bottom,240px) + 14px)}
#game[data-tutorial="fishing"] .fight-layout{top:calc(var(--guide-bottom,180px) + 12px)}
#game[data-tutorial="fishing"] .float-note,#game[data-tutorial="fishing"] .fishing-top{top:calc(var(--guide-bottom,180px) + 12px)}
#tutorial-guide[data-compact="true"] .tutorial-card{padding:9px 12px}
#tutorial-guide[data-compact="true"] .tutorial-card h2{font-size:18px;margin:5px 0}
#tutorial-guide[data-compact="true"] .tutorial-card p{font-size:11px;line-height:1.4}
#tutorial-guide[data-compact="true"] .tutorial-actions{margin-top:5px}
#tutorial-guide[data-compact="true"] .tutorial-actions button{min-height:32px;padding-top:5px;padding-bottom:5px}
#game[data-tutorial="fishing"] .swim-intro{max-height:calc(var(--vh) - var(--guide-bottom,180px) - 30px);overflow:auto}
#game[data-tutorial="fishing"] .result-screen{padding-top:calc(var(--guide-bottom,180px) + 12px);align-items:center}
#game[data-tutorial="fishing"] .result-card{max-height:100%;overflow:auto;touch-action:pan-y}
.map-note.tutorial-entry{display:block!important;padding:3px 12px;max-width:calc(100% - 36px)}
.tutorial-entry .text-button{min-height:36px;color:#fff0ce;font-size:11px}
.map-location.tutorial-water .map-marker{border-color:#f2d58c;background:#436445}
.leaderboard-link{align-self:flex-start;min-height:40px}
.leaderboard-board{justify-content:center;gap:18px}
.leaderboard-board p{font-size:13px;line-height:1.6}
@media(orientation:landscape){
 #tutorial-guide{right:auto;width:30%;max-width:310px}
 #game[data-tutorial="active"] .content-board{top:max(60px,calc(env(safe-area-inset-top) + 50px));left:auto;right:20px;transform:none;width:calc(66% - 28px)}
 #tutorial-guide[data-compact="true"]{width:auto;max-width:none;right:max(12px,env(safe-area-inset-right))}
 #tutorial-guide[data-compact="true"] .tutorial-card{display:grid;grid-template-columns:1fr auto;gap:0 14px}
 #tutorial-guide[data-compact="true"] .tutorial-caption{grid-column:1/-1;font-size:8px}
 #tutorial-guide[data-compact="true"] .tutorial-card h2{display:none}
 #tutorial-guide[data-compact="true"] .tutorial-card p{margin-top:6px}
 #tutorial-guide[data-compact="true"] .tutorial-actions{gap:14px;align-self:center}
 #game[data-tutorial="active"] .tabs{position:static;width:auto}
 .tutorial-card h2{font-size:20px}.tutorial-card p{font-size:11px}
 .tutorial-card{padding:10px 12px}
 .map-note.tutorial-entry{bottom:8px;left:12px}
}
@media(max-width:360px){.tutorial-card{padding:10px 12px}.tutorial-card h2{font-size:20px}.tutorial-card p{font-size:11px}.tutorial-caption{font-size:8px}}
@media(prefers-reduced-motion:reduce){.tutorial-highlight{animation:none}}
/* Keep Rowan brief during the action, with clear water for the spinning tip. */
#tutorial-guide[data-action="true"] .tutorial-card h2{display:none}
#tutorial-guide[data-action="true"] .tutorial-card{position:relative;padding-right:78px}
#tutorial-guide[data-action="true"] .tutorial-caption{font-size:8px}
#tutorial-guide[data-action="true"] .tutorial-card p{margin-top:5px}
#tutorial-guide[data-action="true"] .tutorial-actions{position:absolute;right:12px;top:50%;transform:translateY(-50%);margin:0}
#tutorial-guide[data-action="true"] .tutorial-actions .primary{display:none}
#tutorial-guide[data-action="true"] .tutorial-pause{width:56px;font-size:10px;line-height:1.4}
#game[data-tutorial="fishing"] .retrieve-layout{top:calc(var(--guide-bottom,140px) + 64px);padding-top:0}
/* Compact portrait retrieval info; the hit button uses the clear space below
   the panel so the reel and pointer capture stay put throughout a strike. */
@media(orientation:portrait){
 .retrieve-layout{row-gap:58px}
 .fight-layout .retrieve-stats{position:relative;padding:10px 12px;overflow:visible}
 .retrieve-stats .distance-stat{font-size:26px;line-height:1.1;margin-bottom:6px}
 .retrieve-stats .distance-stat small{font-size:9px}
 .retrieve-stats #retrieve-status{font-size:12px;line-height:1.3}
 .retrieve-stats #retrieve-hint{min-height:0;margin:4px 0 0;font-size:11px;line-height:1.4}
 .retrieve-strike-slot{position:absolute;top:calc(100% + 8px);right:0;width:min(180px,100%);min-height:0}
 .retrieve-stats .strike-button{width:100%;margin:0;min-height:44px}
}