body:has(.fishing){background:#101826;margin:0;overflow:hidden}.fishing{--ink:#10141f;--cream:#f6efdc;--gold:#ffcf5a;--red:#e8574b;--panel:#10141fdb;--pixel:max(2px, .18rem);--font:var(--font-fishing), ui-monospace, monospace;color:var(--cream);font:400 1rem/1.35 var(--font);-webkit-user-select:none;user-select:none;touch-action:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;position:fixed;inset:0;overflow:clip}.fishing,.fishing *{box-sizing:border-box;font-variant-ligatures:none!important}.fishing .view{cursor:pointer;width:100%;height:100%;display:block;position:absolute;inset:0}.fishing[data-state=card] .view{cursor:default}.fishing .top,.fishing .tools button,.fishing .depth,.fishing .hint,.fishing .card,.fishing .panel{text-shadow:var(--pixel) var(--pixel) 0 #0000008c}.fishing .top{text-shadow:var(--pixel) var(--pixel) 0 #0009, 0 0 .7rem #0a0e188c;pointer-events:none;position:absolute;top:.9rem;left:1rem}.fishing .top>*{pointer-events:auto}.fishing .home{color:var(--cream);opacity:.8;font-size:.8125rem;text-decoration:none}.fishing .home:hover,.fishing .home:focus-visible{opacity:1;text-underline-offset:.2em;text-decoration:underline}.fishing h1{font:700 clamp(1.5rem, 3.2vw, 2.4rem) / 1 var(--font);letter-spacing:.02em;margin:.1rem 0 0}.fishing .clock{opacity:.85;font-variant-numeric:tabular-nums;margin:.3rem 0 0;font-size:.875rem}.fishing button{font:inherit;color:inherit;cursor:pointer}.fishing .tools{gap:.5rem;display:flex;position:absolute;top:.9rem;right:1rem}.fishing .tools button,.fishing .depth button,.fishing .card button{background:var(--panel);min-width:2.25rem;min-height:2.25rem;box-shadow:inset 0 0 0 var(--pixel) var(--cream), inset 0 calc(var(--pixel) * -2) 0 var(--pixel) #00000059;clip-path:polygon(var(--pixel) 0, calc(100% - var(--pixel)) 0, calc(100% - var(--pixel)) var(--pixel), 100% var(--pixel), 100% calc(100% - var(--pixel)), calc(100% - var(--pixel)) calc(100% - var(--pixel)), calc(100% - var(--pixel)) 100%, var(--pixel) 100%, var(--pixel) calc(100% - var(--pixel)), 0 calc(100% - var(--pixel)), 0 var(--pixel), var(--pixel) var(--pixel));border:0;padding:.2rem .7rem}.fishing button:hover{background:#283046eb}.fishing button:focus-visible{color:var(--gold);background:#3c4664f2;outline:none}.fishing .tools [data-sound][aria-pressed=false]{opacity:.75;text-decoration:line-through}.fishing [data-total]{color:var(--gold)}.fishing .depth{align-items:center;gap:.4rem;display:flex;position:absolute;bottom:1rem;left:1rem}.fishing .depth output{text-align:center;font-variant-numeric:tabular-nums;min-width:3.4em}.fishing .depth button{padding:.2rem .5rem;font-size:.75rem}.fishing .hint{text-align:center;pointer-events:none;white-space:nowrap;max-width:min(32rem,100vw - 2rem);margin:0;font-size:clamp(1rem,1.8vw,1.25rem);position:absolute;bottom:1.1rem;left:50%;translate:-50%}.fishing[data-state=bite] .hint,.fishing[data-state=snapped] .hint{color:var(--gold)}.fishing .card{background:var(--panel);width:min(20rem,100vw - 2rem);box-shadow:inset 0 0 0 var(--pixel) var(--cream);text-align:center;justify-items:center;gap:.35rem;padding:1.1rem 1.2rem 1.2rem;display:grid;position:absolute;top:16%;left:50%;translate:-50%}.fishing .card[hidden]{display:none}.fishing .card-fish{width:12rem;height:auto;image-rendering:pixelated}.fishing .card-flag{color:var(--red);font:700 .875rem/1 var(--font);letter-spacing:.08em;text-transform:uppercase;margin:0}.fishing .card-flag:empty{display:none}.fishing .card h2{font:700 1.5rem/1.1 var(--font);color:var(--gold);margin:.2rem 0 0}.fishing .card-size{font-variant-numeric:tabular-nums;margin:0;font-size:1.125rem}.fishing .card-metric{opacity:.7;font-variant-numeric:tabular-nums;margin:-.2rem 0 0;font-size:.8125rem}.fishing .card-note{opacity:.85;min-height:1.35em;margin:0;font-size:.875rem}.fishing .card-note:empty{display:none}.fishing .card button{margin-top:.4rem}.fishing .panel{width:min(26rem,100vw - 2rem);max-height:calc(100dvh - 4rem);color:var(--cream);background:var(--panel);box-shadow:inset 0 0 0 var(--pixel) var(--cream);font:400 1rem/1.4 var(--font);border:0;margin:auto;padding:1.1rem 1.3rem 1.2rem;overflow:auto}.fishing .panel::backdrop{background:#080a1059}.fishing .panel h2{font:700 1.4rem/1.1 var(--font);color:var(--gold);margin:0 0 .7rem}.fishing .panel h3{font:700 1.05rem/1.2 var(--font);margin:1rem 0 .3rem}.fishing .panel p{margin:.5rem 0 0;font-size:.9375rem}.fishing .panel a{color:var(--gold)}.fishing .close{background:0 0;border:0;font-size:1.5rem;line-height:1;position:absolute;top:.5rem;right:.6rem}.fishing .keys{gap:.45rem;margin:0;display:grid}.fishing .keys div{grid-template-columns:8.5rem 1fr;gap:.6rem;display:grid}.fishing .keys dt{color:var(--gold)}.fishing .keys dd{margin:0;font-size:.9375rem}.fishing .log{gap:.4rem;margin:0;padding:0;list-style:none;display:grid}.fishing .log li{grid-template-columns:4.5rem 1fr auto;align-items:center;gap:.75rem;display:grid}.fishing .log canvas{width:4.5rem;height:auto;image-rendering:pixelated}.fishing .log .unknown{opacity:.8}.fishing .log .count{color:var(--gold);font-variant-numeric:tabular-nums}.fishing .log .best{opacity:.8;font-size:.8125rem;display:block}.fishing .hint-small{opacity:.7;font-size:.8125rem}.fishing .unsupported{text-align:center;width:min(26rem,100vw - 2rem);margin:0;font-size:1.125rem;position:absolute;top:50%;left:50%;translate:-50% -50%}.fishing .unsupported[hidden]{display:none}@media (width<=40rem){.fishing .top{top:.6rem;left:.75rem}.fishing .tools{gap:.35rem;top:.6rem;right:.75rem}.fishing .depth{bottom:3.6rem;left:.75rem}.fishing .hint{white-space:normal;width:calc(100vw - 1.5rem)}.fishing .keys div{grid-template-columns:1fr;gap:.1rem}}
