/* New Look dialogs and share card. Keep this link after all other app stylesheets.
   The original modal markup and actions stay intact; classic mode is unaffected. */
body.theme-redesign {
  --htl-modal-surface: linear-gradient(145deg,rgba(255,255,255,.92),rgba(255,255,255,.68)),var(--theme-chrome,#faf5ff);
  --htl-modal-field: rgba(255,255,255,.85);
}
body.theme-redesign :is(.overlay,.modal-overlay,.share-overlay,.htl-ui-dialog,#withdrawal-overlay,#deposit-overlay,#addacct-overlay,#report-modal-overlay,#csv-tz-modal,#broker-sync-modal,#jail-overlay,#jail-change-overlay,#jail-date-reset-overlay,#change-tier-modal,#xj-change-account-modal,#xj-acct-select-overlay,#ssq-acct-select-overlay,#ssq-payout-overlay,#member-chall-overlay,#xj-audit-edit-overlay,#wall-post-overlay,#wall-detail-overlay,#force-pw-overlay,#name-confirm-overlay,#welcome-update-overlay,#welcome-challenge-overlay,#award-overlay,#award-confirm-modal,#lifestyle-celebrate-overlay,#update-overlay,#map-pin-modal) {
  --tx: var(--theme-ink,#34203f);
  --tx2: var(--theme-muted,#64506e);
  --tx3: var(--theme-muted,#64506e);
  --bg: var(--theme-chrome,#faf5ff);
  --bg2: var(--theme-chrome,#faf5ff);
  --bg3: var(--theme-active,#ecd4e9);
  --bdr: var(--theme-border,#cfb6dc);
  --bdr2: var(--theme-border,#cfb6dc);
  --pp-bdr: var(--theme-border,#cfb6dc);
  background-color:rgba(24,13,37,.48)!important;
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  color:var(--tx)!important;
}
body.theme-redesign :is(.overlay,.modal-overlay,.share-overlay) :is(.ocard,.modal,.share-modal,.modal-card),
body.theme-redesign .htl-ui-dialog .htl-ui-dialog-card,
body.theme-redesign :is(#withdrawal-overlay,#deposit-overlay,#addacct-overlay,#report-modal-overlay,#csv-tz-modal,#broker-sync-modal,#jail-overlay,#jail-change-overlay,#jail-date-reset-overlay,#change-tier-modal,#xj-change-account-modal,#xj-acct-select-overlay,#ssq-acct-select-overlay,#ssq-payout-overlay,#member-chall-overlay,#xj-audit-edit-overlay,#wall-post-overlay,#wall-detail-overlay,#force-pw-overlay,#name-confirm-overlay,#welcome-update-overlay,#welcome-challenge-overlay,#award-overlay,#award-confirm-modal,#lifestyle-celebrate-overlay,#update-overlay,#map-pin-modal)>div:first-child {
  background:var(--htl-modal-surface)!important;
  border:1px solid var(--theme-border,#cfb6dc)!important;
  border-radius:26px!important;
  color:var(--theme-ink,#34203f)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.8),0 26px 70px rgba(34,17,47,.28)!important;
  backdrop-filter:blur(24px) saturate(130%);
  -webkit-backdrop-filter:blur(24px) saturate(130%);
  box-sizing:border-box;
}
body.theme-redesign :is(#withdrawal-overlay,#deposit-overlay,#addacct-overlay)>div:first-child {
  width:min(100%,520px)!important;
  padding:clamp(22px,4vw,32px)!important;
  max-height:min(88dvh,850px);
  overflow-y:auto;
}
/* Connect Broker's card can grow tall (Rithmic attribution box + account
   picker + error message all showing at once) — keep its own inline width
   (420px/440px) but let it scroll instead of overflowing short viewports. */
body.theme-redesign :is(#csv-tz-modal,#broker-sync-modal)>div:first-child {
  padding:clamp(22px,4vw,28px)!important;
  max-height:min(88dvh,850px);
  overflow-y:auto;
}
body.theme-redesign :is(#withdrawal-overlay,#deposit-overlay,#addacct-overlay,#csv-tz-modal,#broker-sync-modal) :is(#acct-modal-title,div[style*="font-size:17px"]),
body.theme-redesign .htl-ui-dialog .htl-ui-dialog-title,
body.theme-redesign :is(.overlay,.modal-overlay) :is(.otitle,.modal-title) {
  color:var(--theme-ink,#34203f)!important;
  font-family:'Cormorant Garamond',Georgia,serif!important;
  font-size:clamp(26px,3vw,32px)!important;
  font-weight:700!important;
  line-height:1.15!important;
}
body.theme-redesign :is(.overlay,.modal-overlay,.share-overlay,#withdrawal-overlay,#deposit-overlay,#addacct-overlay,#report-modal-overlay,#csv-tz-modal,#broker-sync-modal) :is(input:not([type="checkbox"]):not([type="radio"]),select,textarea) {
  background:var(--htl-modal-field)!important;
  color:var(--theme-ink,#34203f)!important;
  border:1px solid var(--theme-border,#cfb6dc)!important;
  border-radius:13px!important;
  min-height:42px;
  box-sizing:border-box;
}
body.theme-redesign :is(.overlay,.modal-overlay,.share-overlay,#withdrawal-overlay,#deposit-overlay,#addacct-overlay,#report-modal-overlay,#csv-tz-modal,#broker-sync-modal) :is(input,textarea)::placeholder {
  color:var(--theme-muted,#64506e)!important;
  opacity:.85;
}
body.theme-redesign :is(.overlay,.modal-overlay,.share-overlay,#withdrawal-overlay,#deposit-overlay,#addacct-overlay,#report-modal-overlay,#csv-tz-modal,#broker-sync-modal) :is(input,select,textarea):focus-visible,
body.theme-redesign :is(.overlay,.modal-overlay,.share-overlay,#withdrawal-overlay,#deposit-overlay,#addacct-overlay,#report-modal-overlay,#csv-tz-modal,#broker-sync-modal) :is(button,a):focus-visible {
  outline:2px solid var(--theme-accent,#9b4a8d)!important;
  outline-offset:2px;
}
body.theme-redesign :is(.overlay,.modal-overlay,.share-overlay,#withdrawal-overlay,#deposit-overlay,#addacct-overlay,#report-modal-overlay,#csv-tz-modal,#broker-sync-modal) :is(.btn-p,.btn-s,.oxbtn,.modal-close,.htl-modal-ok,.htl-modal-cancel),
body.theme-redesign .htl-ui-dialog :is(.htl-modal-ok,.htl-modal-cancel) {
  border-radius:999px!important;
}
body.theme-redesign :is(#withdrawal-overlay,#deposit-overlay,#addacct-overlay) .btn-p,
body.theme-redesign .htl-ui-dialog .htl-modal-ok {
  background:var(--theme-accent,#9b4a8d)!important;
  color:#fff!important;
  border-color:transparent!important;
}
body.theme-redesign #addacct-overlay :is(#prop-firm-fields,#eval-fields,#funded-fields),
body.theme-redesign #addacct-overlay div:has(> #acct-is-prop) {
  background:rgba(255,255,255,.3)!important;
  border-color:var(--theme-border,#cfb6dc)!important;
  border-radius:17px!important;
}
body.theme-redesign #share-overlay .share-modal {
  max-width:min(100%,560px)!important;
  max-height:calc(100dvh - 32px);
  overflow-y:auto!important;
}
/* The image export captures #share-card, so the background and labels must
   live on the card itself, not on a translucent overlay above it. */
body.theme-redesign #share-overlay #share-card {
  --tx:var(--theme-ink,#34203f);
  --tx2:var(--theme-muted,#64506e);
  --tx3:var(--theme-muted,#64506e);
  --bg3:rgba(255,255,255,.76);
  --bdr2:var(--theme-border,#cfb6dc);
  background:linear-gradient(145deg,#fffafd,#f0e4f4)!important;
  border:1px solid var(--theme-border,#cfb6dc)!important;
  border-radius:23px!important;
  color:var(--theme-ink,#34203f)!important;
  box-shadow:0 12px 32px rgba(39,20,50,.12)!important;
}
body.theme-redesign.theme-masculine #share-overlay #share-card {background:linear-gradient(145deg,#fcfeff,#e3f2fc)!important;}
body.theme-redesign.theme-black #share-overlay #share-card {background:linear-gradient(145deg,#fffdf8,#efe7d9)!important;}
body.theme-redesign #share-overlay #share-card>img.htl-share-art {opacity:.2!important;}
body.theme-redesign #share-overlay #share-card :is(#sc-brand,#sc-label,#sc-date,#htl-share-context,#htl-share-sample,.sc-stat-lbl),
body.theme-redesign #share-overlay #share-card>div:last-child,
body.theme-redesign #share-overlay #share-card>div:last-child span {
  color:var(--theme-ink,#34203f)!important;
}
body.theme-redesign #share-overlay #share-card [style*="background:var(--bg3)"] {
  background:rgba(255,255,255,.78)!important;
  color:var(--theme-ink,#34203f)!important;
  border:1px solid var(--theme-border,#cfb6dc)!important;
}
body.theme-redesign #share-overlay #share-card [style*="background:var(--bg3)"] :is(div,#sc-tr,#sc-r,#sc-wr) {color:var(--theme-ink,#34203f)!important;}
body.theme-redesign #share-overlay #share-card #sc-bal,
body.theme-redesign #share-overlay #share-card #sc-chg {
  color:#218f63!important;
  -webkit-text-fill-color:#218f63!important;
}
body.theme-redesign #share-overlay #share-card :is(#sc-bal,#sc-chg)[data-negative] {
  color:#ad3552!important;
  -webkit-text-fill-color:#ad3552!important;
}
@media(max-width:640px){
  body.theme-redesign :is(.overlay,.modal-overlay,.share-overlay,#withdrawal-overlay,#deposit-overlay,#addacct-overlay){padding:12px!important;}
  body.theme-redesign :is(#withdrawal-overlay,#deposit-overlay,#addacct-overlay)>div:first-child {max-height:calc(100dvh - 24px);}
  body.theme-redesign :is(#csv-tz-modal,#broker-sync-modal)>div:first-child {max-height:calc(100dvh - 24px);}
  body.theme-redesign #share-overlay .share-modal{padding:17px!important;}
}