:root{--ink: #4e4677;--ink2: #6a6199;--ink4: #8a81b8;--cream: #fdf2e0;--cream1: #fbe3c8;--cream2: #edd6b0;--leaf: #5fbb6e;--leaf1: #86cc93;--leaf-1: #469156;--orange: #f58a4b;--yellow: #f7c85c;--red: #ec6a5e;--sky: #5c93e8;--sky1: #8fb6f0;--creek: #c2d9f7;--pond: #5c93e8;--lake: #4174c4;--sea: #39325c;--bank: #b4e2bc}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{height:100%;margin:0}body{background:var(--cream1);color:var(--ink);font-family:system-ui,-apple-system,Segoe UI,sans-serif;overscroll-behavior:none;touch-action:none;-webkit-user-select:none;user-select:none}.app{height:100%;max-width:520px;margin:0 auto;display:flex;flex-direction:column}button{font:inherit;color:inherit;cursor:pointer}.play{height:100%;flex:1;min-height:0;display:flex;flex-direction:column}.bar{height:54px;flex:none;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 14px;min-width:0}.bar>*{min-width:0}.casts{font-size:17px;font-weight:700;white-space:nowrap}.tally{font-size:17px;font-weight:700;color:var(--leaf-1);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.icon{flex:none;width:40px;height:40px;display:grid;place-items:center;border:3px solid var(--ink);border-radius:13px;background:var(--cream);padding:0}.stage{flex:1;min-height:0;position:relative;overflow:hidden}.stage svg{display:block;width:100%;height:100%}.catcher{position:absolute;top:0;right:0;bottom:0;left:0;background:none;border:0;padding:0;touch-action:none}.deck{flex:none;min-height:148px;padding:10px 14px 16px;display:flex;flex-direction:column;gap:10px;align-items:center;justify-content:center}.beats{display:flex;gap:7px;align-items:center;flex-wrap:wrap;justify-content:center;max-width:100%}.beat{flex:none;min-width:44px;height:44px;padding:0 9px;display:grid;place-items:center;border:3px solid var(--ink);border-radius:12px;background:var(--cream);font-size:19px;font-weight:800;line-height:1}.beat[data-state=done]{background:var(--leaf1);border-color:var(--leaf-1);color:var(--cream)}.beat[data-state=now]{background:var(--yellow);min-width:58px;height:58px;font-size:24px}.beat[data-echo="1"]{border-style:dashed;border-color:var(--sky)}.finish{display:flex;gap:8px}.finish i{width:22px;height:22px;border:3px solid var(--ink);border-radius:50%;background:var(--cream)}.finish i[data-on="1"]{background:var(--orange)}.line{display:flex;gap:6px}.line i{width:34px;height:12px;border:3px solid var(--ink);border-radius:6px;background:var(--cream)}.line i[data-on="1"]{background:var(--red)}.hint{font-size:18px;font-weight:700;text-align:center;min-width:0;line-height:1.35}.hint b{color:var(--leaf-1)}.home{height:100%;display:flex;flex-direction:column;gap:12px;padding:14px;overflow-y:auto}.title{font-size:25px;font-weight:800;text-align:center;margin:4px 0 0}.spots{display:grid;grid-template-columns:1fr 1fr;gap:10px}.spot{border:3px solid var(--ink);border-radius:18px;background:var(--cream);padding:0;overflow:hidden;display:flex;flex-direction:column;min-width:0}.spot[data-on="1"]{border-color:var(--leaf-1);border-width:5px}.spot svg{display:block;width:100%;height:74px}.spot span{padding:7px 6px 9px;font-size:15px;font-weight:700;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.modes{display:flex;gap:8px}.mode{flex:1;min-width:0;padding:11px 6px;border:3px solid var(--ink);border-radius:14px;background:var(--cream);font-size:15px;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mode[data-on="1"]{background:var(--yellow)}.play-btn{background:var(--leaf);color:#fff;border:3px solid var(--ink);border-radius:22px;box-shadow:0 4px #4e467773;font-size:21px;font-weight:800;padding:15px 20px;width:100%}.row{display:flex;gap:8px;align-items:center;min-width:0}.row>*{min-width:0}.flat{flex:1;padding:11px 10px;border:3px solid var(--ink);border-radius:14px;background:var(--cream);font-size:15px;font-weight:700;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.home-link{text-align:center;font-size:15px;font-weight:700;color:var(--ink2);padding:4px 0 10px}.home-link a{color:inherit}.book{height:100%;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:10px}.entry{display:flex;align-items:center;gap:10px;border:3px solid var(--ink);border-radius:16px;background:var(--cream);padding:9px 11px;min-width:0}.entry[data-known="0"]{border-color:var(--ink4);border-style:dashed;background:var(--cream1)}.entry img{flex:none;width:46px;height:46px;object-fit:contain}.entry .who{flex:1;min-width:0}.entry .who b{display:block;font-size:16px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.entry .who small{display:block;font-size:14px;font-weight:700;color:var(--ink2);letter-spacing:1px;line-height:1.3;word-break:keep-all}.entry .best{flex:none;font-size:16px;font-weight:800;color:var(--leaf-1);white-space:nowrap}.result{height:100%;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:12px}.haul{display:flex;flex-wrap:wrap;gap:8px;align-items:flex-end;justify-content:center;border:3px solid var(--ink);border-radius:18px;background:var(--cream);padding:12px;min-height:120px}.haul figure{margin:0;display:flex;flex-direction:column;align-items:center;gap:2px}.haul figcaption{font-size:12px;font-weight:700;color:var(--ink2)}.score{display:flex;gap:10px}.score div{flex:1;min-width:0;border:3px solid var(--ink);border-radius:16px;background:var(--cream);padding:10px;text-align:center}.score div[data-win="1"]{background:var(--yellow)}.score b{display:block;font-size:22px}.score small{font-size:14px;font-weight:700;color:var(--ink2)}.pick{height:100%;overflow-y:auto;padding:14px}.faces{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.face{border:3px solid var(--ink);border-radius:14px;background:var(--cream);padding:4px;min-width:0}.face[data-on="1"]{border-color:var(--leaf-1);background:var(--leaf1)}.face img{width:100%;display:block}.face span{display:block;font-size:11px;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.stage svg,.spot-art{--edge: var(--ink);--deep: var(--lake);--shadow: var(--sea)}.stage svg[data-spot=creek],.spot-art[data-spot=creek]{--water: var(--creek);--deep: var(--sky1);--shadow: var(--lake)}.stage svg[data-spot=pond],.spot-art[data-spot=pond]{--water: var(--pond);--deep: var(--lake);--shadow: var(--sea)}.stage svg[data-spot=lake],.spot-art[data-spot=lake]{--water: var(--lake);--deep: var(--ink);--shadow: var(--sea);--edge: var(--cream2)}.stage svg[data-spot=sea],.spot-art[data-spot=sea]{--water: var(--sea);--deep: var(--ink);--shadow: var(--ink2);--edge: var(--cream2)}.water{fill:var(--water, var(--pond))}.deep{fill:var(--deep)}.bank{fill:var(--bank)}.ground{fill:var(--leaf1)}.marks g,.splash,.rod,.bobber,.catch-arc{stroke:var(--edge);stroke-linecap:round;vector-effect:non-scaling-stroke}.marks .shadow{fill:var(--shadow)}.plank{fill:var(--cream2);stroke:var(--ink);stroke-width:1;vector-effect:non-scaling-stroke}.marks .crown{stroke:var(--yellow)}.marks .again{stroke:var(--orange)}.mark{cursor:pointer}.rod{stroke:var(--cream2)}.cast-line{stroke:var(--edge)}.bobber circle{fill:var(--red)}.bobber .edge{fill:none;stroke:var(--edge)}.bobber line{stroke:var(--cream)}.catch-arc line{stroke:var(--cream)}.segs{display:flex;gap:6px;min-width:0}.segs--wide .seg{flex:1;min-width:0}.seg{font:inherit;font-size:14px;padding:9px 10px;border:3px solid var(--ink);border-radius:14px;background:var(--cream);color:var(--ink);cursor:pointer;min-width:0}.seg--on{background:var(--ink);color:var(--cream)}.sheet{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;padding:20px;background:var(--ink)}.sheet__card{width:100%;max-width:340px;display:flex;flex-direction:column;gap:12px;padding:18px;border:3px solid var(--ink);border-radius:20px;background:var(--cream);min-width:0}.sheet__title{margin:0;font-size:19px;min-width:0}.sheet__row{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:15px;min-width:0}.sheet__row--stack{flex-direction:column;align-items:stretch;gap:7px}.sheet__row input{width:22px;height:22px;accent-color:var(--leaf)}.sheet__danger,.sheet__close{font:inherit;padding:10px;border:3px solid var(--ink);border-radius:14px;background:var(--cream);color:var(--ink);cursor:pointer;min-width:0}.sheet__danger{border-color:var(--ink2);color:var(--ink2)}.gate{width:44px;height:44px;flex:none;padding:0;border:none;background:none;color:var(--ink4);cursor:pointer}.gate svg{display:block;width:100%;height:100%}.entry .unknown{flex:none;width:46px;height:46px;display:grid;place-items:center;font-size:26px;font-weight:800;color:var(--ink4)}.photo{flex:none;display:flex;align-items:flex-end;gap:2px;height:44px}.photo-friend{width:28px;height:28px;object-fit:contain}.photo-fish{object-fit:contain}.spot-art .marks g,.spot-art .marks ellipse,.spot-art .marks circle{stroke:var(--edge);vector-effect:non-scaling-stroke}@keyframes ripple-out{0%{transform:scale(.3);stroke-width:1.8}to{transform:scale(1.3);stroke-width:.35}}@keyframes bubble-up{0%{transform:translateY(2.6px) scale(.45)}65%{transform:translateY(-1.2px) scale(1.05)}to{transform:translateY(-3.4px) scale(.3)}}@keyframes shadow-cruise{0%,to{transform:translate(-2px) scaleX(.96)}50%{transform:translate(2px) scaleX(1.05)}}.marks ellipse,.marks circle{transform-box:fill-box;transform-origin:center}.mark[data-size=small] ellipse{animation:ripple-out 2.6s ease-out infinite}.mark[data-size=small] ellipse:nth-of-type(2){animation-delay:-1.3s}.mark[data-size=medium] circle{animation:bubble-up 2.2s ease-in-out infinite}.mark[data-size=medium] circle:nth-of-type(2){animation-delay:-.7s}.mark[data-size=medium] circle:nth-of-type(3){animation-delay:-1.5s}.mark[data-size=large] ellipse{animation:shadow-cruise 4.2s ease-in-out infinite}.marks .mark:nth-child(2n) ellipse,.marks .mark:nth-child(2n) circle{animation-delay:-.9s}.marks .mark:nth-child(3n) ellipse,.marks .mark:nth-child(3n) circle{animation-delay:-1.7s}.mark circle[pointer-events=all],.mark .again,.mark .crown{animation:none}@media (prefers-reduced-motion: reduce){.marks ellipse,.marks circle{animation:none}}