/* Cloudflare site: stable, accessible header controls across viewports.
   This layer is intentionally after the generated main stylesheet. */
.navbar{min-width:0}
.navbar-left,.navbar-search,.navbar-search input{min-width:0}
.navbar-right{position:relative;z-index:2;min-width:0}
.navbar-right > .profile-chip{
  cursor:pointer;touch-action:manipulation;pointer-events:auto!important;
  position:relative;min-width:40px;max-width:min(210px,30vw);
}
.navbar-right > .profile-chip .profile-chip-text{min-width:0}
.navbar-right > .profile-chip .profile-chip-text strong{
  display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.navbar-right > .icon-btn[aria-label^="Notifications"]{
  display:inline-flex!important;position:relative;align-items:center;justify-content:center;
  cursor:pointer;touch-action:manipulation;pointer-events:auto!important;
  min-width:42px;min-height:42px;
}
.navbar-right > .icon-btn[aria-label^="Notifications"] .badge{pointer-events:none}
.navbar-right > .profile-chip:focus-visible,
.navbar-right > .icon-btn[aria-label^="Notifications"]:focus-visible{
  outline:2px solid var(--accent,#f56a23);outline-offset:2px;
}
/* The original Supabase profile editor is relocated inside the account dialog. */
.sq-account .sq-profile-editor-slot:not([hidden]){
  display:block;box-sizing:border-box;min-width:0;max-width:100%;
  border-top:1px solid var(--sq-border,var(--border));padding-top:14px;
  overflow-wrap:anywhere;
}
.sq-account .sq-profile-editor-slot .listener-profile-edit{
  box-sizing:border-box;display:grid;width:100%;min-width:0;
  padding:0!important;margin:0!important;max-height:none!important;overflow:visible!important;
  gap:12px;
}
.sq-account .sq-profile-editor-slot input{max-width:100%;min-width:0}
.sq-account .sq-profile-editor-slot .listener-profile-actions button{min-height:44px}
@media (min-width:701px) and (max-width:1240px){
  .navbar{gap:clamp(8px,1vw,16px);padding-inline:clamp(12px,1.4vw,22px)}
  .navbar-left{gap:clamp(10px,1vw,20px)}
  .navbar-search{flex:1 1 180px;max-width:min(33vw,380px)}
  .navbar-right{gap:clamp(4px,.7vw,10px)}
}
@media (min-width:701px) and (max-width:990px){
  .navbar .navbar-links{display:none!important}
  .navbar-right > .profile-chip{max-width:156px}
}
@media (max-width:700px){
  /* Never hide the bell when it gains/loses the has-badge class. */
  .navbar-right > .icon-btn[aria-label^="Notifications"]{
    display:inline-flex!important;width:40px!important;height:40px!important;
    min-width:40px!important;min-height:40px!important;
  }
  .navbar-right > .profile-chip{display:inline-flex!important;max-width:42px}
}
@media (max-width:390px){
  .navbar .logo-word{font-size:13px!important}
  .navbar .logo-mark{width:29px!important;height:29px!important;flex-basis:29px!important}
  .navbar-right{gap:0!important}
  .navbar-right > .icon-btn[aria-label^="Notifications"]{
    width:36px!important;min-width:36px!important;height:40px!important;min-height:40px!important;
  }
}
@media (pointer:coarse){
  .navbar-right > .profile-chip{min-height:42px}
}