/* Kē Sanctuary experience polish — active only on /rebrand. */
html.ke-rebrand-mode {
  color-scheme: light;
  --ke-canvas: #fbf8f2;
  --ke-paper: #f4ecdf;
  --ke-surface: #fffdf9;
  --ke-ink: #13252e;
  --ke-ink-soft: #53646b;
  --ke-burgundy: #6b2d46;
  --ke-gold: #d7b56d;
  --ke-gold-light: #f1dca7;
  --ke-sage: #82958a;
  --ke-danger: #b84454;
  --ke-line: rgba(19, 37, 46, .12);
  --ke-line-warm: rgba(107, 45, 70, .14);
  --ke-radius-control: 12px;
  --ke-radius-card: 20px;
  --ke-radius-hero: 28px;
  --ke-shadow-card: 0 10px 30px rgba(19, 37, 46, .075);
  --ke-shadow-float: 0 24px 64px rgba(19, 37, 46, .18);
}

html.ke-rebrand-mode,
html.ke-rebrand-mode body,
html.ke-rebrand-mode #app,
html.ke-rebrand-mode #screen-area {
  background: var(--ke-canvas) !important;
  color: var(--ke-ink);
}

html.ke-rebrand-mode body {
  font-family: "DM Sans", sans-serif;
  font-weight: 400;
  text-rendering: optimizeLegibility;
}

html.ke-rebrand-mode .screen:not(.active),
html.ke-rebrand-mode #scr-plan:not(.active) {
  display: none !important;
  visibility: hidden !important;
}

html.ke-rebrand-mode .screen.active {
  background: var(--ke-canvas) !important;
  color: var(--ke-ink);
}

html.ke-rebrand-mode #scr-plan.active { display: block !important; }

html.ke-rebrand-mode :where(button, a, [role="button"], input, textarea, select, summary):focus-visible {
  outline: 3px solid rgba(107, 45, 70, .28) !important;
  outline-offset: 3px !important;
}

html.ke-rebrand-mode :where(button, [role="button"], input, select, summary) { min-height: 44px; }
html.ke-rebrand-mode :where(p, li, textarea, input) { font-size: max(13px, 1em); }

/* Shared app bar */
html.ke-rebrand-mode :is(.ke-dashboard-header, .ke-journal-header, .ke-library-header, .ke-resources-header, .mp-plan-header) {
  align-items: center !important;
  background: rgba(19, 37, 46, .975) !important;
  border-bottom: 1px solid rgba(215, 181, 109, .24) !important;
  box-shadow: 0 8px 26px rgba(19, 37, 46, .09);
  color: var(--ke-surface) !important;
  min-height: 76px !important;
  padding: max(10px, env(safe-area-inset-top)) clamp(14px, 3vw, 28px) 10px !important;
  position: sticky !important;
  top: 0;
  z-index: 180;
}

html.ke-rebrand-mode :is(.ke-dashboard-brand, .ke-journal-brand, .ke-library-brand, .ke-resources-brand) {
  align-items: center;
  border-radius: 14px;
  cursor: pointer;
  gap: 12px;
  min-width: 0;
}

html.ke-rebrand-mode :is(.ke-dashboard-profile-initials, .ke-journal-profile-initials, .ke-library-profile-initials, .ke-resources-profile-initials, .mp-plan-profile > span) {
  align-items: center;
  background: linear-gradient(145deg, #7a3852, var(--ke-burgundy));
  border: 1px solid rgba(241, 220, 167, .72);
  border-radius: 50%;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.24), 0 7px 18px rgba(0,0,0,.2);
  color: #fffaf4 !important;
  display: inline-flex;
  flex: 0 0 44px;
  font-family: "Playfair Display", serif;
  font-size: 15px;
  font-weight: 700;
  height: 44px;
  justify-content: center;
  line-height: 1;
  width: 44px;
}

html.ke-rebrand-mode .mp-plan-profile {
  background: transparent;
  border: 0;
  flex: 0 0 44px;
  padding: 0;
}

html.ke-rebrand-mode :is(.ke-dashboard-header-copy h1, .ke-library-brand strong, .ke-resources-brand strong, .mp-header-title h1) {
  color: #fffaf4 !important;
  font-family: "Playfair Display", serif !important;
  font-size: clamp(17px, 2vw, 20px) !important;
  font-weight: 700 !important;
  letter-spacing: -.02em;
}

html.ke-rebrand-mode :is(.ke-dashboard-header-copy p, .ke-library-brand div > span, .ke-resources-brand div > span, .ke-journal-brand > span:last-child) {
  color: rgba(241, 220, 167, .78) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: .04em;
}

html.ke-rebrand-mode .ke-journal-header-copy { flex: 1; min-width: 0; }
html.ke-rebrand-mode .ke-journal-header-copy h1 { color: #fffaf4 !important; font-size: clamp(16px, 2vw, 19px) !important; }
html.ke-rebrand-mode .ke-journal-header-copy .ke-journal-kicker { color: var(--ke-gold-light) !important; font-size: 11px !important; }
html.ke-rebrand-mode .ke-journal-header-action { background: var(--ke-gold) !important; border: 0 !important; color: var(--ke-ink) !important; }

html.ke-rebrand-mode :is(.ke-dashboard-header-flame, .ke-library-flame, .ke-resources-flame, .mp-plan-flame) {
  align-items: center;
  background: rgba(255, 253, 249, .07) !important;
  border: 1px solid rgba(215, 181, 109, .32) !important;
  border-radius: 999px;
  color: var(--ke-gold-light) !important;
  display: inline-flex;
  gap: 6px;
  justify-content: center;
  min-height: 40px;
  min-width: 58px;
  padding: 6px 10px;
  text-decoration: none;
}

html.ke-rebrand-mode :is(.ke-dashboard-header-flame, .ke-library-flame, .ke-resources-flame, .mp-plan-flame) svg {
  fill: var(--ke-gold);
  filter: drop-shadow(0 2px 5px rgba(215,181,109,.25));
  height: 24px;
  width: 19px;
}

html.ke-rebrand-mode :is(.ke-dashboard-header-flame, .ke-library-flame, .ke-resources-flame, .mp-plan-flame) > strong {
  color: #fffaf4 !important;
  display: inline-block;
  flex: 0 0 auto;
  font-family: "DM Sans", sans-serif;
  font-size: 14px !important;
  font-variant-numeric: tabular-nums;
  font-weight: 800 !important;
  letter-spacing: .01em;
  line-height: 1 !important;
  min-width: 1.3ch;
  text-align: center;
  text-shadow: 0 1px 8px rgba(255,250,244,.24);
}

html.ke-rebrand-mode .mp-plan-header { display: flex !important; gap: 12px; }
html.ke-rebrand-mode .mp-header-title { flex: 1; min-width: 0; }
html.ke-rebrand-mode .mp-plan-header-actions { align-items: center; display: flex; gap: 8px; }
html.ke-rebrand-mode .mp-plan-bell { height: 44px !important; width: 44px !important; flex-basis: 44px !important; }

/* My Plan — progressive, calm, and consistent with the mental-health shell. */
html.ke-rebrand-mode #scr-plan { background: var(--ke-canvas) !important; }
html.ke-rebrand-mode .my-plan-scroll {
  background: radial-gradient(circle at 12% 0, rgba(215,181,109,.1), transparent 24rem), var(--ke-canvas) !important;
  padding: clamp(18px, 3vw, 34px) clamp(14px, 4vw, 36px) calc(160px + env(safe-area-inset-bottom)) !important;
}

html.ke-rebrand-mode .my-plan-native {
  gap: 20px !important;
  margin: 0 auto;
  max-width: 1120px !important;
}

html.ke-rebrand-mode .mp-card {
  background: var(--ke-surface) !important;
  border: 1px solid var(--ke-line) !important;
  border-radius: var(--ke-radius-card) !important;
  box-shadow: var(--ke-shadow-card) !important;
  color: var(--ke-ink) !important;
  padding: clamp(18px, 2.5vw, 28px) !important;
}

/* Rebrand opens directly into the plan controls; the shared current app keeps its hero. */
html.ke-rebrand-mode .mp-hero { display: none !important; }

html.ke-rebrand-mode .mp-plan-sections {
  align-items: center;
  background: rgba(255,253,249,.88);
  border: 1px solid var(--ke-line);
  border-radius: 16px;
  box-shadow: 0 5px 18px rgba(19,37,46,.055);
  display: grid;
  gap: 6px;
  grid-template-columns: repeat(4, minmax(0,1fr));
  padding: 6px;
  position: sticky;
  top: 86px;
  z-index: 110;
}
html.ke-rebrand-mode .mp-plan-sections button {
  background: transparent;
  border: 0;
  border-radius: 11px;
  color: var(--ke-ink-soft);
  font-size: 12px;
  font-weight: 700;
  min-height: 44px;
  padding: 8px 10px;
}
html.ke-rebrand-mode .mp-plan-sections button.active {
  background: var(--ke-burgundy);
  box-shadow: 0 7px 16px rgba(107,45,70,.16);
  color: #fff;
}

html.ke-rebrand-mode .mp-karamo-chat { display: none !important; }

html.ke-rebrand-mode :is(.mp-btn, .mp-primary-link, .mp-fitness-action, .mp-meal-log-btn, .mp-meal-adjust-btn, .mp-food-tool-tabs button, .mp-food-line button, .mp-food-photo-btn, .mp-food-result button, .mp-effort-row button, .mp-add-kind-row button) {
  align-items: center;
  border-radius: var(--ke-radius-control) !important;
  display: inline-flex;
  font-size: 12px !important;
  font-weight: 700 !important;
  justify-content: center;
  min-height: 44px !important;
}

html.ke-rebrand-mode :is(.mp-session, .mp-workout-row, .mp-log-row, .mp-added-row, .mp-meal-option-card, .mp-habit-plan-tile, .mp-macro-card, .mp-meal-plan-card, .mp-rest-card) {
  border-color: var(--ke-line) !important;
  border-radius: 16px !important;
  box-shadow: none !important;
}

html.ke-rebrand-mode :is(.mp-meal-modal-panel, .mp-exercise-video-panel, .mp-add-panel) {
  background: var(--ke-surface) !important;
  border: 1px solid rgba(215,181,109,.3) !important;
  border-radius: var(--ke-radius-hero) !important;
  box-shadow: var(--ke-shadow-float) !important;
}

/* Onboarding and optional surveys */
html.ke-rebrand-mode .ke-welcome-survey { background: rgba(19,37,46,.72) !important; backdrop-filter: blur(18px); }
html.ke-rebrand-mode .ke-welcome-card {
  background: var(--ke-surface) !important;
  border: 1px solid rgba(215,181,109,.34) !important;
  border-radius: var(--ke-radius-hero) !important;
  box-shadow: var(--ke-shadow-float) !important;
}
html.ke-rebrand-mode .ke-welcome-shimmer { animation: none !important; display: none !important; }
html.ke-rebrand-mode .ke-welcome-intro-art { background: radial-gradient(circle at 50% 65%, rgba(215,181,109,.22), transparent 42%), var(--ke-ink) !important; }
html.ke-rebrand-mode .ke-welcome-promises span { background: var(--ke-paper) !important; font-size: 11px !important; }
html.ke-rebrand-mode .ke-welcome-disclosure p,
html.ke-rebrand-mode .ke-welcome-option small,
html.ke-rebrand-mode .ke-welcome-privacy { font-size: 12px !important; }
html.ke-rebrand-mode .ke-welcome-option {
  border-color: var(--ke-line) !important;
  border-radius: 16px !important;
  min-height: 76px !important;
}
html.ke-rebrand-mode .ke-welcome-option.is-selected { background: var(--ke-burgundy) !important; box-shadow: 0 10px 24px rgba(107,45,70,.16) !important; }
html.ke-rebrand-mode :is(.ke-welcome-primary, .ke-welcome-secondary, .ke-welcome-skip) { border-radius: var(--ke-radius-control) !important; font-size: 12px !important; }

/* Karamo presence orb and chooser */
html.ke-rebrand-mode .ke-talk-launcher {
  animation: none !important;
  bottom: calc(94px + env(safe-area-inset-bottom)) !important;
  filter: drop-shadow(0 14px 22px rgba(19,37,46,.2));
  right: clamp(14px, 3vw, 28px) !important;
}
html.ke-rebrand-mode .ke-talk-launcher-photo {
  background: linear-gradient(145deg, var(--ke-gold-light), var(--ke-gold));
  border: 0 !important;
  box-shadow: 0 0 0 5px rgba(255,253,249,.9), 0 0 0 7px rgba(215,181,109,.42), inset 0 1px 0 rgba(255,255,255,.6) !important;
  height: 60px !important;
  width: 60px !important;
}
html.ke-rebrand-mode .ke-talk-launcher-hint {
  background: var(--ke-ink) !important;
  border: 1px solid rgba(215,181,109,.52) !important;
  box-shadow: 0 8px 18px rgba(19,37,46,.18);
  color: var(--ke-gold-light) !important;
  font-size: 11px !important;
}
html.ke-rebrand-mode .ke-talk-chooser { backdrop-filter: blur(14px); }
html.ke-rebrand-mode .ke-talk-chooser-backdrop { background: rgba(19,37,46,.66) !important; }
html.ke-rebrand-mode .ke-talk-chooser-card {
  background: rgba(255,253,249,.97) !important;
  border: 1px solid rgba(215,181,109,.42) !important;
  border-radius: var(--ke-radius-hero) !important;
  box-shadow: var(--ke-shadow-float) !important;
  max-height: calc(100dvh - 32px) !important;
}
html.ke-rebrand-mode .ke-talk-chooser-card::before { animation: none !important; opacity: 0 !important; }
html.ke-rebrand-mode .ke-talk-chooser-portrait {
  border: 0 !important;
  box-shadow: 0 0 0 5px var(--ke-surface), 0 0 0 9px var(--ke-gold), 0 22px 48px rgba(19,37,46,.18) !important;
}
html.ke-rebrand-mode .ke-talk-choice-buttons > button {
  border-color: var(--ke-line) !important;
  border-radius: 16px !important;
  min-height: 62px;
}
html.ke-rebrand-mode .ke-talk-choice-buttons > button:first-child { background: var(--ke-ink) !important; }
html.ke-rebrand-mode .ke-talk-text-messages { scrollbar-color: var(--ke-gold) transparent; }
html.ke-rebrand-mode .ke-talk-message { font-size: 14px !important; }

/* Community, notifications, account, legal and moderation surfaces. */
html.ke-rebrand-mode #group-feed-overlay {
  background: var(--ke-canvas) !important;
  color: var(--ke-ink) !important;
}
html.ke-rebrand-mode #group-feed-overlay :is(.ig-topbar, .ig-feed-header) {
  background: rgba(19,37,46,.98) !important;
  border-bottom-color: rgba(215,181,109,.26) !important;
}
html.ke-rebrand-mode #group-feed-overlay :is(.ig-post, .ig-card, .ig-feed-composer, [class*="post-card"]) {
  background: var(--ke-surface) !important;
  border: 1px solid var(--ke-line) !important;
  border-radius: var(--ke-radius-card) !important;
  box-shadow: var(--ke-shadow-card) !important;
}
html.ke-rebrand-mode #group-feed-overlay :is(input, textarea) {
  background: var(--ke-canvas) !important;
  border: 1px solid var(--ke-line) !important;
  border-radius: 14px !important;
  color: var(--ke-ink) !important;
  font-size: 16px !important;
}

html.ke-rebrand-mode #notifications-page {
  background: radial-gradient(circle at 50% 0, rgba(215,181,109,.11), transparent 20rem), var(--ke-canvas) !important;
  color: var(--ke-ink) !important;
}
html.ke-rebrand-mode .notif-header {
  background: rgba(19,37,46,.98) !important;
  border-bottom: 1px solid rgba(215,181,109,.25) !important;
  color: #fffaf4 !important;
  min-height: 72px;
}
html.ke-rebrand-mode :is(.notif-back-btn, .notif-read-all) { color: var(--ke-gold-light) !important; min-height: 44px; }
html.ke-rebrand-mode .notif-title { color: #fffaf4 !important; font-family: "Playfair Display", serif; font-size: 20px !important; }
html.ke-rebrand-mode .notif-tabs {
  background: rgba(255,253,249,.92) !important;
  border-bottom: 1px solid var(--ke-line) !important;
  gap: 6px;
  padding: 10px 14px !important;
}
html.ke-rebrand-mode :is(.notif-tab, .notif-show-read) { border-radius: 999px !important; font-size: 12px !important; min-height: 40px; }
html.ke-rebrand-mode .notif-tab.active { background: var(--ke-burgundy) !important; color: #fff !important; }
html.ke-rebrand-mode .notif-item-row { background: var(--ke-surface) !important; border: 1px solid var(--ke-line) !important; border-radius: 16px !important; margin: 10px 14px; }

html.ke-rebrand-mode :is(#create-account-page, #login-page, #ke-blocked-users-page) { background: var(--ke-canvas) !important; }
html.ke-rebrand-mode :is(.ke-create-shell, .auth-card, .ke-account-card) {
  background: var(--ke-surface) !important;
  border: 1px solid var(--ke-line) !important;
  border-radius: var(--ke-radius-hero) !important;
  box-shadow: var(--ke-shadow-card) !important;
}

html.ke-rebrand-mode :is(#ke-eula-modal, #ke-ai-consent-modal, #ke-report-sheet, #ke-block-confirm, #cancel-modal-overlay) {
  backdrop-filter: blur(14px);
}
html.ke-rebrand-mode :is(#ke-eula-modal, #ke-ai-consent-modal, #ke-report-sheet, #ke-block-confirm, #cancel-modal-overlay) > div {
  border: 1px solid rgba(215,181,109,.3) !important;
  border-radius: var(--ke-radius-hero) !important;
  box-shadow: var(--ke-shadow-float) !important;
}
html.ke-rebrand-mode :is(#ke-eula-agree-btn, #ke-ai-agree-btn, #ke-report-submit) { border-radius: var(--ke-radius-control) !important; min-height: 48px; }

/* Error/empty/loading states should look intentional. */
html.ke-rebrand-mode :is(.ke-dashboard-alert, .ke-journal-alert, .ke-library-empty, .ke-resources-empty, .ke-profile-empty, .group-error, .ig-error) {
  background: var(--ke-surface) !important;
  border: 1px solid var(--ke-line) !important;
  border-radius: var(--ke-radius-card) !important;
  box-shadow: var(--ke-shadow-card) !important;
  color: var(--ke-ink) !important;
}

/* Keep every icon action comfortably thumb-sized without making the chrome feel heavy. */
html.ke-rebrand-mode :is(
  .ke-dashboard-icon-button,
  .ke-journal-icon-button,
  .ke-library-icon-button,
  .ke-resources-icon-button,
  .bell-btn-shared
) {
  align-items: center;
  display: inline-flex;
  justify-content: center;
  min-height: 44px !important;
  min-width: 44px !important;
}

html.ke-rebrand-mode .ke-dashboard-progress-link {
  align-items: center;
  display: inline-flex;
  min-height: 44px;
}

@media (min-width: 900px) {
  html.ke-rebrand-mode .my-plan-native > .mp-view-section:not([hidden]) { width: 100%; }
  html.ke-rebrand-mode .my-plan-native > .mp-view-section:not([hidden]) > .mp-list { display: grid; gap: 18px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  html.ke-rebrand-mode .my-plan-native > .mp-view-section:not([hidden]) > :is(.mp-section-title, .mp-memory-strip) { grid-column: 1 / -1; }
}

@media (max-width: 720px) {
  html.ke-rebrand-mode :is(.ke-dashboard-header, .ke-journal-header, .ke-library-header, .ke-resources-header, .mp-plan-header) {
    min-height: 68px !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
  html.ke-rebrand-mode :is(.ke-dashboard-profile-initials, .ke-journal-profile-initials, .ke-library-profile-initials, .ke-resources-profile-initials, .mp-plan-profile > span) {
    flex-basis: 40px;
    height: 40px;
    width: 40px;
  }
  html.ke-rebrand-mode .ke-journal-header-copy h1 { max-width: 145px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  html.ke-rebrand-mode .ke-journal-brand > span:last-child { display: none; }
  html.ke-rebrand-mode .mp-plan-flame { min-width: 52px; }
  html.ke-rebrand-mode .mp-plan-header { gap: 8px; }
  html.ke-rebrand-mode .mp-snapshot-date { font-size: 10px !important; }
  html.ke-rebrand-mode .mp-plan-sections { grid-template-columns: repeat(2, minmax(0,1fr)); position: static; }
  html.ke-rebrand-mode .ke-talk-chooser-card {
    border-radius: 24px !important;
    margin: 0 !important;
    max-height: calc(100dvh - max(12px, env(safe-area-inset-top, 0px)) - max(20px, env(safe-area-inset-bottom, 0px))) !important;
  }
  html.ke-rebrand-mode .ke-talk-chooser {
    align-items: center !important;
    padding: max(12px, env(safe-area-inset-top, 0px)) 12px max(20px, env(safe-area-inset-bottom, 0px)) !important;
  }
}

@media (max-width: 420px) {
  html.ke-rebrand-mode .ke-dashboard-header-copy p,
  html.ke-rebrand-mode .ke-library-brand div > span,
  html.ke-rebrand-mode .ke-resources-brand div > span { display: none !important; }
  html.ke-rebrand-mode .ke-journal-header-copy .ke-journal-kicker { display: none; }
  html.ke-rebrand-mode .mp-plan-profile { flex-basis: 40px; }
}

@media (prefers-reduced-motion: reduce) {
  html.ke-rebrand-mode *,
  html.ke-rebrand-mode *::before,
  html.ke-rebrand-mode *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
  }
}

/* The footer stays visually quiet without permanent rails between its icon
   circles. This SVG remains solely for temporary Talk and Journal tethers. */
html.ke-rebrand-mode #tab-bar > .ke-tab-karamo-connectors {
  display: block !important;
  height: 100%;
  inset: 0;
  overflow: visible;
  pointer-events: none;
  position: absolute;
  width: 100%;
  z-index: 0;
}

html.ke-rebrand-mode #tab-bar > .ke-tab-karamo-connectors line {
  fill: none;
  opacity: 0;
  pointer-events: none;
  stroke: rgba(215, 181, 109, .46);
  stroke-linecap: round;
  stroke-width: 1.25;
  vector-effect: non-scaling-stroke;
}

html.ke-rebrand-mode #tab-bar > .tab-btn {
  position: relative;
  z-index: 2;
}

html.ke-rebrand-mode #tab-bar > .ke-talk-launcher .ke-talk-launcher-photo {
  opacity: 1;
  transition: opacity 180ms ease, transform var(--ke-duration-fast, 160ms) var(--ke-ease-emphasized, ease), box-shadow var(--ke-duration-fast, 160ms) ease;
  visibility: visible;
  z-index: 4;
}

html.ke-rebrand-mode #tab-bar > .ke-talk-launcher .ke-talk-launcher-close-mark {
  align-items: center;
  background: #10242d;
  border: 1px solid rgba(241, 220, 167, .86);
  border-radius: 50%;
  box-shadow: 0 0 0 3px rgba(215, 181, 109, .18), 0 9px 22px rgba(4, 14, 18, .42);
  color: #f1dca7;
  display: flex;
  font-family: "DM Sans", sans-serif;
  font-size: 29px;
  font-weight: 400;
  height: 50px;
  justify-content: center;
  left: 50%;
  line-height: 1;
  opacity: 0;
  pointer-events: none;
  position: absolute;
  top: -7px;
  transform: translateX(-50%) scale(.82);
  transition: opacity 180ms ease, transform 220ms cubic-bezier(.16, .82, .18, 1), visibility 0s linear 220ms;
  visibility: hidden;
  width: 50px;
  z-index: 5;
}

html.ke-rebrand-mode #tab-bar > .ke-talk-launcher[aria-expanded="true"] {
  pointer-events: auto !important;
}

html.ke-rebrand-mode #tab-bar > .ke-talk-launcher[aria-expanded="true"] .ke-talk-launcher-photo {
  opacity: 0 !important;
  visibility: hidden;
}

html.ke-rebrand-mode #tab-bar > .ke-talk-launcher[aria-expanded="true"] .ke-talk-launcher-close-mark {
  opacity: 1;
  pointer-events: auto;
  transform: translateX(-50%) scale(1);
  transition-delay: 0s;
  visibility: visible;
}

html.ke-rebrand-mode #tab-bar > .ke-talk-launcher[data-ke-talk-control="closing"] {
  pointer-events: none !important;
}

html.ke-rebrand-mode #tab-bar > .ke-talk-launcher:focus-visible .ke-talk-launcher-close-mark {
  box-shadow: 0 0 0 3px rgba(241, 220, 167, .34), 0 9px 22px rgba(4, 14, 18, .42);
}

html.ke-rebrand-mode #tab-bar > .ke-tab-karamo-connectors .ke-tab-karamo-origin-tether {
  opacity: 0;
  stroke: rgba(215, 181, 109, .38);
  stroke-dasharray: 1;
  stroke-dashoffset: -1;
  stroke-width: 1.15;
}

html.ke-rebrand-mode #tab-bar > .ke-tab-karamo-connectors .ke-tab-journal-karamo-tether {
  opacity: 0;
  stroke: rgba(241, 220, 167, .92);
  stroke-linecap: round;
  stroke-width: 3;
}

html.ke-rebrand-mode.ke-journal-writing #tab-bar > .ke-tab-karamo-connectors[data-ke-journal-ready="true"] .ke-tab-journal-karamo-tether {
  opacity: 1;
}

html.ke-rebrand-mode #ke-talk-chooser[data-ke-talk-bloom="ready"][data-ke-talk-surface="choice"]:not(.ke-morph-closing) ~ #tab-bar > .ke-tab-karamo-connectors[data-ke-origin-ready="true"] .ke-tab-karamo-origin-tether {
  animation: keTalkOriginTetherDraw 800ms 1000ms cubic-bezier(.16, .82, .18, 1) both;
}

html.ke-rebrand-mode #ke-talk-chooser.ke-talk-reverse-close.ke-morph-closing[data-ke-talk-surface="choice"] ~ #tab-bar > .ke-tab-karamo-connectors[data-ke-origin-ready="true"] .ke-tab-karamo-origin-tether {
  animation: keTalkOriginTetherRetract 1000ms 1400ms cubic-bezier(.55, 0, .84, .18) both;
}

html.ke-rebrand-mode #ke-talk-chooser.ke-talk-reverse-close.ke-morph-closing ~ #tab-bar > .ke-talk-launcher .ke-talk-launcher-close-mark {
  animation: keTalkCloseMarkYield 250ms 2150ms ease-in both;
}

@keyframes keTalkOriginTetherDraw {
  from { opacity: 0; stroke-dashoffset: -1; }
  18% { opacity: 1; }
  to { opacity: 1; stroke-dashoffset: 0; }
}

@keyframes keTalkOriginTetherRetract {
  from { opacity: 1; stroke-dashoffset: 0; }
  82% { opacity: 1; }
  to { opacity: 0; stroke-dashoffset: -1; }
}

@keyframes keTalkCloseMarkYield {
  from { opacity: 1; transform: translateX(-50%) scale(1); }
  to { opacity: 0; transform: translateX(-50%) scale(.78); }
}

/* Keep the fixed menu and raised Karamo action above every scrolling screen. */
html.ke-rebrand-mode #tab-bar {
  isolation: isolate;
  z-index: 200;
}

/* Keep the global Karamo entry point compact and make every chooser label
   readable against its actual surface. */
html.ke-rebrand-mode .ke-talk-launcher-hint[hidden] {
  display: none !important;
}
html.ke-rebrand-mode .ke-talk-chooser-close {
  color: #3f5058 !important;
}
html.ke-rebrand-mode .ke-talk-chooser-intro {
  color: #53646b !important;
}
html.ke-rebrand-mode .ke-talk-choice-buttons > button:not(:first-child) .ke-talk-choice-icon {
  color: #6b2d46;
}
html.ke-rebrand-mode .ke-talk-choice-buttons small {
  color: #53646b;
  font-size: 11px;
  line-height: 1.35;
  opacity: 1;
}
html.ke-rebrand-mode .ke-talk-choice-buttons > button:first-child small {
  color: rgba(255, 250, 244, .78);
}
html.ke-rebrand-mode .ke-talk-ai-note {
  color: #53646b;
  font-size: 10px;
  line-height: 1.5;
}

/* Password managers and mobile autofill paint their own foreground color.
   Keep the revealed sign-in password legible on the smoked-glass field. */
html.ke-rebrand-mode .auth-password-wrap .auth-password-input {
  caret-color: #f4ebe0 !important;
  color: #f4ebe0 !important;
  -webkit-text-fill-color: #f4ebe0 !important;
}
html.ke-rebrand-mode .auth-password-wrap .auth-password-input:-webkit-autofill,
html.ke-rebrand-mode .auth-password-wrap .auth-password-input:-webkit-autofill:hover,
html.ke-rebrand-mode .auth-password-wrap .auth-password-input:-webkit-autofill:focus,
html.ke-rebrand-mode .auth-password-wrap .auth-password-input:-webkit-autofill:active,
html.ke-rebrand-mode .auth-password-wrap .auth-password-input:autofill {
  caret-color: #f4ebe0 !important;
  -webkit-text-fill-color: #f4ebe0 !important;
}

@media (max-width: 720px) {
  html.ke-rebrand-mode .ke-talk-launcher {
    bottom: calc(90px + env(safe-area-inset-bottom)) !important;
    gap: 5px;
    right: 10px !important;
  }
  html.ke-rebrand-mode .ke-talk-launcher-photo {
    height: 52px !important;
    width: 52px !important;
  }
  html.ke-rebrand-mode .ke-talk-launcher-hint {
    font-size: 10px !important;
    padding: 7px 9px;
  }
  html.ke-rebrand-mode .ke-talk-chooser-card {
    padding-bottom: max(24px, calc(16px + env(safe-area-inset-bottom))) !important;
  }
  html.ke-rebrand-mode .ke-talk-choice-buttons > button {
    min-height: 66px;
  }
}

/* Four destination tabs with Karamo as the centered, elevated action.
   My Plan remains reachable from the dashboard without occupying the menu. */
html.ke-rebrand-mode #t-plan {
  display: none !important;
}

html.ke-rebrand-mode #tab-bar {
  overflow: visible;
}

/* The Community overlay ends at the navigation rail. Lift the rail above that
   overlay so the elevated Karamo portrait remains completely visible. */
html.ke-rebrand-mode body.ke-community-open #tab-bar {
  isolation: isolate;
  z-index: 240;
}

html.ke-rebrand-mode #tab-bar > .ke-talk-launcher {
  align-self: stretch;
  animation: none !important;
  bottom: auto !important;
  filter: none;
  flex: 0 0 clamp(74px, 18vw, 84px);
  gap: 0;
  height: auto;
  inset: auto !important;
  justify-content: center;
  left: auto !important;
  min-width: 74px;
  position: relative;
  right: auto !important;
  top: auto !important;
  transform: none !important;
  z-index: 4;
}

html.ke-rebrand-mode #tab-bar > #t-dashboard { order: 1; }
html.ke-rebrand-mode #tab-bar > #t-journal { order: 2; }
html.ke-rebrand-mode #tab-bar > .ke-talk-launcher { order: 3; }
html.ke-rebrand-mode #tab-bar > #t-resources { order: 4; }
html.ke-rebrand-mode #tab-bar > #t-library { order: 5; }

html.ke-rebrand-mode #tab-bar > .ke-talk-launcher .ke-talk-launcher-photo {
  background: linear-gradient(145deg, var(--ke-gold-light), var(--ke-gold));
  border: 0 !important;
  box-shadow:
    0 0 0 4px rgba(255, 253, 249, .96),
    0 0 0 7px rgba(215, 181, 109, .7),
    0 12px 26px rgba(5, 15, 20, .42),
    inset 0 1px 0 rgba(255, 255, 255, .72) !important;
  height: 68px !important;
  left: 50%;
  position: absolute;
  top: -8px;
  transform: translateX(-50%);
  transition: transform var(--ke-duration-fast, 160ms) var(--ke-ease-emphasized, ease), box-shadow var(--ke-duration-fast, 160ms) ease;
  width: 68px !important;
}

html.ke-rebrand-mode #tab-bar > .ke-talk-launcher .ke-talk-launcher-hint {
  bottom: calc(100% + 17px);
  left: 50%;
  position: absolute;
  transform: translateX(-50%);
}

html.ke-rebrand-mode #tab-bar > .ke-talk-launcher .ke-talk-launcher-hint { display: none !important; }
html.ke-rebrand-mode #tab-bar > .ke-talk-launcher .ke-talk-launcher-label {
  bottom: 3px;
  color: rgba(244, 235, 224, .78);
  display: block;
  font-family: var(--ke-font-ui, 'DM Sans', sans-serif);
  font-size: 10px;
  font-weight: 600;
  left: 50%;
  line-height: 1;
  position: absolute;
  transform: translateX(-50%);
  white-space: nowrap;
}

html.ke-rebrand-mode #tab-bar > .ke-talk-launcher:active .ke-talk-launcher-photo {
  box-shadow:
    0 0 0 4px rgba(255, 253, 249, .96),
    0 0 0 7px rgba(215, 181, 109, .78),
    0 7px 17px rgba(5, 15, 20, .34),
    inset 0 1px 0 rgba(255, 255, 255, .72) !important;
  transform: translateX(-50%) translateY(2px) scale(.97);
}

html.ke-rebrand-mode #tab-bar > .ke-talk-launcher:focus-visible {
  border-radius: 18px;
  outline: 2px solid var(--ke-gold-300, #ecd08e);
  outline-offset: -3px;
}

@media (max-width: 420px) {
  html.ke-rebrand-mode #tab-bar > .ke-talk-launcher {
    flex-basis: 74px;
    min-width: 74px;
  }

  html.ke-rebrand-mode #tab-bar > .ke-talk-launcher .ke-talk-launcher-photo {
    height: 62px !important;
    top: -4px;
    width: 62px !important;
  }

  html.ke-rebrand-mode #tab-bar > .ke-talk-launcher .ke-talk-launcher-hint {
    bottom: calc(100% + 12px);
  }
}

/* Luminous navigation: quiet enough to support the constellation, precise
   enough to feel native, and still built on the existing five destinations. */
html.ke-rebrand-mode #tab-bar {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .025), transparent 38%),
    rgba(10, 26, 33, .985) !important;
  border-top: 1px solid rgba(215, 181, 109, .2) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .025), 0 -10px 28px rgba(4, 14, 18, .16) !important;
  min-height: calc(76px + env(safe-area-inset-bottom)) !important;
  padding: 4px 6px max(5px, env(safe-area-inset-bottom)) !important;
}
html.ke-rebrand-mode #tab-bar::before {
  background: linear-gradient(90deg, transparent 4%, rgba(215, 181, 109, .08) 23%, rgba(241, 220, 167, .42) 50%, rgba(215, 181, 109, .08) 77%, transparent 96%);
}
html.ke-rebrand-mode #tab-bar .tab-btn {
  color: rgba(244, 235, 224, .58) !important;
  min-height: 62px;
  padding: 3px 2px 2px;
}
html.ke-rebrand-mode #tab-bar .tab-btn::before {
  height: 2px;
  top: -4px;
  width: 22px;
}
html.ke-rebrand-mode #tab-bar .ke-flame-tab-icon {
  height: 39px;
  width: 40px;
}
html.ke-rebrand-mode #tab-bar .ke-flame-tab-icon::before {
  background: radial-gradient(circle, rgba(215, 181, 109, .09), transparent 68%);
  border-color: transparent;
  box-shadow: none;
  height: 36px;
  width: 36px;
}
html.ke-rebrand-mode #tab-bar .tab-btn.active .ke-flame-tab-icon::before,
html.ke-rebrand-mode #tab-bar .tab-btn[aria-current="page"] .ke-flame-tab-icon::before {
  border-color: rgba(215, 181, 109, .16);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05);
}
html.ke-rebrand-mode #tab-bar .ke-flame-tab-svg {
  filter: grayscale(.3) saturate(.44);
  height: 29px;
  opacity: .58;
  transform: none;
  width: 29px;
}
html.ke-rebrand-mode #tab-bar .tab-btn.active .ke-flame-tab-svg,
html.ke-rebrand-mode #tab-bar .tab-btn[aria-current="page"] .ke-flame-tab-svg {
  filter: saturate(.88) drop-shadow(0 0 4px rgba(215, 181, 109, .16));
  transform: none;
}
html.ke-rebrand-mode #tab-bar .ke-flame-glint,
html.ke-rebrand-mode #tab-bar .ke-flame-crackle { display: none; }
html.ke-rebrand-mode #tab-bar .tab-label {
  font-size: 10px;
  font-weight: 520;
  letter-spacing: .005em;
}

html.ke-rebrand-mode #tab-bar > .ke-talk-launcher {
  flex: 0 0 clamp(62px, 16vw, 68px);
  min-width: 62px;
}
html.ke-rebrand-mode #tab-bar > .ke-talk-launcher .ke-talk-launcher-photo {
  box-shadow:
    0 0 0 3px rgba(255, 253, 249, .94),
    0 0 0 5px rgba(215, 181, 109, .58),
    0 9px 20px rgba(5, 15, 20, .3) !important;
  height: 58px !important;
  top: -2px;
  width: 58px !important;
}
html.ke-rebrand-mode #tab-bar > .ke-talk-launcher .ke-talk-launcher-label {
  bottom: 1px;
  color: rgba(244, 235, 224, .66);
  font-size: 9px;
  font-weight: 550;
}

@media (max-width: 420px) {
  html.ke-rebrand-mode #tab-bar {
    min-height: calc(74px + env(safe-area-inset-bottom)) !important;
    padding-inline: 4px !important;
  }
  html.ke-rebrand-mode #tab-bar .tab-btn { min-height: 60px; }
  html.ke-rebrand-mode #tab-bar .ke-flame-tab-icon { height: 37px; width: 38px; }
  html.ke-rebrand-mode #tab-bar .ke-flame-tab-svg { height: 27px; width: 27px; }
  html.ke-rebrand-mode #tab-bar .tab-label { font-size: 9.5px; }
  html.ke-rebrand-mode #tab-bar > .ke-talk-launcher {
    flex-basis: 62px;
    min-width: 62px;
  }
  html.ke-rebrand-mode #tab-bar > .ke-talk-launcher .ke-talk-launcher-photo {
    height: 56px !important;
    top: -1px;
    width: 56px !important;
  }
}

/* Semantic navigation: the central Flame belongs to the dashboard, while the
   menu uses one quiet, monochrome symbol language for immediate wayfinding. */
html.ke-rebrand-mode #tab-bar .ke-flame-tab-icon {
  display: none !important;
}

html.ke-rebrand-mode #tab-bar .ke-nav-tab-icon {
  align-items: center;
  border: 1px solid transparent;
  border-radius: 50%;
  color: rgba(244, 235, 224, .72);
  display: grid;
  height: 36px;
  justify-content: center;
  margin-bottom: 1px;
  position: relative;
  transition:
    background-color var(--ke-duration-fast, 160ms) ease,
    border-color var(--ke-duration-fast, 160ms) ease,
    color var(--ke-duration-fast, 160ms) ease,
    transform var(--ke-duration-fast, 160ms) var(--ke-ease-emphasized, ease);
  width: 36px;
}

html.ke-rebrand-mode #tab-bar .ke-nav-tab-icon svg {
  fill: none;
  height: 24px;
  overflow: visible;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.65;
  vector-effect: non-scaling-stroke;
  width: 24px;
}

html.ke-rebrand-mode #tab-bar .ke-nav-tab-icon[data-ke-nav-icon="library"] path {
  fill: currentColor;
  stroke: none;
}

html.ke-rebrand-mode #tab-bar .tab-btn.active .ke-nav-tab-icon,
html.ke-rebrand-mode #tab-bar .tab-btn[aria-current="page"] .ke-nav-tab-icon {
  background: rgba(215, 181, 109, .1);
  border-color: rgba(239, 213, 141, .22);
  color: #efd58d;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05);
}

html.ke-rebrand-mode #tab-bar .tab-btn:active .ke-nav-tab-icon {
  transform: scale(.94);
}

html.ke-rebrand-mode #tab-bar .tab-btn:focus-visible .ke-nav-tab-icon {
  box-shadow: 0 0 0 3px rgba(239, 213, 141, .14);
}

html.ke-rebrand-mode #tab-bar > .ke-talk-launcher {
  flex: 0 0 clamp(68px, 17vw, 74px);
  min-width: 68px;
}

html.ke-rebrand-mode #tab-bar > .ke-talk-launcher .ke-talk-launcher-photo {
  height: 66px !important;
  top: 1px;
  width: 66px !important;
}

html.ke-rebrand-mode #tab-bar > .ke-talk-launcher .ke-talk-launcher-photo > i {
  display: none;
}

html.ke-rebrand-mode #tab-bar > .ke-talk-launcher .ke-talk-launcher-phone-badge {
  align-items: center;
  background: linear-gradient(145deg, #7a3148, #572035);
  border: 2px solid #fffdf9;
  border-radius: 50%;
  bottom: -2px;
  box-shadow: 0 0 0 2px rgba(215, 181, 109, .82), 0 5px 12px rgba(5, 15, 20, .3);
  color: #f3d990;
  display: flex;
  height: 23px;
  justify-content: center;
  position: absolute;
  right: -4px;
  width: 23px;
  z-index: 3;
}

html.ke-rebrand-mode #tab-bar > .ke-talk-launcher .ke-talk-launcher-phone-badge svg {
  fill: currentColor;
  height: 12px;
  width: 12px;
}

html.ke-rebrand-mode #tab-bar > .ke-talk-launcher .ke-talk-launcher-label {
  display: none !important;
}

@media (max-width: 420px) {
  html.ke-rebrand-mode #tab-bar > .ke-talk-launcher {
    flex-basis: 68px;
    min-width: 68px;
  }

  html.ke-rebrand-mode #tab-bar > .ke-talk-launcher .ke-talk-launcher-photo {
    height: 64px !important;
    top: 1px;
    width: 64px !important;
  }

  html.ke-rebrand-mode #tab-bar .ke-nav-tab-icon {
    height: 35px;
    width: 35px;
  }

  html.ke-rebrand-mode #tab-bar .ke-nav-tab-icon svg {
    height: 23px;
    width: 23px;
  }
}

/* Karamo signature navigation: each destination is a small sculpted crest,
   using the same navy, champagne and burgundy language as the Flame without
   competing with it. The portrait rises slightly above the navigation rail. */
html.ke-rebrand-mode #tab-bar .ke-nav-tab-icon {
  background:
    radial-gradient(circle at 30% 20%, rgba(255, 255, 255, .11), transparent 28%),
    linear-gradient(145deg, rgba(36, 57, 65, .96), rgba(10, 25, 32, .98));
  border-color: rgba(215, 181, 109, .42);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .09),
    inset 0 -5px 10px rgba(0, 0, 0, .16),
    0 4px 10px rgba(2, 10, 14, .24),
    0 0 0 1px rgba(109, 51, 70, .12);
  color: rgba(244, 235, 224, .82);
  height: 38px;
  isolation: isolate;
  overflow: hidden;
  width: 38px;
}

html.ke-rebrand-mode #tab-bar .ke-nav-tab-icon::before {
  background: linear-gradient(115deg, transparent 24%, rgba(239, 213, 141, .2) 47%, transparent 67%);
  content: '';
  inset: 1px;
  opacity: .54;
  pointer-events: none;
  position: absolute;
  transform: translateX(-48%);
  z-index: -1;
}

html.ke-rebrand-mode #tab-bar .ke-nav-tab-icon svg {
  filter: drop-shadow(0 1px 0 rgba(0, 0, 0, .3));
  height: 22px;
  stroke-width: 1.85;
  width: 22px;
}

html.ke-rebrand-mode #tab-bar .tab-btn.active .ke-nav-tab-icon,
html.ke-rebrand-mode #tab-bar .tab-btn[aria-current="page"] .ke-nav-tab-icon {
  background:
    radial-gradient(circle at 31% 20%, rgba(255, 255, 255, .14), transparent 28%),
    linear-gradient(145deg, #79364d, #542033 72%);
  border-color: rgba(239, 213, 141, .82);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .14),
    inset 0 -6px 12px rgba(35, 7, 17, .22),
    0 5px 13px rgba(2, 10, 14, .3),
    0 0 12px rgba(215, 181, 109, .16);
  color: #f1dca7;
}

html.ke-rebrand-mode #tab-bar > .ke-talk-launcher .ke-talk-launcher-photo {
  box-shadow:
    0 0 0 3px rgba(255, 253, 249, .98),
    0 0 0 6px rgba(215, 181, 109, .7),
    0 12px 24px rgba(5, 15, 20, .38),
    0 0 18px rgba(215, 181, 109, .18) !important;
  height: 68px !important;
  top: -16px;
  width: 68px !important;
}

html.ke-rebrand-mode #tab-bar > .ke-talk-launcher .ke-talk-launcher-phone-badge {
  bottom: -3px;
  right: -5px;
}

@media (max-width: 420px) {
  html.ke-rebrand-mode #tab-bar .ke-nav-tab-icon {
    height: 37px;
    width: 37px;
  }

  html.ke-rebrand-mode #tab-bar .ke-nav-tab-icon svg {
    height: 21px;
    width: 21px;
  }

  html.ke-rebrand-mode #tab-bar > .ke-talk-launcher .ke-talk-launcher-photo {
    height: 68px !important;
    top: -16px;
    width: 68px !important;
  }
}
