:root{
  --nn-top:env(safe-area-inset-top,0px);
  --nn-right:env(safe-area-inset-right,0px);
  --nn-bottom:env(safe-area-inset-bottom,0px);
  --nn-left:env(safe-area-inset-left,0px);
  --nn-tab:70px;
}
.brand-logo-full{display:block;width:min(158px,calc(100% - 46px));height:42px;object-fit:contain;object-position:left center}
.brand-logo-icon{display:none;width:40px;height:40px;object-fit:contain}
.mobile-nav-close,.mobile-tabbar{display:none}
.login-brand-logo{display:block;width:min(270px,82vw);max-height:104px;margin:0 auto 8px;object-fit:contain}

@media(min-width:1181px){
  .nav-collapsed .brand-logo-full{display:none}
  .nav-collapsed .brand-logo-icon{display:block}
  .nav-collapsed .side-brand{justify-content:center}
}

@media(max-width:1180px){
  body.sehl-nav-open{overflow:hidden}
  .app-shell,.app-shell.nav-collapsed{display:block}
  .main,.nav-collapsed .main{width:100%;grid-column:auto}

  .side,.nav-collapsed .side{
    position:fixed;
    top:max(12px,var(--nn-top));
    left:max(12px,var(--nn-left));
    bottom:max(12px,var(--nn-bottom));
    right:auto;
    width:min(350px,calc(100vw - 32px));
    height:auto;
    padding:14px 13px 12px;
    border:1px solid var(--border-default);
    border-radius:26px;
    background:color-mix(in srgb,var(--surface-1) 96%,transparent);
    box-shadow:0 28px 80px -28px var(--black-a78),inset 0 1px 0 var(--white-a06);
    backdrop-filter:blur(28px) saturate(140%);
    -webkit-backdrop-filter:blur(28px) saturate(140%);
    transform:translateX(calc(-100% - 28px));
    transition:transform 260ms var(--ease-out),opacity 220ms ease;
    z-index:151
  }
  .nav-open .side,.nav-open.nav-collapsed .side{transform:translateX(0)}
  .nav-backdrop{
    display:block;position:fixed;inset:0;z-index:150;border:0;
    background:var(--black-a58);
    backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px)
  }

  .side-brand,.nav-collapsed .side-brand{
    min-height:58px;padding:4px 4px 13px;justify-content:flex-start;gap:10px
  }
  .brand-logo-full,.nav-collapsed .brand-logo-full{display:block}
  .brand-logo-icon,.nav-collapsed .brand-logo-icon{display:none}
  .collapse-button,.nav-collapsed .collapse-button{display:none!important}
  .mobile-nav-close{
    display:grid;place-items:center;width:42px;height:42px;min-width:42px;
    margin-left:auto;border:1px solid var(--border-default);border-radius:14px;
    background:var(--white-a04);color:var(--text-secondary);cursor:pointer
  }

  .quick-create,.nav-collapsed .quick-create{
    width:100%;min-height:46px;margin:12px 0 9px;border-radius:14px
  }
  .nav-collapsed .quick-create span,
  .nav-collapsed .nav-group h3,
  .nav-collapsed .nav-group .tx,
  .nav-collapsed .side-footer .tx{display:initial}

  .snav{padding:2px 2px 12px}
  .nav-group{margin-top:13px}
  .nav-group h3{margin:0 10px 6px;font-size:9px;letter-spacing:.16em}
  .snav .nav-group button,.nav-collapsed .snav .nav-group button{
    width:100%;min-height:44px;height:auto;margin:2px 0;padding:0 12px;
    justify-content:flex-start;border-radius:13px;font-size:13px
  }
  .snav .nav-group button.on,.nav-collapsed .snav .nav-group button.on{
    box-shadow:inset 3px 0 0 var(--accent),0 8px 22px -18px var(--accent)
  }
  .nav-collapsed .nav-badge{
    position:static;transform:none;margin-left:auto;min-width:20px;height:20px;font-size:10px
  }

  .side-footer,.nav-collapsed .side-footer{
    grid-template-columns:minmax(0,1fr) 44px 44px;gap:6px
  }
  .side-footer button,.nav-collapsed .side-footer button{
    width:auto;min-height:44px;margin:0;padding:0 10px;justify-content:flex-start;border-radius:13px
  }
  .side-footer .icon-footer,.nav-collapsed .side-footer .icon-footer{
    justify-content:center;padding:0
  }
  .mobile-menu{display:grid}
}

@media(max-width:680px){
  .mobile-menu{display:none!important}
  .topbar{min-height:62px;padding-bottom:8px}
  .topbar-title{min-width:0}
  .topbar-title h1{
    max-width:56vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap
  }

  .side,.nav-collapsed .side{
    top:auto;
    left:max(8px,var(--nn-left));
    right:max(8px,var(--nn-right));
    bottom:calc(var(--nn-tab) + max(10px,var(--nn-bottom)) + 7px);
    width:auto;
    max-height:calc(100dvh - var(--nn-tab) - var(--nn-top) - var(--nn-bottom) - 34px);
    border-radius:28px;
    transform:translateY(calc(100% + 100px))
  }
  .nav-open .side,.nav-open.nav-collapsed .side{transform:translateY(0)}

  .mobile-tabbar{
    position:fixed;
    left:max(8px,var(--nn-left));
    right:max(8px,var(--nn-right));
    bottom:max(7px,var(--nn-bottom));
    z-index:149;
    height:var(--nn-tab);
    padding:6px 7px;
    border:1px solid var(--border-default);
    border-radius:23px;
    background:color-mix(in srgb,var(--surface-1) 92%,transparent);
    box-shadow:0 18px 50px -24px var(--black-a78),inset 0 1px 0 var(--white-a06);
    backdrop-filter:blur(24px) saturate(145%);
    -webkit-backdrop-filter:blur(24px) saturate(145%);
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:3px
  }
  .mobile-tabbar button{
    position:relative;min-width:0;min-height:56px;padding:6px 3px 5px;
    border:0;border-radius:17px;background:transparent;color:var(--text-tertiary);
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;
    font-size:9px;font-weight:650;line-height:1;cursor:pointer;touch-action:manipulation
  }
  .mobile-tabbar button span{
    width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;text-align:center
  }
  .mobile-tabbar button.on{
    color:var(--accent-bright);
    background:linear-gradient(180deg,var(--gold-a18),var(--gold-a08))
  }
  .mobile-tabbar button.on:before{
    content:"";position:absolute;top:3px;width:18px;height:2px;border-radius:999px;
    background:var(--accent);box-shadow:0 0 10px var(--accent)
  }

  .content{
    padding-bottom:calc(var(--nn-tab) + max(24px,var(--nn-bottom)) + 18px)!important
  }
  .assistant-command,.mail-shell,.files-shell{
    height:calc(100dvh - 62px - var(--nn-tab) - var(--nn-bottom) - 18px)!important
  }
}

@media(max-width:430px){
  .mobile-tabbar{left:max(5px,var(--nn-left));right:max(5px,var(--nn-right));border-radius:21px;padding-inline:4px}
  .mobile-tabbar button{font-size:8px}
  .topbar-title h1{max-width:50vw;font-size:17px}
}

@media(max-height:560px) and (orientation:landscape) and (max-width:920px){
  .mobile-tabbar{
    left:auto;top:max(6px,var(--nn-top));right:max(6px,var(--nn-right));
    bottom:max(6px,var(--nn-bottom));width:72px;height:auto;
    grid-template-columns:1fr;grid-template-rows:repeat(5,minmax(0,1fr))
  }
  .mobile-tabbar button{min-height:0}
  .content{padding-right:calc(86px + var(--nn-right))!important;padding-bottom:18px!important}
  .side,.nav-collapsed .side{
    right:calc(84px + var(--nn-right));bottom:max(7px,var(--nn-bottom))
  }
}

@media(prefers-reduced-motion:reduce){
  .side,.mobile-tabbar{transition:none!important}
}