@import url('/assets/fonts/fonts.css');
:root{font-family:'DM Sans',Arial,sans-serif;color:#153d49;background:#f4f0e5;color-scheme:light;--gold:#ffce74;--teal:#165c64}*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button,a,input{touch-action:manipulation}button{min-height:44px;padding:10px 17px;border:1px solid #b8c7bf;background:#fffdf4;color:#153d49;border-radius:10px;cursor:pointer}button:hover{background:#e1eee7}button:disabled{opacity:.5;cursor:default}button:focus-visible,input:focus-visible,a:focus-visible{outline:3px solid #b75b23;outline-offset:4px}a{color:inherit;text-decoration:none}header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 4%;border-bottom:1px solid #d6ded3;background:#fffcf4}header a{font-size:14px}header span,.eyebrow{font-size:10px;font-weight:700;letter-spacing:2px}header span{color:#426b6d}main{max-width:1500px;margin:auto;padding:28px 4%}h1,h2,h3{font-family:'Literata',Georgia,serif;font-weight:500}h1{font-size:clamp(32px,4.5vw,56px);margin:0;letter-spacing:-1.5px}h1 em{color:#a5783e;font-weight:400}h2{font-size:28px;line-height:1.3}p{line-height:1.65}.eyebrow{color:#4b787a;margin:0 0 9px}.title-row,.reel-heading,.lake-caption{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:25px}.title-row button{font-size:13px}.title-row button span{margin-left:12px;color:#8e6535}.welcome{display:grid;grid-template-columns:1.15fr 1fr;gap:8%;padding:40px 0}.welcome-copy h2{font-size:clamp(32px,4vw,49px);margin:12px 0 25px}.welcome-copy ol{padding-left:22px;line-height:1.9}.welcome-copy>p{max-width:540px}.fine{font-size:12px;color:#537078}.start-card{background:#fffdf5;border:1px solid #d7dfd3;border-radius:22px;padding:26px;box-shadow:0 16px 40px #1a4d4920}.start-card h2{margin-top:0;font-size:24px}.modes{display:grid;grid-template-columns:1fr 1fr;gap:10px}.modes button{text-align:left;padding:14px}.modes strong,.modes span{display:block}.modes span{font-size:11px;margin-top:6px}.modes button[aria-pressed=true]{background:#185b64;color:#fff9e8;border-color:#185b64}.primary{background:#185b64;border-color:#185b64;color:#fff9e8;font-weight:600}.primary:hover{background:#10434e}.start-card .primary{width:100%;display:flex;justify-content:space-between}#mode-note{font-size:13px;min-height:64px}.lake-caption h2{font-size:22px;margin:0}.lake-caption p{font-size:13px;margin:6px 0 0}.lake{position:relative;overflow:hidden;border:1px solid #91aeb3;border-radius:20px;background:#184c5c;isolation:isolate}.pond{height:clamp(480px,65vh,690px)}.scenery{position:absolute;inset:0;z-index:-2}.scenery>svg{width:100%;height:100%}.rod{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:-1}.fish-spot{position:absolute;transform:translate(-50%,-50%);width:130px;height:98px;padding:0;border:0;background:transparent;color:white;text-shadow:0 2px 3px #122b44;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:50%}.fish-spot:hover{background:#ffffff15}.fish-spot:before{content:'';position:absolute;inset:26px -3px 0;border-radius:50%;border:1px solid #b5ffff80;box-shadow:0 0 24px #84e9ed60,inset 0 0 20px #6cffff40;transform:scaleY(.5);z-index:-1}.fish-spot strong{font-size:22px;z-index:1}.fish-spot small{font-size:9px;letter-spacing:1px;z-index:1;margin-top:5px}.fish-shadow{position:absolute;inset:-28px 28px 16px;opacity:.7;filter:drop-shadow(0 0 8px #b1efff)}.fish-spot.special:before{box-shadow:0 0 25px #ffb5e5,inset 0 0 28px #ffcc6680;border-color:#ffe3ac}.fish-spot.special strong{color:#ffe5a6}.fish-spot.special .fish-shadow{filter:drop-shadow(0 0 12px #ffc4f8)}.creature{width:100%;height:100%;overflow:visible}.creature .body{fill:var(--creature);stroke:#28465c;stroke-width:2.5;stroke-linejoin:round}.creature .detail{fill:none;stroke:#4c596877;stroke-width:3}.creature .limbs{fill:none;stroke:var(--creature);stroke-width:9;stroke-linecap:round}.lake-help{text-align:center;font-size:12px;color:#537078}.pond-done{position:absolute;left:50%;top:55%;transform:translate(-50%,-50%);text-align:center;border-radius:20px;background:#fff9ebf2;padding:25px;min-width:280px}.play-layout{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:22px}.active-lake{min-height:580px}.reel-heading h1{font-size:34px}.reel-panel{position:absolute;left:4%;right:4%;top:22px;padding:18px 25px;border-radius:17px;background:#103c4eef;color:#fff5da;border:1px solid #7ea0a5;box-shadow:0 12px 24px #061c3c30}.reel-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:17px}.reel-top .eyebrow{color:#bee4da}.reel-top p{margin:0;font-size:13px}#ring{--fill:0deg;flex-shrink:0;width:74px;height:74px;border-radius:50%;background:conic-gradient(#ffd681 var(--fill),#567d8580 0);display:grid;place-items:center;box-shadow:0 0 14px #fff3}#ring span{display:grid;place-items:center;width:57px;height:57px;background:#103c4e;border-radius:50%;font-size:15px;font-weight:700}#track{height:48px;position:relative;margin:0 15px;border-radius:8px;background:#0a2736;outline:1px solid #c3e8df70}#zone{height:100%;position:absolute;background:linear-gradient(#ffdf8d,#e4a54c);border:2px solid #ffedb0;border-radius:7px;box-shadow:0 0 14px #ffd57244}#swimmer{position:absolute;top:50%;width:4%;min-width:12px;height:36px;transform:translate(-50%,-50%);filter:drop-shadow(0 0 2px #fff);z-index:2}#swimmer .creature{min-width:100%}.finish-mark{position:absolute;right:0;top:0;height:100%;border-right:2px dashed #e9eeed}.track-note{font-size:11px;line-height:1.5;margin:15px 0 0;color:#d8ebe5}.off-track #zone{opacity:.7}.answer-card{padding:22px;border:1px solid #c9d6cc;border-radius:18px;background:#fffdf4;align-self:start}.answer-card .eyebrow{font-size:9px;line-height:1.7}.answer-card label{display:block;font-family:'Literata',Georgia,serif;font-size:31px;margin:18px 0 13px}.answer-card input{width:100%;height:59px;border:2px solid #71999b;border-radius:10px;background:white;color:#183f4e;text-align:center;font-size:30px}.answer-card form button{width:100%;margin-top:12px}#feedback{font-size:13px;min-height:44px;line-height:1.5}.keypad{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.keypad button{font-size:18px;padding:9px 0}.keypad [data-key=Clear]{font-size:12px}#overlay{position:absolute;inset:0;display:grid;place-items:center;background:#123646a8;backdrop-filter:blur(5px);z-index:5;padding:20px}#overlay>div{background:#fff9eb;border:1px solid #e5d8b4;padding:25px;border-radius:22px;text-align:center;max-width:430px;width:100%;box-shadow:0 20px 50px #092b5060}#overlay h2{margin:8px 0 12px}#overlay button{margin:6px}#overlay .creature{width:130px;height:120px;filter:drop-shadow(0 0 15px #ffc267aa)}.catch-result .eyebrow{font-size:9px}.catch-result p{font-size:14px}.escape-ripple{font-size:70px;color:#44929c}dialog{width:min(960px,94vw);max-height:88vh;border:1px solid #acbeb7;border-radius:20px;padding:28px;background:#f7f3e7;color:#153d49}dialog::backdrop{background:#092b40b0}dialog h2{margin:0}#collection-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:22px 0}.specimen{background:#fffdf6;border:1px solid #d5dccc;border-radius:15px;padding:12px;text-align:center}.specimen .creature{width:85px;height:85px}.specimen h3{font-size:14px;margin:7px 0}.specimen p{font-size:11px;margin:0}.specimen.complete{border-color:#ba8e37;box-shadow:inset 0 0 0 2px #efd694}footer{text-align:center;padding:20px;font-size:12px;color:#527079}.skip{position:fixed;top:-100px;left:10px;padding:15px;background:white;z-index:20}.skip:focus{top:10px}[hidden]{display:none!important}@media(max-width:900px){main{padding:22px 18px}.welcome{gap:25px}.play-layout{grid-template-columns:1fr}.active-lake{min-height:420px}.answer-card{display:grid;grid-template-columns:1fr 1fr;gap:12px 20px}.answer-card>.eyebrow{grid-column:1/-1}.answer-card form{grid-row:span 2}.answer-card label{margin-top:0}.answer-card .fine{grid-column:1/-1;margin:0}#feedback{margin:0;min-height:25px}.reel-heading h1{font-size:28px}}@media(max-width:600px){header span{display:none}.welcome{grid-template-columns:1fr;padding:10px 0}.title-row{align-items:flex-start}.title-row button{padding:10px;font-size:11px}.title-row button span{display:block;margin:3px 0 0}.title-row .eyebrow{font-size:8px}.lake-caption{align-items:flex-start}.lake-caption h2{font-size:19px}.lake-caption button{font-size:11px;padding:10px}.pond{height:500px}.fish-spot{width:100px}.fish-spot small{font-size:8px}.reel-panel{padding:14px 10px}.reel-heading h1{font-size:24px}.reel-heading .eyebrow{font-size:8px}.answer-card{padding:16px;gap:10px}.answer-card label{font-size:26px}.keypad{gap:5px}#collection-grid{grid-template-columns:repeat(2,1fr)}.active-lake{min-height:360px}.reel-top p{font-size:11px}#ring{width:64px;height:64px}#ring span{width:49px;height:49px}.track-note{font-size:10px}}
.cast-ripple{position:absolute;width:40px;height:16px;border:3px solid #fff2bc;border-radius:50%;pointer-events:none;animation:splash 1s ease-out forwards}@keyframes splash{from{transform:translate(-50%,-50%) scale(.2);opacity:1}to{transform:translate(-50%,-50%) scale(4);opacity:0}}.catch-result .creature{animation:reveal .5s ease-out}@keyframes reveal{from{transform:translateY(20px) scale(.7);opacity:0}to{transform:translateY(0) scale(1);opacity:1}}@media(max-width:600px){main{padding:16px 12px}.active-lake{min-height:260px}.reel-panel{top:10px}.reel-heading{margin-bottom:16px}.answer-card .fine{font-size:10px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important}.cast-ripple{display:none}}
@media(max-width:600px){.active-lake:has(#overlay:not([hidden])){min-height:440px}#overlay{padding:12px}#overlay>div{padding:18px}.catch-result .creature{width:95px!important;height:88px!important}}
/* Five collectible spaces: two above, three below, matching the field-journal sketch. */
#collection-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.collection-slots{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:7px 2px;max-width:250px;margin:8px auto 14px}.collection-slot{grid-column:span 2;min-width:0}.collection-slot:first-child{grid-column:2/span 2}.collection-slot:nth-child(2){grid-column:4/span 2}.collection-slot:nth-child(3){grid-column:1/span 2}.specimen .collection-slot .creature{display:block;width:100%;height:auto;aspect-ratio:120/108}.collection-slot.empty .body{fill:none;stroke:#8c9693;stroke-width:2.5;stroke-dasharray:5 4}.collection-slot.empty .body .detail{display:none}.collection-slot.empty .body .limbs{stroke:#8c9693;stroke-width:3;stroke-dasharray:5 4;fill:none}.collection-slot.empty .body~*{display:none}.specimen h3{font-size:16px}.specimen p{font-size:12px}@media(max-width:700px){#collection-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:420px){#collection-grid{grid-template-columns:1fr}.collection-slots{max-width:230px}}