:root{--ink: #0f1a24;--paper: rgba(246, 248, 251, .92);--accent: #c8412b;--muted: #5d6b78;--safe-top: env(safe-area-inset-top, 0px);--safe-right: env(safe-area-inset-right, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px);--safe-left: env(safe-area-inset-left, 0px);font-family:Segoe UI,system-ui,-apple-system,sans-serif;color:var(--ink)}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:#cfd8e2;overscroll-behavior:none}#app{position:relative;width:100vw;height:100vh;height:100dvh}#world{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}#fishing-panel{position:absolute;top:16px;right:16px;bottom:16px;width:300px;height:calc(100dvh - 32px);border-radius:10px;background:#0c16228c;box-shadow:0 8px 30px #00000040;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}#joystick{position:absolute;width:120px;height:120px;margin:-60px 0 0 -60px;border-radius:50%;background:#ffffff24;border:2px solid rgba(255,255,255,.45);pointer-events:none;z-index:2}#joystick .knob{position:absolute;left:50%;top:50%;width:52px;height:52px;margin:-26px 0 0 -26px;border-radius:50%;background:#fff9;box-shadow:0 2px 10px #00000040}#hud{position:absolute;inset:0;pointer-events:none}#hud-top-left,#hud-top-right{position:absolute;top:14px;padding:10px 14px;background:var(--paper);border-radius:8px;font-size:13px;line-height:1.5;min-width:190px;box-shadow:0 4px 16px #0000001f}#hud-top-left{left:14px}#hud-top-right{right:332px;display:none}#hud-top-left .title{font-weight:600;font-size:15px}#hud-top-left .muted{color:var(--muted)}#hud-center{position:absolute;left:50%;top:22%;transform:translate(-50%);text-align:center;font-size:22px;font-weight:600;color:#fff;text-shadow:0 2px 8px rgba(0,0,0,.5);transition:opacity .4s}#hud-center .big{font-size:30px}#hud-center .small{font-size:15px;font-weight:400;opacity:.9}#hud-center .bar{width:220px;height:8px;margin:10px auto 0;background:#ffffff40;border-radius:4px;overflow:hidden}#hud-center .bar>div{height:100%;background:#fff}#hud-hint{position:absolute;left:50%;bottom:18px;transform:translate(-50%);padding:8px 14px;background:#0f1a24b3;color:#e8eef4;border-radius:8px;font-size:13px;white-space:nowrap}#hud-hint kbd{display:inline-block;padding:0 5px;margin:0 1px;border-radius:4px;background:#ffffff26;border:1px solid rgba(255,255,255,.25);font-family:inherit;font-size:12px}.overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#0a121a8c;backdrop-filter:blur(3px)}.overlay[hidden]{display:none}.overlay .panel,#catch-log>div,#help>div{background:var(--paper);border-radius:12px;padding:26px 32px;max-width:640px;max-height:80vh;max-height:80dvh;overflow:auto;box-shadow:0 20px 60px #00000059}#start-screen h1{margin:0 0 6px;font-size:42px;letter-spacing:.02em}#start-screen .sub{margin:0 0 22px;color:var(--muted)}#start-screen .buttons{display:flex;gap:12px;flex-wrap:wrap}#start-screen button{font:inherit;font-size:15px;padding:10px 18px;border-radius:8px;border:1px solid #9aa9b7;background:#fff;cursor:pointer}#start-screen button:hover{background:#eef3f8}#start-screen .hint{margin:22px 0 0;font-size:12px;color:var(--muted)}#catch-log table{border-collapse:collapse;font-size:13px;width:100%}#catch-log th,#catch-log td{text-align:left;padding:4px 10px 4px 0;border-bottom:1px solid #d5dde5}#catch-log h2,#help h2{margin:0 0 10px;font-size:20px}#help p{margin:6px 0;font-size:14px}#lake-map{flex-direction:column;gap:8px}#map-canvas{background:#f4f6f8;border-radius:10px;box-shadow:0 20px 60px #00000059}#map-legend{color:#e8eef4;font-size:13px}#debug{position:absolute;left:14px;bottom:60px;padding:8px 10px;background:#0009;color:#cfe;font:12px/1.4 Consolas,monospace;border-radius:6px;white-space:pre;pointer-events:none}@media(max-width:700px){#fishing-panel{top:112px;right:8px;width:min(300px,44vw);height:calc(100dvh - 184px)}#hud-hint{bottom:8px;width:calc(100% - 16px);white-space:normal;text-align:center}.overlay .panel,#catch-log>div,#help>div{padding:20px;max-width:calc(100vw - 24px)}}[hidden]{display:none!important}button,input,select{font:inherit}button{border:1px solid #a3b6bd;border-radius:7px;padding:10px 14px;color:#14363f;background:#f7faf9;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}button:hover{background:#e0eeec}button:disabled{opacity:.5;cursor:default}button.primary,#start-screen button.primary{background:#165561;color:#fff;border-color:#165561}button:focus-visible,input:focus-visible,select:focus-visible,#world:focus-visible{outline:3px solid #e99a43;outline-offset:3px}label{display:grid;gap:6px;font-size:13px;font-weight:600}input,select{min-width:0;width:100%;padding:10px;border:1px solid #9bafb6;border-radius:6px;background:#fff;color:#173d47}.eyebrow{font-size:10px;font-weight:700;letter-spacing:.16em;color:#55777e}.muted{color:var(--muted)}.buttons{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}#start-screen{background:radial-gradient(ellipse at 16% 80%,#c2d4d9 0,transparent 60%),linear-gradient(130deg,#193e49,#5d7e8a 50%,#d6e4e6)}#start-screen .start-panel{width:600px;max-height:calc(100dvh - 64px);background:#f5f7f2;border:1px solid #fff9;padding:30px 40px}#start-screen h1{font-size:clamp(48px,8vw,76px);letter-spacing:-.06em;line-height:1.1;color:#133b44}#start-screen h1 span{color:#cb6b43}#start-screen .sub{color:#355b65;margin:12px 0 20px;font-size:18px}#start-screen section{border-top:1px solid #cfdbd9;margin-top:20px;padding-top:14px}#start-screen h2{font-size:16px;margin:0 0 12px}#start-screen p{line-height:1.5}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.checkbox{display:flex;align-items:center;margin-top:12px;font-weight:400}.checkbox input{width:16px;height:16px}.join-row{display:flex;align-items:end;gap:12px;margin-top:16px}.join-row label{flex:1}#toolbar{position:absolute;left:14px;right:330px;bottom:62px;display:flex;gap:6px;flex-wrap:wrap;align-items:center;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}#toolbar button{font-size:12px;padding:9px 11px;min-height:36px}#toolbar [data-held]{touch-action:none}#action-interact{order:-1}#fishing-controls,#secondary-controls{display:contents}html.touch #toolbar:not(.menu-open) #secondary-controls{display:none}#connection-status{position:absolute;bottom:8px;left:14px;font-size:12px;background:#153b46;color:#fff;border-radius:6px;padding:5px 10px;pointer-events:none}#connection-status:empty{display:none}#hud-hint{left:14px;right:330px;transform:none;white-space:normal;text-align:left;bottom:14px;width:auto}#hud-center{max-width:calc(100vw - 360px)}#hud-top-right{min-width:145px}#hud-top-right strong{font-size:26px;font-variant-numeric:tabular-nums}#room-overlay .panel{min-width:min(460px,90vw)}.members{list-style:none;padding:0}.members li{padding:8px 0;border-bottom:1px solid #cbd8db;display:flex;justify-content:space-between;gap:20px}.members span{color:#5a727a;font-size:12px}#catch-log td,#catch-log th{padding:9px 14px 9px 0}#catch-log .self{background:#dfecea;font-weight:600}#help p{line-height:1.6;margin:12px 0}@media(max-width:850px){#toolbar{right:14px;bottom:86px;max-width:calc(100% - 28px)}#hud-hint{right:14px;bottom:34px}#fishing-panel{top:112px;right:8px;width:260px;height:calc(100dvh - 275px)}#hud-top-right{right:14px;min-width:130px}#hud-center{left:25%;max-width:42vw;font-size:17px}#hud-center .big{font-size:23px}}@media(max-width:480px){#start-screen .start-panel{padding:20px}.form-grid{grid-template-columns:1fr}#fishing-panel{width:205px}#hud-top-left{min-width:0;font-size:11px}}@media(max-height:600px)and (min-width:851px){#toolbar{right:290px}#fishing-panel{width:260px}#hud-top-right,#hud-hint{right:290px}}#connection-status{bottom:auto;left:50%;top:12px;transform:translate(-50%)}@media(max-width:850px){#connection-status{top:auto;bottom:5px;left:14px;transform:none}}#practice-guide{position:absolute;top:115px;left:14px;width:min(290px,30vw);padding:16px;border-radius:10px;background:#f4f7f0ed;color:#173f46;box-shadow:0 8px 24px #122d3a24}#practice-guide h2{margin:7px 0;font-size:17px}#practice-guide p{font-size:13px;line-height:1.5;margin:8px 0}#practice-guide .eyebrow{font-size:10px}#practice-guide .muted{font-size:11px}#practice-guide button{font-size:12px;padding:6px 10px}#settings .panel{width:490px}#equipment .panel{width:520px;max-height:calc(100dvh - 32px);display:flex;flex-direction:column;padding:24px}#equipment .equipment-choices{min-height:0;overflow:auto;margin:0 -6px}#equipment fieldset{border:0;padding:6px;margin:0;min-width:0}#equipment h2{margin:0 0 8px}#equipment p{margin:6px 0 10px}#equipment .buttons{flex-shrink:0;margin:4px 0 0}#equipment label{margin-top:12px}#equipment .muted,#equipment .equipment-current{font-size:12px;line-height:1.5}#settings label{margin-top:16px}#settings .muted{font-size:12px;line-height:1.5}input[type=range]{padding:0;accent-color:#165561}@media(max-width:850px){#practice-guide{width:min(240px,calc(100vw - 300px));padding:12px}#practice-guide p{font-size:12px}}@media(max-width:550px){#practice-guide{top:105px;left:8px;width:min(220px,calc(100vw - 225px));padding:9px}#practice-guide h2{font-size:14px}}@media(max-height:600px){#practice-guide{max-height:calc(100dvh - 230px);overflow:auto}}#btn-resume{margin-bottom:14px}#rooms-browser{margin-top:20px;border-top:1px solid #cfdbd9;padding-top:14px}#rooms-browser summary{cursor:pointer;font-weight:600;margin-bottom:12px}#rooms-browser summary:focus-visible{outline:3px solid #e99a43;outline-offset:3px}#rooms-status,#public-rooms p{font-size:12px;color:#355b65}#public-rooms{list-style:none;padding:0}#public-rooms li{display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid #cfdbd9;padding:12px 0}#public-rooms strong{overflow-wrap:anywhere}#public-rooms p{margin:5px 0 0}.table-scroll{max-width:100%;overflow-x:auto}.table-scroll td,.table-scroll th{padding:9px 14px 9px 0;text-align:left;white-space:nowrap}.table-scroll .self{background:#dfecea;font-weight:600}#profile-browser{margin-top:16px;border-top:1px solid #cfdbd9;padding-top:14px}#profile-browser summary{cursor:pointer;font-weight:600}#profile-browser p,#saved-result p{font-size:13px}#profile-results{list-style:none;padding:0}#profile-results li{padding:10px 0;border-bottom:1px solid #cfdbd9}#profile-results p{margin:5px 0}#profile-results button{text-align:left}#network-quality{font-size:12px;padding:6px 9px;border-radius:5px;background:#f4f7f0ed;color:#173f46}#room-overlay .panel{width:min(960px,calc(100vw - 28px));max-width:none;display:grid;grid-template-columns:minmax(220px,.8fr) minmax(320px,1.2fr);gap:24px}#room-chat{border-left:1px solid #b7cace;padding-left:24px;min-width:0}#room-chat .members{max-height:125px;overflow:auto;margin-top:0}#room-chat h3{margin-bottom:8px}#room-chat .muted,.chat-status{font-size:12px;line-height:1.5}#room-chat .members button{font-size:12px;padding:6px 8px;margin:2px}#room-chat .members strong{color:#173f46;overflow-wrap:anywhere}.chat-messages{list-style:none;padding:8px;margin:12px 0;height:180px;overflow:auto;border:1px solid #b7cace;border-radius:6px;background:#fff9}.chat-messages li{padding:8px 0;border-bottom:1px solid #dae4e5}.chat-messages span{display:block;overflow-wrap:anywhere;white-space:pre-wrap;font-size:13px}.chat-messages button{font-size:11px;padding:4px 7px;margin-top:5px}#room-chat form{display:flex;align-items:end;gap:8px}#room-chat form label{flex:1;min-width:0}.chat-messages:focus-visible{outline:3px solid #e99a43;outline-offset:2px}@media(max-height:650px){.chat-messages{height:130px}}@media(max-width:760px){#room-overlay .panel{display:block}#room-chat{border-left:0;border-top:1px solid #b7cace;padding-left:0;margin-top:18px}}html:not(.touch) .touch-only{display:none!important}html.touch .pointer-only{display:none!important}html.touch #toolbar{left:calc(10px + var(--safe-left));right:calc(10px + var(--safe-right));bottom:calc(10px + var(--safe-bottom));gap:8px;align-items:flex-end}html.touch #toolbar button{min-height:46px;font-size:13px;padding:10px 13px;border-radius:10px}html.touch #toolbar [data-held]{min-width:96px}html.touch #action-interact{order:10;margin-left:auto;min-width:140px;min-height:54px;font-size:15px;font-weight:600}html.touch #network-quality{min-height:0}html.touch #hud-top-left{top:calc(8px + var(--safe-top));left:calc(8px + var(--safe-left));padding:7px 10px;font-size:12px;min-width:0;line-height:1.4}html.touch #hud-top-left .title{font-size:13px}html.touch #hud-top-right{top:calc(8px + var(--safe-top));right:calc(8px + var(--safe-right));padding:7px 10px;min-width:0;font-size:12px}html.touch #hud-top-right strong{font-size:22px}html.touch #hud-hint{left:calc(8px + var(--safe-left));right:auto;bottom:auto;top:calc(84px + var(--safe-top));max-width:min(52vw,360px);font-size:12px;padding:6px 10px;transform:none;text-align:left;width:auto}html.touch #fishing-panel{top:calc(84px + var(--safe-top));right:calc(8px + var(--safe-right));bottom:auto;height:calc(100dvh - 160px - var(--safe-top) - var(--safe-bottom));width:min(300px,42vw)}html.touch #app:has(#practice-guide:not([hidden])) #hud-hint{display:none}html.touch #hud-center{left:29vw;top:20%;max-width:54vw;font-size:18px}html.touch #hud-center .big{font-size:24px}html.touch #practice-guide{top:calc(84px + var(--safe-top));left:calc(8px + var(--safe-left));width:min(260px,calc(58vw - 20px));padding:10px 12px;max-height:calc(100dvh - 190px - var(--safe-top) - var(--safe-bottom));overflow:auto}html.touch #practice-guide h2{font-size:15px;margin:5px 0}html.touch #practice-guide p{font-size:12px;margin:6px 0}html.touch #practice-guide button{min-height:40px}html.touch #connection-status{top:auto;bottom:calc(70px + var(--safe-bottom));left:calc(10px + var(--safe-left));transform:none}html.touch .overlay .panel,html.touch #catch-log>div,html.touch #help>div{max-width:calc(100vw - 16px);max-height:calc(100dvh - 16px - var(--safe-top) - var(--safe-bottom));padding:18px 16px;-webkit-overflow-scrolling:touch}html.touch .overlay button,html.touch #start-screen button{min-height:44px}html.touch #start-screen .start-panel{width:min(600px,calc(100vw - 16px));max-height:calc(100dvh - 16px - var(--safe-top) - var(--safe-bottom));padding:22px 18px}html.touch input,html.touch select{min-height:44px;font-size:16px}html.touch #equipment .panel{width:min(520px,calc(100vw - 16px))}html.touch #settings .panel{width:min(490px,calc(100vw - 16px))}html.touch input[type=range]{min-height:32px}html.touch #lake-map button{min-height:44px}@media(max-height:500px){html.touch #hud-top-left{padding:5px 8px;font-size:11px}html.touch #hud-top-left .title{font-size:12px}html.touch #hud-top-left .muted{display:inline}html.touch #hud-hint{top:calc(66px + var(--safe-top));font-size:11px;max-width:min(46vw,320px)}html.touch #fishing-panel{top:calc(8px + var(--safe-top));height:calc(100dvh - 72px - var(--safe-top) - var(--safe-bottom));width:min(240px,32vw)}html.touch #hud-top-right{right:calc(16px + min(240px,32vw) + var(--safe-right))}html.touch #toolbar{bottom:calc(6px + var(--safe-bottom));gap:6px}html.touch #toolbar button{min-height:42px;padding:8px 10px;font-size:12px}html.touch #action-interact{min-height:48px;min-width:124px;font-size:14px}html.touch #hud-center{left:33vw;top:14%;font-size:16px}html.touch #practice-guide{top:calc(66px + var(--safe-top));width:min(230px,34vw);max-height:calc(100dvh - 140px - var(--safe-top) - var(--safe-bottom))}html.touch #practice-guide .muted{display:none}}@media(max-width:520px){html.touch #fishing-panel{width:44vw;height:calc(100dvh - 212px - var(--safe-top) - var(--safe-bottom))}html.touch #hud-hint{max-width:calc(56vw - 16px)}html.touch #hud-top-right{top:calc(60px + var(--safe-top))}html.touch #hud-center{left:28vw;max-width:52vw;font-size:16px}html.touch #toolbar button{padding:9px 8px;font-size:12px}html.touch #fishing-controls button{min-width:0;flex:1 1 22%;padding:9px 4px}html.touch #action-interact{flex:1 1 auto;margin-left:0}html.touch #practice-guide{width:calc(56vw - 16px)}}