@font-face {
  font-family: "Terminus";
  src: url("Terminus.ttf?v=1") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: block;
}

:root {
  color-scheme: dark;
  --screen: #0c1010;
  --screen-soft: #121818;
  --phosphor: #a9c9df;
  --phosphor-bright: #e9f8ff;
  --phosphor-dim: #58758c;
  --phosphor-faint: #2d4558;
  --cyan: #79c6ed;
  --cyan-soft: rgba(121, 198, 237, 0.14);
  --inverse-ink: #15232c;
  --inverse-bg: #dbeef7;
  --user-phosphor: #d9e7ee;
  --user-label: rgba(187, 215, 227, 0.82);
  --danger: #d5a482;
  --glow-rgb: 107, 216, 255;
  --glow-bright-rgb: 143, 216, 255;
  --bloom-fine-alpha: 0.72;
  --bloom-mid-alpha: 0.34;
  --bloom-wide-alpha: 0.18;
  --drop-near-alpha: 0.3;
  --drop-wide-alpha: 0.13;
  --screen-radial: rgba(67, 78, 76, 0.22);
  --screen-radial-soft: rgba(22, 29, 28, 0.15);
  --screen-top: #111717;
  --screen-bottom: #080b0b;
  --screen-lift-alpha: 0;
  --brightness-dark-alpha: 0;
  --brightness-light-alpha: 0;
  --noise-opacity: 0.145;
  --scanline-opacity: 0.52;
  --sweep-opacity: 0;
  --vignette-mid-alpha: 0.045;
  --vignette-edge-alpha: 0.113;
  --vignette-shadow-alpha: 0.1;
  --flicker-low: 0.989;
  --flicker-high: 1.019;
  --flicker-soft-low: 0.996;
  --flicker-soft-high: 1.007;
  --flicker-dark-alpha: 0.012;
  --flicker-bright-alpha: 0.019;
  --flicker-soft-alpha: 0.007;
  --persistence-opacity: 0.273;
  --persistence-duration: 799ms;
  --separator-gray: rgba(226, 234, 237, 0.62);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --composer-stack-height: 4.6rem;
  --app-height: 100dvh;
  --content-width: clamp(61.25rem, 72vw, 100rem);
  font-family: "Terminus", "Noto Sans Mono CJK JP", "Noto Sans Mono CJK SC", "Noto Sans Mono CJK TC", "Noto Sans Mono", "Yu Gothic UI", "Microsoft YaHei UI", "PingFang SC", "Hiragino Sans", "Cascadia Mono", "SFMono-Regular", Menlo, Consolas, "Liberation Mono", monospace;
}

* {
  box-sizing: border-box;
}

html[data-e2e-mode="true"] *,
html[data-e2e-mode="true"] *::before,
html[data-e2e-mode="true"] *::after {
  scroll-behavior: auto !important;
  transition: none !important;
  animation: none !important;
}

html[data-e2e-mode="true"] .crt-noise,
html[data-e2e-mode="true"] .crt-flicker,
html[data-e2e-mode="true"] .crt-brightness,
html[data-e2e-mode="true"] .crt-scan,
html[data-e2e-mode="true"] .crt-persistence {
  display: none !important;
}

html,
body {
  width: 100%;
  height: 100%;
  margin: 0;
  overflow: hidden;
  background: transparent;
}

body {
  color: var(--phosphor);
  font-size: clamp(17px, 0.52vw + 10px, 18px);
  line-height: 1.62;
}

button,
textarea {
  font: inherit;
}

button {
  color: inherit;
}

::selection {
  background: var(--inverse-bg);
  color: var(--inverse-ink);
  text-shadow: none;
}

.skip-link {
  position: fixed;
  z-index: 100;
  top: 0.75rem;
  left: 0.75rem;
  padding: 0.5rem 0.75rem;
  border: 1px solid var(--phosphor-bright);
  background: #000;
  color: var(--phosphor-bright);
  transform: translateY(-180%);
}

.skip-link:focus {
  transform: translateY(0);
}

.crt-screen {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: auto minmax(0, 1fr) auto auto;
  width: 100%;
  height: var(--app-height);
  min-height: 360px;
  overflow: hidden;
  background:
    linear-gradient(rgba(255, 255, 255, var(--screen-lift-alpha)), rgba(255, 255, 255, var(--screen-lift-alpha))),
    radial-gradient(ellipse at 50% 44%, var(--screen-radial) 0%, var(--screen-radial-soft) 46%, rgba(0, 0, 0, 0.75) 100%),
    linear-gradient(180deg, var(--screen-top) 0%, var(--screen) 52%, var(--screen-bottom) 100%);
  box-shadow:
    inset 0 0 6rem rgba(0, 0, 0, 0.72),
    inset 0 0 1.5rem rgba(121, 198, 237, 0.06);
}

.crt-screen.is-buddha-boot .terminal-header,
.crt-screen.is-buddha-boot .composer-region,
.crt-screen.is-buddha-boot .terminal-footer,
.crt-screen.is-buddha-boot .new-message-jump {
  display: none;
}

.crt-screen[data-debug-mode="false"] .terminal-header,
.crt-screen[data-debug-mode="false"] .terminal-footer,
.crt-screen[data-debug-mode="false"] .session-marker {
  display: none;
}

.crt-screen.is-disconnected {
  grid-template-rows: minmax(0, 1fr);
}

.crt-screen.is-disconnected .terminal-header,
.crt-screen.is-disconnected .composer-region,
.crt-screen.is-disconnected .terminal-footer,
.crt-screen.is-disconnected .new-message-jump {
  display: none;
}

.crt-screen.is-disconnected .conversation,
.crt-screen.is-disconnected .conversation-column,
.crt-screen.is-disconnected .disconnected-screen {
  width: 100%;
  height: 100%;
  min-height: 0;
}

.crt-screen.is-disconnected .conversation {
  grid-row: 1;
}

.crt-screen[data-profile="green"] {
  --screen: #001000;
  --screen-soft: #031406;
  --phosphor: #aaffaa;
  --phosphor-bright: #e4ffe4;
  --phosphor-dim: #66ff77;
  --phosphor-faint: #215c28;
  --cyan: #94ff9d;
  --cyan-soft: rgba(102, 255, 119, 0.14);
  --inverse-ink: #001600;
  --inverse-bg: #aaffaa;
  --user-phosphor: #bdffc3;
  --user-label: rgba(156, 255, 156, 0.84);
  --danger: #b4ffb4;
  --glow-rgb: 93, 255, 115;
  --glow-bright-rgb: 125, 255, 140;
  --bloom-fine-alpha: 0.82;
  --bloom-mid-alpha: 0.4;
  --bloom-wide-alpha: 0.2;
  --drop-near-alpha: 0.35;
  --drop-wide-alpha: 0.16;
  --screen-radial: rgba(24, 112, 38, 0.24);
  --screen-radial-soft: rgba(4, 40, 11, 0.17);
  --screen-top: #001805;
  --screen-bottom: #000902;
}

.crt-screen[data-profile="amber"] {
  --screen: #120800;
  --screen-soft: #1a0c02;
  --phosphor: #ffd18a;
  --phosphor-bright: #fff0c8;
  --phosphor-dim: #ffb24a;
  --phosphor-faint: #6b3a17;
  --cyan: #ffc15f;
  --cyan-soft: rgba(255, 178, 74, 0.13);
  --inverse-ink: #1a0b00;
  --inverse-bg: #ffd18a;
  --user-phosphor: #ffd08a;
  --user-label: rgba(255, 191, 102, 0.84);
  --danger: #ffb45c;
  --glow-rgb: 255, 173, 51;
  --glow-bright-rgb: 255, 209, 102;
  --bloom-fine-alpha: 0.5;
  --bloom-mid-alpha: 0.22;
  --bloom-wide-alpha: 0.1;
  --drop-near-alpha: 0.2;
  --drop-wide-alpha: 0.08;
  --screen-radial: rgba(133, 62, 9, 0.22);
  --screen-radial-soft: rgba(52, 22, 2, 0.15);
  --screen-top: #1b0b00;
  --screen-bottom: #090400;
  animation-duration: 760ms;
}

.crt-screen[data-profile="simple"] {
  --screen: #000;
  --screen-soft: #000;
  --phosphor: #cfd8dc;
  --phosphor-bright: #f4f8fa;
  --phosphor-dim: #86959d;
  --phosphor-faint: #526168;
  --cyan: #a5b4bb;
  --cyan-soft: rgba(207, 216, 220, 0.08);
  --inverse-ink: #101416;
  --inverse-bg: #e5ecef;
  --user-phosphor: #eef2f4;
  --user-label: rgba(218, 226, 230, 0.92);
  --danger: #aab4b9;
  --screen-radial: transparent;
  --screen-radial-soft: transparent;
  --screen-top: #000;
  --screen-bottom: #000;
  animation: none;
  box-shadow: none;
}

.crt-screen::before {
  position: absolute;
  z-index: 20;
  inset: 0;
  background:
    repeating-linear-gradient(
      180deg,
      rgba(195, 229, 244, 0.012) 0,
      rgba(195, 229, 244, 0.012) 1px,
      rgba(0, 0, 0, 0.055) 2px,
      rgba(0, 0, 0, 0.055) 4px
    );
  content: "";
  opacity: var(--scanline-opacity);
  pointer-events: none;
}

.crt-screen::after {
  position: absolute;
  z-index: 22;
  inset: 0;
  border: 1px solid rgba(169, 201, 223, 0.12);
  background: radial-gradient(ellipse at center, transparent 58%, rgba(0, 0, 0, var(--vignette-mid-alpha)) 83%, rgba(0, 0, 0, var(--vignette-edge-alpha)) 115%);
  box-shadow:
    inset 0 0 1px rgba(233, 248, 255, 0.35),
    inset 0 0 6rem rgba(0, 0, 0, var(--vignette-shadow-alpha));
  content: "";
  pointer-events: none;
}

.crt-noise {
  position: absolute;
  z-index: 19;
  inset: 0;
  background-image: url("crt-noise-seamless.png?v=2");
  background-repeat: repeat;
  background-position: 0 0;
  background-size: 256px 256px;
  content: "";
  filter: contrast(175%) brightness(62%);
  mix-blend-mode: normal;
  opacity: var(--noise-opacity);
  pointer-events: none;
  animation: crt-noise 210ms steps(2, jump-none) infinite;
}

.crt-flicker {
  position: absolute;
  z-index: 18;
  inset: 0;
  background: transparent;
  pointer-events: none;
  animation: crt-flicker-overlay 820ms steps(1, end) infinite;
}

.crt-brightness {
  position: absolute;
  z-index: 17;
  inset: 0;
  background:
    linear-gradient(rgba(255, 255, 255, var(--brightness-light-alpha)), rgba(255, 255, 255, var(--brightness-light-alpha))),
    linear-gradient(rgba(0, 0, 0, var(--brightness-dark-alpha)), rgba(0, 0, 0, var(--brightness-dark-alpha)));
  pointer-events: none;
}

.crt-scan {
  position: absolute;
  z-index: 21;
  top: -14%;
  right: 0;
  left: 0;
  height: 14%;
  background: linear-gradient(180deg, transparent, rgba(146, 208, 235, 0.055) 74%, rgba(214, 243, 255, 0.09) 80%, transparent);
  opacity: var(--sweep-opacity);
  pointer-events: none;
  animation: crt-scan 9s linear infinite;
}

.crt-persistence {
  position: absolute;
  z-index: 16;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  user-select: none;
  contain: strict;
}

.crt-persistence-copy {
  position: absolute !important;
  z-index: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
  opacity: 0;
  scrollbar-width: none !important;
  touch-action: none !important;
  animation: crt-persistence-decay var(--persistence-copy-duration, var(--persistence-duration)) ease-out forwards;
  will-change: opacity, filter;
}

.crt-persistence-copy::-webkit-scrollbar {
  display: none;
}

.crt-persistence-spacer {
  width: 1px;
  min-height: 0;
  margin: 0 !important;
  padding: 0;
}

.crt-persistence-copy *,
.crt-persistence-copy *::before,
.crt-persistence-copy *::after {
  transition: none !important;
  animation: none !important;
  caret-color: transparent !important;
}

@keyframes crt-persistence-decay {
  0% {
    filter: blur(0.18px) brightness(1.08);
    opacity: var(--persistence-copy-opacity, var(--persistence-opacity));
  }

  38% {
    filter: blur(0.28px) brightness(1.04);
    opacity: calc(var(--persistence-copy-opacity, var(--persistence-opacity)) * 0.52);
  }

  100% {
    filter: blur(0.42px) brightness(1);
    opacity: 0;
  }
}

.terminal-header,
.terminal-footer,
.turn,
.composer-region,
.session-marker,
.time-divider,
.new-message-jump {
  text-shadow:
    0 0 0.035em rgba(244, 252, 255, 0.98),
    0 0 0.18em rgba(var(--glow-bright-rgb), var(--bloom-fine-alpha)),
    0 0 0.55em rgba(var(--glow-rgb), var(--bloom-mid-alpha)),
    0 0 1.25em rgba(var(--glow-rgb), var(--bloom-wide-alpha));
}

.turn-copy,
.terminal-identity,
.prototype-state,
.composer,
.terminal-footer {
  filter: none;
}

.terminal-header {
  grid-row: 1;
  z-index: 3;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  justify-content: space-between;
  min-height: 48px;
  padding: 0.6rem max(1rem, calc((100% - var(--content-width)) / 2));
  border-bottom: 1px solid rgba(121, 198, 237, 0.22);
  background: linear-gradient(180deg, rgba(9, 20, 26, 0.91), rgba(2, 7, 9, 0.78));
  color: var(--phosphor-dim);
  font-size: 0.72rem;
  letter-spacing: 0.105em;
}

.terminal-controls,
.profile-control,
.text-scale-control {
  display: flex;
  align-items: center;
}

.terminal-controls {
  justify-self: center;
  gap: 0.85rem;
}

.profile-control,
.text-scale-control {
  gap: 0.55rem;
  color: var(--phosphor-faint);
}

.profile-control select {
  min-height: 30px;
  padding: 0.2rem 1.7rem 0.2rem 0.45rem;
  border: 1px solid var(--phosphor-faint);
  border-radius: 0;
  outline: 0;
  background: var(--screen-soft);
  color: var(--phosphor);
  cursor: pointer;
  font: inherit;
  letter-spacing: 0.06em;
}

.profile-control select:focus-visible {
  border-color: var(--phosphor-bright);
  box-shadow: 0 0 0.6rem rgba(var(--glow-rgb), 0.35);
}

.text-scale-control button,
.fx-toggle {
  min-width: 32px;
  min-height: 30px;
  padding: 0.15rem 0.35rem;
  border: 1px solid var(--phosphor-faint);
  border-radius: 0;
  background: var(--screen-soft);
  color: var(--phosphor);
  cursor: pointer;
  line-height: 1;
}

.text-scale-control button:hover,
.text-scale-control button:focus-visible,
.fx-toggle:hover,
.fx-toggle:focus-visible,
.fx-toggle[aria-expanded="true"] {
  border-color: var(--phosphor-bright);
  background: var(--inverse-bg);
  color: var(--inverse-ink);
  outline: 0;
  text-shadow: none;
}

.text-scale-control output {
  min-width: 3.4em;
  color: var(--phosphor-dim);
  text-align: center;
}

.fx-toggle {
  letter-spacing: 0.08em;
}

.prototype-state {
  justify-self: end;
}

.prototype-state[data-connected="true"] {
  color: var(--phosphor-dim);
}

.terminal-identity,
.prototype-state {
  display: flex;
  align-items: center;
  gap: 0.65rem;
}

.terminal-name {
  color: var(--phosphor-bright);
  font-weight: 700;
}

.terminal-path {
  color: var(--cyan);
}

.prototype-state {
  color: var(--danger);
}

.status-light {
  width: 0.55rem;
  height: 0.55rem;
  border-radius: 50%;
  background: var(--cyan);
  box-shadow: 0 0 0.35rem var(--cyan), 0 0 1rem rgba(121, 198, 237, 0.72);
  animation: status-pulse 2.4s ease-in-out infinite;
}

.conversation {
  grid-row: 2;
  z-index: 2;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  touch-action: pan-y;
  overscroll-behavior-y: contain;
  scrollbar-color: var(--phosphor-faint) transparent;
  scrollbar-width: thin;
  /* The visual breathing room is the .stream-end element.  Scroll padding
     makes scrollIntoView stop 19–47 px before the real live edge depending
     on the browser, so it must remain zero for deterministic following. */
  scroll-padding-block: 0;
  -webkit-overflow-scrolling: touch;
}

@media (pointer: coarse) {
  .conversation:focus {
    outline: none;
  }
}

.conversation::-webkit-scrollbar {
  width: 12px;
}

.conversation::-webkit-scrollbar-track {
  border-left: 1px solid rgba(121, 198, 237, 0.08);
  background: rgba(0, 0, 0, 0.22);
}

.conversation::-webkit-scrollbar-thumb {
  border: 3px solid transparent;
  border-radius: 0;
  background: var(--phosphor-faint);
  background-clip: padding-box;
  box-shadow: 0 0 0.6rem rgba(121, 198, 237, 0.38);
}

.conversation-column {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  width: min(var(--content-width), calc(100% - 2rem));
  min-height: 100%;
  margin: 0 auto;
  padding: clamp(1.35rem, 4vh, 3.4rem) 0 0;
}

.conversation-column > .session-marker,
.conversation-column > .time-divider,
.conversation-column > .turn,
.conversation-column > .stream-end {
  flex: none;
}

.conversation-column.is-booting {
  width: 100%;
  max-width: none;
  min-height: 100%;
  padding: 0;
}

.buddha-boot {
  display: grid;
  grid-template-rows: auto auto;
  place-content: center;
  place-items: center;
  gap: clamp(1rem, 3vh, 2rem);
  width: 100%;
  min-height: 100%;
  padding: 1.5rem;
  overflow: hidden;
  opacity: 1;
  transition: opacity 300ms ease-out, filter 300ms ease-out;
}

.buddha-boot.is-fading {
  filter: brightness(1.35) blur(1px);
  opacity: 0;
}

/* The opening image never changes containing block: keeping it screen-relative
   prevents the sub-pixel/scrollbar jump that reparenting caused at transition
   time. It remains below the permanent CRT overlays throughout. */
.buddha-boot.is-screen-overlay {
  position: absolute;
  z-index: 15;
  inset: 0;
  isolation: isolate;
  min-height: 0;
  overflow: hidden;
  background: transparent;
  pointer-events: auto;
  contain: paint;
}

/* Diagnostic transitions continue to reveal live, selectable DOM; option 1
   is the exception and constructs its welcome progressively after a hard cut. */
.buddha-boot.is-transition-overlay {
  transition: none;
  will-change: clip-path, filter, opacity, transform;
}

.buddha-boot.is-transition-overlay::before {
  position: absolute;
  z-index: 0;
  inset: 0;
  background:
    linear-gradient(rgba(255, 255, 255, var(--screen-lift-alpha)), rgba(255, 255, 255, var(--screen-lift-alpha))),
    radial-gradient(ellipse at 50% 44%, var(--screen-radial) 0%, var(--screen-radial-soft) 46%, rgba(0, 0, 0, 0.75) 100%),
    linear-gradient(180deg, var(--screen-top) 0%, var(--screen) 52%, var(--screen-bottom) 100%);
  box-shadow:
    inset 0 0 6rem rgba(0, 0, 0, 0.72),
    inset 0 0 1.5rem rgba(121, 198, 237, 0.06);
  content: "";
  pointer-events: none;
}

.buddha-boot.is-transition-overlay .buddha-media-stage,
.buddha-boot.is-transition-overlay .buddha-status {
  position: relative;
  z-index: 2;
}

.buddha-transition-echo {
  position: absolute;
  z-index: 3;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  opacity: 0;
  pointer-events: none;
  filter:
    brightness(1.45)
    drop-shadow(0 0 0.12rem rgba(var(--glow-bright-rgb), 0.8))
    drop-shadow(0 0 0.7rem rgba(var(--glow-rgb), 0.5));
  mix-blend-mode: screen;
  will-change: filter, opacity, transform;
}

.buddha-transition-echo-upper {
  clip-path: inset(17% 0 65% 0);
}

.buddha-transition-echo-lower {
  clip-path: inset(58% 0 24% 0);
}

.buddha-transition-raster-beam {
  position: absolute;
  z-index: 4;
  top: 0;
  right: 0;
  left: 0;
  height: 4px;
  background: linear-gradient(
    180deg,
    transparent,
    rgba(var(--glow-bright-rgb), 0.94) 48%,
    rgba(var(--glow-rgb), 0.48) 52%,
    transparent
  );
  box-shadow:
    0 0 0.4rem rgba(var(--glow-bright-rgb), 0.72),
    0 0 1.2rem rgba(var(--glow-rgb), 0.42);
  opacity: 0;
  pointer-events: none;
  will-change: opacity, transform;
}

.buddha-transition-static {
  position: absolute;
  z-index: 4;
  inset: 0;
  background-image: url("crt-noise-seamless.png?v=2");
  background-repeat: repeat;
  background-size: 128px 128px;
  filter: contrast(260%) brightness(180%);
  mix-blend-mode: screen;
  opacity: 0;
  pointer-events: none;
  will-change: opacity, transform;
}

.buddha-boot.is-transition-sync-phosphor.is-transitioning::before {
  animation: none;
  opacity: 1;
}

.buddha-boot.is-transition-sync-phosphor.is-transitioning .buddha-image,
.buddha-boot.is-transition-sync-phosphor.is-transitioning .buddha-status {
  animation: crt-transition-sync-cut 720ms steps(1, end) both;
}

.buddha-boot.is-transition-sync-phosphor.is-transitioning .buddha-transition-echo-upper {
  animation: crt-transition-sync-upper-cut 720ms steps(1, end) both;
}

.buddha-boot.is-transition-sync-phosphor.is-transitioning .buddha-transition-echo-lower {
  animation: crt-transition-sync-lower-cut 720ms steps(1, end) both;
}

.buddha-boot.is-transition-sync-phosphor-long.is-transitioning::before {
  animation: none;
  opacity: 1;
}

.buddha-boot.is-transition-sync-phosphor-long.is-transitioning .buddha-image,
.buddha-boot.is-transition-sync-phosphor-long.is-transitioning .buddha-status {
  animation: crt-transition-sync-cut-long 1080ms steps(1, end) both;
}

.buddha-boot.is-transition-sync-phosphor-long.is-transitioning .buddha-transition-echo-upper {
  animation: crt-transition-sync-upper-cut-long 1080ms steps(1, end) both;
}

.buddha-boot.is-transition-sync-phosphor-long.is-transitioning .buddha-transition-echo-lower {
  animation: crt-transition-sync-lower-cut-long 1080ms steps(1, end) both;
}

.buddha-boot.is-transition-sync-raster.is-transitioning .buddha-transition-echo-upper {
  animation: crt-transition-sync-upper 980ms steps(10, end) both;
}

.buddha-boot.is-transition-sync-raster.is-transitioning .buddha-transition-echo-lower {
  animation: crt-transition-sync-lower 980ms steps(10, end) both;
}

.buddha-boot.is-transition-raster-refresh.is-transitioning {
  animation: crt-transition-raster-reveal 920ms steps(22, end) both;
}

.buddha-boot.is-transition-raster-refresh.is-transitioning .buddha-transition-raster-beam {
  animation: crt-transition-raster-beam 920ms steps(22, end) both;
}

.buddha-boot.is-transition-sync-raster.is-transitioning {
  animation: crt-transition-sync-raster-reveal 1180ms steps(24, end) both;
}

.buddha-boot.is-transition-sync-raster.is-transitioning .buddha-image,
.buddha-boot.is-transition-sync-raster.is-transitioning .buddha-status {
  animation: crt-transition-sync-combined-base 1180ms steps(16, end) both;
}

.buddha-boot.is-transition-sync-raster.is-transitioning .buddha-transition-raster-beam {
  animation: crt-transition-raster-beam-combined 1180ms steps(24, end) both;
}

.buddha-boot.is-transition-signal-loss.is-transitioning::before {
  animation: crt-transition-signal-curtain 1120ms steps(1, end) both;
}

.buddha-boot.is-transition-signal-loss.is-transitioning .buddha-image,
.buddha-boot.is-transition-signal-loss.is-transitioning .buddha-status {
  animation: crt-transition-signal-content 1120ms steps(1, end) both;
}

.buddha-boot.is-transition-signal-loss.is-transitioning .buddha-transition-static {
  animation: crt-transition-signal-static 1120ms steps(1, end) both;
}

.temple-notice {
  width: var(--temple-notice-width, 100%);
  margin: 1.5em calc((100% - var(--temple-notice-width, 100%)) / 2);
  color: #ff4f4f;
  line-height: 1.4;
  text-shadow: 0 0 0.2em rgba(255, 79, 79, 0.65);
}

.temple-notice-heading {
  width: 100%;
  padding: 0.25em 0.75em;
  color: #190000;
  background: #ff4f4f;
  text-align: center;
  text-shadow: none;
  box-shadow: 0 0 0.5em rgba(255, 79, 79, 0.5);
  animation: temple-notice-blink 1s steps(1, end) infinite;
}

.temple-notice-body {
  padding: 0.6em 0.75em;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

@keyframes temple-notice-blink {
  0%, 70% { opacity: 1; }
  71%, 100% { opacity: 0.35; }
}

.inline-chat-image-block {
  margin-block: 1em;
  background: transparent;
}

.inline-chat-image {
  display: block;
  width: min(100%, 28rem);
  height: auto;
  max-height: min(60vh, 36rem);
  object-fit: contain;
  /* Keep the raster itself at the text edge even when max-height causes
     letterboxing inside its element. Preserve alpha, including dark artwork. */
  object-position: left top;
  margin-inline: 0;
  border: 0;
  background: transparent;
  mix-blend-mode: normal;
  filter: drop-shadow(0 0 0.12rem rgba(var(--glow-rgb), 0.4));
}

.buddha-media-stage {
  position: relative;
  display: grid;
  place-items: center;
  width: min(34rem, 64vw);
  max-width: 92%;
  min-width: 0;
  min-height: 0;
  background: transparent;
  mix-blend-mode: normal;
}

.terminal-video-source {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  object-fit: contain;
  opacity: 0;
  pointer-events: none;
}

.buddha-image {
  display: block;
  width: 100%;
  height: auto;
  max-height: calc(var(--app-height) - 7rem);
  aspect-ratio: 900 / 1124;
  border: 0;
  background: transparent;
  object-fit: contain;
  /* The canvas removes the encoded black video surface pixel by pixel. Normal
     alpha composition keeps the phosphor strokes visible without introducing
     a rectangular black layer over the live DOM CRT background. */
  mix-blend-mode: normal;
  filter:
    drop-shadow(0 0 0.08rem rgba(var(--glow-bright-rgb), 0.44))
    drop-shadow(0 0 0.34rem rgba(var(--glow-rgb), 0.14));
  opacity: 1;
}

.buddha-image.is-css-opening {
  animation: buddha-css-opening 3800ms steps(20, end) both;
  will-change: clip-path, opacity;
}

.buddha-image.is-css-closing {
  animation: buddha-css-closing 600ms steps(6, end) both;
  will-change: clip-path, opacity, transform;
}

.buddha-status,
.disconnected-label {
  margin: 0;
  font-family: inherit;
  font-size: clamp(1rem, 1.2vw + 0.7rem, 1.55rem);
  letter-spacing: 0.08em;
  line-height: 1;
  text-align: center;
}

.buddha-status {
  max-width: min(58rem, 94vw);
  color: var(--phosphor-bright);
  text-shadow:
    0 0 0.08rem rgba(var(--glow-bright-rgb), 0.9),
    0 0 0.55rem rgba(var(--glow-rgb), 0.54),
    0 0 1.2rem rgba(var(--glow-rgb), 0.28);
  animation: startup-status-blink 1s steps(1, end) infinite;
}

.buddha-status.is-connected {
  color: #79e287;
  animation: none;
}

.disconnected-screen {
  display: grid;
  grid-template-rows: auto auto;
  place-content: center;
  place-items: center;
  gap: clamp(1rem, 3vh, 2rem);
  width: 100%;
  min-height: 0;
  padding: 1.5rem;
  overflow: hidden;
}

.disconnected-label {
  color: #ff4f4f;
  text-shadow: 0 0 0.2em rgba(255, 79, 79, 0.78), 0 0 0.8em rgba(255, 35, 35, 0.42);
  animation: disconnected-label-blink 900ms steps(1, end) infinite;
}

.disconnected-copy {
  display: grid;
  justify-items: center;
  gap: clamp(0.6rem, 1.5vh, 1rem);
  max-width: min(58rem, 94vw);
  color: #ff4f4f;
  text-align: center;
}

.disconnected-message {
  margin: 0;
  color: #ff4f4f;
  font-size: clamp(1rem, 0.8vw + 0.75rem, 1.35rem);
  letter-spacing: 0.035em;
  line-height: 1.35;
  text-align: center;
  text-shadow: 0 0 0.14em rgba(255, 79, 79, 0.68), 0 0 0.62em rgba(255, 35, 35, 0.3);
}

.conversation-media {
  width: min(38rem, 100%);
  margin: 0;
}

.conversation-media figcaption {
  margin: 0 0 0.45rem;
  color: var(--phosphor-dim);
  font-size: 0.78em;
  letter-spacing: 0.055em;
  line-height: 1.35;
  text-shadow:
    0 0 0.12em rgba(var(--glow-bright-rgb), var(--bloom-fine-alpha)),
    0 0 0.5em rgba(var(--glow-rgb), var(--bloom-mid-alpha));
}

.conversation-media-stage {
  width: min(30rem, 100%);
  max-width: 100%;
}

.conversation-media-stage .buddha-image {
  max-height: min(62vh, 35rem);
}

.conversation-media-replay {
  display: block;
  margin: 0.55rem 0 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--phosphor-dim);
  cursor: pointer;
  font-size: 0.78em;
  letter-spacing: 0.055em;
  line-height: 1.35;
  text-shadow:
    0 0 0.12em rgba(var(--glow-bright-rgb), var(--bloom-fine-alpha)),
    0 0 0.5em rgba(var(--glow-rgb), var(--bloom-mid-alpha));
}

.conversation-media-replay:hover,
.conversation-media-replay:focus-visible {
  color: var(--phosphor-bright);
  outline: none;
  text-shadow:
    0 0 0.16em rgba(var(--glow-bright-rgb), 0.95),
    0 0 0.68em rgba(var(--glow-rgb), 0.72);
}

.session-marker {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: clamp(2.2rem, 7vh, 5.5rem);
  color: var(--phosphor-faint);
  font-size: 0.66rem;
  letter-spacing: 0.13em;
}

.turn {
  position: relative;
  display: grid;
  grid-template-columns: 5.9rem minmax(0, 1fr);
  column-gap: 1.15rem;
  margin: 0 0 clamp(2.3rem, 6vh, 4.8rem);
  color: var(--phosphor);
}

.conversation-column > .turn:last-of-type {
  margin-bottom: 0;
}

.turn-header {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.55rem;
}

.role-label {
  --inverse-surface: var(--inverse-bg);
  display: inline-block;
  padding: 0.06em 0.28em 0.1em;
  background:
    linear-gradient(
      180deg,
      rgba(var(--glow-bright-rgb), calc(var(--bloom-fine-alpha) * 0.22)) 0,
      transparent 32%,
      transparent 68%,
      rgba(var(--glow-rgb), calc(var(--bloom-fine-alpha) * 0.18)) 100%
    ),
    var(--inverse-surface);
  box-shadow:
    inset 0 0.07em rgba(var(--glow-bright-rgb), calc(var(--bloom-fine-alpha) * 0.58)),
    inset 0 -0.07em rgba(var(--glow-rgb), calc(var(--bloom-fine-alpha) * 0.42)),
    0 0 0.12rem rgba(var(--glow-bright-rgb), var(--bloom-fine-alpha)),
    0 0 0.58rem rgba(var(--glow-rgb), var(--bloom-mid-alpha)),
    0 0 1.12rem rgba(var(--glow-rgb), var(--bloom-wide-alpha));
  color: var(--inverse-ink);
  font-weight: 700;
  line-height: 1.3;
  text-shadow: none;
  filter:
    drop-shadow(0 0 0.05rem rgba(var(--glow-bright-rgb), var(--drop-near-alpha)))
    drop-shadow(0 0 0.34rem rgba(var(--glow-rgb), var(--drop-wide-alpha)));
}

.turn-copy {
  max-width: 49rem;
  min-width: 0;
}

.turn.is-thinking {
  align-items: start;
}

.turn.is-thinking .turn-copy {
  display: flex;
  align-items: center;
  min-height: 1.46em;
}

.turn-copy p,
.turn-copy ol {
  margin: 0 0 1.15em;
}

.turn-copy p {
  tab-size: 4;
  white-space: pre-wrap;
}

.rich-fragment {
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}

.rich-foreground {
  color: rgb(var(--rich-fg-rgb));
  text-shadow:
    0 0 0.025em rgba(var(--rich-fg-rgb), 0.96),
    0 0 0.14em rgba(var(--rich-fg-rgb), var(--bloom-fine-alpha)),
    0 0 0.42em rgba(var(--rich-fg-rgb), var(--bloom-mid-alpha)),
    0 0 0.9em rgba(var(--rich-fg-rgb), var(--bloom-wide-alpha));
}

.rich-background {
  padding-inline: 0.1em;
  background-color: rgb(var(--rich-bg-rgb));
  box-shadow:
    inset 0 0.06em rgba(255, 255, 255, 0.13),
    0 0 0.12em rgba(var(--rich-bg-rgb), var(--bloom-fine-alpha)),
    0 0 0.5em rgba(var(--rich-bg-rgb), var(--bloom-mid-alpha));
}

.rich-bold {
  font-weight: 700;
}

.rich-underline {
  text-decoration-line: underline;
  text-decoration-thickness: 0.08em;
  text-underline-offset: 0.14em;
}

.rich-blink {
  animation: rich-text-blink 1.08s steps(1, end) infinite;
}

@keyframes rich-text-blink {
  0%,
  48% {
    opacity: 1;
  }

  49%,
  100% {
    opacity: 0;
  }
}

.turn-copy p:last-child,
.turn-copy ol:last-child {
  margin-bottom: 0;
}

.turn-copy ol {
  padding-left: 1.8rem;
}

.turn-copy li + li {
  margin-top: 0.45rem;
}

.menu-sample {
  margin-top: 1.6em;
  padding-top: 0;
  border-top: 0;
}

.stream-menu-preview {
  grid-column: 2;
  max-width: 49rem;
  min-width: 0;
  pointer-events: none;
}

.stream-reply-measure {
  position: fixed !important;
  top: -100000px !important;
  left: -100000px !important;
  z-index: -1 !important;
  max-height: none !important;
  overflow: visible !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

.stream-menu-preview .menu-option:disabled {
  color: var(--phosphor);
  cursor: default;
}

.menu-question {
  color: var(--phosphor-bright);
}

.console-menu {
  display: grid;
  gap: 0;
  margin-top: 0.72rem;
}

.console-menu.is-resolved {
  pointer-events: none;
}

.menu-option {
  display: grid;
  grid-template-columns: 1.8rem 0.85rem minmax(0, 1fr);
  align-items: baseline;
  width: 100%;
  min-height: 0;
  padding: 0.12rem 0;
  border: 0;
  background: transparent;
  color: var(--phosphor);
  cursor: pointer;
  line-height: 1.26;
  text-align: left;
  text-shadow:
    0 0 0.035em rgba(244, 252, 255, 0.98),
    0 0 0.18em rgba(var(--glow-bright-rgb), var(--bloom-fine-alpha)),
    0 0 0.62em rgba(var(--glow-rgb), var(--bloom-mid-alpha));
}

.option-index {
  color: inherit;
  opacity: 1;
  text-shadow: inherit;
}

.option-cursor {
  color: var(--phosphor-bright);
  opacity: 0;
}

.option-text {
  width: fit-content;
  max-width: 100%;
  padding: 0 0.28rem;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}

.menu-option:focus-visible,
.menu-option.is-active {
  color: var(--phosphor-bright);
  outline: none;
}

.menu-option.is-active .option-text {
  --inverse-surface: var(--inverse-bg);
  background:
    linear-gradient(
      180deg,
      rgba(var(--glow-bright-rgb), calc(var(--bloom-fine-alpha) * 0.22)) 0,
      transparent 32%,
      transparent 68%,
      rgba(var(--glow-rgb), calc(var(--bloom-fine-alpha) * 0.18)) 100%
    ),
    var(--inverse-surface);
  box-shadow:
    inset 0 0.07em rgba(var(--glow-bright-rgb), calc(var(--bloom-fine-alpha) * 0.58)),
    inset 0 -0.07em rgba(var(--glow-rgb), calc(var(--bloom-fine-alpha) * 0.42)),
    0 0 0.12rem rgba(var(--glow-bright-rgb), var(--bloom-fine-alpha)),
    0 0 0.62rem rgba(var(--glow-rgb), var(--bloom-mid-alpha)),
    0 0 1.08rem rgba(var(--glow-rgb), var(--bloom-wide-alpha));
  color: var(--inverse-ink);
  text-shadow: none;
  filter:
    drop-shadow(0 0 0.05rem rgba(var(--glow-bright-rgb), var(--drop-near-alpha)))
    drop-shadow(0 0 0.32rem rgba(var(--glow-rgb), var(--drop-wide-alpha)));
}

.menu-option.is-active .option-cursor {
  opacity: 1;
}

.menu-option.is-selected,
.menu-option.is-selected:focus-visible {
  color: var(--phosphor-bright);
}

.menu-option.is-selected .option-text,
.menu-option.is-selected:focus-visible .option-text {
  --inverse-surface: var(--inverse-bg);
  background:
    linear-gradient(
      180deg,
      rgba(var(--glow-bright-rgb), calc(var(--bloom-fine-alpha) * 0.22)) 0,
      transparent 32%,
      transparent 68%,
      rgba(var(--glow-rgb), calc(var(--bloom-fine-alpha) * 0.18)) 100%
    ),
    var(--inverse-surface);
  box-shadow:
    inset 0 0.07em rgba(var(--glow-bright-rgb), calc(var(--bloom-fine-alpha) * 0.62)),
    inset 0 -0.07em rgba(var(--glow-rgb), calc(var(--bloom-fine-alpha) * 0.46)),
    0 0 0.12rem rgba(var(--glow-bright-rgb), var(--bloom-fine-alpha)),
    0 0 0.66rem rgba(var(--glow-rgb), var(--bloom-mid-alpha)),
    0 0 1.14rem rgba(var(--glow-rgb), var(--bloom-wide-alpha));
  color: var(--inverse-ink);
  text-shadow: none;
  filter:
    drop-shadow(0 0 0.05rem rgba(var(--glow-bright-rgb), var(--drop-near-alpha)))
    drop-shadow(0 0 0.34rem rgba(var(--glow-rgb), var(--drop-wide-alpha)));
}

.menu-option.is-selected .option-index,
.menu-option.is-selected .option-cursor {
  color: inherit;
  opacity: 1;
}

.menu-option:disabled:not(.is-selected) {
  cursor: default;
  opacity: 0.38;
}

.menu-option:disabled {
  pointer-events: none;
}

.stream-menu-preview .menu-option:disabled:not(.is-selected) {
  opacity: 0.68;
}

.turn-user {
  color: var(--user-phosphor);
}

.turn-user .role-label {
  --inverse-surface: var(--user-label);
}

.time-divider {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin: 0 0 clamp(2.3rem, 6vh, 4.8rem) 7.05rem;
  color: var(--phosphor-faint);
  font-size: 0.62rem;
  letter-spacing: 0.12em;
}

.time-divider::before,
.time-divider::after {
  height: 1px;
  background: rgba(121, 198, 237, 0.15);
  content: "";
}

.time-divider::before {
  width: 2.5rem;
}

.time-divider::after {
  flex: 1;
}

.stream-end {
  height: 1.62em;
}

.composer-region {
  grid-row: 4;
  z-index: 4;
  min-width: 0;
  overflow: hidden;
  padding: 0 max(1rem, calc((100% - var(--content-width)) / 2)) 0.22rem;
  border-top: 0;
  background: transparent;
  box-shadow: none;
}

.composer-session-status {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-start;
  min-width: 0;
  max-width: 100%;
  margin: 0.2rem 0 0;
  overflow: hidden;
  color: var(--phosphor);
  font: inherit;
  line-height: 1.62;
  text-align: left;
  text-overflow: clip;
  white-space: nowrap;
}

.composer-session-status button {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: inherit;
  cursor: pointer;
  font: inherit;
  text-shadow: inherit;
}

.composer-session-status button:hover,
.composer-session-status button:focus-visible {
  color: var(--phosphor-bright);
  text-decoration: underline;
}

.composer-session-status > span[aria-hidden="true"] {
  margin-inline: 0.35ch;
}

.composer-frame {
  min-width: 0;
}

.composer-frame-line {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr) max-content;
  align-items: start;
  min-width: 0;
  height: 1em;
  overflow: hidden;
  color: var(--separator-gray);
  line-height: 1;
  text-shadow:
    0 0 0.08rem rgba(var(--glow-bright-rgb), 0.68),
    0 0 0.38rem rgba(var(--glow-rgb), 0.28);
  white-space: nowrap;
}

.composer-line-fill {
  min-width: 0;
  overflow: hidden;
}

.composer-frame-middle {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr) max-content;
  align-items: stretch;
  min-width: 0;
}

.composer-rail {
  display: block;
  width: 1ch;
  min-width: 1ch;
  height: 100%;
  overflow: hidden;
  padding: 0;
  color: var(--separator-gray);
  line-height: 1;
  text-shadow:
    0 0 0.08rem rgba(var(--glow-bright-rgb), 0.68),
    0 0 0.38rem rgba(var(--glow-rgb), 0.28);
  white-space: pre;
}

.composer-region[hidden] {
  display: none;
}

.composer {
  display: block;
}

.composer-control {
  position: relative;
  display: block;
  min-width: 0;
  border-bottom: 0;
}

textarea {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  font-size: max(1em, 17px);
  min-height: calc(1.5em + 0.38rem);
  max-height: none;
  margin: 0;
  padding: 0.12rem 0.45rem 0.26rem;
  resize: none;
  overflow-y: auto;
  border: 0;
  outline: 0;
  background: transparent;
  caret-color: var(--phosphor-bright);
  color: var(--phosphor-bright);
  line-height: 1.5;
  text-shadow:
    0 0 0.035em rgba(244, 252, 255, 1),
    0 0 0.2em rgba(var(--glow-bright-rgb), calc(var(--bloom-fine-alpha) + 0.06)),
    0 0 0.7em rgba(var(--glow-rgb), calc(var(--bloom-mid-alpha) + 0.02)),
    0 0 1.35em rgba(var(--glow-rgb), var(--bloom-wide-alpha));
  scrollbar-width: none;
}

.has-block-caret textarea {
  caret-color: transparent;
}

.composer-caret-mirror {
  position: absolute;
  top: 0;
  left: 0;
  box-sizing: border-box;
  height: auto;
  overflow-wrap: break-word;
  pointer-events: none;
  visibility: hidden;
  white-space: pre-wrap;
}

.block-caret {
  position: absolute;
  z-index: 2;
  display: block;
  width: 1ch;
  height: 0.87em;
  background: rgba(var(--glow-bright-rgb), 0.88);
  box-shadow:
    0 0 0.08rem rgba(var(--glow-bright-rgb), 0.9),
    0 0 0.46rem rgba(var(--glow-rgb), 0.55),
    0 0 0.9rem rgba(var(--glow-rgb), 0.24);
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
}

.block-caret.is-visible {
  visibility: visible;
  animation: block-caret-blink 1.05s steps(1, end) infinite;
}

textarea::-webkit-scrollbar {
  display: none;
}

textarea::placeholder {
  color: var(--phosphor-faint);
  opacity: 0.85;
}

.composer-control:focus-within {
  box-shadow: none;
}

.send-button {
  align-self: start;
  min-width: 7.1rem;
  min-height: 44px;
  padding: 0.25rem 0.42rem;
  border: 0;
  background: transparent;
  color: var(--phosphor-dim);
  cursor: pointer;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.09em;
}

.send-button[hidden] {
  display: none;
}

.send-button:not(:disabled):hover,
.send-button:not(:disabled):focus-visible {
  background: var(--inverse-bg);
  color: var(--inverse-ink);
  outline: 0;
  text-shadow: none;
}

.send-button:not(:disabled):active {
  transform: translateY(1px);
}

.send-button:disabled {
  background: transparent;
  color: var(--phosphor-faint);
  cursor: wait;
  opacity: 0.72;
}

.send-arrow {
  display: inline;
  margin-left: 0.25rem;
}

.send-bracket {
  color: var(--phosphor-faint);
  margin-inline: 0.18rem;
}

.composer-meta {
  display: none;
}

.mobile-hint {
  display: none;
}

.terminal-footer {
  grid-row: 3;
  z-index: 4;
  display: flex;
  justify-content: space-between;
  padding: 0.14rem max(1rem, calc((100% - var(--content-width)) / 2)) calc(0.15rem + var(--safe-bottom));
  background: #010304;
  color: var(--phosphor-faint);
  font-size: 0.56rem;
  letter-spacing: 0.095em;
}

.terminal-footer b {
  color: var(--phosphor-dim);
  font-weight: 400;
}

.new-message-jump {
  position: absolute;
  z-index: 10;
  right: max(1rem, calc((100% - var(--content-width)) / 2));
  bottom: calc(var(--composer-stack-height) + 0.55rem);
  min-height: 0;
  padding: 0.18rem;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--phosphor-bright);
  cursor: pointer;
  font-size: 0.86rem;
  box-shadow: none;
  -webkit-tap-highlight-color: transparent;
}

.jump-glyph {
  display: block;
  color: var(--phosphor-bright);
  line-height: 0.78;
  text-align: center;
  text-shadow:
    0 0 0.08rem rgba(var(--glow-bright-rgb), 0.82),
    0 0 0.5rem rgba(var(--glow-rgb), 0.48),
    0 0 0.95rem rgba(var(--glow-rgb), 0.24);
}

.new-message-jump[hidden] {
  display: none;
}

.turn.is-new {
  animation: phosphor-arrival 550ms ease-out both;
}

.typing-block {
  position: relative;
  isolation: isolate;
  display: inline-block;
  min-height: 0;
  line-height: 1.3;
  color: var(--phosphor-bright);
  letter-spacing: 0;
  white-space: pre;
  text-shadow:
    0 0 0.08rem rgba(var(--glow-bright-rgb), 0.8),
    0 0 0.5rem rgba(var(--glow-rgb), 0.42);
}

.typing-block::before {
  position: relative;
  z-index: 1;
  content: "[█     ]";
  animation: typing-block 1.8s steps(1, end) infinite;
}

.typing-block::after {
  position: absolute;
  z-index: 0;
  inset: 0;
  content: " █      ";
  color: var(--phosphor-bright);
  opacity: calc(var(--persistence-opacity) * 0.9);
  filter: blur(0.3px) brightness(1.08);
  text-shadow:
    0 0 0.12rem rgba(var(--glow-bright-rgb), 0.62),
    0 0 0.58rem rgba(var(--glow-rgb), 0.34);
  animation: typing-block-persistence 1.8s steps(1, end) 140ms infinite;
  pointer-events: none;
}

.stream-idle-indicator {
  margin-top: 1.3em;
}

.stream-idle-indicator[hidden] {
  display: none;
}

.turn.has-stream-indicator .turn-header {
  gap: 0;
}

.reveal-line-block {
  overflow: hidden;
  will-change: max-height;
}

.turn-copy.is-streaming-reply {
  overflow: hidden;
  will-change: max-height;
}

.ascii-figure {
  width: max-content;
  max-width: 100%;
  margin: 0.9rem 0 1.05rem;
}

.ascii-figure figcaption {
  margin-bottom: 0.35rem;
  color: var(--phosphor-dim);
  font-size: 0.64em;
  letter-spacing: 0.08em;
}

.ascii-art {
  max-width: 100%;
  min-height: 1.62em;
  margin: 0;
  overflow-x: auto;
  overflow-y: hidden;
  color: var(--phosphor-bright);
  filter:
    drop-shadow(0 0 0.05rem rgba(var(--glow-bright-rgb), var(--drop-near-alpha)))
    drop-shadow(0 0 0.34rem rgba(var(--glow-rgb), var(--drop-wide-alpha)));
  font: inherit;
  font-size: 0.9em;
  line-height: 0.92;
  text-shadow:
    0 0 0.12rem rgba(var(--glow-bright-rgb), var(--bloom-fine-alpha)),
    0 0 0.42rem rgba(var(--glow-rgb), var(--bloom-mid-alpha));
  scrollbar-width: thin;
  white-space: pre;
}

.fx-overlay {
  position: absolute;
  z-index: 40;
  inset: 0;
  display: flex;
  justify-content: flex-end;
  background: rgba(0, 0, 0, 0.28);
  backdrop-filter: blur(0.7px);
}

.fx-overlay[hidden] {
  display: none;
}

.file-overlay {
  position: absolute;
  z-index: 48;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 1rem;
  background: rgba(0, 0, 0, 0.72);
}

.file-overlay[hidden] {
  display: none;
}

.file-panel {
  width: min(42rem, 100%);
  min-width: 0;
  padding: 0;
  border: 0;
  background: rgba(9, 14, 14, 0.96);
  box-shadow: 0 0 2.2rem rgba(var(--glow-rgb), 0.2), inset 0 0 2rem rgba(0, 0, 0, 0.48);
  color: var(--phosphor);
  text-shadow:
    0 0 0.035em rgba(244, 252, 255, 0.98),
    0 0 0.18em rgba(var(--glow-bright-rgb), var(--bloom-fine-alpha)),
    0 0 0.55em rgba(var(--glow-rgb), var(--bloom-mid-alpha)),
    0 0 1.25em rgba(var(--glow-rgb), var(--bloom-wide-alpha));
}

.file-frame-line {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr) max-content;
  min-width: 0;
  height: 1em;
  overflow: hidden;
  color: var(--separator-gray);
  line-height: 1;
  white-space: nowrap;
}

.file-line-fill {
  min-width: 0;
  overflow: hidden;
}

.file-frame-middle {
  position: relative;
  display: grid;
  grid-template-columns: 1ch minmax(0, 1fr) 1ch;
  min-width: 0;
}

.file-rail {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  display: block;
  width: 1ch;
  min-width: 1ch;
  overflow: hidden;
  color: var(--separator-gray);
  line-height: 1;
  white-space: pre;
}

.file-rail:last-child { left: auto; right: 0; }

.file-content {
  grid-column: 2;
  min-width: 0;
  padding: 0.5rem 1rem 0.75rem;
}

.file-header,
.file-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.file-header {
  padding-bottom: 0.45rem;
}

.file-header h2 {
  margin: 0.1rem 0 0;
  color: var(--phosphor-bright);
  font-size: 1rem;
  font-weight: 400;
  letter-spacing: 0.08em;
}

.file-content > p {
  margin: 1.1rem 0;
  white-space: pre-wrap;
}

.file-status {
  color: var(--phosphor-dim);
  min-height: 1.35em;
  font: inherit;
  letter-spacing: 0.06em;
}

.file-status.is-error {
  color: #ff7070;
  text-shadow: 0 0 5px rgb(255 64 64 / 45%);
}

.file-actions {
  justify-content: flex-end;
  padding-top: 0.85rem;
}

.file-actions button,
.file-cancel {
  min-height: 42px;
  padding: 0.4rem 0.65rem;
  border: 0;
  background: transparent;
  color: var(--phosphor);
  cursor: pointer;
  font: inherit;
}

.file-actions button:hover,
.file-actions button:focus,
.file-actions button:focus-visible,
.file-cancel:hover,
.file-cancel:focus,
.file-cancel:focus-visible {
  --inverse-surface: var(--inverse-bg);
  outline: 0;
  background:
    linear-gradient(
      180deg,
      rgba(var(--glow-bright-rgb), calc(var(--bloom-fine-alpha) * 0.22)) 0,
      transparent 32%,
      transparent 68%,
      rgba(var(--glow-rgb), calc(var(--bloom-fine-alpha) * 0.18)) 100%
    ),
    var(--inverse-surface);
  box-shadow:
    inset 0 0.07em rgba(var(--glow-bright-rgb), calc(var(--bloom-fine-alpha) * 0.62)),
    inset 0 -0.07em rgba(var(--glow-rgb), calc(var(--bloom-fine-alpha) * 0.46)),
    0 0 0.12rem rgba(var(--glow-bright-rgb), var(--bloom-fine-alpha)),
    0 0 0.66rem rgba(var(--glow-rgb), var(--bloom-mid-alpha)),
    0 0 1.14rem rgba(var(--glow-rgb), var(--bloom-wide-alpha));
  color: var(--inverse-ink);
  text-shadow: none;
  filter:
    drop-shadow(0 0 0.05rem rgba(var(--glow-bright-rgb), var(--drop-near-alpha)))
    drop-shadow(0 0 0.34rem rgba(var(--glow-rgb), var(--drop-wide-alpha)));
}

.file-actions button:disabled {
  cursor: wait;
  opacity: 0.5;
}

.fx-panel {
  display: flex;
  flex-direction: column;
  width: min(28rem, 42vw);
  min-width: 23rem;
  height: 100%;
  padding: max(1.1rem, 3vh) 1.2rem calc(1rem + var(--safe-bottom));
  overflow-y: auto;
  border-left: 1px solid var(--phosphor-dim);
  background: rgba(8, 14, 14, 0.965);
  box-shadow: -1.4rem 0 3rem rgba(0, 0, 0, 0.64), 0 0 1.2rem rgba(var(--glow-rgb), 0.1);
  color: var(--phosphor);
  text-shadow:
    0 0 0.12rem rgba(var(--glow-bright-rgb), 0.52),
    0 0 0.5rem rgba(var(--glow-rgb), 0.2);
}

.fx-header,
.fx-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.fx-header {
  padding-bottom: 0.8rem;
  border-bottom: 1px dashed var(--phosphor-faint);
}

.fx-kicker {
  color: var(--phosphor-faint);
  font-size: 0.6rem;
  letter-spacing: 0.12em;
}

.fx-header h2 {
  margin: 0.15rem 0 0;
  color: var(--phosphor-bright);
  font-size: 1.05rem;
  font-weight: 400;
  letter-spacing: 0.09em;
}

.fx-close,
.fx-actions button {
  min-height: 38px;
  padding: 0.3rem 0.55rem;
  border: 0;
  background: transparent;
  color: var(--phosphor);
  cursor: pointer;
  font: inherit;
}

.fx-close:hover,
.fx-close:focus-visible,
.fx-actions button:hover,
.fx-actions button:focus-visible {
  background: var(--inverse-bg);
  color: var(--inverse-ink);
  outline: 0;
  text-shadow: none;
}

.fx-intro {
  margin: 0.85rem 0 0.65rem;
  color: var(--phosphor-dim);
  font-size: 0.72rem;
  line-height: 1.45;
}

.fx-controls {
  display: grid;
  gap: 0;
}

.fx-control {
  display: grid;
  grid-template-columns: 8.5rem minmax(6rem, 1fr) 3rem;
  align-items: center;
  gap: 0.7rem;
  min-height: 48px;
  border-bottom: 1px dotted rgba(var(--glow-rgb), 0.18);
  color: var(--phosphor-dim);
  font-size: 0.68rem;
  letter-spacing: 0.06em;
}

.fx-control output {
  color: var(--phosphor);
  text-align: right;
}

.fx-control input[type="range"] {
  width: 100%;
  height: 1.25rem;
  margin: 0;
  accent-color: var(--phosphor-bright);
  cursor: ew-resize;
}

.fx-control:focus-within > span,
.fx-control:focus-within output {
  color: var(--phosphor-bright);
}

.fx-actions {
  margin-top: auto;
  padding-top: 1rem;
  border-top: 1px dashed var(--phosphor-faint);
  font-size: 0.68rem;
}

.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;
}

@keyframes crt-noise {
  0% { background-position: 0 0; }
  25% { background-position: 137px -89px; }
  50% { background-position: -211px 173px; }
  75% { background-position: 83px 229px; }
  100% { background-position: -157px -131px; }
}

@keyframes crt-scan {
  from { transform: translateY(-5vh); }
  to { transform: translateY(120vh); }
}

@keyframes crt-flicker-overlay {
  0%, 86%, 100% { background: transparent; }
  8%, 42%, 49% { background: rgba(0, 0, 0, var(--flicker-dark-alpha)); }
  11%, 45%, 84% { background: rgba(255, 255, 255, var(--flicker-bright-alpha)); }
  14%, 79% { background: rgba(0, 0, 0, var(--flicker-soft-alpha)); }
  25%, 64% { background: rgba(255, 255, 255, var(--flicker-soft-alpha)); }
}

@keyframes buddha-css-opening {
  0% { clip-path: inset(0 0 100% 0); opacity: 0.2; }
  12% { opacity: 0.72; }
  100% { clip-path: inset(0 0 0 0); opacity: 1; }
}

@keyframes buddha-css-closing {
  0% { clip-path: inset(8% 4% 10% 4%); opacity: 0.18; transform: scale(0.992); }
  34% { clip-path: inset(3% 1% 4% 1%); opacity: 0.82; }
  100% { clip-path: inset(0 0 0 0); opacity: 1; transform: scale(1); }
}

@keyframes crt-transition-curtain-fade {
  0%, 18% { opacity: 1; }
  28% { opacity: 0.84; }
  46% { opacity: 0.48; }
  68% { opacity: 0.17; }
  100% { opacity: 0; }
}

@keyframes crt-transition-sync-base {
  0%, 7% { filter: brightness(1); opacity: 1; transform: translateX(0) skewX(0); }
  8% { filter: brightness(1.85); transform: translateX(0.8%) skewX(-0.2deg); }
  12% { filter: brightness(0.72); transform: translateX(-1.4%) skewX(0.35deg); }
  18% { filter: brightness(1.22); transform: translateX(0.35%); }
  31% { filter: brightness(0.92); opacity: 0.88; transform: translateX(-0.18%); }
  52% { filter: brightness(1.12) blur(0.25px); opacity: 0.52; transform: translateX(0.12%); }
  76% { filter: brightness(1.04) blur(0.55px); opacity: 0.19; transform: translateX(0); }
  100% { filter: brightness(1) blur(0.8px); opacity: 0; transform: translateX(0); }
}

/* Option 1: brief horizontal loss of sync followed by an electronic cut. The
   base image never drifts vertically and never dissolves through intermediate
   opacity values; the last 16% is an intentional blank CRT beat. */
@keyframes crt-transition-sync-cut {
  0%, 9% { filter: brightness(1); opacity: 1; transform: translateX(0) skewX(0); }
  10%, 17% { filter: brightness(1.85); opacity: 1; transform: translateX(0.8%) skewX(-0.2deg); }
  18%, 29% { filter: brightness(0.72); opacity: 1; transform: translateX(-1.4%) skewX(0.35deg); }
  30%, 43% { filter: brightness(1.22); opacity: 1; transform: translateX(0.35%) skewX(0); }
  44%, 83% { filter: brightness(1); opacity: 1; transform: translateX(0) skewX(0); }
  84%, 100% { filter: brightness(1); opacity: 0; transform: translateX(0) skewX(0); }
}

@keyframes crt-transition-sync-upper-cut {
  0%, 9% { opacity: 0; transform: translateX(0); }
  10%, 17% { opacity: 0.92; transform: translateX(4.2%); }
  18%, 29% { opacity: 0.7; transform: translateX(-2.8%); }
  30%, 43% { opacity: 0.54; transform: translateX(1.4%); }
  44%, 100% { opacity: 0; transform: translateX(0); }
}

@keyframes crt-transition-sync-lower-cut {
  0%, 17% { opacity: 0; transform: translateX(0); }
  18%, 29% { opacity: 0.78; transform: translateX(-3.4%); }
  30%, 43% { opacity: 0.64; transform: translateX(2.2%); }
  44%, 100% { opacity: 0; transform: translateX(0); }
}

@keyframes crt-transition-sync-cut-long {
  0%, 6% { filter: brightness(1); opacity: 1; transform: translateX(0) skewX(0); }
  7%, 13% { filter: brightness(1.85); opacity: 1; transform: translateX(0.8%) skewX(-0.2deg); }
  14%, 22% { filter: brightness(0.72); opacity: 1; transform: translateX(-1.4%) skewX(0.35deg); }
  23%, 31% { filter: brightness(1.22); opacity: 1; transform: translateX(0.35%) skewX(0); }
  32%, 40% { filter: brightness(1); opacity: 1; transform: translateX(0) skewX(0); }
  41%, 48% { filter: brightness(1.55); opacity: 1; transform: translateX(-0.65%) skewX(0.18deg); }
  49%, 57% { filter: brightness(0.82); opacity: 1; transform: translateX(1.1%) skewX(-0.28deg); }
  58%, 67% { filter: brightness(1.18); opacity: 1; transform: translateX(-0.45%) skewX(0); }
  68%, 91% { filter: brightness(1); opacity: 1; transform: translateX(0) skewX(0); }
  92%, 100% { filter: brightness(1); opacity: 0; transform: translateX(0) skewX(0); }
}

@keyframes crt-transition-sync-upper-cut-long {
  0%, 6% { opacity: 0; transform: translateX(0); }
  7%, 13% { opacity: 0.92; transform: translateX(4.2%); }
  14%, 22% { opacity: 0.7; transform: translateX(-2.8%); }
  23%, 31% { opacity: 0.54; transform: translateX(1.4%); }
  32%, 40% { opacity: 0; transform: translateX(0); }
  41%, 48% { opacity: 0.76; transform: translateX(-3.1%); }
  49%, 57% { opacity: 0.62; transform: translateX(2.4%); }
  58%, 67% { opacity: 0.4; transform: translateX(-0.9%); }
  68%, 100% { opacity: 0; transform: translateX(0); }
}

@keyframes crt-transition-sync-lower-cut-long {
  0%, 13% { opacity: 0; transform: translateX(0); }
  14%, 22% { opacity: 0.78; transform: translateX(-3.4%); }
  23%, 31% { opacity: 0.64; transform: translateX(2.2%); }
  32%, 44% { opacity: 0; transform: translateX(0); }
  45%, 52% { opacity: 0.72; transform: translateX(3.3%); }
  53%, 60% { opacity: 0.58; transform: translateX(-2.5%); }
  61%, 69% { opacity: 0.36; transform: translateX(0.8%); }
  70%, 100% { opacity: 0; transform: translateX(0); }
}

@keyframes crt-transition-sync-upper {
  0%, 6% { opacity: 0; transform: translateX(0); }
  7% { opacity: 0.92; transform: translateX(4.2%); }
  13% { opacity: 0.7; transform: translateX(-2.8%); }
  24% { opacity: 0.54; transform: translateX(1.4%); }
  48% { filter: brightness(1.35) blur(0.3px); opacity: 0.28; transform: translateX(0.45%); }
  72% { filter: brightness(1.1) blur(0.65px); opacity: 0.1; transform: translateX(0); }
  100% { filter: brightness(1) blur(0.9px); opacity: 0; transform: translateX(0); }
}

@keyframes crt-transition-sync-lower {
  0%, 9% { opacity: 0; transform: translateX(0); }
  10% { opacity: 0.78; transform: translateX(-3.4%); }
  17% { opacity: 0.64; transform: translateX(2.2%); }
  29% { opacity: 0.46; transform: translateX(-0.9%); }
  56% { filter: brightness(1.3) blur(0.35px); opacity: 0.23; transform: translateX(-0.3%); }
  79% { filter: brightness(1.08) blur(0.72px); opacity: 0.08; transform: translateX(0); }
  100% { filter: brightness(1) blur(1px); opacity: 0; transform: translateX(0); }
}

@keyframes crt-transition-raster-reveal {
  0%, 5% { clip-path: inset(0 0 0 0); filter: brightness(1); }
  16% { clip-path: inset(7% 0 0 0); filter: brightness(1.18); }
  42% { clip-path: inset(34% 0 0 0); filter: brightness(1.02); }
  68% { clip-path: inset(68% 0 0 0); filter: brightness(1.12); }
  91% { clip-path: inset(94% 0 0 0); filter: brightness(1); }
  100% { clip-path: inset(100% 0 0 0); }
}

@keyframes crt-transition-raster-beam {
  0%, 5% { opacity: 0; transform: translateY(-4px); }
  7% { opacity: 0.96; }
  91% { opacity: 0.8; }
  100% { opacity: 0; transform: translateY(var(--app-height)); }
}

@keyframes crt-transition-sync-raster-reveal {
  0%, 5% { clip-path: inset(0 0 0 0); filter: brightness(1); transform: translateX(0); }
  9% { clip-path: inset(3% 0 0 0); filter: brightness(1.65); transform: translateX(0.7%); }
  13% { clip-path: inset(5% 0 0 0); filter: brightness(0.8); transform: translateX(-1.15%); }
  22% { clip-path: inset(13% 0 0 0); filter: brightness(1.2); transform: translateX(0.25%); }
  46% { clip-path: inset(39% 0 0 0); filter: brightness(1); transform: translateX(-0.12%); }
  72% { clip-path: inset(72% 0 0 0); filter: brightness(1.1); transform: translateX(0.08%); }
  94% { clip-path: inset(96% 0 0 0); filter: brightness(1); transform: translateX(0); }
  100% { clip-path: inset(100% 0 0 0); transform: translateX(0); }
}

@keyframes crt-transition-sync-combined-base {
  0%, 8% { opacity: 1; transform: translateX(0); }
  9% { filter: brightness(1.7); transform: translateX(1.2%); }
  14% { filter: brightness(0.76); transform: translateX(-1.6%); }
  23% { filter: brightness(1.18); opacity: 0.9; transform: translateX(0.3%); }
  58% { filter: brightness(1.08) blur(0.28px); opacity: 0.48; transform: translateX(0); }
  88% { filter: brightness(1) blur(0.65px); opacity: 0.12; }
  100% { filter: brightness(1) blur(0.9px); opacity: 0; transform: translateX(0); }
}

@keyframes crt-transition-raster-beam-combined {
  0%, 5% { opacity: 0; transform: translateY(-4px); }
  7% { opacity: 1; }
  18% { filter: brightness(1.8); transform: translate(0.8%, 14vh); }
  22% { filter: brightness(0.9); transform: translate(-0.6%, 18vh); }
  94% { opacity: 0.72; transform: translate(0, calc(var(--app-height) * 0.96)); }
  100% { opacity: 0; transform: translateY(var(--app-height)); }
}

@keyframes crt-transition-signal-curtain {
  0%, 46% { opacity: 1; }
  47%, 53% { opacity: 0.12; }
  54%, 59% { opacity: 1; }
  60%, 66% { opacity: 0; }
  67%, 71% { opacity: 0.22; }
  72%, 100% { opacity: 0; }
}

@keyframes crt-transition-signal-content {
  0%, 8% { filter: brightness(1); opacity: 1; transform: scaleY(1); }
  9%, 13% { filter: brightness(2.2) contrast(1.5); opacity: 0.92; transform: scaleY(0.985); }
  14%, 20% { filter: brightness(0); opacity: 0; transform: scaleY(0.08); }
  21%, 28% { filter: brightness(1.7) contrast(1.4); opacity: 0.86; transform: scaleY(1); }
  29%, 39% { filter: brightness(0); opacity: 0; }
  40%, 46% { filter: brightness(1.3); opacity: 0.42; }
  47%, 100% { filter: brightness(1); opacity: 0; }
}

@keyframes crt-transition-signal-static {
  0%, 8% { background-position: 0 0; opacity: 0; }
  9%, 13% { background-position: -17px 9px; opacity: 0.54; }
  14%, 20% { background-position: 31px -23px; opacity: 0.08; }
  21%, 28% { background-position: -43px 17px; opacity: 0.68; }
  29%, 39% { background-position: 19px 41px; opacity: 0.16; }
  40%, 46% { background-position: -27px -31px; opacity: 0.42; }
  47%, 57% { background-position: 37px 13px; opacity: 0.12; }
  58%, 100% { background-position: 0 0; opacity: 0; }
}

@keyframes status-pulse {
  0%, 100% { opacity: 0.58; transform: scale(0.88); }
  50% { opacity: 1; transform: scale(1.08); }
}

@keyframes startup-status-blink {
  0%,
  48% {
    opacity: 1;
  }

  49%,
  100% {
    opacity: 0;
  }
}

@keyframes disconnected-label-blink {
  0%, 58% { opacity: 1; }
  59%, 100% { opacity: 0.12; }
}

@keyframes typing-block {
  0%, 100% { content: "[█     ]"; }
  10%, 90% { content: "[ █    ]"; }
  20%, 80% { content: "[  █   ]"; }
  30%, 70% { content: "[   █  ]"; }
  40%, 60% { content: "[    █ ]"; }
  50% { content: "[     █]"; }
}

@keyframes typing-block-persistence {
  0%, 100% { content: " █      "; }
  10%, 90% { content: "  █     "; }
  20%, 80% { content: "   █    "; }
  30%, 70% { content: "    █   "; }
  40%, 60% { content: "     █  "; }
  50% { content: "      █ "; }
}

@keyframes block-caret-blink {
  0%, 48% { opacity: 0.88; }
  49%, 100% { opacity: 0; }
}

@keyframes phosphor-arrival {
  0% { opacity: 0; filter: brightness(2.2) blur(1.5px); transform: translateY(0.25rem); }
  45% { opacity: 1; filter: brightness(1.35) blur(0.2px); }
  100% { opacity: 1; filter: none; transform: translateY(0); }
}

.crt-screen[data-profile="simple"]:not([data-custom-effects="true"]) .crt-noise,
.crt-screen[data-profile="simple"]:not([data-custom-effects="true"]) .crt-flicker,
.crt-screen[data-profile="simple"]:not([data-custom-effects="true"]) .crt-brightness,
.crt-screen[data-profile="simple"]:not([data-custom-effects="true"]) .crt-scan {
  display: none;
}

.crt-screen[data-profile="simple"]:not([data-custom-effects="true"])::before {
  opacity: 0.1;
}

.crt-screen[data-profile="simple"]:not([data-custom-effects="true"])::after {
  opacity: 0;
}

.crt-screen[data-profile="simple"]:not([data-custom-effects="true"]) .terminal-header,
.crt-screen[data-profile="simple"]:not([data-custom-effects="true"]) .terminal-footer,
.crt-screen[data-profile="simple"]:not([data-custom-effects="true"]) .turn,
.crt-screen[data-profile="simple"]:not([data-custom-effects="true"]) .composer-region,
.crt-screen[data-profile="simple"]:not([data-custom-effects="true"]) .session-marker,
.crt-screen[data-profile="simple"]:not([data-custom-effects="true"]) .time-divider,
.crt-screen[data-profile="simple"]:not([data-custom-effects="true"]) .new-message-jump,
.crt-screen[data-profile="simple"]:not([data-custom-effects="true"]) .menu-option,
.crt-screen[data-profile="simple"]:not([data-custom-effects="true"]) .ascii-art,
.crt-screen[data-profile="simple"]:not([data-custom-effects="true"]) textarea {
  text-shadow: none;
}

.crt-screen[data-profile="simple"]:not([data-custom-effects="true"]) .turn-copy,
.crt-screen[data-profile="simple"]:not([data-custom-effects="true"]) .terminal-identity,
.crt-screen[data-profile="simple"]:not([data-custom-effects="true"]) .prototype-state,
.crt-screen[data-profile="simple"]:not([data-custom-effects="true"]) .composer,
.crt-screen[data-profile="simple"]:not([data-custom-effects="true"]) .terminal-footer {
  filter: none;
}

.crt-screen[data-profile="simple"]:not([data-custom-effects="true"]) .rich-foreground {
  text-shadow: none;
}

.crt-screen[data-profile="simple"]:not([data-custom-effects="true"]) .rich-background {
  box-shadow: none;
}

.crt-screen[data-profile="simple"]:not([data-custom-effects="true"]) .role-label,
.crt-screen[data-profile="simple"]:not([data-custom-effects="true"]) .composer-label,
.crt-screen[data-profile="simple"]:not([data-custom-effects="true"]) .menu-option.is-selected,
.crt-screen[data-profile="simple"]:not([data-custom-effects="true"]) .option-text {
  box-shadow: none;
  filter: none;
}

@media (max-width: 700px) {
  :root {
    --content-width: 100%;
  }

  body {
    font-size: clamp(17px, calc(4.15vw + 1px), 19px);
    line-height: 1.56;
  }

  .crt-screen::after {
    border: 0;
    box-shadow: inset 0 0 3.5rem rgba(0, 0, 0, 0.64);
  }

  .terminal-header {
    grid-template-columns: auto minmax(0, 1fr);
    min-height: 44px;
    padding: 0.5rem 0.8rem;
    font-size: 0.62rem;
  }

  .terminal-controls {
    justify-self: end;
    gap: 0.45rem;
  }

  .profile-control label,
  .control-label {
    display: none;
  }

  .terminal-name {
    display: none;
  }

  .profile-control select {
    width: min(34vw, 8.3rem);
    min-height: 30px;
    padding-left: 0.35rem;
    font-size: 0.57rem;
  }

  .text-scale-control {
    gap: 0.25rem;
  }

  .text-scale-control output {
    display: inline-block;
    min-width: 3em;
    font-size: 0.55rem;
  }

  .text-scale-control button {
    min-width: 34px;
    min-height: 34px;
    padding-inline: 0.3rem;
    font-size: 0.62rem;
  }

  .fx-toggle {
    min-width: 34px;
    min-height: 34px;
    padding-inline: 0.35rem;
    font-size: 0.6rem;
  }

  .fx-overlay {
    align-items: flex-end;
  }

  .fx-panel {
    width: 100%;
    min-width: 0;
    height: min(68%, 38rem);
    padding: 0.85rem 0.82rem calc(0.75rem + var(--safe-bottom));
    border-top: 1px solid var(--phosphor-dim);
    border-left: 0;
    box-shadow: 0 -1.1rem 2.8rem rgba(0, 0, 0, 0.7), 0 0 1rem rgba(var(--glow-rgb), 0.1);
  }

  .fx-intro {
    margin-block: 0.55rem 0.35rem;
    font-size: 0.62rem;
  }

  .fx-control {
    grid-template-columns: 7.2rem minmax(5rem, 1fr) 2.6rem;
    gap: 0.5rem;
    min-height: 42px;
    font-size: 0.59rem;
  }

  .fx-actions {
    padding-top: 0.5rem;
  }

  .desktop-only,
  .desktop-hint {
    display: none;
  }

  .prototype-state {
    display: none;
  }

  .mobile-hint {
    display: inline;
  }

  .terminal-path {
    display: none;
  }

  .terminal-identity,
  .prototype-state {
    gap: 0.45rem;
  }

  .conversation-column {
    width: 100%;
    padding: 1rem 0.82rem 0;
  }

  .conversation-column.is-booting {
    padding: 0;
  }

  .buddha-media-stage {
    width: min(82vw, 27rem);
  }

  .buddha-image {
    width: 100%;
    max-height: calc(var(--app-height) - 6rem);
  }

  .conversation-media-stage {
    width: min(78vw, 24rem);
  }

  .session-marker {
    margin-bottom: 2.7rem;
    font-size: 0.54rem;
  }

  .session-marker span:last-child {
    display: none;
  }

  .turn {
    display: block;
    margin-bottom: 3.2rem;
  }

  .turn.is-thinking {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    column-gap: 0.75rem;
  }

  .turn.is-thinking.has-stream-indicator {
    display: block;
  }

  .turn.has-stream-indicator .turn-header {
    justify-content: flex-start;
    gap: 0.75rem;
  }

  .turn.has-stream-indicator .stream-idle-indicator {
    margin-top: 0;
  }

  .turn.is-thinking .turn-header {
    margin-bottom: 0;
  }

  .turn-header {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.68rem;
  }

  .turn-copy {
    max-width: none;
    padding-left: 0.05rem;
  }

.turn-copy p,
.turn-copy ol {
  margin-bottom: 1.05em;
}

.turn-copy p {
  tab-size: 4;
  white-space: pre-wrap;
}

  .menu-sample {
    margin-top: 1.6em;
    padding-top: 0;
  }

  .stream-menu-preview {
    max-width: none;
  }

  .menu-option {
    grid-template-columns: 1.65rem 0.85rem minmax(0, 1fr);
    min-height: 36px;
    padding: 0.16rem 0;
  }

  .ascii-art {
    font-size: clamp(0.68em, 3.4vw, 0.82em);
  }

  .time-divider {
    margin-left: 0;
    margin-bottom: 3.2rem;
    font-size: 0.54rem;
  }

  .composer-region {
    padding: 0 0.78rem 0.18rem;
  }

  .composer {
    display: block;
  }

  .terminal-footer {
    padding: 0.1rem 0.8rem calc(0.12rem + var(--safe-bottom));
    font-size: 0.5rem;
  }

  .new-message-jump {
    right: 0.75rem;
  }
}

@media (max-width: 380px) {
  .profile-control select {
    width: min(31vw, 7.1rem);
  }

  .fx-control {
    grid-template-columns: 6.5rem minmax(4.5rem, 1fr) 2.5rem;
  }

  .prototype-state {
    font-size: 0.55rem;
  }

  .composer-meta > span:first-child {
    max-width: 72%;
  }
}

/* Firefox rasterizes ancestor filters more aggressively than Chromium.  The
   terminal therefore keeps its bloom on the glyphs and inverse surfaces
   themselves, while the independent flicker layer changes screen brightness. */
@supports (-moz-appearance: none) {
  .terminal-header,
  .terminal-footer,
  .turn,
  .composer-region,
  .session-marker,
  .time-divider,
  .new-message-jump {
    text-shadow:
      0 0 0.025em rgba(244, 252, 255, 0.96),
      0 0 0.14em rgba(var(--glow-bright-rgb), var(--bloom-fine-alpha)),
      0 0 0.42em rgba(var(--glow-rgb), var(--bloom-mid-alpha));
  }

  textarea {
    text-shadow:
      0 0 0.025em rgba(244, 252, 255, 0.96),
      0 0 0.15em rgba(var(--glow-bright-rgb), var(--bloom-fine-alpha)),
      0 0 0.46em rgba(var(--glow-rgb), var(--bloom-mid-alpha));
  }
}

@media (min-width: 1200px) and (min-height: 760px) {
  .crt-screen {
    width: min(1440px, calc(100% - 2rem));
    height: var(--app-height);
    margin: 0 auto;
    border-radius: 1.4rem / 0.8rem;
    box-shadow:
      0 0 0 1px rgba(169, 201, 223, 0.1),
      0 1.2rem 5rem rgba(0, 0, 0, 0.82),
      inset 0 0 7rem rgba(0, 0, 0, 0.78),
      0 0 4rem rgba(121, 198, 237, 0.06);
  }
}

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

  .crt-noise {
    opacity: 0.075;
  }

  .crt-persistence {
    display: none;
  }

  .rich-blink {
    opacity: 1;
    animation: none !important;
  }

  .block-caret.is-visible {
    opacity: 0.88;
    animation: none !important;
  }

  .typing-block::after {
    display: none;
  }
}
/* Native modal focus containment, styled with the same CRT font/phosphor. */
.room-reset-dialog {
  color: var(--phosphor);
  background: var(--screen);
  border: 4px double currentColor;
  font: inherit;
  max-width: min(90vw, 38em);
  padding: 1em;
  text-shadow: 0 0 .3em rgba(var(--glow-rgb), .4);
}
.room-reset-dialog::backdrop { background: rgb(0 0 0 / 65%); }
.room-reset-dialog button, .room-recovery-notice button {
  font: inherit;
  color: inherit;
  background: transparent;
  border: 0;
  padding: .3em .7em;
  margin: .3em;
  cursor: pointer;
}
.room-reset-dialog button:focus,
.room-recovery-notice button:hover, .room-recovery-notice button:focus-visible {
  color: var(--screen);
  background: var(--phosphor);
  box-shadow: 0 0 .6em rgba(var(--glow-rgb), .6);
  outline: 1px solid var(--phosphor-bright);
}
.room-recovery-notice { color: #ff4f4f; padding: 1em; font: inherit; }
/* Restore language/font/layout together; preserve the CRT surface underneath. */
html[data-resume-paint="waiting"] .terminal-header,
html[data-resume-paint="waiting"] #conversation,
html[data-resume-paint="waiting"] #composer,
html[data-resume-paint="waiting"] .terminal-footer {
  visibility: hidden;
}
.capsule-ack-error {
  color: #ff7777;
  padding-block: 1em;
}
.capsule-ack-error button {
  color: inherit;
  background: transparent;
  border: 1px solid currentColor;
  font: inherit;
  padding: .3em .6em;
  cursor: pointer;
}
.capsule-ack-error button:focus-visible,
.capsule-ack-error button:hover {
  color: #151515;
  background: #ff7777;
}
/* Memento is a separate modal: it never changes conversation height or scroll. */
.memento-dialog {
  box-sizing: border-box;
  width: min(38rem, calc(100vw - 32px));
  max-height: calc(100dvh - 32px);
  overflow: auto;
  padding: 1.4em;
  border: 4px double var(--phosphor, #c4e5ee);
  background: #0d1619;
  color: var(--phosphor, #c4e5ee);
  font: inherit;
  font-size: max(17px, 1rem);
  text-shadow: 0 0 5px #b9e8ed80;
  box-shadow: 0 0 15px #b9e8ed30;
}
.memento-dialog::backdrop { background: #000b; }
.memento-dialog:focus { outline: none; }
.memento-dialog progress { appearance: none; width: 85%; height: 1.2em; border: 1px solid #a9c9df; background: #203038; vertical-align: middle; }
.memento-dialog progress::-webkit-progress-bar { background: #203038; }
.memento-dialog progress::-webkit-progress-value { background: repeating-linear-gradient(90deg, #c4e5ee 0 8px, #6f8c98 8px 10px); }
.memento-dialog progress::-moz-progress-bar { background: repeating-linear-gradient(90deg, #c4e5ee 0 8px, #6f8c98 8px 10px); }
.memento-dialog output { display: inline-block; width: 15%; text-align: end; }
.memento-dialog button { font: inherit; color: inherit; background: transparent; border: 1px solid; padding: .3em .6em; margin: .3em; }
.memento-dialog button:focus-visible, .memento-dialog button:hover { background: #c4e5ee; color: #102126; }
.memento-dialog .memento-error { color: #ff9999; }
