.member-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.guest-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.stage.home-hero-only {
  grid-template-columns: minmax(0, 1fr);
  max-width: 1100px;
  margin-left: 90px;
  margin-right: auto;
}

.stage.home-hero-only .hero-copy {
  max-width: 780px;
}

.guest-actions .register-top-btn {
  color: #d8b4fe;
  border-color: rgba(168, 85, 247, .38);
  background: rgba(168, 85, 247, .12);
}

.guest-actions .register-top-btn:hover,
.guest-actions .login-top-btn:hover {
  background: rgba(168, 85, 247, .22);
}

.member-actions .member-pill,
.member-action-btn,
.home-notification-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 34px;
  box-sizing: border-box;
  padding: 8px 12px;
  border: 1px solid rgba(255, 255, 255, .12);
  background: rgba(255, 255, 255, .04);
  color: #fff;
  text-decoration: none;
  font-size: 10px;
  letter-spacing: 1px;
}

.member-actions .member-pill {
  color: #d4b6ff;
  border-color: rgba(174, 111, 255, .28);
  background: rgba(128, 62, 220, .1);
}

.member-action-btn.admin {
  color: #d4b6ff;
  border-color: rgba(174, 111, 255, .38);
  background: rgba(128, 62, 220, .14);
}

.home-notification-btn,
.portal-support-notice {
  position: relative;
}

.home-notification-btn.has-unread {
  color: #d7b5ff;
  border-color: rgba(168, 85, 247, .42);
}

.home-notification-btn b {
  position: absolute;
  right: -7px;
  top: -8px;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  box-sizing: border-box;
  border-radius: 10px;
  display: grid;
  place-items: center;
  background: #a855f7;
  color: #fff;
  font-size: 9px;
  box-shadow: 0 0 16px rgba(168, 85, 247, .75);
  border: 2px solid #090810;
}

.portal-user .portal-profile,
.portal-user .portal-logout {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

.member-notifications {
  position: relative;
}

.member-notifications summary {
  position: relative;
  display: grid;
  place-items: center;
  width: 36px;
  height: 34px;
  box-sizing: border-box;
  list-style: none;
  cursor: pointer;
  border: 1px solid rgba(168, 85, 247, .3);
  background: rgba(168, 85, 247, .08);
  color: #d8b4fe;
}

.member-notifications summary::-webkit-details-marker { display: none; }

.member-notifications summary > b {
  position: absolute;
  right: -7px;
  top: -7px;
  display: grid;
  place-items: center;
  min-width: 19px;
  height: 19px;
  padding: 0 4px;
  box-sizing: border-box;
  border-radius: 10px;
  background: #a855f7;
  color: #fff;
  font-size: 9px;
  font-weight: 900;
  border: 2px solid #090810;
  box-shadow: 0 0 16px rgba(168, 85, 247, .65);
}

.member-notification-menu {
  position: absolute;
  z-index: 500;
  right: 0;
  top: 46px;
  width: min(360px, 82vw);
  padding: 10px;
  border: 1px solid rgba(168, 85, 247, .35);
  background: #100c17;
  box-shadow: 0 20px 60px #000;
}

.member-notification-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 7px 8px 11px;
  border-bottom: 1px solid rgba(255, 255, 255, .08);
}

.member-notification-head strong { font-size: 11px; }
.member-notification-head a { color: #bb8cff; font-size: 8px; text-decoration: none; }
.member-notification-list { display: grid; gap: 6px; margin-top: 8px; }

.member-notification-item {
  display: grid;
  grid-template-columns: 24px 1fr auto;
  gap: 9px;
  align-items: center;
  padding: 10px;
  color: #fff;
  text-decoration: none;
  border: 1px solid rgba(255, 255, 255, .07);
  background: rgba(255, 255, 255, .025);
}

button.member-notification-item {
  width: 100%;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.system-notification > div,
.system-notification strong,
.system-notification p,
.system-notification small { text-align: left; }

.member-notification-item:hover,
.member-notification-item.unread {
  border-color: rgba(168, 85, 247, .35);
  background: rgba(168, 85, 247, .09);
}

.member-notification-item > i { color: #b77cff; }
.member-notification-item strong,
.member-notification-item small { display: block; }
.member-notification-item strong { font-size: 10px; }
.member-notification-item p { margin: 4px 0 0; color: #aaa3b7; font-size: 9px; line-height: 1.35; }
.member-notification-item small { margin-top: 4px; color: #777184; font-size: 8px; }
.member-notification-item > b { min-width: 18px; height: 18px; display: grid; place-items: center; border-radius: 10px; background: #a855f7; font-size: 8px; }
.member-notification-empty { padding: 18px 8px; text-align: center; color: #777184; font-size: 10px; }

@media (max-width: 760px) {
  .member-actions,
  .portal-user { gap: 5px; }

  .member-actions .member-pill,
  .member-action-btn,
  .home-notification-btn,
  .portal-user a { padding: 8px; }

  .member-action-btn,
  .portal-user .portal-admin,
  .portal-user .portal-logout { font-size: 0; }

  .member-action-btn i,
  .portal-user .portal-admin i,
  .portal-user .portal-logout i { font-size: 11px; }

  .portal-user > a.portal-profile { display: inline-flex; }

  .member-notification-menu {
    position: fixed;
    right: 10px;
    top: 70px;
    width: calc(100vw - 20px);
    box-sizing: border-box;
  }

  .guest-actions { gap: 5px; }
  .guest-actions .login-top-btn { padding: 8px 9px; }
}
@media(max-width:600px){
 .member-actions .member-pill{font-size:0;min-width:36px;padding:0!important}.member-actions .member-pill i{font-size:12px}
 .member-action-btn{min-width:36px;height:36px;padding:0!important}.member-notification-menu{right:8px;width:calc(100vw - 16px)}
}

/* Center account/admin icons on mobile */
@media (max-width:600px){
  .member-action-btn,.member-actions .member-pill,
  .portal-user .portal-admin,.portal-user .portal-profile,.portal-user .portal-logout{
    display:inline-flex!important;align-items:center!important;justify-content:center!important;
    text-align:center!important;line-height:1!important;
  }
  .member-action-btn i,.member-actions .member-pill i,
  .portal-user .portal-admin i,.portal-user .portal-profile i,.portal-user .portal-logout i{
    display:block!important;margin:0!important;line-height:1!important;text-align:center!important;
  }
}

/* Mobile: exact icon centering for Admin / User / Logout */
@media (max-width:600px){
  .member-actions .member-action-btn.admin,
  .member-actions .member-pill,
  .member-actions .member-action-btn.logout,
  .portal-user .portal-admin,
  .portal-user .portal-profile,
  .portal-user .portal-logout{
    position:relative!important;
    width:36px!important;
    min-width:36px!important;
    height:36px!important;
    padding:0!important;
    gap:0!important;
    overflow:hidden!important;
  }
  .member-actions .member-action-btn.admin>i,
  .member-actions .member-pill>i,
  .member-actions .member-action-btn.logout>i,
  .portal-user .portal-admin>i,
  .portal-user .portal-profile>i,
  .portal-user .portal-logout>i{
    position:absolute!important;
    left:50%!important;
    top:50%!important;
    transform:translate(-50%,-50%)!important;
    width:auto!important;
    height:auto!important;
    margin:0!important;
    padding:0!important;
    line-height:1!important;
    text-align:center!important;
  }
}

/* Mobile: exact icon centering for Register / Login */
@media (max-width:600px){
  .guest-actions .login-top-btn,
  .guest-actions .register-top-btn{
    position:relative!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:38px!important;
    min-width:38px!important;
    height:38px!important;
    padding:0!important;
    gap:0!important;
    font-size:0!important;
    line-height:1!important;
    text-align:center!important;
    overflow:hidden!important;
  }
  .guest-actions .login-top-btn>i,
  .guest-actions .register-top-btn>i{
    position:absolute!important;
    left:50%!important;
    top:50%!important;
    transform:translate(-50%,-50%)!important;
    display:block!important;
    width:auto!important;
    height:auto!important;
    margin:0!important;
    padding:0!important;
    font-size:12px!important;
    line-height:1!important;
    text-align:center!important;
  }
}
