:root{--bg: #0b1620;--bg-2: #0a131c;--panel: #12222e;--panel-2: #0e1c26;--panel-3: #16293688;--line: #21384a;--line-2: #2c4757;--text: #dce8f0;--muted: #7e96a8;--head: #cfe3ee;--accent: #39b56a;--accent-2: #4aa8d8;--gold: #f5c542;--purple: #7c5cff;--cast: #2b9fd6;--danger: #ff6c6c;--common: #b9c6d2;--uncommon: #6cd07e;--rare: #6cb8ff;--epic: #f5c542;--legendary: #ff5a5a}*{box-sizing:border-box}*{scrollbar-width:thin;scrollbar-color:#2c4757 transparent}::-webkit-scrollbar{width:12px;height:12px}::-webkit-scrollbar-track{background:#0a131c;border-radius:8px}::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#2c4757,#1d3445);border-radius:8px;border:2px solid var(--panel)}::-webkit-scrollbar-thumb:hover{background:var(--accent-2)}::-webkit-scrollbar-corner{background:transparent}html,body{margin:0;height:100%;background:radial-gradient(1200px 600px at 50% -10%,#15303f 0%,transparent 60%),var(--bg);color:var(--text);font-family:Segoe UI,system-ui,sans-serif;font-size:14px}#app{display:flex;flex-direction:column;height:100vh;overflow:hidden}#topbar{display:flex;align-items:center;gap:clamp(8px,1.1vw,18px);padding:clamp(6px,.7vw,10px) clamp(10px,1.2vw,18px);background:linear-gradient(180deg,#15293701,#0e1c26),var(--panel);border-bottom:1px solid var(--line)}.tb-player{display:flex;align-items:center;gap:12px}.avatar{width:clamp(36px,3.2vw,50px);height:clamp(36px,3.2vw,50px);border-radius:12px;background:var(--panel-2);border:2px solid var(--line-2);overflow:hidden;flex:0 0 auto;display:flex;align-items:center;justify-content:center}.avatar img{width:130%;height:130%;object-fit:contain;image-rendering:pixelated}.identity{display:flex;flex-direction:column;gap:4px}.id-name{display:flex;align-items:center;gap:7px;font-weight:700;font-size:clamp(12px,.95vw,15px)}.online-dot{width:8px;height:8px;border-radius:50%;background:var(--accent);box-shadow:0 0 6px var(--accent)}.id-level{display:flex;align-items:center;gap:8px}.level-chip{font-size:11px;font-weight:700;color:var(--accent-2)}.xpbar{width:clamp(70px,9vw,130px);height:7px;background:#0a1620;border:1px solid var(--line);border-radius:6px;overflow:hidden}#xp-fill{height:100%;width:0%;background:linear-gradient(90deg,#2b6fd6,#4aa8d8);border-radius:6px;transition:width .4s}.xp-text{font-size:10px;color:var(--muted)}.balance{display:inline-flex;align-items:center;gap:7px;font-family:Consolas,monospace;font-weight:700;font-size:clamp(12px,.95vw,15px);color:var(--gold);background:#0c1722;border:1px solid var(--line);border-radius:18px;padding:clamp(4px,.5vw,7px) clamp(8px,1vw,14px)}.coin-icon{height:18px;width:18px;image-rendering:pixelated}.logo{display:flex;align-items:baseline;gap:4px;font-weight:800;letter-spacing:.5px}.logo .logo-1{color:#7fd0ff}.logo .logo-2{color:var(--gold)}.logo .logo-fish{font-size:.9em}.logo{font-size:clamp(15px,1.7vw,24px);text-shadow:0 2px 0 #06121b}.logo-img{height:clamp(30px,3vw,46px);width:auto;display:block;image-rendering:auto}.logo-big{font-size:30px;justify-content:center;margin-bottom:12px}#nav{display:flex;gap:clamp(2px,.4vw,6px);flex:1 1 0;min-width:0;justify-content:center;flex-wrap:nowrap}#nav button{display:flex;flex-direction:column;align-items:center;gap:2px;background:#122230;border:1px solid var(--line);color:var(--muted);border-radius:10px;padding:7px 10px;min-width:64px;font-size:11px;cursor:pointer}#nav button .ic{font-size:17px;line-height:1}img.ic{width:34px;height:34px;image-rendering:auto;object-fit:contain;display:block}#nav button{padding:4px clamp(3px,.5vw,9px) 3px;min-width:0;gap:1px;font-size:clamp(8px,.66vw,11px);white-space:nowrap}#nav button img.ic{width:clamp(18px,1.9vw,36px);height:clamp(18px,1.9vw,36px)}.tb-online img.ic{width:clamp(18px,1.7vw,26px);height:clamp(18px,1.7vw,26px)}.tb-ic{width:clamp(30px,2.8vw,42px);height:clamp(30px,2.8vw,42px)}.tb-ic img.ic{width:clamp(18px,1.7vw,26px);height:clamp(18px,1.7vw,26px)}#nav button:hover{border-color:var(--accent-2);color:var(--text);background:#16293a}#nav button.active{border-color:var(--accent-2);color:#fff;background:#18394d}.tb-online.active,.tb-ic.active{border-color:var(--accent-2);color:#fff}.tb-right{display:flex;align-items:center;gap:8px}.tb-online{display:flex;flex-direction:column;align-items:center;line-height:1.1;background:#122230;border:1px solid var(--line);border-radius:10px;padding:6px 12px;color:var(--text);cursor:pointer}.tb-online .ic,.tb-online b{font-size:14px}.tb-online small{color:var(--muted);font-size:10px}.tb-ic{width:38px;height:38px;border-radius:10px;background:#122230;border:1px solid var(--line);cursor:pointer;font-size:16px;color:var(--text)}.tb-ic:hover:not(:disabled){border-color:var(--accent-2)}.tb-ic:disabled{opacity:.4;cursor:default}button{background:var(--panel-2);color:var(--text);border:1px solid var(--line);padding:7px 12px;border-radius:8px;cursor:pointer;font-size:13px}button:hover{border-color:var(--accent-2)}button.primary{background:linear-gradient(180deg,#46c577,#2f9d59);border-color:#2f9d59;color:#08130d;font-weight:700}button.primary:hover{filter:brightness(1.08)}button.purple{background:linear-gradient(180deg,#8b6cff,#6a48f0);border-color:#6a48f0;color:#fff;font-weight:700}button:disabled{opacity:.45;cursor:not-allowed}select{background:var(--panel-2);color:var(--text);border:1px solid var(--line);padding:6px 8px;border-radius:8px}#desktop{position:relative;flex:1;overflow:hidden}.panel{position:fixed;display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--line-2);border-radius:12px;overflow:hidden;resize:both;min-width:220px;min-height:120px;max-width:96vw;max-height:92vh;box-shadow:0 12px 32px #0009;z-index:30}.panel-head{flex:0 0 auto;display:flex;align-items:center;gap:9px;padding:9px 12px;border-bottom:1px solid var(--line);background:linear-gradient(180deg,#16293a,#12222e);cursor:move;-webkit-user-select:none;user-select:none;touch-action:none}.panel-head .m-ic{font-size:15px}.panel-head h2{margin:0;font-size:12px;text-transform:uppercase;letter-spacing:1px;color:var(--head);flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.panel-head .m-count{color:var(--muted);font-size:12px}.panel-body{flex:1;overflow:auto;padding:12px 14px}#game-wrap{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden}#game{width:100%;height:100%}#game canvas{image-rendering:auto}.hud{position:absolute;z-index:45}.hud-weather{top:10px;left:10px;background:#0b1620cc;border:1px solid var(--line);border-radius:10px;padding:6px 12px;display:flex;flex-direction:column;line-height:1.25;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}#hud-time{font-size:18px;font-weight:800}.hud-sel{background:#0d1c28cc;border:1px solid var(--line);color:var(--text);border-radius:7px;padding:4px 6px;font-size:12px;max-width:160px}.hud-bottom{left:12px;bottom:12px;right:auto}.hud-tackle{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap;background:#0b1620cc;border:1px solid var(--line);border-radius:12px;padding:8px 12px;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.tackle-grip{cursor:move;color:var(--muted);font-size:18px;line-height:1;-webkit-user-select:none;user-select:none;touch-action:none;padding:0 4px;align-self:stretch;display:flex;align-items:center}.tackle-grip:hover{color:var(--text)}.hud-field{display:flex;flex-direction:column;gap:3px}.hud-field>span{font-size:10px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}.hud-tackle #sel-rod{width:150px}.bait-strip{display:flex;gap:6px}.bait-tile{width:44px;height:44px;border-radius:9px;background:#0b1620cc;border:2px solid var(--line);display:flex;align-items:center;justify-content:center;cursor:pointer;position:relative;padding:3px}.bait-tile img{max-width:100%;max-height:100%;image-rendering:pixelated}.bait-tile .nolbl{font-size:9px;color:var(--muted);text-align:center}.bait-tile.sel{border-color:var(--gold);box-shadow:0 0 8px #f5c54266}.bait-tile:hover{border-color:var(--accent-2)}.cast-btn{position:absolute;z-index:46;left:50%;bottom:22%;transform:translate(110px);width:84px;height:84px;border-radius:50%;background:radial-gradient(circle at 38% 32%,#5cc6f2,var(--cast) 62%,#1d6f9c);border:3px solid #bfe9ff;color:#04222f;font-weight:800;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;box-shadow:0 6px 18px #0008,inset 0 2px 6px #fff6;cursor:pointer;font-size:13px}.cast-btn .cast-ic{font-size:22px;line-height:1}.cast-btn:hover{filter:brightness(1.06)}.cast-btn:disabled{opacity:.55;filter:grayscale(.4);cursor:default}#feedback{position:absolute;z-index:45;left:50%;bottom:16px;transform:translate(-50%);max-width:46%;padding:8px 16px;background:#0b1620d9;border:1px solid var(--line);border-radius:10px;font-size:13px;color:var(--text);text-align:center;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#050a0fd1;display:flex;align-items:center;justify-content:center;z-index:50;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.overlay.hidden{display:none}.login-card{background:var(--panel);border:1px solid var(--line-2);border-radius:16px;padding:30px 34px;width:380px;text-align:center;box-shadow:0 20px 60px #000a}.login-card p{color:var(--muted);margin:0 0 18px}.login-card input{width:100%;padding:11px;margin-bottom:12px;border-radius:9px;border:1px solid var(--line);background:#0a141d;color:var(--text)}.login-actions{display:flex;gap:10px}.login-actions button{flex:1}.login-err{color:var(--danger);min-height:18px;margin-top:10px;font-size:13px}.modal{background:var(--panel);border:1px solid var(--line-2);border-radius:14px;width:min(760px,94vw);max-height:86vh;overflow:auto;padding:0;box-shadow:0 24px 70px #000b}.modal-head{display:flex;align-items:center;gap:10px;padding:14px 18px;border-bottom:1px solid var(--line);position:sticky;top:0;background:linear-gradient(180deg,#16293a,#12222e);z-index:2}.modal-head .m-ic{font-size:18px}.modal-head h2{margin:0;font-size:14px;text-transform:uppercase;letter-spacing:1.2px;color:var(--head);flex:1}.modal-head .m-count{color:var(--muted);font-size:12px}.close-x{background:transparent;border:none;font-size:18px;color:var(--muted)}.close-x:hover{color:var(--text)}.max-btn{background:transparent;border:none;font-size:16px;color:var(--muted);padding:0 4px;line-height:1}.max-btn:hover{color:var(--accent-2)}.modal-body{padding:16px 18px}.row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 11px;border:1px solid var(--line);border-radius:10px;margin-bottom:7px;background:var(--panel-2)}.row:hover{border-color:var(--line-2)}.row .meta{display:flex;flex-direction:column;gap:2px;min-width:0}.row .label{font-weight:600}.row .sub{font-size:11px;color:var(--muted)}.row .actions{display:flex;gap:6px;align-items:center;flex-wrap:wrap;justify-content:flex-end}.rowleft{display:flex;align-items:center;gap:10px;min-width:0}.icon{height:30px;width:auto;max-width:60px;image-rendering:pixelated;flex:0 0 auto}.qty-input{width:64px;padding:6px;background:#0a141d;color:var(--text);border:1px solid var(--line);border-radius:7px}.empty{color:var(--muted);font-style:italic;padding:8px}.section-title{font-size:11px;text-transform:uppercase;letter-spacing:1px;color:var(--muted);margin:16px 0 8px}.controls{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.see-all{color:var(--accent-2);font-size:12px;cursor:pointer}.tabs{display:flex;gap:6px;margin-bottom:14px}.tabs button{background:#122230;border:1px solid var(--line);border-radius:999px;padding:6px 14px;color:var(--muted);font-size:12px}.tabs button.active{background:linear-gradient(180deg,#2f80c0,#2168a8);border-color:#2168a8;color:#fff;font-weight:700}.slot-grid{display:grid;grid-template-columns:repeat(auto-fill,62px);gap:10px;justify-content:start}.slot{position:relative;width:62px;height:62px;border-radius:12px;background:var(--panel-2);border:2px solid var(--line);display:flex;align-items:center;justify-content:center;cursor:pointer;padding:6px}.slot:hover{border-color:var(--accent-2)}.slot.sel{border-color:var(--gold);box-shadow:0 0 10px #f5c54255}.slot img{max-width:100%;max-height:100%;image-rendering:pixelated}.slot .qty{position:absolute;right:4px;bottom:3px;font-size:11px;font-weight:800;color:#fff;text-shadow:0 1px 2px #000,0 0 3px #000}.slot .broken{position:absolute;left:4px;top:3px;font-size:12px}.slot.empty-slot{cursor:default;border-style:dashed;opacity:.5}.slot.rarity-uncommon{border-color:#2f6b43}.slot.rarity-rare{border-color:#2f5a8a}.slot.rarity-epic{border-color:#8a7220}.slot.rarity-legendary{border-color:#8a2f2f}.slot.equip{border-color:#2f80c0!important}.slot.sel{border-color:var(--gold)!important;box-shadow:0 0 10px #f5c54255}.inv-foot{margin-top:10px;padding-top:8px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:3px}.action-bar{margin-top:14px;padding:12px;border:1px solid var(--line);border-radius:10px;background:var(--panel-2);display:flex;align-items:center;gap:10px;flex-wrap:wrap}.action-bar .ab-info{display:flex;flex-direction:column;gap:2px;flex:1;min-width:140px}.kpi{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:8px}.kpi .card{flex:1;min-width:130px;background:var(--panel-2);border:1px solid var(--line);border-radius:12px;padding:12px 14px}.kpi .card .v{font-family:Consolas,monospace;font-size:19px;font-weight:800}.kpi .card .k{font-size:11px;color:var(--muted);margin-top:2px}.muted{color:var(--muted)}.rarity-common{color:var(--common)}.rarity-uncommon{color:var(--uncommon)}.rarity-rare{color:var(--rare)}.rarity-epic{color:var(--epic)}.rarity-legendary{color:var(--legendary)}.dura{font-family:monospace;font-size:11px}.dura.low{color:var(--danger)}.ratio-ok{color:var(--uncommon)}.ratio-bad,.toast-err{color:var(--danger)}.toast-ok{color:var(--uncommon)}.chat-wrap{display:flex;flex-direction:column;height:100%;min-height:120px;gap:8px}.chat-box{flex:1;min-height:0;overflow:auto;display:flex;flex-direction:column;gap:1px}.chat-msg{font-size:12px;line-height:1.5}.chat-msg.sys{color:var(--muted);font-style:italic}.chat-ts{color:#5f7488}.chat-name{font-weight:700}.chat-row{display:flex;gap:8px;align-items:stretch}.chat-input{flex:1;background:#0a141d;color:var(--text);border:1px solid var(--line);border-radius:8px;padding:8px 10px}.send-btn{width:42px;display:flex;align-items:center;justify-content:center;padding:0;font-size:16px;background:var(--accent-2);border-color:var(--accent-2);color:#04222f}.send-btn:hover{filter:brightness(1.1)}.tip{position:fixed;z-index:200;display:none;pointer-events:none;background:#0a141d;border:1px solid var(--line-2);border-radius:8px;padding:8px 10px;max-width:260px;box-shadow:0 10px 30px #000a;font-size:12px}.panel,.hud,.tip,.ctx-menu,.settings-menu{zoom:var(--ui-s, 1)}.tip{min-width:220px}.tip>div{line-height:1.35}.tip .stat-row{display:flex;gap:6px;align-items:baseline;font-size:12px}.tip .stat-row .stat-k{color:var(--muted);flex:1 1 auto}.tip .stat-row .stat-v{font-weight:700;white-space:nowrap}.tip .stat-row .cmp-up{color:var(--uncommon);font-size:11px;white-space:nowrap}.tip .stat-row .cmp-down{color:var(--legendary);font-size:11px;white-space:nowrap}.tip .stat-row .cmp-eq{color:var(--muted);font-size:11px}.ctx-menu{position:fixed;z-index:210;background:var(--panel);border:1px solid var(--line-2);border-radius:10px;padding:6px;min-width:160px;box-shadow:0 14px 40px #000b;display:flex;flex-direction:column;gap:2px}.ctx-menu .ctx-title{font-size:11px;color:var(--muted);padding:4px 8px 6px;border-bottom:1px solid var(--line);margin-bottom:4px}.ctx-menu button{width:100%;text-align:left;background:transparent;border:none;padding:8px 10px;border-radius:7px}.ctx-menu button:hover:not(:disabled){background:var(--panel-2)}.settings-menu{position:fixed;z-index:60;background:var(--panel);border:1px solid var(--line-2);border-radius:10px;padding:6px;box-shadow:0 12px 40px #000a;min-width:140px}.settings-menu button{width:100%;text-align:left;background:transparent;border:none;padding:8px 10px;border-radius:8px}.settings-menu button:hover{background:var(--panel-2)}.settings-zoom{padding:8px 10px 10px;border-bottom:1px solid var(--line);margin-bottom:4px;min-width:200px}.settings-zoom .sz-label{font-size:12px;color:var(--muted);margin-bottom:6px}.settings-zoom input[type=range]{width:100%;accent-color:var(--accent-2);cursor:pointer}.settings-zoom .sz-reset{width:auto!important;padding:3px 8px!important;margin-top:6px;font-size:11px;color:var(--accent-2);border:1px solid var(--line)!important;border-radius:7px!important}.trend{font-size:11px;font-weight:700}.trend.up{color:var(--uncommon)}.trend.down{color:var(--danger)}.guild-head{display:flex;gap:12px;align-items:center}.guild-emblem{width:44px;height:44px;border-radius:10px;background:#16293a;border:1px solid var(--line-2);display:flex;align-items:center;justify-content:center;font-size:22px;flex:0 0 auto}.gbar{height:8px;background:#0a1620;border:1px solid var(--line);border-radius:6px;overflow:hidden;margin-top:6px}.gbar-fill{height:100%;background:linear-gradient(90deg,#2b6fd6,#4aa8d8)}.badge-new{background:#c0392b;color:#fff;font-size:10px;font-weight:800;padding:2px 8px;border-radius:999px;text-transform:uppercase}.me-row{background:#14323a!important;border-color:#2a6b5a!important}@media(max-width:1180px){#nav button span:not(.ic){display:none}#nav button{min-width:40px}}