/*
 * Kē unified member experience.
 *
 * Loaded after every feature stylesheet so active rebrand routes share the
 * dashboard's midnight, porcelain, burgundy, and gold material language.
 * Feature modules still own their information architecture; this layer owns
 * the common canvas, shape launchers, expanded surfaces, and legacy overlays.
 */

html.ke-rebrand-mode {
  color-scheme: dark;
  --ke-midnight: #10242d;
  --ke-midnight-deep: #09191f;
  --ke-midnight-raised: #1a303a;
  --ke-smoke: rgba(20, 43, 53, .94);
  --ke-porcelain: #fffcf6;
  --ke-porcelain-muted: #e9dcc8;
  --ke-jewel-burgundy: #682d43;
  --ke-jewel-burgundy-bright: #87405b;
  --ke-jewel-gold: #d7b56d;
  --ke-jewel-gold-light: #f1dca7;
  --ke-jewel-sage: #55766b;
  --ke-jewel-teal: #2f6870;
  --ke-jewel-purple: #584163;
  --ke-jewel-blue: #365e79;
  --ke-jewel-orange: #915435;
  --ke-dark-line: rgba(215, 181, 109, .22);
  --ke-dark-line-strong: rgba(241, 220, 167, .5);
  --ke-dark-copy: rgba(255, 252, 246, .74);
  --ke-dark-copy-muted: rgba(255, 252, 246, .56);
  --ke-dark-shadow: 0 28px 80px rgba(3, 12, 16, .48), inset 0 1px 0 rgba(255, 255, 255, .06);
  --ke-morph-duration: 280ms;
  --ke-morph-ease: cubic-bezier(.16, 1, .3, 1);

  /* Override the earlier light-first semantic layer. */
  --ke-canvas: var(--ke-midnight);
  --ke-paper: var(--ke-midnight-raised);
  --ke-surface: var(--ke-midnight-raised);
  --ke-ink: var(--ke-porcelain);
  --ke-ink-soft: var(--ke-dark-copy);
  --ke-burgundy: var(--ke-jewel-burgundy);
  --ke-gold: var(--ke-jewel-gold);
  --ke-gold-light: var(--ke-jewel-gold-light);
  --ke-line: var(--ke-dark-line);
  --ke-color-canvas: var(--ke-midnight);
  --ke-color-surface: var(--ke-midnight-raised);
  --ke-color-surface-subtle: #142a34;
  --ke-color-text: var(--ke-porcelain);
  --ke-color-text-secondary: var(--ke-dark-copy);
  --ke-color-text-tertiary: var(--ke-dark-copy-muted);
  --ke-color-line: var(--ke-dark-line);
  --ke-color-line-strong: var(--ke-dark-line-strong);
  --ke-color-scrim: rgba(3, 12, 16, .78);
}

html.ke-rebrand-mode,
html.ke-rebrand-mode body,
html.ke-rebrand-mode #app,
html.ke-rebrand-mode #screen-area {
  background:
    radial-gradient(circle at 50% -12%, rgba(215, 181, 109, .12), transparent 34rem),
    radial-gradient(circle at 8% 76%, rgba(104, 45, 67, .15), transparent 28rem),
    linear-gradient(180deg, var(--ke-midnight), var(--ke-midnight-deep)) !important;
  color: var(--ke-porcelain) !important;
}

html.ke-rebrand-mode .screen.active,
html.ke-rebrand-mode #scr-plan.active {
  background: transparent !important;
  color: var(--ke-porcelain) !important;
}

html.ke-rebrand-mode :where(button, a, input, select, textarea, [role="button"]):focus-visible {
  outline: 3px solid var(--ke-jewel-gold-light) !important;
  outline-offset: 4px !important;
  box-shadow: 0 0 0 7px rgba(215, 181, 109, .18) !important;
}

/* Shared dark reading and work surfaces. */
html.ke-rebrand-mode :where(.ke-unified-surface, .ke-morph-surface) {
  background:
    radial-gradient(circle at 84% -12%, rgba(215, 181, 109, .12), transparent 42%),
    linear-gradient(155deg, rgba(28, 54, 65, .98), rgba(9, 25, 31, .99));
  border: 1px solid var(--ke-dark-line);
  border-radius: 28px;
  box-shadow: var(--ke-dark-shadow);
  color: var(--ke-porcelain);
}

html.ke-rebrand-mode :where(.ke-unified-surface, .ke-morph-surface) :where(h1, h2, h3, strong) {
  color: var(--ke-porcelain);
}

html.ke-rebrand-mode :where(.ke-unified-surface, .ke-morph-surface) :where(p, small, label) {
  color: var(--ke-dark-copy);
}

/* Shape launchers keep a rectangular hit area/focus outline; only the visual
   chassis is clipped. Labels can sit below the chassis when they are long. */
html.ke-rebrand-mode .ke-shape-launcher {
  --ke-shape-fill: var(--ke-jewel-burgundy);
  align-items: center;
  appearance: none;
  background: transparent;
  border: 0;
  color: var(--ke-porcelain);
  cursor: pointer;
  display: inline-flex;
  flex-direction: column;
  font-family: var(--ke-font-ui, "DM Sans", sans-serif);
  gap: 8px;
  justify-content: center;
  min-height: 96px;
  min-width: 88px;
  padding: 4px;
  position: relative;
  text-align: center;
  text-decoration: none;
}

html.ke-rebrand-mode .ke-shape-launcher::before {
  background:
    radial-gradient(circle at 34% 22%, rgba(255, 255, 255, .23), transparent 22%),
    linear-gradient(145deg, rgba(255, 255, 255, .12), transparent 42%),
    var(--ke-shape-fill);
  border: 2px solid var(--ke-jewel-gold);
  border-radius: 50%;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .25),
    inset 0 -10px 22px rgba(3, 12, 16, .18),
    0 0 0 4px rgba(215, 181, 109, .08),
    0 12px 30px rgba(3, 12, 16, .34);
  content: "";
  height: 72px;
  inset: 4px auto auto 50%;
  position: absolute;
  transform: translateX(-50%);
  transition: transform var(--ke-morph-duration) var(--ke-morph-ease), box-shadow var(--ke-morph-duration) ease;
  width: 72px;
}

html.ke-rebrand-mode .ke-shape-launcher--hex::before {
  border-radius: 0;
  clip-path: polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0 50%);
}

html.ke-rebrand-mode .ke-shape-launcher > :first-child {
  align-items: center;
  display: inline-flex;
  font-family: var(--ke-font-display, "Playfair Display", serif);
  font-size: 24px;
  font-weight: 700;
  height: 72px;
  justify-content: center;
  line-height: 1;
  position: relative;
  width: 72px;
  z-index: 1;
}

html.ke-rebrand-mode .ke-shape-launcher > :last-child:not(:first-child) {
  color: var(--ke-porcelain);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .02em;
  line-height: 1.18;
  max-width: 88px;
  position: relative;
  z-index: 1;
}

html.ke-rebrand-mode .ke-shape-launcher:hover::before,
html.ke-rebrand-mode .ke-shape-launcher[aria-expanded="true"]::before {
  box-shadow: 0 0 0 5px rgba(215, 181, 109, .14), 0 15px 34px rgba(3, 12, 16, .45), 0 0 28px rgba(215, 181, 109, .18);
  transform: translateX(-50%) translateY(-2px) scale(1.035);
}

html.ke-rebrand-mode .mp-add-launcher {
  --ke-shape-fill: var(--ke-jewel-burgundy);
  bottom: calc(92px + env(safe-area-inset-bottom));
  position: fixed;
  right: clamp(14px, 3vw, 28px);
  z-index: 205;
}

/* Dashboard-owned expanded surfaces use the same dark material language. The
   report/calendar and conversation bodies remain rectangular and readable. */
html.ke-rebrand-mode :is(.ke-dashboard-checkin-card, .ke-dashboard-modal-card, .ke-dashboard-thirty-day-card, .ke-talk-chooser-card) {
  background:
    radial-gradient(circle at 84% -12%, rgba(215, 181, 109, .13), transparent 42%),
    linear-gradient(155deg, rgba(28, 54, 65, .99), rgba(9, 25, 31, .995)) !important;
  border: 1px solid rgba(215, 181, 109, .32) !important;
  box-shadow: var(--ke-dark-shadow) !important;
  color: var(--ke-porcelain) !important;
}

html.ke-rebrand-mode :is(.ke-dashboard-checkin-card, .ke-dashboard-modal-card, .ke-dashboard-thirty-day-card) :where(h1, h2, h3, strong) {
  color: var(--ke-porcelain) !important;
}

html.ke-rebrand-mode :is(.ke-dashboard-checkin-card, .ke-dashboard-modal-card, .ke-dashboard-thirty-day-card) :where(p, small, span) {
  color: var(--ke-dark-copy) !important;
}

html.ke-rebrand-mode .ke-dashboard-thirty-day-header {
  border-bottom-color: var(--ke-dark-line) !important;
}

html.ke-rebrand-mode .ke-dashboard-thirty-day-card .ke-dashboard-thirty-day-header h2 {
  color: var(--ke-porcelain) !important;
}

html.ke-rebrand-mode .ke-dashboard-thirty-day-card .ke-dashboard-thirty-day-header p {
  color: var(--ke-dark-copy) !important;
}

html.ke-rebrand-mode .ke-dashboard-thirty-day-card .ke-dashboard-thirty-day-mini-flame strong {
  color: var(--ke-jewel-gold-light) !important;
}

html.ke-rebrand-mode :is(.ke-dashboard-thirty-day-back, .ke-dashboard-modal-close, .ke-talk-chooser-close, .ke-talk-view-back) {
  color: var(--ke-jewel-gold-light) !important;
}

html.ke-rebrand-mode .ke-dashboard-thirty-day-mini-flame,
html.ke-rebrand-mode #ke-dashboard-thirty-day-mood-list span {
  background: rgba(215, 181, 109, .1) !important;
  border-color: rgba(215, 181, 109, .34) !important;
  color: var(--ke-jewel-gold-light) !important;
}

html.ke-rebrand-mode .ke-dashboard-thirty-day-alert {
  background: rgba(215, 181, 109, .1) !important;
  border-color: var(--ke-dark-line) !important;
  color: var(--ke-jewel-gold-light) !important;
}

html.ke-rebrand-mode .ke-dashboard-thirty-day-days,
html.ke-rebrand-mode .ke-dashboard-thirty-day-stats div {
  background: rgba(255, 252, 246, .055) !important;
  border-color: var(--ke-dark-line) !important;
}

html.ke-rebrand-mode .ke-dashboard-thirty-day-day {
  background: rgba(255, 252, 246, .08) !important;
  color: var(--ke-dark-copy) !important;
}

html.ke-rebrand-mode .ke-dashboard-thirty-day-day.is-checkin {
  background: var(--ke-jewel-gold) !important;
  color: var(--ke-midnight-deep) !important;
}

html.ke-rebrand-mode .ke-dashboard-thirty-day-day.is-journal {
  border-color: var(--ke-jewel-burgundy-bright) !important;
}

html.ke-rebrand-mode .ke-dashboard-thirty-day-stats strong {
  color: var(--ke-jewel-gold-light) !important;
}

html.ke-rebrand-mode .ke-dashboard-thirty-day-hero {
  background:
    radial-gradient(circle at 82% 0, rgba(255, 255, 255, .12), transparent 40%),
    linear-gradient(145deg, var(--ke-jewel-burgundy-bright), var(--ke-jewel-burgundy)) !important;
  border: 1px solid rgba(241, 220, 167, .28);
  box-shadow: 0 14px 34px rgba(3, 12, 16, .26);
}

html.ke-rebrand-mode .ke-dashboard-emotion,
html.ke-rebrand-mode .ke-dashboard-need {
  background: rgba(255, 252, 246, .055) !important;
  border-color: var(--ke-dark-line) !important;
  color: var(--ke-porcelain) !important;
}

html.ke-rebrand-mode :is(.ke-dashboard-emotion, .ke-dashboard-need)[aria-pressed="true"] {
  background: var(--ke-jewel-burgundy) !important;
  border-color: var(--ke-jewel-gold) !important;
}

/* The Talk chooser is a compact Karamo-centered constellation. Once Call or
   Text is selected, the same card becomes a conventional work surface. */
html.ke-rebrand-mode .ke-talk-chooser-backdrop {
  background: rgba(3, 12, 16, .78) !important;
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
}

html.ke-rebrand-mode .ke-talk-chooser-card {
  max-width: 520px !important;
}

html.ke-rebrand-mode .ke-talk-chooser-card::before {
  animation: none !important;
  background: radial-gradient(circle at 50% 44%, rgba(215, 181, 109, .12), transparent 48%) !important;
  transform: none !important;
}

html.ke-rebrand-mode .ke-talk-chooser-kicker,
html.ke-rebrand-mode .ke-talk-choice-view > h2 span,
html.ke-rebrand-mode .ke-talk-text-heading span {
  color: var(--ke-jewel-gold-light) !important;
}

html.ke-rebrand-mode .ke-talk-choice-view > h2 strong,
html.ke-rebrand-mode .ke-talk-text-heading h2 {
  color: var(--ke-porcelain) !important;
}

html.ke-rebrand-mode .ke-talk-chooser-intro,
html.ke-rebrand-mode .ke-talk-ai-note {
  color: var(--ke-dark-copy) !important;
}

html.ke-rebrand-mode .ke-talk-chooser-portrait {
  background: var(--ke-midnight-raised) !important;
  border-color: var(--ke-jewel-gold) !important;
  box-shadow: 0 0 0 8px rgba(215, 181, 109, .08), 0 18px 40px rgba(3, 12, 16, .4) !important;
  height: 126px !important;
  width: 126px !important;
}

html.ke-rebrand-mode .ke-talk-choice-buttons {
  align-items: start;
  display: grid !important;
  gap: 10px !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  justify-content: center;
  margin: 18px auto 0;
  max-width: 430px;
}

html.ke-rebrand-mode .ke-talk-choice-buttons > button,
html.ke-rebrand-mode .ke-talk-choice-buttons > button:first-child,
html.ke-rebrand-mode .ke-talk-choice-buttons > .ke-talk-choice-resource {
  align-items: center !important;
  aspect-ratio: 1;
  background:
    radial-gradient(circle at 34% 22%, rgba(255,255,255,.16), transparent 22%),
    linear-gradient(145deg, #294854, #142c35) !important;
  border: 2px solid rgba(215, 181, 109, .68) !important;
  border-radius: 50% !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 11px 28px rgba(3,12,16,.32);
  color: var(--ke-porcelain) !important;
  display: flex !important;
  flex-direction: column;
  gap: 5px !important;
  justify-content: center;
  min-height: 0 !important;
  padding: 10px !important;
  text-align: center !important;
}

html.ke-rebrand-mode .ke-talk-choice-buttons > button:first-child {
  background:
    radial-gradient(circle at 34% 22%, rgba(255,255,255,.18), transparent 22%),
    linear-gradient(145deg, var(--ke-jewel-burgundy-bright), var(--ke-jewel-burgundy)) !important;
}

html.ke-rebrand-mode .ke-talk-choice-buttons > .ke-talk-choice-resource {
  background:
    radial-gradient(circle at 34% 22%, rgba(255,255,255,.15), transparent 22%),
    linear-gradient(145deg, #47776d, #294f49) !important;
}

html.ke-rebrand-mode .ke-talk-choice-icon {
  background: rgba(215, 181, 109, .1) !important;
  border-color: rgba(241, 220, 167, .42) !important;
  color: var(--ke-jewel-gold-light) !important;
  flex: 0 0 30px !important;
  height: 30px !important;
  width: 30px;
}

html.ke-rebrand-mode .ke-talk-choice-buttons strong {
  color: var(--ke-porcelain) !important;
  font-family: var(--ke-font-display, "Playfair Display", serif);
  font-size: 12px !important;
  line-height: 1.1;
}

html.ke-rebrand-mode .ke-talk-choice-buttons small {
  color: var(--ke-dark-copy) !important;
  font-size: 10px !important;
  line-height: 1.15;
  margin: 0 !important;
}

html.ke-rebrand-mode .ke-talk-choice-arrow { display: none; }

html.ke-rebrand-mode :is(.ke-talk-context-banner, .ke-talk-message, .ke-talk-text-prompts button) {
  background: rgba(255, 252, 246, .06) !important;
  border-color: var(--ke-dark-line) !important;
  color: var(--ke-porcelain) !important;
}

html.ke-rebrand-mode .ke-talk-message.is-user {
  background: var(--ke-jewel-burgundy) !important;
  border-color: var(--ke-jewel-burgundy-bright) !important;
}

html.ke-rebrand-mode .ke-talk-text-form textarea {
  background: rgba(255, 252, 246, .055) !important;
  border-color: var(--ke-dark-line) !important;
  color: var(--ke-porcelain) !important;
}

html.ke-rebrand-mode .ke-talk-text-form button {
  background: linear-gradient(145deg, var(--ke-jewel-gold-light), var(--ke-jewel-gold)) !important;
  border: 0 !important;
  color: var(--ke-midnight-deep) !important;
}

/* Common morph animation for legacy and newly migrated surfaces. */
html.ke-rebrand-mode .ke-morph-overlay {
  -webkit-backdrop-filter: blur(16px) saturate(1.05);
  backdrop-filter: blur(16px) saturate(1.05);
}

html.ke-rebrand-mode .ke-morph-overlay > :last-child {
  opacity: 0;
  transform: translateY(22px) scale(.92);
  transform-origin: var(--ke-morph-origin-x, 50%) var(--ke-morph-origin-y, 50%);
  transition: opacity 180ms ease, transform var(--ke-morph-duration) var(--ke-morph-ease);
}

html.ke-rebrand-mode .ke-morph-overlay.ke-morph-open > :last-child {
  opacity: 1;
  transform: translateY(0) scale(1);
}

html.ke-rebrand-mode .ke-morph-overlay.ke-morph-closing > :last-child {
  opacity: 0;
  transform: translateY(12px) scale(.94);
}

/* Notifications become a dark reading room. Filters are compact medallions;
   rows remain rectangular so names and previews are scannable. */
html.ke-rebrand-mode #notifications-page {
  background:
    radial-gradient(circle at 50% 0, rgba(215, 181, 109, .14), transparent 28rem),
    linear-gradient(180deg, var(--ke-midnight), var(--ke-midnight-deep)) !important;
  color: var(--ke-porcelain) !important;
}

html.ke-rebrand-mode #notifications-page .notif-header {
  background: rgba(9, 25, 31, .94) !important;
  border-bottom: 1px solid var(--ke-dark-line) !important;
  box-shadow: 0 12px 34px rgba(3, 12, 16, .26);
}

html.ke-rebrand-mode #notifications-page .notif-title {
  color: var(--ke-porcelain) !important;
}

html.ke-rebrand-mode #notifications-page .notif-read-all {
  color: var(--ke-jewel-gold-light) !important;
}

html.ke-rebrand-mode #notifications-page .notif-tabs {
  background: transparent !important;
  border: 0 !important;
  gap: 10px;
  justify-content: center;
  margin: 0 auto;
  max-width: 520px;
  padding: 18px 12px 14px;
  width: 100%;
}

html.ke-rebrand-mode #notifications-page :is(.notif-tab, .notif-show-read) {
  background: linear-gradient(145deg, #203944, #132a34) !important;
  border: 1px solid rgba(215, 181, 109, .34) !important;
  border-radius: 50% !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 9px 24px rgba(3, 12, 16, .24);
  color: var(--ke-dark-copy) !important;
  flex: 0 1 72px;
  font-size: 10px !important;
  height: 66px;
  letter-spacing: .05em;
  min-height: 66px;
  min-width: 66px;
  padding: 8px 5px;
}

html.ke-rebrand-mode #notifications-page .notif-tab.active {
  background:
    radial-gradient(circle at 34% 22%, rgba(255,255,255,.18), transparent 24%),
    linear-gradient(145deg, var(--ke-jewel-burgundy-bright), var(--ke-jewel-burgundy)) !important;
  border-color: var(--ke-jewel-gold-light) !important;
  color: var(--ke-porcelain) !important;
  box-shadow: 0 0 0 4px rgba(215,181,109,.1), 0 11px 28px rgba(3,12,16,.34);
}

html.ke-rebrand-mode #notifications-page #notif-list {
  background: transparent !important;
  margin: 0 auto;
  max-width: 720px;
  padding: 6px 14px calc(110px + env(safe-area-inset-bottom));
  width: 100%;
}

html.ke-rebrand-mode #notifications-page .notif-item-row {
  background: linear-gradient(155deg, rgba(29, 54, 65, .96), rgba(16, 36, 45, .96)) !important;
  border: 1px solid var(--ke-dark-line) !important;
  border-radius: 18px;
  box-shadow: 0 10px 28px rgba(3, 12, 16, .22);
  color: var(--ke-porcelain) !important;
  margin: 0 0 10px;
  min-height: 72px;
  opacity: 1 !important;
  padding: 14px !important;
}

html.ke-rebrand-mode #notifications-page .notif-item-row[data-read="true"] {
  opacity: .64 !important;
}

html.ke-rebrand-mode #notifications-page .notif-item-copy,
html.ke-rebrand-mode #notifications-page .notif-item-copy b {
  color: var(--ke-porcelain) !important;
}

html.ke-rebrand-mode #notifications-page .notif-item-preview {
  color: var(--ke-dark-copy-muted) !important;
}

html.ke-rebrand-mode #notifications-page .notif-empty {
  align-items: center;
  color: var(--ke-dark-copy) !important;
  display: flex;
  flex-direction: column;
  font-family: var(--ke-font-reflective, "Cormorant Garamond", serif) !important;
  font-size: 20px !important;
  justify-content: center;
  min-height: 40vh;
  padding: 48px 20px !important;
  text-align: center;
}

/* Authentication and account creation keep conventional fields inside a
   dark, premium entry surface. */
html.ke-rebrand-mode :is(#auth-gate, #subscription-gate, #create-account-page) {
  background:
    radial-gradient(circle at 50% 8%, rgba(215, 181, 109, .15), transparent 25rem),
    linear-gradient(180deg, var(--ke-midnight), var(--ke-midnight-deep)) !important;
  color: var(--ke-porcelain) !important;
}

html.ke-rebrand-mode :is(.auth-wrap, #create-account-page .ke-create-shell) {
  background: linear-gradient(155deg, rgba(29, 54, 65, .96), rgba(9, 25, 31, .98)) !important;
  border: 1px solid var(--ke-dark-line) !important;
  border-radius: 28px !important;
  box-shadow: var(--ke-dark-shadow) !important;
  color: var(--ke-porcelain) !important;
  padding: clamp(22px, 4vw, 34px) !important;
}

html.ke-rebrand-mode #create-account-page .ke-create-shell {
  margin-block: auto !important;
}

html.ke-rebrand-mode :is(.auth-input, #create-account-page .ke-create-input),
html.ke-rebrand-mode :is(#ke-report-notes, #cancel-reason-details) {
  background: rgba(255, 252, 246, .055) !important;
  border: 1px solid rgba(215, 181, 109, .24) !important;
  border-radius: 13px !important;
  color: var(--ke-porcelain) !important;
}

html.ke-rebrand-mode :is(.auth-input, #create-account-page .ke-create-input)::placeholder,
html.ke-rebrand-mode :is(#ke-report-notes, #cancel-reason-details)::placeholder {
  color: var(--ke-dark-copy-muted) !important;
}

html.ke-rebrand-mode #create-account-page :is(.ke-eula-row, .ke-ai-consent-row, .ke-create-signin),
html.ke-rebrand-mode #create-account-page :is(.ke-eula-row, .ke-ai-consent-row) label {
  color: var(--ke-dark-copy) !important;
}

html.ke-rebrand-mode #create-account-page a {
  color: var(--ke-jewel-gold-light) !important;
}

/* Safety, consent, moderation, and cancellation surfaces are intentionally
   conventional dialogs. They share the materials but never auto-dismiss. */
html.ke-rebrand-mode :is(#ke-eula-modal, #ke-ai-consent-modal, #ke-report-sheet, #ke-block-confirm, #cancel-modal-overlay) {
  background: rgba(3, 12, 16, .78) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.05);
  backdrop-filter: blur(18px) saturate(1.05);
}

html.ke-rebrand-mode :is(#ke-eula-modal, #ke-ai-consent-modal, #ke-report-sheet, #ke-block-confirm, #cancel-modal-overlay) > div {
  background:
    radial-gradient(circle at 85% -15%, rgba(215, 181, 109, .13), transparent 46%),
    linear-gradient(155deg, rgba(28, 54, 65, .99), rgba(9, 25, 31, .995)) !important;
  border: 1px solid rgba(215, 181, 109, .32) !important;
  border-radius: 26px !important;
  box-shadow: var(--ke-dark-shadow) !important;
  color: var(--ke-porcelain) !important;
}

html.ke-rebrand-mode :is(#ke-eula-modal, #ke-ai-consent-modal, #ke-report-sheet, #ke-block-confirm, #cancel-modal-overlay) :is(h1, h2, h3, p, li, label, strong) {
  color: inherit !important;
}

html.ke-rebrand-mode #ke-ai-consent-modal > div > div,
html.ke-rebrand-mode #ke-report-sheet label {
  background: rgba(255, 252, 246, .05) !important;
  border-color: var(--ke-dark-line) !important;
  color: var(--ke-dark-copy) !important;
}

html.ke-rebrand-mode :is(#ke-eula-modal, #ke-ai-consent-modal) a {
  color: var(--ke-jewel-gold-light) !important;
}

html.ke-rebrand-mode :is(#ke-eula-agree-btn, #ke-ai-agree-btn, #ke-report-submit, #ke-block-confirm-btn) {
  background: linear-gradient(145deg, var(--ke-jewel-gold-light), var(--ke-jewel-gold)) !important;
  border: 0 !important;
  border-radius: 13px !important;
  color: var(--ke-midnight-deep) !important;
  min-height: 48px;
}

html.ke-rebrand-mode :is(#ke-report-cancel, #ke-block-cancel) {
  background: rgba(255, 252, 246, .08) !important;
  border: 1px solid var(--ke-dark-line) !important;
  border-radius: 13px !important;
  color: var(--ke-porcelain) !important;
}

html.ke-rebrand-mode #ke-blocked-users-page {
  background:
    radial-gradient(circle at 50% 0, rgba(215, 181, 109, .12), transparent 26rem),
    linear-gradient(180deg, var(--ke-midnight), var(--ke-midnight-deep)) !important;
  color: var(--ke-porcelain) !important;
}

html.ke-rebrand-mode #ke-blocked-users-page > div:first-child {
  background: rgba(9, 25, 31, .95) !important;
  border-bottom: 1px solid var(--ke-dark-line);
}

html.ke-rebrand-mode #ke-blocked-list {
  margin: 0 auto;
  max-width: 680px;
  padding: 22px 16px calc(100px + env(safe-area-inset-bottom)) !important;
}

html.ke-rebrand-mode #ke-blocked-list > div {
  background: linear-gradient(155deg, rgba(29, 54, 65, .96), rgba(16, 36, 45, .96)) !important;
  border: 1px solid var(--ke-dark-line);
  border-radius: 16px !important;
  box-shadow: 0 10px 28px rgba(3, 12, 16, .2) !important;
}

html.ke-rebrand-mode #ke-blocked-list > div > div {
  color: var(--ke-porcelain) !important;
}

html.ke-rebrand-mode #ke-blocked-list p {
  color: var(--ke-dark-copy) !important;
}

/* Shared alertdialog created by rebrand-unified.js. */
.ke-unified-dialog {
  align-items: center;
  background: rgba(3, 12, 16, .8);
  display: none;
  inset: 0;
  justify-content: center;
  padding: 20px;
  position: fixed;
  z-index: 100004;
}

.ke-unified-dialog.is-open { display: flex; }

.ke-unified-dialog__panel {
  background:
    radial-gradient(circle at 86% -20%, rgba(215, 181, 109, .14), transparent 46%),
    linear-gradient(155deg, rgba(28, 54, 65, .995), rgba(9, 25, 31, .995));
  border: 1px solid rgba(215, 181, 109, .34);
  border-radius: 24px;
  box-shadow: var(--ke-dark-shadow);
  color: var(--ke-porcelain);
  max-width: 430px;
  padding: 24px;
  width: 100%;
}

.ke-unified-dialog__panel h2 {
  color: var(--ke-porcelain);
  font-family: var(--ke-font-display, "Playfair Display", serif);
  font-size: 23px;
  margin: 0 0 10px;
}

.ke-unified-dialog__panel p {
  color: var(--ke-dark-copy);
  line-height: 1.55;
  margin: 0;
}

.ke-unified-dialog__actions {
  display: flex;
  gap: 10px;
  justify-content: flex-end;
  margin-top: 20px;
}

.ke-unified-dialog__actions button {
  border: 1px solid var(--ke-dark-line);
  border-radius: 12px;
  cursor: pointer;
  font: 700 13px var(--ke-font-ui, "DM Sans", sans-serif);
  min-height: 46px;
  padding: 11px 18px;
}

.ke-unified-dialog__cancel {
  background: rgba(255, 252, 246, .07);
  color: var(--ke-porcelain);
}

.ke-unified-dialog__confirm {
  background: linear-gradient(145deg, var(--ke-jewel-gold-light), var(--ke-jewel-gold));
  color: var(--ke-midnight-deep);
}

/* Account setup overlays now transition through the same dark canvas. */
html.ke-rebrand-mode :is(#ca-loading-overlay, #ca-welcome-overlay) {
  background:
    radial-gradient(circle at 50% 45%, rgba(215, 181, 109, .16), transparent 22rem),
    var(--ke-midnight-deep) !important;
  color: var(--ke-porcelain) !important;
}

/* Compact jewelry still needs legible language. These selectors cover the
   newly introduced hubs and medallions without inflating media metadata. */
html.ke-rebrand-mode :is(
  .ke-profile-constellation-hub span,
  .ke-profile-constellation-hub small,
  .ke-profile-constellation .ke-profile-option-status,
  .ke-activation-rhythm-core small,
  .ke-activation-rhythm-core span,
  .ke-activation-rhythm-orb small,
  .ke-activation-rhythm-orb span,
  .ke-activation-rhythm-editor label,
  .ke-welcome-option.is-medallion small,
  .ke-intake-option.is-medallion .ke-intake-option-copy small,
  .ke-profile-eyebrow,
  .ke-welcome-eyebrow,
  .ke-library-eyebrow,
  .ke-journal-kicker
) {
  font-size: max(10px, .6875rem) !important;
}

@media (max-width: 520px) {
  html.ke-rebrand-mode :where(.ke-unified-surface, .ke-morph-surface) {
    border-radius: 24px 24px 0 0;
    max-height: calc(100dvh - env(safe-area-inset-top));
  }

  html.ke-rebrand-mode #notifications-page :is(.notif-tab, .notif-show-read) {
    flex-basis: 64px;
    height: 62px;
    min-height: 62px;
    min-width: 62px;
  }

  html.ke-rebrand-mode :is(.auth-wrap, #create-account-page .ke-create-shell) {
    border-radius: 24px !important;
    margin-inline: 12px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html.ke-rebrand-mode .ke-morph-overlay > :last-child,
  html.ke-rebrand-mode .ke-shape-launcher::before {
    transition-duration: .01ms !important;
  }
}