/* Journal V3: prompt-first writing, page-deck history, and shared Kē surfaces. */
html.ke-rebrand-mode #scr-journal {
  --ke-journal-page-stage-tail: clamp(21px, 3.5vw, 39px);
  --kj-navy: var(--ke-midnight, var(--ke-navy-900, #10242d));
  --kj-navy-soft: var(--ke-midnight-raised, var(--ke-navy-800, #1a303a));
  --kj-burgundy: var(--ke-jewel-burgundy, var(--ke-burgundy, #682d43));
  --kj-gold: var(--ke-jewel-gold, var(--ke-gold, #d7b56d));
  --kj-gold-light: var(--ke-jewel-gold-light, var(--ke-gold-highlight, #f1dca7));
  --kj-cream: var(--ke-porcelain-muted, var(--ke-canvas, #f4ebe0));
  --kj-paper: var(--ke-porcelain, var(--ke-paper, #fffcf6));
  --kj-ink: var(--ke-navy-900, #1a2830);
  --kj-muted: #66757b;
  --kj-line: var(--ke-dark-line, rgba(215, 181, 109, .22));
  --kj-faceted-gold-rim: conic-gradient(
    from 0deg,
    #ffe9a0 0 16.666%,
    #c28c35 16.666% 33.333%,
    #79501a 33.333% 50%,
    #9f7127 50% 66.666%,
    #f0ce78 66.666% 83.333%,
    #fff0ad 83.333% 100%
  );
  --kj-karamo-teal: #106e78;
  --kj-karamo-teal-deep: #072e35;
  background:
    radial-gradient(circle at 50% 8%, rgba(104, 45, 67, .3), transparent 30rem),
    linear-gradient(180deg, var(--kj-navy), var(--ke-midnight-deep, #09191f)) !important;
  color: var(--ke-porcelain, #fffcf6) !important;
  font-family: var(--ke-font-ui, "DM Sans", sans-serif);
}

/* Hex-and-circle Journal system. The horizontal deck still flips page by
   page, but each saved page is now contained by the same round jewel used by
   the Keepers. The composer exposes only its writing circle and paper. */
html.ke-rebrand-mode #scr-journal .ke-journal-home-tabs button::before {
  clip-path: polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%) !important;
}

html.ke-rebrand-mode #scr-journal .ke-journal-row {
  align-items: stretch;
  aspect-ratio: 1 !important;
  border: 4px solid #d7b56d !important;
  border-radius: 50% !important;
  flex-basis: clamp(300px,42vw,370px) !important;
  justify-content: center;
  min-height: 0 !important;
  overflow: hidden auto;
  padding: clamp(48px,8vw,68px) !important;
  scrollbar-color: rgba(104,45,67,.4) transparent;
}

html.ke-rebrand-mode #scr-journal .ke-journal-row + .ke-journal-row {
  margin-inline-start: -22px;
}

html.ke-rebrand-mode #scr-journal .ke-journal-editor-card {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding-inline: 0 !important;
}

html.ke-rebrand-mode #scr-journal .ke-journal-editor-card::before {
  display: none !important;
}

html.ke-rebrand-mode #scr-journal .ke-journal-page-stage {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding-inline: 0 !important;
}

@media (max-width: 600px) {
  html.ke-rebrand-mode #scr-journal .ke-journal-row {
    flex-basis: min(86vw,350px) !important;
    padding: 50px 42px !important;
  }
}

/* Flame-led, growing journal page ---------------------------------------
   The angled caps stay fixed while the vertical sides grow with the entry.
   A Delphi reflection lives inside the same page, below the Keeper's words. */
html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) .ke-journal-guided-context {
  align-items: center;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  display: flex;
  justify-content: center;
  margin: 0 auto 24px;
  overflow: visible;
  padding: 0;
}

html.ke-rebrand-mode #scr-journal .ke-journal-flame-hex {
  aspect-ratio: .866;
  background: linear-gradient(145deg, #fff1b8 0%, #c28631 35%, #f5d27d 64%, #81551b 100%);
  clip-path: polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);
  filter: drop-shadow(0 18px 22px rgba(0,0,0,.35)) drop-shadow(0 0 18px rgba(215,181,109,.2));
  padding: 4px;
  width: clamp(224px, 42vw, 286px);
}

html.ke-rebrand-mode #scr-journal .ke-journal-flame-hex-inner {
  align-items: center;
  background:
    radial-gradient(circle at 50% 35%, rgba(215,181,109,.2), transparent 38%),
    linear-gradient(155deg, #17313e, #081a22 72%);
  clip-path: inherit;
  color: var(--kj-paper);
  display: flex;
  flex-direction: column;
  height: 100%;
  justify-content: center;
  padding: 34px 30px 30px;
  text-align: center;
  width: 100%;
}

html.ke-rebrand-mode #scr-journal .ke-journal-flame-picture,
html.ke-rebrand-mode #scr-journal .ke-journal-flame-picture img {
  display: block;
  height: 120px;
  object-fit: cover;
  width: 88px;
}

html.ke-rebrand-mode #scr-journal .ke-journal-flame-picture {
  margin: -8px auto 5px;
}

html.ke-rebrand-mode #scr-journal .ke-journal-flame-hex .ke-journal-kicker {
  color: var(--kj-gold-light);
  font-size: 10px;
  letter-spacing: .16em;
}

html.ke-rebrand-mode #scr-journal .ke-journal-flame-hex .ke-journal-guided-arrival {
  background: transparent;
  border: 0;
  border-radius: 0;
  display: flex;
  gap: 4px;
  margin: 4px 0 0;
  min-height: 0;
  padding: 0;
}

html.ke-rebrand-mode #scr-journal .ke-journal-flame-hex .ke-journal-guided-arrival span {
  color: rgba(255,250,240,.7);
  font-size: 10px;
  letter-spacing: .08em;
  text-transform: uppercase;
}

html.ke-rebrand-mode #scr-journal .ke-journal-flame-hex .ke-journal-guided-arrival strong {
  color: #fff8e8;
  font: 600 18px/1.1 var(--ke-font-display, "Playfair Display", serif);
}

html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) .ke-journal-prompt {
  background: linear-gradient(145deg, rgba(34,34,47,.96), rgba(14,34,43,.96));
  border-color: rgba(104,45,67,.7);
  border-left-color: #a33d60;
  margin: 0 auto 18px;
  max-width: 620px;
  width: 100%;
}

html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) .ke-journal-prompt .ke-journal-kicker {
  color: var(--kj-gold-light);
}

html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) .ke-journal-prompt p {
  color: #fffaf0 !important;
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
}

html.ke-rebrand-mode #scr-journal .ke-journal-writing-timer:not([hidden]) {
  color: var(--kj-gold-light) !important;
  display: block;
  flex: 0 0 auto;
  font: 700 12px/1.2 var(--ke-font-display, "Playfair Display", serif);
  letter-spacing: .1em;
  margin: 0 0 12px 10px;
  position: relative;
  text-transform: uppercase;
  z-index: 2;
}

html.ke-rebrand-mode #scr-journal .ke-journal-writing-timer[hidden] {
  display: none !important;
}

html.ke-rebrand-mode #scr-journal .ke-journal-writing-timer strong {
  color: inherit !important;
  font: inherit;
  letter-spacing: inherit;
}

html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) .ke-journal-title-field {
  margin: 24px auto 0;
  max-width: 650px;
  width: 100%;
}

html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) .ke-journal-title-field > span {
  color: #c9708f;
}

html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) .ke-journal-title-field input {
  color: #fffaf0 !important;
  opacity: 1;
}

html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) #ke-journal-form .ke-journal-body-field {
  --ke-journal-hex-cap: clamp(82px, 13vw, 112px);
  align-items: stretch !important;
  aspect-ratio: auto !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  box-sizing: border-box;
  display: flex !important;
  flex-direction: column;
  isolation: isolate;
  margin: 28px auto 0 !important;
  min-height: 610px !important;
  overflow: visible !important;
  padding: calc(var(--ke-journal-hex-cap) + 22px) clamp(38px, 7vw, 62px) !important;
  position: relative;
  transition: min-height .24s ease;
  width: min(100%, 650px) !important;
}

html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) #ke-journal-form .ke-journal-body-field::before,
html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) #ke-journal-form .ke-journal-body-field::after {
  clip-path: polygon(50% 0,100% var(--ke-journal-hex-cap),100% calc(100% - var(--ke-journal-hex-cap)),50% 100%,0 calc(100% - var(--ke-journal-hex-cap)),0 var(--ke-journal-hex-cap));
  content: "";
  inset: 0;
  pointer-events: none;
  position: absolute;
}

html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) #ke-journal-form .ke-journal-body-field::before {
  background: var(--kj-faceted-gold-rim);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.18), inset -9px -11px 18px rgba(70,39,8,.23);
  filter: drop-shadow(0 26px 34px rgba(0,0,0,.38)) drop-shadow(0 0 22px rgba(215,181,109,.18));
  z-index: -2;
}

html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) #ke-journal-form .ke-journal-body-field::after {
  background:
    radial-gradient(circle at 32% 13%, rgba(255,255,255,.1), transparent 22%),
    radial-gradient(circle at 50% 45%, #79364e 0%, #542238 55%, #260d1a 100%);
  inset: 4px;
  z-index: -1;
}

html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) #ke-journal-form .ke-journal-body-field:focus-within {
  outline: none !important;
}

html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) #ke-journal-form .ke-journal-body-field:focus-within::before {
  filter: drop-shadow(0 26px 34px rgba(0,0,0,.38)) drop-shadow(0 0 30px rgba(241,220,167,.42));
}

html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) #ke-journal-form #ke-journal-body-input,
html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) #ke-journal-form .ke-journal-body-field:focus-within #ke-journal-body-input,
html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) #ke-journal-form .ke-journal-body-field:has(textarea:not(:placeholder-shown)) #ke-journal-body-input {
  align-self: stretch;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0;
  color: #fffaf0 !important;
  font: 500 clamp(20px, 2.5vw, 23px)/1.65 var(--ke-font-reflective, "Cormorant Garamond", serif);
  height: 320px;
  max-height: none !important;
  min-height: 320px !important;
  overflow: hidden !important;
  padding: 8px 10px !important;
  resize: none;
  text-align: left;
  width: 100%;
  z-index: 1;
}

html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) #ke-journal-form #ke-journal-body-input::placeholder,
html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) #ke-journal-form #ke-journal-body-input:placeholder-shown:not(:focus) {
  color: rgba(255,250,240,.72);
  padding-block-start: 90px !important;
  text-align: center;
}

html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) #ke-journal-form #ke-journal-body-input:focus-visible {
  outline: 2px solid rgba(255,240,182,.9) !important;
  outline-offset: 7px;
}

html.ke-rebrand-mode #scr-journal .ke-journal-body-field > :is(.ke-journal-inline-reflection, .ke-journal-added-reflections) {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: #fffaf0;
  display: block;
  margin: 16px 0 0 !important;
  overflow: visible;
  padding: 0 10px 8px !important;
  position: relative;
  z-index: 1;
}

html.ke-rebrand-mode #scr-journal .ke-journal-body-field > :is(.ke-journal-inline-reflection, .ke-journal-added-reflections) h3,
html.ke-rebrand-mode #scr-journal .ke-journal-body-field > :is(.ke-journal-inline-reflection, .ke-journal-added-reflections) p {
  color: #fffaf0 !important;
}

html.ke-rebrand-mode #scr-journal .ke-journal-body-field > :is(.ke-journal-inline-reflection, .ke-journal-added-reflections) h3 {
  font: 600 clamp(22px, 3.5vw, 29px)/1.2 var(--ke-font-display, "Playfair Display", serif);
  margin: 0 0 10px;
}

html.ke-rebrand-mode #scr-journal .ke-journal-karamo-heading {
  align-items: center;
  display: flex;
  gap: clamp(8px, 2vw, 13px);
}

html.ke-rebrand-mode #scr-journal .ke-journal-karamo-flame {
  align-items: center;
  display: inline-flex;
  flex: 0 0 auto;
  height: clamp(38px, 7vw, 48px);
  justify-content: center;
  margin-block: -8px -5px;
  width: clamp(32px, 6vw, 42px);
}

html.ke-rebrand-mode #scr-journal .ke-journal-karamo-flame-video {
  filter: drop-shadow(0 0 8px rgba(255, 208, 99, .42));
  height: 100%;
  object-fit: contain;
  width: 100%;
}

html.ke-rebrand-mode #scr-journal .ke-journal-body-field > :is(.ke-journal-inline-reflection, .ke-journal-added-reflections) p {
  font: 500 clamp(20px, 2.5vw, 23px)/1.65 var(--ke-font-reflective, "Cormorant Garamond", serif);
  margin: 0;
  white-space: pre-line;
}

html.ke-rebrand-mode #scr-journal .ke-journal-body-field > .ke-journal-added-reflections .ke-journal-added-reflection {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  margin: 0;
  padding: 0 !important;
}

html.ke-rebrand-mode #scr-journal .ke-journal-body-field > .ke-journal-inline-reflection::before,
html.ke-rebrand-mode #scr-journal .ke-journal-body-field > .ke-journal-inline-reflection::after,
html.ke-rebrand-mode #scr-journal .ke-journal-body-field > .ke-journal-added-reflections .ke-journal-added-reflection::before,
html.ke-rebrand-mode #scr-journal .ke-journal-body-field > .ke-journal-added-reflections .ke-journal-added-reflection::after {
  background: linear-gradient(90deg, transparent, rgba(255, 240, 182, .82) 12%, var(--kj-gold-light) 50%, rgba(255, 240, 182, .82) 88%, transparent);
  box-shadow: 0 0 9px rgba(215, 181, 109, .34);
  content: "";
  display: block !important;
  height: 2px;
  inset: auto;
  position: static;
  width: min(84%, 420px);
}

html.ke-rebrand-mode #scr-journal .ke-journal-body-field > .ke-journal-inline-reflection::before,
html.ke-rebrand-mode #scr-journal .ke-journal-body-field > .ke-journal-added-reflections .ke-journal-added-reflection::before {
  margin: 0 auto clamp(20px, 4vw, 28px);
}

html.ke-rebrand-mode #scr-journal .ke-journal-body-field > .ke-journal-inline-reflection::after,
html.ke-rebrand-mode #scr-journal .ke-journal-body-field > .ke-journal-added-reflections .ke-journal-added-reflection::after {
  margin: clamp(22px, 4vw, 30px) auto 0;
}

html.ke-rebrand-mode #scr-journal .ke-journal-body-field > .ke-journal-added-reflections .ke-journal-added-reflection > p {
  font: 500 clamp(20px, 2.5vw, 23px)/1.65 var(--ke-font-reflective, "Cormorant Garamond", serif);
  margin: 0 !important;
}

html.ke-rebrand-mode #scr-journal .ke-journal-body-field > .ke-journal-added-reflections .ke-journal-added-reflection + .ke-journal-added-reflection {
  margin-top: 24px;
}

html.ke-rebrand-mode #scr-journal .ke-journal-body-field > .ke-journal-added-reflections .ke-journal-continuation-block {
  color: #fffaf0;
  font: 500 clamp(20px, 2.5vw, 23px)/1.65 var(--ke-font-reflective, "Cormorant Garamond", serif);
  margin: 24px 0;
  white-space: pre-line;
}

html.ke-rebrand-mode #scr-journal .ke-journal-continuation {
  display: block;
  margin: 24px 10px 8px;
  position: relative;
  z-index: 1;
}

html.ke-rebrand-mode #scr-journal .ke-journal-continuation[hidden] {
  display: none !important;
}

html.ke-rebrand-mode #scr-journal #ke-journal-continuation-input {
  background: rgba(9, 25, 31, .26) !important;
  border: 1px solid rgba(255, 240, 182, .58) !important;
  border-radius: 14px;
  color: #fffaf0 !important;
  font: 500 clamp(20px, 2.5vw, 23px)/1.55 var(--ke-font-reflective, "Cormorant Garamond", serif);
  height: 128px;
  max-height: none !important;
  min-height: 128px !important;
  overflow: hidden !important;
  padding: 18px !important;
  resize: none;
  width: 100%;
}

html.ke-rebrand-mode #scr-journal #ke-journal-continuation-input::placeholder {
  color: rgba(255, 250, 240, .7);
}

html.ke-rebrand-mode #scr-journal #ke-journal-continuation-input:focus-visible {
  outline: 2px solid rgba(255, 240, 182, .92) !important;
  outline-offset: 4px;
}

html.ke-rebrand-mode #scr-journal .ke-journal-thoughts-button {
  align-items: center;
  aspect-ratio: 1;
  background:
    radial-gradient(circle at 38% 25%, rgba(255,255,255,.035), transparent 29%) padding-box,
    radial-gradient(circle at 50% 42%, var(--kj-karamo-teal) 0 27%, var(--kj-karamo-teal-deep) 72%, #010303 100%) padding-box,
    var(--kj-faceted-gold-rim) border-box;
  border: 4px solid transparent;
  border-radius: 50%;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.15), inset -9px -11px 18px rgba(0,0,0,.18), 0 18px 34px rgba(0,0,0,.35), 0 0 26px rgba(215,181,109,.2);
  color: #fffaf0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin: 72px auto 0;
  padding: 28px;
  position: relative;
  text-align: center;
  width: 190px;
}

html.ke-rebrand-mode #scr-journal .ke-journal-thoughts-connector {
  background: linear-gradient(var(--kj-gold-light), var(--kj-gold));
  height: 76px;
  left: 50%;
  pointer-events: none;
  position: absolute;
  top: 100%;
  transform: translateX(-50%);
  width: 3px;
  z-index: 0;
}

html.ke-rebrand-mode #scr-journal .ke-journal-thoughts-button::before,
html.ke-rebrand-mode #scr-journal .ke-journal-thoughts-button::after {
  border-radius: inherit;
  content: "";
  inset: -11px;
  opacity: 0;
  pointer-events: none;
  position: absolute;
}

html.ke-rebrand-mode #scr-journal .ke-journal-thoughts-button::before {
  background: conic-gradient(from 0turn, transparent 0 54%, rgba(255, 228, 145, .22) 64%, #fff8d2 75%, #d7b56d 84%, transparent 96%);
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 7px), #000 calc(100% - 6px));
  mask: radial-gradient(farthest-side, transparent calc(100% - 7px), #000 calc(100% - 6px));
  transform: rotate(0turn);
}

html.ke-rebrand-mode #scr-journal .ke-journal-thoughts-button::after {
  border: 5px solid #fff0b6;
  box-shadow: 0 0 8px rgba(255, 240, 182, .95), 0 0 30px rgba(215, 181, 109, .9), inset 0 0 18px rgba(255, 240, 182, .24);
  transform: scale(.96);
}

html.ke-rebrand-mode #scr-journal .ke-journal-thoughts-button strong {
  font: 600 22px/1.08 var(--ke-font-display, "Playfair Display", serif);
}

html.ke-rebrand-mode #scr-journal .ke-journal-thoughts-button span {
  font-size: 10px;
  line-height: 1.25;
  margin-top: 10px;
  max-width: 128px;
  opacity: .76;
}

html.ke-rebrand-mode #scr-journal .ke-journal-thoughts-button[aria-busy="true"] {
  box-shadow: inset 0 0 0 3px rgba(8,22,28,.52), 0 0 0 8px rgba(215,181,109,.15), 0 18px 34px rgba(0,0,0,.35);
}

html.ke-rebrand-mode #scr-journal .ke-journal-thoughts-button[aria-busy="true"]::before {
  animation: keJournalThoughtsShimmer 1.15s linear infinite;
  opacity: 1;
}

html.ke-rebrand-mode #scr-journal .ke-journal-thoughts-button.is-ready::after {
  animation: keJournalThoughtsReadyFlash 620ms ease-out both;
}

html.ke-rebrand-mode #scr-journal :is(#ke-journal-inline-reflection-text, .ke-journal-added-reflection > p).is-typing::after {
  animation: keJournalThoughtsCaret 680ms step-end infinite;
  border-right: 2px solid #fff0b6;
  content: "";
  margin-left: 3px;
}

@keyframes keJournalThoughtsShimmer {
  to { transform: rotate(1turn); }
}

@keyframes keJournalThoughtsReadyFlash {
  0% { opacity: 0; transform: scale(.95); }
  24%, 66% { opacity: 1; transform: scale(1.035); }
  100% { opacity: 0; transform: scale(1.08); }
}

@keyframes keJournalThoughtsCaret {
  0%, 48% { opacity: 1; }
  49%, 100% { opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
  html.ke-rebrand-mode #scr-journal .ke-journal-thoughts-button[aria-busy="true"]::before {
    animation: none;
    opacity: .88;
  }

  html.ke-rebrand-mode #scr-journal .ke-journal-thoughts-button.is-ready::after {
    animation: none;
    opacity: 1;
    transform: none;
  }

  html.ke-rebrand-mode #scr-journal :is(#ke-journal-inline-reflection-text, .ke-journal-added-reflection > p).is-typing::after {
    animation: none;
    opacity: 1;
  }
}

html.ke-rebrand-mode #scr-journal .ke-journal-thoughts-button:focus-visible {
  outline: 3px solid #fff0b6 !important;
  outline-offset: 7px;
}

@media (max-width: 720px) {
  html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) #ke-journal-form .ke-journal-body-field,
  html.ke-rebrand-mode.ke-journal-writing.ke-journal-keyboard-open #scr-journal #ke-journal-form .ke-journal-body-field,
  html.ke-rebrand-mode.ke-journal-writing.ke-journal-keyboard-open #scr-journal #ke-journal-form .ke-journal-body-field:focus-within,
  html.ke-rebrand-mode.ke-journal-writing.ke-journal-keyboard-open #scr-journal #ke-journal-form .ke-journal-body-field:has(textarea:not(:placeholder-shown)) {
    --ke-journal-hex-cap: clamp(68px, 23vw, 94px);
    margin-top: 20px !important;
    min-height: 520px !important;
    padding: calc(var(--ke-journal-hex-cap) + 18px) 32px !important;
    width: 100% !important;
  }

  html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) #ke-journal-form #ke-journal-body-input,
  html.ke-rebrand-mode.ke-journal-writing.ke-journal-keyboard-open #scr-journal #ke-journal-form #ke-journal-body-input,
  html.ke-rebrand-mode.ke-journal-writing.ke-journal-keyboard-open #scr-journal #ke-journal-form .ke-journal-body-field:focus-within #ke-journal-body-input,
  html.ke-rebrand-mode.ke-journal-writing.ke-journal-keyboard-open #scr-journal #ke-journal-form .ke-journal-body-field:has(textarea:not(:placeholder-shown)) #ke-journal-body-input {
    height: 250px;
    max-height: none !important;
    min-height: 250px !important;
    overflow: hidden !important;
  }

  html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) #ke-journal-form #ke-journal-body-input::placeholder,
  html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) #ke-journal-form #ke-journal-body-input:placeholder-shown:not(:focus) {
    padding-block-start: 64px !important;
  }

  html.ke-rebrand-mode #scr-journal .ke-journal-thoughts-button {
    margin-top: 62px;
    width: 168px;
  }

  html.ke-rebrand-mode #scr-journal .ke-journal-thoughts-connector {
    height: 66px;
  }
}

html.ke-rebrand-mode #scr-journal .ke-journal-header {
  background: rgba(9, 25, 31, .92) !important;
  border-bottom: 1px solid var(--kj-line) !important;
  min-height: 84px;
  padding-block: 14px;
}

html.ke-rebrand-mode #scr-journal .ke-journal-header-copy h1,
html.ke-rebrand-mode #scr-journal .ke-journal-header-subtitle {
  color: var(--kj-paper) !important;
}

html.ke-rebrand-mode #scr-journal .ke-journal-brand > span:last-child {
  font-size: 11px;
}

html.ke-rebrand-mode #scr-journal .ke-journal-header-subtitle {
  display: block;
  font: italic 16px/1.35 var(--ke-font-reflective, "Cormorant Garamond", serif);
  margin-top: 3px;
  opacity: .72;
}

html.ke-rebrand-mode #scr-journal .ke-journal-header-action {
  align-items: center;
  border-color: var(--kj-gold);
  display: inline-flex;
  gap: 7px;
  justify-content: center;
  font-size: 12px;
  min-height: var(--ke-control-min, 44px);
  padding-inline: 18px;
}

html.ke-rebrand-mode #scr-journal .ke-journal-main {
  max-width: 1080px;
  padding-bottom: max(112px, calc(88px + env(safe-area-inset-bottom)));
}

html.ke-rebrand-mode #scr-journal .ke-journal-kicker {
  color: var(--kj-gold-light);
  font-size: var(--ke-font-size-label, 12px);
  letter-spacing: var(--ke-tracking-label, .08em);
}

html.ke-rebrand-mode #scr-journal .ke-journal-draft-card {
  background: linear-gradient(145deg, rgba(104, 45, 67, .94), rgba(55, 23, 37, .96));
  border-color: rgba(241, 220, 167, .48);
  box-shadow: var(--ke-dark-shadow, 0 28px 80px rgba(3, 12, 16, .48));
  margin-bottom: 20px;
}

html.ke-rebrand-mode #scr-journal .ke-journal-collection-manager {
  background: rgba(255, 252, 246, .045);
  border: 1px solid var(--kj-line);
  border-radius: var(--ke-radius-card, 16px);
  margin-bottom: 22px;
  overflow: hidden;
}

html.ke-rebrand-mode #scr-journal .ke-journal-collection-manager > summary {
  align-items: center;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  list-style: none;
  min-height: 62px;
  padding: 12px 17px;
}

html.ke-rebrand-mode #scr-journal .ke-journal-collection-manager > summary::-webkit-details-marker {
  display: none;
}

html.ke-rebrand-mode #scr-journal .ke-journal-collection-manager > summary strong {
  color: var(--kj-paper);
  display: block;
  font-size: 14px;
  margin-top: 3px;
}

html.ke-rebrand-mode #scr-journal .ke-journal-manager-chevron {
  color: var(--kj-gold-light);
  font-size: 18px;
  transition: transform var(--ke-duration-base, 240ms) var(--ke-ease-standard, ease);
}

html.ke-rebrand-mode #scr-journal .ke-journal-collection-manager[open] .ke-journal-manager-chevron {
  transform: rotate(180deg);
}

html.ke-rebrand-mode #scr-journal .ke-journal-shelf-section {
  border-top: 1px solid var(--kj-line);
  margin: 0;
  padding: 20px 17px 18px;
}

html.ke-rebrand-mode #scr-journal .ke-journal-shelf-heading h2 {
  color: var(--kj-paper) !important;
}

html.ke-rebrand-mode #scr-journal .ke-journal-home-tabs {
  background: rgba(255, 252, 246, .055);
  border: 1px solid var(--kj-line);
  border-radius: var(--ke-radius-pill, 999px);
  display: grid;
  gap: 4px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0 auto 34px;
  max-width: 430px;
  padding: 4px;
}

html.ke-rebrand-mode #scr-journal .ke-journal-home-tabs button {
  background: transparent !important;
  border: 0 !important;
  border-radius: var(--ke-radius-pill, 999px) !important;
  color: rgba(255, 252, 246, .66) !important;
  font-size: 13px !important;
  min-height: var(--ke-control-min, 44px) !important;
  padding: 10px 16px !important;
}

html.ke-rebrand-mode #scr-journal .ke-journal-home-tabs button::before {
  display: none !important;
}

html.ke-rebrand-mode #scr-journal .ke-journal-home-tabs button.is-active {
  background: var(--kj-burgundy) !important;
  box-shadow: inset 0 0 0 1px rgba(241, 220, 167, .44), 0 8px 20px rgba(0, 0, 0, .2);
  color: #fff !important;
}

html.ke-rebrand-mode #scr-journal .ke-journal-archive {
  margin-top: 0;
}

html.ke-rebrand-mode #scr-journal .ke-journal-section-heading {
  align-items: end;
  margin-bottom: 8px;
}

html.ke-rebrand-mode #scr-journal .ke-journal-section-heading h2,
html.ke-rebrand-mode #scr-journal .ke-journal-panel-heading h2 {
  color: var(--kj-paper) !important;
  font-family: var(--ke-font-display, "Playfair Display", serif);
}

html.ke-rebrand-mode #scr-journal #ke-journal-page-summary,
html.ke-rebrand-mode #scr-journal .ke-journal-panel-heading p,
html.ke-rebrand-mode #scr-journal .ke-journal-deck-hint {
  color: rgba(255, 252, 246, .62) !important;
}

html.ke-rebrand-mode #scr-journal .ke-journal-deck-hint {
  font-size: 13px;
  line-height: 1.45;
  margin: 0 0 15px;
}

html.ke-rebrand-mode #scr-journal .ke-journal-tool-button,
html.ke-rebrand-mode #scr-journal .ke-journal-filters button {
  background: rgba(255, 252, 246, .06);
  border-color: var(--kj-line);
  color: var(--kj-gold-light);
  font-size: 12px;
  min-height: var(--ke-control-min, 44px);
}

html.ke-rebrand-mode #scr-journal .ke-journal-filters button.is-active {
  background: var(--kj-paper);
  color: var(--kj-burgundy);
}

html.ke-rebrand-mode #scr-journal .ke-journal-search-panel {
  background: transparent;
}

html.ke-rebrand-mode #scr-journal .ke-journal-search {
  background: var(--kj-paper);
  max-width: 100%;
}

html.ke-rebrand-mode #scr-journal .ke-journal-list {
  align-items: stretch;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  display: flex;
  gap: 0;
  margin-inline: -4px;
  overflow-x: auto;
  overflow-y: visible;
  padding: 14px 36px 30px 4px;
  scroll-padding-inline: 4px 36px;
  scroll-snap-type: inline mandatory;
  scrollbar-color: var(--kj-gold) rgba(255, 252, 246, .08);
  scrollbar-width: thin;
}

html.ke-rebrand-mode #scr-journal .ke-journal-list::before {
  display: none !important;
}

html.ke-rebrand-mode #scr-journal .ke-journal-month-label {
  display: none;
}

html.ke-rebrand-mode #scr-journal .ke-journal-row {
  align-items: flex-start;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .72), transparent 36%),
    var(--kj-paper) !important;
  border: 1px solid rgba(215, 181, 109, .7) !important;
  border-radius: 54px 54px 30px 30px !important;
  box-shadow: 0 22px 48px rgba(0, 0, 0, .32), inset 0 1px 0 #fff;
  color: var(--kj-ink) !important;
  display: flex !important;
  flex: 0 0 clamp(280px, 39vw, 360px);
  flex-direction: column;
  gap: 18px;
  justify-content: flex-start;
  min-height: 320px;
  padding: 26px 25px 23px !important;
  position: relative;
  scroll-snap-align: start;
  transition: box-shadow var(--ke-duration-base, 240ms) ease, transform var(--ke-duration-base, 240ms) var(--ke-ease-emphasized, ease);
  width: auto !important;
}

html.ke-rebrand-mode #scr-journal .ke-journal-row + .ke-journal-row {
  border-top: 1px solid rgba(215, 181, 109, .7) !important;
  margin-inline-start: -18px;
}

html.ke-rebrand-mode #scr-journal .ke-journal-row:hover,
html.ke-rebrand-mode #scr-journal .ke-journal-row:focus-visible {
  box-shadow: 0 28px 64px rgba(0, 0, 0, .42), 0 0 0 2px var(--kj-gold-light);
  transform: translateY(-7px) rotate(-.35deg);
  z-index: 2;
}

html.ke-rebrand-mode #scr-journal .ke-journal-row-date {
  align-items: baseline;
  color: var(--kj-burgundy);
  display: flex;
  gap: 7px;
}

html.ke-rebrand-mode #scr-journal .ke-journal-row-date strong {
  font: 600 36px/1 var(--ke-font-display, "Playfair Display", serif);
}

html.ke-rebrand-mode #scr-journal .ke-journal-row-copy {
  display: flex;
  flex: 1;
  flex-direction: column;
  min-width: 0;
}

html.ke-rebrand-mode #scr-journal .ke-journal-row-title {
  color: var(--kj-ink);
  font: 600 clamp(23px, 3vw, 30px)/1.1 var(--ke-font-display, "Playfair Display", serif);
  margin-bottom: 12px;
}

html.ke-rebrand-mode #scr-journal .ke-journal-row-copy small {
  color: #53636a;
  display: -webkit-box;
  font: 17px/1.45 var(--ke-font-reflective, "Cormorant Garamond", serif);
  overflow: hidden;
  white-space: normal;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
}

html.ke-rebrand-mode #scr-journal .ke-journal-row-meta {
  color: var(--kj-muted);
  font-size: 12px;
  letter-spacing: .04em;
  margin-top: auto;
  padding-top: 18px;
  text-transform: uppercase;
}

html.ke-rebrand-mode #scr-journal .ke-journal-row-arrow,
html.ke-rebrand-mode #scr-journal .ke-journal-reflection-badge {
  align-self: flex-end;
  margin-top: auto;
}

html.ke-rebrand-mode #scr-journal .ke-journal-row-arrow {
  color: var(--kj-burgundy);
  font-size: 28px;
}

html.ke-rebrand-mode #scr-journal .ke-journal-reflection-badge {
  background: var(--kj-burgundy);
  color: #fff;
}

html.ke-rebrand-mode #scr-journal .ke-journal-empty,
html.ke-rebrand-mode #scr-journal .ke-journal-locked-gate {
  background: linear-gradient(145deg, rgba(104, 45, 67, .98), rgba(16, 36, 45, .98));
  border-color: rgba(215, 181, 109, .56);
  color: var(--kj-paper);
}

html.ke-rebrand-mode #scr-journal .ke-journal-empty h3,
html.ke-rebrand-mode #scr-journal .ke-journal-empty p {
  color: var(--kj-paper) !important;
}

html.ke-rebrand-mode #scr-journal .ke-journal-insights-panel {
  background: rgba(255, 252, 246, .045);
  border: 1px solid var(--kj-line);
  border-radius: var(--ke-radius-hero, 20px);
  padding: clamp(20px, 4vw, 36px);
}

/* The writer is the same jewel-to-paper gesture used by the app's Bloom flows. */
html.ke-rebrand-mode.ke-journal-writing #scr-journal .ke-journal-main {
  max-width: 900px;
}

html.ke-rebrand-mode #scr-journal .ke-journal-subnav {
  background: rgba(9, 25, 31, .88);
  border: 1px solid var(--kj-line);
  border-radius: var(--ke-radius-card, 16px);
  color: var(--kj-paper);
  margin-bottom: 26px;
  padding: 10px 12px;
  position: sticky;
  top: 12px;
  z-index: var(--ke-layer-sticky, 20);
  backdrop-filter: blur(16px);
}

html.ke-rebrand-mode #scr-journal .ke-journal-subnav h2 {
  color: var(--kj-paper) !important;
}

html.ke-rebrand-mode #scr-journal .ke-journal-editor-card {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
  padding: 18px !important;
}

html.ke-rebrand-mode #scr-journal .ke-journal-editor-card::before {
  display: none !important;
}

html.ke-rebrand-mode #scr-journal .ke-journal-page-stage {
  background:
    radial-gradient(circle at 50% 0, rgba(215, 181, 109, .12), transparent 38%),
    var(--kj-paper) !important;
  border: 2px solid var(--kj-gold) !important;
  border-radius: clamp(52px, 10vw, 112px) !important;
  box-shadow:
    0 0 0 16px var(--kj-burgundy),
    0 0 0 18px rgba(241, 220, 167, .54),
    0 38px 90px rgba(0, 0, 0, .42) !important;
  color: var(--kj-ink);
  min-height: 610px;
  overflow: visible;
  padding: clamp(52px, 8vw, 78px) clamp(36px, 8vw, 76px) !important;
  position: relative;
}

html.ke-rebrand-mode #scr-journal .ke-journal-guided-context {
  background: linear-gradient(145deg, var(--kj-navy-soft), var(--kj-navy));
  border: 1px solid rgba(215, 181, 109, .5);
  border-radius: 28px;
  color: var(--kj-paper);
  margin-bottom: 22px;
}

html.ke-rebrand-mode #scr-journal .ke-journal-prompt {
  background: rgba(104, 45, 67, .075);
  border: 1px solid rgba(104, 45, 67, .18);
  border-left: 4px solid var(--kj-burgundy);
  border-radius: 6px 22px 22px 6px;
  margin: 0 0 28px;
  padding: 17px 20px;
}

html.ke-rebrand-mode #scr-journal .ke-journal-prompt .ke-journal-kicker {
  color: var(--kj-burgundy);
}

html.ke-rebrand-mode #scr-journal .ke-journal-prompt p {
  color: var(--kj-ink) !important;
  font: italic 600 clamp(21px, 3vw, 28px)/1.28 var(--ke-font-reflective, "Cormorant Garamond", serif);
  margin-top: 7px;
}

html.ke-rebrand-mode #scr-journal .ke-journal-title-field > span {
  color: var(--kj-burgundy);
  font-size: 11px;
}

html.ke-rebrand-mode #scr-journal .ke-journal-title-field input {
  color: var(--kj-ink);
  font: 600 clamp(26px, 4vw, 38px)/1.15 var(--ke-font-display, "Playfair Display", serif);
}

html.ke-rebrand-mode #scr-journal .ke-journal-body-field textarea {
  color: var(--kj-ink);
  font: 20px/1.68 var(--ke-font-reflective, "Cormorant Garamond", serif);
  min-height: 330px;
}

html.ke-rebrand-mode #scr-journal .ke-journal-personalize,
html.ke-rebrand-mode #scr-journal .ke-journal-privacy-note,
html.ke-rebrand-mode #scr-journal .ke-journal-entry-talk,
html.ke-rebrand-mode #scr-journal .ke-journal-added-reflections,
html.ke-rebrand-mode #scr-journal .ke-journal-inline-reflection {
  background: var(--kj-paper);
  border: 1px solid rgba(215, 181, 109, .48);
  border-radius: var(--ke-radius-card, 16px);
  box-shadow: var(--ke-shadow-card, 0 16px 40px rgba(16, 27, 34, .075));
  color: var(--kj-ink);
  margin-top: 30px;
  overflow: hidden;
}

html.ke-rebrand-mode #scr-journal .ke-journal-personalize > summary {
  align-items: center;
  cursor: pointer;
  display: grid;
  gap: 9px;
  grid-template-columns: auto minmax(0, 1fr) auto;
  list-style: none;
  min-height: 54px;
  padding: 10px 15px;
}

html.ke-rebrand-mode #scr-journal .ke-journal-personalize > summary::-webkit-details-marker {
  display: none;
}

html.ke-rebrand-mode #scr-journal .ke-journal-personalize > summary > span {
  color: var(--kj-burgundy);
}

html.ke-rebrand-mode #scr-journal .ke-journal-personalize > summary strong {
  color: var(--kj-ink);
  font-size: 13px;
}

html.ke-rebrand-mode #scr-journal .ke-journal-personalize > summary small {
  color: var(--kj-muted);
  font-size: 12px;
}

html.ke-rebrand-mode #scr-journal .ke-journal-personalize .ke-journal-page-tools,
html.ke-rebrand-mode #scr-journal .ke-journal-personalize .ke-journal-creative-dock {
  margin: 0;
  position: static;
}

html.ke-rebrand-mode #scr-journal .ke-journal-personalize .ke-journal-page-tools {
  padding: 14px 15px;
}

html.ke-rebrand-mode #scr-journal .ke-journal-personalize .ke-journal-creative-dock {
  background: var(--kj-cream);
  border: 0;
  border-radius: 0;
  box-shadow: none;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  padding: 10px;
}

html.ke-rebrand-mode #scr-journal .ke-journal-creative-dock button {
  font-size: 12px;
  min-height: 58px;
}

html.ke-rebrand-mode #scr-journal .ke-journal-page-tools > span,
html.ke-rebrand-mode #scr-journal .ke-journal-page-tools button,
html.ke-rebrand-mode #scr-journal .ke-journal-privacy-note summary > span:last-child {
  font-size: 12px;
}

html.ke-rebrand-mode #scr-journal .ke-journal-privacy-note {
  padding: 0;
}

html.ke-rebrand-mode #scr-journal .ke-journal-editor-actions {
  background: rgba(9, 25, 31, .88);
  border: 1px solid var(--kj-line);
  border-radius: var(--ke-radius-card, 16px);
  gap: 8px;
  margin-top: 22px;
  padding: 10px;
}

html.ke-rebrand-mode #scr-journal .ke-journal-editor-actions > * {
  font-size: 12px;
  min-height: var(--ke-control-min, 44px);
}

/* Saved-page carousel ----------------------------------------------------
   Neighboring pages keep the same normal hexagon scale as the Journal
   archive. The rail uses native touch scrolling and mouse drag support from
   the controller; choosing a page lifts it into the open-page position. */
html.ke-rebrand-mode #scr-journal .ke-journal-page-navigation {
  --ke-journal-thoughts-page-gap: clamp(26px, 5vw, 34px);
  border: 0;
  display: block;
  margin-top: calc(var(--ke-journal-thoughts-page-gap) - 12px);
  overflow: visible;
  padding-top: 0;
  position: relative;
  z-index: 2;
}

html.ke-rebrand-mode #scr-journal .ke-journal-page-navigation::before {
  background: linear-gradient(var(--kj-gold-light), var(--kj-gold));
  content: "";
  height: calc(var(--ke-journal-page-stage-tail) + var(--ke-journal-thoughts-page-gap));
  left: 50%;
  pointer-events: none;
  position: absolute;
  top: 12px;
  transform: translate(-50%, -100%);
  width: 3px;
  z-index: 0;
}

/* Completed Journal page stack ------------------------------------------
   The main writing hex, its two actions, and the Thoughts jewel stay in
   normal document flow. This prevents long pages, scrolling, or viewport
   resizing from pulling any control over a different hexagon. */
html.ke-rebrand-mode #scr-journal .ke-journal-thoughts-button {
  transform: none;
}

html.ke-rebrand-mode #scr-journal .ke-journal-page-navigation {
  transform: none;
}

html.ke-rebrand-mode #scr-journal .ke-journal-page-connectors {
  display: none !important;
}

html.ke-rebrand-mode #scr-journal .ke-journal-page-connectors line {
  fill: none;
  stroke: var(--kj-gold);
  stroke-linecap: round;
  stroke-width: 2.5;
  vector-effect: non-scaling-stroke;
}

html.ke-rebrand-mode #scr-journal .ke-journal-page-side-actions {
  box-sizing: border-box;
  display: grid;
  gap: clamp(54px, 14vw, 100px);
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  margin: clamp(6px, 1.5vw, 10px) auto 0;
  padding-inline: clamp(4px, 1.5vw, 10px);
  pointer-events: auto;
  position: relative;
  width: min(100%, 620px);
  z-index: 4;
}

html.ke-rebrand-mode #scr-journal .ke-journal-page-side-actions[hidden] {
  display: none !important;
}

html.ke-rebrand-mode #scr-journal .ke-journal-page-side-action {
  align-items: center;
  background: rgba(9, 25, 31, .88) !important;
  border: 1px solid rgba(215, 181, 109, .58) !important;
  border-radius: 999px;
  color: var(--kj-gold-light) !important;
  cursor: pointer;
  display: inline-flex;
  font: 700 clamp(9px, 2.4vw, 11px)/1.2 var(--ke-font-ui, "DM Sans", sans-serif);
  gap: 7px;
  justify-content: center;
  letter-spacing: .07em;
  min-height: 44px;
  padding: 8px clamp(10px, 2.6vw, 15px);
  text-align: center;
  text-transform: uppercase;
}

html.ke-rebrand-mode #scr-journal .ke-journal-page-side-actions:not([hidden]) + .ke-journal-thoughts-button {
  margin-top: 10px;
}

html.ke-rebrand-mode #scr-journal .ke-journal-page-side-action:focus-visible {
  outline: 3px solid #fff0b6 !important;
  outline-offset: 4px;
}

@media (max-width: 720px) {
  html.ke-rebrand-mode #scr-journal .ke-journal-page-side-actions {
    gap: clamp(46px, 13vw, 90px);
    margin-top: 8px;
    width: min(100%, 600px);
  }
}

html.ke-rebrand-mode #scr-journal .ke-journal-page-deck {
  cursor: grab;
  display: flex;
  gap: clamp(18px, 4vw, 34px);
  margin-inline: calc(clamp(18px, 4vw, 36px) * -1);
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  padding: 12px clamp(18px, 4vw, 36px) 30px;
  scroll-padding-inline: clamp(18px, 4vw, 36px);
  scroll-snap-type: inline mandatory;
  scrollbar-color: rgba(215, 181, 109, .7) rgba(215, 181, 109, .08);
  touch-action: pan-x pan-y;
  -webkit-overflow-scrolling: touch;
}

html.ke-rebrand-mode #scr-journal .ke-journal-page-deck.is-dragging {
  cursor: grabbing;
  scroll-snap-type: none;
  user-select: none;
}

html.ke-rebrand-mode #scr-journal .ke-journal-page-preview {
  aspect-ratio: .92;
  background: var(--kj-faceted-gold-rim);
  border: 0;
  clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%);
  color: #fffaf0;
  cursor: pointer;
  filter: drop-shadow(0 26px 34px rgba(0,0,0,.38)) drop-shadow(0 0 22px rgba(215,181,109,.18));
  flex: 0 0 clamp(300px, 42vw, 370px);
  min-height: 0;
  padding: 4px;
  scroll-snap-align: center;
  text-align: center !important;
  transition: filter 180ms ease, opacity 180ms ease, transform 180ms ease;
}

html.ke-rebrand-mode #scr-journal .ke-journal-page-preview:hover {
  filter: brightness(1.035) drop-shadow(0 28px 38px rgba(0,0,0,.42)) drop-shadow(0 0 28px rgba(241,220,167,.28));
  transform: translateY(-7px);
}

html.ke-rebrand-mode #scr-journal .ke-journal-page-preview.is-lifting {
  opacity: .18;
}

html.ke-rebrand-mode #scr-journal .ke-journal-page-preview-inner {
  align-items: stretch;
  background:
    radial-gradient(circle at 32% 13%, rgba(255, 255, 255, .1), transparent 22%),
    radial-gradient(circle at 50% 45%, #79364e 0%, #542238 55%, #260d1a 100%);
  clip-path: inherit;
  color: #fffaf0 !important;
  display: flex;
  flex-direction: column;
  height: 100%;
  justify-content: flex-start;
  overflow: hidden;
  padding: 25% 14%;
  position: relative;
  text-align: left;
  width: 100%;
}

html.ke-rebrand-mode #scr-journal .ke-journal-page-preview-number {
  align-items: center;
  background: rgba(8, 29, 36, .94);
  border: 1px solid rgba(215, 181, 109, .72);
  border-radius: 50%;
  color: var(--kj-gold-light) !important;
  display: inline-flex;
  font: 600 12px/1 var(--ke-font-ui, "DM Sans", sans-serif);
  height: 28px;
  justify-content: center;
  left: 50%;
  position: absolute;
  top: 8.5%;
  transform: translateX(-50%);
  width: 28px;
  z-index: 2;
}

html.ke-rebrand-mode #scr-journal .ke-journal-page-preview-number::before {
  content: none;
}

html.ke-rebrand-mode #scr-journal .ke-journal-page-preview-content {
  display: block;
  max-height: 100%;
  overflow: hidden;
  width: 100%;
}

html.ke-rebrand-mode #scr-journal .ke-journal-page-preview-date {
  color: var(--kj-gold-light) !important;
  display: block;
  font: 700 12px/1.2 var(--ke-font-display, "Playfair Display", serif);
  letter-spacing: .1em;
  margin-bottom: 12px;
  text-transform: uppercase;
}

html.ke-rebrand-mode #scr-journal .ke-journal-page-preview-copy {
  color: #fffaf0 !important;
  display: -webkit-box;
  font: 500 clamp(20px, 2.5vw, 23px)/1.65 var(--ke-font-reflective, "Cormorant Garamond", serif);
  overflow: hidden;
  white-space: pre-wrap;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 7;
}

html.ke-rebrand-mode #scr-journal .ke-journal-page-preview-reflection {
  border-top: 1px solid rgba(255, 240, 182, .34);
  color: #fff !important;
  display: grid;
  font: 500 17px/1.48 var(--ke-font-reflective, "Cormorant Garamond", serif);
  gap: 5px;
  margin-top: 16px;
  opacity: 1 !important;
  padding-top: 14px;
}

html.ke-rebrand-mode #scr-journal .ke-journal-page-preview-reflection strong,
html.ke-rebrand-mode #scr-journal .ke-journal-page-preview-reflection span {
  color: #fff !important;
  opacity: 1 !important;
}

html.ke-rebrand-mode #scr-journal .ke-journal-page-preview-reflection strong {
  font: 600 15px/1.2 var(--ke-font-display, "Playfair Display", serif);
}

.ke-journal-page-preview-flight {
  box-sizing: border-box;
  margin: 0 !important;
  pointer-events: none !important;
  position: fixed !important;
  z-index: 10000 !important;
}

@media (max-width: 600px) {
  html.ke-rebrand-mode #scr-journal .ke-journal-page-deck {
    margin-inline: -11px;
    padding-inline: max(14px, calc((100vw - min(82vw, 340px)) / 2));
  }

  html.ke-rebrand-mode #scr-journal .ke-journal-page-preview {
    flex-basis: min(82vw, 340px);
  }
}

@media (prefers-reduced-motion: reduce) {
  html.ke-rebrand-mode #scr-journal .ke-journal-page-preview {
    transition: none;
  }
}

html.ke-rebrand-mode #scr-journal .ke-journal-save-seal {
  align-items: center;
  animation: keJournalSealIn 520ms var(--ke-ease-spring, cubic-bezier(.2, .82, .24, 1.18)) both;
  background: radial-gradient(circle at 35% 25%, var(--kj-gold-light), var(--kj-gold) 62%, #8a641e);
  border: 2px solid #fff4cf;
  border-radius: 50%;
  box-shadow: 0 0 0 8px rgba(215, 181, 109, .12), 0 18px 36px rgba(0, 0, 0, .34);
  color: var(--kj-navy);
  display: flex;
  font-size: 29px;
  height: 76px;
  justify-content: center;
  margin: 0 auto 22px;
  width: 76px;
}

@keyframes keJournalSealIn {
  from { opacity: 0; transform: rotate(-18deg) scale(.55); }
  to { opacity: 1; transform: rotate(0) scale(1); }
}

html.ke-rebrand-mode #scr-journal .ke-journal-choice {
  min-height: 150px;
}

html.ke-rebrand-mode #scr-journal .ke-journal-choice strong {
  font-size: 17px;
}

html.ke-rebrand-mode #scr-journal :is(button, input, textarea, summary):focus-visible {
  outline-color: var(--kj-gold-light) !important;
  outline-offset: 3px;
}

@media (max-width: 720px) {
  html.ke-rebrand-mode #scr-journal .ke-journal-header {
    grid-template-columns: minmax(0, 1fr) auto;
    min-height: 72px;
  }

  html.ke-rebrand-mode #scr-journal .ke-journal-header-action {
    border-radius: 50%;
    font-size: 0;
    height: 48px;
    padding: 0;
    width: 48px;
  }

  html.ke-rebrand-mode #scr-journal .ke-journal-header-action span {
    font-size: 22px;
  }

  html.ke-rebrand-mode #scr-journal .ke-journal-main {
    padding: 18px 14px max(124px, calc(96px + env(safe-area-inset-bottom)));
  }

  html.ke-rebrand-mode #scr-journal .ke-journal-home-tabs {
    margin-bottom: 26px;
  }

  html.ke-rebrand-mode #scr-journal .ke-journal-section-heading {
    align-items: end;
    gap: 10px;
  }

  html.ke-rebrand-mode #scr-journal .ke-journal-deck-hint {
    max-width: 34rem;
  }

  html.ke-rebrand-mode #scr-journal .ke-journal-list {
    margin-inline: -14px;
    padding-inline: 14px 34px;
    scroll-padding-inline: 14px 34px;
  }

  html.ke-rebrand-mode #scr-journal .ke-journal-row {
    flex-basis: min(82vw, 340px);
    min-height: 300px;
  }

  html.ke-rebrand-mode #scr-journal .ke-journal-subnav {
    margin: -6px 0 22px;
    top: 6px;
  }

  html.ke-rebrand-mode #scr-journal .ke-journal-editor-card {
    margin: 0 !important;
    padding: 11px !important;
  }

  html.ke-rebrand-mode #scr-journal .ke-journal-page-stage {
    border-radius: 44px !important;
    box-shadow:
      0 0 0 8px var(--kj-burgundy),
      0 0 0 10px rgba(241, 220, 167, .54),
      0 28px 60px rgba(0, 0, 0, .4) !important;
    min-height: 560px;
    padding: 42px 21px !important;
  }

  html.ke-rebrand-mode #scr-journal .ke-journal-prompt p {
    font-size: 22px;
  }

  html.ke-rebrand-mode #scr-journal .ke-journal-body-field textarea {
    min-height: 42dvh;
  }

  html.ke-rebrand-mode #scr-journal .ke-journal-personalize .ke-journal-creative-dock {
    grid-template-columns: repeat(5, minmax(72px, 1fr));
    overflow-x: auto;
  }

  html.ke-rebrand-mode #scr-journal .ke-journal-editor-actions {
    grid-template-columns: 1fr 1fr;
  }

  html.ke-rebrand-mode #scr-journal .ke-journal-editor-actions .ke-journal-primary {
    grid-column: 1 / -1;
  }
}

@media (max-width: 430px) {
  html.ke-rebrand-mode #scr-journal .ke-journal-section-heading h2 {
    font-size: 26px;
  }

  html.ke-rebrand-mode #scr-journal .ke-journal-tool-button span {
    display: none;
  }

  html.ke-rebrand-mode #scr-journal .ke-journal-choice-grid {
    grid-template-columns: 1fr;
  }

  html.ke-rebrand-mode #scr-journal .ke-journal-choice {
    min-height: 112px;
  }
}

@media (max-width: 720px) {
  html.ke-rebrand-mode.ke-journal-writing.ke-journal-keyboard-open #scr-journal .ke-journal-main {
    min-height: var(--ke-journal-visual-height, 100dvh);
    padding: 0 8px max(12px, env(safe-area-inset-bottom));
  }

  html.ke-rebrand-mode.ke-journal-writing.ke-journal-keyboard-open #scr-journal .ke-journal-subnav {
    background: rgba(9, 25, 31, .98);
    margin: 0;
    min-height: 54px;
    top: 0;
  }

  html.ke-rebrand-mode.ke-journal-writing.ke-journal-keyboard-open #scr-journal .ke-journal-subnav .ke-journal-kicker,
  html.ke-rebrand-mode.ke-journal-writing.ke-journal-keyboard-open #scr-journal .ke-journal-private-pill {
    display: block;
  }

  html.ke-rebrand-mode.ke-journal-writing.ke-journal-keyboard-open #scr-journal .ke-journal-editor-card {
    margin: 0 !important;
    padding: 8px !important;
  }

  html.ke-rebrand-mode.ke-journal-writing.ke-journal-keyboard-open #scr-journal .ke-journal-page-stage {
    border-radius: 24px !important;
    box-shadow: 0 0 0 4px var(--kj-burgundy) !important;
    min-height: var(--ke-journal-visual-height, 100dvh);
    padding: 16px 15px 28px !important;
  }

  html.ke-rebrand-mode.ke-journal-writing.ke-journal-keyboard-open #scr-journal .ke-journal-prompt {
    display: block !important;
    margin-bottom: 12px;
    padding: 10px 12px;
    position: sticky;
    top: 58px;
    z-index: 16;
  }

  html.ke-rebrand-mode.ke-journal-writing.ke-journal-keyboard-open #scr-journal .ke-journal-prompt p {
    display: -webkit-box;
    font-size: 17px;
    line-height: 1.25;
    margin-top: 3px;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }

  html.ke-rebrand-mode.ke-journal-writing.ke-journal-keyboard-open #scr-journal .ke-journal-body-field textarea {
    min-height: max(190px, calc(var(--ke-journal-visual-height, 100dvh) - 255px));
    scroll-margin-block: 90px 18px;
  }
}

@media (prefers-reduced-motion: reduce) {
  html.ke-rebrand-mode #scr-journal .ke-journal-manager-chevron,
  html.ke-rebrand-mode #scr-journal .ke-journal-row,
  html.ke-rebrand-mode #scr-journal .ke-journal-save-seal {
    animation: none !important;
    transition: none !important;
  }
}

/* V3 writer refinement: the prompt stays above a dedicated, expandable jewel.
   The reading deck is intentionally not part of these selectors. */
html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) #ke-journal-form .ke-journal-body-field {
  margin-block: clamp(24px, 4vw, 38px);
  min-height: clamp(340px, 50vw, 460px);
  padding: clamp(54px, 8vw, 76px);
  width: min(100%, 460px);
}

html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) #ke-journal-form .ke-journal-body-field:focus-within,
html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) #ke-journal-form .ke-journal-body-field:has(textarea:not(:placeholder-shown)) {
  min-height: clamp(460px, 62dvh, 660px);
  padding: clamp(48px, 7vw, 72px);
  width: min(100%, 600px);
}

html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) #ke-journal-form #ke-journal-body-input {
  font-size: clamp(20px, 2.6vw, 23px);
  line-height: 1.62;
  min-height: 220px !important;
}

html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) #ke-journal-form .ke-journal-body-field:focus-within #ke-journal-body-input,
html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) #ke-journal-form .ke-journal-body-field:has(textarea:not(:placeholder-shown)) #ke-journal-body-input {
  min-height: clamp(320px, 47dvh, 520px) !important;
}

@media (max-width: 720px) {
  html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) #ke-journal-form .ke-journal-body-field {
    min-height: min(82vw, 360px);
    padding: clamp(38px, 11vw, 52px);
    width: min(100%, 360px);
  }

  html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) #ke-journal-form .ke-journal-body-field:focus-within,
  html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) #ke-journal-form .ke-journal-body-field:has(textarea:not(:placeholder-shown)) {
    min-height: min(126vw, 520px);
    padding: 32px 24px;
    width: 100%;
  }

  html.ke-rebrand-mode.ke-journal-writing.ke-journal-keyboard-open #scr-journal #ke-journal-form .ke-journal-body-field,
  html.ke-rebrand-mode.ke-journal-writing.ke-journal-keyboard-open #scr-journal #ke-journal-form .ke-journal-body-field:focus-within,
  html.ke-rebrand-mode.ke-journal-writing.ke-journal-keyboard-open #scr-journal #ke-journal-form .ke-journal-body-field:has(textarea:not(:placeholder-shown)) {
    min-height: clamp(250px, calc(var(--ke-journal-visual-height, 100dvh) - 320px), 430px);
    padding: 22px 18px;
  }

  html.ke-rebrand-mode.ke-journal-writing.ke-journal-keyboard-open #scr-journal #ke-journal-form #ke-journal-body-input,
  html.ke-rebrand-mode.ke-journal-writing.ke-journal-keyboard-open #scr-journal #ke-journal-form .ke-journal-body-field:focus-within #ke-journal-body-input,
  html.ke-rebrand-mode.ke-journal-writing.ke-journal-keyboard-open #scr-journal #ke-journal-form .ke-journal-body-field:has(textarea:not(:placeholder-shown)) #ke-journal-body-input {
    min-height: clamp(160px, calc(var(--ke-journal-visual-height, 100dvh) - 430px), 300px) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) #ke-journal-form .ke-journal-body-field,
  html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) #ke-journal-form #ke-journal-body-input {
    transition: none !important;
  }
}

/* Focused Journal writer -------------------------------------------------
   The writing route is now only the member Flame, the growing journal hex,
   and Karamo's Thoughts. Collection chrome stays hidden while the Check-In
   route's countdown remains inline with the writing itself. */
html.ke-rebrand-mode.ke-journal-writing #scr-journal > .ke-journal-header,
html.ke-rebrand-mode.ke-journal-writing #scr-journal #ke-journal-entry-mood,
html.ke-rebrand-mode.ke-journal-writing #scr-journal .ke-journal-title-field,
html.ke-rebrand-mode.ke-journal-writing #scr-journal .ke-journal-personalize,
html.ke-rebrand-mode.ke-journal-writing #scr-journal .ke-journal-privacy-note,
html.ke-rebrand-mode.ke-journal-writing #scr-journal .ke-journal-editor-actions {
  display: none !important;
}

html.ke-rebrand-mode.ke-journal-writing #scr-journal #ke-journal-editor > .ke-journal-subnav {
  align-items: center;
  background: transparent !important;
  border: 0 !important;
  display: flex !important;
  margin: 0 0 14px !important;
  min-height: 44px;
  padding: 0 !important;
  position: sticky;
  top: 10px;
  backdrop-filter: none;
}

html.ke-rebrand-mode.ke-journal-writing #scr-journal #ke-journal-editor > .ke-journal-subnav > div,
html.ke-rebrand-mode.ke-journal-writing #scr-journal #ke-journal-editor > .ke-journal-subnav .ke-journal-subnav-actions {
  display: none !important;
}

html.ke-rebrand-mode.ke-journal-writing #scr-journal #ke-journal-editor > .ke-journal-subnav .ke-journal-back {
  align-items: center;
  background: rgba(9, 25, 31, .82) !important;
  border: 1px solid rgba(215, 181, 109, .58) !important;
  border-radius: 999px;
  color: var(--kj-gold-light) !important;
  display: inline-flex;
  font: 700 12px/1 var(--ke-font-ui, "DM Sans", sans-serif);
  gap: 8px;
  height: 44px;
  letter-spacing: .1em;
  padding: 0 17px;
  text-transform: uppercase;
  width: auto;
}

html.ke-rebrand-mode.ke-journal-writing #scr-journal .ke-journal-main {
  padding-top: clamp(18px, 4vw, 36px) !important;
}

html.ke-rebrand-mode.ke-journal-writing #scr-journal #ke-journal-form .ke-journal-body-field {
  margin-top: 26px !important;
}

html.ke-rebrand-mode.ke-journal-writing #scr-journal .ke-journal-alert.is-timer-complete:not([hidden]) {
  animation: keJournalTimerComplete 360ms var(--ke-ease-spring, cubic-bezier(.2, .82, .24, 1.18)) both;
  background: radial-gradient(circle at 50% 0, #79364e 0%, #542238 58%, #260d1a 100%) !important;
  border: 2px solid var(--kj-gold-light) !important;
  border-radius: 18px;
  box-shadow: 0 20px 55px rgba(0, 0, 0, .46), 0 0 24px rgba(215, 181, 109, .25);
  color: #fffaf0 !important;
  font: 700 clamp(16px, 3.8vw, 20px)/1.25 var(--ke-font-display, "Playfair Display", serif);
  left: 50%;
  margin: 0;
  max-width: 420px;
  padding: 16px 22px;
  position: fixed;
  text-align: center;
  top: max(82px, calc(env(safe-area-inset-top) + 72px));
  transform: translateX(-50%);
  width: calc(100% - 32px);
  z-index: 10050;
}

@keyframes keJournalTimerComplete {
  from { opacity: 0; transform: translate(-50%, -10px) scale(.94); }
  to { opacity: 1; transform: translate(-50%, 0) scale(1); }
}

@media (prefers-reduced-motion: reduce) {
  html.ke-rebrand-mode.ke-journal-writing #scr-journal .ke-journal-alert.is-timer-complete:not([hidden]) {
    animation: none;
  }
}

html.ke-rebrand-mode #scr-journal .ke-journal-home-tabs button::before {
  clip-path: polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%) !important;
}

html.ke-rebrand-mode #scr-journal .ke-journal-row {
  align-items: stretch !important;
  aspect-ratio: 1 !important;
  border: 4px solid #d7b56d !important;
  border-radius: 50% !important;
  flex-basis: clamp(300px,42vw,370px) !important;
  justify-content: center !important;
  min-height: 0 !important;
  overflow: hidden auto !important;
  padding: clamp(48px,8vw,68px) !important;
}

html.ke-rebrand-mode #scr-journal .ke-journal-editor-card,
html.ke-rebrand-mode #scr-journal .ke-journal-page-stage {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

html.ke-rebrand-mode #scr-journal .ke-journal-editor-card::before { display: none !important; }

@media (max-width: 600px) {
  html.ke-rebrand-mode #scr-journal .ke-journal-row {
    flex-basis: min(86vw,350px) !important;
    padding: 50px 42px !important;
  }
}

/* Content-sized writer ---------------------------------------------------
   A fresh page begins as a normal hex. The textarea supplies any additional
   height only when its words outgrow the initial writing area, while the
   Karamo's Thoughts footer remains the next connected element below it. */
html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) #ke-journal-form .ke-journal-body-field,
html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) #ke-journal-form .ke-journal-body-field:focus-within,
html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) #ke-journal-form .ke-journal-body-field:has(textarea:not(:placeholder-shown)) {
  min-height: 460px !important;
  padding: calc(var(--ke-journal-hex-cap) + 18px) clamp(38px, 7vw, 62px) !important;
  width: min(100%, 460px) !important;
}

html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) #ke-journal-form #ke-journal-body-input,
html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) #ke-journal-form .ke-journal-body-field:focus-within #ke-journal-body-input,
html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) #ke-journal-form .ke-journal-body-field:has(textarea:not(:placeholder-shown)) #ke-journal-body-input {
  height: 190px;
  min-height: 190px !important;
}

html.ke-rebrand-mode #scr-journal .ke-journal-thoughts-button {
  flex: 0 0 auto;
}

@media (max-width: 720px) {
  html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) #ke-journal-form .ke-journal-body-field,
  html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) #ke-journal-form .ke-journal-body-field:focus-within,
  html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) #ke-journal-form .ke-journal-body-field:has(textarea:not(:placeholder-shown)),
  html.ke-rebrand-mode.ke-journal-writing.ke-journal-keyboard-open #scr-journal #ke-journal-form .ke-journal-body-field,
  html.ke-rebrand-mode.ke-journal-writing.ke-journal-keyboard-open #scr-journal #ke-journal-form .ke-journal-body-field:focus-within,
  html.ke-rebrand-mode.ke-journal-writing.ke-journal-keyboard-open #scr-journal #ke-journal-form .ke-journal-body-field:has(textarea:not(:placeholder-shown)) {
    --ke-journal-hex-cap: clamp(68px, 23vw, 88px);
    min-height: min(110vw, 410px) !important;
    padding: calc(var(--ke-journal-hex-cap) + 14px) 28px !important;
    width: min(100%, 370px) !important;
  }

  html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) #ke-journal-form #ke-journal-body-input,
  html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) #ke-journal-form .ke-journal-body-field:focus-within #ke-journal-body-input,
  html.ke-rebrand-mode #scr-journal #ke-journal-editor:not([hidden]) #ke-journal-form .ke-journal-body-field:has(textarea:not(:placeholder-shown)) #ke-journal-body-input,
  html.ke-rebrand-mode.ke-journal-writing.ke-journal-keyboard-open #scr-journal #ke-journal-form #ke-journal-body-input,
  html.ke-rebrand-mode.ke-journal-writing.ke-journal-keyboard-open #scr-journal #ke-journal-form .ke-journal-body-field:focus-within #ke-journal-body-input,
  html.ke-rebrand-mode.ke-journal-writing.ke-journal-keyboard-open #scr-journal #ke-journal-form .ke-journal-body-field:has(textarea:not(:placeholder-shown)) #ke-journal-body-input {
    height: 150px;
    min-height: 150px !important;
  }
}

/* Persistent Journal navigation -----------------------------------------
   Writing remains part of the main app shell. Keep the complete five-item
   footer—including Karamo's raised center action—in its normal bottom slot
   while the journal canvas scrolls above it. */
html.ke-rebrand-mode.ke-journal-writing #tab-bar {
  display: flex !important;
  flex-shrink: 0;
}

html.ke-rebrand-mode.ke-journal-writing #tab-bar > #ke-talk-launcher {
  display: flex !important;
}

/* Selected-prompt Flame hex ---------------------------------------------
   A prompted page begins with one compact jewel that keeps the member's
   living Flame and the prompt they chose together above their writing. */
html.ke-rebrand-mode.ke-journal-writing #scr-journal #ke-journal-guided-context:not([hidden]) {
  --ke-journal-hex-connector: clamp(26px, 5vw, 34px);
  display: flex !important;
  margin: 0 auto var(--ke-journal-hex-connector);
  position: relative;
}

html.ke-rebrand-mode.ke-journal-writing #scr-journal .ke-journal-flame-hex {
  aspect-ratio: .9;
  width: min(100%, 340px);
}

html.ke-rebrand-mode.ke-journal-writing #scr-journal .ke-journal-flame-hex-inner {
  gap: 12px;
  padding: 58px 38px 54px;
}

html.ke-rebrand-mode.ke-journal-writing #scr-journal .ke-journal-flame-picture {
  margin: -12px auto 0;
}

html.ke-rebrand-mode.ke-journal-writing #scr-journal .ke-journal-flame-hex #ke-journal-prompt {
  background: transparent !important;
  border: 0 !important;
  display: block !important;
  margin: 0 !important;
  max-width: 250px;
  padding: 0 !important;
  width: 100%;
}

html.ke-rebrand-mode.ke-journal-writing #scr-journal .ke-journal-flame-hex #ke-journal-prompt p {
  color: #fffaf0 !important;
  font-size: clamp(18px, 5.1vw, 22px);
  font-style: normal;
  line-height: 1.25;
  margin: 8px 0 0;
}

html.ke-rebrand-mode.ke-journal-writing #scr-journal .ke-journal-guided-arrival {
  display: none !important;
}

@media (max-width: 420px) {
  html.ke-rebrand-mode.ke-journal-writing #scr-journal .ke-journal-flame-hex {
    width: min(88vw, 326px);
  }

  html.ke-rebrand-mode.ke-journal-writing #scr-journal .ke-journal-flame-hex-inner {
    padding: 52px 32px 48px;
  }

  html.ke-rebrand-mode.ke-journal-writing #scr-journal .ke-journal-flame-picture,
  html.ke-rebrand-mode.ke-journal-writing #scr-journal .ke-journal-flame-picture img {
    height: 108px;
    width: 80px;
  }
}

/* Flush prompt stack ----------------------------------------------------
   The focused prompt jewel begins at the very top of the writing surface.
   The Back pill floats over its open upper-left corner instead of reserving
   a full navigation row above the hex. */
html.ke-rebrand-mode.ke-journal-writing #scr-journal .ke-journal-main,
html.ke-rebrand-mode.ke-journal-writing #scr-journal #ke-journal-form,
html.ke-rebrand-mode.ke-journal-writing #scr-journal .ke-journal-page-stage {
  padding-top: 0 !important;
}

html.ke-rebrand-mode.ke-journal-writing #scr-journal #ke-journal-editor:has(#ke-journal-guided-context:not([hidden])) {
  position: relative;
}

html.ke-rebrand-mode.ke-journal-writing #scr-journal #ke-journal-editor:has(#ke-journal-guided-context:not([hidden])) > .ke-journal-subnav {
  left: clamp(6px, 2vw, 10px);
  margin: 0 !important;
  position: absolute !important;
  top: 6px;
  z-index: calc(var(--ke-layer-sticky, 20) + 1);
}

html.ke-rebrand-mode.ke-journal-writing #scr-journal .ke-journal-page-stage {
  padding-bottom: var(--ke-journal-page-stage-tail) !important;
}

html.ke-rebrand-mode.ke-journal-writing #scr-journal .ke-journal-page-stage:has(#ke-journal-guided-context:not([hidden])) .ke-journal-body-field {
  margin-top: 0 !important;
}

html.ke-rebrand-mode.ke-journal-writing #scr-journal #ke-journal-guided-context:not([hidden])::after {
  animation: none !important;
  background: linear-gradient(180deg, #fff0ad 0%, #d7b56d 48%, #c28c35 100%) !important;
  content: "" !important;
  display: block !important;
  height: var(--ke-journal-hex-connector);
  inset: 100% auto auto 50% !important;
  pointer-events: none;
  position: absolute;
  transform: translateX(-50%);
  width: 3px;
  z-index: 0;
}
