.header{
  position: sticky;
  top:0;
  z-index:10;
  background:#fff;
  border-bottom:1px solid var(--border);
  padding:14px 20px;
  display:flex;
  align-items:center;
}

.header__brand{
  font-weight:700;
  letter-spacing:.2px;
  color: var(--primary);
  text-decoration:none;
  font-size:18px;
}

.nav{
  margin-left:auto;
  display:flex;
  align-items:center;
  gap:20px;
}

.nav a{
  color: var(--primary);
  text-decoration:none;
  font-weight:500;
}
.nav a:hover{ text-decoration:underline; }

.profile-menu,
.QRCode-menu {
  position: relative;
}

.profile-menu button,
.QRCode-menu button {
  background: none;
  border: none;
  color: var(--primary);
  font-weight: 500;
  cursor: pointer;
  font-size: 15px;
}

.profile-dropdown,
.QRCode-dropdown {
  display: none;
  position: absolute;
  right: 0;
  top: 120%;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 8px;
  box-shadow: var(--shadow);
  min-width: 160px;
  padding: 8px 0;
  z-index: 20;
}

.profile-dropdown a,
.profile-dropdown form button,
.QRCode-dropdown a,
.QRCode-dropdown form button {
  display: block;
  width: 100%;
  text-align: left;
  background: none;
  border: none;
  padding: 10px 16px;
  font-size: 14px;
  color: var(--text);
  cursor: pointer;
}

.profile-dropdown a:hover,
.profile-dropdown form button:hover,
.QRCode-dropdown a:hover,
.QRCode-dropdown form button:hover {
  background: #f8fafc;
}