.gg-auth-slot {
  display: inline-flex;
  align-items: center;
  min-width: 0;
}

.gg-auth-trigger {
  min-height: 42px;
  max-width: 180px;
  padding: 0 15px;
  overflow: hidden;
  border: 1px solid rgba(18, 18, 22, .14);
  border-radius: 999px;
  background: rgba(255, 255, 255, .92);
  color: #18181d;
  font: 800 .82rem/1 Inter, Pretendard, "Noto Sans KR", system-ui, sans-serif;
  text-overflow: ellipsis;
  white-space: nowrap;
  cursor: pointer;
  box-shadow: 0 5px 16px rgba(18, 18, 22, .08);
}

.gg-auth-quick-admin {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  margin-right: 7px;
  padding: 0 11px;
  border-radius: 999px;
  background: #e5f4ed;
  color: #165a40;
  font: 850 .78rem/1 Inter, Pretendard, "Noto Sans KR", system-ui, sans-serif;
  text-decoration: none;
}
.gg-auth-quick-admin[hidden] { display: none; }
.gg-auth-quick-admin:focus-visible { outline: 3px solid #1768e5; outline-offset: 2px; }

.gg-auth-trigger:focus-visible,
.gg-auth-dialog button:focus-visible,
.gg-auth-dialog input:focus-visible {
  outline: 3px solid #1768e5;
  outline-offset: 2px;
}

.gg-auth-trigger:disabled { cursor: wait; opacity: .7; }
.site-header .navlinks:has(.gg-auth-slot) { flex-wrap: wrap; }
.finder-header:has(.gg-auth-slot) { flex-wrap: wrap; gap: 12px; }
.finder-header .gg-auth-slot { margin-left: auto; }

.gg-auth-dialog {
  width: min(420px, calc(100% - 28px));
  padding: 0;
  border: 0;
  border-radius: 24px;
  background: #fff;
  color: #17171c;
  box-shadow: 0 28px 90px rgba(0, 0, 0, .28);
}

.gg-auth-dialog [hidden] { display: none !important; }
.gg-auth-dialog::backdrop { background: rgba(4, 5, 8, .62); backdrop-filter: blur(5px); }
.gg-auth-dialog .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.gg-auth-panel { padding: 26px; font-family: Inter, Pretendard, "Noto Sans KR", system-ui, sans-serif; }
.gg-auth-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 22px; }
.gg-auth-head h2 { margin: 0; font-size: 1.45rem; letter-spacing: -.04em; }
.gg-auth-close { min-width: 52px; min-height: 42px; padding: 0 12px; border: 0; border-radius: 12px; background: #eeeef1; color: #4c4c55; font-weight: 800; cursor: pointer; }
.gg-auth-providers { display: grid; gap: 10px; }
.gg-auth-provider { min-height: 52px; border: 1px solid #d9d9df; border-radius: 14px; background: #fff; color: #17171c; font-weight: 850; cursor: pointer; }
.gg-auth-provider[data-provider="kakao"] { border-color: #fee500; background: #fee500; color: #191600; }
.gg-auth-provider[data-provider="naver"] { border-color: #03c75a; background: #03c75a; color: #fff; }
.gg-auth-provider:disabled { cursor: not-allowed; filter: grayscale(.75); opacity: .55; }
.gg-auth-account { display: grid; gap: 14px; }
.gg-auth-name { margin: 0; overflow-wrap: anywhere; font-size: 1.35rem; }
.gg-auth-profile { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
.gg-auth-profile input { min-width: 0; min-height: 48px; padding: 0 13px; border: 1px solid #d7d7dc; border-radius: 12px; font: inherit; }
.gg-auth-profile button,
.gg-auth-logout { min-height: 48px; padding: 0 15px; border: 0; border-radius: 12px; font: inherit; font-weight: 850; cursor: pointer; }
.gg-auth-profile button { background: #1b1b20; color: #fff; }
.gg-auth-logout { background: #eeeef1; color: #33333a; }
.gg-auth-admin { display: flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 15px; border-radius: 12px; background: #e5f4ed; color: #165a40; font-weight: 850; text-decoration: none; }
.gg-auth-admin[hidden] { display: none; }
.gg-auth-status { min-height: 1.3em; margin: 12px 0 0; color: #6f6f78; font-size: .82rem; }

.play-account-cluster { display: flex; align-items: center; justify-self: end; gap: 12px; min-width: 132px; min-height: 42px; }
.teacher-topbar .gg-auth-slot { margin-left: auto; }
.teacher-topbar .gg-auth-trigger { box-shadow: none; }
.world-header-actions .gg-auth-trigger,
.qw-topbar .gg-auth-trigger,
.play-header .gg-auth-trigger { box-shadow: none; }

@media (max-width: 640px) {
  .gg-auth-trigger { min-height: 40px; max-width: 116px; padding: 0 12px; }
  .gg-auth-panel { padding: 22px 18px; }
  .gg-auth-profile { grid-template-columns: 1fr; }
  .play-account-cluster { min-width: 118px; min-height: 40px; gap: 8px; }
}
