/* Scoped to authentication; existing pages keep their visual direction. */
.auth-dialog {
  box-sizing: border-box;
  width: min(520px, calc(100vw - 32px));
  max-height: 90dvh;
  overflow: auto;
  border: 1px solid #444;
  border-radius: 16px;
  background: #111318;
  color: #f3f1e9;
  padding: 32px;
  font: 16px/1.6 system-ui;
}
.auth-dialog::backdrop {
  background: rgb(0 0 0 / 0.75);
}
.auth-dialog h2 {
  font-size: 30px;
  line-height: 1.2;
  margin: 12px 0;
}
.auth-dialog p {
  margin: 12px 0;
}
.auth-dialog label {
  display: grid;
  gap: 8px;
  margin-top: 20px;
}
.auth-dialog input {
  width: 100%;
  box-sizing: border-box;
  padding: 12px;
  background: #20242a;
  border: 1px solid #657080;
  color: white;
  border-radius: 8px;
}
.auth-dialog input[name="code"] {
  font-size: 1.5rem;
  letter-spacing: 0.3em;
}
.auth-dialog button {
  padding: 12px 20px;
  border-radius: 999px;
  margin-top: 16px;
  cursor: pointer;
  border: 1px solid #d8ff3e;
}
.auth-dialog .button {
  background: #d8ff3e;
  color: #111318;
  font-weight: 700;
}
.auth-dialog .secondary {
  background: transparent;
  color: white;
  border-color: #657080;
}
.auth-dialog button:disabled {
  opacity: 0.5;
  cursor: wait;
}
.auth-dialog :focus-visible {
  outline: 3px solid #d8ff3e;
  outline-offset: 3px;
}
.auth-dialog [hidden] {
  display: none !important;
}
[data-enrollment] code {
  display: block;
  overflow-wrap: anywhere;
  margin: 12px 0;
}

[data-account] { position: relative; flex-shrink: 0; font-size: 14px; }
[data-account] .account-login, [data-account] summary { color: inherit; font-weight: 700; cursor: pointer; padding: 10px 12px; white-space: nowrap; }
.campaign [data-account] { color: #f4f3ec; }
[data-account] summary { border: 1px solid #7b8170; border-radius: 24px; }
[data-account] .account-menu { position: absolute; right: 0; top: calc(100% + 12px); z-index: 100; width: min(280px, 85vw); padding: 20px; border: 1px solid #414738; border-radius: 16px; background: #111318; color: #f4f3ec; box-shadow: 0 12px 36px #0005; display: grid; gap: 12px; }
[data-account] strong { overflow-wrap: anywhere; }
[data-account] small { color: #d8ff3e; }
[data-account] .account-menu a, [data-account] button { color: #f4f3ec; font: inherit; text-align: left; background: transparent; cursor: pointer; border: 0; padding: 8px 0; }
[data-account] p:empty { display: none; }
@media(max-width: 600px) { .campaign-nav { gap: 8px; } .campaign-nav .nav-start { display: none; } }
.client-panel .nav { display: flex; position: relative; z-index: 10; min-height: 76px; padding: 16px 24px; }
.client-panel .panel-sidebar { top: 76px; }
@media(max-width: 600px) { .client-panel #private-label { display: none; } .client-panel .nav { padding: 16px; } }

.private-panel .request-list { width: min(760px, calc(100% - 32px)); margin: 48px auto; padding: clamp(20px, 4vw, 36px); }
.request-list [data-requests] { display: grid; gap: 16px; margin: 28px 0; }
.private-panel .request-card { padding: 24px; border: 1px solid #394031; border-radius: 16px; background: #111318; }
.private-panel .request-card h2 { margin: 0; font-size: 22px; }
.private-panel .request-card .request-status { color: #c1c9b2; margin: 12px 0 20px; font-size: 14px; }
.private-panel .request-card .button { margin-bottom: 0; }
.private-panel .request-card [role=status]:empty { display: none; }
.request-add { display: inline-flex; }
/* Request entry states share the campaign card, but need their own flow layout. */
#request .request-card { min-width: 0; }
#request-access:not([hidden]), #request-eligibility:not([hidden]) {
  display: grid;
  gap: 20px;
  min-width: 0;
  overflow-wrap: anywhere;
}
#request-access h3, #request-eligibility h3 {
  font-size: clamp(24px, 3vw, 32px);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -.025em;
}
#request-access p, #request-eligibility p { margin: 0; line-height: 1.65; }
#request-eligibility [data-existing-request] { font-weight: 700; }
#request-access-form { display: grid; gap: 16px; min-width: 0; }
#request-access-form label { margin: 0; font-weight: 700; }
#request-access-email { display: block; width: 100%; min-width: 0; max-width: 100%; box-sizing: border-box; margin: 0; }
#request-access .button, #request-eligibility .button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  max-width: 100%;
  margin: 4px 0 0;
  line-height: 1.4;
  white-space: normal;
  text-align: center;
}
#request [data-i="freeRequestPolicy"] { margin: 28px 0 0; }
@media(max-width: 600px) {
  #request-access .button, #request-eligibility .button { width: 100%; }
}