/* AnglerFins: ocean blue after-hours on the water. */
:root{color-scheme:dark;--navy:#101d24;--green:#59bdf4;--text:#e5edeb;--muted:#9caaa9;--line:#2a383f;--bg:#0d141b}
.water-canvas{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:-1;pointer-events:none;display:block}
body{background:transparent;color:var(--text);min-height:100vh}
/* Widened sidebar & pristine item alignment */
.sidebar{width:284px;padding:22px 16px;display:flex;flex-direction:column;position:fixed;top:0;left:0;height:100vh;height:100dvh;overflow-y:auto;overflow-x:hidden;z-index:40;border-right:1px solid #253139;background:rgba(16,26,34,0.92);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-sizing:border-box}
.sidebar-header{position:relative;display:flex;align-items:center;justify-content:center;width:100%;margin-bottom:22px;padding:2px 0}
.sidebar-close{display:none}
.shell{margin-left:284px;min-height:100vh;position:relative}
.brand{display:flex;align-items:center;justify-content:center;text-decoration:none;margin:0 auto;width:100%;padding:2px 0}
.brand-logo-img{width:100%;max-width:252px;height:auto;max-height:105px;display:block;margin:0 auto;object-fit:contain;transition:transform .2s ease,opacity .2s ease,filter .2s ease}
.brand-logo-img:hover{transform:scale(1.03);opacity:1;filter:drop-shadow(0 0 16px rgba(89,189,244,0.4))}
.header-logo-link{display:none;align-items:center;margin-left:4px;text-decoration:none}
.header-logo-img{height:34px;width:auto;max-width:140px;object-fit:contain}
.footer-brand{margin-bottom:12px}
.footer-logo-img{height:32px;width:auto;max-width:145px;object-fit:contain;opacity:.88}
.modal-brand{display:flex;align-items:center;justify-content:center;margin-bottom:16px}
.modal-logo-img{height:46px;width:auto;max-width:190px;object-fit:contain}
.side-label{color:#a0b8cb;font-size:10.5px;letter-spacing:1.4px;font-weight:700;margin:0 0 10px 4px;padding:0 8px}
.nav{color:#aab9bc;display:flex;align-items:center;width:100%;padding:11px 14px;gap:13px;border-radius:8px;font-size:13.5px;font-weight:600;box-sizing:border-box;transition:background .15s,color .15s}
.nav.active{background:#18364d;color:#c5e9ff;box-shadow:inset 3px 0 #59bdf4}
.nav.active>span{color:#59bdf4}
.nav:hover:not(.active){background:#1a2831;color:#edf4ee}
.nav b{background:#2b3a3b;color:#d3e7f4;margin-left:auto;font-size:11.5px;padding:2px 7px;border-radius:4px}
.circle-filter{color:#b7c4c5;display:flex;align-items:center;width:100%;padding:9px 12px;gap:12px;border-radius:8px;font-size:13.5px;box-sizing:border-box;transition:background .15s,color .15s}
.circle-filter:hover{color:#bde6ff;background:#15242e}
.circle-filter i{background:#203037;color:#b8cdba;width:28px;height:28px;border-radius:6px;display:inline-grid;place-items:center;flex-shrink:0;font-size:18px}
.side-rule{height:1px;background:#253139;margin:18px 4px}
.side-promo{background:rgba(23,43,62,0.88);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid #2a4963;border-radius:12px;padding:18px;margin:20px 0 16px}
.side-promo h3{color:#e2effa;font:800 19px/1.25 Manrope;margin:10px 0 8px}
.side-promo p{color:#a3b9cd;font-size:12px;line-height:1.55;margin:0 0 12px}
.side-promo button{color:#59bdf4;font-size:12px;font-weight:700;padding:0}
.side-bottom{margin-top:auto;padding-top:12px;display:flex;flex-direction:column;gap:8px}
.side-bottom .nav{color:#a5b2b4}
.me{display:flex;align-items:center;gap:11px;width:100%;padding:10px 8px;border-top:1px solid #253139;margin-top:4px;border-radius:8px;text-align:left;box-sizing:border-box}
.me:hover{background:rgba(25,40,52,0.6)}
.me-info{min-width:0;flex:1}
.me-info strong{display:block;font-size:12.5px;font-weight:700;color:#e5edeb;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.me-info small{display:block;font-size:10.5px;color:#9caaa9;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.me-dots{margin-left:auto;color:#a0afb4}
.avatar{background:#443c2d;color:#e8d6b2}
.avatar.green{background:#23435d;color:#c9e9ff}

/* Header & Hamburger Menu Button */
header{background:rgba(15,27,36,0.62);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-color:rgba(89,189,244,0.18);display:flex;align-items:center;justify-content:space-between;height:80px;padding:0 32px}
.header-left{display:flex;align-items:center;gap:14px}
.hamburger-btn{display:none;flex-direction:column;justify-content:center;align-items:center;gap:4.5px;width:40px;height:40px;padding:8px;border-radius:8px;background:rgba(22,34,43,0.85);border:1px solid #2a383f;cursor:pointer;flex-shrink:0}
.hamburger-btn span{display:block;width:20px;height:2px;background:#e5edeb;border-radius:2px;transition:transform .2s,opacity .2s}
.hamburger-btn:hover{background:#1e3547;border-color:#59bdf4}
.sidebar-backdrop{display:none;position:fixed;inset:0;background:rgba(4,10,16,0.78);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);z-index:90;opacity:0;pointer-events:none;transition:opacity .25s ease}
.sidebar-backdrop.active{opacity:1;pointer-events:auto}
.breadcrumb{color:#9caaae}.breadcrumb span{color:#5c6b70}.breadcrumb b{color:#dce8e4}.demo-pill{color:#9bb6cb}.primary{background:#59bdf4;color:#102b40;box-shadow:0 3px 14px #00000012}.primary:hover{background:#83d0fa}.welcome p{color:#a2b1b5}.welcome-note{color:#9cb6cb}.welcome-note>span{color:#59bdf4}h1{color:#edf4f0}

.composer,.post,.rail-section,.empty,.moderation-item,.profile-panel{background:rgba(22,34,43,0.86);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-color:#2a383f;box-shadow:0 8px 30px rgba(0,0,0,0.28)}.compose-top button{color:#adbac0}.compose-bottom{border-color:#2a383f}.compose-bottom span{color:#b3c0bb}.tabs button{color:#9eafb5}.tabs button.selected{color:#bde6ff;border-color:#59bdf4}.tabs span{color:#59bdf4}select{color:#b2c0c5}select option{background:#16222b;color:#e5edeb}.filters button{border-color:#36454a;color:#aababe}.filters button.chosen{background:#1b3c57;border-color:#356b91;color:#c1e8ff}.filters button:hover{border-color:#59bdf4}.post-head small,.post-head .more{color:#a0afb4}.verified{color:#7acbf8}.post-caption{color:#d2dcdf}.post-caption .hash{color:#8ed0f7}.catch-photo{background:#1c2c34}.catch-photo img{filter:brightness(.93)}.photo-badge{background:#102b40e8;border:1px solid #59bdf480;color:#d7eeff;box-shadow:0 3px 16px #0003}.catch-data{border-color:#2a383f}.catch-data span{color:#9aaeb3}.catch-data b{color:#dfebe3}.catch-data .release{background:#1d3c55;color:#a8dfff}.post-actions button{color:#a8b9bf}.post-actions button:hover{color:#bce5ff}.post-actions .liked{color:#f0a283}
.reel-card{background-color:rgba(18,48,71,0.88);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid #2a5575;box-shadow:0 12px 35px #0002}.reel-card p{color:#b3c7d7}.reel-logo>span,.coordinates{color:#a7c5df}.reel-card button{color:#102b40}.section-title>span{color:#80ccf7}.angler small{color:#a4b2b5}.angler button{background:#1b3347;border-color:#356483;color:#c1e8ff}.angler button:hover{background:#254e6c}.waters{background:rgba(23,44,64,0.88);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-color:#29475f}.waters .eyebrow{color:#a5c3db}.waters h3{color:#dcecf9}.waters p{color:#a9bfd1}.waters div span{color:#add7f4}.rail-footer,.rail-footer p{color:#96a7ac}

/* Mobile responsive drawer & layouts */
@media(max-width:880px){
  .shell{margin-left:0}
  .sidebar{position:fixed;top:0;left:0;bottom:0;width:300px;max-width:84vw;height:100vh;height:100dvh;transform:translateX(-100%);transition:transform .28s cubic-bezier(.16,1,.3,1);z-index:100;box-shadow:none;border-right:1px solid #2a4963}
  .sidebar.open{transform:translateX(0);box-shadow:12px 0 50px rgba(0,0,0,0.65)}
  .sidebar-backdrop{display:block}
  .sidebar-header{padding-top:28px;margin-bottom:16px}
  .sidebar-close{display:flex;position:absolute;top:0;right:0;transform:none;align-items:center;justify-content:center;width:28px;height:28px;border-radius:6px;font-size:13px;color:#d0dedb;background:rgba(22,34,43,0.85);border:1px solid #2a383f;cursor:pointer;z-index:10}
  .sidebar-close:hover{color:#fff;border-color:#59bdf4}
  .hamburger-btn{display:flex}
  header{height:72px;padding:0 18px}
  .header-actions{gap:12px}
  .demo-pill{display:none}
  main{padding:22px 16px}
  .columns{grid-template-columns:1fr;gap:24px}
  .right-rail{display:block;order:2;max-width:700px;margin:auto;width:100%}
  .welcome{flex-direction:column;align-items:flex-start;gap:12px;margin-bottom:20px}
  .welcome h1{font-size:28px;line-height:1.18}
  .welcome-note{display:none}
  .feed-controls{flex-wrap:wrap;gap:12px}
  .tabs{gap:18px}
  .filters{overflow-x:auto;padding-bottom:6px;-webkit-overflow-scrolling:touch}
  .filters button{min-height:34px}
  .header-logo-link{display:inline-flex;align-items:center}
  .header-logo-img{height:46px;width:auto;max-width:185px}
  .breadcrumb{display:none}
}

@media(max-width:480px){
  header{padding:0 10px;height:66px}
  .header-left{gap:8px}
  .breadcrumb{display:none}
  .header-logo-img{height:42px;width:auto;max-width:160px}
  #topPost{padding:7px 11px;font-size:11.5px}
  main{padding:16px 10px}
  .catch-photo{height:280px}
  .catch-data{padding:10px 14px;gap:14px;flex-wrap:wrap}
  .catch-data .release{margin-left:0;width:100%;text-align:center}
  .post-actions{padding:10px 14px;gap:10px;flex-wrap:wrap}
  .post-actions .save{margin-left:0}
  dialog{padding:20px 16px;width:calc(100% - 20px)}
}
.avatar{overflow:hidden;position:relative}
.avatar img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}
.avatar-edit-box{display:flex;align-items:center;gap:18px;margin:15px 0 10px;padding:12px;background:#111c24;border-radius:10px;border:1px solid #2a4052}
.avatar-edit-actions{display:flex;flex-direction:column;gap:8px}
.avatar-file-label{display:inline-flex;align-items:center;gap:6px;cursor:pointer;background:#254861;color:#d1ebff;padding:8px 14px;border-radius:6px;font-size:13px;font-weight:600}
.avatar-file-label:hover{background:#305b7a}
.avatar-file-label input{display:none}
.comment-head{display:flex;align-items:center;gap:10px;margin-bottom:6px}
.comment-avatar{width:28px!important;height:28px!important;font-size:10px!important;flex-shrink:0}
dialog{background:#16222b;color:#e5edeb;border:1px solid #35474d;box-shadow:0 30px 100px #0008}dialog::backdrop{background:#03090ec9}dialog p{color:#abbcc0}dialog input,dialog textarea,dialog select{background:#0f1921;color:#e5edeb;border-color:#405158}dialog input::placeholder,dialog textarea::placeholder{color:#8fa2a9}dialog input:focus,dialog textarea:focus,dialog select:focus{outline:2px solid #59bdf4;outline-offset:2px}dialog input::file-selector-button{background:#254861;color:#d1ebff;border:0;border-radius:4px;padding:7px 10px;margin-right:10px}.close{color:#d0dedb}.moderation-item small{color:#a6b7bc}.moderation-item button{border-color:#356b91;color:#c1e8ff}.moderation-item button:hover{background:#254e6c}#toast{background:#a8dfff;color:#102b40;border:1px solid #d7eeff;box-shadow:0 12px 40px #0006}button:focus-visible,a:focus-visible{outline-color:#59bdf4}::selection{background:#126b96;color:#fff}

.reel-card{background-image:radial-gradient(ellipse at 130% 65%,transparent 38%,#356282 38.3%,transparent 38.7%,transparent 47%,#356282 47.3%,transparent 47.7%,transparent 56%,#356282 56.3%,transparent 56.7%)}