.user-chip{position:relative;flex-shrink:0}.user-chip--skeleton{width:90px;height:32px;background:var(--fish-surface-raised);border-radius:var(--radius-pill);animation:shimmer 1.4s ease-in-out infinite}@keyframes shimmer{0%,to{opacity:.5}50%{opacity:1}}.user-chip--login{display:inline-flex;align-items:center;padding:6px 14px;border-radius:var(--radius-pill);font-size:.8rem;font-weight:700;color:var(--fish-text-bright);background:var(--fish-accent-dim);border:1px solid var(--fish-border-bright);text-decoration:none!important;transition:background .15s,border-color .15s;white-space:nowrap}.user-chip--login:hover{background:#4db8e833;border-color:var(--fish-accent)}.user-chip__trigger{display:flex;align-items:center;gap:7px;padding:4px 10px 4px 4px;border-radius:var(--radius-pill);background:var(--fish-surface-raised);border:1px solid var(--fish-border);color:var(--fish-text);font-size:.82rem;font-weight:700;cursor:pointer;transition:border-color .15s}.user-chip__trigger:hover{border-color:var(--fish-border-bright)}.user-chip__avatar{width:26px;height:26px;border-radius:50%;object-fit:cover}.user-chip__name{max-width:100px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.user-chip__caret{font-size:.6rem;opacity:.5}.user-chip__menu{position:absolute;top:calc(100% + 8px);right:0;min-width:150px;background:var(--fish-surface-raised);border:1px solid var(--fish-border-bright);border-radius:var(--radius-sm);overflow:hidden;box-shadow:0 8px 24px #00000059;z-index:200}.user-chip__menu-item{display:flex;align-items:center;gap:8px;width:100%;padding:10px 14px;font-size:.83rem;font-weight:700;color:var(--fish-text);text-decoration:none!important;background:none;border:none;cursor:pointer;transition:background .12s;text-align:left}.user-chip__menu-item:hover{background:#4db8e814}.user-chip__menu-item--danger{color:#f87272}.user-chip__menu-item--danger:hover{background:#f8727214}.nav{background:linear-gradient(180deg,#122240fa,#0c1a32f5);border-bottom:1px solid var(--fish-border);position:sticky;top:0;z-index:100;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.nav__inner{max-width:760px;margin:0 auto;padding:12px 16px 0;display:flex;flex-direction:column;gap:12px}.nav__top-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.nav__brand{display:flex;align-items:baseline;gap:8px}.nav__logo{font-size:1.6rem;line-height:1;filter:drop-shadow(0 0 8px rgba(77,184,232,.5))}.nav__title{font-family:Pacifico,cursive;font-size:1.8rem;color:var(--fish-accent);text-shadow:0 0 24px rgba(77,184,232,.4);letter-spacing:-.5px}.nav__subtitle{font-size:.75rem;color:var(--fish-text-dim);font-style:italic;letter-spacing:.02em}.nav__tabs{display:flex;gap:4px;align-self:center}.nav__tab{display:flex;align-items:center;gap:6px;padding:8px 18px;border-radius:var(--radius-pill) var(--radius-pill) 0 0;font-size:.875rem;font-weight:700;color:var(--fish-text-dim);text-decoration:none!important;transition:color .15s,background .15s;border:1px solid transparent;border-bottom:none}.nav__tab:hover{color:var(--fish-text);background:#4db8e812}.nav__tab--active{color:var(--fish-accent);background:#4db8e81a;border-color:var(--fish-border);border-bottom-color:transparent}.nav__wave{height:2px;background:linear-gradient(90deg,transparent 0%,var(--fish-border) 15%,rgba(77,184,232,.5) 50%,var(--fish-border) 85%,transparent 100%)}@media (max-width: 560px){.nav__subtitle{display:none}.nav__title{font-size:1.4rem}.nav__tab{padding:8px 12px;font-size:.8rem}}.catch-card{display:flex;gap:14px;align-items:center;padding:14px 16px;background:var(--fish-surface);border:1px solid var(--fish-border);border-radius:var(--radius);transition:border-color .15s,transform .15s,box-shadow .15s}.catch-card:hover{border-color:var(--fish-border-bright);transform:translateY(-1px);box-shadow:0 4px 16px #0003}.catch-card--first{background:linear-gradient(135deg,var(--fish-surface) 0%,rgba(255,209,102,.05) 100%);border-color:var(--fish-gold-border);box-shadow:0 0 16px #ffd16612}.catch-card--first:hover{border-color:#ffd16680}.catch-card--new{animation:slide-in .4s cubic-bezier(.34,1.56,.64,1)}@keyframes slide-in{0%{opacity:0;transform:translateY(-14px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}.catch-card__icon-wrap{flex-shrink:0;width:54px;height:54px;border-radius:var(--radius-sm);background:var(--fish-surface-raised);border:1px solid var(--fish-border);display:flex;align-items:center;justify-content:center;overflow:hidden}.catch-card__icon{width:46px;height:46px;object-fit:contain}.catch-card__body{flex:1;min-width:0;display:flex;flex-direction:column;gap:5px}.catch-card__top{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.catch-card__name{font-size:1rem;font-weight:800;color:var(--fish-text-bright);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.catch-card__first-badge{font-size:.7rem;font-weight:700;color:var(--fish-gold);background:var(--fish-gold-dim);border:1px solid var(--fish-gold-border);border-radius:var(--radius-pill);padding:2px 9px;white-space:nowrap}.catch-card__meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.catch-card__location,.catch-card__size{font-size:.8rem;color:var(--fish-text-dim)}.catch-card__footer{display:flex;align-items:center;justify-content:space-between;gap:8px}.catch-card__char{font-size:.75rem;color:var(--fish-text-dim);font-style:italic;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-right:.2em}.catch-card__time{font-size:.72rem;color:var(--fish-text-dim);opacity:.65;white-space:nowrap;flex-shrink:0}.catch-card__time--historical{opacity:.5;font-style:italic}.feed-page__toolbar{display:flex;flex-direction:column;align-items:center;gap:10px;margin-bottom:20px}.feed-page__status{display:flex;align-items:center;gap:6px;flex-shrink:0}.feed-page__status-label{font-size:.73rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--fish-text-dim)}.live-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}.live-dot--on{background:var(--fish-connected);box-shadow:0 0 6px var(--fish-connected);animation:pulse-dot 2s ease-in-out infinite}.live-dot--off{background:var(--fish-text-dim);opacity:.4}@keyframes pulse-dot{0%,to{opacity:1}50%{opacity:.35}}.feed-page__filters{display:flex;gap:6px;flex-wrap:wrap;justify-content:center}.filter-pill{display:flex;align-items:center;gap:5px;padding:4px 12px;border-radius:var(--radius-pill);font-size:.75rem;font-weight:700;letter-spacing:.03em;border:1px solid var(--fish-border);background:transparent;color:var(--fish-text-dim);cursor:pointer;transition:color .15s,border-color .15s,background .15s}.filter-pill:hover{border-color:var(--fish-border-bright);color:var(--fish-text)}.filter-pill--active{background:var(--fish-accent-dim);border-color:var(--fish-border-bright);color:var(--fish-text-bright)}.filter-pill__dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}.feed-page__list{display:flex;flex-direction:column;gap:10px}.leaderboard-list{display:flex;flex-direction:column;gap:8px}.lb-entry{display:flex;align-items:center;gap:12px;padding:12px 16px;background:var(--fish-surface);border:1px solid var(--fish-border);border-radius:var(--radius);transition:border-color .15s,transform .15s}.lb-entry:hover{border-color:var(--fish-border-bright);transform:translateY(-1px)}.lb-entry--gold{border-color:#ffd7004d;background:linear-gradient(135deg,var(--fish-surface) 0%,rgba(255,215,0,.05) 100%)}.lb-entry--silver{border-color:#c0c0c033}.lb-entry--bronze{border-color:#cd7f3233}.lb-entry__rank{font-size:1.35rem;width:34px;text-align:center;flex-shrink:0;line-height:1}.lb-entry__rank-num{font-size:.85rem;font-weight:800;color:var(--fish-text-dim)}.lb-entry__icon-wrap{width:42px;height:42px;background:var(--fish-surface-raised);border:1px solid var(--fish-border);border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden}.lb-entry__icon{width:36px;height:36px;object-fit:contain}.lb-entry__name{flex:1;font-weight:800;color:var(--fish-text-bright);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lb-entry__count{font-size:1.05rem;font-weight:800;color:var(--fish-accent);white-space:nowrap;flex-shrink:0}.records-list{display:flex;flex-direction:column;gap:8px}.record-entry{display:flex;align-items:center;gap:12px;padding:12px 16px;background:var(--fish-surface);border:1px solid var(--fish-border);border-radius:var(--radius);transition:border-color .15s,transform .15s}.record-entry:hover{border-color:var(--fish-border-bright);transform:translateY(-1px)}.record-entry__icon-wrap{width:46px;height:46px;background:var(--fish-surface-raised);border:1px solid var(--fish-border);border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden}.record-entry__icon{width:38px;height:38px;object-fit:contain}.record-entry__body{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}.record-entry__name{font-weight:800;color:var(--fish-text-bright);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.record-entry__meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.record-entry__char{font-size:.78rem;color:var(--fish-text-dim);font-style:italic}.record-entry__date{font-size:.72rem;color:var(--fish-text-dim);opacity:.65}.record-entry__size{display:flex;flex-direction:column;align-items:flex-end;flex-shrink:0;gap:1px}.record-entry__size-value{font-size:1.35rem;font-weight:800;color:var(--fish-accent);line-height:1}.record-entry__size-unit{font-size:.64rem;color:var(--fish-text-dim);text-transform:uppercase;letter-spacing:.06em}.history-page__login-prompt{display:flex;flex-direction:column;align-items:center;gap:16px;padding:60px 20px;color:var(--fish-text-dim);text-align:center}.history-page__login-btn{display:inline-flex;align-items:center;padding:10px 24px;border-radius:var(--radius-pill);font-size:.9rem;font-weight:800;color:var(--fish-text-bright);background:var(--fish-accent-dim);border:1px solid var(--fish-border-bright);text-decoration:none!important;transition:background .15s,border-color .15s}.history-page__login-btn:hover{background:#4db8e833;border-color:var(--fish-accent)}.history-page__list{display:flex;flex-direction:column;gap:10px}.history-page__section-header{display:flex;align-items:baseline;gap:12px;margin:24px 0 10px;font-weight:700;color:var(--fish-text-dim);font-size:.95rem;border-bottom:1px solid var(--fish-border);padding-bottom:8px}.history-page__section-note{font-size:.78rem;font-weight:400;opacity:.7}.history-page__load-more{display:flex;justify-content:center;margin-top:20px}.history-page__load-more-btn{padding:10px 32px;border-radius:var(--radius-pill);font-size:.9rem;font-weight:700;font-family:inherit;color:var(--fish-text-bright);background:var(--fish-accent-dim);border:1px solid var(--fish-border-bright);cursor:pointer;transition:background .15s,border-color .15s}.history-page__load-more-btn:hover:not(:disabled){background:#4db8e833;border-color:var(--fish-accent)}.history-page__load-more-btn:disabled{opacity:.5;cursor:default}:root{--fish-bg: #0b1d35;--fish-surface: #122240;--fish-surface-raised: #172e55;--fish-border: rgba(77, 184, 232, .14);--fish-border-bright: rgba(77, 184, 232, .32);--fish-text: #c8e8f8;--fish-text-dim: #7ab0cc;--fish-text-bright: #eaf6ff;--fish-accent: #4db8e8;--fish-accent-dim: rgba(77, 184, 232, .12);--fish-gold: #ffd166;--fish-gold-dim: rgba(255, 209, 102, .1);--fish-gold-border: rgba(255, 209, 102, .3);--fish-connected: #52d68a;--exp-0: #c4955a;--exp-1: #8bc4e4;--exp-2: #e07878;--exp-3: #b394d4;--exp-4: #e8d070;--exp-5: #5ecf8f;--radius: 12px;--radius-sm: 8px;--radius-pill: 999px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;height:100%}#root{height:100%}body{font-family:Nunito,system-ui,sans-serif;font-size:15px;font-weight:500;line-height:1.6;background-color:var(--fish-bg);color:var(--fish-text);-webkit-font-smoothing:antialiased;height:100%;overflow:hidden;background-image:linear-gradient(#040c1ea6,#040c1ea6),radial-gradient(ellipse at 20% 15%,rgba(77,184,232,.07) 0%,transparent 50%),radial-gradient(ellipse at 80% 85%,rgba(40,80,180,.06) 0%,transparent 50%),url(/bg.webp);background-size:cover;background-attachment:fixed;background-position:center}.app{display:flex;flex-direction:column;height:100%}.app__main{flex:1;padding:28px 0 48px;overflow-y:overlay;overflow-x:hidden}.app__container{max-width:760px;margin:0 auto;padding:0 16px}.app__footer{text-align:center;padding:20px 16px;font-size:.78rem;color:var(--fish-text-dim);border-top:1px solid var(--fish-border);display:flex;align-items:center;justify-content:center;gap:8px}.app__footer-sep{opacity:.4}.app__footer a{color:var(--fish-accent);text-decoration:none}.app__footer a:hover{text-decoration:underline}a{color:var(--fish-accent);text-decoration:none}a:hover{text-decoration:underline}button{cursor:pointer;font-family:inherit}.page-header{text-align:center;margin-bottom:28px}.page-title{font-size:1.6rem;font-weight:800;color:var(--fish-text-bright);margin-bottom:4px}.page-subtitle{font-size:.85rem;color:var(--fish-text-dim)}.page-loading,.page-empty{display:flex;flex-direction:column;align-items:center;gap:12px;padding:60px 20px;color:var(--fish-text-dim);font-size:.9rem}.spinner{width:32px;height:32px;border:3px solid var(--fish-border);border-top-color:var(--fish-accent);border-radius:50%;animation:spin .8s linear infinite;flex-shrink:0}@keyframes spin{to{transform:rotate(360deg)}}.expansion-badge{display:inline-flex;align-items:center;padding:2px 8px;border-radius:var(--radius-pill);font-size:.68rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;border:1px solid}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--fish-border-bright);border-radius:var(--radius-pill)}::-webkit-scrollbar-thumb:hover{background:var(--fish-accent)}