/* Final account/security dialog polish. This layer intentionally owns the account modal shell. */
#modal:has(.rift-account-dialog) {
  width:min(520px,calc(100vw - 40px)) !important;
  max-width:520px !important;
  max-height:min(760px,calc(100vh - 40px));
  padding:0 !important;
  overflow:hidden !important;
  border:1px solid #2d323a !important;
  border-radius:14px !important;
  background:#12151b !important;
  box-shadow:0 24px 72px rgba(0,0,0,.52) !important;
}

#modal:has(.rift-account-dialog) > .rift-account-dialog {
  width:100% !important;
  max-width:none !important;
  min-width:0 !important;
  margin:0 !important;
  padding:0 !important;
  overflow:hidden;
  color:#eef0f3;
}

.rift-account-dialog .modal-head {
  display:grid !important;
  grid-template-columns:minmax(0,1fr) 36px;
  align-items:start !important;
  gap:18px !important;
  margin:0 !important;
  padding:26px 28px 10px !important;
}
.rift-account-dialog .modal-head > div { min-width:0; }
.rift-account-dialog .modal-head h3 {
  margin:0 0 7px !important;
  color:#f2f3f5 !important;
  font-size:21px !important;
  line-height:1.2 !important;
  font-weight:760 !important;
  letter-spacing:-.025em;
}
.rift-account-dialog .modal-head p {
  margin:0 !important;
  max-width:390px;
  color:#969da8 !important;
  font-size:13px !important;
  line-height:1.5 !important;
}
.rift-account-dialog .modal-head > button,
.rift-account-dialog .rift-dialog-close {
  display:grid;
  place-items:center;
  width:34px;
  height:34px;
  margin:-5px -5px 0 0;
  padding:0 !important;
  border:0 !important;
  border-radius:8px;
  background:transparent !important;
  color:#969da8 !important;
  font-size:25px !important;
  font-weight:400;
  line-height:1;
  cursor:pointer;
}
.rift-account-dialog .modal-head > button:hover,
.rift-account-dialog .rift-dialog-close:hover {
  background:#1d2128 !important;
  color:#f2f3f5 !important;
}

.rift-account-dialog .modal-form {
  display:flex !important;
  flex-direction:column;
  gap:17px !important;
  width:100%;
  margin:0;
  padding:12px 28px 26px !important;
}
.rift-account-dialog .modal-form label {
  display:block !important;
  min-width:0;
  margin:0 !important;
  color:#d8dbe0 !important;
  font-size:13px !important;
  font-weight:650 !important;
  line-height:1.35;
}
.rift-account-dialog .modal-form label em {
  color:#ed5b60 !important;
  font-style:normal;
}
.rift-account-dialog .modal-form input,
.rift-account-dialog .modal-form select,
.rift-account-dialog .modal-form textarea {
  display:block !important;
  width:100% !important;
  min-width:0 !important;
  height:44px !important;
  min-height:44px !important;
  margin:8px 0 0 !important;
  padding:0 12px !important;
  border:1px solid #343941 !important;
  border-radius:8px !important;
  outline:none !important;
  background:#0c0f14 !important;
  color:#f3f4f6 !important;
  box-shadow:none !important;
  font-size:13px !important;
  line-height:44px !important;
}
.rift-account-dialog .modal-form input:hover,
.rift-account-dialog .modal-form select:hover,
.rift-account-dialog .modal-form textarea:hover {
  border-color:#444b56 !important;
}
.rift-account-dialog .modal-form input:focus,
.rift-account-dialog .modal-form select:focus,
.rift-account-dialog .modal-form textarea:focus {
  border-color:color-mix(in srgb,var(--accent),#fff 18%) !important;
  box-shadow:0 0 0 2px color-mix(in srgb,var(--accent),transparent 78%) !important;
}
.rift-account-dialog .modal-form label small {
  display:block !important;
  margin:7px 0 0 !important;
  color:#7f8792 !important;
  font-size:10px !important;
  font-weight:450 !important;
  line-height:1.45;
}
.rift-account-dialog .form-error {
  min-height:0 !important;
  margin:0 !important;
  color:#ff777c !important;
  font-size:11px !important;
  line-height:1.4;
}
.rift-account-dialog .form-error:empty { display:none; }
.rift-account-dialog .modal-actions {
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:10px !important;
  width:100%;
  margin:5px 0 0 !important;
  padding:0 !important;
}
.rift-account-dialog .modal-actions > button {
  width:100% !important;
  min-width:0 !important;
  min-height:44px !important;
  margin:0 !important;
  padding:10px 14px !important;
  border-radius:8px !important;
  font-size:13px !important;
  font-weight:700 !important;
}
.rift-account-dialog .modal-actions > .secondary-button {
  border:1px solid #343941 !important;
  background:#1a1e24 !important;
  color:#d7dbe0 !important;
}
.rift-account-dialog .modal-actions > .secondary-button:hover:not(:disabled) {
  background:#22272f !important;
  border-color:#454c57 !important;
  color:#fff !important;
}

/* Email verification uses a deliberately larger branded top area. */
#modal:has(.rift-verify-email-dialog) {
  width:min(500px,calc(100vw - 40px)) !important;
}
.rift-verify-email-dialog {
  position:relative;
  width:100% !important;
  max-width:none !important;
  text-align:center;
}
.rift-verify-email-dialog .rift-dialog-close {
  position:absolute !important;
  top:16px !important;
  right:16px !important;
  z-index:3;
  margin:0 !important;
}
.rift-verify-email-art {
  display:flex !important;
  align-items:center;
  justify-content:center;
  gap:18px;
  width:100%;
  height:150px !important;
  margin:0 !important;
  border-radius:0 !important;
  background:
    radial-gradient(circle at 54% 10%,color-mix(in srgb,var(--accent),transparent 54%),transparent 39%),
    linear-gradient(160deg,#261633 0%,#11141a 74%) !important;
  overflow:hidden;
}
.rift-verify-email-art b {
  display:grid !important;
  place-items:center;
  width:90px !important;
  height:64px !important;
  border-radius:10px !important;
  background:#f5f6f8 !important;
  color:var(--accent) !important;
  font-size:34px !important;
  transform:rotate(-7deg);
  box-shadow:0 14px 30px rgba(0,0,0,.3);
}
.rift-verify-email-art span:first-child { color:#74f5a0 !important; font-size:29px !important; }
.rift-verify-email-art span:last-child { color:#ffd65b !important; font-size:21px !important; }
.rift-verify-email-dialog > h3 {
  margin:23px 28px 22px !important;
  color:#f2f3f5 !important;
  font-size:23px !important;
  line-height:1.2;
  letter-spacing:-.025em;
}
.rift-verify-email-dialog > p {
  max-width:405px !important;
  margin:0 auto 14px !important;
  padding:0 24px;
  color:#c2c7ce !important;
  font-size:14px !important;
  line-height:1.48 !important;
}
.rift-verify-email-dialog > p strong {
  color:#eef0f3;
  overflow-wrap:anywhere;
}
.rift-verify-email-dialog .rift-account-dialog-note { color:#9ba2ac !important; }
.rift-verify-email-dialog > .form-error { margin:8px 28px 0 !important; }
.rift-verify-email-dialog > .modal-actions {
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:10px !important;
  margin:0 !important;
  padding:22px 28px 26px !important;
}

/* Light mode */
html[data-rift-effective-theme='light'] #modal:has(.rift-account-dialog) {
  border-color:#d2d8df !important;
  background:#ffffff !important;
  box-shadow:0 24px 70px rgba(40,48,58,.22) !important;
}
html[data-rift-effective-theme='light'] .rift-account-dialog { color:#20242a !important; }
html[data-rift-effective-theme='light'] .rift-account-dialog .modal-head h3,
html[data-rift-effective-theme='light'] .rift-verify-email-dialog > h3,
html[data-rift-effective-theme='light'] .rift-verify-email-dialog > p strong {
  color:#20242a !important;
}
html[data-rift-effective-theme='light'] .rift-account-dialog .modal-head p,
html[data-rift-effective-theme='light'] .rift-account-dialog .modal-form label,
html[data-rift-effective-theme='light'] .rift-verify-email-dialog > p {
  color:#515b67 !important;
}
html[data-rift-effective-theme='light'] .rift-account-dialog .modal-head > button,
html[data-rift-effective-theme='light'] .rift-account-dialog .rift-dialog-close {
  color:#6f7884 !important;
}
html[data-rift-effective-theme='light'] .rift-account-dialog .modal-head > button:hover,
html[data-rift-effective-theme='light'] .rift-account-dialog .rift-dialog-close:hover {
  background:#eef1f4 !important;
  color:#20242a !important;
}
html[data-rift-effective-theme='light'] .rift-account-dialog .modal-form input,
html[data-rift-effective-theme='light'] .rift-account-dialog .modal-form select,
html[data-rift-effective-theme='light'] .rift-account-dialog .modal-form textarea {
  border-color:#cbd2da !important;
  background:#fff !important;
  color:#20242a !important;
}
html[data-rift-effective-theme='light'] .rift-account-dialog .modal-form input:hover { border-color:#adb6c1 !important; }
html[data-rift-effective-theme='light'] .rift-account-dialog .modal-form label small { color:#747e8a !important; }
html[data-rift-effective-theme='light'] .rift-account-dialog .modal-actions > .secondary-button {
  border-color:#cbd2da !important;
  background:#f2f4f6 !important;
  color:#343b44 !important;
}
html[data-rift-effective-theme='light'] .rift-account-dialog .modal-actions > .secondary-button:hover:not(:disabled) {
  background:#e8ebef !important;
  border-color:#b9c1ca !important;
  color:#20242a !important;
}
html[data-rift-effective-theme='light'] .rift-verify-email-art {
  background:
    radial-gradient(circle at 54% 10%,color-mix(in srgb,var(--accent),transparent 80%),transparent 39%),
    linear-gradient(160deg,#f4eef9 0%,#eef1f5 76%) !important;
}
html[data-rift-effective-theme='light'] .rift-verify-email-dialog .rift-account-dialog-note { color:#737d88 !important; }

@media(max-width:560px) {
  #modal-backdrop { padding:12px !important; }
  #modal:has(.rift-account-dialog),
  #modal:has(.rift-verify-email-dialog) {
    width:calc(100vw - 24px) !important;
    max-height:calc(100vh - 24px) !important;
    overflow:auto !important;
  }
  .rift-account-dialog .modal-head { padding:22px 20px 8px !important; }
  .rift-account-dialog .modal-form { padding:10px 20px 22px !important; }
  .rift-verify-email-dialog > .modal-actions { padding:18px 20px 22px !important; }
  .rift-verify-email-dialog > p { padding:0 20px; }
}

@media(max-width:410px) {
  .rift-account-dialog .modal-actions,
  .rift-verify-email-dialog > .modal-actions {
    grid-template-columns:1fr !important;
  }
}
