/* Sākshī — components. Redesign v5: "Night Log" (case-file).
   Rebuilt from scratch against the actual Direction A mockup (Presence.html
   prototype) rather than patched on top of the old "Threads" spine — a
   ledger read as a night-log entry, not a chat card: a left time-gutter with
   a hairline spine, mono case-file typography (IBM Plex Mono labels, Zilla
   Slab masthead serif, IBM Plex Sans body — no italic "AI voice" font
   switch, voice is told by tag/color, not typeface), a bordered "FINDING"
   exhibit box with corner brackets, and an underline-only composer.
   All runtime-generated class names are preserved verbatim. */

* { box-sizing: border-box; }
html { height: 100%; }
body {
  margin: 0; min-height: 100%;
  background: var(--c-bg-0);
  color: var(--c-tx-1);
  font-family: var(--f-sans);
  font-size: 16px; line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  position: relative;
}
/* Ink field — quiet room: gold lamp at the crown, charcoal floor. */
body {
  background:
    radial-gradient(55% 42% at 50% 8%, var(--c-lamp), transparent 70%),
    radial-gradient(120% 70% at 50% -12%, rgba(212, 176, 122, 0.12), transparent 58%),
    radial-gradient(90% 50% at 50% -8%, rgba(58, 50, 42, 0.55), transparent 62%),
    radial-gradient(42% 34% at 0% 72%, rgba(106, 125, 181, 0.05), transparent 55%),
    var(--c-bg-0);
  background-attachment: fixed;
}
:root.light body {
  background:
    radial-gradient(110% 62% at 50% -16%, rgba(84, 105, 142, 0.13), transparent 58%),
    radial-gradient(70% 44% at 100% 12%, rgba(138, 106, 58, 0.04), transparent 62%),
    var(--c-bg-0);
}
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid var(--c-witness);
  outline-offset: 3px;
}
.sr-only {
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0);
  white-space: nowrap; border: 0;
}
/* The geometry belongs to the membrane itself, where it can hold the witness
   without drifting behind unrelated sheets or conversation. */
body::before { display: none; }
body::after {
  content: ""; position: fixed; inset: 0; z-index: 0; pointer-events: none;
  opacity: .018; mix-blend-mode: overlay;
  background-image: radial-gradient(rgba(255,255,255,.6) 0.5px, transparent 0.5px);
  background-size: 2.4px 2.4px;
}

.wrap {
  position: relative; z-index: 1;
  width: min(100%, 640px); margin: 0 auto;
  padding: max(18px, env(safe-area-inset-top, 0px)) clamp(20px, 5vw, 32px) 40px;
}
/* Ambient home: no brand chrome; chat summons its own workspace. */
.wrap.membrane-home .witness-name,
.wrap.membrane-home .surface-label,
.wrap.membrane-home .surface-handled.is-membrane-hidden,
body:has(#conversation[hidden]) .feed-more,
body:has(#conversation[hidden]) .history-earlier,
body:has(#conversation[hidden]) .msg-edit {
  display: none !important;
}
body.membrane-rest .wrap.membrane-home .surface-handled {
  display: none !important;
}
/* Rest composition: lamp → one glance → ADR — not a scrollable ledger. */
.wrap.membrane-home .membrane {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  min-height: min(72dvh, 640px);
  padding: clamp(12px, 3vh, 28px) 0 8px;
}
.wrap.membrane-home .closed-loop-surface {
  width: 100%;
  max-width: 36rem;
  margin: 0 auto;
}
.wrap.membrane-home .surface-now {
  min-height: 0;
}
.wrap.membrane-home .greeting {
  -webkit-line-clamp: unset;
  line-clamp: unset;
  display: block;
  overflow: visible;
  max-height: none;
  font-size: clamp(22px, 5.4vw, 34px);
  line-height: 1.28;
  letter-spacing: -0.02em;
  text-align: center;
  margin: 0 auto;
  max-width: 42ch;
}
.wrap.membrane-home .greeting.is-silence {
  max-width: 10ch;
  -webkit-line-clamp: unset;
  line-clamp: unset;
  font-size: clamp(22px, 5vw, 30px);
  color: var(--c-tx-3);
  font-weight: 400;
}
body.membrane-rest .wrap.membrane-home .docket,
body.membrane-rest .wrap.membrane-home .now-actions,
body.membrane-rest .wrap.membrane-home .answer-chips,
body.membrane-rest .wrap.membrane-home .learning-inbox {
  display: none !important;
}
/* Ask / day decide: coach inbox is Rest-only — never stage over the glance. */
body:not(.membrane-rest) .wrap.membrane-home .learning-inbox {
  display: none !important;
}
.delta-actions.is-decide .delta-act-primary {
  font-weight: 600;
}
.wrap.membrane-home .docket {
  margin-top: 14px;
  max-width: 22rem;
  margin-left: auto;
  margin-right: auto;
}
.wrap.membrane-home .docket-more-quiet {
  display: none !important;
}
.wrap.membrane-home .delta-actions {
  margin-top: clamp(20px, 4vh, 32px);
  justify-content: center;
  width: 100%;
}
.wrap.membrane-home .delta-act {
  min-height: 48px;
  min-width: 118px;
}
.wrap.membrane-home .home-nav {
  margin-top: auto;
  padding-top: 28px;
  opacity: 0.42;
}
body.membrane-rest .wrap.membrane-home .home-nav {
  opacity: 0.32;
}
body.membrane-rest .wrap.membrane-home .delta-actions.is-quiet {
  margin-top: 28px;
}
/* Loading/status: never a second headline band. */
.wrap.membrane-home .surface-status {
  font-size: 12px;
  opacity: 0.55;
  margin: 0 0 8px;
  text-align: center;
}
/* Wake-check is the owner lock-screen gate — keep visible in settings. */
#wake-check.settings-wake {
  display: block;
}

/* ── Circadian skins (Israel-local hour via data-circadian) ─────────── */
html[data-circadian="dawn"] body {
  background:
    radial-gradient(90% 55% at 50% -4%, rgba(212, 140, 90, 0.14), transparent 55%),
    radial-gradient(60% 40% at 100% 20%, rgba(201, 164, 106, 0.08), transparent 50%),
    var(--c-bg-0);
}
html[data-circadian="dawn"] .witness {
  filter: drop-shadow(0 0 40px rgba(212, 140, 90, 0.28));
  color: #d4a070;
}
html[data-circadian="day"] body {
  background:
    radial-gradient(80% 45% at 50% -8%, rgba(201, 164, 106, 0.06), transparent 55%),
    radial-gradient(50% 35% at 0% 60%, rgba(138, 154, 122, 0.05), transparent 50%),
    var(--c-bg-0);
}
html[data-circadian="day"] .witness {
  filter: drop-shadow(0 0 32px rgba(212, 176, 122, 0.22));
  opacity: 1;
}
html[data-circadian="dusk"] body {
  background:
    radial-gradient(85% 50% at 50% -6%, rgba(201, 164, 106, 0.1), transparent 55%),
    radial-gradient(55% 40% at 90% 30%, rgba(212, 120, 106, 0.07), transparent 50%),
    var(--c-bg-0);
}
html[data-circadian="night"] body {
  background:
    radial-gradient(130% 72% at 50% -14%, rgba(23, 30, 46, 0.5), transparent 56%),
    radial-gradient(85% 50% at 50% -6%, rgba(201, 164, 106, 0.09), transparent 58%),
    radial-gradient(55% 40% at 100% 10%, rgba(212, 120, 106, 0.05), transparent 50%),
    radial-gradient(45% 35% at 0% 70%, rgba(138, 154, 122, 0.04), transparent 55%),
    var(--c-bg-0);
}
html[data-circadian="night"] .witness {
  filter: drop-shadow(0 0 42px rgba(201, 164, 106, 0.26));
}

/* ── Quiet masthead (brand whisper — eye lives in the membrane) ─────── */
header.mast-quiet {
  position: sticky; top: 0; z-index: 6;
  display: flex; align-items: center; justify-content: space-between;
  gap: 14px;
  padding: 5px 0 10px;
  background: linear-gradient(180deg, var(--c-bg-0) 78%, color-mix(in srgb, var(--c-bg-0) 0%, transparent));
}
.mast-quiet .wordmark {
  display: block;
  font-family: var(--f-serif); font-weight: 600; font-style: normal;
  font-size: clamp(18px, 4.5vw, 22px); line-height: 1; color: var(--c-tx-1);
  letter-spacing: -0.02em;
  font-variation-settings: "opsz" 36, "SOFT" 40, "WONK" 0.3;
}
.mast-quiet .mast-tag {
  font-family: var(--f-mono); font-size: 7px; letter-spacing: 0.22em;
  color: var(--c-witness); opacity: .85; line-height: 1; text-transform: uppercase;
}

/* ── Membrane home: third-eye + delta ───────────────────────────────── */
.membrane {
  position: relative;
  isolation: isolate;
  display: flex; flex-direction: column; align-items: stretch;
  justify-content: flex-start;
  min-height: min(100dvh - 120px, 720px);
  padding: clamp(28px, 6vh, 56px) 0 24px;
  overflow-y: auto;
  overscroll-behavior: contain;
  animation: membraneIn .95s cubic-bezier(.16,1,.3,1) both;
}
.closed-loop-surface {
  display: flex; flex-direction: column; gap: clamp(28px, 5vh, 40px);
  width: 100%;
}
.surface-label {
  margin: 0 0 10px 2px;
  font-family: var(--f-mono); font-size: 8px; font-weight: 500;
  letter-spacing: 0.28em; text-transform: uppercase;
  color: var(--c-tx-3); opacity: 0.55;
}
.surface-status {
  margin: 0 0 6px 2px;
  font-family: var(--f-sans); font-size: 13px; color: var(--c-tx-3);
}
.surface-status.is-error { color: var(--c-danger); }
.surface-status.is-loading { color: var(--c-witness); }
.membrane .greeting.now-line {
  margin: 0;
}
.now-actions {
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
  margin-top: 14px;
}
.now-tag {
  font-family: var(--f-mono); font-size: 9px; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--c-witness);
  padding: 4px 8px; border: 1px solid var(--c-witness-soft); border-radius: 999px;
}
.now-why, .handled-why {
  font-family: var(--f-mono); font-size: 11px; letter-spacing: 0.06em;
  color: var(--c-tx-3); background: none; border: none; padding: 6px 8px;
  cursor: pointer; text-decoration: underline; text-underline-offset: 3px;
}
.now-why:hover, .handled-why:hover { color: var(--c-witness); }
.now-undo, .handled-undo {
  font-family: var(--f-mono); font-size: 11px; letter-spacing: 0.06em;
  color: var(--c-tx-2); background: none; border: 1px solid var(--c-border);
  border-radius: 999px; padding: 5px 10px; cursor: pointer;
}
.now-undo:hover, .handled-undo:hover { color: var(--c-witness); border-color: var(--c-witness-soft); }
.handled-list {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-direction: column; gap: 10px;
}
.handled-empty {
  margin: 0; font-size: 13px; color: var(--c-tx-3); line-height: 1.45;
}
:root.light .handled-empty {
  color: var(--c-tx-2);
  padding: 10px 12px;
  border-radius: var(--r-md);
  background: color-mix(in srgb, var(--c-surface) 88%, var(--c-witness-soft) 12%);
}
:root.light .surface-status.is-loading {
  color: var(--c-tx-2);
}
.handled-item {
  display: flex; justify-content: space-between; align-items: flex-start; gap: 12px;
  padding: 12px 14px; border-radius: var(--r-md);
  border: 1px solid var(--c-line); background: color-mix(in srgb, var(--c-bg-1) 88%, transparent);
}
.handled-item.is-resolved { border-color: color-mix(in srgb, var(--c-witness) 35%, var(--c-line)); }
.handled-item.is-staged { border-color: color-mix(in srgb, var(--c-accent-hard) 40%, var(--c-line)); }
.handled-item.is-failed { border-color: color-mix(in srgb, var(--c-danger) 35%, var(--c-line)); }
.handled-main { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.handled-claim {
  font-family: var(--f-sans); font-size: 14px; line-height: 1.35; color: var(--c-tx-1);
}
.handled-receipt {
  font-size: 12px; color: var(--c-tx-3); line-height: 1.35;
}
.handled-meta {
  display: flex; flex-direction: column; align-items: flex-end; gap: 4px; flex: none;
}
.handled-when {
  font-family: var(--f-mono); font-size: 9px; letter-spacing: 0.1em;
  text-transform: uppercase; color: var(--c-tx-3); opacity: 0.75;
}
.witness.is-observing .witness-pupil {
  animation: witnessBreathe 3.2s ease-in-out infinite;
}
#why-sheet .why-panel { max-width: 420px; }
#why-sheet .why-claim {
  font-family: var(--f-serif); font-size: 20px; line-height: 1.35;
  color: var(--c-tx-1); margin: 0 0 18px;
}
#why-sheet .why-facts { margin: 0; }
#why-sheet .why-row {
  display: grid; grid-template-columns: 7.5rem 1fr; gap: 8px 12px;
  padding: 10px 0; border-top: 1px solid var(--c-line);
}
#why-sheet .why-row dt {
  font-family: var(--f-mono); font-size: 9px; letter-spacing: 0.12em;
  text-transform: uppercase; color: var(--c-tx-3); margin: 0;
}
#why-sheet .why-row dd { margin: 0; font-size: 14px; line-height: 1.4; color: var(--c-tx-2); }
.docket-more-quiet {
  margin: 10px 2px 0; font-size: 12px; color: var(--c-tx-3);
}
.membrane .delta-actions {
  margin: 24px 0 0;
  grid-template-columns: 1fr auto;
}
.membrane > :not(.mythic-field):not(.night-stars) {
  position: relative;
  z-index: 1;
}
/* Sparse hand-set stars — the sky the witness sits in. Dark theme only. */
.night-stars {
  position: absolute; inset: 0; z-index: 0;
  pointer-events: none;
  color: #ead9b4;
  opacity: .42;
}
.night-stars svg { width: 100%; height: 100%; }
.night-stars circle {
  fill: currentColor; opacity: .14;
  animation: none;
}
.night-stars circle:nth-child(3n) { animation-delay: 2.6s; animation-duration: 10s; }
.night-stars circle:nth-child(3n + 1) { animation-delay: 5.2s; }
.night-stars circle:nth-child(4n) { animation-delay: 1.4s; animation-duration: 12s; }
@keyframes starTwinkle {
  0%, 100% { opacity: .08; }
  50% { opacity: .38; }
}
:root.light .night-stars { display: none; }
.mythic-field {
  position: absolute;
  z-index: 0;
  left: 50%; top: 48%;
  width: min(680px, 175vw);
  aspect-ratio: 1;
  transform: translate(-50%, -54%);
  color: var(--c-witness);
  opacity: .045;
  pointer-events: none;
  -webkit-mask-image: radial-gradient(circle, #000 0 42%, rgba(0,0,0,.72) 58%, transparent 78%);
  mask-image: radial-gradient(circle, #000 0 42%, rgba(0,0,0,.72) 58%, transparent 78%);
  animation: none;
}
.mythic-field svg { width: 100%; height: 100%; overflow: visible; }
.mythic-field g {
  stroke: currentColor;
  stroke-width: .7;
  vector-effect: non-scaling-stroke;
}
.mythic-rings { opacity: .45; }
.mythic-lotus, .mythic-triangles { display: none; }
.mythic-bindu { opacity: .9; }
@keyframes mythicBreathe {
  0%, 100% { opacity: .065; transform: translate(-50%, -54%) scale(.985); }
  50% { opacity: .105; transform: translate(-50%, -54%) scale(1.015); }
}
@keyframes membraneIn {
  from { opacity: 0; transform: translateY(14px) scale(.985); filter: blur(4px); }
  to { opacity: 1; transform: none; filter: none; }
}
.witness {
  position: relative;
  display: flex; flex-direction: column; justify-content: center; align-items: center;
  margin: 0 0 clamp(36px, 7vh, 56px); color: var(--c-witness);
  filter: drop-shadow(0 0 48px rgba(212, 176, 122, 0.32));
  animation: witnessArrive 1.1s cubic-bezier(.16,1,.3,1) .05s both;
}
/* Halo — lamp spill from the eye onto the sentence below. */
.witness::before {
  content: ""; position: absolute; z-index: -1;
  top: 50%; left: 50%;
  width: clamp(280px, 78vw, 380px); aspect-ratio: 1;
  transform: translate(-50%, -52%);
  border-radius: 50%;
  background: radial-gradient(circle,
    rgba(212, 176, 122, 0.28) 0%,
    rgba(212, 176, 122, 0.1) 42%,
    transparent 72%);
  animation: auraPulse 9s ease-in-out infinite;
}
@keyframes auraPulse {
  0%, 100% { opacity: .72; }
  50% { opacity: 1; }
}
@keyframes witnessArrive {
  from { opacity: 0; transform: scale(.88); }
  to { opacity: 1; transform: none; }
}
.witness-mark {
  width: min(176px, 46vw); height: auto;
  transform-origin: 50% 50%;
  /* Glow breathes — size stays put so register/chat transitions don’t resize the lamp. */
  animation: lampBreathe var(--lamp-breath, 7s) ease-in-out infinite;
  transition: width 320ms ease, opacity 280ms ease, filter 280ms ease;
}
.witness-core-glow {
  transform-origin: 50% 50%;
  animation: lampCorePulse var(--lamp-breath, 7s) ease-in-out infinite;
}
@keyframes lampBreathe {
  0%, 100% { opacity: .9; filter: drop-shadow(0 0 6px color-mix(in srgb, var(--lamp-core, var(--c-witness)) 22%, transparent)); }
  50% { opacity: 1; filter: drop-shadow(0 0 16px color-mix(in srgb, var(--lamp-core, var(--c-witness)) 34%, transparent)); }
}
@keyframes lampCorePulse {
  0%, 100% { opacity: .4; }
  50% { opacity: .72; }
}
@media (prefers-reduced-motion: reduce) {
  .witness-mark, .witness-core-glow, .witness-pupil, .witness-flame, .witness-bindu,
  .witness::before { animation: none !important; }
  .witness-core-glow { opacity: .55; }
}
.witness-name {
  margin-top: 10px;
  font-family: var(--f-mono); font-size: 7px; font-weight: 500;
  letter-spacing: .28em; text-transform: uppercase;
  color: var(--c-witness); opacity: .48;
}
@keyframes witnessFloat {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-5px); }
}
.witness-pupil {
  animation: witnessBreathe 5.5s ease-in-out infinite;
  transform-origin: center;
}
.witness-flame {
  animation: flamePulse 4.2s ease-in-out infinite;
  transform-origin: 60px 14px;
}
.witness-bindu {
  animation: binduGlow 3.6s ease-in-out infinite;
}
@keyframes flamePulse {
  0%, 100% { opacity: .45; transform: scaleY(1); }
  50% { opacity: .85; transform: scaleY(1.08); }
}
@keyframes binduGlow {
  0%, 100% { opacity: .55; }
  50% { opacity: 1; }
}

.membrane-copy {
  position: relative;
  padding: 0 0 24px;
}
/* A small lit bindu closes the thought — kin to the streak diamond. */
.membrane-copy::after {
  content: "";
  position: absolute; left: 2px; bottom: 2px;
  width: 6px; height: 6px; transform: rotate(45deg);
  background: color-mix(in srgb, var(--c-witness) 85%, transparent);
  box-shadow: 0 0 14px rgba(201, 164, 106, 0.55);
}
.membrane .greeting {
  font-family: var(--f-serif); font-style: normal; font-weight: 500;
  font-size: clamp(26px, 6.2vw, 34px); line-height: 1.3; color: var(--c-tx-1);
  margin: 0; text-wrap: balance; text-align: left;
  max-width: none; max-height: none; overflow: visible;
  font-variation-settings: "opsz" 56, "SOFT" 55;
  letter-spacing: -0.018em;
  animation: greetingSettle 1s cubic-bezier(.16,1,.3,1) .15s both;
}
/* Witness light on ink — cool paper, not candlelit cream. */
:root.dark .membrane .greeting {
  background: linear-gradient(168deg, #f2f0ea 4%, #c8c4ba 58%, #8a8a94 100%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
}
.membrane .greeting.is-silence {
  color: var(--c-tx-2);
  font-size: clamp(23px, 5.6vw, 29px);
}
.membrane .greeting.is-loading {
  color: var(--c-witness);
  font-size: clamp(20px, 4.8vw, 26px);
  opacity: 0.88;
}
body.membrane-loading .delta-actions.is-loading {
  opacity: 0.72;
  /* Keep acts tappable — hung agency refresh must not freeze Drop/Later/Reply. */
}
:root.dark .membrane .greeting.is-silence {
  background: none;
  -webkit-text-fill-color: currentColor;
}
.membrane .docket {
  margin: 20px 0 0;
  width: 100%;
}
.membrane .delta-actions {
  margin: 30px 0 0;
}
.delta-act-quiet {
  opacity: .5;
}
.delta-act-quiet:hover { opacity: .85; }
.delta-actions.is-quiet {
  grid-template-columns: 1fr;
  justify-items: stretch;
  max-width: 220px;
  margin-left: auto;
  margin-right: auto;
}
.delta-actions.is-quiet .delta-act-quiet {
  opacity: 0.72;
  border: 1px solid var(--c-line);
  width: 100%;
}
.delta-actions.is-quiet .delta-act-primary {
  background: transparent;
  color: var(--c-tx-2);
  border: 1px solid var(--c-line);
}
@keyframes greetingSettle {
  from { opacity: 0; transform: translateY(8px); letter-spacing: -0.01em; }
  to { opacity: 1; transform: none; letter-spacing: -0.025em; }
}
.membrane .greeting.reveal {
  animation: greetingSettle 1s cubic-bezier(.16,1,.3,1) both;
}
.membrane .greeting.settled {
  /* On membrane, delta stays — it is the home, not a chat opener to dismiss. */
  opacity: 1; max-height: none; margin: 0 2px 18px; transform: none;
  pointer-events: auto;
}

.delta-actions {
  display: grid;
  grid-template-columns: minmax(132px, 1.3fr) auto auto;
  align-items: center; gap: 10px;
  margin: 0 0 20px;
}
.delta-act {
  font-family: var(--f-sans); font-size: 13px; font-weight: 500;
  letter-spacing: 0.02em; text-transform: none;
  color: var(--c-tx-2);
  background: transparent;
  border: 1px solid color-mix(in srgb, var(--c-line) 85%, transparent);
  border-radius: var(--r-sm);
  min-height: 44px; padding: 10px 16px; cursor: pointer;
  transition: color 160ms, background 160ms, border-color 160ms, transform 160ms, box-shadow 200ms;
}
.delta-act:hover {
  color: var(--c-tx-1);
  border-color: color-mix(in srgb, var(--c-witness) 35%, var(--c-line));
  transform: translateY(-1px);
}
.delta-act-primary {
  color: #17130e;
  background: linear-gradient(180deg, #e8d9b8 0%, #c9a46a 100%);
  border: 1px solid transparent;
  padding: 10px 22px;
  justify-self: stretch;
  font-weight: 600;
  letter-spacing: 0.01em;
}
/* Soft gold paper — not a candy pill. */
:root.dark .delta-act-primary {
  color: #17130e;
  background: linear-gradient(180deg, #e6d4ad 0%, #c9a46a 100%);
  box-shadow:
    0 10px 28px rgba(201, 164, 106, 0.14),
    inset 0 1px 0 rgba(255, 255, 255, 0.35);
}
.delta-act-primary:hover {
  color: #17130e;
  background: linear-gradient(180deg, #f0e2c0 0%, #d4b07a 100%);
}
:root.dark .delta-act-primary:hover {
  color: #17130e;
  background: linear-gradient(180deg, #f0e2c0 0%, #d4b07a 100%);
  box-shadow:
    0 14px 36px rgba(201, 164, 106, 0.2),
    inset 0 1px 0 rgba(255, 255, 255, 0.4);
}
:root.dark .delta-actions.is-quiet .delta-act-primary {
  background: transparent;
  color: var(--c-tx-2);
  box-shadow: none;
  border: 1px solid var(--c-line);
}
.delta-act-quiet {
  opacity: .72;
  border-color: transparent;
  color: var(--c-tx-3);
}
.delta-act-quiet:hover { opacity: 1; color: var(--c-tx-1); border-color: var(--c-line); }
.delta-actions.is-quiet {
  grid-template-columns: 1fr;
  justify-items: stretch;
  max-width: 240px;
  margin-left: auto;
  margin-right: auto;
}
.delta-actions.is-quiet .delta-act-quiet {
  opacity: 0.8;
  border: 1px solid var(--c-line);
  width: 100%;
}
/* Ask face: Later · Reply · Drop */
.delta-actions.is-ask {
  grid-template-columns: 1fr 1fr 1fr;
  justify-items: stretch;
  max-width: 360px;
  margin-left: auto;
  margin-right: auto;
}
.delta-actions.is-ask .delta-act-quiet {
  opacity: 0.85;
  border: 1px solid var(--c-line);
  width: 100%;
}
.delta-actions.is-ask .delta-act {
  width: 100%;
  font-size: 12px;
  padding: 10px 8px;
}
.delta-actions.is-witnessed .delta-act-primary,
.delta-actions.is-witnessed .delta-act-primary.is-settled {
  color: var(--c-witness);
  background: color-mix(in srgb, var(--c-witness) 12%, transparent);
  border: 1px solid color-mix(in srgb, var(--c-witness) 35%, var(--c-line));
  box-shadow: none;
  cursor: default;
}
.delta-actions.is-witnessed .delta-act-primary:hover {
  transform: none;
  color: var(--c-witness);
}
.done-receipt {
  margin: 10px 0 0;
  font-family: var(--f-serif); font-size: 14px; font-style: italic;
  color: var(--c-witness); text-align: center;
  animation: riseIn .45s ease both;
}
.delta-act.hidden { display: none; }
.done-receipt.hidden { display: none; }

/* Membrane dispose: page locked (no phantom rubber-band). Content scrolls
   only when delta+docket exceed the viewport — short days stay still. */
body:has(#app.membrane-home:not(.hidden)):has(#conversation[hidden]):has(#composer.is-collapsed) {
  overflow: hidden;
  height: 100dvh;
  overscroll-behavior: none;
}
.wrap.membrane-home {
  display: flex;
  flex-direction: column;
  min-height: 100dvh;
  padding-top: max(12px, env(safe-area-inset-top, 0px));
  padding-bottom: max(10px, env(safe-area-inset-bottom));
}
body:has(#app.membrane-home:not(.hidden)):has(#conversation[hidden]):has(#composer.is-collapsed) .wrap.membrane-home {
  max-height: 100dvh;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-y;
}
.wrap.membrane-home .membrane {
  min-height: min(72dvh, 640px);
  flex: 1 0 auto;
  padding-bottom: 28px;
  /* One scroll owner only — nested overflow-y on .membrane traps Android touch. */
  overflow: visible;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.wrap.membrane-home .greeting {
  display: block;
  -webkit-line-clamp: unset;
  line-clamp: unset;
  overflow: visible;
  max-height: none;
  font-size: clamp(22px, 5.4vw, 34px);
  line-height: 1.28;
  letter-spacing: -0.02em;
  text-align: center;
  margin: 0 auto;
  max-width: 42ch;
  margin-bottom: 0;
}
.wrap.membrane-home .witness {
  margin: 0 0 clamp(28px, 5vh, 44px);
}
.wrap.membrane-home .witness-mark {
  width: min(164px, 42vw);
}
/* Speak lives in delta-actions on home — boiler composer only when summoned. */
.wrap.membrane-home .composer.is-boiler.is-collapsed { display: none; }
.wrap.membrane-home .composer.is-boiler:not(.is-collapsed) {
  display: block;
  flex-shrink: 0;
  margin-top: 12px;
}
/* Conversation summoned = compact witness mark; chat owns the viewport.
   Middle ground after quiet4’s 28px overcorrection — readable, not home-scale. */
body:has(#conversation.is-summoned:not([hidden])) .membrane .closed-loop-surface,
body:has(#conversation.is-summoned:not([hidden])) .membrane .delta-actions,
body:has(#conversation.is-summoned:not([hidden])) .membrane .done-receipt,
body:has(#conversation.is-summoned:not([hidden])) .home-nav {
  display: none !important;
}
body:has(#conversation.is-summoned:not([hidden])) .wrap.membrane-home {
  max-height: none;
  overflow-y: auto;
}
body:has(#conversation.is-summoned:not([hidden])) .wrap.membrane-home header.mast-quiet {
  padding: 2px 0 4px;
}
body:has(#conversation.is-summoned:not([hidden])) .wrap.membrane-home .membrane {
  flex: 0 0 auto;
  min-height: 0;
  padding: 0;
  overflow: visible;
  /* Chat owns the room — do not keep centering the membrane column. */
  align-items: stretch;
  justify-content: flex-start;
  text-align: left;
  max-width: none;
  margin: 0;
}
body:has(#conversation.is-summoned:not([hidden])) .wrap.membrane-home .witness {
  margin: 0 0 10px;
  filter: none;
  animation: none;
  align-self: center;
}
body:has(#conversation.is-summoned:not([hidden])) .wrap.membrane-home .witness::before {
  display: none;
}
body:has(#conversation.is-summoned:not([hidden])) .wrap.membrane-home .witness-mark {
  /* Compact vs home lamp, but still readable — 44px read as a bug. */
  width: clamp(96px, 14vw, 120px);
}
/* Speak owns the viewport — hide half-lamp staging chrome. */
body.membrane-speaking .wrap.membrane-home .witness-mark,
body.membrane-speaking .wrap.membrane-home .witness {
  display: none !important;
}
body.membrane-speaking .conversation-return-bar {
  padding-top: 4px;
  margin-bottom: 4px;
}
body.membrane-speaking .composer.is-docked {
  margin-top: 8px;
}
.membrane-handoff {
  padding: 12px 4px 8px;
}
.membrane-handoff-line {
  margin: 0;
  font-family: var(--f-serif);
  font-size: clamp(18px, 4.2vw, 24px);
  line-height: 1.35;
  color: var(--c-tx-2);
  letter-spacing: -0.015em;
}
/* Ask face: glance carries the ask — hide empty docket chrome. */
.wrap.membrane-home .greeting.asked ~ .docket:empty,
.wrap.membrane-home .greeting.asked ~ #docket.hidden {
  display: none !important;
}
body:has(#conversation.is-summoned:not([hidden])) .membrane .witness-name,
body:has(#conversation.is-summoned:not([hidden])) .membrane .greeting {
  display: none !important;
}
body:has(#conversation.is-summoned:not([hidden])) .conversation.is-summoned:not([hidden]) {
  flex: 1 1 auto;
  min-height: 0;
  width: 100%;
  max-width: none;
  align-self: stretch;
  margin-top: 0;
  padding-top: 2px;
  border-top: none;
  gap: 0;
}
body:has(#conversation.is-summoned:not([hidden])) .conversation.is-summoned .stage,
body:has(#conversation.is-summoned:not([hidden])) .conversation.is-summoned .live {
  width: 100%;
  max-width: 100%;
}
body:has(#conversation.is-summoned:not([hidden])) .live .entry {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  padding-top: 4px;
}
body:has(#conversation.is-summoned:not([hidden])) .conversation.is-summoned .stage {
  min-height: 0;
  margin: 0;
  justify-content: flex-start;
}
body:has(#conversation.is-summoned:not([hidden])) .history {
  padding-bottom: 4px;
  margin-bottom: 0;
}
body:has(#conversation.is-summoned:not([hidden])) .history .date-divider {
  margin: 6px 0 10px;
}
body:has(#conversation.is-summoned:not([hidden])) .history .entry {
  padding-top: 6px;
  padding-bottom: 12px;
}
body:has(#conversation.is-summoned:not([hidden])) .live .entry .ai-reply {
  margin-top: 8px;
}
body:has(#conversation.is-summoned:not([hidden])) .composer.is-docked {
  margin-top: 8px;
  width: 100%;
  align-self: stretch;
}
.speak-open-quiet {
  padding: 10px 16px !important;
  font-size: 13px !important;
  background: transparent !important;
  border: 1px solid var(--c-line) !important;
  box-shadow: none !important;
  animation: none !important;
  font-family: var(--f-mono) !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  font-weight: 500 !important;
}
.speak-open-quiet:hover {
  transform: none !important;
  border-color: var(--c-tx-3) !important;
}

/* Summoned conversation — hidden until Speak / live turn */
.conversation.is-summoned[hidden] { display: none !important; }
.conversation.is-summoned:not([hidden]) {
  display: flex; flex-direction: column; gap: 0;
  margin-top: 0;
  padding-top: 4px;
  border-top: none;
  animation: riseIn .4s ease both;
}
.conversation.is-summoned .stage {
  min-height: 0;
  margin-bottom: 0;
  justify-content: flex-start;
}

/* Collapsed composer — Speak is the invitation, not a waiting textarea */
.composer.is-collapsed .composer-panel { display: none; }
.composer.is-collapsed {
  border-bottom: none;
  margin-top: 8px;
  padding-bottom: 8px;
}
.composer:not(.is-collapsed) .speak-open { display: none; }
.composer:not(.is-collapsed) .composer-panel { display: block; }
.speak-open {
  display: inline-flex; align-items: center; gap: 10px;
  width: 100%;
  justify-content: center;
  background: color-mix(in srgb, var(--c-witness-soft) 55%, var(--c-bg-1));
  border: 1px solid color-mix(in srgb, var(--c-witness) 38%, var(--c-line));
  border-radius: 999px;
  color: var(--c-tx-1);
  padding: 16px 22px;
  cursor: pointer;
  font-family: var(--f-serif); font-weight: 550; font-size: 18px;
  letter-spacing: -0.01em;
  transition: background 200ms, border-color 200ms, transform 200ms, box-shadow 200ms;
  box-shadow: 0 0 0 0 transparent;
  animation: speakPulse 4.8s ease-in-out 1.2s infinite;
}
@keyframes speakPulse {
  0%, 100% { box-shadow: 0 0 0 0 transparent; }
  50% { box-shadow: 0 0 0 6px color-mix(in srgb, var(--c-witness) 8%, transparent); }
}
.speak-open:hover {
  border-color: var(--c-witness);
  transform: translateY(-2px);
  box-shadow: 0 12px 36px rgba(201, 164, 106, 0.14);
  animation: none;
}
.speak-open-eye {
  color: var(--c-witness);
  font-size: 14px;
  animation: witnessBreathe 5.5s ease-in-out infinite;
}
.speak-open-label { font-variation-settings: "opsz" 28; }
.speak-close {
  font-family: var(--f-ui, inherit);
  font-size: 0.92rem;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
  color: var(--c-tx-2, var(--c-tx-3)) !important;
  width: auto !important;
  min-height: 40px;
  padding: 8px 12px !important;
}

/* Membrane: witness eye is the brand — no letterhead box or diacritic wordmark. */
.wrap.membrane-home header.mast-quiet {
  background: transparent;
  padding: 4px 0 10px;
  flex-shrink: 0;
}
.wrap.membrane-home .mast-id { display: none; }
.wrap.membrane-home .head-right {
  width: 100%;
  justify-content: flex-end;
}
.wrap.membrane-home .home-nav {
  flex-shrink: 0;
  margin-top: auto;
  margin-bottom: 0;
  padding-top: 8px;
  opacity: .5;
  border-top: none;
  justify-content: space-between;
  gap: 20px;
}
.wrap.membrane-home .home-nav:hover { opacity: .82; }

/* Legacy header selectors still used when mast-quiet absent */
header {
  position: sticky; top: 0; z-index: 6;
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 14px;
  padding: 12px 0 14px;
  background: linear-gradient(180deg, var(--c-bg-0) 78%, color-mix(in srgb, var(--c-bg-0) 0%, transparent));
}
.wordmark, .head-right { position: relative; z-index: 1; }
.wordmark {
  display: block;
  font-family: var(--f-serif); font-weight: 600; font-style: normal;
  font-size: clamp(28px, 7vw, 36px); line-height: 1; color: var(--c-tx-1);
  letter-spacing: -0.02em;
  font-variation-settings: "opsz" 72, "SOFT" 50, "WONK" 0.4;
  text-transform: none;
}
/* the header's left cluster: glyph + wordmark/tagline stack. The glyph is a
   pure decoration, added as an ::before on a wrapping element via markup in
   index.html (.mast-glyph) — see below. */
.mast-id { display: flex; align-items: center; gap: 14px; }
@keyframes witnessBreathe {
  0%, 100% { opacity: .55; }
  50% { opacity: 1; }
}

/* Unlock and home share one witness mark — no separate doorway transition. */
.mast-text { display: flex; flex-direction: column; gap: 3px; }
.mast-tag {
  font-family: var(--f-mono); font-size: 7.5px; letter-spacing: 0.19em;
  color: var(--c-tx-3); opacity: .75; line-height: 1; text-transform: uppercase;
}
.head-right { display: flex; align-items: flex-start; gap: 4px; }
.mast-case {
  display: flex; flex-direction: column; align-items: flex-end; gap: 3px;
  margin-right: 2px; padding-top: 1px;
}
.case-title {
  font-family: var(--f-serif); font-weight: 600; font-size: 14px;
  letter-spacing: 0.06em; color: var(--c-tx-2); line-height: 1;
  text-transform: uppercase;
}
.today-label {
  color: var(--c-tx-3); font-size: 8px; letter-spacing: 0.16em;
  text-transform: uppercase; font-family: var(--f-mono); line-height: 1;
  opacity: .85;
}
.today-label::before { content: none; }
.mast-rule {
  height: 1px; margin: 12px 0 0; background: var(--c-line);
}

/* Letterhead strip — the log's "with care" framing, mono + tracked, faint.
   Pure chrome; the redacted SUBJECT is a wax-black bar, a wink at a case
   file, not a hidden real value. */
.case-strip {
  display: none !important; /* retired — cosplay chrome */
  position: relative; z-index: 1;
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  padding: 9px 1px 0; margin: 0 0 26px;
}
.case-strip-item {
  font-family: var(--f-mono); font-size: 8px; letter-spacing: 0.22em;
  text-transform: uppercase; color: var(--c-tx-3); opacity: .7;
  display: inline-flex; align-items: center; gap: 6px;
}
.case-strip .redacted {
  display: inline-block; color: transparent; background: var(--c-tx-1);
  opacity: .3; border-radius: 1px; letter-spacing: -0.1em; line-height: 1;
  transform: translateY(-0.5px);
}
.case-dot { width: 3px; height: 3px; transform: rotate(45deg); background: var(--c-tx-3); opacity: .5; flex: none; }
.ghost-btn {
  background: none; border: none; color: var(--c-tx-3); cursor: pointer;
  font-size: 16px; padding: 6px; border-radius: 6px;
  display: grid; place-items: center; line-height: 0;
  min-width: 44px; min-height: 44px;
  transition: color 140ms, background 140ms;
}
.ghost-btn:hover { color: var(--c-tx-1); background: var(--c-bg-2); }
.ghost-btn.on { color: var(--c-brand); }

/* Hands-free night mode: a secondary state layered on the already-on voice
   toggle, not a new button. */
#voice-toggle.handsfree { position: relative; color: var(--c-voice-hi); }
#voice-toggle.handsfree::after {
  content: ''; position: absolute; top: 4px; right: 4px;
  width: 5px; height: 5px; border-radius: 50%; background: var(--c-voice);
  animation: voicePulse 2.2s ease-in-out infinite;
}

/* ── The archive's living presence line ─────────────────────────────── */
.greeting {
  font-family: var(--f-serif); font-style: normal; font-weight: 500;
  font-size: clamp(26px, 6.2vw, 34px); line-height: 1.28; color: var(--c-tx-1);
  margin: 28px 2px 0; text-wrap: pretty;
  max-height: none; overflow: visible;
  font-variation-settings: "opsz" 48, "SOFT" 40;
  letter-spacing: -0.015em;
  transition: opacity 420ms ease, max-height 480ms cubic-bezier(.2,.7,.3,1),
              margin 360ms ease, transform 360ms ease;
}
.greeting.reveal {
  animation: greetIn .9s cubic-bezier(.16,1,.3,1) both;
}
@keyframes greetIn {
  from { opacity: 0; transform: translateY(14px); filter: blur(4px); }
  to { opacity: 1; transform: none; filter: none; }
}
.greeting b {
  font-weight: 600; font-style: normal; color: var(--c-tx-1);
}
/* Once he answers, the question yields — it does not linger above her reply. */
.greeting.settled {
  opacity: 0; max-height: 0; margin: 0; transform: translateY(-6px);
  pointer-events: none;
}

/* ── Docket timeline (≤3 segments) — quiet staged list, not a purple card ─ */
.docket {
  margin: 4px 0 8px;
  padding: 4px 0 0;
  border: none;
  border-left: none;
  background: none;
  border-radius: 0;
  backdrop-filter: none;
  animation: riseIn .55s ease .08s both;
}
.docket.hidden { display: none; }
.docket-restage {
  font-family: var(--f-serif); font-size: 13.5px; font-style: italic;
  font-weight: 400; letter-spacing: 0.01em; text-transform: none;
  color: var(--c-tx-3); margin: 0 0 12px;
}
.docket-timeline { display: flex; flex-direction: column; gap: 0; }
/* One held object — tag + claim, then Open on its own row (not jammed mid-label). */
.docket-seg {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  grid-template-areas:
    "organ label"
    "actions actions";
  gap: 8px 12px;
  align-items: start;
  padding: 14px 16px;
  border: 1px solid color-mix(in srgb, var(--c-witness) 16%, var(--c-line));
  border-radius: 14px;
  background: linear-gradient(175deg,
    color-mix(in srgb, var(--c-witness) 7%, transparent),
    transparent 72%);
}
.docket-seg:last-child { border-bottom: 1px solid color-mix(in srgb, var(--c-witness) 16%, var(--c-line)); }
.docket-organ {
  grid-area: organ;
  font-family: var(--f-mono); font-size: 8.5px; font-weight: 600;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--c-witness); opacity: .9;
  padding-top: 4px;
}
.docket-time {
  display: none;
}
.docket-seg-label {
  grid-area: label;
  min-width: 0;
  font-family: var(--f-sans); font-size: 14.5px; font-weight: 400;
  color: var(--c-tx-1); line-height: 1.35;
  letter-spacing: 0;
  white-space: normal;
  overflow: visible;
  text-overflow: unset;
}
.docket-seg.is-draft .docket-seg-label {
  white-space: normal;
}
.docket-seg-actions {
  grid-area: actions;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 2px 0 0;
  justify-content: flex-start;
}
.docket-drop, .docket-open, .docket-why, .docket-open-organ {
  font-family: var(--f-mono); font-size: 9px; font-weight: 600;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--c-tx-2); background: transparent;
  border: none; border-radius: 999px; padding: 7px 4px; cursor: pointer;
  transition: color 140ms, border-color 140ms;
  -webkit-tap-highlight-color: transparent;
}
.docket-open, .docket-open-organ {
  border: 1px solid color-mix(in srgb, var(--c-witness) 34%, var(--c-line));
  padding: 10px 16px;
  min-height: 44px;
  color: var(--c-witness);
}
.docket-drop:hover, .docket-why:hover { color: var(--c-tx-1); }
.docket-why {
  text-transform: lowercase;
  letter-spacing: 0.04em;
  font-weight: 500;
  opacity: 0.85;
}
.docket-open:hover, .docket-open-organ:hover {
  color: var(--c-tx-1);
  border-color: color-mix(in srgb, var(--c-witness) 60%, var(--c-line));
}
.docket-drop:disabled { opacity: 0.4; cursor: default; }
.docket-seg.is-draft .docket-organ { color: var(--c-witness); }
.docket-seg.is-draft .docket-open { color: var(--c-witness); }
.docket-more {
  display: block; width: 100%; margin-top: 10px;
  background: none; border: none; cursor: pointer; padding: 10px 2px;
  font-family: var(--f-sans); font-style: normal; font-size: 13px;
  letter-spacing: 0.01em;
  text-transform: none; color: var(--c-tx-3); text-align: right;
}
.docket-more:hover { color: var(--c-witness); }

#deeper-sheet .calibration { margin-bottom: 14px; }
#deeper-sheet .model-diff,
#deeper-sheet .consent-corridors { margin-bottom: 12px; }

.deeper-lede {
  margin: 0 0 18px;
  font-family: var(--f-sans); font-style: normal; font-size: 14px;
  color: var(--c-tx-3); line-height: 1.45;
}
.deeper-quiet {
  margin: 0;
  padding: 18px;
  font-family: var(--f-sans); font-style: normal; font-size: 15px;
  color: var(--c-tx-2);
  border: 1px solid var(--c-line);
  border-radius: 14px;
  background: color-mix(in srgb, var(--c-bg-2) 56%, transparent);
}
.deeper-quiet.hidden { display: none; }
.deeper-lede.hidden { display: none; }

.deeper-reading {
  margin-top: 8px;
  padding-top: 14px;
  border-top: 1px solid var(--c-line);
  display: flex; flex-direction: column; gap: 8px;
}
.deeper-reading.hidden { display: none; }
.deeper-read-head {
  font-family: var(--f-serif); font-size: 16px; font-weight: 600;
  letter-spacing: -0.01em; text-transform: none; color: var(--c-tx-1);
  margin: 0 0 4px;
}

.consent-corridors {
  font-size: 0.85rem;
  margin: 0.35rem 0 1rem;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--c-line);
}
.consent-corridors.hidden { display: none; }
.consent-head {
  font-family: var(--f-mono); font-size: 10px; font-weight: 600;
  letter-spacing: 0.12em; text-transform: uppercase; color: var(--c-witness);
  margin-bottom: 4px;
}
.consent-lede {
  font-family: var(--f-serif); font-size: 13px; color: var(--c-tx-3);
  margin: 0 0 10px; line-height: 1.4;
}
.consent-rows { display: flex; flex-direction: column; gap: 8px; }
.consent-row {
  display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: center;
  justify-content: space-between;
}
.consent-cap {
  font-family: var(--f-serif); font-size: 14px; color: var(--c-tx-1);
  min-width: 5.5rem;
}
.consent-lvs { display: inline-flex; flex-wrap: wrap; gap: 4px; }
.consent-lv {
  font-family: var(--f-mono); font-size: 9px; font-weight: 600;
  letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--c-tx-3); background: transparent;
  border: 1px solid var(--c-line); border-radius: 4px;
  padding: 4px 8px; cursor: pointer;
}
.consent-lv.is-on {
  color: var(--c-witness);
  border-color: color-mix(in srgb, var(--c-witness) 45%, var(--c-line));
  background: color-mix(in srgb, var(--c-witness) 8%, transparent);
}
.consent-lv:hover:not(.is-on) {
  color: var(--c-tx-1);
  border-color: color-mix(in srgb, var(--c-witness) 30%, var(--c-line));
}
.consent-summary {
  font-family: var(--f-serif); font-size: 13px; color: var(--c-tx-2);
  margin: 0; line-height: 1.4;
}

.wake-check {
  margin: 0.35rem 0 0.5rem;
  padding: 8px 6px 10px;
  border-top: 1px solid var(--c-line);
}
.settings-wake > summary {
  list-style: none;
  cursor: pointer;
  font-family: var(--f-mono); font-size: 10px; font-weight: 600;
  letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--c-tx-2); padding: 6px 0;
}
.settings-wake > summary::-webkit-details-marker { display: none; }
.settings-wake[open] > summary { color: var(--c-witness); }
.settings-wake .wake-lede { margin-top: 4px; }
.wake-lede {
  font-family: var(--f-serif); font-size: 13px; color: var(--c-tx-3);
  margin: 0 0 10px; line-height: 1.4;
}
.wake-verdict {
  font-family: var(--f-serif); font-size: 14px; color: var(--c-tx-2);
  margin: 0 0 10px; line-height: 1.4;
}
.wake-verdict.is-ready { color: var(--c-tx-1); }
.wake-status-list {
  list-style: none; margin: 0 0 10px; padding: 0;
  display: flex; flex-direction: column; gap: 4px;
}
.wake-status-list li {
  display: flex; justify-content: space-between; gap: 12px;
  font-size: 12px;
}
.wake-k {
  font-family: var(--f-mono); font-size: 10px; letter-spacing: 0.06em;
  text-transform: uppercase; color: var(--c-tx-3);
}
.wake-v {
  font-family: var(--f-serif); color: var(--c-tx-1); text-align: right;
}
.wake-actions {
  display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px;
}
.wake-pass { color: var(--c-witness); }
.wake-fail { color: var(--c-tx-3); }
.wake-note {
  width: 100%; box-sizing: border-box;
  font-family: var(--f-serif); font-size: 13px;
  background: transparent; color: var(--c-tx-1);
  border: 1px solid var(--c-line); border-radius: 4px;
  padding: 8px 10px; margin-bottom: 8px; resize: vertical;
}
.wake-check-log { display: flex; flex-direction: column; gap: 6px; }
.wake-log-empty {
  font-family: var(--f-serif); font-size: 12px; color: var(--c-tx-3);
  margin: 0; font-style: italic;
}
.wake-log-row {
  display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: baseline;
  font-size: 12px;
}
.wake-log-mark {
  font-family: var(--f-mono); font-size: 9px; font-weight: 600;
  letter-spacing: 0.1em; text-transform: uppercase;
}
.wake-log-row.is-pass .wake-log-mark { color: var(--c-witness); }
.wake-log-row.is-fail .wake-log-mark { color: var(--c-tx-3); }
.wake-log-when { font-family: var(--f-mono); font-size: 10px; color: var(--c-tx-3); }
.wake-log-note { font-family: var(--f-serif); color: var(--c-tx-2); flex: 1 1 100%; }

.calibration {
  margin: 0 0 12px;
  padding: 10px 0;
  border-radius: 0;
  border: none;
  border-bottom: 1px solid var(--c-line);
  background: none;
  display: flex; flex-wrap: wrap; gap: 8px; align-items: baseline;
  font-size: 12px;
  animation: riseIn .45s ease .1s both;
}
.calibration.hidden { display: none; }
.calibration.cal-quiet {
  border-color: color-mix(in srgb, var(--c-voice-hi) 35%, transparent);
  background: color-mix(in srgb, var(--c-voice-hi) 6%, transparent);
}
.cal-edge {
  font-family: var(--f-mono); font-weight: 600; text-transform: uppercase;
  letter-spacing: 0.12em; color: var(--c-witness); font-size: 9px;
}
.cal-summary {
  font-family: var(--f-serif); color: var(--c-tx-1); flex: 1 1 200px;
  font-size: 13px; line-height: 1.4;
}
.cal-n {
  font-family: var(--f-mono); color: var(--c-tx-3);
  font-variant-numeric: tabular-nums; font-size: 10px;
}

/* ── Stage: one living exchange owns the first viewport ─────────────── */
.stage {
  position: relative;
  margin: 0 0 8px;
  min-height: min(42vh, 320px);
  display: flex; flex-direction: column; justify-content: flex-end;
}
.stage.has-live { min-height: 0; justify-content: flex-start; margin-bottom: 4px; }
.live:empty { display: none; }
.live .entry {
  padding-top: 6px;
  animation: riseIn .55s cubic-bezier(.2,.7,.3,1) both;
}
/* Live turn: two voices in one room — same scale, calm hierarchy.
   Billboard Fraunces + muted user dust was unreadable (quiet-room fix). */
.live .entry.has-reply .entry-body {
  font-size: 16.5px; line-height: 1.55; color: var(--c-tx-1);
  transition: color 280ms ease;
}
.live .entry .ai-reply {
  margin-top: 14px;
  padding-left: 14px;
  border-left: 2px solid var(--c-voice-soft);
  animation: replyArrive .75s cubic-bezier(.16,1,.3,1) both;
}
.live .entry .ai-reply .who {
  font-size: 9px; letter-spacing: 0.16em; margin-bottom: 6px;
}
.live .entry .ai-reply .what {
  font-family: var(--f-sans); font-weight: 450;
  font-size: 17px;
  line-height: 1.55; color: var(--c-tx-1);
  font-variation-settings: normal;
  letter-spacing: 0;
}
.live .entry .reply-toggle {
  margin-top: 14px;
  color: var(--c-voice-hi);
  letter-spacing: 0.12em;
}
.live .entry .reply-toggle:hover { letter-spacing: 0.16em; }
/* Live turn: no time-gutter spine — this is a conversation, not a ledger row. */
.live .entry {
  display: block;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  padding-left: 0;
  grid-template-columns: none;
}
.live .entry-head {
  display: flex; flex-direction: row; align-items: center; gap: 10px;
  margin-bottom: 8px;
}
.live .entry-body,
.live .thread,
.live .entry-image-wrap,
.live .entry-image,
.live .reply-toggle,
.live .reply-row,
.live .entry-edit-area,
.live .entry-edit-row {
  grid-column: auto; grid-row: auto;
}

/* ── Composer — underline-only, like the mockup's input row, but keeping
   every original control (mic waveform, photo attach, mood row, hint,
   Keep button) that the prototype's stripped-down demo never needed. ── */
.composer {
  position: relative;
  background: none;
  border: none; border-bottom: 1px solid var(--c-line);
  border-radius: 0;
  padding: 0 0 16px;
  margin-top: 18px;
  transition: border-color 160ms;
}
.composer:focus-within { border-color: var(--c-brand); }
.composer textarea {
  width: 100%; border: none; background: none; resize: none; outline: none;
  color: var(--c-tx-1); font-family: var(--f-sans); font-weight: 400;
  font-size: 17px; line-height: 1.45; min-height: 38px; max-height: 144px;
  height: 38px; padding: 7px 0 4px; overflow-y: hidden;
}
.composer textarea::placeholder {
  color: var(--c-tx-3); font-family: var(--f-sans); font-style: normal;
  font-size: 18px;
}
.composer-bar { display: flex; align-items: center; gap: 10px; margin-top: 4px; }
.composer-bar .spacer { flex: 1; }
.hint {
  color: var(--c-tx-3); font-size: 9.5px; letter-spacing: 0.08em;
  font-family: var(--f-mono); text-transform: uppercase;
}

/* F5 mood tag row: understated underline-tab pills, echoing the mockup's
   quick-reply chips (bottom-border-only buttons, no fill, no pill shape). */
.mood-row { display: flex; gap: 4px; margin-top: 12px; flex-wrap: wrap; }
.mood-btn {
  background: none; border: none; border-bottom: 1px solid var(--c-line);
  color: var(--c-tx-3);
  cursor: pointer; font-family: var(--f-sans); font-size: 12.5px;
  letter-spacing: 0; text-transform: none;
  padding: 2px 8px 4px; border-radius: 0;
  transition: color 140ms, border-color 140ms;
}
.mood-btn:hover { color: var(--c-tx-1); border-color: var(--c-tx-3); }
.mood-btn.selected {
  border-color: var(--c-brand); color: var(--c-brand-hi);
}

/* Mic / photo — small ring-icon circular buttons, matching the mockup's
   composer "speak" glyph (a ring + centered dot) rather than a filled pill. */
.mic-btn, .photo-btn {
  width: 32px; height: 32px; border-radius: 50%; flex: none; position: relative;
  border: 1px solid var(--c-line); background: none;
  color: var(--c-tx-2); cursor: pointer; display: grid; place-items: center;
  transition: color 140ms, border-color 140ms, background 140ms;
}
.mic-btn:hover, .photo-btn:hover { color: var(--c-tx-1); border-color: var(--c-tx-3); }
.mic-btn:active, .photo-btn:active { transform: scale(.94); }
.mic-btn svg, .photo-btn svg { width: 14px; height: 14px; }
.mic-btn.live {
  background: var(--c-brand-soft); border-color: var(--c-brand);
  color: var(--c-brand-hi); animation: pulse 1.7s ease-in-out infinite;
}
.mic-wave {
  position: absolute; inset: 0; display: flex; align-items: center;
  justify-content: center; gap: 2px; opacity: 0; transform: scale(.6);
  transition: opacity .18s ease, transform .18s ease; pointer-events: none;
}
.mic-wave i {
  width: 2px; height: 12px; border-radius: 2px; background: currentColor;
  transform: scaleY(.28); transform-origin: center;
}
.mic-btn.live > svg { opacity: 0; transform: scale(.6); transition: opacity .18s, transform .18s; }
.mic-btn.live .mic-wave { opacity: 1; transform: scale(1); }
.mic-btn.live .mic-wave i { animation: fluteGlow 1.05s ease-in-out infinite; opacity: .85; }
.mic-btn.live .mic-wave i:nth-child(1) { animation-delay: 0s; }
.mic-btn.live .mic-wave i:nth-child(2) { animation-delay: .11s; }
.mic-btn.live .mic-wave i:nth-child(3) { animation-delay: .22s; }
.mic-btn.live .mic-wave i:nth-child(4) { animation-delay: .33s; }
.mic-btn.live .mic-wave i:nth-child(5) { animation-delay: .44s; }
.mic-btn.transcribing {
  background: var(--c-tx-3); border-color: var(--c-tx-3);
  color: var(--c-tx-1); animation: pulse 1.1s ease-in-out infinite;
  pointer-events: none;
}
@keyframes fluteGlow {
  0%, 100% { opacity: .55; transform: scaleY(.5); }
  50% { opacity: 1; transform: scaleY(1); }
}
@keyframes pulse {
  0%, 100% { box-shadow: 0 0 0 0 var(--c-brand-soft); }
  50% { box-shadow: 0 0 0 8px rgba(168, 154, 128, 0); }
}

.photo-preview {
  position: relative; display: inline-block; margin-top: 10px;
  width: 64px; height: 64px;
}
.photo-preview img {
  width: 100%; height: 100%; object-fit: cover;
  border-radius: 4px; border: 1px solid var(--c-line); display: block;
}
.photo-preview.hidden { display: none; }
.photo-remove-btn {
  position: absolute; top: -7px; right: -7px; width: 20px; height: 20px;
  border-radius: 50%; border: 1px solid var(--c-line); background: var(--c-bg-1);
  color: var(--c-tx-2); cursor: pointer; display: grid; place-items: center;
  font-size: 13px; line-height: 1; padding: 0; transition: color 140ms, border-color 140ms;
}
.photo-remove-btn:hover { color: var(--c-tx-1); border-color: var(--c-brand); }

.send-btn,
.keep-btn {
  background: var(--c-brand); color: var(--c-bg-0); border: 1px solid var(--c-brand);
  font-family: var(--f-serif); font-weight: 600; font-size: 14px;
  letter-spacing: 0.03em; text-transform: none;
  padding: 10px 18px; border-radius: 2px;
  transition: border-color 140ms, color 140ms, background 140ms, transform 140ms;
}
.send-btn:hover,
.keep-btn:hover { background: var(--c-brand-hi); border-color: var(--c-brand-hi); color: var(--c-bg-0); }
.send-btn:active,
.keep-btn:active { transform: translateY(1px); }
.send-btn:disabled,
.keep-btn:disabled { opacity: 0.4; cursor: default; }
.composer.is-empty .send-btn:not(:disabled) {
  background: transparent;
  border-color: var(--c-line);
  color: var(--c-tx-3);
}
.composer.is-empty .send-btn { opacity: .55; }

/* ── On this day — a resurfaced entry, set apart above the archive ──── */
.otd-card {
  margin-top: 22px;
  background: none;
  border: none;
  border-top: 1px solid var(--c-line);
  border-radius: 0;
  padding: 18px 2px 4px;
}
.otd-label {
  display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap;
  font-family: var(--f-mono); font-size: 9.5px; letter-spacing: 0.16em;
  text-transform: uppercase; color: var(--c-tx-3); font-weight: 500;
  margin-bottom: 10px;
}
.otd-when {
  color: var(--c-tx-3); font-size: 12px; letter-spacing: 0.1em;
  text-transform: uppercase; font-weight: 400; white-space: nowrap;
  font-family: var(--f-mono);
}
.otd-body {
  font-family: var(--f-sans); font-size: 17px; line-height: 1.55;
  color: var(--c-tx-2);
}
.otd-riff-btn {
  margin-top: 13px; background: none; border: none;
  border-bottom: 1px solid var(--c-line);
  color: var(--c-tx-3); border-radius: 0; padding: 2px 2px 4px; cursor: pointer;
  font-family: var(--f-sans); font-size: 12px; letter-spacing: 0;
  text-transform: none; transition: border-color 140ms, color 140ms;
}
.otd-riff-btn:hover { border-color: var(--c-brand); color: var(--c-brand-hi); }
.otd-riff-btn:disabled { opacity: 0.5; cursor: default; }
.otd-riff { margin-top: 14px; }

/* ── Conversation column: history above, living turn below ──────────── */
.conversation {
  display: flex; flex-direction: column; gap: 0;
  min-height: 0;
}
.history:empty { display: none; }
.history {
  position: relative;
  padding-bottom: 8px;
  margin-bottom: 4px;
}
.history .entry {
  opacity: 0.88;
}
.history .entry-body {
  font-size: 16px; color: var(--c-tx-1);
}
.history .ai-reply .what {
  font-family: var(--f-sans); font-size: 16.5px; color: var(--c-tx-1);
}
.history .feed-more {
  display: block; width: 100%; margin: 0 0 16px;
  background: none; border: none; border-bottom: 1px solid var(--c-line);
  color: var(--c-tx-3); cursor: pointer; padding: 8px 0;
  font-family: var(--f-mono); font-size: 10px; letter-spacing: 0.12em;
  text-transform: uppercase; text-align: center;
}
.history .feed-more:hover { color: var(--c-brand-hi); border-color: var(--c-brand); }
.history .feed-more:disabled { opacity: 0.5; cursor: default; }

.composer.is-docked {
  position: sticky; bottom: 0; z-index: 5;
  margin-top: 12px;
  padding: 10px 0 max(14px, env(safe-area-inset-bottom));
  /* Opaque dock — transparent gradient let placeholder bleed over chat. */
  background: var(--c-bg-0);
  border-top: 1px solid var(--c-line);
  border-bottom: none;
  box-shadow: 0 -12px 24px color-mix(in srgb, var(--c-bg-0) 88%, transparent);
}
.composer.is-docked:focus-within {
  border-bottom: none;
}
.composer.is-docked textarea { min-height: 38px; }
body:has(#conversation.is-summoned:not([hidden])) .composer.is-docked textarea::placeholder {
  opacity: .35;
}

/* ── Home nav ───────────────────────────────────────────────────────── */
.home-nav {
  display: flex; gap: 20px; align-items: center; justify-content: space-between;
  flex-wrap: nowrap;
  margin: 28px 0 0; padding-top: 8px;
  border-top: none;
  opacity: 0.55;
}
.home-nav:hover { opacity: 0.85; }
.home-nav-btn {
  background: transparent;
  border: none;
  border-radius: 0;
  color: var(--c-tx-3); cursor: pointer; min-height: 44px; padding: 10px 0;
  font-family: var(--f-mono); font-size: 10px; letter-spacing: 0.16em;
  text-transform: lowercase; transition: color 140ms, opacity 140ms;
}
.home-nav-btn:hover:not(:disabled) {
  color: var(--c-witness);
}
.home-nav-btn:disabled,
.home-nav-btn.is-empty { opacity: 0.4; cursor: default; }

/* ── Sheets: rented tools over the membrane ─────────────────────────── */
body.sheet-open { overflow: hidden; }
.sheet {
  position: fixed; inset: 0; z-index: 40;
  display: flex; align-items: flex-end; justify-content: center;
  background: rgba(4, 5, 10, 0.78);
  backdrop-filter: blur(6px);
  padding: 12px 10px max(12px, env(safe-area-inset-bottom));
  animation: riseIn .28s ease both;
}
.sheet.hidden { display: none !important; }
.sheet-panel {
  width: 100%; max-width: 600px;
  max-height: min(78vh, 720px);
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--c-witness) 5%, var(--c-bg-1)), var(--c-bg-1) 24%),
    var(--c-bg-1);
  border: 1px solid color-mix(in srgb, var(--c-witness) 18%, var(--c-line));
  border-radius: 18px 18px 0 0;
  display: flex; flex-direction: column;
  overflow: hidden;
  box-shadow: 0 -20px 70px rgba(0, 0, 0, 0.4);
  animation: replyIn .32s cubic-bezier(.2,.8,.3,1) both;
}
#deeper-sheet .deeper-panel {
  max-height: min(90dvh, 780px);
  border-radius: 24px 24px 0 0;
  background: var(--c-bg-1);
}
.sheet-head-copy { min-width: 0; }
.sheet-head-copy p {
  margin: 5px 0 0;
  color: var(--c-tx-2);
  font: 13px/1.4 var(--f-sans);
}
#deeper-sheet .deeper-head {
  align-items: flex-start;
  padding: 20px 18px 16px;
}
#deeper-sheet .deeper-body {
  gap: 12px;
  padding: 14px 14px max(22px, env(safe-area-inset-bottom));
  font-family: var(--f-sans);
}
.sheet-panel-tall { max-height: min(88vh, 860px); }
.sheet-head {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; flex: none;
  padding: 16px 16px 12px;
  border-bottom: 1px solid color-mix(in srgb, var(--c-witness) 14%, var(--c-line));
}
.sheet-title {
  font-family: var(--f-serif); font-weight: 600; font-size: clamp(18px, 4.5vw, 22px);
  letter-spacing: -0.02em; text-transform: none; color: var(--c-tx-1);
  line-height: 1.15;
}
.sheet-close {
  background: color-mix(in srgb, var(--c-bg-2) 80%, transparent);
  border: 1px solid var(--c-line); color: var(--c-tx-2);
  border-radius: 999px; min-width: 64px; min-height: 44px; padding: 7px 14px; cursor: pointer;
  font-family: var(--f-sans); font-size: 14px; font-weight: 500; letter-spacing: 0;
  text-transform: none; transition: border-color 140ms, color 140ms, background 140ms;
}
.sheet-close:hover {
  border-color: color-mix(in srgb, var(--c-witness) 40%, var(--c-line));
  color: var(--c-witness); background: color-mix(in srgb, var(--c-witness-soft) 50%, var(--c-bg-2));
}
.sheet-body {
  padding: 14px 16px 20px;
  flex: 1 1 auto;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  display: flex; flex-direction: column; gap: 10px;
}
.sheet-body #read-slot,
.sheet-body #loops-slot,
.sheet-body #patterns-slot,
.sheet-body #orbit-slot {
  margin: 0; text-align: center;
}
.sheet-feed {
  flex: 1; overflow-y: auto;
  margin: 0; padding: 12px 16px 28px;
}
.rooms-foot {
  flex: none;
  padding: 8px 16px max(14px, env(safe-area-inset-bottom));
  border-top: 1px solid color-mix(in srgb, var(--c-witness) 12%, var(--c-line));
}
.rooms-foot .ghost-btn {
  width: 100%;
  min-height: 44px;
  font-family: var(--f-sans);
  font-size: 14px;
  color: var(--c-tx-2);
}
.onboarding-sheet.sheet {
  flex-direction: column;
  align-items: stretch;
  background:
    radial-gradient(55% 42% at 50% 6%, var(--c-lamp, rgba(201, 164, 106, 0.14)), transparent 70%),
    var(--c-bg-0);
  backdrop-filter: none;
  padding: max(12px, env(safe-area-inset-top)) 18px max(16px, env(safe-area-inset-bottom));
}
.onboarding-sheet .sheet-panel,
.onboarding-sheet .onboarding-panel {
  width: 100%;
  max-width: 520px;
  max-height: none;
  height: 100%;
  margin: 0 auto;
  background: transparent;
  border: none;
  border-radius: 0;
  box-shadow: none;
  display: flex;
  flex-direction: column;
  min-height: 0;
  overflow: hidden;
  animation: membraneIn .7s cubic-bezier(.16,1,.3,1) both;
}
.onboarding-sheet .sheet-head {
  flex: 0 0 auto;
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  padding: 12px 0 18px;
  border-bottom: none;
}
.onboarding-sheet .sheet-head-copy {
  flex: 1 1 auto;
  min-width: 0;
}
.onboarding-sheet .sheet-title {
  font-family: var(--f-serif);
  font-size: clamp(26px, 7vw, 34px);
  font-weight: 500;
  letter-spacing: -0.02em;
  color: var(--c-tx-1);
  text-transform: none;
}
.onboarding-sheet #onboard-meta,
.onboarding-sheet .rooms-lede {
  margin: 8px 0 0;
  font: 500 11px/1.4 var(--f-mono);
  letter-spacing: 0.06em;
  text-transform: none;
  color: var(--c-tx-3);
  opacity: 0.75;
}
.onboarding-sheet .sheet-close,
.onboarding-sheet #onboard-skip.sheet-close {
  flex: 0 0 auto;
  align-self: flex-start;
  width: auto;
  max-width: 5.5rem;
  height: auto;
  font: 500 11px/1 var(--f-mono);
  letter-spacing: 0.12em;
  text-transform: lowercase;
  color: var(--c-tx-3);
  background: transparent;
  border: none;
  border-radius: 0;
  min-width: auto;
  min-height: 40px;
  padding: 8px 0 8px 10px;
  opacity: 0.7;
}
.onboarding-panel.is-conversation #onboard-skip {
  display: none !important;
}
.onboarding-sheet .sheet-close:hover { color: var(--c-witness); opacity: 1; }
.onboarding-body {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 8px 0 0;
  flex: 1;
  min-height: 0;
  width: 100%;
  max-width: 100%;
  /* Scroll the transcript only — never put a sticky dock inside this scroller
     (real bug: composer covered the latest dig and scrolling felt broken). */
  overflow: hidden;
}
.onboarding-scroll {
  flex: 1 1 auto;
  min-height: 0;
  width: 100%;
  max-width: 100%;
  overflow-y: auto;
  overscroll-behavior: contain;
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 0 0 12px;
  -webkit-overflow-scrolling: touch;
}
.onboarding-dock {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding-top: 10px;
  border-top: 1px solid color-mix(in srgb, var(--c-line) 70%, transparent);
  background: var(--c-bg-0);
}
.onboard-prompt {
  margin: 0;
  font: 450 clamp(20px, 5.2vw, 26px)/1.35 var(--f-serif);
  color: var(--c-tx-1);
  letter-spacing: -0.015em;
  text-wrap: balance;
}
.onboard-prompt.hidden { display: none !important; }
.onboard-hint {
  margin: 0;
  font: 14px/1.5 var(--f-sans);
  color: var(--c-tx-3);
  max-width: 36em;
}
.onboard-hint.hidden { display: none !important; }
/* Conversation mode: same Presence voice ledger, not a form page of prompts. */
.onboard-thread {
  display: flex;
  flex-direction: column;
  gap: 18px;
  margin: 0;
  padding: 0 0 8px;
  min-height: 0;
}
.onboard-thread.hidden { display: none !important; }
.onboard-turn {
  animation: onboard-turn-in 280ms ease-out both;
}
/* Typing chrome must stay put across SSE thinking heartbeats — no re-fade. */
.onboard-turn.onboard-typing {
  animation: none;
}
.onboard-turn-her {
  position: relative;
  padding: 0 0 0 14px;
  border-left: 2px solid var(--c-voice-soft, color-mix(in srgb, var(--c-witness) 55%, transparent));
}
.onboard-turn-him {
  padding: 0 0 0 2px;
}
.onboard-turn .who {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 0 0 6px;
  font-family: var(--f-mono);
  font-size: 8.5px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--c-voice-hi, var(--c-witness));
  font-weight: 500;
}
.onboard-turn-him .who {
  color: var(--c-tx-3);
}
.onboard-turn-her .who::before {
  content: "";
  width: 5px;
  height: 5px;
  transform: rotate(45deg);
  background: var(--c-voice, var(--c-witness));
  flex: none;
}
.onboard-turn .what {
  margin: 0;
  font-family: var(--f-sans);
  font-size: 17px;
  line-height: 1.55;
  color: var(--c-tx-1);
  white-space: pre-wrap;
  text-wrap: pretty;
  overflow: visible;
  overflow-wrap: break-word;
  max-height: none;
}
.onboard-turn-him .what {
  font-size: 16px;
  color: var(--c-tx-2);
}
@keyframes onboard-turn-in {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: none; }
}
.onboard-typing .what {
  min-height: 1.55em;
  display: flex;
  align-items: center;
}
.onboard-typing-dots {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: var(--c-voice-hi, var(--c-witness));
}
.onboard-typing-dots span {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: currentColor;
  opacity: 0.28;
  animation: onboard-typing-dot 1.15s ease-in-out infinite;
}
.onboard-typing-dots span:nth-child(2) { animation-delay: 0.18s; }
.onboard-typing-dots span:nth-child(3) { animation-delay: 0.36s; }
@keyframes onboard-typing-dot {
  0%, 80%, 100% { opacity: 0.22; transform: translateY(0); }
  40% { opacity: 0.85; transform: translateY(-2px); }
}
.onboard-turn-her.is-typing-out .what {
  border-right: 1.5px solid color-mix(in srgb, var(--c-voice, var(--c-witness)) 55%, transparent);
  padding-right: 2px;
  animation: onboard-caret-blink 0.9s step-end infinite;
}
@keyframes onboard-caret-blink {
  50% { border-right-color: transparent; }
}
.onboarding-panel.is-conversation .sheet-head-copy .sheet-title {
  font-size: clamp(18px, 4.4vw, 22px);
}
.onboarding-panel.is-conversation #onboard-meta {
  font-size: 11px;
  letter-spacing: 0.04em;
}
.onboard-composer {
  margin: 0;
  padding: 0;
  background: transparent;
}
.onboard-input {
  width: 100%;
  min-height: 88px;
  resize: vertical;
  border-radius: var(--r-sm, 6px);
  border: 1px solid var(--c-line);
  background: color-mix(in srgb, var(--c-bg-1) 80%, transparent);
  color: var(--c-tx-1);
  padding: 14px 14px;
  font: 16px/1.5 var(--f-sans);
}
.onboarding-panel.is-conversation .onboard-input {
  min-height: 72px;
}
.onboard-input:focus {
  border-color: color-mix(in srgb, var(--c-witness) 45%, var(--c-line));
  outline: none;
}
.onboard-input::placeholder { color: var(--c-tx-3); opacity: .65; }
.onboard-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px;
  margin-top: 0;
  padding-top: 4px;
  padding-bottom: max(4px, env(safe-area-inset-bottom));
  position: relative;
  z-index: 2;
}
.onboarding-sheet .onboard-actions .delta-act {
  min-width: 7.5rem;
  position: relative;
  z-index: 2;
}
.onboarding-sheet .onboard-actions .onboard-ask-again {
  pointer-events: auto;
}
.onboarding-sheet .onboard-actions .delta-act-quiet {
  border: none;
  opacity: 0.7;
  padding-left: 4px;
  padding-right: 4px;
}
.onboarding-sheet .onboard-actions .onboard-ask-again.hidden {
  display: none !important;
}
.onboard-dig-error .what {
  color: var(--c-tx-2);
  font-style: italic;
}
body.onboarding-active .membrane {
  filter: none;
  opacity: 0;
  pointer-events: none;
}
body.onboarding-active .onboarding-sheet {
  z-index: 80;
}
body.onboarding-active .home-nav,
body.onboarding-active header.mast-quiet {
  opacity: 0;
  pointer-events: none;
}

/* ── Chapter dig: Speak/chamber chrome (title kept; no onboarding form dock) ─ */
.chapter-sheet {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: flex;
  align-items: stretch;
  justify-content: center;
  background: var(--c-bg-0);
  backdrop-filter: none;
  padding: max(12px, env(safe-area-inset-top)) 18px max(16px, env(safe-area-inset-bottom));
}
.chapter-sheet.hidden { display: none !important; }
.chapter-sheet .chapter-panel {
  width: 100%;
  max-width: 520px;
  max-height: none;
  height: 100%;
  margin: 0 auto;
  background: transparent;
  border: none;
  border-radius: 0;
  box-shadow: none;
  display: flex;
  flex-direction: column;
  min-height: 0;
  overflow: hidden;
  animation: membraneIn .7s cubic-bezier(.16,1,.3,1) both;
}
.chapter-return-bar {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  padding: 4px 2px 10px;
  position: sticky;
  top: 0;
  z-index: 3;
  background: linear-gradient(180deg, color-mix(in srgb, var(--c-bg-0) 92%, transparent) 60%, transparent);
}
.chapter-return-bar .presence-return {
  margin: 0;
  padding-left: 0;
}
.chapter-head-copy {
  width: 100%;
  min-width: 0;
  padding: 0 2px 2px;
}
.chapter-title {
  display: block;
  font-family: var(--f-serif);
  font-size: clamp(20px, 5vw, 26px);
  font-weight: 500;
  letter-spacing: -0.02em;
  color: var(--c-tx-1);
  line-height: 1.2;
}
.chapter-why {
  margin: 4px 0 0;
  font: 500 11px/1.4 var(--f-mono);
  letter-spacing: 0.06em;
  color: var(--c-tx-3);
  opacity: 0.75;
}
.chapter-body {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 4px 0 0;
  flex: 1;
  min-height: 0;
  width: 100%;
  overflow: hidden;
}
.chapter-scroll {
  flex: 1 1 auto;
  min-height: 0;
  width: 100%;
  overflow-y: auto;
  overscroll-behavior: contain;
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 0 0 8px;
  -webkit-overflow-scrolling: touch;
}
.chapter-thread {
  display: flex;
  flex-direction: column;
  gap: 0;
  width: 100%;
  padding: 2px 0 8px;
}
.chapter-thread.hidden { display: none !important; }
.chapter-thread .ai-reply {
  margin-top: 14px;
}
.chapter-thread .ai-reply:first-child {
  margin-top: 4px;
}
.chapter-thread .user-reply {
  margin-top: 14px;
}
.chapter-thread .ai-reply.is-latest,
.chapter-thread .user-reply.is-latest {
  animation: replyArrive .75s cubic-bezier(.16,1,.3,1) both;
}
.chapter-composer {
  flex: 0 0 auto;
  margin-top: 8px;
  width: 100%;
  align-self: stretch;
  padding-bottom: max(4px, env(safe-area-inset-bottom));
}
.chapter-composer.hidden { display: none !important; }
.chapter-composer textarea {
  width: 100%;
  border: none;
  background: none;
  resize: none;
  outline: none;
  color: var(--c-tx-1);
  font-family: var(--f-sans);
  font-weight: 400;
  font-size: 17px;
  line-height: 1.45;
  min-height: 38px;
  max-height: 144px;
  padding: 7px 0 4px;
  overflow-y: hidden;
}
.chapter-composer textarea::placeholder {
  color: var(--c-tx-3);
  font-family: var(--f-sans);
  font-style: normal;
  font-size: 18px;
}
.chapter-composer textarea.hidden,
.chapter-composer textarea[hidden] {
  display: none !important;
}
.chapter-synthesis {
  width: 100%;
  min-height: 40vh;
  resize: vertical;
  border: none;
  border-bottom: 1px solid var(--c-line);
  border-radius: 0;
  background: transparent;
  color: var(--c-tx-1);
  padding: 8px 0 12px;
  font: 450 16.5px/1.55 var(--f-sans);
  outline: none;
}
.chapter-synthesis:focus {
  border-bottom-color: var(--c-brand);
}
.chapter-synthesis.hidden { display: none !important; }
.chapter-panel.is-synthesis .chapter-composer {
  border-top: none;
}
body.chapter-active .membrane {
  filter: none;
  opacity: 0;
  pointer-events: none;
}
body.chapter-active .chapter-sheet {
  z-index: 80;
}
body.chapter-active .home-nav,
body.chapter-active header.mast-quiet {
  opacity: 0;
  pointer-events: none;
}

/* ── The ledger (inside the archive sheet only) ─────────────────────── */
.feed { position: relative; margin-top: 0; }
.feed::before {
  content: ""; position: absolute; left: 52px; top: 4px; bottom: 4px;
  width: 1px;
  background: linear-gradient(var(--c-line), var(--c-line) 8%, var(--c-line) 92%, transparent);
}
/* Archive rows stay quieter than the stage — a record, not the conversation. */
.feed .entry-body {
  font-size: 15.5px; color: var(--c-tx-2);
}
.feed .ai-reply .what {
  font-size: 15.5px; color: var(--c-tx-2);
}

.entry {
  position: relative;
  display: grid; grid-template-columns: 52px 1fr; column-gap: 16px;
  padding: 10px 0 24px;
  background: none; border: none; margin-left: 0;
}
.entry.pending { opacity: 0.55; }

/* D2: a filled tag marks an entry the archive actually answered. */
.entry.has-reply .entry-time { color: var(--c-tx-2); }

/* D2: one milestone divider per DAY — mono, uppercase, with the mockup's
   diamond-marker + hairline-rule treatment. */
.date-divider {
  display: flex; align-items: center; gap: 10px;
  font-family: var(--f-mono); font-style: normal; font-weight: 500;
  font-size: 10px; line-height: 1; color: var(--c-tx-3); letter-spacing: 0.2em;
  text-transform: uppercase;
  margin: 34px 0 16px;
}
.date-divider::before {
  content: ""; flex: none; width: 5px; height: 5px;
  background: var(--c-tx-3); opacity: .55; transform: rotate(45deg);
}
.date-divider::after {
  content: ""; flex: 1; height: 1px; background: var(--c-line);
}
.date-divider:first-child { margin-top: 0; }

.entry-head {
  grid-column: 1; grid-row: 1;
  display: flex; flex-direction: column; align-items: flex-end; gap: 4px;
  padding-top: 1px;
}
.entry-time {
  font-family: var(--f-mono); font-size: 9px; letter-spacing: 0.03em;
  color: var(--c-tx-3); text-transform: none; opacity: .8;
}
.entry-head .src {
  margin-left: 0; font-size: 7.5px; letter-spacing: 0.14em;
  text-transform: uppercase; font-family: var(--f-mono);
  color: var(--c-brand-hi); font-weight: 500;
}

/* Your record — plain sans, told apart from the archive's voice only by
   color and the phase-tag in the gutter, never by a different typeface. */
.entry-body {
  grid-column: 2; grid-row: 1;
  font-family: var(--f-sans); font-size: 17.5px; line-height: 1.55;
  color: var(--c-tx-1);
  white-space: pre-wrap; word-wrap: break-word;
}

.entry-body.is-photo-only:empty {
  display: none;
}

.entry-image-wrap {
  grid-column: 2;
  display: block;
  margin-top: 10px;
  padding: 0;
  border: none;
  background: none;
  cursor: zoom-in;
  max-width: 112px;
  text-align: left;
}

.entry-image {
  display: block;
  width: 112px;
  height: 112px;
  object-fit: cover;
  border-radius: 4px;
  border: 1px solid var(--c-line);
}

.photo-lightbox {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: rgba(8, 8, 10, 0.88);
  box-sizing: border-box;
}

.photo-lightbox.is-open {
  display: flex;
}

.photo-lightbox img {
  max-width: min(100%, 720px);
  max-height: min(88vh, 900px);
  width: auto;
  height: auto;
  object-fit: contain;
  border-radius: 4px;
  border: 1px solid var(--c-line);
}

.photo-lightbox-close {
  position: absolute;
  top: max(16px, env(safe-area-inset-top));
  right: max(16px, env(safe-area-inset-right));
  font-family: var(--f-sans);
  font-size: 13px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--c-tx-2);
  background: none;
  border: 1px solid var(--c-line);
  border-radius: 4px;
  padding: 8px 12px;
  cursor: pointer;
}

/* Registers made felt: quiet = low slow gold ember; brief = steadier;
   decide = indigo lamp core + faint cool tint (warm room stays).
   Breath period stays fixed so switching registers does not restart/resize the lamp. */
.membrane[data-register="quiet"] .witness-mark {
  opacity: 0.82;
  filter: saturate(0.9);
}
.membrane[data-register="decide"] {
  --lamp-core: var(--c-accent-hard);
}
/* Quiet: Handled off. Brief/decide may show a short recent strip. */
.membrane[data-register="quiet"] .surface-handled {
  display: none !important;
}
.membrane[data-register="quiet"] .surface-label,
.membrane[data-register="brief"] .surface-label,
.membrane[data-register="decide"] .surface-label {
  display: none !important;
}
.wrap.membrane-home .surface-handled:not(.is-membrane-hidden) {
  display: block;
  margin-top: 18px;
  max-width: 22rem;
  margin-left: auto;
  margin-right: auto;
  text-align: left;
}
.wrap.membrane-home .handled-item {
  padding: 10px 12px;
  cursor: pointer;
}
.wrap.membrane-home .handled-more,
.handled-more {
  display: block;
  width: 100%;
  margin-top: 8px;
  padding: 8px 10px;
  border: 0;
  background: transparent;
  color: var(--c-tx-3);
  font: inherit;
  font-size: 13px;
  cursor: pointer;
  text-align: center;
}
.handled-more.hidden { display: none !important; }
.settings-voice-row {
  align-items: flex-start;
}
.settings-row-copy {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
  flex: 1;
}
.settings-row-hint {
  font-size: 12px;
  color: var(--c-tx-3);
  line-height: 1.3;
}
.settings-voice-row .voice-picker {
  width: 100%;
  max-width: 16rem;
}
.membrane[data-register="quiet"] .greeting.is-silence {
  color: var(--c-tx-3);
  font-weight: 400;
  letter-spacing: -0.01em;
}
.membrane[data-register="brief"] .witness-mark {
  opacity: 0.92;
}
.membrane[data-register="decide"] .witness-mark {
  opacity: 1;
  filter: drop-shadow(0 0 14px color-mix(in srgb, var(--c-accent-hard) 40%, transparent));
}
/* Faint cool wash under the lamp — room stays warm, the call reads as indigo. */
.membrane[data-register="decide"] .witness::before {
  background: radial-gradient(circle,
    color-mix(in srgb, var(--c-accent-hard) 26%, transparent) 0%,
    color-mix(in srgb, var(--c-accent-hard) 8%, transparent) 44%,
    transparent 72%);
}
.membrane[data-register="decide"] .greeting {
  letter-spacing: 0.005em;
  font-weight: 600;
}
/* Decide gives the dispose verbs weight; Accept leads as a filled indigo. */
.membrane[data-register="decide"] .delta-act-primary {
  background: color-mix(in srgb, var(--c-accent-hard) 88%, black);
  border-color: var(--c-accent-hard);
  color: var(--c-brand-hi);
}
.membrane[data-register="decide"] .delta-actions {
  margin-top: 22px;
}
:root[data-presence-register="decide"] {
  --presence-register-tone: decide;
}
:root[data-presence-register="brief"] {
  --presence-register-tone: brief;
}
:root[data-presence-register="quiet"] {
  --presence-register-tone: quiet;
}

/* ── The conversation — no card, no bubble: the archive's line just
   continues the ledger, set apart by its tag color (.who) and, for a
   hard-truth beat, a rust accent bar (opt-in via .ai-reply.hard-truth,
   left for a future register-tagging pass — safe no-op until then). ── */
.thread { grid-column: 2; grid-row: 2; margin-top: 2px; }
.ai-reply {
  position: relative;
  margin-top: 16px;
  padding: 0 0 0 16px;
  background: none;
  border: none; border-left: 2px solid var(--c-voice-soft);
  border-radius: 0;
}
.ai-reply.hard-truth { border-left-color: var(--c-accent-hard); }
.ai-reply .who {
  display: flex; align-items: center; gap: 7px;
  font-family: var(--f-mono); font-size: 8.5px; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--c-voice-hi); font-weight: 500;
  margin-bottom: 6px;
}
.ai-reply.hard-truth .who { color: var(--c-accent-hard); }
.ai-reply .who::before {
  content: ""; width: 5px; height: 5px; transform: rotate(45deg);
  background: var(--c-voice); flex: none;
}
.ai-reply.hard-truth .who::before { background: var(--c-accent-hard); }
.ai-reply .what {
  font-family: var(--f-sans); font-style: normal; font-size: 17.5px;
  line-height: 1.55; color: var(--c-tx-1); white-space: pre-wrap;
}
.ai-reply.thinking .what {
  color: var(--c-voice-hi);
  letter-spacing: 0.28em;
  font-variant-numeric: tabular-nums;
  min-height: 1.4em;
  opacity: 0.85;
  animation: thinkPulse 1.05s ease-in-out infinite;
}
.ai-reply.failed {
  border-left-color: var(--c-danger);
  opacity: 0.9;
}
.ai-reply.failed .who,
.ai-reply.failed .what {
  color: var(--c-tx-3);
}
.reply-retry-btn {
  margin-top: 8px;
  background: none; border: 1px solid var(--c-line); color: var(--c-tx-2);
  border-radius: 2px; padding: 5px 12px; cursor: pointer;
  font-family: var(--f-mono); font-size: 10px; letter-spacing: 0.08em;
  text-transform: uppercase;
}
.reply-retry-btn:hover:not(:disabled) { border-color: var(--c-tx-3); color: var(--c-tx-1); }
.reply-retry-btn:disabled { opacity: 0.45; cursor: default; }

/* A concrete artifact riding along with the reply — mounted as an EXHIBIT:
   four corner brackets (painted as 8 gradient segments so no extra DOM is
   needed), a candle-lit header rule, a sri-yantra bleeding faintly behind
   the text, and a dashed "witnessed" seal overhanging the top-right corner.
   This is the goal mockup's FINDING box, brought over to anything the
   archive hands back as a record rather than prose. */
.draft-card, .platform-action-card {
  position: relative; overflow: visible;
  /* Default: flush in the live stage (no time-gutter). History/feed rows
     override below — the old blanket -84px left margin shoved live cards
     off the left edge of the phone. */
  margin: 16px 0 8px;
  padding: 20px 18px 18px;
  color: var(--c-tx-1);
  border: 1px solid rgba(200, 196, 184, 0.16); border-radius: 1px;
  background-color: rgba(14, 16, 22, 0.78);
  max-width: 100%;
  box-sizing: border-box;
  background-repeat: no-repeat;
  background-image:
    linear-gradient(var(--c-tx-2), var(--c-tx-2)), linear-gradient(var(--c-tx-2), var(--c-tx-2)),
    linear-gradient(var(--c-tx-2), var(--c-tx-2)), linear-gradient(var(--c-tx-2), var(--c-tx-2)),
    linear-gradient(var(--c-tx-2), var(--c-tx-2)), linear-gradient(var(--c-tx-2), var(--c-tx-2)),
    linear-gradient(var(--c-tx-2), var(--c-tx-2)), linear-gradient(var(--c-tx-2), var(--c-tx-2));
  background-position:
    left 5px top 5px, left 5px top 5px, right 5px top 5px, right 5px top 5px,
    left 5px bottom 5px, left 5px bottom 5px, right 5px bottom 5px, right 5px bottom 5px;
  background-size:
    15px 1px, 1px 15px, 15px 1px, 1px 15px,
    15px 1px, 1px 15px, 15px 1px, 1px 15px;
}
/* the sri-yantra wash, clipped to the box (card stays overflow:visible for the seal) */
.draft-card::before, .platform-action-card::before {
  content: ""; position: absolute; inset: 0; overflow: hidden; pointer-events: none;
  border-radius: 1px; z-index: 0; opacity: .5;
  background-repeat: no-repeat; background-position: right -30px bottom -40px; background-size: 210px auto;
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20200%20200'%3E%3Cg%20fill='none'%20stroke='%23c8c4b8'%20stroke-opacity='0.10'%20stroke-width='0.8'%3E%3Ccircle%20cx='100'%20cy='100'%20r='92'/%3E%3Cpolygon%20points='100,32%20158,132%2042,132'/%3E%3Cpolygon%20points='100,168%2042,68%20158,68'/%3E%3Cpolygon%20points='100,54%20140,122%2060,122'/%3E%3Cpolygon%20points='100,146%2060,78%20140,78'/%3E%3Ccircle%20cx='100'%20cy='100'%20r='14'/%3E%3C/g%3E%3C/svg%3E");
}
/* the wax "witnessed" seal — draft-card only. A cross-app offer that hasn't
   been confirmed yet is an offer, not a record; sealing it "witnessed" before
   he's chosen to log it would be a small lie (the written card earns its own
   seal below, via .pa-done). */
.draft-card::after {
  content: ""; position: absolute; top: -15px; right: -7px;
  width: 58px; height: 58px; border-radius: 50%; z-index: 2; pointer-events: none;
  border: 1px dashed rgba(224, 217, 203, 0.32); opacity: .85;
  background:
    radial-gradient(circle, transparent 60%, rgba(224,217,203,0.16) 60% 63%, transparent 63%),
    linear-gradient(-22deg, transparent 47%, rgba(224,217,203,0.28) 47% 53%, transparent 53%);
}
.draft-title, .draft-body, .draft-copy-btn { position: relative; z-index: 1; }
.draft-title {
  display: flex; align-items: center; gap: 10px;
  font-family: var(--f-serif); font-size: 12px; font-weight: 700;
  letter-spacing: 0.18em; text-transform: uppercase; color: var(--c-tx-1);
  margin-bottom: 12px;
}
.draft-title::before {
  content: ""; flex: none; width: 11px; height: 16px;
  background-repeat: no-repeat; background-position: center; background-size: contain;
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2011%2016'%3E%3Cpath%20d='M5.5%200%20C3%203%207%204%205.5%206.5%20C4.7%205.2%204%205.8%204%206.8%20A1.9%201.9%200%200%200%207%206.8%20C7%204.6%205.5%203.6%205.5%200Z'%20fill='%23e0a24a'/%3E%3Crect%20x='4.8'%20y='7'%20width='1.4'%20height='8.4'%20fill='%23b9ad97'/%3E%3C/svg%3E");
}
.draft-title::after {
  content: ""; flex: 1; height: 3px;
  border-top: 1px solid rgba(224, 217, 203, 0.28);
  border-bottom: 1px solid rgba(224, 217, 203, 0.12);
}
.draft-body {
  font-family: var(--f-sans); font-size: 15.5px; line-height: 1.58;
  color: var(--c-tx-1); white-space: pre-wrap; word-wrap: break-word;
}
.draft-copy-btn {
  margin-top: 10px; background: none; border: none; cursor: pointer;
  font-family: var(--f-mono); font-size: 9.5px; letter-spacing: 0.12em;
  text-transform: uppercase; color: var(--c-tx-3); opacity: 0.6;
  padding: 2px 4px; transition: opacity 140ms, color 140ms;
}
.draft-copy-btn:hover { opacity: 1; color: var(--c-brand-hi); }

/* ── Draft reading sheet — prepared text as an exhibit, not a chat dump ─ */
.draft-sheet .sheet-panel.draft-sheet-panel {
  max-height: min(88vh, 760px);
}
.draft-sheet-lede {
  margin: 0 0 16px;
  font-family: var(--f-serif); font-style: italic; font-size: 14px;
  color: var(--c-tx-3); line-height: 1.45;
}
.draft-sheet-body .draft-card.draft-reading {
  margin: 0 0 18px;
  max-height: min(52vh, 420px);
  overflow-y: auto;
  background-color: color-mix(in srgb, var(--c-bg-1) 88%, transparent);
  border-color: color-mix(in srgb, var(--c-witness) 22%, var(--c-line));
}
.draft-sheet-actions {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 10px;
  align-items: center;
}
.draft-sheet-actions .delta-act-primary { justify-self: stretch; }
@media (max-width: 420px) {
  .draft-sheet-actions {
    grid-template-columns: 1fr 1fr;
  }
  .draft-sheet-actions .delta-act-primary { grid-column: 1 / -1; order: -1; }
  .draft-sheet-actions .delta-act-quiet { grid-column: 1 / -1; }
}

/* ── Cross-app offer card (a Sovereign expense, a Protocol Lab note) ──────────
   Shares the exhibit chassis above (corner brackets, sri-yantra wash, break-out
   margin) so it reads as the same case-file family. The default styling is the
   expense: a small "which app" tag, the amount as a tabular headline, and a
   required account picker that gates the confirm. The .pa-note variant (a lab
   note) has no account and no money, so its summary renders as body prose, not
   an amount — see the .pa-note override below. No wax seal until it's actually
   written. */
.pa-app, .pa-title, .pa-summary, .pa-account, .pa-actions, .pa-error, .pa-queued { position: relative; z-index: 1; }
.pa-app {
  font-family: var(--f-mono); font-size: 9px; letter-spacing: 0.16em;
  text-transform: uppercase; color: var(--c-tx-3); opacity: 0.75; margin-bottom: 6px;
}
.pa-title {
  display: flex; align-items: center; gap: 10px;
  font-family: var(--f-serif); font-size: 12px; font-weight: 700;
  letter-spacing: 0.18em; text-transform: uppercase; color: var(--c-brand-hi);
  margin-bottom: 10px;
}
.pa-title::before {
  content: ""; flex: none; width: 11px; height: 16px;
  background-repeat: no-repeat; background-position: center; background-size: contain;
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2011%2016'%3E%3Cpath%20d='M5.5%200%20C3%203%207%204%205.5%206.5%20C4.7%205.2%204%205.8%204%206.8%20A1.9%201.9%200%200%200%207%206.8%20C7%204.6%205.5%203.6%205.5%200Z'%20fill='%23e0a24a'/%3E%3Crect%20x='4.8'%20y='7'%20width='1.4'%20height='8.4'%20fill='%23b9ad97'/%3E%3C/svg%3E");
}
.pa-title::after {
  content: ""; flex: 1; height: 3px;
  border-top: 1px solid rgba(224, 217, 203, 0.28);
  border-bottom: 1px solid rgba(224, 217, 203, 0.12);
}
/* The amount is the headline — tabular figures so the money reads as a figure,
   not prose. */
.pa-summary {
  font-family: var(--f-serif); font-size: 20px; font-weight: 700;
  font-variant-numeric: tabular-nums; color: var(--c-tx-1);
  margin-bottom: 14px;
}
/* A lab note has no amount — its summary IS the note text, so it reads as body
   prose (matching .draft-body) rather than a money headline. */
.platform-action-card.pa-note .pa-summary {
  font-family: var(--f-sans); font-size: 15.5px; font-weight: 400;
  line-height: 1.58; font-variant-numeric: normal;
  white-space: pre-wrap; word-wrap: break-word;
}
.pa-account { display: flex; flex-direction: column; gap: 5px; margin-bottom: 4px; }
.pa-account > span {
  font-family: var(--f-mono); font-size: 9px; letter-spacing: 0.12em;
  text-transform: uppercase; color: var(--c-tx-3);
}
.pa-account-select {
  font-family: var(--f-sans); font-size: 13.5px; color: var(--c-tx-1);
  background: rgba(10, 8, 5, 0.5); border: 1px solid var(--c-line);
  border-radius: 2px; padding: 7px 9px; cursor: pointer;
  appearance: none; -webkit-appearance: none;
}
.pa-account-select:focus { outline: none; border-color: var(--c-brand); }
.pa-error {
  font-family: var(--f-sans); font-size: 12px; color: var(--c-danger);
  margin: 8px 0 2px;
}
.pa-confirm-btn { cursor: pointer; }
/* Queued for the durable offline retry — distinct from .pa-error (a real
   rejection he can act on): this just means the network isn't here yet, and
   it'll finish on its own once it is. */
.pa-queued {
  font-family: var(--f-sans); font-size: 12px; color: var(--c-tx-3);
  margin: 8px 0 2px; font-style: italic;
}
.platform-action-card.pa-queued-state { opacity: 0.75; }
.pa-actions { display: flex; gap: 8px; margin-top: 14px; }
.pa-confirm-btn, .pa-dismiss-btn {
  background: none; border: 1px solid var(--c-line); color: var(--c-tx-2);
  border-radius: 2px; padding: 6px 14px; cursor: pointer;
  font-family: var(--f-mono); font-size: 10px; letter-spacing: 0.08em;
  text-transform: uppercase; transition: border-color 140ms, color 140ms, background 140ms;
}
.pa-confirm-btn { border-color: var(--c-brand); color: var(--c-brand-hi); }
.pa-confirm-btn:hover:not(:disabled) { background: var(--c-brand-soft); }
.pa-dismiss-btn:hover { border-color: var(--c-tx-3); color: var(--c-tx-1); }
.pa-confirm-btn:disabled { opacity: 0.4; cursor: default; }
/* Once written, the card earns the wax seal the draft gets — it's a record now. */
.platform-action-card.pa-done::after {
  content: ""; position: absolute; top: -15px; right: -7px;
  width: 58px; height: 58px; border-radius: 50%; z-index: 2; pointer-events: none;
  border: 1px dashed rgba(224, 217, 203, 0.32); opacity: .85;
  background:
    radial-gradient(circle, transparent 60%, rgba(224,217,203,0.16) 60% 63%, transparent 63%),
    linear-gradient(-22deg, transparent 47%, rgba(224,217,203,0.28) 47% 53%, transparent 53%);
}

/* C1 "call your bluff" — a noticed mismatch, quieter and more tentative than
   a platform-action card (there's nothing to log, just something to answer
   honestly). Left border instead of a full box at the read-only "observe"
   tier; a solid warmer border once she's earned "confront" — the visual
   register should match the tone of the copy it's paired with. */
.bluff-call-card {
  margin: 14px -4px 6px 0; padding: 12px 16px;
  border-left: 2px solid var(--c-line); background: transparent;
}
.bluff-call-card.bluff-confront {
  border-left-color: var(--c-brand); background: var(--c-brand-soft);
  border-radius: 2px;
}
.bluff-claim {
  font-family: var(--f-sans); font-size: 14px; font-style: italic;
  color: var(--c-tx-2); margin-bottom: 4px;
}
.bluff-evidence {
  font-family: var(--f-mono); font-size: 11px; letter-spacing: 0.02em;
  color: var(--c-tx-3);
}
.bluff-actions { display: flex; gap: 8px; margin-top: 10px; }
.bluff-fair-btn, .bluff-wrong-btn {
  background: none; border: 1px solid var(--c-line); color: var(--c-tx-2);
  border-radius: 2px; padding: 5px 12px; cursor: pointer;
  font-family: var(--f-mono); font-size: 10px; letter-spacing: 0.08em;
  text-transform: uppercase; transition: border-color 140ms, color 140ms;
}
.bluff-fair-btn:hover, .bluff-wrong-btn:hover { border-color: var(--c-tx-3); color: var(--c-tx-1); }
.bluff-resolved {
  font-family: var(--f-mono); font-size: 10px; letter-spacing: 0.06em;
  text-transform: uppercase; color: var(--c-tx-3); margin-top: 8px;
}

/* Your replies — plain sans, quieter, unheld. */
.user-reply { margin-top: 14px; padding-left: 16px; border-left: 2px solid var(--c-line); animation: replyIn .4s ease both; }
.user-reply .who {
  font-family: var(--f-mono); font-size: 8.5px; letter-spacing: 0.16em;
  text-transform: uppercase; color: var(--c-tx-3); font-weight: 500;
  margin-bottom: 5px;
}
.user-reply .what {
  font-family: var(--f-sans); font-size: 15.5px; line-height: 1.55;
  color: var(--c-tx-2); white-space: pre-wrap;
}
.user-reply.is-pending { opacity: 0.7; }
.user-reply.is-offline,
.user-reply.is-failed {
  border-left-color: var(--c-danger);
}
.reply-state {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  margin-top: 7px;
  font-family: var(--f-sans); font-size: 12px; color: var(--c-tx-3);
}
.user-reply.is-failed .reply-state,
.user-reply.is-offline .reply-state { color: var(--c-danger); }

.reply-toggle {
  margin-top: 14px; background: none; border: none; color: var(--c-tx-3);
  font-family: var(--f-mono); font-size: 10.5px; cursor: pointer; padding: 0;
  letter-spacing: 0.1em; text-transform: uppercase; transition: color 140ms;
}
.reply-toggle:hover { color: var(--c-brand-hi); }
.reply-row { display: flex; gap: 8px; margin-top: 12px; align-items: center; }
.reply-row input {
  flex: 1; background: none; border: none; border-bottom: 1px solid var(--c-line);
  border-radius: 0; padding: 8px 2px; color: var(--c-tx-1);
  font-family: var(--f-sans); font-size: 15px; outline: none;
  transition: border-color 140ms;
}
.reply-row input:focus { border-color: var(--c-brand); }
.reply-row button {
  background: none; border: 1px solid var(--c-line); color: var(--c-tx-2);
  border-radius: 2px; padding: 7px 14px; cursor: pointer;
  font-family: var(--f-mono); font-size: 10px; letter-spacing: 0.08em;
  text-transform: uppercase; transition: border-color 140ms, color 140ms;
}
.reply-row button:hover { border-color: var(--c-brand); color: var(--c-brand-hi); }

/* First days, thin archive: no history yet — a single quiet line, no seed
   node (the gutter/spine motif needs at least one row to mean anything). */
.feed-empty {
  position: relative;
  color: var(--c-tx-2); font-family: var(--f-sans); font-style: normal;
  font-size: 17px; text-align: center; padding: 54px 20px 46px; line-height: 1.55;
  animation: riseIn .6s ease .1s both;
}
.feed-empty::before {
  content: ""; display: block; width: 6px; height: 6px; margin: 0 auto 20px;
  transform: rotate(45deg);
  background: var(--c-brand);
  animation: nodePop .5s cubic-bezier(.5,1.7,.5,1) .2s both;
}

/* ── Unlock screen — same quiet-room lamp as home ───────────────────── */
.unlock {
  position: relative; z-index: 1;
  min-height: 100dvh; display: grid; place-items: center; padding: 24px;
  background:
    radial-gradient(55% 42% at 50% 18%, var(--c-lamp), transparent 70%),
    radial-gradient(68% 48% at 50% 22%, rgba(201, 164, 106, 0.1), transparent 62%),
    radial-gradient(50% 40% at 88% 88%, rgba(91, 110, 168, 0.04), transparent 55%),
    var(--c-bg-0);
}
:root.light .unlock {
  background:
    radial-gradient(72% 52% at 50% 18%, rgba(84, 105, 142, 0.12), transparent 62%),
    var(--c-bg-0);
}
.unlock-card {
  position: relative;
  width: 100%; max-width: 360px;
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 40px 12px 44px; text-align: center;
  backdrop-filter: none;
  box-shadow: none;
  animation: riseIn .7s cubic-bezier(.16,1,.3,1) both;
}
.unlock-mark {
  width: min(148px, 38vw);
  margin: 0 auto 32px;
  color: var(--c-witness);
  filter: drop-shadow(0 0 32px rgba(201, 164, 106, 0.32));
  animation: witnessBreathe 5.5s ease-in-out infinite;
}
.unlock-mark .witness-mark {
  display: block;
  width: 100%;
  height: auto;
}
.unlock-mark svg { display: block; width: 100%; height: auto; }
.unlock-card h1 {
  font-family: var(--f-serif); font-style: normal; font-weight: 600;
  font-size: clamp(44px, 11vw, 56px); letter-spacing: -0.035em; margin: 0 0 10px;
  font-variation-settings: "opsz" 72, "SOFT" 50;
  color: var(--c-tx-1);
}
.unlock-card p {
  color: var(--c-tx-3); font-size: 10px; margin: 0 0 32px;
  font-family: var(--f-mono); letter-spacing: 0.22em; text-transform: uppercase;
  opacity: .75;
}
.unlock.is-setpass .unlock-card p,
.unlock-card p.unlock-lede-readable {
  font-family: var(--f-sans);
  font-size: clamp(15px, 3.6vw, 17px);
  line-height: 1.45;
  letter-spacing: -0.01em;
  text-transform: none;
  color: var(--c-tx-2);
  opacity: 1;
  max-width: 28ch;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 28px;
}
.unlock.is-setpass .unlock-mark {
  width: min(148px, 38vw);
  margin-bottom: 28px;
}
.unlock.is-setpass .unlock-card {
  max-width: 400px;
  padding: 36px 20px 48px;
}
.unlock.is-setpass .unlock-alt {
  font-size: 14px;
  color: var(--c-tx-2);
  min-height: 44px;
}
.unlock-card input {
  width: 100%; background: transparent;
  border: none; border-bottom: 1px solid var(--c-line); border-radius: 0;
  min-height: 48px; padding: 12px 4px; color: var(--c-tx-1);
  font-family: var(--f-sans); font-size: 16px; outline: none; text-align: center;
  transition: border-color 140ms;
}
.unlock-card input:focus {
  border-color: var(--c-witness);
  background: transparent;
}
.unlock-card .keep-btn {
  width: 100%; margin-top: 24px; border-radius: var(--r-sm);
  background: linear-gradient(180deg, #e6d4ad 0%, #c9a46a 100%);
  color: #17130e; border: none;
  min-height: 48px; padding: 13px 16px;
  font-family: var(--f-sans); font-size: 14px; font-weight: 600;
  letter-spacing: 0.02em; text-transform: none;
  box-shadow: 0 10px 28px rgba(201, 164, 106, 0.14);
}
.unlock-msg { min-height: 18px; font-size: 13px; color: var(--c-danger); margin-top: 12px; }
.unlock-alt {
  background: none; border: none; color: var(--c-tx-3); font-size: 12.5px;
  cursor: pointer; margin-top: 16px; font-family: var(--f-sans);
  transition: color 140ms;
}
.unlock-alt:hover { color: var(--c-witness); }

.hidden { display: none !important; }

/* status toast */
.toast {
  position: fixed; bottom: 22px; left: 50%; transform: translateX(-50%);
  display: flex; align-items: center; gap: 9px;
  background: var(--c-bg-1); color: var(--c-tx-1);
  border: 1px solid var(--c-line); border-left: 2px solid var(--c-brand);
  border-radius: 2px; padding: 10px 20px 10px 16px; font-size: 13px; z-index: 50;
  font-family: var(--f-sans);
  opacity: 0; transition: opacity 200ms; pointer-events: none;
  box-shadow: 0 6px 26px rgba(0, 0, 0, 0.4);
}
.toast::before {
  content: ""; width: 5px; height: 5px; transform: rotate(45deg); flex: none;
  background: var(--c-brand);
}
.toast.show { opacity: 1; animation: toastIn 320ms cubic-bezier(.2,.9,.3,1.2); }

/* ═══════════════════════════════════════════════════════════════════════
   Motion — restrained: the ledger settles in once, the archive's line
   still breathes while it thinks, nothing else performs.
   ═══════════════════════════════════════════════════════════════════════ */

@keyframes riseIn   { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
@keyframes nodePop  { 0% { transform: scale(0) rotate(45deg); } 62% { transform: scale(1.35) rotate(45deg); } 100% { transform: scale(1) rotate(45deg); } }
@keyframes voicePulse{ 0%,100% { box-shadow: 0 0 0 0 var(--c-voice-soft); }
                       50%     { box-shadow: 0 0 0 6px rgba(239,124,147,0); } }
@keyframes replyIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@keyframes toastIn  { from { opacity: 0; transform: translateX(-50%) translateY(14px); } to { opacity: 1; transform: translateX(-50%) translateY(0); } }
@keyframes thinkPulse {
  0%, 100% { opacity: 0.28; }
  50% { opacity: 1; }
}

.greeting  { animation: riseIn .6s ease both; }
.composer  { animation: riseIn .6s ease .06s both; }
.otd-card  { animation: riseIn .6s ease .12s both; }
.live .entry { animation: riseIn .55s cubic-bezier(.2,.7,.3,1) both; }

.feed > .entry { animation: riseIn .5s cubic-bezier(.2,.7,.3,1) both; }
.feed > .entry:nth-of-type(1) { animation-delay: .08s; }
.feed > .entry:nth-of-type(2) { animation-delay: .14s; }
.feed > .entry:nth-of-type(3) { animation-delay: .20s; }
.feed > .entry:nth-of-type(4) { animation-delay: .26s; }
.feed > .entry:nth-of-type(5) { animation-delay: .32s; }
.feed > .entry:nth-of-type(n+6) { animation-delay: .38s; }
.date-divider { animation: riseIn .5s ease .04s both; }

.ai-reply { animation: replyIn .5s cubic-bezier(.2,.8,.3,1) both; }
.ai-reply .who::before { animation: voicePulse 2.6s ease-in-out infinite; }
.ai-reply.thinking { animation: replyIn .5s ease both; }
/* Kill legacy transparent+content dots (unsupported content animation → blank weird "…"). */
.ai-reply.thinking .what::after { content: none !important; display: none !important; }

.keep-btn:hover { transform: translateY(-1px); }
.keep-btn:active { transform: translateY(1px); }
.reply-toggle { transition: color 140ms, letter-spacing 160ms; }
.reply-toggle:hover { letter-spacing: 0.14em; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important; animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
  }
}

/* ── Further back (feed pagination) ──────────────────────────────────── */
.feed-more {
  margin: 10px auto 0; display: block; background: none;
  border: 1px solid var(--c-line); color: var(--c-tx-2);
  border-radius: 2px; padding: 8px 16px; cursor: pointer;
  font-family: var(--f-mono); font-size: 10px; letter-spacing: 0.08em;
  text-transform: uppercase; transition: border-color 140ms, color 140ms;
}
.feed-more:hover { border-color: var(--c-brand); color: var(--c-brand-hi); }
.feed-more:disabled { opacity: 0.5; cursor: default; }

/* ── Entry edit / delete (quiet until wanted) ── */
.entry-edit-btn {
  background: none; border: none; cursor: pointer;
  font-family: var(--f-mono); font-size: 8.5px; letter-spacing: 0.1em;
  text-transform: uppercase; color: var(--c-tx-3); opacity: 0.5;
  padding: 2px 0; transition: opacity 140ms, color 140ms;
}
.entry:hover .entry-edit-btn, .entry-edit-btn:focus-visible { opacity: 1; }
.entry-edit-btn:hover { color: var(--c-brand-hi); }

.entry-edit-area {
  width: 100%; background: var(--c-bg-2); border: 1px solid var(--c-line);
  border-radius: 2px; padding: 10px 12px; resize: vertical;
  color: var(--c-tx-1); font-family: var(--f-sans); font-size: 17px;
  line-height: 1.55; outline: none; min-height: 72px;
}
.entry-edit-area:focus { border-color: var(--c-brand); }

.entry-edit-row { display: flex; align-items: center; gap: 8px; margin-top: 10px; }
.entry-edit-row button {
  background: none; border: 1px solid var(--c-line); color: var(--c-tx-2);
  border-radius: 2px; padding: 6px 14px; cursor: pointer;
  font-family: var(--f-mono); font-size: 10px; letter-spacing: 0.08em;
  text-transform: uppercase; transition: border-color 140ms, color 140ms;
}
.entry-edit-row button:hover { border-color: var(--c-brand); color: var(--c-brand-hi); }
.entry-save-btn { border-color: var(--c-brand) !important; color: var(--c-brand-hi) !important; }
.entry-del-btn:hover { border-color: var(--c-danger) !important; color: var(--c-danger) !important; }
.entry-del-btn.armed { border-color: var(--c-danger) !important; color: var(--c-danger) !important; }
.entry-edit-row button:disabled { opacity: 0.5; cursor: default; }

/* ── Search + export (the tools drawer) ──────────────────────────────── */
.search-bar { display: flex; gap: 8px; margin-top: 14px; }
.search-bar.hidden { display: none; }
.search-input {
  flex: 1; background: none; border: none; border-bottom: 1px solid var(--c-line);
  border-radius: 0; padding: 8px 4px; color: var(--c-tx-1);
  font-family: var(--f-sans); font-size: 14px; outline: none;
  transition: border-color 140ms;
}
.search-input:focus { border-color: var(--c-brand); }
.search-input::placeholder { color: var(--c-tx-3); }
.search-clear, .export-btn {
  background: none; border: 1px solid var(--c-line); color: var(--c-tx-2);
  border-radius: 2px; padding: 0 14px; cursor: pointer;
  font-family: var(--f-mono); font-size: 10px; letter-spacing: 0.08em;
  text-transform: uppercase; transition: border-color 140ms, color 140ms;
}
.search-clear:hover, .export-btn:hover { border-color: var(--c-brand); color: var(--c-brand-hi); }
.export-btn:disabled { opacity: 0.5; cursor: default; }
.search-count {
  font-family: var(--f-mono); font-size: 10px; letter-spacing: 0.1em;
  text-transform: uppercase; color: var(--c-tx-3); margin: 0 0 14px 4px;
}

.export-more-btn {
  background: none; border: 1px solid var(--c-line); color: var(--c-tx-3);
  border-radius: 2px; padding: 0 10px; cursor: pointer; font-size: 13px;
  transition: border-color 140ms, color 140ms;
}
.export-more-btn:hover, .export-more-btn.on { border-color: var(--c-brand); color: var(--c-brand-hi); }
.export-panel {
  display: flex; flex-direction: column; gap: 8px; margin-top: 8px;
  background: none; border: 1px solid var(--c-line);
  border-radius: 2px; padding: 12px;
}
.export-panel.hidden { display: none; }
.export-range-row { display: flex; align-items: center; gap: 8px; }
.export-range-row span { color: var(--c-tx-3); font-size: 12px; }
.export-range-row input[type="date"] {
  flex: 1; background: none; border: none; border-bottom: 1px solid var(--c-line);
  border-radius: 0; padding: 6px 2px; color: var(--c-tx-1);
  font-family: var(--f-sans); font-size: 13px; outline: none;
  transition: border-color 140ms; color-scheme: dark;
}
:root.light .export-range-row input[type="date"] { color-scheme: light; }
.export-range-row input[type="date"]:focus { border-color: var(--c-brand); }
.export-panel-btn {
  background: none; border: 1px solid var(--c-line); color: var(--c-tx-2);
  border-radius: 2px; padding: 8px 14px; cursor: pointer;
  font-family: var(--f-mono); font-size: 10px; letter-spacing: 0.08em;
  text-transform: uppercase; transition: border-color 140ms, color 140ms;
}
.export-panel-btn:hover { border-color: var(--c-brand); color: var(--c-brand-hi); }
.export-panel-btn:disabled { opacity: 0.5; cursor: default; }

/* ── Print view ──────────────────────────────────────────────────────── */
#print-view { display: none; }
@media print {
  #unlock-screen, #app, #toast { display: none !important; }
  #print-view {
    display: block !important; max-width: 640px; margin: 0 auto;
    font-family: 'Georgia', 'Times New Roman', serif; color: #111; line-height: 1.5;
  }
  #print-view h1 { font-size: 22px; margin: 0 0 4px; }
  #print-view .print-range { font-size: 12px; color: #555; margin: 0 0 24px; }
  #print-view h2 { font-size: 16px; margin: 28px 0 10px; break-after: avoid; }
  #print-view .print-entry { margin: 0 0 14px; break-inside: avoid; }
  #print-view .print-time { font-size: 10px; color: #777; margin-bottom: 2px; }
  #print-view .print-reply { font-size: 13px; color: #444; font-style: italic; margin: 4px 0 0 16px; }
}

/* ── Settings sheet ──────────────────────────────────────────────────── */
.settings-sheet {
  display: flex; flex-direction: column; gap: 2px; margin-top: 14px;
  background: none; border: 1px solid var(--c-line);
  border-radius: 2px; padding: 6px;
}
.settings-sheet.hidden { display: none; }
/* Membrane home: overlay panel — do not push the witness / ADR down a tall scroll. */
.wrap.membrane-home .settings-sheet:not(.hidden) {
  position: absolute;
  left: 0;
  right: 0;
  top: calc(max(12px, env(safe-area-inset-top, 0px)) + 40px);
  z-index: 24;
  margin-top: 0;
  max-height: min(52dvh, 440px);
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  background: color-mix(in srgb, var(--c-bg-0) 96%, transparent);
  backdrop-filter: blur(10px);
  border: 1px solid var(--c-line);
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.35);
  padding: 8px 6px;
}
body.settings-open:has(#app.membrane-home:not(.hidden)) .wrap.membrane-home .membrane {
  pointer-events: none;
  opacity: 0.42;
}
.settings-row { display: flex; align-items: center; gap: 10px; padding: 4px 6px; }
a.settings-row { text-decoration: none; color: inherit; cursor: pointer; }
.settings-row.is-toggle {
  cursor: pointer;
  min-height: 44px;
  -webkit-tap-highlight-color: transparent;
}
.settings-row.is-toggle:active {
  background: color-mix(in srgb, var(--c-bg-2) 70%, transparent);
}
.settings-row-label {
  font-family: var(--f-sans); font-size: 12px; color: var(--c-tx-2);
  flex: 1;
  pointer-events: none;
}

.voice-picker {
  background: var(--c-bg-2); border: 1px solid var(--c-line);
  border-radius: 2px; padding: 6px 10px; color: var(--c-tx-1);
  font-family: var(--f-sans); font-size: 12px; outline: none;
  cursor: pointer; transition: border-color 140ms;
}
.voice-picker:focus, .voice-picker:hover { border-color: var(--c-brand); }

/* ── Streak ──────────────────────────────────────────────────────────── */
.streak {
  font-family: var(--f-mono); font-size: 8.5px; letter-spacing: 0.12em;
  text-transform: uppercase; color: var(--c-voice-hi);
  display: inline-flex; align-items: center; gap: 5px;
}
.streak::before { content: ''; width: 4px; height: 4px; transform: rotate(45deg); background: var(--c-brand); }
.streak.hidden { display: none; }

/* ── Daily opener crossfade + pinged-question state ──────────────────── */
.greeting.swap { opacity: 0; }
.greeting.asked { color: var(--c-voice-hi); }
.greeting.asked::after {
  content: 'it asked. answer below.';
  display: block; margin-top: 8px;
  font-family: var(--f-mono); font-style: normal; font-size: 9px;
  letter-spacing: 0.14em; text-transform: uppercase; color: var(--c-tx-3);
}
.greeting.settled.asked::after { display: none; }

/* ── The read / open loops / patterns / weekly review — the "archive
   stepping back" quiet-card family, all sharing the exhibit's square
   hairline border + mono label idiom instead of the old rounded card. ── */
#read-slot, #loops-slot, #patterns-slot, #orbit-slot { margin: 0; text-align: left; }
.read-btn, .loops-btn, .patterns-btn {
  display: block; width: 100%; margin: 0;
  background: color-mix(in srgb, var(--c-bg-2) 55%, transparent);
  border: 1px solid var(--c-line); color: var(--c-tx-1);
  border-radius: 12px; padding: 12px 14px; cursor: pointer;
  font-family: var(--f-sans); font-weight: 500; font-size: 14px;
  letter-spacing: 0; text-transform: none; text-align: left;
  transition: border-color 160ms, background 160ms, transform 160ms;
}
.read-btn:hover, .loops-btn:hover, .patterns-btn:hover {
  border-color: color-mix(in srgb, var(--c-witness) 35%, var(--c-line));
  background: color-mix(in srgb, var(--c-witness-soft) 50%, var(--c-bg-2));
  color: var(--c-tx-1);
  transform: translateY(-1px);
}
.read-btn:disabled, .loops-btn:disabled, .patterns-btn:disabled { opacity: 0.5; cursor: default; }
.read-btn.hidden, .loops-btn.hidden, .patterns-btn.hidden { display: none; }

.read-card, .loops-card, .patterns-card, .review-card {
  position: relative;
  text-align: left; background: none;
  border: 1px solid var(--c-line); border-radius: 0;
  padding: 18px 19px; font-family: var(--f-sans); font-size: 16px;
  line-height: 1.6;
}
.read-card::before, .read-card::after,
.loops-card::before, .loops-card::after,
.patterns-card::before, .patterns-card::after,
.review-card::before, .review-card::after {
  content: ""; position: absolute; width: 8px; height: 8px; border-color: var(--c-tx-2);
}
.read-card::before, .loops-card::before, .patterns-card::before, .review-card::before {
  top: 4px; left: 4px; border-top: 1px solid; border-left: 1px solid;
}
.read-card::after, .loops-card::after, .patterns-card::after, .review-card::after {
  bottom: 4px; right: 4px; border-bottom: 1px solid; border-right: 1px solid;
}
.read-label, .loops-label, .patterns-label, .review-label {
  font-family: var(--f-mono); font-size: 9.5px; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--c-tx-3); margin-bottom: 10px;
  position: relative; z-index: 1;
}
.read-card p, .review-card p { margin: 0 0 12px; position: relative; z-index: 1; }
.read-close, .loops-close, .patterns-close, .review-close {
  background: none; border: 1px solid var(--c-line); color: var(--c-tx-2);
  border-radius: 2px; padding: 6px 14px; cursor: pointer; margin-top: 4px;
  font-family: var(--f-mono); font-size: 10px; letter-spacing: 0.08em;
  text-transform: uppercase; transition: border-color 140ms, color 140ms;
  position: relative; z-index: 1;
}
.read-close:hover, .loops-close:hover, .patterns-close:hover, .review-close:hover {
  border-color: var(--c-brand); color: var(--c-brand-hi);
}

.loop-item {
  display: flex; align-items: baseline; flex-wrap: wrap; column-gap: 10px;
  row-gap: 4px; padding: 12px 0; border-bottom: 1px solid var(--c-line);
  position: relative; z-index: 1;
}
.loop-item:last-of-type { border-bottom: none; }
.loop-kind {
  flex: none; font-family: var(--f-mono); font-size: 9px;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--c-brand-hi); font-weight: 500;
}
.loop-content {
  flex: 1 1 100%; order: 3; font-family: var(--f-sans); font-size: 15px;
  line-height: 1.5; color: var(--c-tx-1);
}
.loop-date {
  font-family: var(--f-mono); font-size: 9px; letter-spacing: 0.08em;
  text-transform: uppercase; color: var(--c-tx-3);
}
.loop-done-btn {
  margin-left: auto; background: none; border: none; cursor: pointer;
  font-family: var(--f-mono); font-size: 9px; letter-spacing: 0.1em;
  text-transform: uppercase; color: var(--c-tx-3); opacity: 0.55;
  padding: 2px 4px; transition: opacity 140ms, color 140ms;
}
.loop-done-btn:hover { opacity: 1; color: var(--c-brand-hi); }
.loop-done-btn:disabled { opacity: 0.3; cursor: default; }
.loops-empty {
  color: var(--c-tx-2); font-family: var(--f-sans); font-style: normal;
  font-size: 15px; text-align: center; padding: 18px 0; line-height: 1.5;
  position: relative; z-index: 1;
}

#review-slot:empty { margin: 0; }
.review-card { margin: 0 0 20px; }
.year-review-card { border-color: var(--c-voice-soft); }
.year-review-card .review-label { color: var(--c-voice-hi); }

#patterns-slot { }
.patterns-item {
  padding: 12px 0; border-bottom: 1px solid var(--c-line);
  position: relative; z-index: 1;
}
.patterns-item:last-of-type { border-bottom: none; }
.patterns-claim {
  display: flex; align-items: flex-start; gap: 8px;
  font-family: var(--f-sans); font-size: 15.5px; line-height: 1.5;
  color: var(--c-tx-1); margin-bottom: 8px;
}
.patterns-claim .lotus-mark { flex-shrink: 0; margin-top: 3px; }
.patterns-claim .lotus-mark g {
  transform-origin: 10px 10px;
  animation: lotusOpen .9s cubic-bezier(.22,1,.36,1) both;
}
@keyframes lotusOpen {
  0% { transform: scale(.15); opacity: 0; }
  60% { opacity: 1; }
  100% { transform: scale(1); opacity: 1; }
}
.patterns-evidence {
  margin: 0; padding-left: 18px; list-style: disc;
  font-family: var(--f-sans); font-size: 13px; line-height: 1.55;
  color: var(--c-tx-2); position: relative; z-index: 1;
}
.patterns-evidence li { margin: 0 0 4px; }
.patterns-evidence li:last-child { margin-bottom: 0; }
.patterns-empty {
  color: var(--c-tx-2); font-family: var(--f-sans); font-style: normal;
  font-size: 15px; text-align: center; padding: 18px 0; line-height: 1.5;
  position: relative; z-index: 1;
}

/* ── Voice: reply mic + speak buttons ─────────────────────────────────── */
.reply-row { display: flex; gap: 8px; align-items: center; }
.reply-row .reply-mic-btn {
  flex-shrink: 0; width: 26px; height: 26px; border-radius: 50%; position: relative;
  border: 1px solid var(--c-line); background: none; padding: 0;
  color: var(--c-tx-3); cursor: pointer; display: grid; place-items: center;
  transition: color 140ms, border-color 140ms, background 140ms;
}
.reply-row .reply-mic-btn:hover { color: var(--c-tx-1); border-color: var(--c-tx-3); }
.reply-row .reply-mic-btn.hidden { display: none; }
.reply-row .reply-mic-btn.live {
  background: var(--c-brand-soft); border-color: var(--c-brand);
  color: var(--c-brand-hi); animation: pulse 1.7s ease-in-out infinite;
}
.reply-mic-btn .mic-wave {
  position: absolute; inset: 0; display: flex; align-items: center;
  justify-content: center; gap: 1.5px; opacity: 0; transform: scale(.6);
  transition: opacity .18s ease, transform .18s ease; pointer-events: none;
}
.reply-mic-btn .mic-wave i {
  width: 2px; height: 10px; border-radius: 2px; background: currentColor;
  transform: scaleY(.28); transform-origin: center;
}
.reply-mic-btn.live > svg { opacity: 0; transform: scale(.6); transition: opacity .18s, transform .18s; }
.reply-mic-btn.live .mic-wave { opacity: 1; transform: scale(1); }
.reply-mic-btn.live .mic-wave i { animation: fluteGlow 1.05s ease-in-out infinite; opacity: .85; }
.reply-mic-btn.live .mic-wave i:nth-child(1) { animation-delay: 0s; }
.reply-mic-btn.live .mic-wave i:nth-child(2) { animation-delay: .11s; }
.reply-mic-btn.live .mic-wave i:nth-child(3) { animation-delay: .22s; }
.reply-mic-btn.transcribing {
  background: var(--c-tx-3); border-color: var(--c-tx-3);
  color: var(--c-tx-1); animation: pulse 1.1s ease-in-out infinite;
  pointer-events: none;
}

.speak-btn {
  background: none; border: none; cursor: pointer; padding: 2px;
  color: var(--c-tx-3); opacity: 0.55; margin-left: 6px;
  display: inline-grid; place-items: center; vertical-align: middle;
  transition: opacity 140ms, color 140ms;
}
.speak-btn:hover { opacity: 1; color: var(--c-brand-hi); }
.speak-btn.loading { opacity: 1; color: var(--c-brand); animation: pulse-fade 1s ease-in-out infinite; }
@keyframes pulse-fade { 0%, 100% { opacity: 0.4; } 50% { opacity: 1; } }

/* ── Answer chips: ways into the thread without a blank page ─────────── */
.answer-chips {
  display: flex; flex-wrap: wrap; gap: 8px;
  margin: 8px 0 4px;
  animation: riseIn .5s ease both;
}
.answer-chips.hidden { display: none; }
.answer-chips.chip-used { opacity: 0.45; transition: opacity 280ms ease; }
.answer-chip {
  background: color-mix(in srgb, var(--c-bg-2) 75%, transparent);
  border: 1px solid color-mix(in srgb, var(--c-voice) 28%, var(--c-line));
  border-radius: 999px;
  color: var(--c-tx-2);
  font-family: var(--f-serif); font-style: italic; font-size: 14px;
  padding: 8px 14px; cursor: pointer;
  transition: color 180ms, border-color 180ms, background 180ms, transform 180ms;
}
.answer-chip:hover {
  border-color: color-mix(in srgb, var(--c-voice) 55%, var(--c-line));
  color: var(--c-voice-hi);
  background: color-mix(in srgb, var(--c-voice-soft) 60%, var(--c-bg-2));
  transform: translateY(-1px);
}
.answer-chip:active { transform: translateY(0); }

/* ── Rooms sheet: rented chambers, not a launcher ───────────────────── */
.rooms-sheet .sheet-panel {
  border-radius: 18px 18px 0 0;
  border: 1px solid color-mix(in srgb, var(--c-witness) 22%, var(--c-line));
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--c-witness) 6%, var(--c-bg-1)), var(--c-bg-1) 28%),
    var(--c-bg-1);
  box-shadow: 0 -24px 80px rgba(0, 0, 0, 0.45);
}
.rooms-head {
  align-items: flex-start;
  padding: 16px 16px 12px;
  border-bottom: 1px solid color-mix(in srgb, var(--c-witness) 18%, var(--c-line));
}
.rooms-head-copy { min-width: 0; flex: 1; }
.rooms-sheet .sheet-title {
  display: block;
  font-family: var(--f-serif); font-weight: 600; font-style: normal;
  font-size: clamp(22px, 5.5vw, 28px); letter-spacing: -0.02em;
  text-transform: none; color: var(--c-tx-1);
  line-height: 1.1;
}
.rooms-lede {
  margin: 6px 0 0;
  font-family: var(--f-mono); font-style: normal;
  font-size: 10px; line-height: 1.45; letter-spacing: 0.08em;
  color: var(--c-tx-3); text-transform: lowercase;
}
.rooms-list {
  display: flex; flex-direction: column; gap: 0;
  padding: 8px 14px max(18px, env(safe-area-inset-bottom));
  overflow-y: auto;
}
.rooms-list.is-chamber { padding-top: 4px; }

.room-back {
  display: inline-flex; align-items: center; gap: 8px;
  width: auto; text-align: left; cursor: pointer;
  background: transparent; border: none;
  padding: 4px 4px 12px;
  font-family: var(--f-mono); font-size: 10px; letter-spacing: 0.12em;
  text-transform: uppercase; color: var(--c-tx-3);
  transition: color 140ms;
}
.room-back:hover { color: var(--c-witness); }
.room-back-arrow { font-size: 14px; line-height: 1; }

/* Vestibule: room doors as cards */
.room-door-grid,
.room-intent-grid {
  display: grid; gap: 10px;
}
.room-door {
  display: flex; flex-direction: column; align-items: flex-start; gap: 8px;
  width: 100%; text-align: left; cursor: pointer;
  background: color-mix(in srgb, var(--c-bg-2) 70%, transparent);
  border: 1px solid var(--c-line);
  border-radius: 14px;
  padding: 14px 15px;
  transition: border-color 160ms, background 160ms, transform 160ms;
}
.room-door:hover {
  border-color: color-mix(in srgb, var(--c-witness) 35%, var(--c-line));
  background: color-mix(in srgb, var(--c-witness-soft) 55%, var(--c-bg-2));
  transform: translateY(-1px);
}
.room-door:active { transform: scale(0.992); }
.room-door-top {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: 10px; width: 100%;
}
.room-door-name {
  font-family: var(--f-serif); font-weight: 600; font-size: 19px;
  color: var(--c-tx-1); letter-spacing: -0.01em;
}
.room-door-line {
  font-family: var(--f-mono); font-size: 10px; letter-spacing: 0.06em;
  color: var(--c-tx-3); line-height: 1.4;
}
.room-door-texture {
  flex: none;
  font-family: var(--f-mono); font-size: 9px; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--c-tx-3);
}
.room-door.room-instrument { border-left: 2px solid var(--c-accent-hard); }
.room-door.room-reflective { border-left: 2px solid var(--c-voice); }
.room-door.room-instrument .room-door-texture { color: var(--c-accent-hard); }
.room-door.room-reflective .room-door-texture { color: var(--c-voice); }
.home-nav-rooms {
  color: var(--c-tx-3);
  background: transparent;
  border-color: transparent;
}
.home-nav-rooms:hover:not(:disabled) {
  color: var(--c-tx-1);
  background: transparent;
  border-color: transparent;
}

/* Intent picker */
.room-intent {
  display: flex; flex-direction: column; align-items: flex-start; gap: 4px;
  width: 100%; text-align: left; cursor: pointer;
  background: color-mix(in srgb, var(--c-bg-2) 65%, transparent);
  border: 1px solid var(--c-line);
  border-radius: 12px;
  padding: 13px 14px;
  transition: border-color 160ms, background 160ms, transform 160ms;
}
.room-intent:hover {
  border-color: color-mix(in srgb, var(--c-witness) 30%, var(--c-line));
  background: color-mix(in srgb, var(--c-witness-soft) 45%, var(--c-bg-2));
}
.room-intent:active { transform: scale(0.992); }
.room-intent-label {
  font-family: var(--f-serif); font-weight: 600; font-size: 17px;
  color: var(--c-tx-1); letter-spacing: -0.01em;
}
.room-intent-hint {
  font-family: var(--f-mono); font-size: 10px; letter-spacing: 0.06em;
  color: var(--c-tx-3);
}
.room-offline-note {
  margin: 8px 4px 12px;
  font-family: var(--f-serif); font-style: italic;
  font-size: 14px; line-height: 1.45; color: var(--c-tx-2);
}

/* Chamber: snapshot card + pill actions */
.room-chamber { padding: 0 0 8px; }
.room-chamber-snap {
  margin: 0 0 14px; padding: 16px 14px 14px;
  border: 1px solid color-mix(in srgb, var(--c-witness) 24%, var(--c-line));
  border-left: 2px solid var(--c-witness);
  border-radius: 14px;
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--c-witness) 7%, transparent), transparent 58%),
    color-mix(in srgb, var(--c-bg-2) 82%, transparent);
}
.room-chamber-snap.is-loading {
  min-height: 88px; display: flex; flex-direction: column;
  align-items: stretch; justify-content: center; gap: 10px;
  padding: 18px 14px;
}
.snap-loading { display: none !important; }
.room-chamber-snap .snap-hero-value {
  font-size: clamp(22px, 5.4vw, 32px);
  font-weight: 500;
  letter-spacing: -0.02em;
}
.room-chamber-snap .snap-hero-label {
  font-family: var(--f-sans);
  font-size: 12px;
  letter-spacing: 0.02em;
  text-transform: none;
  color: var(--c-tx-3);
}
.room-chamber-snap.is-loading::before,
.room-chamber-snap.is-loading::after {
  content: '';
  display: block; height: 10px; border-radius: 6px;
  background: linear-gradient(
    90deg,
    color-mix(in srgb, var(--c-witness) 6%, var(--c-bg-2)),
    color-mix(in srgb, var(--c-witness) 16%, var(--c-bg-2)),
    color-mix(in srgb, var(--c-witness) 6%, var(--c-bg-2))
  );
  background-size: 200% 100%;
  animation: snapShimmer 1.4s ease-in-out infinite;
}
.room-chamber-snap.is-loading::before { width: 42%; height: 22px; }
.room-chamber-snap.is-loading::after { width: 78%; }
@keyframes snapShimmer {
  0% { background-position: 100% 0; }
  100% { background-position: -100% 0; }
}
.snap-empty, .snap-text {
  margin: 0;
  font-family: var(--f-serif); font-size: 14px; line-height: 1.5;
  color: var(--c-tx-2); font-style: italic;
}
.snap-hero {
  display: flex; flex-direction: column; gap: 4px;
  padding-bottom: 12px; margin-bottom: 4px;
  border-bottom: 1px solid color-mix(in srgb, var(--c-witness) 16%, var(--c-line));
}
.snap-hero-value {
  font-family: var(--f-serif); font-weight: 600;
  font-size: clamp(28px, 7vw, 34px); line-height: 1.05;
  letter-spacing: -0.03em; color: var(--c-tx-1);
}
.snap-hero-label {
  font-family: var(--f-mono); font-size: 10px; letter-spacing: 0.12em;
  text-transform: uppercase; color: var(--c-tx-3);
}
.snap-hero-meta, .snap-hero-detail {
  font-family: var(--f-mono); font-size: 11px; letter-spacing: 0.02em;
  color: var(--c-tx-3); line-height: 1.4;
}
.snap-section-label {
  margin: 10px 0 8px;
  font-family: var(--f-mono); font-size: 9px; letter-spacing: 0.16em;
  text-transform: uppercase; color: var(--c-tx-3);
}
.snap-list {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-direction: column; gap: 0;
}
.snap-row {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr) auto;
  gap: 10px; align-items: center;
  padding: 10px 0;
  border-bottom: 1px solid color-mix(in srgb, var(--c-line) 80%, transparent);
}
.snap-row:last-child { border-bottom: none; padding-bottom: 0; }
.snap-row:first-child { padding-top: 0; }
.snap-row-no-date { grid-template-columns: minmax(0, 1fr) auto; }
.snap-cell-date {
  font-family: var(--f-mono); font-size: 10px; letter-spacing: 0.04em;
  color: var(--c-tx-3); line-height: 1.2;
}
.snap-cell-body {
  display: flex; flex-direction: column; gap: 2px; min-width: 0;
}
.snap-cell-title {
  font-family: var(--f-sans); font-size: 14px; font-weight: 500;
  color: var(--c-tx-1); line-height: 1.25;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.snap-cell-sub {
  font-family: var(--f-mono); font-size: 9px; letter-spacing: 0.06em;
  color: var(--c-tx-3); text-transform: lowercase;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.snap-cell-value {
  font-family: var(--f-mono); font-size: 12px; font-weight: 600;
  letter-spacing: 0.02em; white-space: nowrap;
  color: var(--c-tx-2);
}
.snap-tone-income .snap-cell-value { color: #7dcea0; }
.snap-tone-expense .snap-cell-value { color: #e8a0a8; }
.snap-texture-instrument .snap-tone-instrument .snap-cell-value { color: var(--c-accent-hard); }
.snap-texture-reflective .snap-tone-reflective .snap-cell-value { color: var(--c-voice-hi); }

.room-chamber-actions {
  display: flex; flex-wrap: wrap; gap: 8px;
  padding: 0 0 12px;
}
.room-chamber-act {
  font-family: var(--f-mono); font-size: 10px; font-weight: 600;
  letter-spacing: 0.12em; text-transform: lowercase;
  color: var(--c-tx-1);
  background: color-mix(in srgb, var(--c-bg-2) 85%, transparent);
  border: 1px solid var(--c-line);
  border-radius: 999px;
  padding: 10px 16px; cursor: pointer;
  transition: color 160ms, border-color 160ms, background 160ms, transform 160ms;
}
.room-chamber-act:hover {
  border-color: color-mix(in srgb, var(--c-witness) 40%, var(--c-line));
  background: color-mix(in srgb, var(--c-witness-soft) 70%, var(--c-bg-2));
  transform: translateY(-1px);
}
.room-chamber-act-primary {
  color: var(--c-bg-0);
  background: var(--c-brand-hi);
  border-color: transparent;
  letter-spacing: 0.1em;
  padding: 12px 18px;
}
.room-chamber-act-primary:hover {
  color: var(--c-bg-0);
  background: var(--c-tx-1);
  border-color: transparent;
  transform: translateY(-1px);
}
.room-chamber.is-act-first .room-chamber-actions {
  padding: 0 0 14px;
}
.room-chamber.is-act-first .room-chamber-snap {
  margin-top: 0;
  opacity: 0.92;
}
.room-chamber.is-act-first .snap-hero-value {
  font-size: clamp(22px, 5.5vw, 28px);
}

/* Inline chamber log forms — stay in the sheet */
.chamber-form {
  display: flex; flex-direction: column; gap: 12px;
  width: 100%;
  margin: 0 0 8px;
  padding: 14px;
  border: 1px solid color-mix(in srgb, var(--c-witness) 24%, var(--c-line));
  border-radius: 14px;
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--c-witness) 7%, transparent), transparent 58%),
    color-mix(in srgb, var(--c-bg-2) 82%, transparent);
}
.chamber-form-fields {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.chamber-field {
  display: flex; flex-direction: column; gap: 5px; min-width: 0;
}
.chamber-field:has([name="what"]),
.chamber-field:has([name="note"]),
.chamber-field:has([name="feel"]),
.chamber-field:has([name="account"]),
.chamber-field:has([name="track"]) {
  grid-column: 1 / -1;
}
.chamber-field-label {
  font-family: var(--f-mono); font-size: 9px; letter-spacing: 0.12em;
  text-transform: uppercase; color: var(--c-tx-3);
}
.chamber-input {
  width: 100%;
  background: color-mix(in srgb, var(--c-bg-0) 55%, transparent);
  border: 1px solid var(--c-line);
  border-radius: 10px;
  padding: 11px 12px;
  color: var(--c-tx-1);
  font-family: var(--f-sans); font-size: 16px;
  outline: none;
  transition: border-color 140ms, background 140ms;
}
.chamber-input:focus {
  border-color: color-mix(in srgb, var(--c-witness) 45%, var(--c-line));
  background: color-mix(in srgb, var(--c-witness-soft) 35%, var(--c-bg-0));
}
.chamber-form-submit {
  width: 100%;
  font-family: var(--f-mono); font-size: 11px; font-weight: 600;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--c-bg-0);
  background: var(--c-brand-hi);
  border: none; border-radius: 999px;
  padding: 13px 16px; cursor: pointer;
  transition: background 140ms, transform 140ms;
}
.chamber-form-submit:hover { background: var(--c-tx-1); transform: translateY(-1px); }
.chamber-form-submit:disabled { opacity: 0.5; cursor: default; transform: none; }
.chamber-form-status {
  margin: 0; min-height: 1.2em;
  font-family: var(--f-mono); font-size: 11px; letter-spacing: 0.04em;
  color: var(--c-tx-3); text-align: center;
}
.chamber-form-status.is-ok { color: #7dcea0; }
.chamber-form-status.is-err { color: var(--c-danger); }
.room-chamber-act-quiet {
  opacity: 0.75;
  font-size: 9px !important;
  padding: 8px 12px !important;
  background: transparent !important;
  border-style: dashed !important;
}
.otd-slot {
  margin: 0 0 12px;
  opacity: 0.9;
}
.otd-slot:empty { display: none; }
.otd-slot .otd-card {
  margin: 0 0 8px;
}
.room-chamber.room-instrument .room-chamber-act:hover {
  border-color: color-mix(in srgb, var(--c-accent-hard) 45%, var(--c-line));
}
.room-chamber.room-reflective .room-chamber-act:hover {
  border-color: color-mix(in srgb, var(--c-voice) 45%, var(--c-line));
}
.room-chamber-escape {
  padding: 4px 2px 0;
  border-top: 1px solid color-mix(in srgb, var(--c-line) 70%, transparent);
}
.room-chamber-full {
  background: none; border: none; cursor: pointer; padding: 10px 0 2px;
  font-family: var(--f-mono); font-size: 9px; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--c-tx-3);
  transition: color 140ms;
}
.room-chamber-full:hover { color: var(--c-witness); }
.room-chamber-full::after { content: ' →'; opacity: .7; }

/* Platform action variants for new say-it capabilities */
.platform-action-card.pa-study .pa-app,
.platform-action-card.pa-weigh .pa-app { color: var(--c-accent-hard); }
.platform-action-card.pa-study .pa-summary,
.platform-action-card.pa-weigh .pa-summary {
  font-family: var(--f-mono); font-size: 13px; letter-spacing: 0.02em;
}

/* Presence field: slow ink wash so the first viewport feels attended-to */
.wrap::before {
  content: '';
  position: fixed; inset: -20% -10% auto -10%;
  height: 55vh; pointer-events: none; z-index: 0;
  background:
    radial-gradient(ellipse 70% 55% at 50% 0%, rgba(128, 145, 214, 0.07), transparent 70%),
    radial-gradient(ellipse 50% 40% at 80% 20%, rgba(239, 124, 147, 0.04), transparent 65%);
  animation: fieldDrift 18s ease-in-out infinite alternate;
}
.wrap.membrane-home::before { display: none; }
@keyframes fieldDrift {
  0% { opacity: 0.7; transform: translateY(0); }
  100% { opacity: 1; transform: translateY(8px); }
}
@media (prefers-reduced-motion: reduce) {
  .wrap::before { animation: none; }
  .answer-chip { transition: none; }
  .room-door { transition: none; }
}


/* ── Alive pass: presence over cosplay ───────────────────────────────── */
.mast-glyph { width: 42px; height: 28px; }
.mast-tag {
  font-size: 8px; letter-spacing: 0.22em; opacity: .55;
  margin-top: 2px;
}
.case-title { display: none; }
.today-label {
  font-size: 9px; letter-spacing: 0.14em; opacity: .7;
  padding-top: 8px;
}
header { padding-bottom: 8px; }
.mast-rule {
  position: sticky; top: 58px; z-index: 6;
  margin: 8px 0 0; opacity: .55;
  background: var(--c-bg-0);
}

.composer textarea {
  font-size: 19px; min-height: 72px;
  font-family: var(--f-serif);
  font-variation-settings: "opsz" 24;
}
.composer textarea::placeholder {
  font-family: var(--f-serif); font-style: italic; font-size: 19px;
  opacity: .55;
}

.keep-btn {
  font-family: var(--f-serif); font-weight: 600; font-size: 14px;
  letter-spacing: 0.04em;
  padding: 10px 18px;
  border: 1px solid var(--c-brand);
  color: var(--c-bg-0);
  background: var(--c-brand);
  border-radius: 2px;
}
.keep-btn:hover {
  background: var(--c-brand-hi); border-color: var(--c-brand-hi);
  color: var(--c-bg-0);
}

.ai-reply {
  animation: replyArrive .7s cubic-bezier(.16,1,.3,1) both;
}
@keyframes replyArrive {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: none; }
}
.ai-reply.thinking {
  animation: none;
  opacity: .7;
}
.ai-reply.thinking .who::before {
  animation: voicePulse 1.4s ease-in-out infinite;
}

.home-nav {
  margin-top: 36px; opacity: .75;
  transition: opacity 200ms;
}
.home-nav:hover { opacity: 1; }

.wrap::before {
  content: '';
  position: fixed; inset: -15% -8% auto -8%;
  height: 52vh; pointer-events: none; z-index: 0;
  background:
    radial-gradient(ellipse 55% 45% at 50% 8%, rgba(201, 164, 106, 0.1), transparent 68%),
    radial-gradient(ellipse 65% 50% at 40% 10%, rgba(212, 120, 106, 0.05), transparent 70%),
    radial-gradient(ellipse 45% 35% at 85% 30%, rgba(138, 154, 122, 0.04), transparent 65%);
  animation: fieldBreath 22s ease-in-out infinite alternate;
}
@keyframes fieldBreath {
  0% { opacity: 0.65; transform: translate3d(0,0,0) scale(1); }
  100% { opacity: 1; transform: translate3d(0,12px,0) scale(1.03); }
}

@media (prefers-reduced-motion: reduce) {
  .greeting.reveal, .ai-reply, .wrap::before, .mythic-field, .night-stars circle, .witness::before, .witness-mark, .witness-pupil, .witness-flame, .witness-bindu, .speak-open-eye,
  .room-chamber-snap.is-loading::before, .room-chamber-snap.is-loading::after, .snap-loading, .unlock-mark {
    animation: none !important;
  }
  .greeting.reveal { opacity: 1; filter: none; transform: none; }
}

/* Wedge 11: ambient voice — hide nonessential composer chrome */
#composer.is-ambient .mood-row,
#composer.is-ambient #photo-preview,
#composer.is-ambient .composer-actions button:not(#mic-btn) {
  display: none;
}

.model-diff { font-size: 0.85rem; opacity: 0.85; margin: 0.35rem 0 1rem; }
.trust-head {
  font-family: var(--f-serif); font-size: 16px; font-weight: 600;
  letter-spacing: -0.01em; text-transform: none; color: var(--c-tx-1);
  display: block; margin-bottom: 8px;
}
.trust-lede {
  font-family: var(--f-serif); font-size: 13px; color: var(--c-tx-3);
  margin: 0 0 10px; line-height: 1.4;
}
.trust-line {
  font-family: var(--f-sans); font-size: 14.5px; color: var(--c-tx-1);
  margin: 0; line-height: 1.5; font-style: normal;
}
.trust-when {
  font-family: var(--f-mono); font-size: 10px; color: var(--c-tx-3);
  margin-left: 8px;
}
.vow-begin-row {
  margin: 4px 0 14px;
}
.vow-begin-row .ghost-btn {
  font-family: var(--f-serif); font-style: italic; font-size: 13px;
  color: var(--c-tx-2); border-color: var(--c-line);
}
.vow-begin-row .ghost-btn:hover { color: var(--c-witness); border-color: var(--c-witness); }

#deeper-sheet .calibration,
#deeper-sheet .model-diff,
#deeper-sheet .dream-residue,
#deeper-sheet .repression-ledger,
#deeper-sheet .vows-panel,
#deeper-sheet .beliefs-panel,
#deeper-sheet .hypotheses-panel,
#deeper-sheet .treaty-panel,
#deeper-sheet .option-book,
#deeper-sheet .consent-corridors,
#deeper-sheet .deeper-reading {
  margin: 0;
  padding: 16px;
  border: 1px solid var(--c-line);
  border-radius: 14px;
  background: color-mix(in srgb, var(--c-bg-2) 56%, transparent);
}
.dream-residue.hidden, .repression-ledger.hidden, .treaty-panel.hidden, .option-book.hidden,
.beliefs-panel.hidden, .hypotheses-panel.hidden { display: none; }
.repression-rows, .vows-rows, .treaty-rows, .option-rows, .beliefs-rows, .hypotheses-rows, .dream-flips {
  display: flex; flex-direction: column; gap: 6px;
}
.option-row {
  display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: baseline;
  justify-content: space-between;
  width: 100%; text-align: left; background: none; border: none;
  padding: 4px 0; cursor: pointer;
}
.option-row:hover .option-label { color: var(--c-witness); }
.repression-row, .vow-row, .treaty-row, .belief-row, .hypothesis-row, .dream-flip-row {
  display: block;
  padding: 8px 0;
  border-top: 1px solid color-mix(in srgb, var(--c-line) 72%, transparent);
}
.repression-row:first-child, .vow-row:first-child, .treaty-row:first-child,
.belief-row:first-child, .hypothesis-row:first-child, .dream-flip-row:first-child {
  padding-top: 0;
  border-top: 0;
}
.repression-reason, .vow-text {
  font-family: var(--f-serif); font-size: 13px; color: var(--c-tx-1);
  line-height: 1.4; flex: 1 1 12rem;
}
.repression-at, .vow-at, .treaty-at {
  font-family: var(--f-mono); font-size: 10px; color: var(--c-tx-3);
}

/* Life fork simulation sheet */
.forks-panel {
  max-width: 28rem;
  max-height: min(88dvh, 820px);
}
.forks-body {
  flex: 1 1 auto;
  min-height: 0;
}
.forks-lede {
  font-family: var(--f-serif); font-size: 14px; line-height: 1.45;
  color: var(--c-tx-2); margin: 0 0 14px;
}
.forks-title {
  font-family: var(--f-serif); font-size: 18px; font-weight: 500;
  margin: 0 0 6px; color: var(--c-tx-1);
}
.forks-question, .forks-meta {
  font-size: 13px; color: var(--c-tx-2); margin: 0 0 10px;
}
.forks-meta { font-family: var(--f-mono); font-size: 11px; color: var(--c-tx-3); }
.forks-branches { display: flex; flex-direction: column; gap: 12px; margin: 12px 0; }
.fork-branch {
  padding: 12px; border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--c-line) 80%, transparent);
  background: color-mix(in srgb, var(--c-bg-2) 50%, transparent);
}
.fork-branch-label { font-family: var(--f-serif); font-size: 15px; margin: 0 0 8px; }
.fork-branch-stats {
  display: flex; flex-wrap: wrap; gap: 8px 12px;
  font-family: var(--f-mono); font-size: 11px; color: var(--c-tx-2);
  margin-bottom: 8px;
}
.fork-risks { display: flex; flex-direction: column; gap: 4px; margin-bottom: 8px; }
.fork-risk { font-size: 12px; color: var(--c-warn, var(--c-tx-2)); }
.fork-tradeoffs {
  margin: 0 0 10px; padding-left: 1.1rem;
  font-size: 12px; color: var(--c-tx-2); line-height: 1.4;
}
.forks-actions { margin-top: 10px; }
.forks-empty .delta-act { margin: 6px 6px 0 0; }
.forks-drill-actions { margin: 8px 0 4px; }
.forks-drill-actions.hidden { display: none; }
.forks-create-actions { margin-top: 6px; }
.forks-create-actions.hidden { display: none; }
.forks-status { font-size: 12px; color: var(--c-tx-3); margin-top: 10px; min-height: 1.2em; }
.forks-empty.hidden, .forks-active.hidden { display: none; }
.treaty-kind, .option-stance {
  font-family: var(--f-mono); font-size: 9px; letter-spacing: 0.1em;
  text-transform: uppercase; color: var(--c-tx-3);
}
.treaty-claim, .option-label {
  font-family: var(--f-serif); font-size: 13px; color: var(--c-tx-1);
  line-height: 1.4; flex: 1 1 12rem;
}
.treaty-reason, .option-detail {
  font-family: var(--f-serif); font-size: 12px; color: var(--c-tx-2);
  flex: 1 1 100%;
}
.dream-baseline {
  font-family: var(--f-serif); font-size: 12px; color: var(--c-tx-2);
  margin: 6px 0 0; line-height: 1.4;
}
.dream-flip-scenario {
  font-family: var(--f-mono); font-size: 10px; color: var(--c-tx-3);
  text-transform: lowercase; flex: 1 1 8rem;
}
.dream-flip-shift {
  font-family: var(--f-serif); font-size: 12px; color: var(--c-tx-1);
  flex: 1 1 12rem; line-height: 1.35;
}
.belief-conf, .hypothesis-edge {
  display: none;
}
.belief-claim, .hypothesis-summary {
  font-family: var(--f-sans); font-size: 14.5px; color: var(--c-tx-1);
  line-height: 1.5;
}
.belief-organ, .hypothesis-n {
  display: none;
}
#deeper-sheet .cal-edge,
#deeper-sheet .cal-n,
#deeper-sheet .treaty-kind,
#deeper-sheet .option-stance,
#deeper-sheet .dream-flip-scenario {
  display: none;
}
#deeper-sheet .cal-summary,
#deeper-sheet .repression-reason,
#deeper-sheet .vow-text,
#deeper-sheet .treaty-claim,
#deeper-sheet .option-label,
#deeper-sheet .treaty-reason,
#deeper-sheet .option-detail,
#deeper-sheet .dream-baseline,
#deeper-sheet .dream-flip-shift,
#deeper-sheet .consent-cap,
#deeper-sheet .consent-summary,
#deeper-sheet .consent-lede {
  font-family: var(--f-sans);
  font-style: normal;
}
.why-commitments { margin-top: 14px; }
.why-commitments-head {
  display: block;
  font-size: 0.72rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  opacity: 0.62;
  margin-bottom: 8px;
}
.commitment-rows { display: flex; flex-direction: column; gap: 8px; }
.commitment-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  font-size: 0.92rem;
}
.commitment-due { opacity: 0.62; white-space: nowrap; }

#deeper-sheet .vow-begin-row .ghost-btn {
  min-height: 44px;
  font-family: var(--f-sans);
  font-style: normal;
}
.hypothesis-row.is-quiet .hypothesis-summary { color: var(--c-tx-2); font-style: italic; }
.vows-empty {
  font-family: var(--f-serif); font-size: 13px; color: var(--c-tx-3);
  margin: 0 0 8px; font-style: italic;
}
.vow-begin { margin-top: 6px; }

/* -- Worthy shell: desktop ambient canvas ----------------------------- */
.home-nav-understanding {
  font-family: var(--f-mono);
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  opacity: 0.85;
}
.surface-handled {
  margin-top: 4px;
}
.surface-handled .surface-label {
  opacity: 0.7;
}

/* ── Desktop desk (real layout — not “bigger phone type”) ─────────────
   Conversation mode: full-width page grid. Chamber sits in a middle track
   with intentional field columns — sides are architecture, not leftover margin.
   Type stays reading-size; hierarchy is weight/color/air, not billboard font. */
@media (min-width: 700px) and (max-width: 1099px) {
  .wrap {
    width: min(100%, 680px);
    padding-left: clamp(24px, 4vw, 40px);
    padding-right: clamp(24px, 4vw, 40px);
  }
}

@media (min-width: 900px) {
  .wrap.membrane-home .membrane {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    max-width: 40rem;
    min-height: min(78dvh, 720px);
    margin: 0 auto;
  }
  .wrap.membrane-home .witness {
    align-self: center;
    margin-bottom: clamp(20px, 3.5vh, 36px);
  }
  .wrap.membrane-home .closed-loop-surface {
    width: 100%;
    max-width: 36rem;
  }
  .wrap.membrane-home .surface-now {
    min-height: 0;
  }
  .wrap.membrane-home .delta-actions {
    margin-top: clamp(24px, 4vh, 36px);
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: center;
  }
  .wrap.membrane-home .delta-act {
    min-width: 148px;
    min-height: 48px;
    justify-content: center;
  }
  .wrap.membrane-home .home-nav {
    margin-top: auto;
    padding-top: 36px;
  }
  .wrap.membrane-home .witness-mark {
    width: min(176px, 22vw);
  }
  .wrap.membrane-home .greeting {
    -webkit-line-clamp: unset;
    line-clamp: unset;
    font-size: clamp(28px, 2.6vw, 40px);
    max-width: 44ch;
    text-align: center;
  }
}

@media (min-width: 1100px) {
  /* Widen the quiet-room lamp across the desk — sides should feel lit. */
  body {
    background:
      radial-gradient(70% 55% at 50% 0%, var(--c-lamp), transparent 62%),
      radial-gradient(50% 40% at 12% 30%, rgba(106, 125, 181, 0.08), transparent 55%),
      radial-gradient(45% 38% at 92% 18%, rgba(212, 176, 122, 0.1), transparent 58%),
      radial-gradient(90% 50% at 50% 100%, rgba(0, 0, 0, 0.28), transparent 55%),
      var(--c-bg-0);
    background-attachment: fixed;
  }

  /* Membrane home (no chat): still a centered presence, just wider air. */
  body:has(#conversation[hidden]) .wrap.membrane-home {
    width: min(100%, 820px);
    margin: 0 auto;
    padding-left: clamp(32px, 4vw, 56px);
    padding-right: clamp(32px, 4vw, 56px);
  }

  /*
   * Conversation desk: the wrap becomes the page.
   * Col 1/3 = field. Col 2 = chamber (~reading desk, not phone strip).
   */
  body:has(#conversation.is-summoned:not([hidden])) .wrap.membrane-home {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 18px 0 0;
    display: grid;
    grid-template-columns:
      minmax(40px, 1.05fr)
      minmax(520px, min(1080px, 72vw))
      minmax(56px, 0.95fr);
    grid-template-rows: auto auto minmax(0, 1fr) auto;
    column-gap: 0;
    row-gap: 0;
    min-height: 100dvh;
    box-sizing: border-box;
  }
  body:has(#conversation.is-summoned:not([hidden])) .wrap.membrane-home > * {
    grid-column: 2;
    min-width: 0;
  }
  /* Overlays / sheets must span the full desk, not the chamber track. */
  body:has(#conversation.is-summoned:not([hidden])) .wrap.membrane-home > .settings-sheet,
  body:has(#conversation.is-summoned:not([hidden])) .wrap.membrane-home > .sheet,
  body:has(#conversation.is-summoned:not([hidden])) .wrap.membrane-home > [id$="-sheet"] {
    grid-column: 1 / -1;
  }

  body:has(#conversation.is-summoned:not([hidden])) .wrap.membrane-home header.mast-quiet {
    padding: 4px 8px 12px;
    opacity: 0.78;
  }
  body:has(#conversation.is-summoned:not([hidden])) .wrap.membrane-home .membrane {
    padding: 0 8px;
  }
  body:has(#conversation.is-summoned:not([hidden])) .wrap.membrane-home .witness-mark {
    width: clamp(72px, 8vw, 96px);
  }

  body:has(#conversation.is-summoned:not([hidden])) .conversation.is-summoned {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 4px 8px 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-height: 0;
  }

  /* Readable voice — serif for presence, not a poster. */
  .live .entry .ai-reply {
    margin-top: 14px;
    padding-left: 14px;
  }
  .live .entry .ai-reply .who {
    font-size: 9px;
    letter-spacing: 0.16em;
    margin-bottom: 6px;
  }
  .live .entry .ai-reply .what {
    font-family: var(--f-serif);
    font-weight: 450;
    font-size: clamp(17px, 1.05vw, 19.5px);
    line-height: 1.48;
    letter-spacing: -0.01em;
    font-variation-settings: "opsz" 22, "SOFT" 20;
    color: var(--c-tx-1);
  }
  .live .entry.has-reply .entry-body {
    font-size: 14.5px;
    color: var(--c-tx-3);
  }
  .history {
    opacity: 0.72;
  }
  .history .entry {
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .history .ai-reply .what {
    font-family: var(--f-sans);
    font-size: 15.5px;
    line-height: 1.5;
    color: var(--c-tx-2);
  }
  .history .entry-body,
  .history .case-title {
    font-size: 14.5px;
  }

  /* Desk composer — full chamber width, writing ledge */
  body:has(#conversation.is-summoned:not([hidden])) .composer.is-docked {
    max-width: none;
    width: 100%;
    margin: 0;
    padding: 14px 8px max(18px, env(safe-area-inset-bottom));
    background: linear-gradient(
      180deg,
      transparent,
      color-mix(in srgb, var(--c-bg-0) 82%, transparent) 18%,
      var(--c-bg-0) 42%
    );
    border-top: none;
    box-shadow: none;
  }
  .composer.is-docked textarea {
    min-height: 52px;
    font-size: 17px;
    line-height: 1.45;
  }
  .composer.is-docked textarea::placeholder {
    font-family: var(--f-serif);
    font-style: italic;
    opacity: 0.5;
  }

  .sheet {
    align-items: center;
    padding: 32px 24px;
  }
  .sheet-panel,
  .rooms-sheet .sheet-panel,
  #deeper-sheet .deeper-panel {
    width: min(100%, 780px);
    max-width: 780px;
    max-height: min(82vh, 820px);
    border-radius: 16px;
    box-shadow: 0 28px 80px rgba(0, 0, 0, 0.48);
  }
  .chapter-sheet {
    padding: max(16px, env(safe-area-inset-top)) 24px max(20px, env(safe-area-inset-bottom));
  }
  .chapter-sheet .chapter-panel {
    width: min(100%, 700px);
    max-width: 700px;
    max-height: none;
    height: 100%;
    border-radius: 0;
    box-shadow: none;
  }
}


/* Foundation interview: deepen + revisit (mid-interview safe) */
.onboard-revisit {
  display: block;
  width: 100%;
  margin: 0.5rem 0 0.25rem;
  padding: 0.55rem 0.7rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--line, #3a3a3a) 80%, transparent);
  background: color-mix(in srgb, var(--panel, #1a1a1a) 92%, transparent);
  color: inherit;
  font: inherit;
}
.onboard-deepen {
  display: block;
  width: 100%;
  margin: 0.35rem 0 0.75rem;
  padding: 12px 4px;
  min-height: 44px;
  text-align: left;
  /* ghost-btn is icon-sized (line-height: 0) — restore a real text hit target */
  line-height: 1.35;
  font-family: var(--f-sans);
  font-size: 15px;
  color: var(--c-witness, #c9a46a);
  text-decoration: underline;
  text-underline-offset: 0.18em;
  cursor: pointer;
}
.onboard-deepen:hover,
.onboard-deepen:focus-visible {
  color: var(--c-tx-1);
  background: transparent;
}

/* Synthesis pending after pause — bring him back to Looks right. */
.onboard-finish-cue {
  display: block;
  width: 100%;
  margin: 16px 0 0;
  padding: 14px 16px;
  min-height: 48px;
  text-align: left;
  font-family: var(--f-sans);
  font-size: 15px;
  line-height: 1.35;
  color: var(--c-tx-1);
  background: color-mix(in srgb, var(--c-witness-soft) 45%, var(--c-bg-1));
  border: 1px solid color-mix(in srgb, var(--c-witness) 35%, var(--c-line));
  border-radius: 2px;
  cursor: pointer;
}
.onboard-finish-cue.hidden { display: none !important; }
.onboard-finish-cue:hover {
  border-color: var(--c-witness);
}

/* Institution thin seam */
.institution-list-label {
  margin: 18px 0 8px;
  font-family: var(--f-mono);
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--c-tx-3);
}
.institution-list { display: flex; flex-direction: column; gap: 16px; margin-bottom: 20px; }
.institution-card {
  padding: 12px 0;
  border-bottom: 1px solid var(--c-line);
}
.institution-title {
  margin: 0 0 4px;
  font-family: var(--f-sans);
  font-size: 16px;
  color: var(--c-tx-1);
}
.institution-meta {
  margin: 0 0 8px;
  font-size: 13px;
  color: var(--c-tx-2);
}
.institution-letter {
  white-space: pre-wrap;
  font-family: var(--f-sans);
  font-size: 14px;
  line-height: 1.45;
  color: var(--c-tx-1);
  margin: 0 0 10px;
  max-height: 160px;
  overflow: auto;
}
.institution-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.institution-compose {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-top: 0;
  padding-bottom: 4px;
}
.institution-compose .onboard-input { width: 100%; }


/* In-coach / sparse learning feedback (Wrong · Review · Useful)
 * Never set display:flex on [hidden] hosts — it overrides UA [hidden]{display:none}
 * (live 2026-07-16: every chamber reply showed an open Review sheet). */
.learning-inbox { margin: 10px 0 4px; }
.learning-inbox:not([hidden]) { display: flex; flex-direction: column; gap: 8px; }
.learning-inbox[hidden] { display: none !important; }
.learning-inbox-card {
  padding: 10px 12px; border-radius: 10px;
  border: 1px solid rgba(255,255,255,0.08);
  background: rgba(0,0,0,0.18);
}
.learning-inbox-title { font-size: 14px; font-weight: 600; margin-bottom: 4px; }
.learning-inbox-detail { font-size: 12px; opacity: 0.75; line-height: 1.4; margin-bottom: 8px; white-space: pre-wrap; }
.cfb-host { margin-top: 6px; }
.cfb-row { display: flex; flex-wrap: wrap; gap: 5px; align-items: center; }
.cfb-status { font-size: 11px; opacity: 0.65; min-width: 0; }
.cfb-btn {
  font: inherit; font-size: 11px; padding: 3px 8px; border-radius: 999px;
  border: 1px solid rgba(255,255,255,0.12); background: transparent; color: inherit;
  cursor: pointer; opacity: 0.72;
}
.cfb-btn:hover { opacity: 1; border-color: rgba(255,255,255,0.22); }
.cfb-btn.is-quiet { opacity: 0.5; }
.cfb-btn.is-ok { border-color: rgba(52, 211, 153, 0.45); opacity: 0.9; }
/* Compact default: sheet stays closed until Review. */
.cfb-sheet { width: 100%; margin-top: 6px; }
.cfb-sheet:not([hidden]) { display: flex; flex-direction: column; gap: 6px; }
.cfb-sheet[hidden] { display: none !important; }
.cfb-preview { font-size: 11px; opacity: 0.65; white-space: pre-wrap; margin: 0; }
.cfb-text {
  width: 100%; min-height: 52px; resize: vertical; font: inherit; font-size: 13px;
  padding: 8px; border-radius: 8px; border: 1px solid rgba(255,255,255,0.12);
  background: rgba(0,0,0,0.25); color: inherit;
}
.cfb-sheet-acts { display: flex; gap: 6px; }
/* After Wrong/Useful/Review: hide act pills; sheet stays [hidden] unless Wrong opened nuance. */
.cfb-row.is-judged .cfb-acts { display: none; }
.cfb-row.is-judged .cfb-sheet[hidden] { display: none !important; }
.cfb-row.is-judged .cfb-sheet:not([hidden]) { display: flex; flex-direction: column; gap: 6px; }
.cfb-row.is-judged .cfb-status { opacity: 0.8; }

/* ── Quiet-home craft / organ thresholds / trust watch (deepen136) ───── */
.settings-group-label {
  margin: 10px 6px 4px;
  font-family: var(--font-ui, "IBM Plex Sans", sans-serif);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--c-ink-3, color-mix(in srgb, var(--c-ink) 55%, transparent));
}
.settings-group-label:first-child { margin-top: 2px; }
.conversation-return-bar {
  display: flex;
  align-items: center;
  padding: 4px 2px 8px;
  position: sticky;
  top: 0;
  z-index: 3;
  background: linear-gradient(180deg, color-mix(in srgb, var(--c-bg-0) 92%, transparent) 60%, transparent);
}
.presence-return {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--c-ink-2, color-mix(in srgb, var(--c-ink) 72%, transparent));
  font: inherit;
  font-size: 13px;
  padding: 8px 4px;
  cursor: pointer;
  min-height: 44px;
}
.presence-return:active { opacity: 0.7; }
.organ-threshold {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 8px 0 2px;
  padding: 8px 10px;
  border: 1px solid var(--c-line);
  border-radius: 2px;
  background: color-mix(in srgb, var(--c-bg-1, var(--c-bg-0)) 88%, transparent);
}
.organ-threshold.hidden,
.organ-threshold[hidden] { display: none !important; }
.organ-threshold-label {
  flex: 1;
  font-size: 13px;
  color: var(--c-ink);
  line-height: 1.35;
}
.organ-threshold-open,
.organ-threshold-dismiss {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--c-ink-2);
  font: inherit;
  font-size: 12px;
  padding: 8px 6px;
  cursor: pointer;
  min-height: 40px;
}
.organ-threshold-open {
  color: var(--lamp-core, var(--c-accent, var(--c-ink)));
  font-weight: 500;
}
.trust-watch-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.trust-watch-row {
  padding: 10px 12px;
  border: 1px solid var(--c-line);
  border-radius: 2px;
}
.trust-watch-name {
  display: block;
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 2px;
}
.trust-watch-stage {
  display: block;
  font-size: 12px;
  color: var(--c-ink-2);
  margin-bottom: 4px;
}
.trust-watch-meta {
  display: block;
  font-size: 11px;
  color: var(--c-ink-3, color-mix(in srgb, var(--c-ink) 55%, transparent));
}
body:has(#conversation.is-summoned:not([hidden])) .conversation-return-bar {
  display: flex;
}

.forks-readiness {
  margin: 8px 0 14px;
  padding: 10px 12px;
  border: 1px solid var(--c-line);
  border-radius: 2px;
}
.forks-readiness[hidden] { display: none !important; }
.forks-readiness-lede {
  margin: 0 0 6px;
  font-size: 12px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--c-ink-3, color-mix(in srgb, var(--c-ink) 55%, transparent));
}
.forks-readiness-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.forks-readiness-list li {
  font-size: 13px;
  color: var(--c-ink-2);
}
.forks-readiness-list li.is-ready { color: var(--c-ink); }
.forks-readiness-note {
  margin: 8px 0 0;
  font-size: 11px;
  color: var(--c-ink-3, color-mix(in srgb, var(--c-ink) 55%, transparent));
}
.fork-mission.is-soft {
  opacity: 0.72;
  font-style: italic;
}
.fork-mission {
  margin: 2px 0 8px;
  font-size: 13px;
  color: var(--c-ink-2);
  line-height: 1.35;
}

/* Presence witness depth (deepen145) */
.why-panel-wide { max-width: min(520px, 94vw); }
#why-sheet .why-body .trust-head,
#why-sheet .why-commitments-head {
  display: block;
  margin: 14px 0 6px;
  font-size: 11px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--c-ink-3, color-mix(in srgb, var(--c-ink) 55%, transparent));
}
#why-sheet .model-diff,
#why-sheet .dream-residue,
#why-sheet .beliefs-panel,
#why-sheet .hypotheses-panel,
#why-sheet .repression-ledger,
#why-sheet .vows-panel,
#why-sheet .treaty-panel {
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid var(--c-line);
}
#why-sheet .model-diff.hidden,
#why-sheet .dream-residue.hidden,
#why-sheet .beliefs-panel.hidden,
#why-sheet .hypotheses-panel.hidden,
#why-sheet .repression-ledger.hidden,
#why-sheet .vows-panel.hidden,
#why-sheet .treaty-panel.hidden { display: none !important; }
.why-correct {
  margin-top: 16px;
  padding-top: 12px;
  border-top: 1px solid var(--c-line);
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.chapters-shelf {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.chapter-shelf-card {
  padding: 12px;
  border: 1px solid var(--c-line);
  border-radius: 2px;
}
.chapter-shelf-title {
  display: block;
  font-weight: 500;
  margin-bottom: 4px;
}
.chapter-shelf-reason {
  display: block;
  font-size: 13px;
  color: var(--c-ink-2);
  margin-bottom: 8px;
  line-height: 1.35;
}
.chapter-shelf-meta {
  display: block;
  font-size: 11px;
  color: var(--c-ink-3);
  margin-bottom: 8px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.chapter-shelf-acts {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

/* Request-aware work status */
.work-activity {
  width: min(100%, 680px);
  box-sizing: border-box;
  margin: 10px 0 12px 18px;
  padding: 12px 14px 11px;
  border-radius: 14px;
  background: color-mix(in srgb, var(--c-bg-1) 90%, var(--c-witness-soft));
  border: 1px solid color-mix(in srgb, var(--c-witness) 22%, var(--c-line));
  box-shadow: 0 8px 28px rgba(0, 0, 0, .08);
  font-size: 13px;
  line-height: 1.35;
  overflow: hidden;
  transition: border-color 180ms ease, background 180ms ease;
}
.work-activity-request {
  color: var(--c-tx-3);
  margin-bottom: 7px;
  font-family: var(--f-sans);
  font-size: 11px;
  letter-spacing: .015em;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.work-activity-current {
  color: var(--c-tx-1);
  font-family: var(--f-serif);
  font-size: 16px;
  line-height: 1.35;
  min-height: 22px;
}
.work-activity.is-running .work-activity-current::before {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  margin: 0 9px 2px 1px;
  border-radius: 50%;
  background: var(--c-witness);
  box-shadow: 0 0 0 0 color-mix(in srgb, var(--c-witness) 35%, transparent);
  animation: workPulse 1.8s ease-in-out infinite;
}
.work-activity.is-failed .work-activity-current { color: var(--c-warn, #c45); }
.work-activity-summary {
  display: block;
  margin: 7px 0 0 16px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--c-tx-3);
  font: 11px/1.3 var(--f-sans);
  cursor: pointer;
}
.work-activity-summary[hidden] { display: none; }
.work-activity-summary::after { content: "  ·  details"; opacity: .72; }
.work-activity-summary[aria-expanded="true"]::after { content: "  ·  hide"; }
.work-activity-details { margin: 9px 0 0 16px; }
.work-activity-details[hidden] { display: none; }
.work-receipt { width: min(100%, 680px); margin: 6px 0 10px 18px; }
.work-receipt-toggle {
  width: auto;
  max-width: 100%;
  text-align: left;
  font-size: 11px;
  color: var(--c-ink-3);
  background: transparent;
  border: 0;
  padding: 4px 0 4px 16px;
  cursor: pointer;
}
.work-receipt-toggle:hover,
.work-receipt-toggle:focus-visible { color: var(--c-ink-2); }
.work-receipt-panel {
  margin-top: 6px;
  padding: 10px 12px;
  border-radius: 12px;
  background: color-mix(in srgb, var(--c-bg-1) 90%, var(--c-witness-soft));
  border: 1px solid color-mix(in srgb, var(--c-witness) 16%, var(--c-line));
  font-size: 12px;
}
.work-receipt-steps {
  margin: 0;
  padding: 0;
  color: var(--c-ink-2);
}
.work-activity-timeline {
  display: grid;
  gap: 8px;
}
.work-timeline-row {
  display: grid;
  grid-template-columns: 12px minmax(0, 1fr);
  gap: 8px;
  align-items: start;
  color: var(--c-tx-2);
  line-height: 1.35;
}
.work-timeline-icon {
  width: 6px;
  height: 6px;
  margin-top: 5px;
  border-radius: 50%;
  background: color-mix(in srgb, var(--c-witness) 65%, var(--c-tx-3));
}
.work-timeline-row.is-failed { color: var(--c-warn, #c45); }
.work-timeline-row.is-failed .work-timeline-icon { background: currentColor; }
.work-receipt.is-failed .work-receipt-toggle { color: var(--c-warn, #c45); }
@keyframes workPulse {
  0%, 100% { opacity: .5; box-shadow: 0 0 0 0 transparent; }
  50% { opacity: 1; box-shadow: 0 0 0 4px color-mix(in srgb, var(--c-witness) 12%, transparent); }
}
@media (max-width: 640px) {
  .work-activity,
  .work-receipt {
    width: calc(100% - 10px);
    margin-left: 10px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .work-activity, .work-receipt-panel { transition: none; }
  .work-activity.is-running .work-activity-current::before { animation: none; }
}

/* User-eye P2: narrow-phone floor — 320 / 390 / 430 owner widths */
@media (max-width: 430px) {
  .wrap.membrane-home { padding-left: max(12px, env(safe-area-inset-left)); padding-right: max(12px, env(safe-area-inset-right)); }
  .wrap.membrane-home .witness-mark { width: min(148px, 42vw); }
  .delta-act, .sheet-close, .presence-return, .keep-btn, .send-btn { min-height: 44px; }
  .settings-sheet:not(.hidden) { max-height: min(58dvh, 480px); }
  .greeting.is-loading, .greeting.is-error, .greeting.is-retry { max-width: 28ch; margin-inline: auto; }
}
@media (max-width: 390px) {
  .mast-quiet { gap: 8px; }
  .wrap.membrane-home .delta-actions { gap: 10px; }
  .wrap.membrane-home .delta-act { min-width: 0; flex: 1 1 calc(50% - 6px); }
}
@media (max-width: 320px) {
  .unlock-card { padding-inline: 8px; }
  .unlock-mark { width: min(132px, 46vw); }
  .wordmark { font-size: clamp(22px, 7vw, 28px); }
  .sheet-panel { border-radius: 14px 14px 0 0; }
}
@media (prefers-reduced-motion: reduce) {
  .sheet, .sheet-panel, .settings-sheet, .unlock-card { animation: none !important; }
}

