/* Scoped to the optional Hunt game-account widget. Never touches HNT sidebar. */
.hnt-steam-bridge .profile-edit-section{display:grid;grid-template-columns:minmax(210px, 26%) minmax(0, 1fr);gap:22px}
.hnt-steam-bridge .profile-edit-section-copy{min-width:0}
.hnt-steam-bridge .profile-edit-section-copy h2{font-size:19px;font-weight:800;margin:0 0 10px}
.hnt-steam-bridge .profile-edit-section-copy p{color:#87999e;font-size:12.5px;line-height:1.6;margin:0}
.hnt-steam-bridge-list{min-width:0;display:flex;flex-direction:column;gap:10px}
.hnt-steam-bridge-row{
  min-width:0;border:1px solid rgba(135,167,174,.22);border-radius:12px;
  padding:16px 18px;background:linear-gradient(145deg,rgba(31,43,46,.9),rgba(21,33,36,.86))
}
.hnt-steam-bridge-head{display:flex;align-items:center;gap:12px;min-width:0;flex-wrap:wrap}
.hnt-steam-bridge-head>i{color:#d9e4e5;font-size:27px}
.hnt-steam-bridge-label{display:flex;flex:1;flex-direction:column;gap:3px;min-width:100px}
.hnt-steam-bridge-label strong{font-size:18px;font-weight:800;color:#e5e8e9}
.hnt-steam-bridge-label small{font-size:12px;color:#879a9e}
.hnt-steam-bridge-button{
  color:#ecc0a7;border:1px solid #895240;background:#312e2d;
  font-size:12px;font-weight:700;font-family:inherit;border-radius:9px;padding:11px 14px;min-height:36px;cursor:pointer
}
.hnt-steam-bridge-button:hover{background:#44332d;color:#f8c9aa}
.hnt-steam-bridge-button:focus-visible{outline:2px solid #e5a381;outline-offset:2px}
.hnt-steam-bridge-hint{display:block;margin:11px 0 0;color:#8d9da2;font-size:12px;line-height:1.4}
.hnt-steam-bridge-stats{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:13px 0 0}
.hnt-steam-bridge-stat{display:flex;flex-direction:column;gap:6px;background:rgba(9,19,22,.35);border:1px solid rgba(137,158,165,.15);border-radius:9px;padding:16px 14px}
.hnt-steam-bridge-stat span{font-size:12px;color:#9aa8ad}
.hnt-steam-bridge-stat strong{font-size:19px;font-weight:800;color:#e9eaeb}
.hnt-steam-bridge-notice{border:1px solid #744d3f;border-radius:9px;padding:12px 15px;color:#edb9a1;background:#302b29;font-size:12px}
@media(max-width:900px){.hnt-steam-bridge .profile-edit-section{grid-template-columns:1fr}}
@media(max-width:580px){.hnt-steam-bridge-head>i{font-size:22px}.hnt-steam-bridge-stats{grid-template-columns:1fr}.hnt-steam-bridge-button{padding:8px 11px}}

/* Console account controls, isolated from Steam and global profile layout. */
.hnt-console-psn-form{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:13px 0 2px}
.hnt-console-psn-input{min-width:145px;flex:1 1 155px;border:1px solid #586a6f;border-radius:8px;background:rgba(6,12,14,.65);color:#e1e6e6;height:38px;padding:8px 12px;font:inherit;font-size:13px}
.hnt-console-psn-input:focus-visible{outline:2px solid #c47c63}
.hnt-console-identity{font-size:12px;color:#ccd8d8;margin:9px 0 0}

/* PROFILE EDIT SHARED SHELL STYLES 20261005 (live compatibility shim).
   Scoped so Steam, Feed, and unrelated screens never change. */
@scope (body.profile-edit-page) {
/* ================= GLOBAL LANGUAGE SWITCH ================= */
.redesign-global-topbar .redesign-language-menu{
  position:relative;
}

.redesign-global-topbar .topbar-language-toggle{
  height:32px;
  min-width:54px;
  padding:0 7px;
  border:1px solid transparent;
  border-radius:8px;
  background:transparent;
  color:#c7d0d2;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  font:600 12px/1 Inter,sans-serif;
  cursor:pointer;
  transition:color .16s ease,border-color .16s ease,background .16s ease;
}

.redesign-global-topbar .topbar-language-toggle:hover,
.redesign-global-topbar .redesign-language-menu.open .topbar-language-toggle{
  color:#f2f4f2;
  border-color:#405158;
  background:rgba(255,255,255,.035);
}

.redesign-global-topbar .topbar-language-toggle > i:first-child{
  font-size:16px;
}

.redesign-global-topbar .topbar-language-toggle > i:last-child{
  font-size:10px;
  color:#7f8b8e;
}

.redesign-global-topbar .language-dropdown{
  width:210px;
  padding:10px;
}

.redesign-global-topbar .language-dropdown .dropdown-title-row{
  padding:5px 6px 10px;
}

.redesign-global-topbar .language-dropdown-list{
  display:flex;
  flex-direction:column;
  gap:3px;
}

.redesign-global-topbar .language-dropdown-option{
  width:100%;
  min-height:38px;
  padding:7px 9px;
  border:0;
  border-radius:8px;
  background:transparent;
  color:#cbd3d4;
  display:grid;
  grid-template-columns:34px 1fr 18px;
  align-items:center;
  gap:8px;
  text-align:left;
  font:600 13px/1.15 Inter,sans-serif;
  cursor:pointer;
}

.redesign-global-topbar .language-dropdown-option:hover{
  background:rgba(255,255,255,.045);
  color:#fff;
}

.redesign-global-topbar .language-dropdown-option.active{
  background:rgba(239,139,104,.09);
  color:#f2a082;
}

.redesign-global-topbar .language-dropdown-code{
  color:#8e9b9d;
  font-size:11px;
  letter-spacing:.07em;
}

.redesign-global-topbar .language-dropdown-option.active .language-dropdown-code{
  color:#f2a082;
}

@media (max-width:640px){
  .redesign-global-topbar .topbar-language-toggle{
    min-width:44px;
    width:44px;
    height:40px;
    padding:0 4px;
    gap:3px;
  }

  .redesign-global-topbar .topbar-language-toggle > i:last-child{
    display:none;
  }

  .redesign-global-topbar .language-dropdown{
    right:-132px;
    width:190px;
  }
}



/* ===== MOBILE SHELL + VIEWER FIX 2026-09-29 ===== */

/* Dedicated app-style bottom navigation. The desktop sidebar is no longer
   repurposed as the mobile bottom bar. */
.redesign-mobile-bottom-nav,
.redesign-mobile-menu-trigger,
.redesign-mobile-sidebar-close,
.redesign-mobile-sidebar-backdrop{
  display:none;
}

@media (max-width:900px){
  html.hnt-mobile-menu-open,
  html.hnt-mobile-menu-open body{
    overflow:hidden!important;
  }

  .stage-wrapper{
    padding-bottom:calc(102px + env(safe-area-inset-bottom, 0px))!important;
  }

  /* Top-left drawer button. */
  .redesign-global-topbar{
    position:relative!important;
  }

  .redesign-mobile-menu-trigger{
    position:absolute;
    top:0;
    left:0;
    z-index:190;
    display:grid;
    width:40px;
    height:40px;
    place-items:center;
    border:1px solid rgba(255,255,255,.08);
    border-radius:12px;
    background:rgba(10,18,22,.9);
    color:#c7d1d3;
    font-size:21px;
    backdrop-filter:blur(12px);
  }

  .redesign-mobile-menu-trigger:active{
    transform:scale(.96);
  }

  .topbar-right{
    min-height:40px;
    padding-left:50px;
  }

  /* Full sidebar becomes an off-canvas drawer on mobile. */
  .stage > .sidebar{
    position:fixed!important;
    top:0!important;
    left:0!important;
    right:auto!important;
    bottom:0!important;
    z-index:5200!important;
    width:min(86vw,350px)!important;
    height:100dvh!important;
    min-height:100vh!important;
    padding:22px 18px 34px!important;
    border:0!important;
    border-right:1px solid #34464d!important;
    border-radius:0!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    background:rgba(7,15,18,.985)!important;
    box-shadow:18px 0 46px rgba(0,0,0,.52)!important;
    backdrop-filter:blur(18px)!important;
    transform:translateX(-104%)!important;
    transition:transform .22s ease!important;
  }

  .stage > .sidebar.mobile-open{
    transform:translateX(0)!important;
  }

  .stage > .sidebar::before{
    opacity:.38!important;
  }

  .stage > .sidebar .sidebar-top{
    position:relative!important;
    display:block!important;
    padding-right:48px!important;
  }

  .stage > .sidebar .nav-main,
  .stage > .sidebar .nav-secondary,
  .stage > .sidebar .nav-tertiary{
    display:flex!important;
    width:100%!important;
    height:auto!important;
    grid-template-columns:none!important;
    flex-direction:column!important;
    align-items:stretch!important;
  }

  .stage > .sidebar .nav-secondary{
    display:flex!important;
  }

  .stage > .sidebar .nav-sep{
    display:block!important;
  }

  .stage > .sidebar .user-block{
    display:flex!important;
  }

  .stage > .sidebar .sidebar-bottom{
    display:block!important;
  }

  .stage > .sidebar .nav-main .nav-item,
  .stage > .sidebar .nav-main .nav-item:nth-child(n+5),
  .stage > .sidebar .nav-secondary .nav-item,
  .stage > .sidebar .nav-tertiary .nav-item{
    display:flex!important;
    width:100%!important;
    height:44px!important;
    min-height:44px!important;
    padding:0 12px!important;
    flex-direction:row!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:11px!important;
    text-align:left!important;
    font-size:13px!important;
  }

  .stage > .sidebar .nav-item i{
    width:22px!important;
    font-size:19px!important;
  }

  .stage > .sidebar .nav-item > span:not(.nav-accent):not(.badge){
    font-size:13px!important;
    line-height:1.1!important;
  }

  .stage > .sidebar .nav-accent{
    display:block!important;
  }

  .stage > .sidebar .sidebar-bottom{
    margin-top:18px!important;
  }

  .redesign-mobile-sidebar-close{
    position:absolute;
    top:0;
    right:0;
    z-index:3;
    display:grid;
    width:38px;
    height:38px;
    place-items:center;
    border:1px solid rgba(255,255,255,.1);
    border-radius:10px;
    background:rgba(8,16,19,.72);
    color:#d7dfe0;
    font-size:20px;
  }

  .redesign-mobile-sidebar-backdrop{
    position:fixed;
    inset:0;
    z-index:5190;
    display:block;
    width:100%;
    height:100%;
    border:0;
    background:rgba(0,0,0,.66);
    backdrop-filter:blur(2px);
  }

  /* App navigation: Home, Search, center Moments, LFG, Menu. */
  .redesign-mobile-bottom-nav{
    position:fixed;
    left:10px;
    right:10px;
    bottom:calc(10px + env(safe-area-inset-bottom, 0px));
    z-index:480;
    display:grid;
    grid-template-columns:1fr 1fr 1.12fr 1fr 1fr;
    align-items:end;
    height:72px;
    padding:0 5px;
    border:1px solid rgba(255,255,255,.09);
    border-radius:19px;
    background:
      linear-gradient(180deg,rgba(14,21,24,.97),rgba(7,13,16,.985));
    box-shadow:0 18px 40px rgba(0,0,0,.46);
    backdrop-filter:blur(18px);
  }

  .redesign-mobile-bottom-nav > a,
  .redesign-mobile-bottom-nav > button{
    position:relative;
    display:flex;
    min-width:0;
    height:68px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:4px;
    padding:9px 2px 6px;
    border:0;
    background:transparent;
    color:#aeb9bc;
    text-decoration:none;
    font:600 9.5px/1 Inter,Arial,sans-serif;
  }

  .redesign-mobile-bottom-nav > a > i,
  .redesign-mobile-bottom-nav > button > i{
    font-size:21px;
  }

  .redesign-mobile-bottom-nav > a > span,
  .redesign-mobile-bottom-nav > button > span{
    max-width:100%;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }

  .redesign-mobile-bottom-nav > .is-active{
    color:#fff;
  }

  .redesign-mobile-bottom-nav > .is-active > i{
    color:var(--accent);
  }

  .redesign-mobile-bottom-nav-moments{
    top:-16px;
    height:84px!important;
    justify-content:flex-start!important;
    padding-top:0!important;
  }

  .redesign-mobile-bottom-nav-moments-icon{
    display:grid!important;
    width:52px!important;
    height:52px!important;
    min-width:52px!important;
    place-items:center;
    overflow:visible!important;
    border:3px solid #e8eeee;
    border-radius:50%;
    background:#f4f6f5;
    box-shadow:0 9px 22px rgba(0,0,0,.38);
    color:#152228;
  }

  .redesign-mobile-bottom-nav-moments-icon i{
    margin-left:2px;
    font-size:20px;
  }

  .redesign-mobile-bottom-nav-moments.is-active
  .redesign-mobile-bottom-nav-moments-icon{
    border-color:#ef8b68;
    background:#ef8b68;
    color:#17100d;
  }

  .redesign-mobile-bottom-nav-moments > span:last-child{
    margin-top:3px;
    color:#aeb9bc;
  }

  .redesign-mobile-bottom-nav-moments.is-active > span:last-child{
    color:#fff;
  }

  /* The old sidebar-as-bottom-nav rules are intentionally neutralized. */
  .stage > .sidebar .mobile-only{
    display:none!important;
  }

  /* Final mobile media viewer override. It must live after the duplicated
     desktop lightbox rules further up this stylesheet. */
  .redesign-media-lightbox{
    position:fixed!important;
    inset:0!important;
    z-index:10000!important;
    display:block!important;
    width:100vw!important;
    height:100dvh!important;
    overflow:hidden!important;
    background:#071014!important;
  }

  .redesign-media-lightbox .media-lightbox-shell{
    width:100vw!important;
    max-width:none!important;
    height:100dvh!important;
    max-height:none!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    grid-template-rows:minmax(230px,43dvh) minmax(0,1fr)!important;
    overflow:hidden!important;
    background:#0c1720!important;
  }

  .redesign-media-lightbox .media-lightbox-stage{
    position:relative!important;
    width:100%!important;
    height:100%!important;
    min-width:0!important;
    min-height:0!important;
    margin:0!important;
    border:0!important;
    border-radius:0!important;
    overflow:hidden!important;
    background:#020506!important;
  }

  .redesign-media-lightbox .media-lightbox-stage > img{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    max-width:none!important;
    max-height:none!important;
    object-fit:contain!important;
    object-position:center!important;
    background:#020506!important;
  }

  .redesign-media-lightbox .media-lightbox-stage [data-hnt-vidstack-player="1"],
  .redesign-media-lightbox .media-lightbox-stage .media-player{
    width:100%!important;
    height:100%!important;
    max-width:none!important;
    max-height:none!important;
  }

  .redesign-media-lightbox .media-lightbox-side{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    width:100%!important;
    height:100%!important;
    min-width:0!important;
    min-height:0!important;
    overflow:hidden!important;
    border:0!important;
    border-top:1px solid rgba(255,255,255,.07)!important;
    background:#101a26!important;
  }

  .redesign-media-lightbox .media-lightbox-side-main{
    display:flex!important;
    width:100%!important;
    height:100%!important;
    min-width:0!important;
    min-height:0!important;
    flex-direction:column!important;
    overflow:hidden!important;
  }

  .redesign-media-lightbox .media-lightbox-side-rail{
    display:none!important;
  }

  .redesign-media-lightbox .media-lightbox-head{
    flex:0 0 auto!important;
    padding:11px 12px 9px!important;
  }

  .redesign-media-lightbox .media-lightbox-follow{
    min-width:0!important;
    max-width:100px!important;
    padding:0 8px!important;
    font-size:10px!important;
  }

  .redesign-media-lightbox .media-lightbox-copy,
  .redesign-media-lightbox .media-lightbox-stats,
  .redesign-media-lightbox .media-lightbox-actionbar{
    flex:0 0 auto!important;
  }

  .redesign-media-lightbox .media-lightbox-comments{
    flex:1 1 auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    padding:12px!important;
  }

  .redesign-media-lightbox .media-lightbox-reply{
    flex:0 0 auto!important;
    min-height:54px!important;
    padding:8px 10px calc(8px + env(safe-area-inset-bottom,0px))!important;
    border-top:1px solid rgba(255,255,255,.07)!important;
    background:#101a26!important;
  }

  .redesign-media-lightbox .media-lightbox-mobile-close{
    position:absolute!important;
    top:10px!important;
    right:10px!important;
    z-index:30!important;
    display:grid!important;
    width:38px!important;
    height:38px!important;
    place-items:center!important;
    border:1px solid rgba(255,255,255,.14)!important;
    border-radius:50%!important;
    background:rgba(5,12,15,.82)!important;
    color:#fff!important;
    font-size:21px!important;
    backdrop-filter:blur(8px)!important;
  }

  .redesign-media-lightbox .media-lightbox-nav{
    width:38px!important;
    height:38px!important;
  }

  .redesign-media-lightbox .media-lightbox-nav-prev{ left:9px!important; }
  .redesign-media-lightbox .media-lightbox-nav-next{ right:9px!important; }
  .redesign-media-lightbox .media-lightbox-pagination{ bottom:10px!important; }
  .redesign-media-lightbox .media-lightbox-video-badge{
    left:10px!important;
    bottom:10px!important;
  }
}

@media (max-width:640px){
  .redesign-mobile-bottom-nav{
    left:8px;
    right:8px;
    bottom:calc(8px + env(safe-area-inset-bottom,0px));
  }

  .redesign-mobile-bottom-nav > a,
  .redesign-mobile-bottom-nav > button{
    font-size:9px;
  }

  .redesign-media-lightbox .media-lightbox-shell{
    grid-template-rows:minmax(210px,39dvh) minmax(0,1fr)!important;
  }

  .redesign-media-lightbox .media-lightbox-head{
    padding-right:54px!important;
  }

  .redesign-media-lightbox .media-lightbox-avatar{
    width:32px!important;
    height:32px!important;
  }

  .redesign-media-lightbox .media-lightbox-author strong{
    font-size:13px!important;
  }

  .redesign-media-lightbox .media-lightbox-author span{
    font-size:10px!important;
  }

  .redesign-media-lightbox .media-lightbox-stats{
    padding:9px 12px!important;
    font-size:11px!important;
  }

  .redesign-media-lightbox .media-lightbox-actionbar button{
    height:40px!important;
    font-size:11.5px!important;
  }
}


/* ===== MOBILE NAV POLISH + DRAWER STACK FIX 2026-09-29 ===== */
.redesign-mobile-moments-back{
  display:none;
}

@media (max-width:900px){
  /* Drawer and backdrop now share the stage stacking context. Keep the
     sidebar itself interactive and let only the backdrop catch outside taps. */
  .stage > .sidebar{
    pointer-events:auto!important;
    touch-action:pan-y!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
    isolation:isolate!important;
  }

  .stage > .sidebar.mobile-open{
    z-index:5200!important;
    pointer-events:auto!important;
  }

  .redesign-mobile-sidebar-backdrop{
    z-index:5190!important;
    pointer-events:auto!important;
    background:rgba(1,5,7,.56)!important;
    -webkit-backdrop-filter:blur(5px)!important;
    backdrop-filter:blur(5px)!important;
  }

  html.hnt-mobile-menu-open .redesign-mobile-bottom-nav{
    opacity:0!important;
    pointer-events:none!important;
    transform:translateY(18px) scale(.98)!important;
  }

  /* App-like frosted glass bottom dock. */
  .redesign-mobile-bottom-nav{
    left:14px!important;
    right:14px!important;
    bottom:calc(12px + env(safe-area-inset-bottom,0px))!important;
    height:78px!important;
    padding:4px 7px 5px!important;
    overflow:visible!important;
    border:1px solid rgba(255,255,255,.15)!important;
    border-radius:24px!important;
    background:
      linear-gradient(180deg,rgba(27,34,37,.70),rgba(8,14,17,.76))!important;
    -webkit-backdrop-filter:blur(28px) saturate(145%)!important;
    backdrop-filter:blur(28px) saturate(145%)!important;
    box-shadow:
      0 18px 46px rgba(0,0,0,.46),
      inset 0 1px 0 rgba(255,255,255,.11),
      inset 0 -1px 0 rgba(255,255,255,.035)!important;
    transition:opacity .18s ease,transform .18s ease!important;
  }

  .redesign-mobile-bottom-nav::before{
    content:"";
    position:absolute;
    inset:3px;
    z-index:0;
    border:1px solid rgba(255,255,255,.045);
    border-radius:20px;
    background:
      radial-gradient(circle at 18% 0%,rgba(255,255,255,.085),transparent 37%),
      linear-gradient(180deg,rgba(255,255,255,.028),rgba(255,255,255,.004));
    pointer-events:none;
  }

  .redesign-mobile-bottom-nav > a,
  .redesign-mobile-bottom-nav > button{
    position:relative!important;
    z-index:1!important;
    height:68px!important;
    border-radius:17px!important;
    color:#aeb9bc!important;
    transition:color .16s ease,background .16s ease,transform .16s ease!important;
  }

  .redesign-mobile-bottom-nav > a:active,
  .redesign-mobile-bottom-nav > button:active{
    transform:scale(.96);
  }

  .redesign-mobile-bottom-nav > a > i,
  .redesign-mobile-bottom-nav > button > i,
  .redesign-mobile-bottom-nav > a > span,
  .redesign-mobile-bottom-nav > button > span{
    position:relative;
    z-index:2;
  }

  .redesign-mobile-bottom-nav > .is-active:not(.redesign-mobile-bottom-nav-moments){
    color:#f7f8f8!important;
    background:
      linear-gradient(180deg,rgba(239,139,104,.13),rgba(239,139,104,.035))!important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.045),
      inset 0 0 0 1px rgba(239,139,104,.06)!important;
  }

  .redesign-mobile-bottom-nav > .is-active:not(.redesign-mobile-bottom-nav-moments) > i{
    color:#ef8b68!important;
  }

  .redesign-mobile-bottom-nav-moments{
    top:-14px!important;
    height:82px!important;
    background:transparent!important;
  }

  .redesign-mobile-bottom-nav-moments-icon{
    width:54px!important;
    height:54px!important;
    min-width:54px!important;
    border:1px solid rgba(255,255,255,.42)!important;
    background:
      linear-gradient(180deg,rgba(233,241,241,.22),rgba(157,174,177,.12))!important;
    color:#f5f7f7!important;
    -webkit-backdrop-filter:blur(18px) saturate(130%)!important;
    backdrop-filter:blur(18px) saturate(130%)!important;
    box-shadow:
      0 10px 28px rgba(0,0,0,.42),
      inset 0 1px 0 rgba(255,255,255,.28),
      inset 0 -1px 0 rgba(255,255,255,.08)!important;
  }

  .redesign-mobile-bottom-nav-moments.is-active
  .redesign-mobile-bottom-nav-moments-icon{
    border-color:rgba(239,139,104,.68)!important;
    background:
      linear-gradient(180deg,rgba(239,139,104,.94),rgba(199,89,58,.90))!important;
    color:#17100d!important;
    box-shadow:
      0 10px 28px rgba(0,0,0,.42),
      0 0 0 4px rgba(239,139,104,.09),
      inset 0 1px 0 rgba(255,255,255,.24)!important;
  }

  .redesign-mobile-menu-trigger{
    border:1px solid rgba(255,255,255,.13)!important;
    background:rgba(15,23,26,.62)!important;
    -webkit-backdrop-filter:blur(20px) saturate(135%)!important;
    backdrop-filter:blur(20px) saturate(135%)!important;
    box-shadow:
      0 10px 24px rgba(0,0,0,.24),
      inset 0 1px 0 rgba(255,255,255,.08)!important;
  }

  .stage > .sidebar{
    background:
      linear-gradient(180deg,rgba(9,18,21,.965),rgba(5,12,15,.982))!important;
    border-right:1px solid rgba(255,255,255,.12)!important;
    box-shadow:
      22px 0 56px rgba(0,0,0,.58),
      inset -1px 0 0 rgba(255,255,255,.025)!important;
    -webkit-backdrop-filter:blur(22px) saturate(125%)!important;
    backdrop-filter:blur(22px) saturate(125%)!important;
  }

  .redesign-mobile-sidebar-close{
    border-color:rgba(255,255,255,.12)!important;
    background:rgba(255,255,255,.045)!important;
    -webkit-backdrop-filter:blur(12px)!important;
    backdrop-filter:blur(12px)!important;
  }
}

@media (max-width:640px){
  .redesign-mobile-bottom-nav{
    left:10px!important;
    right:10px!important;
    bottom:calc(9px + env(safe-area-inset-bottom,0px))!important;
    height:76px!important;
    border-radius:22px!important;
  }

  .redesign-mobile-bottom-nav > a,
  .redesign-mobile-bottom-nav > button{
    height:66px!important;
    font-size:9px!important;
  }
}


/* ===== EXACT APP-STYLE FOUR TAB MOBILE DOCK 2026-09-29 ===== */
@media (max-width:900px){
  .redesign-mobile-bottom-nav{
    left:14px!important;
    right:14px!important;
    bottom:calc(12px + env(safe-area-inset-bottom,0px))!important;
    height:82px!important;
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    align-items:stretch!important;
    gap:0!important;
    padding:5px!important;
    overflow:hidden!important;
    border:1px solid rgba(255,255,255,.14)!important;
    border-radius:28px!important;
    background:rgba(24,25,26,.76)!important;
    -webkit-backdrop-filter:blur(28px) saturate(130%)!important;
    backdrop-filter:blur(28px) saturate(130%)!important;
    box-shadow:
      0 16px 42px rgba(0,0,0,.42),
      inset 0 1px 0 rgba(255,255,255,.08)!important;
  }

  .redesign-mobile-bottom-nav::before{
    inset:4px!important;
    border:1px solid rgba(255,255,255,.075)!important;
    border-radius:23px!important;
    background:rgba(5,7,8,.16)!important;
  }

  .redesign-mobile-bottom-nav > a,
  .redesign-mobile-bottom-nav > button,
  .redesign-mobile-bottom-nav > .redesign-mobile-bottom-nav-moments{
    position:relative!important;
    top:auto!important;
    display:flex!important;
    width:100%!important;
    min-width:0!important;
    height:72px!important;
    min-height:72px!important;
    align-items:center!important;
    justify-content:center!important;
    flex-direction:column!important;
    gap:4px!important;
    padding:8px 4px 7px!important;
    border:0!important;
    border-radius:18px!important;
    background:transparent!important;
    box-shadow:none!important;
    color:#aeb2b3!important;
  }

  .redesign-mobile-bottom-nav > a > i,
  .redesign-mobile-bottom-nav > button > i{
    display:block!important;
    margin:0!important;
    color:#b8bec0!important;
    font-size:25px!important;
    line-height:1!important;
  }

  .redesign-mobile-bottom-nav > a > span,
  .redesign-mobile-bottom-nav > button > span{
    margin:0!important;
    color:inherit!important;
    font-size:10.5px!important;
    font-weight:600!important;
    line-height:1!important;
  }

  .redesign-mobile-bottom-nav > .is-active{
    background:rgba(255,255,255,.045)!important;
    color:#f2f3f3!important;
    box-shadow:none!important;
  }

  .redesign-mobile-bottom-nav > .is-active > i{
    color:#f0f2f2!important;
  }

  .redesign-mobile-bottom-nav > .is-active::before{
    content:"";
    position:absolute;
    top:0;
    left:50%;
    width:54%;
    max-width:58px;
    height:3px;
    border-radius:0 0 3px 3px;
    background:rgba(245,247,247,.88);
    transform:translateX(-50%);
    box-shadow:0 0 10px rgba(255,255,255,.08);
  }

  .redesign-mobile-bottom-nav-moments-icon{
    display:contents!important;
  }

  .redesign-mobile-bottom-nav-moments-icon i{
    display:block!important;
    margin:0!important;
    color:#b8bec0!important;
    font-size:25px!important;
    line-height:1!important;
  }
}

@media (max-width:640px){
  .redesign-mobile-bottom-nav{
    left:10px!important;
    right:10px!important;
    bottom:calc(9px + env(safe-area-inset-bottom,0px))!important;
    height:80px!important;
    border-radius:26px!important;
  }

  .redesign-mobile-bottom-nav > a,
  .redesign-mobile-bottom-nav > button{
    height:70px!important;
    min-height:70px!important;
  }
}

}

/* HNT PROFILE EDIT – SHARED SIDEBAR IMAGE 20261005 */
body.profile-edit-page .sidebar-bottom{
  background-image:var(--hnt-appearance-sidebar-bottom-background, url('/app/redesign/feed/assets/sidebar_silhouette.png'))!important;
  background-size:cover!important;
  background-position:center!important;
  background-repeat:no-repeat!important;
}
body.profile-edit-page .sidebar-bottom > img{display:none!important;}
