nav.unified-site-nav{border-bottom:1px solid rgba(255,255,255,.075);background:rgba(6,10,9,.72);backdrop-filter:blur(22px) saturate(125%);-webkit-backdrop-filter:blur(22px) saturate(125%)}
nav.unified-site-nav .nav-inner{min-height:76px}
nav.unified-site-nav .nav-links{display:flex;align-items:center;flex:0 1 680px;justify-content:space-between;min-width:min(600px,50vw);gap:6px;padding:5px;border:1px solid rgba(255,255,255,.1);border-radius:999px;background:rgba(17,22,34,.88);box-shadow:inset 0 1px 0 rgba(255,255,255,.025),0 10px 30px rgba(0,0,0,.14)}
nav.unified-site-nav .nav-links a{flex:1 1 auto;padding:9px 14px;border-radius:999px;color:#aeb0bd;font-size:14px;font-weight:850;text-align:center;white-space:nowrap}
nav.unified-site-nav .nav-links a:hover{color:#fff}
nav.unified-site-nav .nav-links a.active,nav.unified-site-nav .nav-links a[aria-current="page"]{color:#fff;background:rgba(54,245,155,.12);box-shadow:inset 0 0 0 1px rgba(54,245,155,.28),0 10px 30px rgba(20,184,108,.08)}
nav.unified-site-nav .nav-actions{gap:9px}
nav.unified-site-nav .nav-actions .btn{padding:11px 16px;font-size:13px}
@media(max-width:1100px) and (min-width:901px){nav.unified-site-nav .logo{font-size:0;gap:0}nav.unified-site-nav .nav-links{min-width:0}nav.unified-site-nav .nav-links a{padding-inline:10px;font-size:13px}}
@media(max-width:900px){nav.unified-site-nav .nav-links{min-width:0}nav.unified-site-nav.open .nav-links{display:flex!important;position:absolute;top:76px;left:0;right:0;flex-direction:column;gap:8px;padding:14px 16px;border:1px solid rgba(255,255,255,.09);border-bottom:0;border-radius:18px 18px 0 0;background:rgba(7,12,10,.97);z-index:99999}nav.unified-site-nav.open .nav-actions{display:flex!important;position:absolute;top:385px;left:0;right:0;flex-direction:column;gap:12px;padding:10px 16px 16px;border:1px solid rgba(255,255,255,.09);border-top:0;border-radius:0 0 18px 18px;background:rgba(7,12,10,.97);z-index:99999}nav.unified-site-nav.open .nav-actions .btn{width:100%}}

/* Keep the compact dashboard rail usable on phones. The Settings item becomes a
   real dropdown instead of disappearing behind the page-specific mobile CSS. */
@media(max-width:760px){
  .app-sidebar,.settings-sidebar{
    display:grid!important;
    grid-template-columns:repeat(7,minmax(0,1fr))!important;
    gap:4px!important;
    overflow:visible!important;
    position:relative!important;
    top:auto!important;
    width:100%!important;
    height:auto!important;
    padding:10px 14px!important;
    border-right:0!important;
    border-bottom:1px solid rgba(255,255,255,.09)!important;
  }
  .app-sidebar>a,.settings-sidebar>a,.app-sidebar .side-settings>summary,.settings-sidebar .side-settings>summary{
    min-width:0!important;
    min-height:44px;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    padding:10px 6px!important;
  }
  .app-sidebar>a span:not(.nav-icon),.settings-sidebar>a span:not(.nav-icon),
  .app-sidebar .side-settings>summary span:not(.nav-icon),.settings-sidebar .side-settings>summary span:not(.nav-icon){
    display:none!important;
  }
  .app-sidebar .nav-icon,.settings-sidebar .nav-icon{
    width:auto!important;
    margin:0!important;
  }
  .app-sidebar .side-settings,.settings-sidebar .side-settings{
    display:block!important;
    position:static!important;
    min-width:0!important;
    margin:0!important;
  }
  .app-sidebar .side-settings>summary:after,.settings-sidebar .side-settings>summary:after{
    position:absolute;
    margin:22px 0 0 20px!important;
    font-size:10px;
  }
  .app-sidebar .side-settings .settings-subnav,.settings-sidebar .side-settings .settings-subnav{
    display:none!important;
  }
  .app-sidebar .side-settings[open] .settings-subnav,.settings-sidebar .side-settings[open] .settings-subnav{
    display:grid!important;
    position:absolute!important;
    top:calc(100% + 8px)!important;
    left:12px!important;
    right:12px!important;
    z-index:1000!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:6px!important;
    margin:0!important;
    padding:12px!important;
    overflow:visible!important;
    border:1px solid rgba(54,245,155,.22)!important;
    border-radius:18px!important;
    background:rgba(7,12,10,.985)!important;
    box-shadow:0 20px 50px rgba(0,0,0,.48)!important;
    backdrop-filter:blur(22px);
    -webkit-backdrop-filter:blur(22px);
  }
  .app-sidebar .side-settings[open] .settings-subnav a,.settings-sidebar .side-settings[open] .settings-subnav a{
    display:flex!important;
    align-items:center;
    min-width:0;
    min-height:42px;
    margin:0!important;
    padding:10px 12px!important;
    border:0!important;
    border-radius:12px!important;
    white-space:normal!important;
    line-height:1.25;
  }
  .app-sidebar:has(.side-settings[open]),.settings-sidebar:has(.side-settings[open]){
    margin-bottom:176px!important;
  }
}

@media(max-width:420px){
  .app-main .sync-bar,.settings-main .sync-bar{
    align-items:flex-start!important;
    flex-direction:column!important;
    gap:8px!important;
  }
  .app-main .sync-meta,.settings-main .sync-meta{
    width:100%;
    justify-content:space-between;
    flex-wrap:wrap;
  }
}