.noknok-toolbar {
  position: fixed; z-index: 100; inset: 0 0 auto; display: flex;
  width: 100%; max-width: none; min-height: 76px; margin: 0;
  align-items: center; justify-content: space-between; gap: 24px;
  padding: 6px clamp(16px, 3vw, 44px); box-sizing: border-box;
  border-bottom: 1px solid rgba(255,255,255,.08); border-radius: 0;
  background: #071112; color: #f7fbf5; box-shadow: none;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
.noknok-toolbar .nav { display: flex; width: 100%; align-items: center; justify-content: space-between; gap: 24px; padding: 0; background: #071112; }
.noknok-toolbar .brand { display: inline-flex; align-items: center; gap: 2px; color: #f7fbf5; text-decoration: none; }
.noknok-toolbar .brand-icon { width: 64px !important; height: 64px !important; max-width: 64px !important; max-height: 64px !important; flex: 0 0 64px; border-radius: 7px; object-fit: cover; }
.noknok-toolbar .brand-wordmark { display: inline-flex; align-items: baseline; gap: 0; color: #f7fbf5; font: 800 2rem/1 Inter, ui-sans-serif, system-ui, sans-serif; }
.noknok-toolbar .brand-wordmark span { color: #00e5a8; }
.noknok-toolbar .brand-dashboard-label { display: inline-flex; align-items: center; margin-left: 12px; padding-left: 14px; border-left: 1px solid #fff; color: #fff; font: 800 1.1rem/1 Inter, ui-sans-serif, system-ui, sans-serif; }
.noknok-toolbar nav, .noknok-toolbar .nav-links { display: flex; align-items: center; gap: clamp(12px, 2.4vw, 28px); }
.noknok-toolbar .nav-links { margin-left: auto; gap: 12px; }
.noknok-toolbar nav > a { color: #f7fbf5; font: 800 1rem/1 Inter, ui-sans-serif, system-ui, sans-serif; }
.noknok-toolbar nav > a:hover, .noknok-toolbar nav > a:focus-visible { color: #00e5a8; }
.noknok-toolbar .nav-cta, .noknok-toolbar .nav-button, .noknok-toolbar .dashboard-disconnect { min-height: var(--button-height, 40px); border: 1px solid #00e5a8; border-radius: 14px; background: transparent; color: #00e5a8; font: 900 1rem/1 Inter, ui-sans-serif, system-ui, sans-serif; }
.noknok-toolbar .nav-cta, .noknok-toolbar .nav-button { display: inline-flex; align-items: center; justify-content: center; padding: 0 18px; }
.noknok-toolbar .nav-button.is-active { background: #00e5a8; color: #03150f; }
.noknok-toolbar .dashboard-disconnect { display: inline-flex; width: var(--button-height, 40px); min-width: var(--button-height, 40px); align-items: center; justify-content: center; gap: 0; overflow: hidden; padding: 0; cursor: pointer; transition: width 160ms ease, gap 160ms ease, padding 160ms ease; }
.noknok-toolbar .dashboard-disconnect > span:first-child { font-size: 1.35rem; line-height: 1; }
.noknok-toolbar .dashboard-disconnect-label { max-width: 0; opacity: 0; transition: max-width 160ms ease, opacity 120ms ease; }
.noknok-toolbar .dashboard-disconnect:hover, .noknok-toolbar .dashboard-disconnect:focus-visible { width: 150px; gap: 10px; padding: 0 22px 0 14px; background: #00e5a8; color: #03150f; }
.noknok-toolbar .dashboard-disconnect:hover .dashboard-disconnect-label, .noknok-toolbar .dashboard-disconnect:focus-visible .dashboard-disconnect-label { max-width: 90px; opacity: 1; }
@media (max-width: 1060px) {
  .noknok-toolbar--merchant .nav { align-items: flex-start; flex-direction: column; gap: 8px; }
  .noknok-toolbar--merchant .nav-links { flex-wrap: wrap; margin-left: 0; }
}
@media (max-width: 720px) {
  .noknok-toolbar .brand-icon { width: 52px !important; height: 52px !important; max-width: 52px !important; max-height: 52px !important; flex-basis: 52px; }
  .noknok-toolbar .brand-wordmark { font-size: 1.65rem; }
  .noknok-toolbar .brand-dashboard-label { margin-left: 7px; padding-left: 9px; font-size: .9rem; }
}
