body[data-page="auth-action"] { --auth-action-max: 520px; overflow: auto; background: var(--mp-bg); color: var(--mp-text); }
.auth-action-app { min-height: 100vh; display: flex; flex-direction: column; font-family: var(--font-ui); }
.auth-action-main { width: min(100% - 48px, var(--auth-action-max)); flex: 1 0 auto; margin-inline: auto; display: grid; place-items: center; padding-block: 48px; }
.auth-action-card { width: min(100%, var(--auth-action-max)); box-sizing: border-box; padding: var(--account-card-padding); border: 1px solid var(--account-border); border-radius: var(--account-radius); background: var(--account-surface); }
.auth-action-kicker { margin: 0 0 8px; color: #d9b565; font-size: .72rem; font-weight: 800; letter-spacing: .15em; text-transform: uppercase; }
.auth-action-card h1 { margin: 0 0 14px; color: #f1dfb9; font: 700 clamp(1.85rem, 4vw, 2.2rem)/1.15 var(--font-head); hyphens: none; overflow-wrap: normal; word-break: normal; }
.auth-action-copy { margin: 0; color: #d5cbb4; line-height: 1.6; }
.auth-action-copy.is-result { margin-top: 18px; padding: 12px 14px; border: 1px solid rgba(111,163,124,.4); border-radius: var(--account-control-radius); color: #cfe4d1; background: #0b2d22; }
.auth-action-copy.is-result.is-error { border-color: rgba(213,154,145,.62); color: #efc1ba; background: #321d1a; }
.auth-action-form { display: grid; gap: 16px; margin-top: 24px; }
.auth-action-form[hidden] { display: none; }
.auth-action-form--compact { width: 100%; }
.auth-action-submit { justify-self: start; }
.auth-action-form .mp-field label { display: block; margin-bottom: 6px; color: #ded2b8; font-weight: 700; }
.auth-action-form .mp-field input { width: 100%; min-height: var(--account-control-height); box-sizing: border-box; padding: 9px 12px; border: 1px solid var(--account-border-strong); border-radius: var(--account-control-radius); color: #fff4dd; background: var(--account-field); font: inherit; }
.auth-action-form .mp-field input:hover { border-color: rgba(232,196,121,.55); }
.auth-action-form .mp-field input:focus { border-color: var(--account-gold); outline: 2px solid rgba(217,181,101,.2); outline-offset: 1px; }
.auth-action-hint { margin: -6px 0 0; color: var(--mp-dim); font-size: .82rem; }
.auth-action-links { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; }
.auth-action-links[hidden] { display: none; }
.auth-action-card .ui-button { max-width: 100%; min-height: var(--account-control-height); display: inline-flex; align-items: center; justify-content: center; padding: 10px 20px; border: 1px solid var(--account-border-strong); border-radius: var(--account-control-radius); color: #f3e7cb; background: var(--account-surface-soft); box-shadow: none; font-family: var(--font-ui); font-size: .94rem; font-weight: 800; letter-spacing: 0; line-height: 1.25; overflow-wrap: anywhere; text-align: center; white-space: normal; transition: border-color .15s ease, background-color .15s ease, color .15s ease; }
.auth-action-card .ui-button.primary { border-color: var(--account-gold); color: #241803; background: var(--account-gold); box-shadow: none; }
.auth-action-card .ui-button:hover:not(:disabled) { border-color: rgba(232,196,121,.62); background: #103429; filter: none; transform: none; }
.auth-action-card .ui-button.primary:hover:not(:disabled) { border-color: var(--account-gold-hover); background: var(--account-gold-hover); }
.auth-action-card .ui-button:active:not(:disabled) { transform: none; }
.auth-action-card .ui-button:focus-visible { outline: 3px solid #f4d691; outline-offset: 3px; }
.auth-action-links [hidden] { display: none; }
@media (max-width: 600px) {
  .auth-action-main { width: min(100% - 32px, var(--auth-action-max)); padding-block: 32px 40px; }
  .auth-action-card { padding: 22px; }
  .auth-action-app .mp-footer { min-height: 0; padding-block: 16px; }
  .auth-action-app .mp-footer-inner { width: min(100% - 32px, 720px); }
  .auth-action-app .mp-footer-inner { gap: 4px; }
  .auth-action-app .mp-footer-inner nav { width: 100%; justify-content: center; }
}
@media (max-width: 430px) {
  .auth-action-main,
  .auth-action-app .mp-footer-inner { width: min(100% - 24px, var(--auth-action-max)); }
  .auth-action-main { padding-block: 24px 32px; }
  .auth-action-card { padding: 20px; }
  .auth-action-submit,
  .auth-action-links .ui-button { width: 100%; }
}
@media (prefers-reduced-motion: reduce) { .auth-action-card .ui-button { transition: none; } }
.dev-mailbox-main { width: min(100% - 48px, 1080px); flex: 1 0 auto; margin-inline: auto; padding-block: 40px 48px; }
.dev-mailbox-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 24px; }
.dev-mailbox-heading h1 { margin: 0 0 8px; color: #f1dfb9; font: 700 2.35rem/1.15 var(--font-head); }
.dev-mailbox-heading p { max-width: 700px; margin: 0; color: #d5cbb4; }
.dev-mailbox-actions { display: flex; gap: 8px; }
.dev-mailbox-list { display: grid; gap: 14px; }
.dev-mailbox-message { padding: 20px; border: 1px solid rgba(232,196,121,.24); border-radius: 10px; background: #08231a; }
.dev-mailbox-message h2 { margin: 0 0 8px; color: #f1dfb9; font: 700 1.15rem/1.3 var(--font-head); }
.dev-mailbox-meta { margin: 0 0 12px; color: #b6aa93; font-size: .8rem; }
.dev-mailbox-message pre { max-height: 280px; overflow: auto; padding: 14px; border-radius: 8px; color: #e7dfcf; background: #061c15; white-space: pre-wrap; overflow-wrap: anywhere; font: .83rem/1.5 ui-monospace, monospace; }
.dev-mailbox-links { display: flex; flex-wrap: wrap; gap: 8px; }
.dev-mailbox-links a { color: #d9b565; font-weight: 700; }
#mailbox-status { color: #c9bea7; }
