:root {
  --bg: #f2f2ef;
  --bg-deep: #ecede8;
  --card: #f7f7f4;
  --card-strong: #ecede8;
  --line: rgba(20, 22, 20, 0.1);
  --text: #141614;
  --muted: #6e726b;
  --accent: #2f3a33;
  --accent-strong: #141614;
  --shadow: 0 24px 60px rgba(12, 14, 12, 0.14);
  --radius-xl: 28px;
  --radius-lg: 20px;
  --radius-md: 14px;
  --mono: "SF Mono", "JetBrains Mono", ui-monospace, monospace;
  --serif: "Iowan Old Style", "Source Han Serif SC", "Noto Serif SC", serif;
  --sans: "Inter", "PingFang SC", "Hiragino Sans GB", "Noto Sans SC", sans-serif;
  --font-xs: 0.82rem;
  --font-sm: 0.9rem;
  --font-md: 0.96rem;
  --font-lg: 1.08rem;
  --font-title: 1.22rem;
  --font-hero: clamp(2.25rem, 4.6vw, 3.5rem);
  --lh-tight: 1.3;
  --lh-copy: 1.68;
  --lh-reading: 1.82;
  --space-1: 6px;
  --space-2: 10px;
  --space-3: 14px;
  --space-4: 18px;
  --space-5: 22px;
  --space-6: 26px;
  --workspace-left-width: 360px;
  --response-side-width: 320px;
  --answer-panel-height: 680px;
  --conversation-panel-height: 300px;
  --resize-handle-size: 12px;
}

body[data-theme="dark"] {
  --bg: #0d0f0d;
  --bg-deep: #111311;
  --card: #111311;
  --card-strong: #161816;
  --line: rgba(231, 231, 226, 0.1);
  --text: #e7e7e2;
  --muted: #a9ada5;
  --accent: #3e4a42;
  --accent-strong: #e7e7e2;
  --shadow: 0 24px 60px rgba(0, 0, 0, 0.42);
}

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  min-height: 100%;
  color: var(--text);
  background:
    radial-gradient(circle at top left, rgba(47, 58, 51, 0.16), transparent 24rem),
    radial-gradient(circle at bottom right, rgba(218, 221, 214, 0.18), transparent 22rem),
    linear-gradient(180deg, #f2f2ef 0%, #ecede8 52%, #daddd6 100%);
  font-family: var(--sans);
}

html {
  scroll-behavior: smooth;
}

body[data-theme="dark"] {
  background:
    radial-gradient(circle at top left, rgba(62, 74, 66, 0.18), transparent 22rem),
    radial-gradient(circle at bottom right, rgba(22, 24, 22, 0.14), transparent 20rem),
    linear-gradient(180deg, #0d0f0d 0%, #111311 52%, #161816 100%);
}

body {
  padding: 24px;
  font-size: 16px;
  line-height: var(--lh-copy);
  letter-spacing: 0.01em;
}

[hidden] {
  display: none !important;
}

.page-shell {
  display: grid;
  grid-template-columns: 320px 1fr;
  gap: 24px;
  align-items: start;
}

.glass {
  background: var(--card);
  border: 1px solid rgba(255, 255, 255, 0.55);
  box-shadow: var(--shadow);
  backdrop-filter: blur(22px);
  -webkit-backdrop-filter: blur(22px);
}

.sidebar {
  position: sticky;
  top: 24px;
  max-height: calc(100vh - 48px);
  overflow: auto;
  padding: 22px;
  border-radius: var(--radius-xl);
}

.brand-block h1,
.hero h2,
.panel-head h2 {
  margin: 0;
  font-family: var(--serif);
  font-weight: 700;
  letter-spacing: -0.03em;
}

.brand-block h1 {
  font-size: 2rem;
  margin-top: 6px;
}

.hero h2 {
  font-size: clamp(2rem, 3vw, 3rem);
}

.brand-copy,
.hero-copy,
.micro-copy {
  color: var(--muted);
  line-height: 1.65;
}

.eyebrow {
  margin: 0;
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--accent-strong);
}

.panel {
  border-top: 1px solid var(--line);
  margin-top: 20px;
  padding-top: 20px;
}

.panel-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
}

.panel-head h2 {
  font-size: 1.34rem;
  line-height: 1.2;
}

.settings-body {
  display: grid;
  gap: 14px;
}

.layout-controls {
  display: grid;
  gap: 14px;
}

.layout-status {
  font-size: 0.86rem;
  color: var(--accent-strong);
  line-height: 1.5;
}

.sidebar-panels,
.layout-dropzone {
  display: grid;
  gap: 20px;
}

.layout-dropzone.drag-over,
.layout-slot.drag-over {
  outline: 2px dashed rgba(87, 114, 141, 0.35);
  outline-offset: 8px;
  border-radius: var(--radius-lg);
}

.layout-slot {
  min-height: 120px;
}

.layout-slot > .layout-card {
  height: 100%;
}

.layout-card.dragging {
  opacity: 0.42;
}

.layout-card.drop-before {
  box-shadow: inset 0 4px 0 rgba(87, 114, 141, 0.55);
}

.field {
  display: grid;
  gap: 8px;
}

.field span {
  font-size: 0.96rem;
  font-weight: 600;
  color: var(--text);
  line-height: 1.45;
}

.field span.field-meta {
  color: var(--muted);
  font-weight: 500;
}

input,
textarea,
button {
  font: inherit;
}

input,
textarea {
  width: 100%;
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.78);
  border-radius: var(--radius-md);
  padding: 10px 12px;
  color: var(--text);
  font-size: 0.98rem;
  outline: none;
  transition: border-color 140ms ease, box-shadow 140ms ease, transform 140ms ease;
}

input::placeholder,
textarea::placeholder {
  color: rgba(97, 113, 129, 0.58);
  font-size: 0.94em;
  line-height: 1.62;
}

body[data-theme="dark"] input,
body[data-theme="dark"] textarea {
  background: rgba(255, 255, 255, 0.05);
}

body[data-theme="dark"] input::placeholder,
body[data-theme="dark"] textarea::placeholder {
  color: rgba(158, 176, 192, 0.4);
}

input:focus,
textarea:focus {
  border-color: rgba(87, 114, 141, 0.45);
  box-shadow: 0 0 0 4px rgba(87, 114, 141, 0.1);
}

textarea {
  resize: vertical;
  min-height: 88px;
  line-height: 1.62;
}

.primary-button,
.ghost-button,
.template-tab {
  border-radius: 999px;
  padding: 11px 18px;
  border: 1px solid transparent;
  font-size: 0.95rem;
  font-weight: 600;
  cursor: pointer;
  transition: transform 120ms ease, box-shadow 120ms ease, background 120ms ease, border-color 120ms ease;
}

.primary-button:hover,
.ghost-button:hover,
.template-tab:hover {
  transform: translateY(-1px);
}

.primary-button:disabled,
.ghost-button:disabled,
.template-tab:disabled,
.mini-button:disabled,
.session-mini:disabled {
  opacity: 0.48;
  cursor: not-allowed;
  transform: none;
  box-shadow: none;
}

.primary-button {
  background: linear-gradient(135deg, var(--accent) 0%, var(--accent-strong) 100%);
  color: white;
  box-shadow: 0 10px 24px rgba(63, 88, 115, 0.22);
}

.primary-button.accent {
  background: linear-gradient(135deg, #38506a 0%, #223547 100%);
}

.ghost-button,
.template-tab {
  background: rgba(255, 255, 255, 0.5);
  color: var(--text);
  border-color: var(--line);
}

body[data-theme="dark"] .ghost-button,
body[data-theme="dark"] .template-tab,
body[data-theme="dark"] .mini-button,
body[data-theme="dark"] .session-mini {
  background: rgba(255, 255, 255, 0.04);
}

.template-tab.active {
  background: rgba(87, 114, 141, 0.12);
  color: var(--accent-strong);
  border-color: rgba(87, 114, 141, 0.25);
}

.button-row,
.quick-links,
.hero-actions,
.template-switcher {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.panel-tools {
  align-items: center;
  gap: 10px;
}

.drag-handle {
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.58);
  color: var(--muted);
  border-radius: 999px;
  min-width: 38px;
  height: 38px;
  cursor: grab;
  font-size: 0.94rem;
  line-height: 1;
}

.drag-handle:active {
  cursor: grabbing;
}

body[data-theme="dark"] .drag-handle {
  background: rgba(255, 255, 255, 0.04);
}

.delivery-mode-switch {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.delivery-mode-button.active {
  background: rgba(87, 114, 141, 0.12);
  color: var(--accent-strong);
  border-color: rgba(87, 114, 141, 0.25);
}

.conversation-toolbar {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  margin-top: 16px;
}

.toggle-row {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--text);
  font-size: 0.96rem;
  font-weight: 500;
}

.toggle-row input {
  width: 18px;
  height: 18px;
  accent-color: var(--accent);
}

.structure-list {
  margin: 0;
  padding-left: 18px;
  color: var(--muted);
  font-size: 0.98rem;
  line-height: 1.9;
}

.main-stage {
  display: grid;
  gap: 24px;
}

.hero {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  padding: 22px 26px;
  border-radius: var(--radius-xl);
}

.workspace {
  display: grid;
  grid-template-columns:
    minmax(320px, var(--workspace-left-width))
    var(--resize-handle-size)
    minmax(0, 1fr);
  gap: 24px;
  align-items: start;
}

.workspace-left-column {
  display: grid;
  gap: 16px;
  align-content: start;
}

.composer,
.response-card {
  border-radius: var(--radius-xl);
  padding: 26px 24px;
}

.composer {
  position: sticky;
  top: 24px;
  max-height: calc(100vh - 48px);
  overflow: auto;
}

.composer {
  padding: 28px 24px;
  background:
    linear-gradient(180deg, rgba(250, 252, 255, 0.9) 0%, rgba(241, 246, 251, 0.82) 100%);
  border: 1px solid rgba(255, 255, 255, 0.68);
  box-shadow:
    0 20px 48px rgba(18, 28, 39, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.4);
}

body[data-theme="dark"] .composer {
  background:
    linear-gradient(180deg, rgba(45, 31, 23, 0.9) 0%, rgba(13, 15, 13, 0.82) 100%);
  border-color: rgba(230, 237, 245, 0.07);
  box-shadow:
    0 22px 52px rgba(0, 0, 0, 0.3),
    inset 0 1px 0 rgba(255, 255, 255, 0.03);
}

.composer .panel-head {
  align-items: flex-start;
  margin-bottom: 12px;
}

.composer .panel-head h2 {
  font-size: 1.5rem;
  line-height: 1.1;
}

.composer .section-note {
  max-width: 56ch;
  margin-bottom: 18px;
}

.mode-switcher-block {
  display: grid;
  gap: 6px;
  margin-bottom: 14px;
}

.mode-switcher-title {
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: var(--muted);
  text-transform: uppercase;
}

.composer .template-switcher {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 0;
  padding: 5px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.26);
  border: 1px solid rgba(255, 255, 255, 0.42);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.36);
}

body[data-theme="dark"] .composer .template-switcher {
  background: rgba(255, 255, 255, 0.04);
  border-color: rgba(255, 255, 255, 0.06);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.02);
}

.supplemental-fields {
  border-radius: 20px;
  border: 1px solid rgba(91, 115, 139, 0.12);
  background: rgba(255, 255, 255, 0.1);
  padding: 14px 15px 15px;
}

body[data-theme="dark"] .supplemental-fields {
  border-color: rgba(195, 213, 232, 0.08);
  background: rgba(255, 255, 255, 0.02);
}

.supplemental-fields-head {
  display: grid;
  gap: 4px;
  margin-bottom: 12px;
  color: var(--text);
}

.supplemental-summary-title {
  font-size: 0.96rem;
  font-weight: 700;
}

.supplemental-summary-preview {
  font-size: 0.82rem;
  line-height: 1.42;
  color: var(--muted);
}

.supplemental-fields-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.send-preview {
  border-radius: 20px;
  border: 1px solid rgba(91, 115, 139, 0.1);
  background: rgba(255, 255, 255, 0.08);
  padding: 12px 14px 14px;
}

body[data-theme="dark"] .send-preview {
  border-color: rgba(195, 213, 232, 0.06);
  background: rgba(255, 255, 255, 0.02);
}

.send-preview summary {
  position: relative;
  cursor: pointer;
  display: grid;
  gap: 4px;
  padding-right: 56px;
  list-style: none;
  color: var(--text);
}

.send-preview summary::-webkit-details-marker {
  display: none;
}

.send-preview-title {
  font-size: 0.96rem;
  font-weight: 700;
}

.send-preview-copy {
  font-size: 0.82rem;
  line-height: 1.42;
  color: var(--muted);
}

.send-preview summary::after {
  content: "展开";
  position: absolute;
  right: 0;
  top: 0;
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--accent-strong);
}

.send-preview[open] summary::after {
  content: "收起";
}

.send-preview .field {
  margin-top: 14px;
}

.composer .template-tab {
  min-width: 0;
  min-height: 0;
  padding: 9px 13px;
  border-radius: 12px;
  text-align: center;
  background: rgba(255, 255, 255, 0.8);
  border-color: rgba(87, 114, 141, 0.06);
  font-size: 0.9rem;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.8),
    0 4px 12px rgba(63, 88, 115, 0.035);
}

.composer .template-tab:hover {
  border-color: rgba(87, 114, 141, 0.12);
  background: rgba(249, 252, 255, 0.94);
}

.composer .template-tab.active {
  background: linear-gradient(135deg, rgba(87, 114, 141, 0.14) 0%, rgba(63, 88, 115, 0.18) 100%);
  border-color: rgba(87, 114, 141, 0.16);
  box-shadow:
    0 8px 16px rgba(63, 88, 115, 0.06),
    inset 0 1px 0 rgba(255, 255, 255, 0.45);
}

body[data-theme="dark"] .composer .template-tab {
  background: rgba(255, 255, 255, 0.05);
  border-color: rgba(195, 213, 232, 0.08);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.03),
    0 8px 18px rgba(0, 0, 0, 0.14);
}

body[data-theme="dark"] .composer .template-tab:hover {
  background: rgba(255, 255, 255, 0.07);
  border-color: rgba(195, 213, 232, 0.14);
}

body[data-theme="dark"] .composer .template-tab.active {
  background: linear-gradient(135deg, rgba(87, 114, 141, 0.28) 0%, rgba(63, 88, 115, 0.36) 100%);
  border-color: rgba(195, 213, 232, 0.12);
  box-shadow:
    0 10px 22px rgba(0, 0, 0, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.composer .conversation-toolbar {
  margin-top: 0;
  margin-bottom: 18px;
  padding: 14px 16px;
  border-radius: 18px;
  border: 1px solid rgba(91, 115, 139, 0.1);
  background: rgba(255, 255, 255, 0.44);
}

body[data-theme="dark"] .composer .conversation-toolbar {
  border-color: rgba(195, 213, 232, 0.06);
  background: rgba(255, 255, 255, 0.03);
}

.session-context {
  align-items: flex-start;
}

.session-context-copy {
  display: grid;
  gap: 6px;
}

.session-context-label {
  font-size: 0.8rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--muted);
}

.session-context-title {
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.55;
  color: var(--text);
}

.followup-guidance {
  margin: -6px 0 18px;
  padding: 12px 14px;
  border-radius: 16px;
  border: 1px solid rgba(91, 115, 139, 0.1);
  background: rgba(255, 255, 255, 0.22);
  color: var(--muted);
}

body[data-theme="dark"] .followup-guidance {
  border-color: rgba(195, 213, 232, 0.06);
  background: rgba(255, 255, 255, 0.018);
}

.response-card {
  display: flex;
  flex-direction: column;
  min-height: 0;
}

.form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin: 0 0 20px;
}

.field-span-2 {
  grid-column: 1 / -1;
}

.form-section-label {
  margin: 4px 0 -4px;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--accent-strong);
  opacity: 0.78;
}

.composer .field {
  gap: 10px;
  padding: 16px;
  border-radius: 20px;
  border: 1px solid rgba(91, 115, 139, 0.08);
  background: rgba(255, 255, 255, 0.34);
}

body[data-theme="dark"] .composer .field {
  border-color: rgba(195, 213, 232, 0.06);
  background: rgba(255, 255, 255, 0.025);
}

.composer .field-span-2 {
  padding: 18px;
}

.field-question-primary {
  padding: 22px 20px;
  border-color: rgba(63, 88, 115, 0.14);
  background:
    linear-gradient(180deg, rgba(248, 251, 254, 0.84) 0%, rgba(238, 244, 250, 0.58) 100%);
  box-shadow:
    0 10px 24px rgba(35, 53, 73, 0.04),
    inset 0 1px 0 rgba(255, 255, 255, 0.64);
}

body[data-theme="dark"] .field-question-primary {
  border-color: rgba(195, 213, 232, 0.1);
  background:
    linear-gradient(180deg, rgba(31, 36, 41, 0.82) 0%, rgba(20, 24, 28, 0.56) 100%);
  box-shadow:
    0 10px 22px rgba(0, 0, 0, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.03);
}

.field-concern-secondary {
  border-style: dashed;
}

.composer #question {
  min-height: 128px;
  font-size: 1.02rem;
}

.composer #assembled-prompt {
  min-height: 208px;
  font-size: 1rem;
  line-height: 1.68;
  background: rgba(249, 252, 255, 0.92);
  border-color: rgba(63, 88, 115, 0.16);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72);
}

body[data-theme="dark"] .composer #assembled-prompt {
  background: rgba(27, 32, 37, 0.92);
  border-color: rgba(195, 213, 232, 0.08);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.02);
}

.composer > .button-row {
  gap: 12px;
  padding-top: 4px;
}

.composer > .button-row .primary-button.accent {
  box-shadow: 0 12px 28px rgba(28, 34, 40, 0.18);
}

.composer-actions {
  align-items: center;
  gap: 10px;
}

.composer-actions #send-request {
  min-width: 168px;
}

.composer-actions #clear-draft {
  opacity: 0.72;
}

.composer-actions-note {
  margin: 10px 0 0;
  font-size: 0.88rem;
  line-height: 1.5;
  color: var(--muted);
}

.answer-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid rgba(91, 115, 139, 0.1);
}

body[data-theme="dark"] .answer-actions {
  border-top-color: rgba(195, 213, 232, 0.08);
}

.answer-kicker {
  display: inline-flex;
  align-items: center;
  margin: 2px 0 12px;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(87, 114, 141, 0.1);
  color: var(--accent-strong);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

#answer-followup:not(:disabled) {
  background: linear-gradient(180deg, rgba(97, 108, 118, 0.2) 0%, rgba(67, 76, 85, 0.28) 100%);
  border-color: rgba(39, 47, 55, 0.14);
  color: #2d3843;
  box-shadow:
    0 8px 18px rgba(12, 18, 24, 0.06),
    inset 0 1px 0 rgba(255, 255, 255, 0.48);
}

#answer-followup:not(:disabled):hover {
  background: linear-gradient(180deg, rgba(103, 114, 124, 0.24) 0%, rgba(73, 82, 91, 0.32) 100%);
}

.answer-guidance {
  margin: 12px 0 0;
  color: var(--muted);
  font-size: 0.92rem;
  line-height: 1.7;
}

.answer-note {
  margin: 12px 0 0;
  color: var(--muted);
  font-size: 0.9rem;
  line-height: 1.68;
}

body[data-theme="dark"] .answer-kicker {
  background: rgba(131, 139, 147, 0.14);
  color: #d0d7de;
}

body[data-theme="dark"] #answer-followup:not(:disabled) {
  background: linear-gradient(180deg, rgba(123, 132, 141, 0.18) 0%, rgba(81, 90, 99, 0.3) 100%);
  border-color: rgba(226, 232, 238, 0.08);
  color: #e6ecf2;
}

.response-stack {
  display: grid;
  grid-template-columns:
    minmax(0, 1fr)
    var(--resize-handle-size)
    minmax(260px, var(--response-side-width));
  align-items: start;
  gap: 24px;
}

.response-main-column,
.response-side-column {
  display: grid;
  gap: 16px;
  align-content: start;
}

.response-side-column {
  position: sticky;
  top: 24px;
}

.response-main-column {
  grid-template-rows: minmax(320px, var(--answer-panel-height)) var(--resize-handle-size) minmax(220px, auto);
}

.response-side-column {
  grid-template-rows: minmax(220px, var(--conversation-panel-height)) var(--resize-handle-size) minmax(220px, auto);
}

.resize-handle {
  position: relative;
  border-radius: 999px;
  background: rgba(87, 114, 141, 0.1);
  border: 1px solid rgba(87, 114, 141, 0.14);
  user-select: none;
  touch-action: none;
  transition: background 140ms ease, border-color 140ms ease, box-shadow 140ms ease;
}

.resize-handle::after {
  content: "";
  position: absolute;
  inset: 50%;
  transform: translate(-50%, -50%);
  border-radius: 999px;
  background: rgba(63, 88, 115, 0.58);
}

.resize-handle:hover,
.resize-handle.active {
  background: rgba(87, 114, 141, 0.16);
  border-color: rgba(87, 114, 141, 0.28);
  box-shadow: 0 0 0 6px rgba(87, 114, 141, 0.08);
}

.resize-handle-vertical {
  width: var(--resize-handle-size);
  min-height: 120px;
  cursor: col-resize;
}

.resize-handle-vertical::after {
  width: 4px;
  height: 48px;
}

.resize-handle-horizontal {
  height: var(--resize-handle-size);
  width: 100%;
  cursor: row-resize;
}

.resize-handle-horizontal::after {
  width: 48px;
  height: 4px;
}

.response-output,
.system-preview {
  min-height: 240px;
  border-radius: var(--radius-lg);
  border: 1px solid var(--line);
  background: var(--card-strong);
}

.response-output {
  flex: 1;
  padding: 22px 20px;
  font-size: 1.04rem;
  white-space: pre-wrap;
  line-height: 1.9;
  overflow-wrap: anywhere;
  overflow: auto;
  min-height: 100%;
  max-height: 100%;
}

.response-output.rendered {
  white-space: normal;
}

.response-output.rendered h1,
.response-output.rendered h2,
.response-output.rendered h3,
.response-output.rendered h4 {
  margin: 1.05em 0 0.5em;
  font-family: var(--serif);
  letter-spacing: -0.02em;
}

.response-output.rendered h1 {
  font-size: 1.9rem;
}

.response-output.rendered h2 {
  font-size: 1.56rem;
}

.response-output.rendered h3 {
  font-size: 1.28rem;
}

.response-output.rendered h4 {
  font-size: 1.1rem;
}

.response-output.rendered p {
  margin: 0.72em 0;
}

.response-output.rendered ul,
.response-output.rendered ol {
  margin: 0.72em 0;
  padding-left: 1.4em;
}

.response-output.rendered li {
  margin: 0.3em 0;
}

.response-output.rendered code {
  font-family: var(--mono);
  font-size: 0.92em;
  padding: 0.1em 0.35em;
  border-radius: 8px;
  background: rgba(87, 114, 141, 0.12);
}

.response-output.rendered pre {
  padding: 14px;
  border-radius: 16px;
  background: rgba(34, 52, 72, 0.08);
  border: 1px solid var(--line);
  overflow: auto;
}

.response-output.rendered pre code {
  background: transparent;
  padding: 0;
}

.response-output.rendered blockquote {
  margin: 0.9em 0;
  padding-left: 1em;
  border-left: 3px solid rgba(87, 114, 141, 0.35);
  color: var(--muted);
}

.response-output.empty {
  display: grid;
  place-items: center;
  color: var(--muted);
}

.system-preview {
  flex: 1;
  padding: 16px;
  font-family: var(--mono);
  font-size: 0.92rem;
  line-height: 1.72;
  min-height: 100%;
  max-height: 100%;
  overflow: auto;
}

body[data-theme="dark"] .response-output,
body[data-theme="dark"] .system-preview,
body[data-theme="dark"] .conversation-item,
body[data-theme="dark"] .history-item,
body[data-theme="dark"] .session-item,
body[data-theme="dark"] .session-list.empty,
body[data-theme="dark"] .conversation-thread.empty,
body[data-theme="dark"] .history-list.empty {
  background: rgba(255, 255, 255, 0.03);
}

.history-list {
  display: grid;
  gap: 12px;
  max-height: 340px;
  overflow: auto;
}

.session-list {
  display: grid;
  gap: 10px;
}

.session-list.empty {
  min-height: 108px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: var(--card-strong);
  color: var(--muted);
  padding: 16px;
}

.session-item {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: var(--card-strong);
  padding: 12px;
  display: grid;
  gap: 8px;
  cursor: pointer;
  transition: border-color 120ms ease, transform 120ms ease, box-shadow 120ms ease;
}

.session-item:hover {
  transform: translateY(-1px);
}

.session-item.active {
  border-color: rgba(87, 114, 141, 0.36);
  box-shadow: inset 0 0 0 1px rgba(87, 114, 141, 0.14);
}

.session-item.pinned {
  border-color: rgba(63, 88, 115, 0.28);
}

.session-title {
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.5;
}

.session-meta {
  font-size: 0.8rem;
  color: var(--muted);
  display: flex;
  justify-content: space-between;
  gap: 8px;
}

.session-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.session-mini {
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.58);
  color: var(--text);
  border-radius: 999px;
  padding: 5px 10px;
  cursor: pointer;
  font-size: 0.8rem;
}

.session-pin {
  display: inline-flex;
  align-items: center;
  padding: 4px 9px;
  border-radius: 999px;
  background: rgba(87, 114, 141, 0.1);
  color: var(--accent-strong);
  font-size: 0.76rem;
}

.conversation-thread {
  display: grid;
  gap: 12px;
  flex: 1;
  min-height: 100%;
  max-height: 100%;
  overflow: auto;
}

.conversation-thread.empty {
  min-height: 120px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: var(--card-strong);
  color: var(--muted);
  padding: 20px;
}

.conversation-item {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  padding: 14px;
  background: var(--card-strong);
  display: grid;
  gap: 8px;
}

.conversation-role {
  font-size: 0.8rem;
  font-weight: 700;
  color: var(--accent-strong);
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.conversation-content {
  font-size: 0.98rem;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  line-height: 1.8;
}

.history-list.empty {
  min-height: 120px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: var(--card-strong);
  color: var(--muted);
  padding: 20px;
}

.history-item {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: var(--card-strong);
  overflow: hidden;
}

.history-item.pinned {
  border-color: rgba(87, 114, 141, 0.16);
  box-shadow:
    0 10px 24px rgba(63, 88, 115, 0.05),
    inset 0 1px 0 rgba(255, 255, 255, 0.3);
}

.history-summary {
  list-style: none;
  cursor: pointer;
  display: grid;
  gap: 4px;
  padding: 12px 13px;
}

.history-summary::-webkit-details-marker {
  display: none;
}

.history-summary::after {
  content: "";
  justify-self: end;
  width: 10px;
  height: 10px;
  margin-top: -24px;
  border-right: 2px solid rgba(63, 88, 115, 0.62);
  border-bottom: 2px solid rgba(63, 88, 115, 0.62);
  transform: rotate(45deg);
  transition: transform 140ms ease;
}

.history-item[open] .history-summary {
  background: rgba(255, 255, 255, 0.26);
  border-bottom: 1px solid var(--line);
}

.history-item:not([open]) .history-summary {
  transition: background 140ms ease, box-shadow 140ms ease;
}

.history-item:not([open]):hover .history-summary {
  background: rgba(255, 255, 255, 0.18);
}

.history-item[open] .history-summary::after {
  transform: rotate(225deg);
}

.history-body {
  display: grid;
  gap: 12px;
  padding: 14px;
}

.history-block {
  display: grid;
  gap: 8px;
}

.history-block-surface {
  padding: 12px 13px;
  border-radius: 14px;
  border: 1px solid rgba(91, 115, 139, 0.08);
  background: rgba(255, 255, 255, 0.32);
}

body[data-theme="dark"] .history-block-surface {
  border-color: rgba(195, 213, 232, 0.06);
  background: rgba(255, 255, 255, 0.025);
}

.history-note-surface {
  background: rgba(248, 251, 254, 0.72);
}

body[data-theme="dark"] .history-note-surface {
  background: rgba(255, 255, 255, 0.04);
}

.history-block-label {
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--accent-strong);
}

.history-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 10px;
  align-items: center;
  color: var(--muted);
  font-size: 0.8rem;
  opacity: 0.92;
}

.history-mode {
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(87, 114, 141, 0.1);
  color: var(--accent-strong);
}

.history-state {
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 600;
}

.history-state-session {
  background: rgba(70, 116, 84, 0.1);
  color: #4b6784;
}

.history-state-single {
  background: rgba(120, 108, 92, 0.1);
  color: #65798d;
}

.history-state-pinned {
  background: rgba(87, 114, 141, 0.12);
  color: var(--accent-strong);
}

.history-question,
.history-answer {
  font-size: 0.98rem;
  line-height: 1.65;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.history-note {
  font-size: 0.92rem;
  line-height: 1.62;
  color: var(--muted);
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.history-question {
  font-weight: 600;
}

.history-question-title {
  font-size: 0.96rem;
  font-weight: 700;
  line-height: 1.4;
}

.history-answer-preview {
  color: var(--muted);
  font-size: 0.84rem;
  line-height: 1.46;
  overflow-wrap: anywhere;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.history-answer {
  color: var(--muted);
}

.history-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  opacity: 0.92;
}

.history-footer {
  display: grid;
  gap: 10px;
  padding-top: 2px;
  border-top: 1px solid rgba(91, 115, 139, 0.08);
}

body[data-theme="dark"] .history-footer {
  border-top-color: rgba(195, 213, 232, 0.06);
}

.mini-button {
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.58);
  color: var(--text);
  border-radius: 999px;
  padding: 6px 10px;
  cursor: pointer;
  font-size: 0.84rem;
}

.mini-button-primary {
  background: linear-gradient(135deg, rgba(87, 114, 141, 0.16) 0%, rgba(63, 88, 115, 0.22) 100%);
  border-color: rgba(87, 114, 141, 0.24);
  color: var(--accent-strong);
  font-weight: 700;
}

.history-action-hint {
  font-size: 0.78rem;
  line-height: 1.4;
  color: var(--muted);
  opacity: 0.84;
}

.history-footer .mini-button:not(.mini-button-primary) {
  opacity: 0.8;
}

.history-footer .mini-button:not(.mini-button-primary):hover {
  opacity: 1;
}

.history-conversation-list {
  display: grid;
  gap: 10px;
}

.history-conversation-item {
  display: grid;
  gap: 6px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.36);
}

body[data-theme="dark"] .history-conversation-item {
  background: rgba(255, 255, 255, 0.03);
}

.history-conversation-role {
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--accent-strong);
}

.history-conversation-content {
  font-size: 0.92rem;
  line-height: 1.6;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  color: var(--text);
}

.status-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 32px;
  padding: 6px 12px;
  border-radius: 999px;
  background: rgba(87, 114, 141, 0.12);
  color: var(--accent-strong);
  font-size: 0.86rem;
}

.status-pill.subtle {
  background: rgba(34, 52, 72, 0.06);
  color: var(--muted);
}

.status-pill-save {
  min-height: 28px;
  padding: 4px 10px;
  font-size: 0.8rem;
  letter-spacing: 0.01em;
}

.composer .status-pill-save {
  border: 1px solid rgba(91, 115, 139, 0.08);
  background: rgba(255, 255, 255, 0.42);
  color: rgba(97, 113, 129, 0.78);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.6);
}

.composer .status-pill-save.is-saved {
  background: rgba(255, 255, 255, 0.28);
  color: rgba(97, 113, 129, 0.62);
}

body[data-theme="dark"] .composer .status-pill-save {
  border-color: rgba(195, 213, 232, 0.06);
  background: rgba(255, 255, 255, 0.04);
  color: rgba(158, 176, 192, 0.66);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
}

body[data-theme="dark"] .composer .status-pill-save.is-saved {
  background: rgba(255, 255, 255, 0.025);
  color: rgba(158, 176, 192, 0.5);
}

.toast {
  position: fixed;
  right: 24px;
  bottom: 24px;
  max-width: 320px;
  padding: 12px 16px;
  border-radius: 14px;
  background: rgba(23, 35, 48, 0.94);
  color: #eaf2f9;
  box-shadow: 0 16px 36px rgba(23, 35, 48, 0.24);
  opacity: 0;
  pointer-events: none;
  transform: translateY(8px);
  transition: opacity 150ms ease, transform 150ms ease;
}

.toast.visible {
  opacity: 1;
  transform: translateY(0);
}

/* Single-column workflow layout */
.page-shell {
  display: flex;
  flex-direction: column;
  gap: 24px;
  max-width: 1120px;
  margin: 0 auto;
}

.title-banner {
  position: sticky;
  top: 14px;
  z-index: 20;
  width: 100%;
  align-self: stretch;
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) auto;
  gap: 28px;
  align-items: center;
  padding: 24px;
  border-radius: var(--radius-xl);
}

.title-banner-content {
  min-width: 0;
}

.title-banner h1 {
  margin: 10px 0 12px;
  font-size: clamp(2.4rem, 4.8vw, 3.8rem);
  font-family: var(--serif);
  font-weight: 700;
  line-height: 1.02;
  letter-spacing: -0.045em;
}

.title-copy {
  margin: 0;
  max-width: 52ch;
  color: var(--muted);
  font-size: 1.03rem;
  line-height: 1.8;
}

.title-banner-nav {
  display: flex;
  justify-self: end;
  align-items: center;
}

.page-switcher-nav {
  justify-content: flex-end;
  flex-wrap: nowrap;
  gap: 6px;
  padding: 6px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.58);
  background: rgba(255, 255, 255, 0.38);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.36);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

.section-note {
  margin: -2px 0 16px;
  color: var(--muted);
  font-size: 0.95rem;
  line-height: 1.72;
  max-width: none;
}

.panel-kicker {
  margin: 0 0 10px;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--accent-strong);
  opacity: 0.82;
}

.title-nav {
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-end;
  gap: 8px;
}

.page-nav-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 10px 18px;
  border-radius: 999px;
  border: 1px solid transparent;
  background: transparent;
  color: var(--text);
  font-size: 0.95rem;
  font-weight: 700;
  white-space: nowrap;
  cursor: pointer;
  transition: transform 120ms ease, background 120ms ease, border-color 120ms ease;
}

.page-nav-button:hover {
  transform: none;
  background: rgba(255, 255, 255, 0.58);
  border-color: rgba(87, 114, 141, 0.16);
}

body[data-theme="dark"] .page-switcher-nav {
  background: rgba(255, 255, 255, 0.05);
  border-color: rgba(255, 255, 255, 0.08);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

body[data-theme="dark"] .page-nav-button:hover {
  background: rgba(255, 255, 255, 0.08);
}

.page-nav-button.active {
  background: linear-gradient(135deg, rgba(87, 114, 141, 0.16) 0%, rgba(63, 88, 115, 0.24) 100%);
  color: var(--accent-strong);
  border-color: rgba(87, 114, 141, 0.18);
  box-shadow: 0 8px 18px rgba(63, 88, 115, 0.12);
}

.tools-stack {
  display: grid;
  gap: 10px;
}

.tool-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  padding: 14px 16px;
  border-radius: 18px;
  border: 1px solid rgba(87, 114, 141, 0.1);
  background: linear-gradient(180deg, rgba(249, 252, 255, 0.78) 0%, rgba(245, 249, 253, 0.56) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.88),
    0 10px 24px rgba(63, 88, 115, 0.04);
}

.tool-copy {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.tool-title {
  margin: 0;
  font-size: var(--font-md);
  font-weight: 650;
  line-height: var(--lh-tight);
  color: var(--text);
}

.tool-desc {
  margin: 0;
  max-width: 34ch;
  color: var(--muted);
  font-size: var(--font-sm);
  line-height: 1.56;
}

#section-tools .tool-item .ghost-button {
  min-width: 88px;
  min-height: 40px;
  padding: 9px 14px;
  border-radius: 12px;
}

#section-tools .tool-item .ghost-button .tool-action-label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.records-filter-group {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.records-filters-stack {
  display: grid;
  gap: 12px;
}

.records-search-field {
  margin: 0;
  padding: 14px 14px 12px;
  border-radius: var(--radius-lg);
  border: 1px solid rgba(87, 114, 141, 0.1);
  background: linear-gradient(180deg, rgba(249, 252, 255, 0.78) 0%, rgba(245, 249, 253, 0.54) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.82),
    0 8px 22px rgba(63, 88, 115, 0.04);
}

.records-search-field span {
  font-size: var(--font-sm);
  letter-spacing: 0.02em;
}

.records-search-field input {
  padding: 13px 15px;
  border-radius: 14px;
  border-color: rgba(87, 114, 141, 0.12);
  background: rgba(255, 255, 255, 0.92);
  font-size: 0.96rem;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.records-search-field input::placeholder {
  color: rgba(97, 113, 129, 0.64);
}

body[data-theme="dark"] .records-search-field {
  border-color: rgba(195, 213, 232, 0.08);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.035) 0%, rgba(255, 255, 255, 0.02) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.02),
    0 10px 24px rgba(0, 0, 0, 0.16);
}

body[data-theme="dark"] .tool-item {
  border-color: rgba(195, 213, 232, 0.08);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.035) 0%, rgba(255, 255, 255, 0.02) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.02),
    0 10px 24px rgba(0, 0, 0, 0.16);
}

body[data-theme="dark"] .records-search-field input {
  border-color: rgba(195, 213, 232, 0.08);
  background: rgba(255, 255, 255, 0.05);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
}

body[data-theme="dark"] .records-search-field input::placeholder {
  color: rgba(158, 176, 192, 0.44);
}

.records-filter-block {
  display: grid;
  gap: 8px;
}

.records-filter-caption {
  margin: 0;
  font-size: var(--font-sm);
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--muted);
}

.records-mode-button {
  padding: 9px 15px;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--muted);
  background: rgba(249, 252, 255, 0.76);
  border-color: rgba(87, 114, 141, 0.08);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.78);
}

.records-mode-button:hover {
  color: var(--text);
  border-color: rgba(87, 114, 141, 0.16);
  background: rgba(248, 251, 254, 0.96);
}

.records-filter-group + .records-filter-group {
  margin-top: 12px;
}

.records-filter-button.active,
.records-mode-button.active {
  background: linear-gradient(135deg, rgba(87, 114, 141, 0.14) 0%, rgba(63, 88, 115, 0.2) 100%);
  color: var(--accent-strong);
  border-color: rgba(87, 114, 141, 0.2);
  box-shadow:
    0 8px 18px rgba(63, 88, 115, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.5);
}

body[data-theme="dark"] .records-mode-button {
  color: rgba(158, 176, 192, 0.72);
  background: rgba(255, 255, 255, 0.03);
  border-color: rgba(195, 213, 232, 0.08);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.02);
}

body[data-theme="dark"] .records-mode-button:hover {
  color: rgba(230, 237, 245, 0.94);
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(195, 213, 232, 0.14);
}

body[data-theme="dark"] .records-mode-button.active {
  background: linear-gradient(135deg, rgba(87, 114, 141, 0.32) 0%, rgba(63, 88, 115, 0.42) 100%);
  border-color: rgba(195, 213, 232, 0.16);
  box-shadow:
    0 10px 22px rgba(0, 0, 0, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

[id^="section-"] {
  scroll-margin-top: 22px;
}

.sidebar,
.sidebar-panels,
.main-stage,
.workspace,
.response-stack,
.response-main-column,
.response-side-column,
.workspace-left-column,
.layout-slot {
  display: contents;
}

.brand-block,
.hero,
[data-panel-id="quicklinks"],
[data-panel-id="layouttools"],
.resize-handle,
.drag-handle {
  display: none !important;
}

.composer,
.response-card,
.sidebar .panel {
  width: 100%;
  position: static;
  max-height: none;
  overflow: visible;
}

.sidebar .panel {
  border-top: none;
  margin-top: 0;
  padding: 24px;
  border-radius: var(--radius-xl);
  background: var(--card);
  border: 1px solid rgba(255, 255, 255, 0.55);
  box-shadow: var(--shadow);
  backdrop-filter: blur(22px);
  -webkit-backdrop-filter: blur(22px);
}

.sidebar .panel,
.response-card-history,
.response-card-conversation,
.response-card-prompt {
  background:
    linear-gradient(180deg, rgba(248, 251, 254, 0.76) 0%, rgba(241, 246, 251, 0.66) 100%);
  border: 1px solid rgba(255, 255, 255, 0.5);
  box-shadow:
    0 14px 34px rgba(18, 28, 39, 0.07),
    inset 0 1px 0 rgba(255, 255, 255, 0.28);
}

body[data-theme="dark"] .sidebar .panel,
body[data-theme="dark"] .response-card-history,
body[data-theme="dark"] .response-card-conversation,
body[data-theme="dark"] .response-card-prompt {
  background:
    linear-gradient(180deg, rgba(39, 27, 20, 0.74) 0%, rgba(30, 21, 16, 0.68) 100%);
  border-color: rgba(230, 237, 245, 0.06);
  box-shadow:
    0 16px 36px rgba(0, 0, 0, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.025);
}

.sidebar .panel .panel-head,
.response-card-history .panel-head,
.response-card-conversation .panel-head,
.response-card-prompt .panel-head {
  margin-bottom: 10px;
}

.sidebar .panel .panel-head h2,
.response-card-history .panel-head h2,
.response-card-conversation .panel-head h2,
.response-card-prompt .panel-head h2 {
  font-size: 1.16rem;
  line-height: 1.2;
}

.sidebar .panel .section-note,
.response-card-history .section-note,
.response-card-conversation .section-note,
.response-card-prompt .section-note {
  font-size: 0.9rem;
  line-height: 1.66;
  margin-bottom: 14px;
}

.composer {
  order: 1;
}

.response-card-answer {
  order: 2;
}

.response-card-answer {
  padding: 30px 28px;
  background:
    linear-gradient(180deg, rgba(249, 252, 255, 0.94) 0%, rgba(242, 247, 252, 0.82) 100%);
  border: 1px solid rgba(255, 255, 255, 0.72);
  box-shadow:
    0 24px 60px rgba(18, 28, 39, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.42);
}

body[data-theme="dark"] .response-card-answer {
  background:
    linear-gradient(180deg, rgba(49, 34, 25, 0.92) 0%, rgba(36, 24, 18, 0.84) 100%);
  border-color: rgba(230, 237, 245, 0.08);
  box-shadow:
    0 24px 60px rgba(0, 0, 0, 0.34),
    inset 0 1px 0 rgba(255, 255, 255, 0.03);
}

.response-card-answer .panel-head {
  align-items: flex-start;
  margin-bottom: 12px;
}

.response-card-answer .panel-head h2 {
  font-size: 1.62rem;
  line-height: 1.08;
}

.response-card-answer .panel-tools {
  gap: 10px;
}

.response-card-answer .section-note {
  margin-bottom: 20px;
  font-size: 1rem;
  line-height: 1.75;
}

@media (min-width: 1100px) {
  .section-note {
    white-space: nowrap;
  }

  .response-card-answer .section-note {
    white-space: normal;
  }
}

.response-card-answer .status-pill {
  min-height: 34px;
  padding: 7px 13px;
}

.response-card-answer .response-output {
  padding: 24px 26px;
  font-size: 1.08rem;
  line-height: 1.82;
  border-color: rgba(91, 115, 139, 0.12);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.72) 0%, rgba(245, 249, 253, 0.94) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.72),
    0 10px 26px rgba(35, 53, 73, 0.05);
}

body[data-theme="dark"] .response-card-answer .response-output {
  border-color: rgba(195, 213, 232, 0.08);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.04) 0%, rgba(31, 22, 17, 0.92) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.03),
    0 12px 28px rgba(0, 0, 0, 0.22);
}

.response-card-answer .response-output.rendered > * {
  max-width: 72ch;
  margin-left: auto;
  margin-right: auto;
}

.response-card-answer .response-output.rendered ul,
.response-card-answer .response-output.rendered ol,
.response-card-answer .response-output.rendered blockquote,
.response-card-answer .response-output.rendered pre {
  max-width: 70ch;
}

.response-card-answer .response-output.rendered h1 {
  font-size: 2.05rem;
}

.response-card-answer .response-output.rendered h2 {
  font-size: 1.68rem;
}

.response-card-answer .response-output.rendered h3 {
  font-size: 1.36rem;
}

.response-card-answer .response-output.empty {
  text-align: center;
}

.response-card-history {
  order: 3;
}

.response-card-conversation {
  order: 4;
}

.response-card-history,
.response-card-conversation,
.response-card-prompt {
  padding: 22px 22px;
}

.panel[data-panel-id="sessions"] {
  order: 5;
}

.panel[data-panel-id="settings"] {
  order: 2;
}

.panel[data-panel-id="tools"] {
  order: 1;
}

.panel[data-panel-id="records-filters"] {
  order: 0;
}

.response-card-prompt {
  order: 3;
  opacity: 0.94;
}

.panel[data-panel-id="structure"] {
  order: 4;
  opacity: 0.9;
}

.panel[data-panel-id="settings"] {
  opacity: 0.96;
}

body[data-current-page="workspace"] [data-page]:not([data-page="workspace"]),
body[data-current-page="records"] [data-page]:not([data-page="records"]),
body[data-current-page="settings"] [data-page]:not([data-page="settings"]) {
  display: none !important;
}

body[data-current-page="records"] .response-card-history {
  order: 1;
}

body[data-current-page="records"] .response-card-conversation,
body[data-current-page="records"] .panel[data-panel-id="sessions"] {
  display: none !important;
}

body[data-current-page="records"] .response-card-history {
  opacity: 0.96;
  padding: 20px 20px;
}

body[data-current-page="records"] .response-card-history .panel-head h2 {
  font-size: var(--font-title);
}

body[data-current-page="records"] .panel[data-panel-id="records-filters"] {
  padding: 18px 18px 16px;
  border-top: none;
  margin-top: 0;
  background: rgba(255, 255, 255, 0.18);
}

body[data-theme="dark"][data-current-page="records"] .panel[data-panel-id="records-filters"] {
  background: rgba(255, 255, 255, 0.02);
}

body[data-current-page="records"] .panel[data-panel-id="records-filters"] .panel-head {
  margin-bottom: 10px;
}

body[data-current-page="records"] .panel[data-panel-id="records-filters"] .panel-head h2 {
  font-size: var(--font-title);
}

body[data-current-page="records"] .panel[data-panel-id="records-filters"] .section-note {
  margin-bottom: 10px;
}

body[data-current-page="records"] .panel[data-panel-id="records-filters"] .field {
  gap: 6px;
  margin-bottom: 0;
}

body[data-current-page="records"] .panel[data-panel-id="records-filters"] .records-filters-stack {
  gap: 12px;
}

body[data-current-page="records"] .panel[data-panel-id="records-filters"] .records-filter-block {
  gap: 8px;
}

body[data-current-page="records"] .response-card-history .history-list {
  gap: 8px;
}

.response-output,
.conversation-thread,
.history-list,
.system-preview {
  min-height: 0;
  max-height: none;
}

.history-list,
.conversation-thread,
.system-preview,
.session-list.empty {
  border-color: rgba(91, 115, 139, 0.08);
}

.response-card-answer .response-output {
  min-height: 320px;
}

/* Unified visual rhythm */
.title-banner {
  gap: var(--space-5);
  padding: var(--space-5);
}

.title-banner h1 {
  font-size: var(--font-hero);
  line-height: 1.04;
}

.title-copy,
.brand-copy,
.hero-copy {
  font-size: var(--font-md);
  line-height: 1.72;
}

.page-switcher-nav {
  gap: var(--space-1);
  padding: var(--space-1);
}

.page-nav-button {
  min-height: 40px;
  padding: 9px 16px;
  font-size: var(--font-sm);
  letter-spacing: 0.01em;
}

.sidebar .panel,
.composer,
.response-card {
  padding: var(--space-5);
}

.panel-head,
.sidebar .panel .panel-head,
.response-card-history .panel-head,
.response-card-conversation .panel-head,
.response-card-prompt .panel-head,
.response-card-answer .panel-head {
  gap: var(--space-3);
  margin-bottom: var(--space-3);
}

.panel-head h2,
.sidebar .panel .panel-head h2,
.response-card-history .panel-head h2,
.response-card-conversation .panel-head h2,
.response-card-prompt .panel-head h2 {
  font-size: var(--font-title);
  line-height: var(--lh-tight);
}

.composer .panel-head h2,
.response-card-answer .panel-head h2 {
  font-size: 1.42rem;
  line-height: 1.18;
}

.panel-kicker,
.eyebrow,
.mode-switcher-title,
.session-context-label,
.history-block-label,
.conversation-role,
.history-conversation-role {
  letter-spacing: 0.12em;
}

.panel-kicker,
.mode-switcher-title,
.session-context-label {
  font-size: var(--font-xs);
  font-weight: 700;
  line-height: 1.4;
}

.section-note,
.micro-copy,
.composer-actions-note,
.answer-guidance,
.supplemental-summary-preview,
.send-preview-copy,
.history-action-hint,
.layout-status {
  font-size: var(--font-sm);
  line-height: var(--lh-copy);
}

.section-note {
  margin: 0 0 var(--space-4);
}

.field,
.settings-body,
.records-filters-stack,
.records-filter-block,
.layout-controls,
.session-list,
.history-list,
.conversation-thread,
.history-conversation-list,
.response-main-column,
.response-side-column,
.workspace-left-column {
  gap: var(--space-3);
}

.field span,
.records-filter-caption,
.send-preview-title,
.supplemental-summary-title,
.session-title,
.history-question-title {
  font-size: var(--font-sm);
  font-weight: 700;
  line-height: 1.45;
  letter-spacing: 0.01em;
}

input,
textarea {
  padding: 12px 14px;
  font-size: var(--font-md);
  line-height: 1.68;
}

.primary-button,
.ghost-button,
.template-tab,
.page-nav-button {
  font-size: var(--font-sm);
}

.primary-button,
.ghost-button,
.template-tab {
  padding: 10px 16px;
}

.drag-handle,
.status-pill {
  min-height: 36px;
}

.status-pill,
.status-pill-save,
.session-mini,
.mini-button {
  font-size: var(--font-xs);
  line-height: 1.4;
}

.status-pill,
.status-pill-save {
  padding: 5px 11px;
}

.mode-switcher-block {
  gap: var(--space-1);
  margin-bottom: var(--space-4);
}

.composer .template-switcher,
.records-filter-group {
  gap: var(--space-1);
}

.composer .template-switcher {
  padding: var(--space-1);
}

.composer .template-tab,
.records-mode-button {
  min-height: 40px;
  padding: 8px 12px;
}

.composer .template-tab {
  flex: 0 0 auto;
  min-width: 76px;
}

.composer .conversation-toolbar,
.send-preview,
.supplemental-fields,
.records-search-field,
.history-body,
.conversation-item,
.history-conversation-item,
.session-item {
  padding: var(--space-4);
}

.form-grid {
  gap: var(--space-4);
  margin-bottom: var(--space-5);
}

.composer .field {
  gap: var(--space-2);
}

.field-question-primary {
  padding: var(--space-5);
}

.response-output,
.system-preview,
.history-summary {
  padding: var(--space-4);
}

.response-output {
  font-size: 1rem;
  line-height: 1.88;
}

.composer-actions-note,
.answer-guidance {
  margin-top: var(--space-2);
}

.answer-actions {
  margin-top: var(--space-4);
  padding-top: var(--space-3);
}

.system-preview,
.conversation-content,
.history-question,
.history-answer,
.history-conversation-content {
  font-size: var(--font-md);
  line-height: var(--lh-reading);
}

.history-meta,
.session-meta {
  font-size: var(--font-xs);
  line-height: 1.45;
}

.history-answer-preview {
  font-size: 0.86rem;
  line-height: 1.62;
}

.history-actions,
.session-actions,
.answer-actions,
.button-row,
.hero-actions,
.quick-links {
  gap: var(--space-2);
}

.panel-tools,
.composer-actions,
.answer-actions,
.history-actions,
.session-actions {
  align-items: center;
  gap: var(--space-2);
}

.panel-tools > .status-pill,
.panel-tools > .status-pill-save {
  margin-right: 2px;
}

/* Button hierarchy */
.primary-button {
  font-weight: 700;
  border-color: rgba(63, 88, 115, 0.18);
  box-shadow:
    0 12px 26px rgba(63, 88, 115, 0.2),
    inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

.primary-button:hover {
  box-shadow:
    0 14px 30px rgba(63, 88, 115, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.22);
}

.ghost-button,
.mini-button,
.session-mini {
  border-color: rgba(91, 115, 139, 0.12);
  background: rgba(255, 255, 255, 0.62);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72);
}

.ghost-button:hover,
.mini-button:hover,
.session-mini:hover {
  border-color: rgba(87, 114, 141, 0.16);
  background: rgba(250, 252, 255, 0.94);
}

.panel-tools .ghost-button,
#toggle-settings,
#toggle-system-prompt,
#toggle-conversation,
#toggle-render-mode,
#clear-history,
#clear-draft,
#clear-settings,
#open-chatgpt,
#theme-toggle-settings,
#copy-system-prompt-settings,
#copy-user-prompt-settings,
#export-history-settings,
#import-history-trigger-settings {
  color: var(--muted);
  background: rgba(255, 255, 255, 0.34);
  border-color: rgba(91, 115, 139, 0.08);
  box-shadow: none;
}

.panel-tools .ghost-button:hover,
#toggle-settings:hover,
#toggle-system-prompt:hover,
#toggle-conversation:hover,
#toggle-render-mode:hover,
#clear-history:hover,
#clear-draft:hover,
#clear-settings:hover,
#open-chatgpt:hover,
#theme-toggle-settings:hover,
#copy-system-prompt-settings:hover,
#copy-user-prompt-settings:hover,
#export-history-settings:hover,
#import-history-trigger-settings:hover {
  color: var(--text);
  background: rgba(255, 255, 255, 0.5);
  border-color: rgba(87, 114, 141, 0.12);
}

.answer-actions #answer-followup,
#resume-session,
.history-actions .mini-button-primary,
.session-actions .session-resume,
#save-settings {
  border-color: rgba(87, 114, 141, 0.22);
  background: linear-gradient(135deg, rgba(87, 114, 141, 0.14) 0%, rgba(63, 88, 115, 0.2) 100%);
  color: var(--accent-strong);
  font-weight: 700;
  box-shadow:
    0 10px 22px rgba(63, 88, 115, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.42);
}

.answer-actions #copy-response,
.history-actions .history-export,
.history-actions .history-export-session,
.history-actions .history-copy-question,
.history-actions .history-copy-answer,
.history-actions .history-reuse,
.session-actions .session-switch,
.session-actions .session-rename,
.session-actions .session-pin-toggle {
  background: rgba(255, 255, 255, 0.48);
  color: var(--text);
}

.button-row > .ghost-button:disabled,
.answer-actions .ghost-button:disabled,
.history-actions .mini-button:disabled,
.session-actions .session-mini:disabled {
  opacity: 0.42;
}

body[data-theme="dark"] .primary-button {
  border-color: rgba(195, 213, 232, 0.08);
  box-shadow:
    0 14px 28px rgba(0, 0, 0, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

body[data-theme="dark"] .ghost-button,
body[data-theme="dark"] .mini-button,
body[data-theme="dark"] .session-mini {
  border-color: rgba(195, 213, 232, 0.08);
  background: rgba(255, 255, 255, 0.045);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
}

body[data-theme="dark"] .ghost-button:hover,
body[data-theme="dark"] .mini-button:hover,
body[data-theme="dark"] .session-mini:hover {
  background: rgba(255, 255, 255, 0.07);
  border-color: rgba(195, 213, 232, 0.14);
}

body[data-theme="dark"] .panel-tools .ghost-button,
body[data-theme="dark"] #toggle-settings,
body[data-theme="dark"] #toggle-system-prompt,
body[data-theme="dark"] #toggle-conversation,
body[data-theme="dark"] #toggle-render-mode,
body[data-theme="dark"] #clear-history,
body[data-theme="dark"] #clear-draft,
body[data-theme="dark"] #clear-settings,
body[data-theme="dark"] #open-chatgpt,
body[data-theme="dark"] #theme-toggle-settings,
body[data-theme="dark"] #copy-system-prompt-settings,
body[data-theme="dark"] #copy-user-prompt-settings,
body[data-theme="dark"] #export-history-settings,
body[data-theme="dark"] #import-history-trigger-settings {
  color: rgba(158, 176, 192, 0.68);
  background: rgba(255, 255, 255, 0.028);
  border-color: rgba(195, 213, 232, 0.06);
}

body[data-theme="dark"] .history-item.pinned {
  border-color: rgba(195, 213, 232, 0.12);
  box-shadow:
    0 12px 26px rgba(0, 0, 0, 0.2),
    inset 0 1px 0 rgba(255, 255, 255, 0.03);
}

body[data-theme="dark"] .answer-actions #answer-followup,
body[data-theme="dark"] #resume-session,
body[data-theme="dark"] .history-actions .mini-button-primary,
body[data-theme="dark"] .session-actions .session-resume,
body[data-theme="dark"] #save-settings {
  border-color: rgba(195, 213, 232, 0.14);
  background: linear-gradient(135deg, rgba(87, 114, 141, 0.28) 0%, rgba(63, 88, 115, 0.38) 100%);
  box-shadow:
    0 12px 24px rgba(0, 0, 0, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

/* Card hierarchy */
.composer {
  border: 1px solid rgba(255, 255, 255, 0.74);
  box-shadow:
    0 22px 52px rgba(18, 28, 39, 0.11),
    inset 0 1px 0 rgba(255, 255, 255, 0.46);
}

body[data-theme="dark"] .composer {
  border-color: rgba(230, 237, 245, 0.08);
  box-shadow:
    0 22px 52px rgba(0, 0, 0, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.035);
}

.response-card-answer {
  border: 1px solid rgba(255, 255, 255, 0.78);
  box-shadow:
    0 28px 66px rgba(18, 28, 39, 0.14),
    inset 0 1px 0 rgba(255, 255, 255, 0.48);
}

body[data-theme="dark"] .response-card-answer {
  border-color: rgba(230, 237, 245, 0.09);
  box-shadow:
    0 28px 66px rgba(0, 0, 0, 0.36),
    inset 0 1px 0 rgba(255, 255, 255, 0.035);
}

.response-card-history {
  border: 1px solid rgba(255, 255, 255, 0.56);
  box-shadow:
    0 16px 38px rgba(18, 28, 39, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.32);
}

body[data-theme="dark"] .response-card-history {
  border-color: rgba(230, 237, 245, 0.065);
  box-shadow:
    0 18px 40px rgba(0, 0, 0, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.025);
}

.sidebar .panel,
.response-card-conversation,
.response-card-prompt {
  border: 1px solid rgba(255, 255, 255, 0.48);
  box-shadow:
    0 12px 30px rgba(18, 28, 39, 0.06),
    inset 0 1px 0 rgba(255, 255, 255, 0.24);
}

body[data-theme="dark"] .sidebar .panel,
body[data-theme="dark"] .response-card-conversation,
body[data-theme="dark"] .response-card-prompt {
  border-color: rgba(230, 237, 245, 0.055);
  box-shadow:
    0 14px 32px rgba(0, 0, 0, 0.2),
    inset 0 1px 0 rgba(255, 255, 255, 0.02);
}

.panel[data-panel-id="settings"],
.panel[data-panel-id="tools"],
.panel[data-panel-id="structure"],
.response-card-prompt {
  opacity: 0.94;
}

.panel[data-panel-id="records-filters"] {
  border-color: rgba(87, 114, 141, 0.08);
  background: linear-gradient(180deg, rgba(249, 252, 255, 0.72) 0%, rgba(242, 247, 252, 0.52) 100%);
}

body[data-theme="dark"] .panel[data-panel-id="records-filters"] {
  border-color: rgba(195, 213, 232, 0.06);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.03) 0%, rgba(255, 255, 255, 0.018) 100%);
}

/* Cool Professional Palette Overrides */
.glass {
  border-color: rgba(255, 255, 255, 0.62);
}

body[data-theme="dark"] .glass {
  border-color: rgba(215, 227, 239, 0.08);
}

.primary-button {
  background: linear-gradient(135deg, rgba(79, 107, 134, 0.16) 0%, rgba(47, 75, 103, 0.24) 100%);
  border-color: rgba(79, 107, 134, 0.18);
  color: var(--accent-strong);
  box-shadow:
    0 12px 26px rgba(47, 75, 103, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.46);
}

.ghost-button,
.mini-button,
.template-tab,
.session-mini {
  border-color: rgba(79, 107, 134, 0.1);
  background: rgba(248, 251, 255, 0.78);
}

.ghost-button:hover,
.mini-button:hover,
.template-tab:hover,
.session-mini:hover {
  border-color: rgba(79, 107, 134, 0.18);
  background: rgba(244, 249, 255, 0.96);
}

.template-tab.active,
.delivery-mode-button.active,
.page-nav-button.active,
.records-mode-button.active,
.records-filter-button.active {
  background: linear-gradient(135deg, rgba(79, 107, 134, 0.14) 0%, rgba(47, 75, 103, 0.22) 100%);
  border-color: rgba(79, 107, 134, 0.2);
  color: var(--accent-strong);
  box-shadow: 0 8px 18px rgba(47, 75, 103, 0.1);
}

input:focus,
textarea:focus {
  border-color: rgba(79, 107, 134, 0.42);
  box-shadow: 0 0 0 4px rgba(79, 107, 134, 0.1);
}

.response-card-answer {
  background:
    linear-gradient(180deg, rgba(249, 252, 255, 0.95) 0%, rgba(238, 244, 250, 0.88) 100%);
  box-shadow:
    0 24px 60px rgba(34, 52, 72, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.5);
}

.response-card-answer .response-output {
  border-color: rgba(79, 107, 134, 0.12);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.9) 0%, rgba(245, 249, 253, 0.96) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.82),
    0 10px 26px rgba(35, 55, 77, 0.05);
}

.history-mode,
.history-state-pinned,
.status-pill,
.status-pill-save,
.session-pin {
  background: rgba(79, 107, 134, 0.12);
  color: var(--accent-strong);
}

.history-state-session {
  background: rgba(92, 124, 155, 0.12);
  color: #44637f;
}

.history-state-single {
  background: rgba(124, 139, 154, 0.12);
  color: #5e7182;
}

.tool-item,
.records-search-field,
.history-block-surface,
.history-conversation-item {
  border-color: rgba(79, 107, 134, 0.1);
}

.response-card-answer .panel-head h2,
.brand-block h1,
.title-banner h1,
.hero h2 {
  color: #23384b;
}

body[data-theme="dark"] .primary-button {
  border-color: rgba(195, 213, 232, 0.14);
  background: linear-gradient(135deg, rgba(95, 127, 158, 0.34) 0%, rgba(59, 88, 116, 0.46) 100%);
  box-shadow:
    0 14px 28px rgba(0, 0, 0, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

body[data-theme="dark"] .ghost-button,
body[data-theme="dark"] .mini-button,
body[data-theme="dark"] .template-tab,
body[data-theme="dark"] .session-mini {
  border-color: rgba(213, 224, 236, 0.08);
  background: rgba(255, 255, 255, 0.038);
}

body[data-theme="dark"] .ghost-button:hover,
body[data-theme="dark"] .mini-button:hover,
body[data-theme="dark"] .template-tab:hover,
body[data-theme="dark"] .session-mini:hover {
  background: rgba(255, 255, 255, 0.064);
  border-color: rgba(195, 213, 232, 0.16);
}

body[data-theme="dark"] .template-tab.active,
body[data-theme="dark"] .delivery-mode-button.active,
body[data-theme="dark"] .page-nav-button.active,
body[data-theme="dark"] .records-mode-button.active,
body[data-theme="dark"] .records-filter-button.active {
  background: linear-gradient(135deg, rgba(95, 127, 158, 0.28) 0%, rgba(59, 88, 116, 0.4) 100%);
  border-color: rgba(195, 213, 232, 0.18);
  color: var(--accent-strong);
}

body[data-theme="dark"] input:focus,
body[data-theme="dark"] textarea:focus {
  border-color: rgba(127, 157, 185, 0.44);
  box-shadow: 0 0 0 4px rgba(127, 157, 185, 0.12);
}

body[data-theme="dark"] .response-card-answer {
  background:
    linear-gradient(180deg, rgba(24, 34, 45, 0.94) 0%, rgba(17, 25, 34, 0.9) 100%);
  box-shadow:
    0 24px 60px rgba(0, 0, 0, 0.34),
    inset 0 1px 0 rgba(255, 255, 255, 0.035);
}

body[data-theme="dark"] .response-card-answer .response-output {
  border-color: rgba(127, 157, 185, 0.1);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.045) 0%, rgba(17, 24, 33, 0.94) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.03),
    0 12px 28px rgba(0, 0, 0, 0.22);
}

body[data-theme="dark"] .history-mode,
body[data-theme="dark"] .history-state-pinned,
body[data-theme="dark"] .status-pill,
body[data-theme="dark"] .status-pill-save,
body[data-theme="dark"] .session-pin {
  background: rgba(127, 157, 185, 0.16);
  color: var(--accent-strong);
}

body[data-theme="dark"] .history-state-session {
  background: rgba(101, 134, 165, 0.16);
  color: #b8cce0;
}

body[data-theme="dark"] .history-state-single {
  background: rgba(124, 139, 154, 0.16);
  color: #b8c1cb;
}

/* Cool Professional Style Refinement */
.brand-block h1,
.hero h2,
.panel-head h2,
.title-banner h1 {
  font-family: var(--sans);
  font-weight: 720;
  letter-spacing: -0.04em;
}

.eyebrow {
  letter-spacing: 0.16em;
  color: var(--accent);
}

.title-banner,
.sidebar,
.composer,
.response-card-history,
.response-card-conversation,
.response-card-prompt,
.sidebar .panel {
  background:
    linear-gradient(180deg, rgba(250, 252, 255, 0.88) 0%, rgba(242, 247, 252, 0.74) 100%);
  border-color: rgba(95, 118, 142, 0.1);
  box-shadow:
    0 18px 42px rgba(34, 52, 72, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.62);
}

body[data-theme="dark"] .title-banner,
body[data-theme="dark"] .sidebar,
body[data-theme="dark"] .composer,
body[data-theme="dark"] .response-card-history,
body[data-theme="dark"] .response-card-conversation,
body[data-theme="dark"] .response-card-prompt,
body[data-theme="dark"] .sidebar .panel {
  background:
    linear-gradient(180deg, rgba(24, 34, 45, 0.88) 0%, rgba(18, 26, 35, 0.82) 100%);
  border-color: rgba(195, 213, 232, 0.08);
  box-shadow:
    0 18px 42px rgba(0, 0, 0, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.03);
}

.title-copy,
.brand-copy,
.hero-copy,
.section-note,
.micro-copy {
  color: #617181;
}

body[data-theme="dark"] .title-copy,
body[data-theme="dark"] .brand-copy,
body[data-theme="dark"] .hero-copy,
body[data-theme="dark"] .section-note,
body[data-theme="dark"] .micro-copy {
  color: #9eb0c0;
}

.composer .template-switcher,
.delivery-mode-switch,
.supplemental-fields,
.send-preview,
.composer .conversation-toolbar,
.followup-guidance,
.records-search-field,
.tool-item {
  background: rgba(246, 250, 254, 0.72);
  border-color: rgba(95, 118, 142, 0.1);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.66);
}

body[data-theme="dark"] .composer .template-switcher,
body[data-theme="dark"] .delivery-mode-switch,
body[data-theme="dark"] .supplemental-fields,
body[data-theme="dark"] .send-preview,
body[data-theme="dark"] .composer .conversation-toolbar,
body[data-theme="dark"] .followup-guidance,
body[data-theme="dark"] .records-search-field,
body[data-theme="dark"] .tool-item {
  background: rgba(255, 255, 255, 0.03);
  border-color: rgba(195, 213, 232, 0.08);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
}

.composer .field {
  background: rgba(249, 252, 255, 0.58);
  border-color: rgba(95, 118, 142, 0.09);
}

body[data-theme="dark"] .composer .field {
  background: rgba(255, 255, 255, 0.022);
  border-color: rgba(195, 213, 232, 0.06);
}

.field-question-primary {
  background:
    linear-gradient(180deg, rgba(251, 253, 255, 0.9) 0%, rgba(242, 248, 253, 0.72) 100%);
  border-color: rgba(79, 107, 134, 0.14);
  box-shadow:
    0 10px 24px rgba(35, 55, 77, 0.05),
    inset 0 1px 0 rgba(255, 255, 255, 0.76);
}

body[data-theme="dark"] .field-question-primary {
  background:
    linear-gradient(180deg, rgba(27, 39, 52, 0.88) 0%, rgba(19, 28, 38, 0.72) 100%);
  border-color: rgba(127, 157, 185, 0.12);
  box-shadow:
    0 10px 24px rgba(0, 0, 0, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.03);
}

.history-item,
.history-block-surface,
.history-conversation-item {
  background: rgba(250, 252, 255, 0.82);
  border-color: rgba(95, 118, 142, 0.1);
}

body[data-theme="dark"] .history-item,
body[data-theme="dark"] .history-block-surface,
body[data-theme="dark"] .history-conversation-item {
  background: rgba(255, 255, 255, 0.028);
  border-color: rgba(195, 213, 232, 0.07);
}

.response-card-answer .panel-head h2,
.brand-block h1,
.title-banner h1,
.hero h2 {
  color: #203447;
}

body[data-theme="dark"] .response-card-answer .panel-head h2,
body[data-theme="dark"] .brand-block h1,
body[data-theme="dark"] .title-banner h1,
body[data-theme="dark"] .hero h2 {
  color: #dce8f3;
}

@media (max-width: 900px) {
  .title-banner {
    grid-template-columns: 1fr;
    top: 10px;
    gap: 18px;
    padding: 22px 20px;
  }

  .title-nav {
    justify-content: flex-start;
    flex-wrap: wrap;
  }

  .title-banner-nav {
    justify-self: stretch;
  }

  .page-switcher-nav {
    justify-content: flex-start;
    flex-wrap: wrap;
    width: 100%;
  }
}

@media (max-width: 1560px) and (min-width: 1121px) {
  .workspace {
    grid-template-columns:
      minmax(320px, var(--workspace-left-width))
      var(--resize-handle-size)
      minmax(0, 1fr);
  }

  .response-stack {
    grid-template-columns:
      minmax(0, 1fr)
      var(--resize-handle-size)
      minmax(260px, var(--response-side-width));
  }
}

@media (max-width: 1120px) {
  .page-shell,
  .workspace {
    grid-template-columns: 1fr;
  }

  .sidebar {
    position: static;
    max-height: none;
    overflow: visible;
  }

  .composer {
    position: static;
    max-height: none;
    overflow: visible;
  }

  .response-stack {
    grid-template-columns: 1fr;
  }

  #workspace-resizer,
  #response-resizer,
  #main-column-resizer,
  #side-column-resizer {
    display: none;
  }

  .response-side-column {
    position: static;
    grid-template-rows: auto;
  }

  .response-main-column {
    grid-template-rows: auto;
  }
}

@media (max-width: 720px) {
  .mode-switcher-hint {
    grid-template-columns: 1fr;
    white-space: normal;
  }

  #section-question .mode-switcher-hint {
    grid-template-columns: 1fr;
  }

  .mode-switcher-hint > div {
    white-space: normal;
  }

  #section-question .mode-switcher-hint > div {
    white-space: normal;
  }

  body {
    padding: 14px;
  }

  .hero,
  .composer,
  .response-card,
  .sidebar {
    padding: 18px;
  }

  .form-grid {
    grid-template-columns: 1fr;
  }

  .field-span-2 {
    grid-column: auto;
  }

  .conversation-thread,
  .history-list,
  .system-preview,
  .response-output {
    min-height: 220px;
    max-height: none;
  }
}

/* Final Cool-Neutral Polish */
.layout-dropzone.drag-over,
.layout-slot.drag-over {
  outline-color: rgba(88, 116, 145, 0.32);
  background: rgba(96, 125, 154, 0.08);
  box-shadow: inset 0 0 0 1px rgba(88, 116, 145, 0.12);
}

input:focus,
textarea:focus {
  border-color: rgba(89, 116, 144, 0.38);
  box-shadow: 0 0 0 4px rgba(88, 116, 145, 0.12);
}

.resize-handle {
  background: rgba(87, 114, 141, 0.1);
  border-color: rgba(87, 114, 141, 0.16);
}

.resize-handle::after {
  background: rgba(63, 88, 115, 0.56);
}

.resize-handle:hover,
.resize-handle.active {
  background: rgba(87, 114, 141, 0.16);
  border-color: rgba(87, 114, 141, 0.26);
  box-shadow: 0 0 0 6px rgba(87, 114, 141, 0.08);
}

.primary-button {
  border-color: rgba(73, 99, 126, 0.18);
  background: linear-gradient(135deg, rgba(85, 112, 138, 0.96) 0%, rgba(55, 77, 101, 0.96) 100%);
  box-shadow:
    0 12px 26px rgba(38, 56, 76, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.18);
}

.primary-button:hover {
  box-shadow:
    0 14px 30px rgba(38, 56, 76, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.22);
}

.primary-button.accent,
.mini-button-primary,
.history-actions .mini-button-primary,
.session-actions .session-pin-toggle {
  border-color: rgba(85, 112, 138, 0.2);
  background: linear-gradient(135deg, rgba(101, 129, 156, 0.18) 0%, rgba(67, 90, 114, 0.24) 100%);
  color: #29415a;
  box-shadow:
    0 8px 18px rgba(37, 55, 76, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.4);
}

.template-tab.active,
.delivery-mode-button.active,
.page-nav-button.active,
.records-mode-button.active,
.records-filter-button.active {
  background: linear-gradient(135deg, rgba(101, 129, 156, 0.16) 0%, rgba(67, 90, 114, 0.22) 100%);
  border-color: rgba(85, 112, 138, 0.2);
  color: #29415a;
  box-shadow:
    0 8px 18px rgba(37, 55, 76, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.42);
}

.page-switcher-nav {
  background: rgba(245, 249, 253, 0.82);
  border-color: rgba(91, 115, 139, 0.12);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.78);
}

.page-nav-button:hover,
.records-mode-button:hover,
.records-filter-button:hover {
  background: rgba(255, 255, 255, 0.78);
  border-color: rgba(91, 115, 139, 0.14);
}

.supplemental-fields,
.send-preview,
.composer .conversation-toolbar,
.followup-guidance,
.records-search-field,
.tool-item {
  background: linear-gradient(180deg, rgba(248, 251, 254, 0.8) 0%, rgba(241, 246, 251, 0.68) 100%);
  border-color: rgba(91, 115, 139, 0.1);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.74),
    0 10px 22px rgba(35, 53, 73, 0.035);
}

.composer .field,
.history-item,
.history-block-surface,
.history-conversation-item {
  background: rgba(251, 253, 255, 0.84);
  border-color: rgba(91, 115, 139, 0.1);
}

.field-question-primary {
  background: linear-gradient(180deg, rgba(252, 254, 255, 0.94) 0%, rgba(243, 248, 253, 0.82) 100%);
  border-color: rgba(78, 107, 135, 0.14);
  box-shadow:
    0 10px 24px rgba(35, 55, 77, 0.045),
    inset 0 1px 0 rgba(255, 255, 255, 0.8);
}

.records-search-field input {
  border-color: rgba(89, 116, 144, 0.12);
  background: rgba(255, 255, 255, 0.94);
}

.history-item.pinned {
  border-color: rgba(85, 112, 138, 0.16);
  background: linear-gradient(180deg, rgba(250, 253, 255, 0.84) 0%, rgba(242, 247, 252, 0.62) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.8),
    0 10px 24px rgba(35, 53, 73, 0.04);
}

.history-summary::after {
  border-right-color: rgba(73, 98, 124, 0.62);
  border-bottom-color: rgba(73, 98, 124, 0.62);
}

.history-mode,
.history-state-pinned,
.status-pill,
.status-pill-save,
.session-pin {
  background: rgba(93, 120, 146, 0.12);
  color: #37516b;
}

.history-state-session {
  background: rgba(92, 127, 160, 0.12);
  color: #4b6784;
}

.history-state-single {
  background: rgba(111, 126, 141, 0.12);
  color: #65798d;
}

.composer .status-pill-save {
  border-color: rgba(91, 115, 139, 0.1);
  background: rgba(255, 255, 255, 0.5);
  color: #627487;
}

.composer .status-pill-save.is-saved {
  background: rgba(255, 255, 255, 0.32);
  color: #708293;
}

.response-output.rendered h1,
.response-output.rendered h2,
.response-output.rendered h3,
.response-output.rendered h4 {
  font-family: var(--sans);
  color: #223547;
}

.response-output.rendered code {
  background: rgba(87, 114, 141, 0.1);
}

.response-output.rendered pre {
  background: rgba(34, 52, 72, 0.05);
  border-color: rgba(91, 115, 139, 0.1);
}

.response-output.rendered blockquote {
  border-left-color: rgba(87, 114, 141, 0.32);
}

.session-item.active {
  border-color: rgba(85, 112, 138, 0.26);
  box-shadow: inset 0 0 0 1px rgba(85, 112, 138, 0.12);
}

.session-item.pinned {
  border-color: rgba(85, 112, 138, 0.2);
}

.session-mini {
  background: rgba(255, 255, 255, 0.72);
  border-color: rgba(91, 115, 139, 0.1);
}

.toast {
  background: rgba(23, 35, 48, 0.94);
  color: #eaf2f9;
  box-shadow: 0 16px 36px rgba(18, 28, 39, 0.24);
}

body[data-theme="dark"] .resize-handle {
  background: rgba(133, 159, 186, 0.12);
  border-color: rgba(133, 159, 186, 0.18);
}

body[data-theme="dark"] .resize-handle::after {
  background: rgba(189, 210, 229, 0.54);
}

body[data-theme="dark"] .resize-handle:hover,
body[data-theme="dark"] .resize-handle.active {
  background: rgba(133, 159, 186, 0.18);
  border-color: rgba(133, 159, 186, 0.28);
  box-shadow: 0 0 0 6px rgba(133, 159, 186, 0.08);
}

body[data-theme="dark"] .primary-button {
  border-color: rgba(126, 157, 186, 0.18);
  background: linear-gradient(135deg, rgba(90, 118, 145, 0.96) 0%, rgba(54, 73, 95, 0.96) 100%);
  box-shadow:
    0 14px 30px rgba(0, 0, 0, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

body[data-theme="dark"] .primary-button.accent,
body[data-theme="dark"] .mini-button-primary,
body[data-theme="dark"] .history-actions .mini-button-primary,
body[data-theme="dark"] .session-actions .session-pin-toggle,
body[data-theme="dark"] .template-tab.active,
body[data-theme="dark"] .delivery-mode-button.active,
body[data-theme="dark"] .page-nav-button.active,
body[data-theme="dark"] .records-mode-button.active,
body[data-theme="dark"] .records-filter-button.active {
  background: linear-gradient(135deg, rgba(96, 126, 154, 0.3) 0%, rgba(63, 84, 107, 0.42) 100%);
  border-color: rgba(126, 157, 186, 0.18);
  color: #d6e4f1;
  box-shadow:
    0 10px 22px rgba(0, 0, 0, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

body[data-theme="dark"] .page-switcher-nav {
  background: rgba(255, 255, 255, 0.04);
  border-color: rgba(195, 213, 232, 0.08);
}

body[data-theme="dark"] .page-nav-button:hover,
body[data-theme="dark"] .records-mode-button:hover,
body[data-theme="dark"] .records-filter-button:hover {
  background: rgba(255, 255, 255, 0.07);
  border-color: rgba(195, 213, 232, 0.12);
}

body[data-theme="dark"] .supplemental-fields,
body[data-theme="dark"] .send-preview,
body[data-theme="dark"] .composer .conversation-toolbar,
body[data-theme="dark"] .followup-guidance,
body[data-theme="dark"] .records-search-field,
body[data-theme="dark"] .tool-item {
  background: linear-gradient(180deg, rgba(27, 38, 50, 0.86) 0%, rgba(19, 28, 38, 0.78) 100%);
  border-color: rgba(195, 213, 232, 0.08);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.03),
    0 12px 28px rgba(0, 0, 0, 0.16);
}

body[data-theme="dark"] .composer .field,
body[data-theme="dark"] .history-item,
body[data-theme="dark"] .history-block-surface,
body[data-theme="dark"] .history-conversation-item {
  background: rgba(255, 255, 255, 0.03);
  border-color: rgba(195, 213, 232, 0.07);
}

body[data-theme="dark"] .field-question-primary {
  background: linear-gradient(180deg, rgba(31, 44, 57, 0.9) 0%, rgba(22, 31, 41, 0.8) 100%);
  border-color: rgba(126, 157, 186, 0.12);
}

body[data-theme="dark"] .records-search-field input {
  border-color: rgba(195, 213, 232, 0.08);
  background: rgba(255, 255, 255, 0.04);
}

body[data-theme="dark"] .history-item.pinned {
  border-color: rgba(126, 157, 186, 0.16);
  background: linear-gradient(180deg, rgba(31, 44, 56, 0.84) 0%, rgba(22, 30, 40, 0.74) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.03),
    0 12px 28px rgba(0, 0, 0, 0.18);
}

body[data-theme="dark"] .history-summary::after {
  border-right-color: rgba(193, 211, 229, 0.72);
  border-bottom-color: rgba(193, 211, 229, 0.72);
}

body[data-theme="dark"] .history-mode,
body[data-theme="dark"] .history-state-pinned,
body[data-theme="dark"] .status-pill,
body[data-theme="dark"] .status-pill-save,
body[data-theme="dark"] .session-pin {
  background: rgba(127, 157, 185, 0.16);
  color: #c7d8e8;
}

body[data-theme="dark"] .history-state-session {
  background: rgba(96, 132, 164, 0.18);
  color: #bdd2e6;
}

body[data-theme="dark"] .history-state-single {
  background: rgba(123, 137, 152, 0.18);
  color: #b9c5d0;
}

body[data-theme="dark"] .composer .status-pill-save {
  border-color: rgba(195, 213, 232, 0.07);
  background: rgba(255, 255, 255, 0.05);
  color: #aebfd0;
}

body[data-theme="dark"] .composer .status-pill-save.is-saved {
  background: rgba(255, 255, 255, 0.03);
  color: #96a9bc;
}

body[data-theme="dark"] .response-output.rendered h1,
body[data-theme="dark"] .response-output.rendered h2,
body[data-theme="dark"] .response-output.rendered h3,
body[data-theme="dark"] .response-output.rendered h4 {
  color: #d7e4f0;
}

body[data-theme="dark"] .response-output.rendered code {
  background: rgba(127, 157, 185, 0.12);
}

body[data-theme="dark"] .response-output.rendered pre {
  background: rgba(255, 255, 255, 0.03);
  border-color: rgba(195, 213, 232, 0.08);
}

body[data-theme="dark"] .response-output.rendered blockquote {
  border-left-color: rgba(127, 157, 185, 0.34);
}

body[data-theme="dark"] .session-item.active {
  border-color: rgba(126, 157, 186, 0.22);
  box-shadow: inset 0 0 0 1px rgba(126, 157, 186, 0.1);
}

body[data-theme="dark"] .session-item.pinned {
  border-color: rgba(126, 157, 186, 0.18);
}

body[data-theme="dark"] .session-mini {
  background: rgba(255, 255, 255, 0.05);
  border-color: rgba(195, 213, 232, 0.08);
}

body[data-theme="dark"] .toast {
  background: rgba(17, 24, 33, 0.94);
  color: #e7f0f8;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.28);
}

/* Control System Unification */
input,
textarea {
  border-color: rgba(91, 115, 139, 0.12);
  background: rgba(255, 255, 255, 0.9);
  color: #17212b;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.88);
}

input::placeholder,
textarea::placeholder {
  color: rgba(97, 113, 129, 0.66);
}

.ghost-button,
.mini-button,
.template-tab,
.page-nav-button,
.records-mode-button,
.records-filter-button,
.delivery-mode-button,
.session-mini {
  border-color: rgba(91, 115, 139, 0.12);
  background: rgba(255, 255, 255, 0.72);
  color: #213244;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.82),
    0 2px 8px rgba(37, 55, 76, 0.025);
}

.ghost-button:hover,
.mini-button:hover,
.template-tab:hover,
.page-nav-button:hover,
.records-mode-button:hover,
.records-filter-button:hover,
.delivery-mode-button:hover,
.session-mini:hover {
  background: rgba(255, 255, 255, 0.9);
  border-color: rgba(91, 115, 139, 0.16);
  color: #17212b;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 6px 14px rgba(37, 55, 76, 0.05);
  transform: translateY(-1px);
}

.ghost-button:disabled,
.mini-button:disabled,
.template-tab:disabled,
.page-nav-button:disabled,
.records-mode-button:disabled,
.records-filter-button:disabled,
.delivery-mode-button:disabled,
.session-mini:disabled {
  opacity: 0.5;
  background: rgba(245, 248, 251, 0.72);
  border-color: rgba(91, 115, 139, 0.08);
  color: rgba(97, 113, 129, 0.72);
  box-shadow: none;
  transform: none;
}

.composer .template-tab,
.records-mode-button,
.records-filter-button,
.delivery-mode-button {
  font-weight: 650;
}

.send-preview summary,
.send-preview summary::after,
.records-filter-caption,
.field-meta {
  color: #66798d;
}

body[data-theme="dark"] input,
body[data-theme="dark"] textarea {
  border-color: rgba(195, 213, 232, 0.08);
  background: rgba(255, 255, 255, 0.045);
  color: #e6edf5;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
}

body[data-theme="dark"] input::placeholder,
body[data-theme="dark"] textarea::placeholder {
  color: rgba(158, 176, 192, 0.62);
}

body[data-theme="dark"] .ghost-button,
body[data-theme="dark"] .mini-button,
body[data-theme="dark"] .template-tab,
body[data-theme="dark"] .page-nav-button,
body[data-theme="dark"] .records-mode-button,
body[data-theme="dark"] .records-filter-button,
body[data-theme="dark"] .delivery-mode-button,
body[data-theme="dark"] .session-mini {
  border-color: rgba(195, 213, 232, 0.08);
  background: rgba(255, 255, 255, 0.045);
  color: #d6e2ed;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.03),
    0 2px 8px rgba(0, 0, 0, 0.12);
}

body[data-theme="dark"] .ghost-button:hover,
body[data-theme="dark"] .mini-button:hover,
body[data-theme="dark"] .template-tab:hover,
body[data-theme="dark"] .page-nav-button:hover,
body[data-theme="dark"] .records-mode-button:hover,
body[data-theme="dark"] .records-filter-button:hover,
body[data-theme="dark"] .delivery-mode-button:hover,
body[data-theme="dark"] .session-mini:hover {
  background: rgba(255, 255, 255, 0.075);
  border-color: rgba(195, 213, 232, 0.13);
  color: #eef5fb;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.04),
    0 8px 18px rgba(0, 0, 0, 0.16);
}

body[data-theme="dark"] .ghost-button:disabled,
body[data-theme="dark"] .mini-button:disabled,
body[data-theme="dark"] .template-tab:disabled,
body[data-theme="dark"] .page-nav-button:disabled,
body[data-theme="dark"] .records-mode-button:disabled,
body[data-theme="dark"] .records-filter-button:disabled,
body[data-theme="dark"] .delivery-mode-button:disabled,
body[data-theme="dark"] .session-mini:disabled {
  background: rgba(255, 255, 255, 0.028);
  border-color: rgba(195, 213, 232, 0.06);
  color: rgba(158, 176, 192, 0.56);
  box-shadow: none;
}

body[data-theme="dark"] .send-preview summary,
body[data-theme="dark"] .send-preview summary::after,
body[data-theme="dark"] .records-filter-caption,
body[data-theme="dark"] .field-meta {
  color: #92a6ba;
}

/* Input Tone Final Override */
input,
textarea,
.records-search-field input,
.composer .field input,
.composer .field textarea,
.send-preview textarea,
.system-preview,
#system-prompt {
  border-color: rgba(91, 115, 139, 0.14) !important;
  background: linear-gradient(180deg, rgba(252, 254, 255, 0.96) 0%, rgba(244, 249, 253, 0.92) 100%) !important;
  color: #17212b !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.94),
    0 1px 3px rgba(35, 53, 73, 0.035) !important;
}

input::placeholder,
textarea::placeholder,
.records-search-field input::placeholder,
.composer .field input::placeholder,
.composer .field textarea::placeholder,
.send-preview textarea::placeholder,
#system-prompt::placeholder {
  color: rgba(97, 113, 129, 0.62) !important;
}

input:focus,
textarea:focus,
.records-search-field input:focus,
.composer .field input:focus,
.composer .field textarea:focus,
.send-preview textarea:focus,
#system-prompt:focus {
  border-color: rgba(87, 114, 141, 0.34) !important;
  box-shadow:
    0 0 0 4px rgba(87, 114, 141, 0.11),
    inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
}

body[data-theme="dark"] input,
body[data-theme="dark"] textarea,
body[data-theme="dark"] .records-search-field input,
body[data-theme="dark"] .composer .field input,
body[data-theme="dark"] .composer .field textarea,
body[data-theme="dark"] .send-preview textarea,
body[data-theme="dark"] .system-preview,
body[data-theme="dark"] #system-prompt {
  border-color: rgba(195, 213, 232, 0.09) !important;
  background: linear-gradient(180deg, rgba(31, 43, 56, 0.96) 0%, rgba(23, 32, 42, 0.92) 100%) !important;
  color: #e6edf5 !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.03),
    0 1px 3px rgba(0, 0, 0, 0.16) !important;
}

body[data-theme="dark"] input::placeholder,
body[data-theme="dark"] textarea::placeholder,
body[data-theme="dark"] .records-search-field input::placeholder,
body[data-theme="dark"] .composer .field input::placeholder,
body[data-theme="dark"] .composer .field textarea::placeholder,
body[data-theme="dark"] .send-preview textarea::placeholder,
body[data-theme="dark"] #system-prompt::placeholder {
  color: rgba(158, 176, 192, 0.58) !important;
}

body[data-theme="dark"] input:focus,
body[data-theme="dark"] textarea:focus,
body[data-theme="dark"] .records-search-field input:focus,
body[data-theme="dark"] .composer .field input:focus,
body[data-theme="dark"] .composer .field textarea:focus,
body[data-theme="dark"] .send-preview textarea:focus,
body[data-theme="dark"] #system-prompt:focus {
  border-color: rgba(127, 157, 185, 0.28) !important;
  box-shadow:
    0 0 0 4px rgba(127, 157, 185, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
}

/* Elevated Graphite Grey Theme */
.glass {
  border-color: rgba(255, 255, 255, 0.5);
  box-shadow:
    0 22px 54px rgba(28, 34, 40, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.58);
}

.title-banner,
.sidebar,
.composer,
.response-card,
.response-card-history,
.response-card-conversation,
.response-card-prompt,
.sidebar .panel,
.tool-item,
.records-search-field,
.supplemental-fields,
.send-preview,
.composer .conversation-toolbar,
.followup-guidance {
  background:
    linear-gradient(180deg, rgba(251, 252, 253, 0.9) 0%, rgba(244, 246, 248, 0.78) 100%);
  border-color: rgba(58, 66, 74, 0.09);
  box-shadow:
    0 16px 38px rgba(28, 34, 40, 0.06),
    inset 0 1px 0 rgba(255, 255, 255, 0.72);
}

.response-card-answer {
  background:
    linear-gradient(180deg, rgba(252, 253, 254, 0.94) 0%, rgba(245, 247, 249, 0.86) 100%);
  border-color: rgba(58, 66, 74, 0.1);
  box-shadow:
    0 20px 48px rgba(28, 34, 40, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.78);
}

.response-output,
.system-preview,
.composer .field,
.history-item,
.history-block-surface,
.history-conversation-item {
  background: rgba(255, 255, 255, 0.72);
  border-color: rgba(58, 66, 74, 0.08);
}

.field-question-primary {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.94) 0%, rgba(246, 248, 250, 0.88) 100%);
  border-color: rgba(63, 74, 84, 0.12);
  box-shadow:
    0 10px 24px rgba(28, 34, 40, 0.04),
    inset 0 1px 0 rgba(255, 255, 255, 0.82);
}

.primary-button {
  background: linear-gradient(135deg, #626d78 0%, #3a434d 100%);
  border-color: rgba(47, 57, 67, 0.18);
  color: #f5f7f9;
  box-shadow:
    0 14px 28px rgba(28, 34, 40, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

.primary-button:hover {
  background: linear-gradient(135deg, #6c7783 0%, #424c56 100%);
  box-shadow:
    0 16px 32px rgba(28, 34, 40, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.14);
}

.primary-button.accent,
.mini-button-primary,
.history-actions .mini-button-primary,
.session-actions .session-pin-toggle,
.template-tab.active,
.delivery-mode-button.active,
.page-nav-button.active,
.records-mode-button.active,
.records-filter-button.active {
  background: linear-gradient(135deg, rgba(111, 122, 133, 0.16) 0%, rgba(69, 78, 88, 0.24) 100%);
  border-color: rgba(76, 86, 96, 0.18);
  color: #2e3842;
  box-shadow:
    0 8px 18px rgba(28, 34, 40, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.44);
}

.ghost-button,
.mini-button,
.template-tab,
.page-nav-button,
.records-mode-button,
.records-filter-button,
.delivery-mode-button,
.session-mini {
  background: rgba(255, 255, 255, 0.76);
  border-color: rgba(58, 66, 74, 0.1);
  color: #24303b;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.84),
    0 2px 8px rgba(28, 34, 40, 0.02);
}

.ghost-button:hover,
.mini-button:hover,
.template-tab:hover,
.page-nav-button:hover,
.records-mode-button:hover,
.records-filter-button:hover,
.delivery-mode-button:hover,
.session-mini:hover {
  background: rgba(255, 255, 255, 0.94);
  border-color: rgba(58, 66, 74, 0.14);
  color: #181d23;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.92),
    0 8px 16px rgba(28, 34, 40, 0.045);
}

.history-mode,
.history-state-pinned,
.status-pill,
.status-pill-save,
.session-pin {
  background: rgba(99, 109, 119, 0.12);
  color: #4c5864;
}

.history-state-session {
  background: rgba(94, 106, 118, 0.13);
  color: #566372;
}

.history-state-single {
  background: rgba(118, 126, 134, 0.13);
  color: #69727b;
}

.response-output.rendered h1,
.response-output.rendered h2,
.response-output.rendered h3,
.response-output.rendered h4,
.brand-block h1,
.title-banner h1,
.hero h2,
.panel-head h2 {
  color: #1f262d;
}

.title-copy,
.brand-copy,
.hero-copy,
.section-note,
.micro-copy,
.tool-desc,
.send-preview-copy,
.records-filter-caption,
.field-meta {
  color: #6d7680;
}

.response-output.rendered code {
  background: rgba(95, 107, 118, 0.1);
}

.response-output.rendered pre {
  background: rgba(35, 40, 46, 0.05);
  border-color: rgba(58, 66, 74, 0.08);
}

.response-output.rendered blockquote {
  border-left-color: rgba(95, 107, 118, 0.28);
}

.toast {
  background: rgba(27, 32, 38, 0.94);
  color: #edf1f5;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.24);
}

body[data-theme="dark"] .glass {
  border-color: rgba(255, 255, 255, 0.05);
  box-shadow:
    0 24px 56px rgba(0, 0, 0, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.02);
}

body[data-theme="dark"] .title-banner,
body[data-theme="dark"] .sidebar,
body[data-theme="dark"] .composer,
body[data-theme="dark"] .response-card,
body[data-theme="dark"] .response-card-history,
body[data-theme="dark"] .response-card-conversation,
body[data-theme="dark"] .response-card-prompt,
body[data-theme="dark"] .sidebar .panel,
body[data-theme="dark"] .tool-item,
body[data-theme="dark"] .records-search-field,
body[data-theme="dark"] .supplemental-fields,
body[data-theme="dark"] .send-preview,
body[data-theme="dark"] .composer .conversation-toolbar,
body[data-theme="dark"] .followup-guidance {
  background:
    linear-gradient(180deg, rgba(26, 30, 35, 0.9) 0%, rgba(19, 23, 27, 0.82) 100%);
  border-color: rgba(223, 229, 235, 0.06);
  box-shadow:
    0 18px 40px rgba(0, 0, 0, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.025);
}

body[data-theme="dark"] .response-card-answer {
  background:
    linear-gradient(180deg, rgba(28, 32, 37, 0.94) 0%, rgba(20, 24, 28, 0.88) 100%);
  border-color: rgba(223, 229, 235, 0.06);
  box-shadow:
    0 20px 46px rgba(0, 0, 0, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.03);
}

body[data-theme="dark"] .response-output,
body[data-theme="dark"] .system-preview,
body[data-theme="dark"] .composer .field,
body[data-theme="dark"] .history-item,
body[data-theme="dark"] .history-block-surface,
body[data-theme="dark"] .history-conversation-item {
  background: rgba(255, 255, 255, 0.035);
  border-color: rgba(223, 229, 235, 0.06);
}

body[data-theme="dark"] .field-question-primary {
  background:
    linear-gradient(180deg, rgba(31, 35, 40, 0.92) 0%, rgba(23, 27, 31, 0.88) 100%);
  border-color: rgba(223, 229, 235, 0.07);
}

body[data-theme="dark"] .primary-button {
  background: linear-gradient(135deg, #7a858f 0%, #525c66 100%);
  border-color: rgba(213, 221, 229, 0.08);
  color: #f6f8fa;
}

body[data-theme="dark"] .primary-button.accent,
body[data-theme="dark"] .mini-button-primary,
body[data-theme="dark"] .history-actions .mini-button-primary,
body[data-theme="dark"] .session-actions .session-pin-toggle,
body[data-theme="dark"] .template-tab.active,
body[data-theme="dark"] .delivery-mode-button.active,
body[data-theme="dark"] .page-nav-button.active,
body[data-theme="dark"] .records-mode-button.active,
body[data-theme="dark"] .records-filter-button.active {
  background: linear-gradient(135deg, rgba(132, 142, 152, 0.22) 0%, rgba(82, 91, 101, 0.34) 100%);
  border-color: rgba(213, 221, 229, 0.09);
  color: #e5ebf1;
}

body[data-theme="dark"] .ghost-button,
body[data-theme="dark"] .mini-button,
body[data-theme="dark"] .template-tab,
body[data-theme="dark"] .page-nav-button,
body[data-theme="dark"] .records-mode-button,
body[data-theme="dark"] .records-filter-button,
body[data-theme="dark"] .delivery-mode-button,
body[data-theme="dark"] .session-mini {
  background: rgba(255, 255, 255, 0.05);
  border-color: rgba(223, 229, 235, 0.06);
  color: #d9e0e6;
}

body[data-theme="dark"] .ghost-button:hover,
body[data-theme="dark"] .mini-button:hover,
body[data-theme="dark"] .template-tab:hover,
body[data-theme="dark"] .page-nav-button:hover,
body[data-theme="dark"] .records-mode-button:hover,
body[data-theme="dark"] .records-filter-button:hover,
body[data-theme="dark"] .delivery-mode-button:hover,
body[data-theme="dark"] .session-mini:hover {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(223, 229, 235, 0.1);
  color: #f1f5f8;
}

body[data-theme="dark"] .history-mode,
body[data-theme="dark"] .history-state-pinned,
body[data-theme="dark"] .status-pill,
body[data-theme="dark"] .status-pill-save,
body[data-theme="dark"] .session-pin {
  background: rgba(146, 156, 166, 0.14);
  color: #c8d1d9;
}

body[data-theme="dark"] .history-state-session {
  background: rgba(132, 142, 152, 0.16);
  color: #c0c9d2;
}

body[data-theme="dark"] .history-state-single {
  background: rgba(118, 126, 134, 0.16);
  color: #b4bcc4;
}

body[data-theme="dark"] .response-output.rendered h1,
body[data-theme="dark"] .response-output.rendered h2,
body[data-theme="dark"] .response-output.rendered h3,
body[data-theme="dark"] .response-output.rendered h4,
body[data-theme="dark"] .brand-block h1,
body[data-theme="dark"] .title-banner h1,
body[data-theme="dark"] .hero h2,
body[data-theme="dark"] .panel-head h2 {
  color: #e3e9ef;
}

body[data-theme="dark"] .title-copy,
body[data-theme="dark"] .brand-copy,
body[data-theme="dark"] .hero-copy,
body[data-theme="dark"] .section-note,
body[data-theme="dark"] .micro-copy,
body[data-theme="dark"] .tool-desc,
body[data-theme="dark"] .send-preview-copy,
body[data-theme="dark"] .records-filter-caption,
body[data-theme="dark"] .field-meta {
  color: #9ca6af;
}

/* Apple Silver Professional Refinement */
:root {
  --radius-xl: 30px;
  --radius-lg: 22px;
  --radius-md: 16px;
}

body {
  letter-spacing: 0.002em;
}

.brand-block h1,
.hero h2,
.panel-head h2,
.title-banner h1,
.response-output.rendered h1,
.response-output.rendered h2,
.response-output.rendered h3,
.response-output.rendered h4 {
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "PingFang SC", "Hiragino Sans GB", "Noto Sans SC", sans-serif;
  letter-spacing: -0.045em;
}

.glass {
  background: rgba(252, 253, 254, 0.7);
  border-color: rgba(255, 255, 255, 0.72);
  box-shadow:
    0 18px 44px rgba(15, 23, 31, 0.07),
    0 2px 6px rgba(15, 23, 31, 0.03),
    inset 0 1px 0 rgba(255, 255, 255, 0.88);
  backdrop-filter: blur(26px) saturate(135%);
  -webkit-backdrop-filter: blur(26px) saturate(135%);
}

.title-banner,
.sidebar,
.composer,
.response-card,
.response-card-history,
.response-card-conversation,
.response-card-prompt,
.sidebar .panel,
.tool-item,
.records-search-field,
.supplemental-fields,
.send-preview,
.composer .conversation-toolbar,
.followup-guidance {
  background: linear-gradient(180deg, rgba(252, 253, 254, 0.82) 0%, rgba(246, 248, 250, 0.74) 100%);
  border-color: rgba(43, 51, 59, 0.075);
  box-shadow:
    0 14px 34px rgba(15, 23, 31, 0.05),
    0 2px 8px rgba(15, 23, 31, 0.018),
    inset 0 1px 0 rgba(255, 255, 255, 0.84);
}

.response-card-answer {
  background: linear-gradient(180deg, rgba(253, 254, 255, 0.9) 0%, rgba(247, 249, 251, 0.82) 100%);
  border-color: rgba(43, 51, 59, 0.08);
  box-shadow:
    0 16px 40px rgba(15, 23, 31, 0.055),
    0 2px 8px rgba(15, 23, 31, 0.02),
    inset 0 1px 0 rgba(255, 255, 255, 0.88);
}

.response-output,
.system-preview,
.composer .field,
.history-item,
.history-block-surface,
.history-conversation-item {
  background: rgba(255, 255, 255, 0.62);
  border-color: rgba(43, 51, 59, 0.07);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72);
}

.field-question-primary {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.94) 0%, rgba(248, 250, 252, 0.88) 100%);
  border-color: rgba(54, 64, 74, 0.1);
  box-shadow:
    0 10px 24px rgba(15, 23, 31, 0.03),
    inset 0 1px 0 rgba(255, 255, 255, 0.92);
}

input,
textarea,
.records-search-field input,
.composer .field input,
.composer .field textarea,
.send-preview textarea,
.system-preview,
#system-prompt {
  border-color: rgba(43, 51, 59, 0.1) !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.94) 0%, rgba(247, 249, 251, 0.92) 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.96),
    0 1px 2px rgba(15, 23, 31, 0.025) !important;
}

input:focus,
textarea:focus,
.records-search-field input:focus,
.composer .field input:focus,
.composer .field textarea:focus,
.send-preview textarea:focus,
#system-prompt:focus {
  border-color: rgba(88, 99, 110, 0.26) !important;
  box-shadow:
    0 0 0 4px rgba(118, 128, 138, 0.09),
    inset 0 1px 0 rgba(255, 255, 255, 0.98) !important;
}

.ghost-button,
.mini-button,
.template-tab,
.page-nav-button,
.records-mode-button,
.records-filter-button,
.delivery-mode-button,
.session-mini {
  background: rgba(255, 255, 255, 0.72);
  border-color: rgba(43, 51, 59, 0.085);
  color: #26323d;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.88),
    0 1px 3px rgba(15, 23, 31, 0.02);
}

.ghost-button:hover,
.mini-button:hover,
.template-tab:hover,
.page-nav-button:hover,
.records-mode-button:hover,
.records-filter-button:hover,
.delivery-mode-button:hover,
.session-mini:hover {
  background: rgba(255, 255, 255, 0.94);
  border-color: rgba(43, 51, 59, 0.11);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.92),
    0 8px 18px rgba(15, 23, 31, 0.035);
}

.primary-button {
  background: linear-gradient(180deg, #6d7781 0%, #505861 100%);
  border-color: rgba(53, 61, 69, 0.14);
  box-shadow:
    0 10px 24px rgba(15, 23, 31, 0.14),
    inset 0 1px 0 rgba(255, 255, 255, 0.14);
}

.primary-button:hover {
  background: linear-gradient(180deg, #77818b 0%, #58616a 100%);
  box-shadow:
    0 12px 28px rgba(15, 23, 31, 0.16),
    inset 0 1px 0 rgba(255, 255, 255, 0.16);
}

.primary-button.accent,
.mini-button-primary,
.history-actions .mini-button-primary,
.session-actions .session-pin-toggle,
.template-tab.active,
.delivery-mode-button.active,
.page-nav-button.active,
.records-mode-button.active,
.records-filter-button.active {
  background: linear-gradient(180deg, rgba(113, 123, 133, 0.16) 0%, rgba(82, 92, 102, 0.22) 100%);
  border-color: rgba(53, 61, 69, 0.12);
  color: #2d3843;
  box-shadow:
    0 8px 16px rgba(15, 23, 31, 0.045),
    inset 0 1px 0 rgba(255, 255, 255, 0.5);
}

.history-mode,
.history-state-pinned,
.status-pill,
.status-pill-save,
.session-pin {
  background: rgba(107, 117, 127, 0.11);
  color: #525f6b;
}

.history-state-session {
  background: rgba(94, 105, 115, 0.12);
  color: #586674;
}

.history-state-single {
  background: rgba(120, 127, 135, 0.11);
  color: #6c757d;
}

.title-copy,
.brand-copy,
.hero-copy,
.section-note,
.micro-copy,
.tool-desc,
.send-preview-copy,
.records-filter-caption,
.field-meta,
.answer-note {
  color: #707983;
}

.eyebrow,
.history-conversation-role,
.panel-kicker {
  color: #6b7782;
}

.response-output.rendered code {
  background: rgba(102, 112, 122, 0.09);
}

.response-output.rendered pre {
  background: rgba(38, 43, 48, 0.045);
  border-color: rgba(43, 51, 59, 0.07);
}

.response-output.rendered blockquote {
  border-left-color: rgba(92, 101, 110, 0.24);
}

body[data-theme="dark"] .glass {
  background: rgba(23, 27, 31, 0.74);
  border-color: rgba(255, 255, 255, 0.045);
  box-shadow:
    0 20px 48px rgba(0, 0, 0, 0.26),
    0 2px 8px rgba(0, 0, 0, 0.14),
    inset 0 1px 0 rgba(255, 255, 255, 0.03);
  backdrop-filter: blur(28px) saturate(125%);
  -webkit-backdrop-filter: blur(28px) saturate(125%);
}

body[data-theme="dark"] .title-banner,
body[data-theme="dark"] .sidebar,
body[data-theme="dark"] .composer,
body[data-theme="dark"] .response-card,
body[data-theme="dark"] .response-card-history,
body[data-theme="dark"] .response-card-conversation,
body[data-theme="dark"] .response-card-prompt,
body[data-theme="dark"] .sidebar .panel,
body[data-theme="dark"] .tool-item,
body[data-theme="dark"] .records-search-field,
body[data-theme="dark"] .supplemental-fields,
body[data-theme="dark"] .send-preview,
body[data-theme="dark"] .composer .conversation-toolbar,
body[data-theme="dark"] .followup-guidance {
  background: linear-gradient(180deg, rgba(28, 32, 36, 0.88) 0%, rgba(20, 24, 28, 0.82) 100%);
  border-color: rgba(226, 232, 238, 0.05);
  box-shadow:
    0 16px 38px rgba(0, 0, 0, 0.2),
    0 2px 8px rgba(0, 0, 0, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.025);
}

body[data-theme="dark"] .response-card-answer {
  background: linear-gradient(180deg, rgba(31, 35, 39, 0.92) 0%, rgba(22, 26, 30, 0.88) 100%);
  border-color: rgba(226, 232, 238, 0.05);
  box-shadow:
    0 18px 42px rgba(0, 0, 0, 0.24),
    0 2px 8px rgba(0, 0, 0, 0.14),
    inset 0 1px 0 rgba(255, 255, 255, 0.03);
}

body[data-theme="dark"] .response-output,
body[data-theme="dark"] .system-preview,
body[data-theme="dark"] .composer .field,
body[data-theme="dark"] .history-item,
body[data-theme="dark"] .history-block-surface,
body[data-theme="dark"] .history-conversation-item {
  background: rgba(255, 255, 255, 0.032);
  border-color: rgba(226, 232, 238, 0.052);
}

body[data-theme="dark"] input,
body[data-theme="dark"] textarea,
body[data-theme="dark"] .records-search-field input,
body[data-theme="dark"] .composer .field input,
body[data-theme="dark"] .composer .field textarea,
body[data-theme="dark"] .send-preview textarea,
body[data-theme="dark"] .system-preview,
body[data-theme="dark"] #system-prompt {
  border-color: rgba(226, 232, 238, 0.06) !important;
  background: linear-gradient(180deg, rgba(34, 39, 44, 0.94) 0%, rgba(25, 29, 33, 0.92) 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.028),
    0 1px 2px rgba(0, 0, 0, 0.14) !important;
}

body[data-theme="dark"] input:focus,
body[data-theme="dark"] textarea:focus,
body[data-theme="dark"] .records-search-field input:focus,
body[data-theme="dark"] .composer .field input:focus,
body[data-theme="dark"] .composer .field textarea:focus,
body[data-theme="dark"] .send-preview textarea:focus,
body[data-theme="dark"] #system-prompt:focus {
  border-color: rgba(170, 179, 188, 0.18) !important;
  box-shadow:
    0 0 0 4px rgba(146, 155, 164, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.035) !important;
}

body[data-theme="dark"] .ghost-button,
body[data-theme="dark"] .mini-button,
body[data-theme="dark"] .template-tab,
body[data-theme="dark"] .page-nav-button,
body[data-theme="dark"] .records-mode-button,
body[data-theme="dark"] .records-filter-button,
body[data-theme="dark"] .delivery-mode-button,
body[data-theme="dark"] .session-mini {
  background: rgba(255, 255, 255, 0.048);
  border-color: rgba(226, 232, 238, 0.055);
  color: #d7dee5;
}

body[data-theme="dark"] .ghost-button:hover,
body[data-theme="dark"] .mini-button:hover,
body[data-theme="dark"] .template-tab:hover,
body[data-theme="dark"] .page-nav-button:hover,
body[data-theme="dark"] .records-mode-button:hover,
body[data-theme="dark"] .records-filter-button:hover,
body[data-theme="dark"] .delivery-mode-button:hover,
body[data-theme="dark"] .session-mini:hover {
  background: rgba(255, 255, 255, 0.075);
  border-color: rgba(226, 232, 238, 0.085);
  color: #eef3f7;
}

body[data-theme="dark"] .primary-button {
  background: linear-gradient(180deg, #868f98 0%, #606872 100%);
}

body[data-theme="dark"] .primary-button.accent,
body[data-theme="dark"] .mini-button-primary,
body[data-theme="dark"] .history-actions .mini-button-primary,
body[data-theme="dark"] .session-actions .session-pin-toggle,
body[data-theme="dark"] .template-tab.active,
body[data-theme="dark"] .delivery-mode-button.active,
body[data-theme="dark"] .page-nav-button.active,
body[data-theme="dark"] .records-mode-button.active,
body[data-theme="dark"] .records-filter-button.active {
  background: linear-gradient(180deg, rgba(143, 151, 160, 0.18) 0%, rgba(97, 106, 115, 0.28) 100%);
  color: #e6ecf2;
}

body[data-theme="dark"] .history-mode,
body[data-theme="dark"] .history-state-pinned,
body[data-theme="dark"] .status-pill,
body[data-theme="dark"] .status-pill-save,
body[data-theme="dark"] .session-pin {
  background: rgba(141, 149, 158, 0.14);
  color: #c8d0d8;
}

body[data-theme="dark"] .history-state-session {
  background: rgba(130, 138, 147, 0.14);
  color: #c0c8d0;
}

body[data-theme="dark"] .history-state-single {
  background: rgba(116, 123, 131, 0.14);
  color: #b5bcc4;
}

/* Deeper Apple Silver Final Pass */
.glass {
  background: rgba(241, 244, 247, 0.78);
  box-shadow:
    0 20px 46px rgba(12, 18, 24, 0.1),
    0 2px 8px rgba(12, 18, 24, 0.04),
    inset 0 1px 0 rgba(255, 255, 255, 0.82);
}

.title-banner,
.sidebar,
.composer,
.response-card,
.response-card-history,
.response-card-conversation,
.response-card-prompt,
.sidebar .panel,
.tool-item,
.records-search-field,
.supplemental-fields,
.send-preview,
.composer .conversation-toolbar,
.followup-guidance {
  background: linear-gradient(180deg, rgba(241, 244, 247, 0.9) 0%, rgba(232, 237, 242, 0.84) 100%);
  border-color: rgba(39, 47, 55, 0.1);
  box-shadow:
    0 16px 36px rgba(12, 18, 24, 0.07),
    0 2px 8px rgba(12, 18, 24, 0.03),
    inset 0 1px 0 rgba(255, 255, 255, 0.8);
}

.response-card-answer {
  background: linear-gradient(180deg, rgba(238, 242, 246, 0.94) 0%, rgba(228, 234, 239, 0.88) 100%);
  border-color: rgba(39, 47, 55, 0.11);
  box-shadow:
    0 18px 40px rgba(12, 18, 24, 0.08),
    0 2px 10px rgba(12, 18, 24, 0.035),
    inset 0 1px 0 rgba(255, 255, 255, 0.84);
}

.response-output,
.system-preview,
.composer .field,
.history-item,
.history-block-surface,
.history-conversation-item {
  background: rgba(244, 247, 250, 0.8);
  border-color: rgba(39, 47, 55, 0.09);
}

input,
textarea,
.records-search-field input,
.composer .field input,
.composer .field textarea,
.send-preview textarea,
.system-preview,
#system-prompt {
  background: linear-gradient(180deg, rgba(243, 247, 250, 0.98) 0%, rgba(234, 239, 243, 0.96) 100%) !important;
  border-color: rgba(39, 47, 55, 0.11) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.92),
    0 1px 3px rgba(12, 18, 24, 0.03) !important;
}

.ghost-button,
.mini-button,
.template-tab,
.page-nav-button,
.records-mode-button,
.records-filter-button,
.delivery-mode-button,
.session-mini {
  background: rgba(243, 246, 249, 0.86);
  border-color: rgba(39, 47, 55, 0.11);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.86),
    0 1px 3px rgba(12, 18, 24, 0.028);
}

.ghost-button:hover,
.mini-button:hover,
.template-tab:hover,
.page-nav-button:hover,
.records-mode-button:hover,
.records-filter-button:hover,
.delivery-mode-button:hover,
.session-mini:hover {
  background: rgba(248, 250, 252, 0.96);
  border-color: rgba(39, 47, 55, 0.14);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.92),
    0 8px 16px rgba(12, 18, 24, 0.05);
}

.primary-button {
  background: linear-gradient(180deg, #5f6973 0%, #424a53 100%);
  border-color: rgba(39, 47, 55, 0.18);
  box-shadow:
    0 12px 26px rgba(12, 18, 24, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

.primary-button:hover {
  background: linear-gradient(180deg, #69737d 0%, #4a535c 100%);
  box-shadow:
    0 14px 30px rgba(12, 18, 24, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.14);
}

.primary-button.accent,
.mini-button-primary,
.history-actions .mini-button-primary,
.session-actions .session-pin-toggle,
.template-tab.active,
.delivery-mode-button.active,
.page-nav-button.active,
.records-mode-button.active,
.records-filter-button.active {
  background: linear-gradient(180deg, rgba(97, 108, 118, 0.2) 0%, rgba(67, 76, 85, 0.28) 100%);
  border-color: rgba(39, 47, 55, 0.16);
  box-shadow:
    0 8px 18px rgba(12, 18, 24, 0.07),
    inset 0 1px 0 rgba(255, 255, 255, 0.46);
}

body[data-theme="dark"] .glass {
  background: rgba(17, 21, 25, 0.82);
  box-shadow:
    0 22px 52px rgba(0, 0, 0, 0.32),
    0 2px 8px rgba(0, 0, 0, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.028);
}

body[data-theme="dark"] .title-banner,
body[data-theme="dark"] .sidebar,
body[data-theme="dark"] .composer,
body[data-theme="dark"] .response-card,
body[data-theme="dark"] .response-card-history,
body[data-theme="dark"] .response-card-conversation,
body[data-theme="dark"] .response-card-prompt,
body[data-theme="dark"] .sidebar .panel,
body[data-theme="dark"] .tool-item,
body[data-theme="dark"] .records-search-field,
body[data-theme="dark"] .supplemental-fields,
body[data-theme="dark"] .send-preview,
body[data-theme="dark"] .composer .conversation-toolbar,
body[data-theme="dark"] .followup-guidance {
  background: linear-gradient(180deg, rgba(18, 22, 26, 0.92) 0%, rgba(12, 16, 20, 0.88) 100%);
  border-color: rgba(226, 232, 238, 0.055);
  box-shadow:
    0 18px 42px rgba(0, 0, 0, 0.26),
    0 2px 8px rgba(0, 0, 0, 0.16),
    inset 0 1px 0 rgba(255, 255, 255, 0.022);
}

body[data-theme="dark"] .response-card-answer {
  background: linear-gradient(180deg, rgba(21, 25, 29, 0.95) 0%, rgba(13, 17, 21, 0.92) 100%);
  box-shadow:
    0 20px 46px rgba(0, 0, 0, 0.3),
    0 2px 10px rgba(0, 0, 0, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.024);
}

body[data-theme="dark"] .response-output,
body[data-theme="dark"] .system-preview,
body[data-theme="dark"] .composer .field,
body[data-theme="dark"] .history-item,
body[data-theme="dark"] .history-block-surface,
body[data-theme="dark"] .history-conversation-item {
  background: rgba(255, 255, 255, 0.024);
}

body[data-theme="dark"] input,
body[data-theme="dark"] textarea,
body[data-theme="dark"] .records-search-field input,
body[data-theme="dark"] .composer .field input,
body[data-theme="dark"] .composer .field textarea,
body[data-theme="dark"] .send-preview textarea,
body[data-theme="dark"] .system-preview,
body[data-theme="dark"] #system-prompt {
  background: linear-gradient(180deg, rgba(28, 33, 38, 0.97) 0%, rgba(18, 22, 26, 0.95) 100%) !important;
  border-color: rgba(226, 232, 238, 0.065) !important;
}

body[data-theme="dark"] .ghost-button,
body[data-theme="dark"] .mini-button,
body[data-theme="dark"] .template-tab,
body[data-theme="dark"] .page-nav-button,
body[data-theme="dark"] .records-mode-button,
body[data-theme="dark"] .records-filter-button,
body[data-theme="dark"] .delivery-mode-button,
body[data-theme="dark"] .session-mini {
  background: rgba(255, 255, 255, 0.038);
  border-color: rgba(226, 232, 238, 0.06);
}

body[data-theme="dark"] .ghost-button:hover,
body[data-theme="dark"] .mini-button:hover,
body[data-theme="dark"] .template-tab:hover,
body[data-theme="dark"] .page-nav-button:hover,
body[data-theme="dark"] .records-mode-button:hover,
body[data-theme="dark"] .records-filter-button:hover,
body[data-theme="dark"] .delivery-mode-button:hover,
body[data-theme="dark"] .session-mini:hover {
  background: rgba(255, 255, 255, 0.058);
  border-color: rgba(226, 232, 238, 0.082);
}

body[data-theme="dark"] .primary-button {
  background: linear-gradient(180deg, #747e88 0%, #4f5861 100%);
}

body[data-theme="dark"] .primary-button.accent,
body[data-theme="dark"] .mini-button-primary,
body[data-theme="dark"] .history-actions .mini-button-primary,
body[data-theme="dark"] .session-actions .session-pin-toggle,
body[data-theme="dark"] .template-tab.active,
body[data-theme="dark"] .delivery-mode-button.active,
body[data-theme="dark"] .page-nav-button.active,
body[data-theme="dark"] .records-mode-button.active,
body[data-theme="dark"] .records-filter-button.active {
  background: linear-gradient(180deg, rgba(123, 132, 141, 0.18) 0%, rgba(81, 90, 99, 0.3) 100%);
}

/* Deeper Contrast Pass */
.title-banner h1,
.brand-block h1,
.hero h2,
.panel-head h2,
.response-card-answer .panel-head h2 {
  color: #161c22;
}

.title-copy,
.brand-copy,
.hero-copy,
.section-note,
.micro-copy,
.tool-desc,
.send-preview-copy,
.records-filter-caption,
.field-meta,
.answer-note {
  color: #646d76;
}

.history-item,
.history-block-surface,
.history-conversation-item {
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.74),
    0 6px 16px rgba(12, 18, 24, 0.035);
}

.history-item.pinned {
  background: linear-gradient(180deg, rgba(237, 241, 245, 0.92) 0%, rgba(228, 233, 238, 0.86) 100%);
  border-color: rgba(39, 47, 55, 0.12);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.78),
    0 10px 24px rgba(12, 18, 24, 0.06);
}

.history-mode,
.history-state-pinned,
.status-pill,
.status-pill-save,
.session-pin {
  background: rgba(88, 97, 106, 0.13);
  color: #4b5661;
}

.history-state-session {
  background: rgba(77, 87, 96, 0.14);
  color: #515e6b;
}

.history-state-single {
  background: rgba(103, 111, 118, 0.13);
  color: #646c74;
}

.page-switcher-nav {
  background: rgba(238, 242, 245, 0.78);
  border-color: rgba(39, 47, 55, 0.08);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.8),
    0 8px 18px rgba(12, 18, 24, 0.035);
}

.records-search-field,
.tool-item {
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.78),
    0 10px 22px rgba(12, 18, 24, 0.04);
}

body[data-theme="dark"] .title-banner h1,
body[data-theme="dark"] .brand-block h1,
body[data-theme="dark"] .hero h2,
body[data-theme="dark"] .panel-head h2,
body[data-theme="dark"] .response-card-answer .panel-head h2 {
  color: #edf2f6;
}

body[data-theme="dark"] .title-copy,
body[data-theme="dark"] .brand-copy,
body[data-theme="dark"] .hero-copy,
body[data-theme="dark"] .section-note,
body[data-theme="dark"] .micro-copy,
body[data-theme="dark"] .tool-desc,
body[data-theme="dark"] .send-preview-copy,
body[data-theme="dark"] .records-filter-caption,
body[data-theme="dark"] .field-meta,
body[data-theme="dark"] .answer-note {
  color: #98a1aa;
}

body[data-theme="dark"] .history-item,
body[data-theme="dark"] .history-block-surface,
body[data-theme="dark"] .history-conversation-item {
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.028),
    0 8px 18px rgba(0, 0, 0, 0.16);
}

body[data-theme="dark"] .history-item.pinned {
  background: linear-gradient(180deg, rgba(25, 30, 35, 0.94) 0%, rgba(17, 21, 25, 0.9) 100%);
  border-color: rgba(226, 232, 238, 0.07);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.03),
    0 12px 28px rgba(0, 0, 0, 0.22);
}

body[data-theme="dark"] .history-mode,
body[data-theme="dark"] .history-state-pinned,
body[data-theme="dark"] .status-pill,
body[data-theme="dark"] .status-pill-save,
body[data-theme="dark"] .session-pin {
  background: rgba(131, 139, 147, 0.15);
  color: #d0d7de;
}

body[data-theme="dark"] .history-state-session {
  background: rgba(120, 128, 137, 0.16);
  color: #c6cdd4;
}

body[data-theme="dark"] .history-state-single {
  background: rgba(108, 115, 123, 0.16);
  color: #b7bec5;
}

body[data-theme="dark"] .page-switcher-nav {
  background: rgba(255, 255, 255, 0.032);
  border-color: rgba(226, 232, 238, 0.05);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.026),
    0 10px 20px rgba(0, 0, 0, 0.16);
}

/* DISCERN Balance Pass */
.glass {
  background: rgba(244, 247, 250, 0.66);
  border-color: rgba(255, 255, 255, 0.74);
  box-shadow:
    0 20px 48px rgba(12, 18, 24, 0.085),
    0 2px 8px rgba(12, 18, 24, 0.03),
    inset 0 1px 0 rgba(255, 255, 255, 0.9);
  backdrop-filter: blur(30px) saturate(128%);
  -webkit-backdrop-filter: blur(30px) saturate(128%);
}

.title-banner,
.sidebar,
.composer,
.response-card,
.response-card-history,
.response-card-conversation,
.response-card-prompt,
.sidebar .panel,
.tool-item,
.records-search-field,
.supplemental-fields,
.send-preview,
.composer .conversation-toolbar,
.followup-guidance {
  background: linear-gradient(180deg, rgba(244, 247, 250, 0.78) 0%, rgba(233, 238, 243, 0.68) 100%);
  box-shadow:
    0 16px 38px rgba(12, 18, 24, 0.055),
    0 2px 8px rgba(12, 18, 24, 0.024),
    inset 0 1px 0 rgba(255, 255, 255, 0.88);
}

.response-card-answer {
  background: linear-gradient(180deg, rgba(240, 244, 248, 0.84) 0%, rgba(229, 235, 240, 0.76) 100%);
  box-shadow:
    0 18px 42px rgba(12, 18, 24, 0.065),
    0 2px 10px rgba(12, 18, 24, 0.03),
    inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.response-output,
.system-preview,
.composer .field,
.history-item,
.history-block-surface,
.history-conversation-item {
  background: rgba(248, 251, 253, 0.64);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.78),
    0 6px 16px rgba(12, 18, 24, 0.026);
}

.history-item.pinned {
  background: linear-gradient(180deg, rgba(236, 241, 245, 0.86) 0%, rgba(226, 232, 237, 0.8) 100%);
}

input,
textarea,
.records-search-field input,
.composer .field input,
.composer .field textarea,
.send-preview textarea,
.system-preview,
#system-prompt {
  background: linear-gradient(180deg, rgba(247, 250, 252, 0.9) 0%, rgba(238, 243, 247, 0.86) 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.94),
    0 1px 3px rgba(12, 18, 24, 0.022) !important;
}

.ghost-button,
.mini-button,
.template-tab,
.page-nav-button,
.records-mode-button,
.records-filter-button,
.delivery-mode-button,
.session-mini {
  background: rgba(246, 249, 252, 0.74);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 3px rgba(12, 18, 24, 0.022);
}

.ghost-button:hover,
.mini-button:hover,
.template-tab:hover,
.page-nav-button:hover,
.records-mode-button:hover,
.records-filter-button:hover,
.delivery-mode-button:hover,
.session-mini:hover {
  background: rgba(251, 253, 254, 0.9);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.94),
    0 8px 18px rgba(12, 18, 24, 0.04);
}

.page-switcher-nav {
  background: rgba(240, 244, 247, 0.72);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.84),
    0 10px 22px rgba(12, 18, 24, 0.032);
}

body[data-theme="dark"] .glass {
  background: rgba(18, 22, 26, 0.68);
  border-color: rgba(255, 255, 255, 0.06);
  box-shadow:
    0 22px 54px rgba(0, 0, 0, 0.28),
    0 2px 8px rgba(0, 0, 0, 0.14),
    inset 0 1px 0 rgba(255, 255, 255, 0.045);
  backdrop-filter: blur(32px) saturate(122%);
  -webkit-backdrop-filter: blur(32px) saturate(122%);
}

body[data-theme="dark"] .title-banner,
body[data-theme="dark"] .sidebar,
body[data-theme="dark"] .composer,
body[data-theme="dark"] .response-card,
body[data-theme="dark"] .response-card-history,
body[data-theme="dark"] .response-card-conversation,
body[data-theme="dark"] .response-card-prompt,
body[data-theme="dark"] .sidebar .panel,
body[data-theme="dark"] .tool-item,
body[data-theme="dark"] .records-search-field,
body[data-theme="dark"] .supplemental-fields,
body[data-theme="dark"] .send-preview,
body[data-theme="dark"] .composer .conversation-toolbar,
body[data-theme="dark"] .followup-guidance {
  background: linear-gradient(180deg, rgba(20, 24, 28, 0.8) 0%, rgba(12, 16, 20, 0.74) 100%);
  box-shadow:
    0 18px 42px rgba(0, 0, 0, 0.22),
    0 2px 8px rgba(0, 0, 0, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.038);
}

body[data-theme="dark"] .response-card-answer {
  background: linear-gradient(180deg, rgba(22, 26, 30, 0.84) 0%, rgba(13, 17, 21, 0.78) 100%);
  box-shadow:
    0 20px 46px rgba(0, 0, 0, 0.26),
    0 2px 10px rgba(0, 0, 0, 0.15),
    inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

body[data-theme="dark"] .response-output,
body[data-theme="dark"] .system-preview,
body[data-theme="dark"] .composer .field,
body[data-theme="dark"] .history-item,
body[data-theme="dark"] .history-block-surface,
body[data-theme="dark"] .history-conversation-item {
  background: rgba(255, 255, 255, 0.036);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.032),
    0 8px 18px rgba(0, 0, 0, 0.14);
}

body[data-theme="dark"] .history-item.pinned {
  background: linear-gradient(180deg, rgba(26, 31, 36, 0.86) 0%, rgba(17, 22, 27, 0.8) 100%);
}

body[data-theme="dark"] input,
body[data-theme="dark"] textarea,
body[data-theme="dark"] .records-search-field input,
body[data-theme="dark"] .composer .field input,
body[data-theme="dark"] .composer .field textarea,
body[data-theme="dark"] .send-preview textarea,
body[data-theme="dark"] .system-preview,
body[data-theme="dark"] #system-prompt {
  background: linear-gradient(180deg, rgba(31, 36, 41, 0.9) 0%, rgba(20, 24, 28, 0.86) 100%) !important;
}

body[data-theme="dark"] .ghost-button,
body[data-theme="dark"] .mini-button,
body[data-theme="dark"] .template-tab,
body[data-theme="dark"] .page-nav-button,
body[data-theme="dark"] .records-mode-button,
body[data-theme="dark"] .records-filter-button,
body[data-theme="dark"] .delivery-mode-button,
body[data-theme="dark"] .session-mini {
  background: rgba(255, 255, 255, 0.05);
}

body[data-theme="dark"] .ghost-button:hover,
body[data-theme="dark"] .mini-button:hover,
body[data-theme="dark"] .template-tab:hover,
body[data-theme="dark"] .page-nav-button:hover,
body[data-theme="dark"] .records-mode-button:hover,
body[data-theme="dark"] .records-filter-button:hover,
body[data-theme="dark"] .delivery-mode-button:hover,
body[data-theme="dark"] .session-mini:hover {
  background: rgba(255, 255, 255, 0.072);
}

body[data-theme="dark"] .page-switcher-nav {
  background: rgba(255, 255, 255, 0.04);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.034),
    0 10px 22px rgba(0, 0, 0, 0.14);
}

/* Answer Stage Layout Final */
.answer-stage-head {
  display: grid;
  gap: 6px;
  margin: 2px 0 14px;
}

.answer-kicker {
  margin: 0;
}

.answer-note {
  margin: 0;
  font-size: 0.88rem;
  line-height: 1.56;
}

.response-card-answer .response-output {
  padding: 26px 24px 24px;
  border-radius: 24px;
}

.response-card-answer .response-output.rendered > p:first-of-type {
  margin-top: 0;
  font-size: 1.12rem;
  line-height: 1.78;
  color: #1e2831;
}

.response-card-answer .response-output.rendered > p:first-of-type strong {
  font-weight: 800;
}

.response-card-answer .response-output.rendered > p:first-of-type + p {
  margin-top: 1.05em;
}

body[data-theme="dark"] .response-card-answer .response-output.rendered > p:first-of-type {
  color: #eef3f7;
}

body[data-theme="dark"] .response-card-answer .response-output.rendered {
  color: #dce6ed;
}

body[data-theme="dark"] .response-card-answer .response-output.rendered h1,
body[data-theme="dark"] .response-card-answer .response-output.rendered h2,
body[data-theme="dark"] .response-card-answer .response-output.rendered h3,
body[data-theme="dark"] .response-card-answer .response-output.rendered h4 {
  color: #f3f7fa;
}

body[data-theme="dark"] .response-card-answer .response-output.rendered h2 {
  border-bottom-color: rgba(225, 237, 247, 0.15);
}

body[data-theme="dark"] .response-card-answer .response-output.rendered blockquote {
  border-left-color: rgba(119, 165, 196, 0.62);
  background: rgba(119, 165, 196, 0.12);
  color: #d8e6ef;
}

body[data-theme="dark"] .response-card-answer .response-output.rendered code {
  background: rgba(232, 241, 247, 0.12);
}

body[data-theme="dark"] .response-card-answer .response-output.rendered ol > li::before {
  background: #7fa08d;
  color: #101712;
  box-shadow: 0 5px 12px rgba(0, 0, 0, 0.24);
}

body[data-theme="dark"] .response-card-answer .response-output.rendered .answer-summary-heading {
  border-color: rgba(119, 165, 196, 0.28);
  background: linear-gradient(180deg, rgba(92, 132, 160, 0.22), rgba(70, 104, 128, 0.16));
}

body[data-theme="dark"] .response-card-answer .response-output.rendered .answer-summary-heading + p {
  border-color: rgba(119, 165, 196, 0.28);
  background: rgba(12, 19, 26, 0.44);
}

.response-card-answer .response-output,
.response-card-answer .response-output:not(.rendered),
#section-question .send-preview,
#section-question .send-preview textarea,
#assembled-prompt {
  width: 100%;
  max-width: none;
  box-sizing: border-box;
}

/* Final UX Polish */
.response-card-history,
.response-card-conversation,
.response-card-prompt,
.supplemental-fields,
.send-preview,
.followup-guidance,
.tool-item,
.records-search-field {
  border-color: rgba(39, 47, 55, 0.075);
  box-shadow:
    0 10px 24px rgba(12, 18, 24, 0.038),
    inset 0 1px 0 rgba(255, 255, 255, 0.84);
}

.response-card-answer {
  border-color: rgba(39, 47, 55, 0.12);
  box-shadow:
    0 22px 48px rgba(12, 18, 24, 0.09),
    0 2px 10px rgba(12, 18, 24, 0.04),
    inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.response-card-answer .panel-head {
  margin-bottom: 8px;
  align-items: flex-start;
}

.response-card-answer .panel-head h2 {
  font-size: 1.46rem;
  line-height: 1.08;
}

.response-card-answer .response-output {
  padding: 24px 24px 22px;
  font-size: 1.05rem;
  line-height: 1.86;
}

.response-card-answer .response-output.rendered {
  color: #25303a;
}

.response-card-answer .response-output.rendered h1,
.response-card-answer .response-output.rendered h2,
.response-card-answer .response-output.rendered h3,
.response-card-answer .response-output.rendered h4 {
  margin: 1.35em 0 0.55em;
  color: #17202a;
  font-weight: 820;
  letter-spacing: 0;
}

.response-card-answer .response-output.rendered h1:first-child,
.response-card-answer .response-output.rendered h2:first-child,
.response-card-answer .response-output.rendered h3:first-child,
.response-card-answer .response-output.rendered h4:first-child {
  margin-top: 0;
}

.response-card-answer .response-output.rendered h2 {
  padding-bottom: 9px;
  border-bottom: 1px solid rgba(28, 38, 48, 0.11);
  font-size: 1.16rem;
  line-height: 1.38;
}

.response-card-answer .response-output.rendered h3 {
  font-size: 1.02rem;
  line-height: 1.42;
}

.response-card-answer .response-output.rendered h4 {
  font-size: 0.96rem;
  line-height: 1.42;
}

.response-card-answer .response-output.rendered p + p {
  margin-top: 0.92em;
}

.response-card-answer .response-output.rendered p {
  margin: 0.72em 0 0;
}

.response-card-answer .response-output.rendered ul,
.response-card-answer .response-output.rendered ol {
  margin: 0.82em 0 1em;
  padding-left: 1.95em;
  list-style-position: outside;
}

.response-card-answer .response-output.rendered li {
  margin: 0.48em 0;
  padding-left: 0.24em;
}

.response-card-answer .response-output.rendered ol {
  list-style: none;
  padding-left: 0;
  counter-reset: answer-list;
}

.response-card-answer .response-output.rendered ol > li {
  position: relative;
  min-height: 28px;
  margin: 0.72em 0;
  padding-left: 44px;
}

.response-card-answer .response-output.rendered ol > li::before {
  content: attr(data-list-number);
  position: absolute;
  left: 0;
  top: 0.08em;
  display: inline-grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  background: #476455;
  color: #fff;
  font-size: 0.86rem;
  font-weight: 850;
  line-height: 1;
  font-variant-numeric: tabular-nums;
  box-shadow: 0 4px 10px rgba(41, 63, 50, 0.16);
}

.response-card-answer .response-output.rendered ul > li::marker {
  color: #5f7869;
  font-size: 1.05em;
}

.response-card-answer .response-output.rendered blockquote {
  margin: 1.05em 0;
  padding: 12px 15px;
  border-left: 3px solid rgba(47, 58, 51, 0.5);
  border-radius: 12px;
  background: rgba(247, 237, 226, 0.72);
  color: #141614;
}

.response-card-answer .response-output.rendered blockquote p,
.response-card-answer .response-output.rendered blockquote:first-child {
  margin-top: 0;
}

.response-card-answer .response-output.rendered code {
  padding: 0.12em 0.34em;
  border-radius: 6px;
  background: rgba(20, 22, 20, 0.08);
  font-size: 0.92em;
}

.response-card-answer .response-output.rendered pre {
  overflow: auto;
  margin: 1em 0;
  padding: 14px 16px;
  border-radius: 14px;
  background: #090a09;
  color: #e7e7e2;
}

.response-card-answer .response-output.rendered pre code {
  padding: 0;
  background: transparent;
  color: inherit;
}

.response-card-answer .response-output.rendered hr {
  border: 0;
  border-top: 1px solid rgba(28, 38, 48, 0.12);
  margin: 1.4em 0;
}

.response-card-answer .response-output.rendered .answer-summary-heading {
  margin-top: 1.75em;
  padding: 12px 14px;
  border: 1px solid rgba(47, 58, 51, 0.18);
  border-radius: 14px 14px 0 0;
  background: linear-gradient(180deg, rgba(248, 239, 228, 0.9), rgba(239, 226, 211, 0.74));
}

.response-card-answer .response-output.rendered .answer-summary-heading + p {
  margin-top: 0;
  padding: 14px 15px 15px;
  border: 1px solid rgba(47, 58, 51, 0.18);
  border-top: 0;
  border-radius: 0 0 14px 14px;
  background: rgba(247, 247, 244, 0.86);
}

.answer-kicker {
  margin: 4px 0 14px;
  opacity: 0.92;
}

.answer-actions {
  gap: 10px;
  margin-top: 20px;
  padding-top: 18px;
}

.answer-actions .ghost-button:not(#answer-followup) {
  opacity: 0.84;
}

.answer-actions .ghost-button:not(#answer-followup):hover {
  opacity: 1;
}

.section-note,
.micro-copy,
.tool-desc,
.send-preview-copy,
.supplemental-summary-preview,
.composer-actions-note,
.answer-guidance,
.answer-note,
.history-action-hint,
.records-filter-caption,
.field-meta,
.session-context-label {
  color: #67717b;
}

.title-copy,
.brand-copy,
.hero-copy {
  color: #5f6973;
}

.supplemental-summary-preview,
.send-preview-copy,
.composer-actions-note,
.answer-guidance,
.history-action-hint {
  font-size: 0.81rem;
  line-height: 1.42;
}

.history-item {
  border-color: rgba(39, 47, 55, 0.08);
  box-shadow: none;
}

.history-item:not([open]) {
  background: rgba(248, 251, 253, 0.58);
}

.history-item:not([open]) .history-summary {
  gap: 3px;
  padding: 11px 12px;
}

.history-item:not([open]):hover .history-summary {
  background: rgba(255, 255, 255, 0.12);
}

.history-meta {
  gap: 5px 8px;
  font-size: 0.77rem;
  opacity: 0.86;
}

.history-question-title {
  font-size: 0.94rem;
  line-height: 1.38;
}

.history-answer-preview {
  font-size: 0.83rem;
  line-height: 1.42;
  -webkit-line-clamp: 1;
  opacity: 0.88;
}

.history-summary::after {
  width: 9px;
  height: 9px;
  margin-top: -22px;
  opacity: 0.72;
}

.history-item[open] .history-summary {
  background: rgba(255, 255, 255, 0.18);
}

.page-switcher-nav,
.composer .template-switcher {
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.86),
    0 8px 18px rgba(12, 18, 24, 0.028);
}

body[data-theme="dark"] .response-card-history,
body[data-theme="dark"] .response-card-conversation,
body[data-theme="dark"] .response-card-prompt,
body[data-theme="dark"] .supplemental-fields,
body[data-theme="dark"] .send-preview,
body[data-theme="dark"] .followup-guidance,
body[data-theme="dark"] .tool-item,
body[data-theme="dark"] .records-search-field {
  border-color: rgba(226, 232, 238, 0.045);
  box-shadow:
    0 12px 28px rgba(0, 0, 0, 0.16),
    inset 0 1px 0 rgba(255, 255, 255, 0.03);
}

body[data-theme="dark"] .response-card-answer {
  border-color: rgba(226, 232, 238, 0.065);
  box-shadow:
    0 22px 50px rgba(0, 0, 0, 0.28),
    0 2px 10px rgba(0, 0, 0, 0.16),
    inset 0 1px 0 rgba(255, 255, 255, 0.03);
}

body[data-theme="dark"] .section-note,
body[data-theme="dark"] .micro-copy,
body[data-theme="dark"] .tool-desc,
body[data-theme="dark"] .send-preview-copy,
body[data-theme="dark"] .supplemental-summary-preview,
body[data-theme="dark"] .composer-actions-note,
body[data-theme="dark"] .answer-guidance,
body[data-theme="dark"] .answer-note,
body[data-theme="dark"] .history-action-hint,
body[data-theme="dark"] .records-filter-caption,
body[data-theme="dark"] .field-meta,
body[data-theme="dark"] .session-context-label {
  color: #96a0aa;
}

body[data-theme="dark"] .title-copy,
body[data-theme="dark"] .brand-copy,
body[data-theme="dark"] .hero-copy {
  color: #a7b1bb;
}

body[data-theme="dark"] .history-item {
  border-color: rgba(226, 232, 238, 0.05);
}

body[data-theme="dark"] .history-item:not([open]) {
  background: rgba(255, 255, 255, 0.02);
}

body[data-theme="dark"] .history-item[open] .history-summary {
  background: rgba(255, 255, 255, 0.03);
}

body[data-theme="dark"] .page-switcher-nav,
body[data-theme="dark"] .composer .template-switcher {
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.032),
    0 8px 18px rgba(0, 0, 0, 0.14);
}

.history-actions,
.session-actions {
  gap: 8px;
}

.history-actions .mini-button-primary,
.session-actions .session-resume {
  order: 1;
}

.history-actions .history-note,
.history-actions .history-note-session,
.history-actions .history-pin,
.history-actions .history-pin-session,
.session-actions .session-pin-toggle,
.session-actions .session-rename,
.session-actions .session-switch {
  order: 2;
}

.history-actions .history-reuse,
.history-actions .history-export,
.history-actions .history-export-session,
.history-actions .history-copy-question,
.history-actions .history-copy-answer,
.session-actions .session-delete {
  order: 3;
}

.history-actions .history-delete,
.history-actions .record-delete-session {
  order: 4;
}

.history-actions .mini-button:not(.mini-button-primary),
.session-actions .session-mini:not(.session-resume) {
  background: rgba(255, 255, 255, 0.36);
  border-color: rgba(39, 47, 55, 0.075);
  color: #67717b;
  opacity: 0.82;
  font-weight: 500;
}

.history-actions .mini-button:not(.mini-button-primary):hover,
.session-actions .session-mini:not(.session-resume):hover {
  background: rgba(255, 255, 255, 0.56);
  border-color: rgba(39, 47, 55, 0.11);
  color: #4b5560;
  opacity: 1;
}

.history-actions .history-export,
.history-actions .history-export-session,
.history-actions .history-copy-question,
.history-actions .history-copy-answer,
.history-actions .history-reuse {
  font-size: 0.8rem;
  padding-inline: 9px;
}

.history-actions .history-delete,
.history-actions .record-delete-session,
.session-actions .session-delete {
  background: transparent;
  border-color: rgba(39, 47, 55, 0.045);
  color: #8a929a;
  opacity: 0.72;
}

.history-actions .history-delete:hover,
.history-actions .record-delete-session:hover,
.session-actions .session-delete:hover {
  border-color: rgba(123, 84, 84, 0.14);
  color: #7a5f5f;
  background: rgba(123, 84, 84, 0.05);
  opacity: 1;
}

.history-action-hint {
  font-size: 0.75rem;
  opacity: 0.72;
}

body[data-theme="dark"] .history-actions .mini-button:not(.mini-button-primary),
body[data-theme="dark"] .session-actions .session-mini:not(.session-resume) {
  background: rgba(255, 255, 255, 0.035);
  border-color: rgba(226, 232, 238, 0.055);
  color: #9aa4ad;
}

body[data-theme="dark"] .history-actions .mini-button:not(.mini-button-primary):hover,
body[data-theme="dark"] .session-actions .session-mini:not(.session-resume):hover {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(226, 232, 238, 0.08);
  color: #c8d0d7;
}

body[data-theme="dark"] .history-actions .history-delete,
body[data-theme="dark"] .history-actions .record-delete-session,
body[data-theme="dark"] .session-actions .session-delete {
  border-color: rgba(226, 232, 238, 0.04);
  color: #8d97a0;
  background: transparent;
}

body[data-theme="dark"] .history-actions .history-delete:hover,
body[data-theme="dark"] .history-actions .record-delete-session:hover,
body[data-theme="dark"] .session-actions .session-delete:hover {
  border-color: rgba(187, 128, 128, 0.16);
  color: #d0b4b4;
  background: rgba(150, 85, 85, 0.08);
}

/* Gentle compact pass */
:root {
  --lh-copy: 1.62;
  --lh-reading: 1.76;
}

body {
  padding: 22px;
}

.page-shell,
.main-stage,
.workspace {
  gap: 22px;
}

.sidebar {
  top: 22px;
  max-height: calc(100vh - 44px);
  padding: 20px;
}

.panel {
  margin-top: 18px;
  padding-top: 18px;
}

.panel-head {
  margin-bottom: 14px;
}

.brand-copy,
.hero-copy,
.micro-copy,
.section-note {
  line-height: 1.58;
}

input,
textarea {
  padding: 9px 12px;
}

textarea {
  min-height: 82px;
  line-height: 1.58;
}

input::placeholder,
textarea::placeholder {
  line-height: 1.58;
}

.primary-button,
.ghost-button,
.template-tab {
  padding: 10px 17px;
}

.button-row,
.quick-links,
.hero-actions,
.template-switcher {
  gap: 8px;
}

.hero {
  gap: 18px;
  padding: 20px 24px;
}

.workspace-left-column {
  gap: 15px;
}

.composer,
.response-card {
  padding: 24px 22px;
}

.composer {
  position: static;
  top: auto;
  max-height: none;
  overflow: visible;
}

.response-card-answer .response-output {
  padding: 22px 22px 20px;
  line-height: 1.78;
}

.response-card-answer .response-output.rendered > p:first-of-type {
  line-height: 1.7;
}

.composer-actions,
.answer-actions {
  gap: 8px;
  margin-top: 18px;
  padding-top: 16px;
}

.history-list.empty,
.conversation-thread.empty {
  min-height: 108px;
  padding: 18px;
}

.history-summary {
  padding: 11px 12px;
}

.history-body {
  gap: 11px;
  padding: 13px;
}

.history-meta {
  gap: 5px 8px;
}

.history-actions {
  gap: 6px;
}

.history-footer {
  gap: 9px;
}

.mini-button,
.session-mini {
  padding: 5px 9px;
}

/* Supplement panel reset */
.supplement-panel {
  display: grid;
  gap: 12px;
  grid-column: 1 / -1;
  width: 100%;
  min-width: 0;
  padding: 14px 15px 15px;
  border-radius: 20px;
  border: 1px solid rgba(91, 115, 139, 0.12);
  background: rgba(248, 251, 254, 0.72);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.74),
    0 10px 22px rgba(35, 53, 73, 0.035);
}

.supplement-panel-head {
  display: grid;
  gap: 4px;
}

.supplement-panel-title {
  font-size: 0.96rem;
  font-weight: 700;
  color: var(--text);
}

.supplement-panel-copy {
  font-size: 0.82rem;
  line-height: 1.42;
  color: var(--muted);
}

.supplement-panel-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.supplement-card {
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 14px;
  border-radius: 18px;
  border: 1px solid rgba(91, 115, 139, 0.08);
  background: rgba(255, 255, 255, 0.58);
}

.supplement-card span {
  font-size: 0.96rem;
  font-weight: 600;
  color: var(--text);
  line-height: 1.45;
}

.supplement-card-wide {
  grid-column: 1 / -1;
}

body[data-theme="dark"] .supplement-panel {
  border-color: rgba(195, 213, 232, 0.08);
  background: rgba(255, 255, 255, 0.03);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.03),
    0 12px 24px rgba(0, 0, 0, 0.14);
}

body[data-theme="dark"] .supplement-card {
  border-color: rgba(195, 213, 232, 0.06);
  background: rgba(255, 255, 255, 0.025);
}

@media (max-width: 720px) {
  .supplement-panel-grid {
    grid-template-columns: 1fr;
  }

  .supplement-card-wide {
    grid-column: auto;
  }
}

/* Final stable composer layout */
#section-question {
  position: static !important;
  top: auto !important;
  max-height: none !important;
  overflow: visible !important;
}

#section-question .form-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 16px !important;
  margin: 0 0 18px !important;
}

#section-question .field-span-2,
#section-question #supplement-panel,
#section-question .send-preview {
  grid-column: 1 / -1 !important;
}

#section-question #supplement-panel {
  display: grid !important;
  gap: 12px !important;
  align-self: stretch !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 0 16px !important;
  padding: 16px !important;
  border-radius: 20px !important;
  border: 1px solid rgba(91, 115, 139, 0.12) !important;
  background: rgba(248, 251, 254, 0.76) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.74),
    0 10px 22px rgba(35, 53, 73, 0.035) !important;
  opacity: 1 !important;
  visibility: visible !important;
}

#section-question #supplement-panel .supplement-panel-head {
  display: grid !important;
  gap: 4px !important;
  margin: 0 !important;
}

#section-question #supplement-panel .supplement-panel-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 14px !important;
}

#section-question #supplement-panel .supplement-card {
  display: grid !important;
  gap: 8px !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 14px !important;
  border-radius: 18px !important;
  border: 1px solid rgba(91, 115, 139, 0.08) !important;
  background: rgba(255, 255, 255, 0.62) !important;
}

#section-question #supplement-panel .supplement-card-wide {
  grid-column: 1 / -1 !important;
}

#section-question .send-preview {
  display: block !important;
  align-self: stretch !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 0 16px !important;
}

body[data-theme="dark"] #section-question #supplement-panel {
  border-color: rgba(195, 213, 232, 0.08) !important;
  background: rgba(255, 255, 255, 0.035) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.03),
    0 12px 24px rgba(0, 0, 0, 0.14) !important;
}

body[data-theme="dark"] #section-question #supplement-panel .supplement-card {
  border-color: rgba(195, 213, 232, 0.06) !important;
  background: rgba(255, 255, 255, 0.03) !important;
}

@media (max-width: 720px) {
  #section-question .form-grid {
    grid-template-columns: 1fr !important;
  }

  #section-question #supplement-panel .supplement-panel-grid {
    grid-template-columns: 1fr !important;
  }

  #section-question #supplement-panel .supplement-card-wide {
    grid-column: auto !important;
  }
}

/* Final hierarchy refinement */
.hero {
  padding: 18px 24px;
}

.title-copy,
.brand-copy,
.hero-copy {
  max-width: 34ch;
}

.hero-copy {
  font-size: 0.98rem;
  line-height: 1.62;
}

.composer .section-note,
.response-card-history .section-note,
.response-card-conversation .section-note,
.settings-panel .section-note,
#section-tools .section-note,
#section-records-filters .section-note {
  max-width: 34ch;
  font-size: 0.84rem;
  line-height: 1.52;
  color: rgba(103, 113, 123, 0.88);
}

.mode-switcher-block {
  gap: 7px;
  margin-bottom: 14px;
  padding: 10px;
  border: 1px solid rgba(39, 47, 55, 0.055);
  border-radius: 18px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.34) 0%, rgba(245, 248, 250, 0.22) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.7),
    0 8px 18px rgba(12, 18, 24, 0.018);
}

.mode-switcher-title {
  font-size: 0.76rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(103, 113, 123, 0.82);
}

.mode-switcher-hint {
  display: grid;
  grid-template-columns: minmax(0, max-content) minmax(0, max-content);
  gap: 5px 18px;
  margin: 2px 2px 0;
  padding: 2px 4px 0;
  border: 0;
  border-top: 1px solid rgba(39, 47, 55, 0.055);
  padding-top: 8px;
  background: transparent;
  color: rgba(103, 113, 123, 0.72);
  font-size: 0.75rem;
  line-height: 1.48;
  box-shadow: none;
}

.mode-switcher-hint > div {
  min-width: 0;
  white-space: nowrap;
}

.mode-switcher-hint strong {
  display: inline-block;
  margin-right: 4px;
  color: rgba(54, 66, 76, 0.82);
  font-weight: 760;
}

.composer .template-switcher {
  padding: 5px;
  background: rgba(255, 255, 255, 0.28);
  border: 1px solid rgba(39, 47, 55, 0.05);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.78),
    0 6px 14px rgba(12, 18, 24, 0.02);
}

#section-question #supplement-panel,
#section-question .send-preview,
.tool-item,
.records-filters-stack {
  border-color: rgba(39, 47, 55, 0.055) !important;
  box-shadow:
    0 6px 16px rgba(12, 18, 24, 0.024),
    inset 0 1px 0 rgba(255, 255, 255, 0.78) !important;
}

#section-question #supplement-panel {
  padding: 14px !important;
}

.supplement-panel-copy,
.send-preview-copy,
.tool-desc,
.records-filter-caption {
  color: rgba(103, 113, 123, 0.8);
}

.send-preview summary {
  padding: 14px 16px;
}

.send-preview-copy {
  font-size: 0.78rem;
}

.response-card-answer {
  border-color: rgba(39, 47, 55, 0.13);
  box-shadow:
    0 24px 54px rgba(12, 18, 24, 0.1),
    0 4px 14px rgba(12, 18, 24, 0.04),
    inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.response-card-answer .panel-head {
  margin-bottom: 6px;
}

.response-card-answer .panel-head h2 {
  letter-spacing: -0.04em;
}

.answer-stage-head {
  gap: 4px;
  margin: 0 0 12px;
}

.answer-kicker {
  margin: 0;
  font-size: 0.74rem;
  letter-spacing: 0.12em;
  opacity: 0.86;
}

.answer-note {
  max-width: 34ch;
  font-size: 0.84rem;
  line-height: 1.5;
}

.response-card-answer .response-output {
  min-height: 260px;
  padding: 20px 22px 20px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.7) 0%, rgba(246, 249, 252, 0.54) 100%);
}

.response-card-answer .response-output::before {
  margin-bottom: 12px;
}

.response-card-answer .response-output.empty {
  align-content: start;
  justify-items: start;
}

.response-card-answer .response-output.empty p {
  max-width: 34ch;
  margin: 0;
  text-align: left;
}

.response-card-answer .response-output.rendered > p:first-of-type {
  font-size: 1.08rem;
  line-height: 1.7;
}

.answer-actions {
  margin-top: 16px;
  padding-top: 14px;
}

.answer-actions .ghost-button:not(#answer-followup) {
  opacity: 0.72;
}

.answer-guidance {
  margin-top: 8px;
  font-size: 0.78rem;
  line-height: 1.42;
  color: rgba(103, 113, 123, 0.84);
}

.history-list.empty,
.conversation-thread.empty {
  min-height: 96px;
  place-items: start;
  align-content: start;
  padding: 18px;
}

.history-item {
  border-color: rgba(39, 47, 55, 0.06);
  background: rgba(249, 251, 253, 0.68);
}

.history-item:not([open]) {
  box-shadow: none;
}

.history-item:not([open]) .history-summary {
  gap: 2px;
  padding: 10px 12px;
}

.history-item:not([open]):hover .history-summary {
  background: rgba(255, 255, 255, 0.08);
}

.history-question-title {
  font-size: 0.92rem;
  line-height: 1.34;
  font-weight: 650;
}

.history-meta {
  font-size: 0.74rem;
  opacity: 0.74;
}

.history-answer-preview {
  margin-top: 2px;
  font-size: 0.79rem;
  line-height: 1.35;
  opacity: 0.76;
  -webkit-line-clamp: 1;
}

.history-summary::after {
  opacity: 0.56;
}

.history-body {
  gap: 10px;
}

.history-action-hint {
  max-width: 44ch;
  font-size: 0.74rem;
  line-height: 1.42;
  opacity: 0.72;
}

#section-tools .tool-item .ghost-button,
#section-records-filters .ghost-button,
#section-settings .ghost-button,
#section-prompt .ghost-button {
  opacity: 0.88;
}

body[data-theme="dark"] .composer .section-note,
body[data-theme="dark"] .response-card-history .section-note,
body[data-theme="dark"] .response-card-conversation .section-note,
body[data-theme="dark"] .settings-panel .section-note,
body[data-theme="dark"] #section-tools .section-note,
body[data-theme="dark"] #section-records-filters .section-note,
body[data-theme="dark"] .supplement-panel-copy,
body[data-theme="dark"] .send-preview-copy,
body[data-theme="dark"] .tool-desc,
body[data-theme="dark"] .records-filter-caption,
body[data-theme="dark"] .answer-guidance,
body[data-theme="dark"] .answer-note {
  color: rgba(156, 166, 175, 0.86);
}

body[data-theme="dark"] .composer .template-switcher {
  background: rgba(255, 255, 255, 0.03);
  border-color: rgba(226, 232, 238, 0.04);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.026),
    0 6px 14px rgba(0, 0, 0, 0.12);
}

body[data-theme="dark"] .mode-switcher-block {
  border-color: rgba(226, 232, 238, 0.045);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.04) 0%, rgba(255, 255, 255, 0.024) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.028),
    0 8px 18px rgba(0, 0, 0, 0.1);
}

body[data-theme="dark"] .mode-switcher-hint {
  border-top-color: rgba(226, 232, 238, 0.045);
  background: transparent;
  color: rgba(165, 174, 182, 0.68);
  box-shadow: none;
}

body[data-theme="dark"] .mode-switcher-hint strong {
  color: rgba(220, 227, 233, 0.82);
}

body[data-theme="dark"] #section-question #supplement-panel,
body[data-theme="dark"] #section-question .send-preview,
body[data-theme="dark"] .tool-item,
body[data-theme="dark"] .records-filters-stack {
  border-color: rgba(226, 232, 238, 0.04) !important;
  box-shadow:
    0 8px 20px rgba(0, 0, 0, 0.14),
    inset 0 1px 0 rgba(255, 255, 255, 0.025) !important;
}

body[data-theme="dark"] .response-card-answer {
  border-color: rgba(226, 232, 238, 0.07);
  box-shadow:
    0 24px 56px rgba(0, 0, 0, 0.3),
    0 4px 14px rgba(0, 0, 0, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.028);
}

body[data-theme="dark"] .response-card-answer .response-output {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.045) 0%, rgba(255, 255, 255, 0.028) 100%);
}

body[data-theme="dark"] .history-item {
  border-color: rgba(226, 232, 238, 0.045);
  background: rgba(255, 255, 255, 0.024);
}

body[data-theme="dark"] .history-item:not([open]):hover .history-summary {
  background: rgba(255, 255, 255, 0.018);
}

/* Workspace input tone normalization */
#section-question .field,
#section-question .field-question-primary,
#section-question .field-concern-secondary,
#section-question #supplement-panel,
#section-question #supplement-panel .supplement-card,
#section-question .send-preview,
#section-question .send-preview textarea,
#section-question .field input,
#section-question .field textarea {
  background:
    linear-gradient(180deg, rgba(247, 247, 244, 0.9) 0%, rgba(236, 237, 232, 0.86) 100%) !important;
}

#section-question .field,
#section-question #supplement-panel,
#section-question #supplement-panel .supplement-card,
#section-question .send-preview {
  border-color: rgba(20, 22, 20, 0.08) !important;
  box-shadow:
    0 8px 18px rgba(12, 14, 12, 0.03),
    inset 0 1px 0 rgba(255, 255, 255, 0.72) !important;
}

#section-question .field input,
#section-question .field textarea,
#section-question .send-preview textarea {
  border-color: rgba(20, 22, 20, 0.09) !important;
  color: #141614;
}

#section-question .field textarea::placeholder,
#section-question .send-preview textarea::placeholder {
  color: rgba(110, 114, 107, 0.82) !important;
}

#section-question .field textarea:focus,
#section-question .field input:focus,
#section-question .send-preview textarea:focus {
  background:
    linear-gradient(180deg, rgba(247, 247, 244, 0.95) 0%, rgba(236, 237, 232, 0.9) 100%) !important;
  border-color: rgba(47, 58, 51, 0.24) !important;
  box-shadow:
    0 0 0 3px rgba(203, 148, 111, 0.16),
    inset 0 1px 0 rgba(255, 255, 255, 0.82) !important;
}

body[data-theme="dark"] #section-question .field,
body[data-theme="dark"] #section-question .field-question-primary,
body[data-theme="dark"] #section-question .field-concern-secondary,
body[data-theme="dark"] #section-question #supplement-panel,
body[data-theme="dark"] #section-question #supplement-panel .supplement-card,
body[data-theme="dark"] #section-question .send-preview,
body[data-theme="dark"] #section-question .send-preview textarea,
body[data-theme="dark"] #section-question .field input,
body[data-theme="dark"] #section-question .field textarea {
  background:
    linear-gradient(180deg, rgba(22, 24, 22, 0.88) 0%, rgba(13, 15, 13, 0.84) 100%) !important;
}

body[data-theme="dark"] #section-question .field,
body[data-theme="dark"] #section-question #supplement-panel,
body[data-theme="dark"] #section-question #supplement-panel .supplement-card,
body[data-theme="dark"] #section-question .send-preview {
  border-color: rgba(231, 231, 226, 0.08) !important;
  box-shadow:
    0 10px 22px rgba(0, 0, 0, 0.14),
    inset 0 1px 0 rgba(255, 255, 255, 0.026) !important;
}

body[data-theme="dark"] #section-question .field input,
body[data-theme="dark"] #section-question .field textarea,
body[data-theme="dark"] #section-question .send-preview textarea {
  border-color: rgba(231, 231, 226, 0.09) !important;
  color: #e7e7e2;
}

body[data-theme="dark"] #section-question .field textarea::placeholder,
body[data-theme="dark"] #section-question .send-preview textarea::placeholder {
  color: rgba(169, 173, 165, 0.76) !important;
}

body[data-theme="dark"] #section-question .field textarea:focus,
body[data-theme="dark"] #section-question .field input:focus,
body[data-theme="dark"] #section-question .send-preview textarea:focus {
  background:
    linear-gradient(180deg, rgba(22, 24, 22, 0.92) 0%, rgba(17, 19, 17, 0.88) 100%) !important;
  border-color: rgba(83, 98, 85, 0.18) !important;
  box-shadow:
    0 0 0 3px rgba(62, 74, 66, 0.14),
    inset 0 1px 0 rgba(255, 255, 255, 0.03) !important;
}

/* Final typography alignment */
.page-nav-button,
.template-tab,
.ghost-button,
.primary-button {
  font-size: 0.92rem !important;
  line-height: 1.2 !important;
}

.panel-head h2,
.sidebar .panel .panel-head h2,
.response-card-history .panel-head h2,
.response-card-conversation .panel-head h2,
.response-card-prompt .panel-head h2 {
  font-size: 1.16rem !important;
  line-height: 1.18 !important;
  letter-spacing: -0.03em !important;
}

.composer .panel-head h2,
.response-card-answer .panel-head h2 {
  font-size: 1.42rem !important;
  line-height: 1.08 !important;
  letter-spacing: -0.04em !important;
}

.field span,
.records-search-field span,
.send-preview-title,
.supplement-panel-title,
.tool-title {
  font-size: 0.92rem !important;
  font-weight: 700 !important;
  line-height: 1.42 !important;
  letter-spacing: 0.01em !important;
}

.history-question-title {
  font-size: 0.93rem !important;
  font-weight: 650 !important;
  line-height: 1.36 !important;
  letter-spacing: 0.005em !important;
}

.section-note,
.micro-copy,
.supplement-panel-copy,
.send-preview-copy,
.tool-desc,
.records-filter-caption,
.field-meta,
.composer-actions-note {
  font-size: 0.82rem !important;
  line-height: 1.46 !important;
}

.status-pill,
.status-pill-save {
  font-size: 0.81rem !important;
  line-height: 1.24 !important;
  letter-spacing: 0.01em !important;
}

.mode-switcher-title,
.session-context-label,
.history-block-label,
.conversation-role,
.history-conversation-role {
  font-size: 0.76rem !important;
  font-weight: 700 !important;
  line-height: 1.32 !important;
  letter-spacing: 0.12em !important;
}

.history-meta {
  font-size: 0.75rem !important;
  line-height: 1.34 !important;
}

.history-answer-preview {
  font-size: 0.8rem !important;
  line-height: 1.4 !important;
}

.structure-list,
#delivery-mode-copy,
.conversation-content,
.history-question,
.history-answer,
.history-note {
  font-size: 0.94rem !important;
  line-height: 1.62 !important;
}

/* Final cold minimal accent system */
.primary-button {
  border-color: rgba(47, 58, 51, 0.4) !important;
  background: linear-gradient(135deg, rgba(47, 58, 51, 1) 0%, rgba(20, 22, 20, 1) 100%) !important;
  box-shadow:
    0 16px 34px rgba(13, 15, 13, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.15) !important;
}

.primary-button:hover {
  box-shadow:
    0 18px 38px rgba(13, 15, 13, 0.3),
    inset 0 1px 0 rgba(255, 255, 255, 0.2) !important;
}

.primary-button.accent,
.mini-button-primary,
.history-actions .mini-button-primary,
.session-actions .session-pin-toggle,
.template-tab.active,
.delivery-mode-button.active,
.page-nav-button.active,
.records-mode-button.active,
.records-filter-button.active,
#answer-followup:not(:disabled) {
  background: linear-gradient(135deg, rgba(218, 221, 214, 0.48) 0%, rgba(47, 58, 51, 0.6) 100%) !important;
  border-color: rgba(47, 58, 51, 0.32) !important;
  color: #141614 !important;
  box-shadow:
    0 12px 24px rgba(13, 15, 13, 0.14),
    inset 0 1px 0 rgba(255, 255, 255, 0.42) !important;
}

#answer-followup:not(:disabled):hover,
.template-tab.active:hover,
.delivery-mode-button.active:hover,
.page-nav-button.active:hover,
.records-mode-button.active:hover,
.records-filter-button.active:hover {
  background: linear-gradient(135deg, rgba(218, 221, 214, 0.54) 0%, rgba(47, 58, 51, 0.66) 100%) !important;
}

input:focus,
textarea:focus,
.records-search-field input:focus,
.composer .field input:focus,
.composer .field textarea:focus,
.send-preview textarea:focus,
#section-question .field textarea:focus,
#section-question .field input:focus,
#section-question .send-preview textarea:focus {
  border-color: rgba(47, 58, 51, 0.44) !important;
  box-shadow:
    0 0 0 4px rgba(203, 148, 111, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.82) !important;
}

.history-state-pinned,
.session-pin,
.status-pill:not(.subtle),
.status-pill-save {
  background: rgba(218, 221, 214, 0.28) !important;
  color: #141614 !important;
}

.history-item.pinned,
.session-item.pinned {
  border-color: rgba(47, 58, 51, 0.3) !important;
  box-shadow:
    0 12px 28px rgba(13, 15, 13, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.34) !important;
}

body[data-theme="dark"] .primary-button {
  border-color: rgba(83, 98, 85, 0.34) !important;
  background: linear-gradient(135deg, rgba(62, 74, 66, 1) 0%, rgba(13, 15, 13, 1) 100%) !important;
  box-shadow:
    0 18px 38px rgba(0, 0, 0, 0.36),
    inset 0 1px 0 rgba(255, 255, 255, 0.09) !important;
}

body[data-theme="dark"] .primary-button.accent,
body[data-theme="dark"] .mini-button-primary,
body[data-theme="dark"] .history-actions .mini-button-primary,
body[data-theme="dark"] .session-actions .session-pin-toggle,
body[data-theme="dark"] .template-tab.active,
body[data-theme="dark"] .delivery-mode-button.active,
body[data-theme="dark"] .page-nav-button.active,
body[data-theme="dark"] .records-mode-button.active,
body[data-theme="dark"] .records-filter-button.active,
body[data-theme="dark"] #answer-followup:not(:disabled) {
  background: linear-gradient(135deg, rgba(62, 74, 66, 0.6) 0%, rgba(22, 24, 22, 0.76) 100%) !important;
  border-color: rgba(83, 98, 85, 0.28) !important;
  color: #e7e7e2 !important;
  box-shadow:
    0 12px 24px rgba(0, 0, 0, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.07) !important;
}

body[data-theme="dark"] input:focus,
body[data-theme="dark"] textarea:focus,
body[data-theme="dark"] .records-search-field input:focus,
body[data-theme="dark"] .composer .field input:focus,
body[data-theme="dark"] .composer .field textarea:focus,
body[data-theme="dark"] .send-preview textarea:focus,
body[data-theme="dark"] #section-question .field textarea:focus,
body[data-theme="dark"] #section-question .field input:focus,
body[data-theme="dark"] #section-question .send-preview textarea:focus {
  border-color: rgba(83, 98, 85, 0.34) !important;
  box-shadow:
    0 0 0 4px rgba(62, 74, 66, 0.3),
    inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
}

body[data-theme="dark"] .history-state-pinned,
body[data-theme="dark"] .session-pin,
body[data-theme="dark"] .status-pill:not(.subtle),
body[data-theme="dark"] .status-pill-save {
  background: rgba(62, 74, 66, 0.34) !important;
  color: #e7e7e2 !important;
}

body[data-theme="dark"] .history-item.pinned,
body[data-theme="dark"] .session-item.pinned {
  border-color: rgba(83, 98, 85, 0.24) !important;
  box-shadow:
    0 12px 28px rgba(0, 0, 0, 0.32),
    inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
}

/* Final discern translucency refinement */
.title-banner,
.response-card,
.response-card-history,
.response-card-conversation,
.response-card-prompt,
.sidebar .panel,
#section-question #supplement-panel,
#section-question .send-preview {
  background: #f7f7f4 !important;
  border-color: rgba(231, 231, 226, 0.78) !important;
  box-shadow:
    0 18px 34px rgba(12, 14, 12, 0.07),
    inset 0 1px 0 rgba(255, 255, 255, 0.92) !important;
  backdrop-filter: blur(26px) saturate(108%) !important;
  -webkit-backdrop-filter: blur(26px) saturate(108%) !important;
}

.response-card-answer {
  background: rgba(247, 247, 244, 0.86) !important;
  border-color: rgba(231, 231, 226, 0.8) !important;
  box-shadow:
    0 20px 38px rgba(12, 14, 12, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.94) !important;
  backdrop-filter: blur(28px) saturate(108%) !important;
  -webkit-backdrop-filter: blur(28px) saturate(108%) !important;
}

.template-tab.active,
.delivery-mode-button.active,
.page-nav-button.active,
.records-mode-button.active,
.records-filter-button.active,
#answer-followup:not(:disabled),
.session-actions .session-pin-toggle,
.mini-button-primary {
  background: linear-gradient(135deg, rgba(218, 221, 214, 0.34) 0%, rgba(47, 58, 51, 0.44) 100%) !important;
  border-color: rgba(47, 58, 51, 0.22) !important;
  box-shadow:
    0 8px 18px rgba(13, 15, 13, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.68) !important;
}

.primary-button {
  box-shadow:
    0 16px 30px rgba(13, 15, 13, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.28) !important;
}

input,
textarea,
.records-search-field input,
#section-question .send-preview textarea,
#section-question #supplement-panel .supplement-card,
#section-question #supplement-panel textarea {
  background: rgba(247, 247, 244, 0.68) !important;
  border-color: rgba(218, 221, 214, 0.86) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.92),
    0 1px 2px rgba(12, 14, 12, 0.025) !important;
}

.history-item,
.history-item.pinned {
  background: rgba(247, 247, 244, 0.74) !important;
  border-color: rgba(231, 231, 226, 0.68) !important;
  backdrop-filter: blur(20px) saturate(106%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(106%) !important;
}

body[data-theme="dark"] .title-banner,
body[data-theme="dark"] .response-card,
body[data-theme="dark"] .response-card-history,
body[data-theme="dark"] .response-card-conversation,
body[data-theme="dark"] .response-card-prompt,
body[data-theme="dark"] .sidebar .panel,
body[data-theme="dark"] #section-question #supplement-panel,
body[data-theme="dark"] #section-question .send-preview {
  background: rgba(17, 19, 17, 0.78) !important;
  border-color: rgba(231, 231, 226, 0.1) !important;
  box-shadow:
    0 20px 38px rgba(0, 0, 0, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
  backdrop-filter: blur(26px) saturate(108%) !important;
  -webkit-backdrop-filter: blur(26px) saturate(108%) !important;
}

body[data-theme="dark"] .response-card-answer {
  background: rgba(13, 15, 13, 0.82) !important;
  border-color: rgba(231, 231, 226, 0.11) !important;
  box-shadow:
    0 22px 42px rgba(0, 0, 0, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.09) !important;
  backdrop-filter: blur(28px) saturate(108%) !important;
  -webkit-backdrop-filter: blur(28px) saturate(108%) !important;
}

body[data-theme="dark"] .template-tab.active,
body[data-theme="dark"] .delivery-mode-button.active,
body[data-theme="dark"] .page-nav-button.active,
body[data-theme="dark"] .records-mode-button.active,
body[data-theme="dark"] .records-filter-button.active,
body[data-theme="dark"] #answer-followup:not(:disabled),
body[data-theme="dark"] .session-actions .session-pin-toggle,
body[data-theme="dark"] .mini-button-primary {
  background: linear-gradient(135deg, rgba(62, 74, 66, 0.42) 0%, rgba(22, 24, 22, 0.58) 100%) !important;
  border-color: rgba(83, 98, 85, 0.22) !important;
  box-shadow:
    0 8px 18px rgba(0, 0, 0, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
}

body[data-theme="dark"] input,
body[data-theme="dark"] textarea,
body[data-theme="dark"] .records-search-field input,
body[data-theme="dark"] #section-question .send-preview textarea,
body[data-theme="dark"] #section-question #supplement-panel .supplement-card,
body[data-theme="dark"] #section-question #supplement-panel textarea {
  background: rgba(231, 231, 226, 0.055) !important;
  border-color: rgba(231, 231, 226, 0.1) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.05),
    0 1px 2px rgba(0, 0, 0, 0.12) !important;
}

body[data-theme="dark"] .history-item,
body[data-theme="dark"] .history-item.pinned {
  background: rgba(17, 19, 17, 0.72) !important;
  border-color: rgba(231, 231, 226, 0.09) !important;
  backdrop-filter: blur(20px) saturate(104%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(104%) !important;
}

/* Cold minimal normalization for supplement panel and answer surface */
#section-question #supplement-panel {
  background: rgba(247, 247, 244, 0.84) !important;
  border-color: rgba(218, 221, 214, 0.88) !important;
}

#section-question #supplement-panel .supplement-card,
#section-question #supplement-panel textarea {
  background: rgba(247, 247, 244, 0.78) !important;
  border-color: rgba(218, 221, 214, 0.84) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.94),
    0 1px 2px rgba(12, 14, 12, 0.02) !important;
}

.response-card-answer {
  background: rgba(247, 247, 244, 0.88) !important;
  border-color: rgba(218, 221, 214, 0.9) !important;
}

.response-card-answer .response-output {
  background:
    linear-gradient(180deg, rgba(247, 247, 244, 0.8) 0%, rgba(236, 237, 232, 0.64) 100%) !important;
  border-color: rgba(218, 221, 214, 0.84) !important;
}

body[data-theme="dark"] #section-question #supplement-panel {
  background: #111311 !important;
  border-color: rgba(231, 231, 226, 0.1) !important;
}

body[data-theme="dark"] #section-question #supplement-panel .supplement-card,
body[data-theme="dark"] #section-question #supplement-panel textarea {
  background: rgba(231, 231, 226, 0.058) !important;
  border-color: rgba(231, 231, 226, 0.1) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.05),
    0 1px 2px rgba(0, 0, 0, 0.1) !important;
}

body[data-theme="dark"] .response-card-answer {
  background: rgba(13, 15, 13, 0.84) !important;
  border-color: rgba(231, 231, 226, 0.11) !important;
}

body[data-theme="dark"] .response-card-answer .response-output {
  background:
    linear-gradient(180deg, rgba(231, 231, 226, 0.06) 0%, rgba(231, 231, 226, 0.036) 100%) !important;
  border-color: rgba(231, 231, 226, 0.08) !important;
}

/* DISCERN brand treatment */
.title-banner {
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 22px;
  padding: 22px 24px;
  overflow: hidden;
}

.title-banner::before {
  content: "";
  position: absolute;
  left: 24px;
  right: 24px;
  bottom: 0;
  height: 1px;
  background: linear-gradient(90deg, rgba(44, 55, 64, 0.18), rgba(44, 55, 64, 0.04), transparent);
  pointer-events: none;
}

.title-banner-content {
  position: relative;
  display: grid;
  gap: 8px;
  align-content: center;
}

.title-banner h1,
.brand-block h1 {
  width: fit-content;
  margin: 0;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-weight: 760;
  letter-spacing: 0.03em;
  line-height: 0.96;
  color: transparent !important;
  background:
    linear-gradient(135deg, #141614 0%, #4a514b 48%, #a9ada5 100%);
  -webkit-background-clip: text;
  background-clip: text;
  text-shadow: 0 16px 30px rgba(13, 15, 13, 0.08);
}

.title-banner h1 {
  font-size: 3.3rem;
}

.brand-block h1 {
  font-size: 2.18rem;
}

.title-copy,
.brand-copy {
  max-width: 34ch;
  font-size: 0.98rem;
  line-height: 1.45;
  color: #6e726b !important;
}

.title-banner-nav {
  align-self: center;
}

.brand-block {
  padding-top: 2px;
  padding-bottom: 2px;
}

.brand-block .brand-copy {
  margin-top: 8px;
}

body[data-theme="dark"] .title-banner h1,
body[data-theme="dark"] .brand-block h1 {
  background:
    linear-gradient(135deg, #e7e7e2 0%, #a9ada5 48%, #536255 100%);
  -webkit-background-clip: text;
  background-clip: text;
  text-shadow: 0 16px 34px rgba(0, 0, 0, 0.2);
}

body[data-theme="dark"] .title-banner::before {
  background: linear-gradient(90deg, rgba(214, 224, 232, 0.16), rgba(214, 224, 232, 0.04), transparent);
}

body[data-theme="dark"] .title-copy,
body[data-theme="dark"] .brand-copy {
  color: #a9ada5 !important;
}

@media (max-width: 760px) {
  .title-banner {
    gap: 16px;
    padding: 20px;
  }

  .title-banner h1 {
    font-size: 2.08rem;
  }

  .brand-block h1 {
    font-size: 1.92rem;
  }

  .title-copy,
  .brand-copy {
    font-size: 0.92rem;
  }
}

/* Final global surface unification */
.title-banner,
.response-card,
.response-card-answer,
.response-card-history,
.response-card-conversation,
.response-card-prompt,
.sidebar .panel,
#section-question #supplement-panel,
#section-question .send-preview,
.tool-item,
.records-filters-stack,
.history-item,
.history-item.pinned {
  background: rgba(247, 247, 244, 0.84) !important;
  border-color: rgba(218, 221, 214, 0.86) !important;
}

.response-card-answer .response-output,
#section-question #supplement-panel .supplement-card,
#section-question #supplement-panel textarea,
#section-question .send-preview textarea,
#section-question .field input,
#section-question .field textarea,
.records-search-field input,
#section-settings input,
#section-settings textarea,
.history-block {
  background: #f7f7f4 !important;
  border-color: rgba(218, 221, 214, 0.84) !important;
}

.title-banner,
.response-card,
.response-card-answer,
.response-card-history,
.response-card-conversation,
.response-card-prompt,
.sidebar .panel,
#section-question #supplement-panel,
#section-question .send-preview,
.tool-item,
.records-filters-stack {
  box-shadow:
    0 18px 34px rgba(12, 14, 12, 0.07),
    inset 0 1px 0 rgba(255, 255, 255, 0.92) !important;
}

.history-item,
.history-item.pinned {
  box-shadow:
    0 8px 18px rgba(12, 14, 12, 0.045),
    inset 0 1px 0 rgba(255, 255, 255, 0.86) !important;
}

body[data-theme="dark"] .title-banner,
body[data-theme="dark"] .response-card,
body[data-theme="dark"] .response-card-answer,
body[data-theme="dark"] .response-card-history,
body[data-theme="dark"] .response-card-conversation,
body[data-theme="dark"] .response-card-prompt,
body[data-theme="dark"] .sidebar .panel,
body[data-theme="dark"] #section-question #supplement-panel,
body[data-theme="dark"] #section-question .send-preview,
body[data-theme="dark"] .tool-item,
body[data-theme="dark"] .records-filters-stack,
body[data-theme="dark"] .history-item,
body[data-theme="dark"] .history-item.pinned {
  background: #111311 !important;
  border-color: rgba(231, 231, 226, 0.1) !important;
}

body[data-theme="dark"] .response-card-answer .response-output,
body[data-theme="dark"] #section-question #supplement-panel .supplement-card,
body[data-theme="dark"] #section-question #supplement-panel textarea,
body[data-theme="dark"] #section-question .send-preview textarea,
body[data-theme="dark"] #section-question .field input,
body[data-theme="dark"] #section-question .field textarea,
body[data-theme="dark"] .records-search-field input,
body[data-theme="dark"] #section-settings input,
body[data-theme="dark"] #section-settings textarea,
body[data-theme="dark"] .history-block {
  background: rgba(231, 231, 226, 0.06) !important;
  border-color: rgba(231, 231, 226, 0.1) !important;
}

body[data-theme="dark"] .title-banner,
body[data-theme="dark"] .response-card,
body[data-theme="dark"] .response-card-answer,
body[data-theme="dark"] .response-card-history,
body[data-theme="dark"] .response-card-conversation,
body[data-theme="dark"] .response-card-prompt,
body[data-theme="dark"] .sidebar .panel,
body[data-theme="dark"] #section-question #supplement-panel,
body[data-theme="dark"] #section-question .send-preview,
body[data-theme="dark"] .tool-item,
body[data-theme="dark"] .records-filters-stack {
  box-shadow:
    0 20px 38px rgba(0, 0, 0, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}

body[data-theme="dark"] .history-item,
body[data-theme="dark"] .history-item.pinned {
  box-shadow:
    0 10px 22px rgba(0, 0, 0, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
}

/* Question type block: one outer field with two peer glass surfaces */
#section-question .mode-switcher-block {
  display: grid;
  gap: 10px;
  margin-bottom: 14px;
  padding: 14px;
  border: 1px solid rgba(20, 22, 20, 0.08) !important;
  border-radius: 18px;
  background:
    linear-gradient(180deg, rgba(247, 247, 244, 0.9) 0%, rgba(236, 237, 232, 0.86) 100%) !important;
  box-shadow:
    0 8px 18px rgba(12, 14, 12, 0.03),
    inset 0 1px 0 rgba(255, 255, 255, 0.72) !important;
}

#section-question .mode-switcher-title {
  color: #141614;
  font-size: 0.92rem !important;
  font-weight: 700 !important;
  line-height: 1.42 !important;
  letter-spacing: 0.01em !important;
  text-transform: none;
}

#section-question .composer .template-switcher,
#section-question .mode-switcher-hint {
  border: 1px solid rgba(20, 22, 20, 0.08) !important;
  border-radius: 14px;
  background:
    linear-gradient(180deg, rgba(247, 247, 244, 0.76) 0%, rgba(236, 237, 232, 0.62) 100%) !important;
  box-shadow:
    0 6px 14px rgba(12, 14, 12, 0.024),
    inset 0 1px 0 rgba(255, 255, 255, 0.72) !important;
}

#section-question .mode-switcher-hint {
  display: grid;
  grid-template-columns: minmax(0, max-content) minmax(0, max-content);
  gap: 5px 18px;
  margin: 0;
  padding: 10px 12px;
  color: rgba(110, 114, 107, 0.72);
  font-size: 0.75rem;
  line-height: 1.48;
}

#section-question .mode-switcher-hint > div {
  min-width: 0;
  white-space: nowrap;
}

#section-question .mode-switcher-hint strong {
  display: inline-block;
  margin-right: 4px;
  color: rgba(47, 58, 51, 0.84);
  font-weight: 760;
}

body[data-theme="dark"] #section-question .mode-switcher-block {
  border-color: rgba(231, 231, 226, 0.08) !important;
  background:
    linear-gradient(180deg, rgba(22, 24, 22, 0.88) 0%, rgba(13, 15, 13, 0.84) 100%) !important;
  box-shadow:
    0 10px 22px rgba(0, 0, 0, 0.14),
    inset 0 1px 0 rgba(255, 255, 255, 0.026) !important;
}

body[data-theme="dark"] #section-question .mode-switcher-title {
  color: #e7e7e2;
}

body[data-theme="dark"] #section-question .composer .template-switcher,
body[data-theme="dark"] #section-question .mode-switcher-hint {
  border-color: rgba(231, 231, 226, 0.08) !important;
  background:
    linear-gradient(180deg, rgba(22, 24, 22, 0.74) 0%, rgba(17, 19, 17, 0.62) 100%) !important;
  box-shadow:
    0 8px 18px rgba(0, 0, 0, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.026) !important;
}

body[data-theme="dark"] #section-question .mode-switcher-hint {
  color: rgba(169, 173, 165, 0.7);
}

body[data-theme="dark"] #section-question .mode-switcher-hint strong {
  color: rgba(231, 231, 226, 0.84);
}

/* Evolved answer document formatting */
.response-card-answer .response-output.rendered {
  width: 100%;
  max-width: none;
  color: #2f241d;
}

.response-card-answer .response-output.rendered > * {
  max-width: none;
}

.response-card-answer .response-output.rendered ul,
.response-card-answer .response-output.rendered ol,
.response-card-answer .response-output.rendered blockquote,
.response-card-answer .response-output.rendered pre {
  max-width: none;
}

.response-card-answer .response-output.rendered h1,
.response-card-answer .response-output.rendered h2,
.response-card-answer .response-output.rendered h3,
.response-card-answer .response-output.rendered h4 {
  margin: 1.35em 0 0.55em;
  color: #17202a;
  font-weight: 820;
  letter-spacing: 0;
}

.response-card-answer .response-output.rendered h1:first-child,
.response-card-answer .response-output.rendered h2:first-child,
.response-card-answer .response-output.rendered h3:first-child,
.response-card-answer .response-output.rendered h4:first-child {
  margin-top: 0;
}

.response-card-answer .response-output.rendered h2 {
  padding-bottom: 9px;
  border-bottom: 1px solid rgba(28, 38, 48, 0.11);
  font-size: 1.16rem;
  line-height: 1.38;
}

.response-card-answer .response-output.rendered h3 {
  font-size: 1.02rem;
  line-height: 1.42;
}

.response-card-answer .response-output.rendered p {
  margin: 0.72em 0 0;
}

.response-card-answer .response-output.rendered ul,
.response-card-answer .response-output.rendered ol {
  margin: 0.82em 0 1em;
  padding-left: 1.35em;
}

.response-card-answer .response-output.rendered li {
  margin: 0.34em 0;
  padding-left: 0.08em;
}

.response-card-answer .response-output.rendered blockquote {
  margin: 1.05em 0;
  padding: 12px 15px;
  border-left: 3px solid rgba(46, 94, 126, 0.5);
  border-radius: 12px;
  background: rgba(233, 241, 247, 0.68);
  color: #334454;
}

.response-card-answer .response-output.rendered code {
  padding: 0.12em 0.34em;
  border-radius: 6px;
  background: rgba(37, 49, 61, 0.08);
  font-size: 0.92em;
}

.response-card-answer .response-output.rendered pre {
  overflow: auto;
  margin: 1em 0;
  padding: 14px 16px;
  border-radius: 14px;
  background: #16212c;
  color: #edf4f9;
}

.response-card-answer .response-output.rendered pre code {
  padding: 0;
  background: transparent;
  color: inherit;
}

.response-card-answer .response-output.rendered .answer-summary-heading {
  margin-top: 1.75em;
  padding: 12px 14px;
  border: 1px solid rgba(46, 94, 126, 0.16);
  border-radius: 14px 14px 0 0;
  background: linear-gradient(180deg, rgba(232, 241, 247, 0.88), rgba(222, 234, 242, 0.72));
}

.response-card-answer .response-output.rendered .answer-summary-heading + p {
  margin-top: 0;
  padding: 14px 15px 15px;
  border: 1px solid rgba(46, 94, 126, 0.16);
  border-top: 0;
  border-radius: 0 0 14px 14px;
  background: rgba(248, 251, 253, 0.84);
}

body[data-theme="dark"] .response-card-answer .response-output.rendered {
  color: #e7e7e2;
}

body[data-theme="dark"] .response-card-answer .response-output.rendered h1,
body[data-theme="dark"] .response-card-answer .response-output.rendered h2,
body[data-theme="dark"] .response-card-answer .response-output.rendered h3,
body[data-theme="dark"] .response-card-answer .response-output.rendered h4 {
  color: #e7e7e2;
}

body[data-theme="dark"] .response-card-answer .response-output.rendered h2 {
  border-bottom-color: rgba(231, 231, 226, 0.15);
}

body[data-theme="dark"] .response-card-answer .response-output.rendered blockquote {
  border-left-color: rgba(83, 98, 85, 0.62);
  background: rgba(62, 74, 66, 0.13);
  color: #e7e7e2;
}

body[data-theme="dark"] .response-card-answer .response-output.rendered code {
  background: rgba(231, 231, 226, 0.12);
}

body[data-theme="dark"] .response-card-answer .response-output.rendered .answer-summary-heading {
  border-color: rgba(83, 98, 85, 0.28);
  background: linear-gradient(180deg, rgba(62, 74, 66, 0.26), rgba(47, 58, 51, 0.18));
}

body[data-theme="dark"] .response-card-answer .response-output.rendered .answer-summary-heading + p {
  border-color: rgba(83, 98, 85, 0.28);
  background: rgba(13, 15, 13, 0.48);
}

/* Final cold minimal textbox unification */
input,
textarea,
.records-search-field input,
.composer .field input,
.composer .field textarea,
.send-preview textarea,
#section-question .field input,
#section-question .field textarea,
#section-question #supplement-panel textarea,
#section-settings input,
#section-settings textarea,
.response-card-answer .response-output,
.history-block {
  background: #f7f7f4 !important;
  border-color: rgba(218, 221, 214, 0.84) !important;
  color: #141614 !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 2px rgba(12, 14, 12, 0.025) !important;
}

input::placeholder,
textarea::placeholder,
.records-search-field input::placeholder,
.composer .field input::placeholder,
.composer .field textarea::placeholder,
.send-preview textarea::placeholder {
  color: rgba(110, 114, 107, 0.72) !important;
}

body[data-theme="dark"] input,
body[data-theme="dark"] textarea,
body[data-theme="dark"] .records-search-field input,
body[data-theme="dark"] .composer .field input,
body[data-theme="dark"] .composer .field textarea,
body[data-theme="dark"] .send-preview textarea,
body[data-theme="dark"] #section-question .field input,
body[data-theme="dark"] #section-question .field textarea,
body[data-theme="dark"] #section-question #supplement-panel textarea,
body[data-theme="dark"] #section-settings input,
body[data-theme="dark"] #section-settings textarea,
body[data-theme="dark"] .response-card-answer .response-output,
body[data-theme="dark"] .history-block {
  background: rgba(231, 231, 226, 0.06) !important;
  border-color: rgba(231, 231, 226, 0.1) !important;
  color: #e7e7e2 !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.05),
    0 1px 2px rgba(0, 0, 0, 0.12) !important;
}

body[data-theme="dark"] input::placeholder,
body[data-theme="dark"] textarea::placeholder,
body[data-theme="dark"] .records-search-field input::placeholder,
body[data-theme="dark"] .composer .field input::placeholder,
body[data-theme="dark"] .composer .field textarea::placeholder,
body[data-theme="dark"] .send-preview textarea::placeholder {
  color: rgba(169, 173, 165, 0.7) !important;
}

/* DISCERN 90s luxury minimalism redesign */
:root {
  --bg: #f2f2ef;
  --bg-deep: #ecede8;
  --card: #f7f7f4;
  --card-strong: #ecede8;
  --line: rgba(20, 22, 20, 0.1);
  --text: #141614;
  --muted: #6e726b;
  --accent: #2f3a33;
  --accent-strong: #141614;
  --shadow: none;
  --radius-xl: 10px;
  --radius-lg: 8px;
  --radius-md: 6px;
  --sans: Inter, "Noto Sans SC", "Source Han Sans SC", "PingFang SC", "Hiragino Sans GB", sans-serif;
  --serif: "Cormorant Garamond", "Playfair Display", Didot, "Bodoni 72", "Times New Roman", serif;
}

body[data-theme="dark"] {
  --bg: #0d0f0d;
  --bg-deep: #111311;
  --card: #111311;
  --card-strong: #161816;
  --line: rgba(231, 231, 226, 0.1);
  --text: #e7e7e2;
  --muted: #a9ada5;
  --accent: #3e4a42;
  --accent-strong: #e7e7e2;
  --shadow: none;
}

html,
body {
  background: #f2f2ef !important;
  color: var(--text) !important;
  font-family: var(--sans) !important;
  font-weight: 400;
  letter-spacing: 0;
}

body[data-theme="dark"] {
  background: #0d0f0d !important;
}

body {
  padding: 28px !important;
}

.page-shell {
  gap: 28px !important;
}

.glass,
.title-banner,
.sidebar,
.panel,
.layout-card,
.response-card,
.response-card-answer,
.response-card-history,
.response-card-conversation,
.response-card-prompt,
.records-filters-stack,
.tool-item,
.history-item,
.history-block-surface,
.session-item,
#section-question #supplement-panel,
#section-question .send-preview,
#section-question .mode-switcher-block {
  background: var(--card) !important;
  border: 1px solid var(--line) !important;
  border-radius: 10px !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

body[data-theme="dark"] .glass,
body[data-theme="dark"] .title-banner,
body[data-theme="dark"] .sidebar,
body[data-theme="dark"] .panel,
body[data-theme="dark"] .layout-card,
body[data-theme="dark"] .response-card,
body[data-theme="dark"] .response-card-answer,
body[data-theme="dark"] .response-card-history,
body[data-theme="dark"] .response-card-conversation,
body[data-theme="dark"] .response-card-prompt,
body[data-theme="dark"] .records-filters-stack,
body[data-theme="dark"] .tool-item,
body[data-theme="dark"] .history-item,
body[data-theme="dark"] .history-block-surface,
body[data-theme="dark"] .session-item,
body[data-theme="dark"] #section-question #supplement-panel,
body[data-theme="dark"] #section-question .send-preview,
body[data-theme="dark"] #section-question .mode-switcher-block {
  background: #111311 !important;
  border-color: rgba(231, 231, 226, 0.1) !important;
}

.title-banner {
  top: 18px !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 28px !important;
  padding: 28px 30px !important;
  border-radius: 8px !important;
}

.title-banner::before {
  display: none !important;
}

.sidebar {
  padding: 28px !important;
  border-radius: 8px !important;
}

.brand-block {
  padding: 0 0 24px !important;
  border-bottom: 1px solid var(--line);
}

.brand-mark {
  display: flex !important;
  align-items: baseline;
  gap: 14px;
  width: fit-content;
  margin: 0 !important;
  color: var(--text) !important;
  background: none !important;
  -webkit-background-clip: initial !important;
  background-clip: initial !important;
  text-shadow: none !important;
  font-family: var(--serif) !important;
  font-weight: 500 !important;
  line-height: 0.95 !important;
}

.brand-main {
  display: inline-block;
  color: var(--text);
  font-family: var(--serif);
  font-size: inherit;
  font-weight: 500;
  letter-spacing: 0.24em;
  text-transform: uppercase;
}

.brand-agent {
  display: inline-block;
  color: var(--muted);
  font-family: var(--sans);
  font-size: 0.22em;
  font-weight: 400;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  transform: translateY(-0.18em);
}

.title-banner h1.brand-mark {
  font-size: 3rem !important;
}

.brand-block h1.brand-mark {
  font-size: 2rem !important;
}

.title-copy,
.brand-copy {
  max-width: 40ch !important;
  margin-top: 12px !important;
  color: var(--muted) !important;
  font-size: 0.78rem !important;
  font-weight: 400 !important;
  line-height: 1.65 !important;
  letter-spacing: 0.04em !important;
}

.panel {
  margin-top: 22px !important;
  padding-top: 22px !important;
  border-top: 1px solid var(--line) !important;
  background: transparent !important;
  border-left: 0 !important;
  border-right: 0 !important;
  border-bottom: 0 !important;
  border-radius: 0 !important;
}

.panel-head h2,
.mode-switcher-title,
.field > span:first-child,
.session-context-label,
.history-block-label,
.conversation-role,
.history-conversation-role {
  color: var(--text) !important;
  font-family: var(--sans) !important;
  font-weight: 500 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

.panel-head h2 {
  font-size: 0.86rem !important;
  line-height: 1.35 !important;
}

.field,
.composer .field,
#section-question .field,
#section-question .field-question-primary,
#section-question .field-concern-secondary {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

input,
textarea,
.records-search-field input,
.composer .field input,
.composer .field textarea,
.send-preview textarea,
#section-question .field input,
#section-question .field textarea,
#section-question #supplement-panel textarea,
#section-settings input,
#section-settings textarea,
.response-card-answer .response-output,
.history-block {
  background: var(--card-strong) !important;
  border: 1px solid var(--line) !important;
  border-radius: 6px !important;
  color: var(--text) !important;
  box-shadow: none !important;
  font-family: var(--sans) !important;
  font-weight: 400 !important;
}

textarea,
#section-question .field textarea,
.send-preview textarea {
  line-height: 1.72 !important;
}

input::placeholder,
textarea::placeholder,
.records-search-field input::placeholder,
.composer .field input::placeholder,
.composer .field textarea::placeholder,
.send-preview textarea::placeholder {
  color: color-mix(in srgb, var(--muted) 70%, transparent) !important;
}

input:focus,
textarea:focus,
.records-search-field input:focus,
.composer .field input:focus,
.composer .field textarea:focus,
.send-preview textarea:focus,
#section-question .field textarea:focus,
#section-question .field input:focus,
#section-question .send-preview textarea:focus {
  background: var(--card) !important;
  border-color: color-mix(in srgb, var(--text) 32%, transparent) !important;
  outline: none !important;
  box-shadow: none !important;
}

.primary-button,
.ghost-button,
.mini-button,
.mini-button-primary,
.page-nav-button,
.template-tab,
.delivery-mode-button,
.records-mode-button,
.records-filter-button,
.session-pin-toggle,
#answer-followup {
  border-radius: 6px !important;
  border: 1px solid var(--line) !important;
  box-shadow: none !important;
  font-family: var(--sans) !important;
  font-size: 0.78rem !important;
  font-weight: 400 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease !important;
}

.primary-button {
  background: #141614 !important;
  border-color: #141614 !important;
  color: #f2f2ef !important;
}

.primary-button:hover {
  background: #2f3a33 !important;
  border-color: #2f3a33 !important;
  box-shadow: none !important;
}

body[data-theme="dark"] .primary-button {
  background: #e7e7e2 !important;
  border-color: #e7e7e2 !important;
  color: #0d0f0d !important;
}

body[data-theme="dark"] .primary-button:hover {
  background: #cfd2ca !important;
  border-color: #cfd2ca !important;
}

.ghost-button,
.mini-button,
.page-nav-button,
.template-tab,
.delivery-mode-button,
.records-mode-button,
.records-filter-button {
  background: transparent !important;
  color: var(--muted) !important;
}

.ghost-button:hover,
.mini-button:hover,
.page-nav-button:hover,
.template-tab:hover,
.delivery-mode-button:hover,
.records-mode-button:hover,
.records-filter-button:hover {
  background: var(--card-strong) !important;
  color: var(--text) !important;
}

.template-tab.active,
.delivery-mode-button.active,
.page-nav-button.active,
.records-mode-button.active,
.records-filter-button.active,
.mini-button-primary,
.session-actions .session-pin-toggle,
#answer-followup:not(:disabled) {
  background: var(--accent) !important;
  border-color: var(--accent) !important;
  color: #f2f2ef !important;
  box-shadow: none !important;
}

body[data-theme="dark"] .template-tab.active,
body[data-theme="dark"] .delivery-mode-button.active,
body[data-theme="dark"] .page-nav-button.active,
body[data-theme="dark"] .records-mode-button.active,
body[data-theme="dark"] .records-filter-button.active,
body[data-theme="dark"] .mini-button-primary,
body[data-theme="dark"] .session-actions .session-pin-toggle,
body[data-theme="dark"] #answer-followup:not(:disabled) {
  background: #3e4a42 !important;
  border-color: #536255 !important;
  color: #e7e7e2 !important;
}

.page-switcher-nav,
.template-switcher,
.delivery-mode-switch,
.records-filter-group,
#section-question .composer .template-switcher,
#section-question .mode-switcher-hint {
  background: transparent !important;
  border: 1px solid var(--line) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  padding: 5px !important;
}

#section-question .mode-switcher-block {
  padding: 18px !important;
}

#section-question .mode-switcher-hint {
  color: var(--muted) !important;
  font-size: 0.72rem !important;
  letter-spacing: 0.02em !important;
}

#section-question .mode-switcher-hint strong {
  color: var(--text) !important;
  font-weight: 500 !important;
}

.response-card-answer .response-output.rendered,
.response-card-answer .response-output {
  color: var(--text) !important;
  background: var(--card-strong) !important;
  border-color: var(--line) !important;
}

.response-card-answer .response-output.rendered h1,
.response-card-answer .response-output.rendered h2,
.response-card-answer .response-output.rendered h3,
.response-card-answer .response-output.rendered h4 {
  color: var(--text) !important;
  font-family: var(--sans) !important;
  font-weight: 500 !important;
  letter-spacing: 0.02em !important;
}

.response-card-answer .response-output.rendered blockquote,
.response-card-answer .response-output.rendered .answer-summary-heading,
.response-card-answer .response-output.rendered .answer-summary-heading + p {
  background: transparent !important;
  border-color: var(--line) !important;
  color: var(--text) !important;
  box-shadow: none !important;
}

.response-card-answer .response-output.rendered blockquote {
  border-left-color: var(--accent) !important;
}

.response-card-answer .response-output.rendered code {
  background: color-mix(in srgb, var(--muted) 12%, transparent) !important;
  color: var(--text) !important;
}

.response-card-answer .response-output.rendered pre {
  background: #141614 !important;
  color: #f2f2ef !important;
  border-radius: 6px !important;
}

body[data-theme="dark"] .response-card-answer .response-output.rendered pre {
  background: #090a09 !important;
  color: #e7e7e2 !important;
}

.title-copy,
.brand-copy,
.hero-copy,
.section-note,
.micro-copy,
.tool-desc,
.send-preview-copy,
.records-filter-caption,
.field-meta,
.answer-note,
.history-meta,
.history-answer-preview {
  color: var(--muted) !important;
  font-weight: 400 !important;
}

.status-pill,
.status-pill-save,
.history-state-pinned,
.session-pin {
  background: transparent !important;
  border: 1px solid var(--line) !important;
  border-radius: 999px !important;
  color: var(--muted) !important;
  box-shadow: none !important;
}

.history-item.pinned,
.session-item.pinned {
  border-color: color-mix(in srgb, var(--accent) 45%, var(--line)) !important;
  box-shadow: none !important;
}

svg,
.icon,
[class*="icon"] {
  color: var(--muted) !important;
  stroke-width: 1.35px !important;
}

/* Restore DISCERN-era rounded pills for tag controls */
.page-switcher-nav,
.template-switcher,
.delivery-mode-switch,
.records-filter-group,
#section-question .composer .template-switcher {
  border-radius: 999px !important;
  padding: 5px !important;
}

.page-nav-button,
.template-tab,
.delivery-mode-button,
.records-mode-button,
.records-filter-button {
  min-height: 34px !important;
  padding: 8px 16px !important;
  border-radius: 999px !important;
  letter-spacing: 0.04em !important;
  text-transform: none !important;
}

#section-question .template-tab {
  min-height: 36px !important;
  padding: 8px 17px !important;
}

.template-tab.active,
.delivery-mode-button.active,
.page-nav-button.active,
.records-mode-button.active,
.records-filter-button.active {
  border-radius: 999px !important;
}

@media (max-width: 760px) {
  body {
    padding: 18px !important;
  }

  .title-banner {
    padding: 22px !important;
  }

  .title-banner h1.brand-mark {
    font-size: 2.05rem !important;
  }

  .brand-block h1.brand-mark {
    font-size: 1.78rem !important;
  }

  .brand-main {
    letter-spacing: 0.22em;
  }
}

/* Final gray-glass restoration: grey base + translucent green glass */
:root {
  --bg: #e8ecef;
  --bg-deep: #d1d7dd;
  --card: rgba(247, 249, 251, 0.72);
  --card-strong: rgba(239, 244, 241, 0.68);
  --line: rgba(37, 48, 42, 0.12);
  --text: #161c22;
  --muted: #68727c;
  --accent: #526a5b;
  --accent-strong: #1f2f26;
  --shadow: 0 18px 34px rgba(24, 30, 35, 0.06);
}

body[data-theme="dark"] {
  --bg: #0d1013;
  --bg-deep: #151a1f;
  --card: rgba(21, 25, 29, 0.74);
  --card-strong: rgba(24, 31, 27, 0.58);
  --line: rgba(231, 237, 232, 0.1);
  --text: #edf2f6;
  --muted: #98a1aa;
  --accent: #708e7b;
  --accent-strong: #e3eee7;
  --shadow: 0 20px 38px rgba(0, 0, 0, 0.22);
}

html,
body {
  background:
    radial-gradient(circle at top left, rgba(112, 120, 128, 0.13), transparent 24rem),
    radial-gradient(circle at bottom right, rgba(128, 156, 135, 0.13), transparent 22rem),
    linear-gradient(180deg, #eef2f5 0%, #e3e8ed 52%, #d7dde3 100%) !important;
}

body[data-theme="dark"] {
  background:
    radial-gradient(circle at top left, rgba(96, 104, 112, 0.14), transparent 22rem),
    radial-gradient(circle at bottom right, rgba(72, 96, 80, 0.14), transparent 20rem),
    linear-gradient(180deg, #0c0f12 0%, #12161a 52%, #181d22 100%) !important;
}

.glass,
.title-banner,
.sidebar,
.response-card,
.response-card-answer,
.response-card-history,
.response-card-conversation,
.response-card-prompt,
.sidebar .panel,
#section-question #supplement-panel,
#section-question .send-preview,
#section-question .mode-switcher-block,
.records-filters-stack,
.tool-item,
.history-item,
.history-block-surface,
.session-item {
  background: var(--card) !important;
  border: 1px solid rgba(255, 255, 255, 0.68) !important;
  border-radius: 18px !important;
  box-shadow:
    var(--shadow),
    inset 0 1px 0 rgba(255, 255, 255, 0.78) !important;
  backdrop-filter: blur(24px) saturate(108%) !important;
  -webkit-backdrop-filter: blur(24px) saturate(108%) !important;
}

body[data-theme="dark"] .glass,
body[data-theme="dark"] .title-banner,
body[data-theme="dark"] .sidebar,
body[data-theme="dark"] .response-card,
body[data-theme="dark"] .response-card-answer,
body[data-theme="dark"] .response-card-history,
body[data-theme="dark"] .response-card-conversation,
body[data-theme="dark"] .response-card-prompt,
body[data-theme="dark"] .sidebar .panel,
body[data-theme="dark"] #section-question #supplement-panel,
body[data-theme="dark"] #section-question .send-preview,
body[data-theme="dark"] #section-question .mode-switcher-block,
body[data-theme="dark"] .records-filters-stack,
body[data-theme="dark"] .tool-item,
body[data-theme="dark"] .history-item,
body[data-theme="dark"] .history-block-surface,
body[data-theme="dark"] .session-item {
  background: var(--card) !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
  box-shadow:
    var(--shadow),
    inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}

.title-banner {
  border-radius: 18px !important;
}

.sidebar {
  border-radius: 20px !important;
}

.panel {
  background: transparent !important;
  border-top-color: rgba(37, 48, 42, 0.1) !important;
}

body[data-theme="dark"] .panel {
  border-top-color: rgba(231, 237, 232, 0.08) !important;
}

input,
textarea,
.records-search-field input,
.composer .field input,
.composer .field textarea,
.send-preview textarea,
#section-question .field input,
#section-question .field textarea,
#section-question #supplement-panel textarea,
#section-settings input,
#section-settings textarea,
.response-card-answer .response-output,
.history-block,
#section-question .composer .template-switcher,
#section-question .mode-switcher-hint,
.page-switcher-nav,
.template-switcher,
.delivery-mode-switch,
.records-filter-group {
  background: rgba(255, 255, 255, 0.58) !important;
  border-color: rgba(221, 227, 232, 0.78) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.86),
    0 1px 2px rgba(24, 30, 35, 0.02) !important;
  backdrop-filter: blur(18px) saturate(106%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(106%) !important;
}

body[data-theme="dark"] input,
body[data-theme="dark"] textarea,
body[data-theme="dark"] .records-search-field input,
body[data-theme="dark"] .composer .field input,
body[data-theme="dark"] .composer .field textarea,
body[data-theme="dark"] .send-preview textarea,
body[data-theme="dark"] #section-question .field input,
body[data-theme="dark"] #section-question .field textarea,
body[data-theme="dark"] #section-question #supplement-panel textarea,
body[data-theme="dark"] #section-settings input,
body[data-theme="dark"] #section-settings textarea,
body[data-theme="dark"] .response-card-answer .response-output,
body[data-theme="dark"] .history-block,
body[data-theme="dark"] #section-question .composer .template-switcher,
body[data-theme="dark"] #section-question .mode-switcher-hint,
body[data-theme="dark"] .page-switcher-nav,
body[data-theme="dark"] .template-switcher,
body[data-theme="dark"] .delivery-mode-switch,
body[data-theme="dark"] .records-filter-group {
  background: rgba(255, 255, 255, 0.05) !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.05),
    0 1px 2px rgba(0, 0, 0, 0.12) !important;
}

.template-tab.active,
.delivery-mode-button.active,
.page-nav-button.active,
.records-mode-button.active,
.records-filter-button.active,
.mini-button-primary,
.session-actions .session-pin-toggle,
#answer-followup:not(:disabled) {
  background: linear-gradient(135deg, rgba(128, 156, 135, 0.34) 0%, rgba(84, 108, 92, 0.46) 100%) !important;
  border-color: rgba(95, 121, 103, 0.24) !important;
  color: #1f2f26 !important;
  box-shadow:
    0 8px 18px rgba(28, 40, 32, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.66) !important;
}

body[data-theme="dark"] .template-tab.active,
body[data-theme="dark"] .delivery-mode-button.active,
body[data-theme="dark"] .page-nav-button.active,
body[data-theme="dark"] .records-mode-button.active,
body[data-theme="dark"] .records-filter-button.active,
body[data-theme="dark"] .mini-button-primary,
body[data-theme="dark"] .session-actions .session-pin-toggle,
body[data-theme="dark"] #answer-followup:not(:disabled) {
  background: linear-gradient(135deg, rgba(112, 142, 123, 0.42) 0%, rgba(57, 77, 64, 0.58) 100%) !important;
  border-color: rgba(128, 160, 139, 0.24) !important;
  color: #e3eee7 !important;
  box-shadow:
    0 8px 18px rgba(0, 0, 0, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.11) !important;
}

.primary-button {
  background: linear-gradient(135deg, rgba(82, 112, 92, 1) 0%, rgba(35, 54, 43, 1) 100%) !important;
  border-color: rgba(64, 95, 77, 0.4) !important;
  color: #f4f7f3 !important;
  box-shadow:
    0 14px 28px rgba(20, 34, 26, 0.16),
    inset 0 1px 0 rgba(255, 255, 255, 0.16) !important;
}

body[data-theme="dark"] .primary-button {
  background: linear-gradient(135deg, rgba(76, 104, 86, 1) 0%, rgba(30, 45, 35, 1) 100%) !important;
  border-color: rgba(128, 160, 139, 0.3) !important;
  color: #e3eee7 !important;
}

/* Keep DISCERN-era rounded pills */
.page-switcher-nav,
.template-switcher,
.delivery-mode-switch,
.records-filter-group,
#section-question .composer .template-switcher {
  border-radius: 999px !important;
  padding: 5px !important;
}

.page-nav-button,
.template-tab,
.delivery-mode-button,
.records-mode-button,
.records-filter-button {
  border-radius: 999px !important;
}

/* Unified button/tag format across all pages */
.page-switcher-nav,
.template-switcher,
.delivery-mode-switch,
.records-filter-group,
#section-question .composer .template-switcher {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 5px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(221, 227, 232, 0.78) !important;
  background: rgba(255, 255, 255, 0.46) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.76),
    0 1px 2px rgba(24, 30, 35, 0.018) !important;
  backdrop-filter: blur(18px) saturate(106%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(106%) !important;
}

body[data-theme="dark"] .page-switcher-nav,
body[data-theme="dark"] .template-switcher,
body[data-theme="dark"] .delivery-mode-switch,
body[data-theme="dark"] .records-filter-group,
body[data-theme="dark"] #section-question .composer .template-switcher {
  border-color: rgba(255, 255, 255, 0.1) !important;
  background: rgba(255, 255, 255, 0.045) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.05),
    0 1px 2px rgba(0, 0, 0, 0.12) !important;
}

.page-nav-button,
.template-tab,
.delivery-mode-button,
.records-mode-button,
.records-filter-button,
.history-mode,
.history-state-pinned,
.history-state-session,
.history-state-single,
.status-pill,
.status-pill-save,
.session-pin {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 34px !important;
  padding: 8px 16px !important;
  border-radius: 999px !important;
  border: 1px solid transparent !important;
  background: transparent !important;
  color: var(--muted) !important;
  box-shadow: none !important;
  font-family: var(--sans) !important;
  font-size: 0.84rem !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  letter-spacing: 0.02em !important;
  text-transform: none !important;
  white-space: nowrap !important;
}

.page-nav-button:hover,
.template-tab:hover,
.delivery-mode-button:hover,
.records-mode-button:hover,
.records-filter-button:hover {
  background: rgba(255, 255, 255, 0.58) !important;
  border-color: rgba(221, 227, 232, 0.72) !important;
  color: var(--text) !important;
}

body[data-theme="dark"] .page-nav-button:hover,
body[data-theme="dark"] .template-tab:hover,
body[data-theme="dark"] .delivery-mode-button:hover,
body[data-theme="dark"] .records-mode-button:hover,
body[data-theme="dark"] .records-filter-button:hover {
  background: rgba(255, 255, 255, 0.075) !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
  color: var(--text) !important;
}

.page-nav-button.active,
.template-tab.active,
.delivery-mode-button.active,
.records-mode-button.active,
.records-filter-button.active,
.status-pill:not(.subtle),
.status-pill-save,
.history-state-pinned,
.session-pin {
  background: linear-gradient(135deg, rgba(128, 156, 135, 0.34) 0%, rgba(84, 108, 92, 0.46) 100%) !important;
  border-color: rgba(95, 121, 103, 0.24) !important;
  color: #1f2f26 !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.62) !important;
}

body[data-theme="dark"] .page-nav-button.active,
body[data-theme="dark"] .template-tab.active,
body[data-theme="dark"] .delivery-mode-button.active,
body[data-theme="dark"] .records-mode-button.active,
body[data-theme="dark"] .records-filter-button.active,
body[data-theme="dark"] .status-pill:not(.subtle),
body[data-theme="dark"] .status-pill-save,
body[data-theme="dark"] .history-state-pinned,
body[data-theme="dark"] .session-pin {
  background: linear-gradient(135deg, rgba(112, 142, 123, 0.42) 0%, rgba(57, 77, 64, 0.58) 100%) !important;
  border-color: rgba(128, 160, 139, 0.24) !important;
  color: #e3eee7 !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.1) !important;
}

.page-nav-button:disabled,
.template-tab:disabled,
.delivery-mode-button:disabled,
.records-mode-button:disabled,
.records-filter-button:disabled {
  opacity: 0.45 !important;
  cursor: not-allowed !important;
}

/* Final supplement panel glass sync */
#section-question #supplement-panel {
  background: rgba(247, 249, 251, 0.72) !important;
  border: 1px solid rgba(255, 255, 255, 0.68) !important;
  border-radius: 18px !important;
  box-shadow:
    0 18px 34px rgba(24, 30, 35, 0.06),
    inset 0 1px 0 rgba(255, 255, 255, 0.78) !important;
  backdrop-filter: blur(24px) saturate(108%) !important;
  -webkit-backdrop-filter: blur(24px) saturate(108%) !important;
}

#section-question #supplement-panel .supplement-card,
#section-question #supplement-panel textarea {
  background: rgba(255, 255, 255, 0.58) !important;
  border: 1px solid rgba(221, 227, 232, 0.78) !important;
  border-radius: 14px !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.86),
    0 1px 2px rgba(24, 30, 35, 0.02) !important;
  backdrop-filter: blur(18px) saturate(106%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(106%) !important;
}

#section-question #supplement-panel textarea {
  border-radius: 10px !important;
}

#section-question #supplement-panel .supplement-panel-title {
  color: var(--text) !important;
}

#section-question #supplement-panel .supplement-panel-copy,
#section-question #supplement-panel .supplement-card span {
  color: var(--muted) !important;
}

body[data-theme="dark"] #section-question #supplement-panel {
  background: rgba(21, 25, 29, 0.74) !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
  box-shadow:
    0 20px 38px rgba(0, 0, 0, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}

body[data-theme="dark"] #section-question #supplement-panel .supplement-card,
body[data-theme="dark"] #section-question #supplement-panel textarea {
  background: rgba(255, 255, 255, 0.05) !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.05),
    0 1px 2px rgba(0, 0, 0, 0.12) !important;
}

/* Final clear glass pass: restore the lighter DISCERN translucency for DISCERN. */
body {
  background:
    radial-gradient(circle at 16% 8%, rgba(255, 255, 255, 0.92), transparent 30%),
    radial-gradient(circle at 82% 4%, rgba(210, 224, 216, 0.46), transparent 34%),
    linear-gradient(135deg, #edf1f4 0%, #f8fafb 46%, #e5ebee 100%) !important;
}

body[data-theme="dark"] {
  background:
    radial-gradient(circle at 18% 6%, rgba(98, 123, 105, 0.14), transparent 34%),
    radial-gradient(circle at 86% 10%, rgba(174, 196, 181, 0.08), transparent 32%),
    linear-gradient(135deg, #121719 0%, #171d1f 48%, #0f1416 100%) !important;
}

.glass,
.title-banner,
.sidebar,
.response-card,
.response-card-answer,
.response-card-history,
.response-card-conversation,
.response-card-prompt,
.sidebar .panel,
#section-question #supplement-panel,
#section-question .send-preview,
#section-question .mode-switcher-block,
.records-filters-stack,
.tool-item,
.history-item,
.history-block-surface,
.session-item {
  background: rgba(250, 252, 253, 0.58) !important;
  border-color: rgba(255, 255, 255, 0.74) !important;
  box-shadow:
    0 18px 40px rgba(37, 48, 54, 0.055),
    inset 0 1px 0 rgba(255, 255, 255, 0.84) !important;
  backdrop-filter: blur(30px) saturate(116%) !important;
  -webkit-backdrop-filter: blur(30px) saturate(116%) !important;
}

body[data-theme="dark"] .glass,
body[data-theme="dark"] .title-banner,
body[data-theme="dark"] .sidebar,
body[data-theme="dark"] .response-card,
body[data-theme="dark"] .response-card-answer,
body[data-theme="dark"] .response-card-history,
body[data-theme="dark"] .response-card-conversation,
body[data-theme="dark"] .response-card-prompt,
body[data-theme="dark"] .sidebar .panel,
body[data-theme="dark"] #section-question #supplement-panel,
body[data-theme="dark"] #section-question .send-preview,
body[data-theme="dark"] #section-question .mode-switcher-block,
body[data-theme="dark"] .records-filters-stack,
body[data-theme="dark"] .tool-item,
body[data-theme="dark"] .history-item,
body[data-theme="dark"] .history-block-surface,
body[data-theme="dark"] .session-item {
  background: rgba(23, 29, 31, 0.58) !important;
  border-color: rgba(231, 237, 232, 0.11) !important;
  box-shadow:
    0 20px 44px rgba(0, 0, 0, 0.2),
    inset 0 1px 0 rgba(255, 255, 255, 0.085) !important;
}

input,
textarea,
.records-search-field input,
.composer .field input,
.composer .field textarea,
.send-preview textarea,
#section-question .field input,
#section-question .field textarea,
#section-question #supplement-panel .supplement-card,
#section-question #supplement-panel textarea,
#section-settings input,
#section-settings textarea,
.response-card-answer .response-output,
.history-block,
#section-question .composer .template-switcher,
#section-question .mode-switcher-hint,
.page-switcher-nav,
.template-switcher,
.delivery-mode-switch,
.records-filter-group {
  background: rgba(255, 255, 255, 0.48) !important;
  border-color: rgba(217, 226, 231, 0.76) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 2px rgba(24, 30, 35, 0.018) !important;
  backdrop-filter: blur(22px) saturate(112%) !important;
  -webkit-backdrop-filter: blur(22px) saturate(112%) !important;
}

body[data-theme="dark"] input,
body[data-theme="dark"] textarea,
body[data-theme="dark"] .records-search-field input,
body[data-theme="dark"] .composer .field input,
body[data-theme="dark"] .composer .field textarea,
body[data-theme="dark"] .send-preview textarea,
body[data-theme="dark"] #section-question .field input,
body[data-theme="dark"] #section-question .field textarea,
body[data-theme="dark"] #section-question #supplement-panel .supplement-card,
body[data-theme="dark"] #section-question #supplement-panel textarea,
body[data-theme="dark"] #section-settings input,
body[data-theme="dark"] #section-settings textarea,
body[data-theme="dark"] .response-card-answer .response-output,
body[data-theme="dark"] .history-block,
body[data-theme="dark"] #section-question .composer .template-switcher,
body[data-theme="dark"] #section-question .mode-switcher-hint,
body[data-theme="dark"] .page-switcher-nav,
body[data-theme="dark"] .template-switcher,
body[data-theme="dark"] .delivery-mode-switch,
body[data-theme="dark"] .records-filter-group {
  background: rgba(255, 255, 255, 0.052) !important;
  border-color: rgba(231, 237, 232, 0.1) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.06),
    0 1px 2px rgba(0, 0, 0, 0.12) !important;
}

/* Final unified rounded action buttons across every lower page section. */
button.ghost-button,
button.mini-button,
button.session-mini,
button.primary-button,
button.mini-button-primary,
.button-row .ghost-button,
.button-row .primary-button,
.answer-actions .ghost-button,
.panel-tools .ghost-button,
.history-actions .mini-button,
.session-actions .session-mini,
.session-actions .session-pin-toggle,
#section-tools .tool-item .ghost-button,
#section-records-filters .ghost-button,
#section-settings .ghost-button,
#section-prompt .ghost-button,
#open-chatgpt,
#clear-draft,
#copy-user-prompt-settings,
#copy-system-prompt-settings,
#clear-history,
#toggle-conversation,
#toggle-system-prompt,
#toggle-render-mode,
#toggle-settings,
#toggle-structure,
#answer-followup,
#answer-refine,
#answer-favorite,
#copy-response,
#resume-session,
#leave-session,
#clear-settings,
#save-settings,
#send-request {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 36px !important;
  padding: 9px 17px !important;
  border-radius: 999px !important;
  font-family: var(--sans) !important;
  font-size: 0.84rem !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  letter-spacing: 0.02em !important;
  text-transform: none !important;
  white-space: nowrap !important;
  backdrop-filter: blur(20px) saturate(112%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(112%) !important;
}

button.ghost-button,
button.mini-button,
button.session-mini,
.answer-actions .ghost-button,
.panel-tools .ghost-button,
.button-row .ghost-button,
.history-actions .mini-button:not(.mini-button-primary),
.session-actions .session-mini:not(.session-resume):not(.session-pin-toggle),
#section-tools .tool-item .ghost-button,
#section-records-filters .ghost-button,
#section-settings .ghost-button,
#section-prompt .ghost-button {
  background: rgba(255, 255, 255, 0.44) !important;
  border: 1px solid rgba(217, 226, 231, 0.76) !important;
  color: var(--muted) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.84),
    0 1px 2px rgba(24, 30, 35, 0.018) !important;
}

button.ghost-button:hover,
button.mini-button:hover,
button.session-mini:hover,
.answer-actions .ghost-button:hover,
.panel-tools .ghost-button:hover,
.button-row .ghost-button:hover,
.history-actions .mini-button:not(.mini-button-primary):hover,
.session-actions .session-mini:not(.session-resume):not(.session-pin-toggle):hover,
#section-tools .tool-item .ghost-button:hover,
#section-records-filters .ghost-button:hover,
#section-settings .ghost-button:hover,
#section-prompt .ghost-button:hover {
  background: rgba(255, 255, 255, 0.62) !important;
  border-color: rgba(206, 218, 224, 0.82) !important;
  color: var(--text) !important;
  transform: none !important;
}

body[data-theme="dark"] button.ghost-button,
body[data-theme="dark"] button.mini-button,
body[data-theme="dark"] button.session-mini,
body[data-theme="dark"] .answer-actions .ghost-button,
body[data-theme="dark"] .panel-tools .ghost-button,
body[data-theme="dark"] .button-row .ghost-button,
body[data-theme="dark"] .history-actions .mini-button:not(.mini-button-primary),
body[data-theme="dark"] .session-actions .session-mini:not(.session-resume):not(.session-pin-toggle),
body[data-theme="dark"] #section-tools .tool-item .ghost-button,
body[data-theme="dark"] #section-records-filters .ghost-button,
body[data-theme="dark"] #section-settings .ghost-button,
body[data-theme="dark"] #section-prompt .ghost-button {
  background: rgba(255, 255, 255, 0.052) !important;
  border-color: rgba(231, 237, 232, 0.1) !important;
  color: var(--muted) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.06),
    0 1px 2px rgba(0, 0, 0, 0.12) !important;
}

body[data-theme="dark"] button.ghost-button:hover,
body[data-theme="dark"] button.mini-button:hover,
body[data-theme="dark"] button.session-mini:hover,
body[data-theme="dark"] .answer-actions .ghost-button:hover,
body[data-theme="dark"] .panel-tools .ghost-button:hover,
body[data-theme="dark"] .button-row .ghost-button:hover,
body[data-theme="dark"] .history-actions .mini-button:not(.mini-button-primary):hover,
body[data-theme="dark"] .session-actions .session-mini:not(.session-resume):not(.session-pin-toggle):hover,
body[data-theme="dark"] #section-tools .tool-item .ghost-button:hover,
body[data-theme="dark"] #section-records-filters .ghost-button:hover,
body[data-theme="dark"] #section-settings .ghost-button:hover,
body[data-theme="dark"] #section-prompt .ghost-button:hover {
  background: rgba(255, 255, 255, 0.082) !important;
  border-color: rgba(231, 237, 232, 0.14) !important;
  color: var(--text) !important;
}

button.primary-button,
button.primary-button.accent,
button.mini-button-primary,
.history-actions .mini-button-primary,
.session-actions .session-resume,
.session-actions .session-pin-toggle,
#send-request,
#save-settings,
#answer-followup:not(:disabled) {
  border-radius: 999px !important;
  background: linear-gradient(135deg, rgba(118, 147, 125, 0.88) 0%, rgba(53, 77, 62, 0.96) 100%) !important;
  border-color: rgba(88, 119, 97, 0.36) !important;
  color: #f6faf7 !important;
  box-shadow:
    0 12px 24px rgba(20, 34, 26, 0.13),
    inset 0 1px 0 rgba(255, 255, 255, 0.22) !important;
}

body[data-theme="dark"] button.primary-button,
body[data-theme="dark"] button.primary-button.accent,
body[data-theme="dark"] button.mini-button-primary,
body[data-theme="dark"] .history-actions .mini-button-primary,
body[data-theme="dark"] .session-actions .session-resume,
body[data-theme="dark"] .session-actions .session-pin-toggle,
body[data-theme="dark"] #send-request,
body[data-theme="dark"] #save-settings,
body[data-theme="dark"] #answer-followup:not(:disabled) {
  background: linear-gradient(135deg, rgba(112, 142, 123, 0.54) 0%, rgba(45, 65, 52, 0.72) 100%) !important;
  border-color: rgba(128, 160, 139, 0.25) !important;
  color: #e8f2eb !important;
  box-shadow:
    0 10px 22px rgba(0, 0, 0, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
}

/* Absolute final override: all pages use neutral inactive states and green selected states. */
body .title-nav .page-nav-button:not(.active):not(:disabled),
body #section-question .template-tab:not(.active):not(:disabled),
body #section-settings .delivery-mode-button:not(.active):not(:disabled),
body #section-records-filters .records-filter-button:not(.active):not(:disabled),
body #section-records-filters .records-mode-button:not(.active):not(:disabled),
body #section-settings .ghost-button:not(.delivery-mode-button):not(:disabled),
body #section-structure .ghost-button:not(:disabled),
body #section-tools .tool-item .ghost-button:not(:disabled),
body #section-history .ghost-button:not(:disabled),
body #section-conversation .ghost-button:not(:disabled),
body #section-prompt .ghost-button:not(:disabled),
body #section-answer .ghost-button:not(#answer-followup):not(:disabled),
body #section-question .ghost-button:not(#open-chatgpt):not(#resume-session):not(:disabled),
body .history-actions .mini-button:not(.mini-button-primary):not(:disabled),
body .session-actions .session-mini:not(.session-resume):not(.session-pin-toggle):not(:disabled) {
  background: rgba(255, 255, 255, 0.44) !important;
  border: 1px solid rgba(217, 226, 231, 0.76) !important;
  color: var(--muted) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.84),
    0 1px 2px rgba(24, 30, 35, 0.018) !important;
}

body .title-nav .page-nav-button.active:not(:disabled),
body #section-question .template-tab.active:not(:disabled),
body #section-settings .delivery-mode-button.active:not(:disabled),
body #section-records-filters .records-filter-button.active:not(:disabled),
body #section-records-filters .records-mode-button.active:not(:disabled),
body #section-question .primary-button:not(:disabled),
body #section-settings .primary-button:not(:disabled),
body #open-chatgpt:not(:disabled),
body #resume-session:not(:disabled),
body #answer-followup:not(:disabled),
body .history-actions .mini-button-primary:not(:disabled),
body .session-actions .session-resume:not(:disabled),
body .session-actions .session-pin-toggle:not(:disabled) {
  background: linear-gradient(135deg, rgba(118, 147, 125, 0.88) 0%, rgba(53, 77, 62, 0.96) 100%) !important;
  border: 1px solid rgba(88, 119, 97, 0.36) !important;
  color: #f6faf7 !important;
  box-shadow:
    0 12px 24px rgba(20, 34, 26, 0.13),
    inset 0 1px 0 rgba(255, 255, 255, 0.22) !important;
}

body[data-theme="dark"] .title-nav .page-nav-button:not(.active):not(:disabled),
body[data-theme="dark"] #section-question .template-tab:not(.active):not(:disabled),
body[data-theme="dark"] #section-settings .delivery-mode-button:not(.active):not(:disabled),
body[data-theme="dark"] #section-records-filters .records-filter-button:not(.active):not(:disabled),
body[data-theme="dark"] #section-records-filters .records-mode-button:not(.active):not(:disabled),
body[data-theme="dark"] #section-settings .ghost-button:not(.delivery-mode-button):not(:disabled),
body[data-theme="dark"] #section-structure .ghost-button:not(:disabled),
body[data-theme="dark"] #section-tools .tool-item .ghost-button:not(:disabled),
body[data-theme="dark"] #section-history .ghost-button:not(:disabled),
body[data-theme="dark"] #section-conversation .ghost-button:not(:disabled),
body[data-theme="dark"] #section-prompt .ghost-button:not(:disabled),
body[data-theme="dark"] #section-answer .ghost-button:not(#answer-followup):not(:disabled),
body[data-theme="dark"] #section-question .ghost-button:not(#open-chatgpt):not(#resume-session):not(:disabled),
body[data-theme="dark"] .history-actions .mini-button:not(.mini-button-primary):not(:disabled),
body[data-theme="dark"] .session-actions .session-mini:not(.session-resume):not(.session-pin-toggle):not(:disabled) {
  background: rgba(255, 255, 255, 0.052) !important;
  border-color: rgba(231, 237, 232, 0.1) !important;
  color: var(--muted) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.06),
    0 1px 2px rgba(0, 0, 0, 0.12) !important;
}

body[data-theme="dark"] .title-nav .page-nav-button.active:not(:disabled),
body[data-theme="dark"] #section-question .template-tab.active:not(:disabled),
body[data-theme="dark"] #section-settings .delivery-mode-button.active:not(:disabled),
body[data-theme="dark"] #section-records-filters .records-filter-button.active:not(:disabled),
body[data-theme="dark"] #section-records-filters .records-mode-button.active:not(:disabled),
body[data-theme="dark"] #section-question .primary-button:not(:disabled),
body[data-theme="dark"] #section-settings .primary-button:not(:disabled),
body[data-theme="dark"] #open-chatgpt:not(:disabled),
body[data-theme="dark"] #resume-session:not(:disabled),
body[data-theme="dark"] #answer-followup:not(:disabled),
body[data-theme="dark"] .history-actions .mini-button-primary:not(:disabled),
body[data-theme="dark"] .session-actions .session-resume:not(:disabled),
body[data-theme="dark"] .session-actions .session-pin-toggle:not(:disabled) {
  background: linear-gradient(135deg, rgba(112, 142, 123, 0.54) 0%, rgba(45, 65, 52, 0.72) 100%) !important;
  border-color: rgba(128, 160, 139, 0.25) !important;
  color: #e8f2eb !important;
  box-shadow:
    0 10px 22px rgba(0, 0, 0, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
}

/* Final visual contract at the real file end: clear gray-green glass across all pages. */
body {
  background:
    radial-gradient(circle at 13% 8%, rgba(255, 255, 255, 0.96), transparent 30%),
    radial-gradient(circle at 78% 2%, rgba(206, 224, 214, 0.42), transparent 34%),
    radial-gradient(circle at 88% 88%, rgba(180, 198, 189, 0.24), transparent 32%),
    linear-gradient(135deg, #edf1f3 0%, #f8fafb 48%, #e4eaed 100%) !important;
}

body[data-theme="dark"] {
  background:
    radial-gradient(circle at 14% 4%, rgba(128, 158, 136, 0.13), transparent 34%),
    radial-gradient(circle at 86% 8%, rgba(206, 224, 214, 0.07), transparent 34%),
    radial-gradient(circle at 84% 92%, rgba(128, 158, 136, 0.08), transparent 32%),
    linear-gradient(135deg, #111719 0%, #171d1f 48%, #0e1415 100%) !important;
}

body .glass,
body .title-banner,
body .hero,
body .sidebar,
body .composer,
body .response-card,
body .response-card-answer,
body .response-card-history,
body .response-card-conversation,
body .response-card-prompt,
body .sidebar .panel,
body #section-settings,
body #section-structure,
body #section-tools,
body #section-records-filters,
body #section-question,
body #section-answer,
body #section-history,
body #section-conversation,
body #section-prompt,
body #section-question #supplement-panel,
body #section-question .send-preview,
body #section-question .mode-switcher-block,
body .records-filters-stack,
body .records-filter-block,
body .tool-item,
body .history-item,
body .history-block-surface,
body .session-item,
body .conversation-toolbar {
  background: rgba(250, 252, 253, 0.48) !important;
  border-color: rgba(255, 255, 255, 0.72) !important;
  box-shadow:
    0 18px 42px rgba(34, 45, 50, 0.045),
    inset 0 1px 0 rgba(255, 255, 255, 0.82) !important;
  backdrop-filter: blur(32px) saturate(118%) !important;
  -webkit-backdrop-filter: blur(32px) saturate(118%) !important;
}

body[data-theme="dark"] .glass,
body[data-theme="dark"] .title-banner,
body[data-theme="dark"] .hero,
body[data-theme="dark"] .sidebar,
body[data-theme="dark"] .composer,
body[data-theme="dark"] .response-card,
body[data-theme="dark"] .response-card-answer,
body[data-theme="dark"] .response-card-history,
body[data-theme="dark"] .response-card-conversation,
body[data-theme="dark"] .response-card-prompt,
body[data-theme="dark"] .sidebar .panel,
body[data-theme="dark"] #section-settings,
body[data-theme="dark"] #section-structure,
body[data-theme="dark"] #section-tools,
body[data-theme="dark"] #section-records-filters,
body[data-theme="dark"] #section-question,
body[data-theme="dark"] #section-answer,
body[data-theme="dark"] #section-history,
body[data-theme="dark"] #section-conversation,
body[data-theme="dark"] #section-prompt,
body[data-theme="dark"] #section-question #supplement-panel,
body[data-theme="dark"] #section-question .send-preview,
body[data-theme="dark"] #section-question .mode-switcher-block,
body[data-theme="dark"] .records-filters-stack,
body[data-theme="dark"] .records-filter-block,
body[data-theme="dark"] .tool-item,
body[data-theme="dark"] .history-item,
body[data-theme="dark"] .history-block-surface,
body[data-theme="dark"] .session-item,
body[data-theme="dark"] .conversation-toolbar {
  background: rgba(22, 28, 30, 0.5) !important;
  border-color: rgba(231, 237, 232, 0.105) !important;
  box-shadow:
    0 20px 44px rgba(0, 0, 0, 0.19),
    inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}

body input,
body textarea,
body .records-search-field,
body .records-search-field input,
body .composer .field input,
body .composer .field textarea,
body .send-preview textarea,
body #section-question .field input,
body #section-question .field textarea,
body #section-question #supplement-panel .supplement-card,
body #section-question #supplement-panel textarea,
body #section-settings input,
body #section-settings textarea,
body .response-card-answer .response-output,
body .history-block,
body .conversation-thread,
body #section-question .composer .template-switcher,
body #section-question .mode-switcher-hint,
body .page-switcher-nav,
body .template-switcher,
body .delivery-mode-switch,
body .records-filter-group {
  background: rgba(255, 255, 255, 0.4) !important;
  border-color: rgba(220, 228, 232, 0.68) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.86),
    0 1px 2px rgba(24, 30, 35, 0.014) !important;
  backdrop-filter: blur(24px) saturate(114%) !important;
  -webkit-backdrop-filter: blur(24px) saturate(114%) !important;
}

body[data-theme="dark"] input,
body[data-theme="dark"] textarea,
body[data-theme="dark"] .records-search-field,
body[data-theme="dark"] .records-search-field input,
body[data-theme="dark"] .composer .field input,
body[data-theme="dark"] .composer .field textarea,
body[data-theme="dark"] .send-preview textarea,
body[data-theme="dark"] #section-question .field input,
body[data-theme="dark"] #section-question .field textarea,
body[data-theme="dark"] #section-question #supplement-panel .supplement-card,
body[data-theme="dark"] #section-question #supplement-panel textarea,
body[data-theme="dark"] #section-settings input,
body[data-theme="dark"] #section-settings textarea,
body[data-theme="dark"] .response-card-answer .response-output,
body[data-theme="dark"] .history-block,
body[data-theme="dark"] .conversation-thread,
body[data-theme="dark"] #section-question .composer .template-switcher,
body[data-theme="dark"] #section-question .mode-switcher-hint,
body[data-theme="dark"] .page-switcher-nav,
body[data-theme="dark"] .template-switcher,
body[data-theme="dark"] .delivery-mode-switch,
body[data-theme="dark"] .records-filter-group {
  background: rgba(255, 255, 255, 0.045) !important;
  border-color: rgba(231, 237, 232, 0.095) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.055),
    0 1px 2px rgba(0, 0, 0, 0.1) !important;
}

body .panel,
body .panel-head {
  background: transparent !important;
}

/* Editorial refinement: quieter luxury interface while preserving the glass system. */
:root {
  --luxury-radius-outer: 18px;
  --luxury-radius-inner: 12px;
  --luxury-border-light: rgba(255, 255, 255, 0.58);
  --luxury-border-inner: rgba(223, 231, 235, 0.5);
  --luxury-green: rgba(57, 77, 64, 0.84);
  --luxury-green-soft: rgba(112, 142, 123, 0.26);
}

body .title-banner,
body .hero,
body .sidebar,
body .composer,
body .response-card,
body .sidebar .panel,
body #section-question #supplement-panel,
body #section-question .send-preview,
body #section-question .mode-switcher-block,
body .records-filters-stack,
body .tool-item,
body .history-item,
body .session-item {
  border-radius: var(--luxury-radius-outer) !important;
  border-color: var(--luxury-border-light) !important;
}

body input,
body textarea,
body .response-output,
body .conversation-thread,
body .history-block,
body .history-block-surface,
body .history-question,
body .system-preview,
body .supplement-card,
body .records-search-field,
body .mode-switcher-hint {
  border-radius: var(--luxury-radius-inner) !important;
  border-color: var(--luxury-border-inner) !important;
}

.title-banner {
  padding: 34px 36px !important;
  gap: 34px !important;
}

.title-banner-content,
.brand-block {
  gap: 14px !important;
}

.title-copy,
.brand-copy {
  opacity: 0.72 !important;
}

.page-switcher-nav,
.template-switcher,
.delivery-mode-switch,
.records-filter-group {
  padding: 4px !important;
  gap: 4px !important;
}

.page-nav-button,
.template-tab,
.delivery-mode-button,
.records-filter-button,
.records-mode-button {
  min-height: 32px !important;
  padding: 8px 15px !important;
}

#section-question .mode-switcher-block {
  padding: 18px !important;
}

#section-question .mode-switcher-title {
  margin-bottom: 12px !important;
}

#section-question .mode-switcher-hint {
  margin-top: 12px !important;
  padding: 14px 16px !important;
  gap: 8px 18px !important;
  color: color-mix(in srgb, var(--muted) 88%, transparent) !important;
}

#section-question .mode-switcher-hint strong {
  color: color-mix(in srgb, var(--text) 74%, var(--muted)) !important;
  font-weight: 500 !important;
}

body .ghost-button:not(.delivery-mode-button):not(.records-mode-button):not(.records-filter-button):not(.template-tab):not(.page-nav-button):not(:disabled),
body .mini-button:not(.mini-button-primary):not(:disabled),
body .session-mini:not(.session-resume):not(.session-pin-toggle):not(:disabled) {
  background: rgba(255, 255, 255, 0.18) !important;
  border-color: rgba(223, 231, 235, 0.42) !important;
  color: color-mix(in srgb, var(--muted) 92%, var(--text)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.58),
    0 1px 2px rgba(24, 30, 35, 0.008) !important;
}

body[data-theme="dark"] .ghost-button:not(.delivery-mode-button):not(.records-mode-button):not(.records-filter-button):not(.template-tab):not(.page-nav-button):not(:disabled),
body[data-theme="dark"] .mini-button:not(.mini-button-primary):not(:disabled),
body[data-theme="dark"] .session-mini:not(.session-resume):not(.session-pin-toggle):not(:disabled) {
  background: rgba(255, 255, 255, 0.028) !important;
  border-color: rgba(231, 237, 232, 0.07) !important;
  color: color-mix(in srgb, var(--muted) 92%, var(--text)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.035),
    0 1px 2px rgba(0, 0, 0, 0.08) !important;
}

body .page-nav-button.active:not(:disabled),
body .template-tab.active:not(:disabled),
body .delivery-mode-button.active:not(:disabled),
body .records-filter-button.active:not(:disabled),
body .records-mode-button.active:not(:disabled),
body .primary-button:not(:disabled),
body .mini-button-primary:not(:disabled),
body .session-resume:not(:disabled),
body .session-pin-toggle:not(:disabled),
body #answer-followup:not(:disabled) {
  background: linear-gradient(135deg, rgba(102, 130, 111, 0.78) 0%, var(--luxury-green) 100%) !important;
  border-color: rgba(126, 154, 135, 0.28) !important;
  box-shadow:
    0 10px 22px rgba(20, 34, 26, 0.11),
    inset 0 1px 0 rgba(255, 255, 255, 0.16) !important;
}

body[data-theme="dark"] .page-nav-button.active:not(:disabled),
body[data-theme="dark"] .template-tab.active:not(:disabled),
body[data-theme="dark"] .delivery-mode-button.active:not(:disabled),
body[data-theme="dark"] .records-filter-button.active:not(:disabled),
body[data-theme="dark"] .records-mode-button.active:not(:disabled),
body[data-theme="dark"] .primary-button:not(:disabled),
body[data-theme="dark"] .mini-button-primary:not(:disabled),
body[data-theme="dark"] .session-resume:not(:disabled),
body[data-theme="dark"] .session-pin-toggle:not(:disabled),
body[data-theme="dark"] #answer-followup:not(:disabled) {
  background: linear-gradient(135deg, rgba(112, 142, 123, 0.42) 0%, rgba(45, 65, 52, 0.68) 100%) !important;
  border-color: rgba(128, 160, 139, 0.22) !important;
}

input::placeholder,
textarea::placeholder {
  color: color-mix(in srgb, var(--muted) 62%, transparent) !important;
}

input:focus,
textarea:focus {
  border-color: rgba(126, 154, 135, 0.38) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.82),
    0 0 0 1px rgba(126, 154, 135, 0.1) !important;
}

.response-output.rendered p {
  margin-bottom: 1em !important;
}

.response-output.rendered h1,
.response-output.rendered h2,
.response-output.rendered h3 {
  margin-top: 1.4em !important;
  margin-bottom: 0.62em !important;
}

/* Record metadata chips: visible light gray fill, still small and quiet. */
#section-history .history-meta .history-mode,
#section-history .history-meta .history-state,
#section-history .history-meta .history-state-session,
#section-history .history-meta .history-state-single,
#section-history .history-meta .history-state-pinned {
  min-height: 22px !important;
  padding: 4px 8px !important;
  border-radius: 999px !important;
  background: rgba(230, 234, 236, 0.72) !important;
  border: 1px solid rgba(205, 213, 217, 0.72) !important;
  color: color-mix(in srgb, var(--muted) 86%, var(--text)) !important;
  box-shadow: none !important;
  font-family: var(--interface-sans, var(--sans)) !important;
  font-size: 0.72rem !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  letter-spacing: 0.01em !important;
}

body[data-theme="dark"] #section-history .history-meta .history-mode,
body[data-theme="dark"] #section-history .history-meta .history-state,
body[data-theme="dark"] #section-history .history-meta .history-state-session,
body[data-theme="dark"] #section-history .history-meta .history-state-single,
body[data-theme="dark"] #section-history .history-meta .history-state-pinned {
  background: rgba(231, 237, 232, 0.105) !important;
  border-color: rgba(231, 237, 232, 0.12) !important;
  color: color-mix(in srgb, var(--muted) 88%, var(--text)) !important;
}

#section-history .history-meta {
  gap: 6px !important;
}

/* History metadata chips at true file end: quiet gray, small, non-interactive. */
.history-mode,
.history-state,
.history-state-session,
.history-state-single,
.history-state-pinned {
  min-height: 22px !important;
  padding: 4px 8px !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.18) !important;
  border: 1px solid rgba(223, 231, 235, 0.36) !important;
  color: color-mix(in srgb, var(--muted) 92%, var(--text)) !important;
  box-shadow: none !important;
  font-family: var(--interface-sans, var(--sans)) !important;
  font-size: 0.72rem !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  letter-spacing: 0.01em !important;
}

body[data-theme="dark"] .history-mode,
body[data-theme="dark"] .history-state,
body[data-theme="dark"] .history-state-session,
body[data-theme="dark"] .history-state-single,
body[data-theme="dark"] .history-state-pinned {
  background: rgba(255, 255, 255, 0.026) !important;
  border-color: rgba(231, 237, 232, 0.07) !important;
  color: color-mix(in srgb, var(--muted) 90%, var(--text)) !important;
  box-shadow: none !important;
}

.history-meta {
  gap: 6px !important;
}

/* Strong scoped override for record metadata chips, independent of later generic chip rules. */
#section-history .history-meta .history-mode,
#section-history .history-meta .history-state,
#section-history .history-meta .history-state-session,
#section-history .history-meta .history-state-single,
#section-history .history-meta .history-state-pinned {
  min-height: 22px !important;
  padding: 4px 8px !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.18) !important;
  border: 1px solid rgba(223, 231, 235, 0.36) !important;
  color: color-mix(in srgb, var(--muted) 92%, var(--text)) !important;
  box-shadow: none !important;
  font-family: var(--interface-sans, var(--sans)) !important;
  font-size: 0.72rem !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  letter-spacing: 0.01em !important;
}

body[data-theme="dark"] #section-history .history-meta .history-mode,
body[data-theme="dark"] #section-history .history-meta .history-state,
body[data-theme="dark"] #section-history .history-meta .history-state-session,
body[data-theme="dark"] #section-history .history-meta .history-state-single,
body[data-theme="dark"] #section-history .history-meta .history-state-pinned {
  background: rgba(255, 255, 255, 0.026) !important;
  border-color: rgba(231, 237, 232, 0.07) !important;
  color: color-mix(in srgb, var(--muted) 90%, var(--text)) !important;
  box-shadow: none !important;
}

/* History metadata chips: smaller, quieter gray labels inside record cards. */
.history-mode,
.history-state,
.history-state-session,
.history-state-single,
.history-state-pinned {
  min-height: 22px !important;
  padding: 4px 8px !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.18) !important;
  border: 1px solid rgba(223, 231, 235, 0.36) !important;
  color: color-mix(in srgb, var(--muted) 92%, var(--text)) !important;
  box-shadow: none !important;
  font-family: var(--interface-sans, var(--sans)) !important;
  font-size: 0.72rem !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  letter-spacing: 0.01em !important;
}

body[data-theme="dark"] .history-mode,
body[data-theme="dark"] .history-state,
body[data-theme="dark"] .history-state-session,
body[data-theme="dark"] .history-state-single,
body[data-theme="dark"] .history-state-pinned {
  background: rgba(255, 255, 255, 0.026) !important;
  border-color: rgba(231, 237, 232, 0.07) !important;
  color: color-mix(in srgb, var(--muted) 90%, var(--text)) !important;
  box-shadow: none !important;
}

.history-meta {
  gap: 6px !important;
}

#open-chatgpt[hidden] {
  display: none !important;
}

/* Final text-field unification: every editable/readable text box uses one glass fill. */
body input,
body textarea,
body #question,
body #concern,
body #background,
body #other-party,
body #goal,
body #assembled-prompt,
body #system-prompt-preview,
body #base-url,
body #api-key,
body #model,
body #temperature,
body #records-search,
body .system-preview,
body .response-output,
body .response-card-answer .response-output,
body .conversation-thread,
body .history-block,
body .history-block-surface,
body .history-question,
body .send-preview textarea,
body .supplement-card,
body .supplement-card textarea,
body #section-question .field textarea,
body #section-question #supplement-panel .supplement-card,
body #section-question #supplement-panel textarea,
body #section-settings input,
body #section-settings textarea,
body .records-search-field,
body .records-search-field input {
  background: rgba(255, 255, 255, 0.4) !important;
  border: 1px solid rgba(220, 228, 232, 0.68) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.86),
    0 1px 2px rgba(24, 30, 35, 0.014) !important;
  backdrop-filter: blur(24px) saturate(114%) !important;
  -webkit-backdrop-filter: blur(24px) saturate(114%) !important;
}

body[data-theme="dark"] input,
body[data-theme="dark"] textarea,
body[data-theme="dark"] #question,
body[data-theme="dark"] #concern,
body[data-theme="dark"] #background,
body[data-theme="dark"] #other-party,
body[data-theme="dark"] #goal,
body[data-theme="dark"] #assembled-prompt,
body[data-theme="dark"] #system-prompt-preview,
body[data-theme="dark"] #base-url,
body[data-theme="dark"] #api-key,
body[data-theme="dark"] #model,
body[data-theme="dark"] #temperature,
body[data-theme="dark"] #records-search,
body[data-theme="dark"] .system-preview,
body[data-theme="dark"] .response-output,
body[data-theme="dark"] .response-card-answer .response-output,
body[data-theme="dark"] .conversation-thread,
body[data-theme="dark"] .history-block,
body[data-theme="dark"] .history-block-surface,
body[data-theme="dark"] .history-question,
body[data-theme="dark"] .send-preview textarea,
body[data-theme="dark"] .supplement-card,
body[data-theme="dark"] .supplement-card textarea,
body[data-theme="dark"] #section-question .field textarea,
body[data-theme="dark"] #section-question #supplement-panel .supplement-card,
body[data-theme="dark"] #section-question #supplement-panel textarea,
body[data-theme="dark"] #section-settings input,
body[data-theme="dark"] #section-settings textarea,
body[data-theme="dark"] .records-search-field,
body[data-theme="dark"] .records-search-field input {
  background: rgba(255, 255, 255, 0.045) !important;
  border-color: rgba(231, 237, 232, 0.095) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.055),
    0 1px 2px rgba(0, 0, 0, 0.1) !important;
}

/* Final visual contract at file end: clear gray-green glass across all pages. */
body {
  background:
    radial-gradient(circle at 13% 8%, rgba(255, 255, 255, 0.96), transparent 30%),
    radial-gradient(circle at 78% 2%, rgba(206, 224, 214, 0.42), transparent 34%),
    radial-gradient(circle at 88% 88%, rgba(180, 198, 189, 0.24), transparent 32%),
    linear-gradient(135deg, #edf1f3 0%, #f8fafb 48%, #e4eaed 100%) !important;
}

body[data-theme="dark"] {
  background:
    radial-gradient(circle at 14% 4%, rgba(128, 158, 136, 0.13), transparent 34%),
    radial-gradient(circle at 86% 8%, rgba(206, 224, 214, 0.07), transparent 34%),
    radial-gradient(circle at 84% 92%, rgba(128, 158, 136, 0.08), transparent 32%),
    linear-gradient(135deg, #111719 0%, #171d1f 48%, #0e1415 100%) !important;
}

body .glass,
body .title-banner,
body .hero,
body .sidebar,
body .composer,
body .response-card,
body .response-card-answer,
body .response-card-history,
body .response-card-conversation,
body .response-card-prompt,
body .sidebar .panel,
body #section-settings,
body #section-structure,
body #section-tools,
body #section-records-filters,
body #section-question,
body #section-answer,
body #section-history,
body #section-conversation,
body #section-prompt,
body #section-question #supplement-panel,
body #section-question .send-preview,
body #section-question .mode-switcher-block,
body .records-filters-stack,
body .records-filter-block,
body .tool-item,
body .history-item,
body .history-block-surface,
body .session-item,
body .conversation-toolbar {
  background: rgba(250, 252, 253, 0.48) !important;
  border-color: rgba(255, 255, 255, 0.72) !important;
  box-shadow:
    0 18px 42px rgba(34, 45, 50, 0.045),
    inset 0 1px 0 rgba(255, 255, 255, 0.82) !important;
  backdrop-filter: blur(32px) saturate(118%) !important;
  -webkit-backdrop-filter: blur(32px) saturate(118%) !important;
}

body[data-theme="dark"] .glass,
body[data-theme="dark"] .title-banner,
body[data-theme="dark"] .hero,
body[data-theme="dark"] .sidebar,
body[data-theme="dark"] .composer,
body[data-theme="dark"] .response-card,
body[data-theme="dark"] .response-card-answer,
body[data-theme="dark"] .response-card-history,
body[data-theme="dark"] .response-card-conversation,
body[data-theme="dark"] .response-card-prompt,
body[data-theme="dark"] .sidebar .panel,
body[data-theme="dark"] #section-settings,
body[data-theme="dark"] #section-structure,
body[data-theme="dark"] #section-tools,
body[data-theme="dark"] #section-records-filters,
body[data-theme="dark"] #section-question,
body[data-theme="dark"] #section-answer,
body[data-theme="dark"] #section-history,
body[data-theme="dark"] #section-conversation,
body[data-theme="dark"] #section-prompt,
body[data-theme="dark"] #section-question #supplement-panel,
body[data-theme="dark"] #section-question .send-preview,
body[data-theme="dark"] #section-question .mode-switcher-block,
body[data-theme="dark"] .records-filters-stack,
body[data-theme="dark"] .records-filter-block,
body[data-theme="dark"] .tool-item,
body[data-theme="dark"] .history-item,
body[data-theme="dark"] .history-block-surface,
body[data-theme="dark"] .session-item,
body[data-theme="dark"] .conversation-toolbar {
  background: rgba(22, 28, 30, 0.5) !important;
  border-color: rgba(231, 237, 232, 0.105) !important;
  box-shadow:
    0 20px 44px rgba(0, 0, 0, 0.19),
    inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}

body input,
body textarea,
body .records-search-field,
body .records-search-field input,
body .composer .field input,
body .composer .field textarea,
body .send-preview textarea,
body #section-question .field input,
body #section-question .field textarea,
body #section-question #supplement-panel .supplement-card,
body #section-question #supplement-panel textarea,
body #section-settings input,
body #section-settings textarea,
body .response-card-answer .response-output,
body .history-block,
body .conversation-thread,
body #section-question .composer .template-switcher,
body #section-question .mode-switcher-hint,
body .page-switcher-nav,
body .template-switcher,
body .delivery-mode-switch,
body .records-filter-group {
  background: rgba(255, 255, 255, 0.4) !important;
  border-color: rgba(220, 228, 232, 0.68) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.86),
    0 1px 2px rgba(24, 30, 35, 0.014) !important;
  backdrop-filter: blur(24px) saturate(114%) !important;
  -webkit-backdrop-filter: blur(24px) saturate(114%) !important;
}

body[data-theme="dark"] input,
body[data-theme="dark"] textarea,
body[data-theme="dark"] .records-search-field,
body[data-theme="dark"] .records-search-field input,
body[data-theme="dark"] .composer .field input,
body[data-theme="dark"] .composer .field textarea,
body[data-theme="dark"] .send-preview textarea,
body[data-theme="dark"] #section-question .field input,
body[data-theme="dark"] #section-question .field textarea,
body[data-theme="dark"] #section-question #supplement-panel .supplement-card,
body[data-theme="dark"] #section-question #supplement-panel textarea,
body[data-theme="dark"] #section-settings input,
body[data-theme="dark"] #section-settings textarea,
body[data-theme="dark"] .response-card-answer .response-output,
body[data-theme="dark"] .history-block,
body[data-theme="dark"] .conversation-thread,
body[data-theme="dark"] #section-question .composer .template-switcher,
body[data-theme="dark"] #section-question .mode-switcher-hint,
body[data-theme="dark"] .page-switcher-nav,
body[data-theme="dark"] .template-switcher,
body[data-theme="dark"] .delivery-mode-switch,
body[data-theme="dark"] .records-filter-group {
  background: rgba(255, 255, 255, 0.045) !important;
  border-color: rgba(231, 237, 232, 0.095) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.055),
    0 1px 2px rgba(0, 0, 0, 0.1) !important;
}

body .panel,
body .panel-head {
  background: transparent !important;
}

#open-chatgpt[hidden] {
  display: none !important;
}

/* Final glass clarity pass: unify every surface into the same translucent gray-green system. */
body {
  background:
    radial-gradient(circle at 13% 8%, rgba(255, 255, 255, 0.96), transparent 30%),
    radial-gradient(circle at 78% 2%, rgba(206, 224, 214, 0.42), transparent 34%),
    radial-gradient(circle at 88% 88%, rgba(180, 198, 189, 0.24), transparent 32%),
    linear-gradient(135deg, #edf1f3 0%, #f8fafb 48%, #e4eaed 100%) !important;
}

body[data-theme="dark"] {
  background:
    radial-gradient(circle at 14% 4%, rgba(128, 158, 136, 0.13), transparent 34%),
    radial-gradient(circle at 86% 8%, rgba(206, 224, 214, 0.07), transparent 34%),
    radial-gradient(circle at 84% 92%, rgba(128, 158, 136, 0.08), transparent 32%),
    linear-gradient(135deg, #111719 0%, #171d1f 48%, #0e1415 100%) !important;
}

body .glass,
body .title-banner,
body .hero,
body .sidebar,
body .composer,
body .response-card,
body .response-card-answer,
body .response-card-history,
body .response-card-conversation,
body .response-card-prompt,
body .sidebar .panel,
body .settings-panel,
body #section-settings,
body #section-structure,
body #section-tools,
body #section-records-filters,
body #section-question,
body #section-answer,
body #section-history,
body #section-conversation,
body #section-prompt,
body #section-question #supplement-panel,
body #section-question .send-preview,
body #section-question .mode-switcher-block,
body .records-filters-stack,
body .records-filter-block,
body .tool-item,
body .history-item,
body .history-block-surface,
body .session-item,
body .conversation-toolbar {
  background: rgba(250, 252, 253, 0.48) !important;
  border-color: rgba(255, 255, 255, 0.72) !important;
  box-shadow:
    0 18px 42px rgba(34, 45, 50, 0.045),
    inset 0 1px 0 rgba(255, 255, 255, 0.82) !important;
  backdrop-filter: blur(32px) saturate(118%) !important;
  -webkit-backdrop-filter: blur(32px) saturate(118%) !important;
}

body[data-theme="dark"] .glass,
body[data-theme="dark"] .title-banner,
body[data-theme="dark"] .hero,
body[data-theme="dark"] .sidebar,
body[data-theme="dark"] .composer,
body[data-theme="dark"] .response-card,
body[data-theme="dark"] .response-card-answer,
body[data-theme="dark"] .response-card-history,
body[data-theme="dark"] .response-card-conversation,
body[data-theme="dark"] .response-card-prompt,
body[data-theme="dark"] .sidebar .panel,
body[data-theme="dark"] .settings-panel,
body[data-theme="dark"] #section-settings,
body[data-theme="dark"] #section-structure,
body[data-theme="dark"] #section-tools,
body[data-theme="dark"] #section-records-filters,
body[data-theme="dark"] #section-question,
body[data-theme="dark"] #section-answer,
body[data-theme="dark"] #section-history,
body[data-theme="dark"] #section-conversation,
body[data-theme="dark"] #section-prompt,
body[data-theme="dark"] #section-question #supplement-panel,
body[data-theme="dark"] #section-question .send-preview,
body[data-theme="dark"] #section-question .mode-switcher-block,
body[data-theme="dark"] .records-filters-stack,
body[data-theme="dark"] .records-filter-block,
body[data-theme="dark"] .tool-item,
body[data-theme="dark"] .history-item,
body[data-theme="dark"] .history-block-surface,
body[data-theme="dark"] .session-item,
body[data-theme="dark"] .conversation-toolbar {
  background: rgba(22, 28, 30, 0.5) !important;
  border-color: rgba(231, 237, 232, 0.105) !important;
  box-shadow:
    0 20px 44px rgba(0, 0, 0, 0.19),
    inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}

body input,
body textarea,
body .records-search-field,
body .records-search-field input,
body .composer .field input,
body .composer .field textarea,
body .send-preview textarea,
body #section-question .field input,
body #section-question .field textarea,
body #section-question #supplement-panel .supplement-card,
body #section-question #supplement-panel textarea,
body #section-settings input,
body #section-settings textarea,
body .response-card-answer .response-output,
body .history-block,
body .conversation-thread,
body #section-question .composer .template-switcher,
body #section-question .mode-switcher-hint,
body .page-switcher-nav,
body .template-switcher,
body .delivery-mode-switch,
body .records-filter-group {
  background: rgba(255, 255, 255, 0.4) !important;
  border-color: rgba(220, 228, 232, 0.68) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.86),
    0 1px 2px rgba(24, 30, 35, 0.014) !important;
  backdrop-filter: blur(24px) saturate(114%) !important;
  -webkit-backdrop-filter: blur(24px) saturate(114%) !important;
}

body[data-theme="dark"] input,
body[data-theme="dark"] textarea,
body[data-theme="dark"] .records-search-field,
body[data-theme="dark"] .records-search-field input,
body[data-theme="dark"] .composer .field input,
body[data-theme="dark"] .composer .field textarea,
body[data-theme="dark"] .send-preview textarea,
body[data-theme="dark"] #section-question .field input,
body[data-theme="dark"] #section-question .field textarea,
body[data-theme="dark"] #section-question #supplement-panel .supplement-card,
body[data-theme="dark"] #section-question #supplement-panel textarea,
body[data-theme="dark"] #section-settings input,
body[data-theme="dark"] #section-settings textarea,
body[data-theme="dark"] .response-card-answer .response-output,
body[data-theme="dark"] .history-block,
body[data-theme="dark"] .conversation-thread,
body[data-theme="dark"] #section-question .composer .template-switcher,
body[data-theme="dark"] #section-question .mode-switcher-hint,
body[data-theme="dark"] .page-switcher-nav,
body[data-theme="dark"] .template-switcher,
body[data-theme="dark"] .delivery-mode-switch,
body[data-theme="dark"] .records-filter-group {
  background: rgba(255, 255, 255, 0.045) !important;
  border-color: rgba(231, 237, 232, 0.095) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.055),
    0 1px 2px rgba(0, 0, 0, 0.1) !important;
}

body .panel,
body .panel-head {
  background: transparent !important;
}

#open-chatgpt[hidden] {
  display: none !important;
}

/* Page-wide final state contract: inactive controls stay glass, selected controls turn green. */
#section-settings button.ghost-button:not(.active):not(:disabled),
#section-structure button.ghost-button:not(.active):not(:disabled),
#section-tools button.ghost-button:not(.active):not(:disabled),
#section-records-filters button.ghost-button:not(.active):not(:disabled),
#section-history button.ghost-button:not(.active):not(:disabled),
#section-conversation button.ghost-button:not(.active):not(:disabled),
#section-prompt button.ghost-button:not(.active):not(:disabled),
#section-answer button.ghost-button:not(.active):not(:disabled),
#section-question button.ghost-button:not(.active):not(.primary-button):not(:disabled),
#section-question .template-tab:not(.active):not(:disabled),
#section-records-filters .records-filter-button:not(.active):not(:disabled),
#section-records-filters .records-mode-button:not(.active):not(:disabled),
.title-nav .page-nav-button:not(.active):not(:disabled),
.history-actions button.mini-button:not(.mini-button-primary):not(:disabled),
.session-actions button.session-mini:not(.session-resume):not(.session-pin-toggle):not(:disabled),
#export-history-settings:not(:disabled),
#theme-toggle-settings:not(:disabled),
#toggle-settings:not(:disabled),
#toggle-structure:not(:disabled),
#clear-settings:not(:disabled),
#clear-history:not(:disabled),
#toggle-conversation:not(:disabled),
#toggle-system-prompt:not(:disabled),
#copy-system-prompt-settings:not(:disabled),
#copy-user-prompt-settings:not(:disabled),
#toggle-render-mode:not(:disabled),
#answer-refine:not(:disabled),
#answer-favorite:not(:disabled),
#copy-response:not(:disabled),
#clear-draft:not(:disabled),
#leave-session:not(:disabled) {
  background: rgba(255, 255, 255, 0.44) !important;
  border: 1px solid rgba(217, 226, 231, 0.76) !important;
  color: var(--muted) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.84),
    0 1px 2px rgba(24, 30, 35, 0.018) !important;
}

#section-settings button.ghost-button:not(.active):not(:disabled):hover,
#section-structure button.ghost-button:not(.active):not(:disabled):hover,
#section-tools button.ghost-button:not(.active):not(:disabled):hover,
#section-records-filters button.ghost-button:not(.active):not(:disabled):hover,
#section-history button.ghost-button:not(.active):not(:disabled):hover,
#section-conversation button.ghost-button:not(.active):not(:disabled):hover,
#section-prompt button.ghost-button:not(.active):not(:disabled):hover,
#section-answer button.ghost-button:not(.active):not(:disabled):hover,
#section-question button.ghost-button:not(.active):not(.primary-button):not(:disabled):hover,
#section-question .template-tab:not(.active):not(:disabled):hover,
#section-records-filters .records-filter-button:not(.active):not(:disabled):hover,
#section-records-filters .records-mode-button:not(.active):not(:disabled):hover,
.title-nav .page-nav-button:not(.active):not(:disabled):hover,
.history-actions button.mini-button:not(.mini-button-primary):not(:disabled):hover,
.session-actions button.session-mini:not(.session-resume):not(.session-pin-toggle):not(:disabled):hover,
#export-history-settings:not(:disabled):hover,
#theme-toggle-settings:not(:disabled):hover,
#toggle-settings:not(:disabled):hover,
#toggle-structure:not(:disabled):hover,
#clear-settings:not(:disabled):hover,
#clear-history:not(:disabled):hover,
#toggle-conversation:not(:disabled):hover,
#toggle-system-prompt:not(:disabled):hover,
#copy-system-prompt-settings:not(:disabled):hover,
#copy-user-prompt-settings:not(:disabled):hover,
#toggle-render-mode:not(:disabled):hover,
#answer-refine:not(:disabled):hover,
#answer-favorite:not(:disabled):hover,
#copy-response:not(:disabled):hover,
#clear-draft:not(:disabled):hover,
#leave-session:not(:disabled):hover {
  background: rgba(255, 255, 255, 0.62) !important;
  border-color: rgba(206, 218, 224, 0.82) !important;
  color: var(--text) !important;
}

.title-nav .page-nav-button.active:not(:disabled),
#section-question .template-tab.active:not(:disabled),
#section-settings .delivery-mode-button.active:not(:disabled),
#section-records-filters .records-filter-button.active:not(:disabled),
#section-records-filters .records-mode-button.active:not(:disabled),
#section-question button.primary-button:not(:disabled),
#section-settings button.primary-button:not(:disabled),
.history-actions button.mini-button-primary:not(:disabled),
.session-actions button.session-resume:not(:disabled),
.session-actions button.session-pin-toggle:not(:disabled),
#send-request:not(:disabled),
#save-settings:not(:disabled),
#resume-session:not(:disabled),
#open-chatgpt:not(:disabled),
#answer-followup:not(:disabled) {
  background: linear-gradient(135deg, rgba(118, 147, 125, 0.88) 0%, rgba(53, 77, 62, 0.96) 100%) !important;
  border: 1px solid rgba(88, 119, 97, 0.36) !important;
  color: #f6faf7 !important;
  box-shadow:
    0 12px 24px rgba(20, 34, 26, 0.13),
    inset 0 1px 0 rgba(255, 255, 255, 0.22) !important;
}

body[data-theme="dark"] #section-settings button.ghost-button:not(.active):not(:disabled),
body[data-theme="dark"] #section-structure button.ghost-button:not(.active):not(:disabled),
body[data-theme="dark"] #section-tools button.ghost-button:not(.active):not(:disabled),
body[data-theme="dark"] #section-records-filters button.ghost-button:not(.active):not(:disabled),
body[data-theme="dark"] #section-history button.ghost-button:not(.active):not(:disabled),
body[data-theme="dark"] #section-conversation button.ghost-button:not(.active):not(:disabled),
body[data-theme="dark"] #section-prompt button.ghost-button:not(.active):not(:disabled),
body[data-theme="dark"] #section-answer button.ghost-button:not(.active):not(:disabled),
body[data-theme="dark"] #section-question button.ghost-button:not(.active):not(.primary-button):not(:disabled),
body[data-theme="dark"] #section-question .template-tab:not(.active):not(:disabled),
body[data-theme="dark"] #section-records-filters .records-filter-button:not(.active):not(:disabled),
body[data-theme="dark"] #section-records-filters .records-mode-button:not(.active):not(:disabled),
body[data-theme="dark"] .title-nav .page-nav-button:not(.active):not(:disabled),
body[data-theme="dark"] .history-actions button.mini-button:not(.mini-button-primary):not(:disabled),
body[data-theme="dark"] .session-actions button.session-mini:not(.session-resume):not(.session-pin-toggle):not(:disabled),
body[data-theme="dark"] #export-history-settings:not(:disabled),
body[data-theme="dark"] #theme-toggle-settings:not(:disabled),
body[data-theme="dark"] #toggle-settings:not(:disabled),
body[data-theme="dark"] #toggle-structure:not(:disabled),
body[data-theme="dark"] #clear-settings:not(:disabled),
body[data-theme="dark"] #clear-history:not(:disabled),
body[data-theme="dark"] #toggle-conversation:not(:disabled),
body[data-theme="dark"] #toggle-system-prompt:not(:disabled),
body[data-theme="dark"] #copy-system-prompt-settings:not(:disabled),
body[data-theme="dark"] #copy-user-prompt-settings:not(:disabled),
body[data-theme="dark"] #toggle-render-mode:not(:disabled),
body[data-theme="dark"] #answer-refine:not(:disabled),
body[data-theme="dark"] #answer-favorite:not(:disabled),
body[data-theme="dark"] #copy-response:not(:disabled),
body[data-theme="dark"] #clear-draft:not(:disabled),
body[data-theme="dark"] #leave-session:not(:disabled) {
  background: rgba(255, 255, 255, 0.052) !important;
  border-color: rgba(231, 237, 232, 0.1) !important;
  color: var(--muted) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.06),
    0 1px 2px rgba(0, 0, 0, 0.12) !important;
}

body[data-theme="dark"] .title-nav .page-nav-button.active:not(:disabled),
body[data-theme="dark"] #section-question .template-tab.active:not(:disabled),
body[data-theme="dark"] #section-settings .delivery-mode-button.active:not(:disabled),
body[data-theme="dark"] #section-records-filters .records-filter-button.active:not(:disabled),
body[data-theme="dark"] #section-records-filters .records-mode-button.active:not(:disabled),
body[data-theme="dark"] #section-question button.primary-button:not(:disabled),
body[data-theme="dark"] #section-settings button.primary-button:not(:disabled),
body[data-theme="dark"] .history-actions button.mini-button-primary:not(:disabled),
body[data-theme="dark"] .session-actions button.session-resume:not(:disabled),
body[data-theme="dark"] .session-actions button.session-pin-toggle:not(:disabled),
body[data-theme="dark"] #send-request:not(:disabled),
body[data-theme="dark"] #save-settings:not(:disabled),
body[data-theme="dark"] #resume-session:not(:disabled),
body[data-theme="dark"] #open-chatgpt:not(:disabled),
body[data-theme="dark"] #answer-followup:not(:disabled) {
  background: linear-gradient(135deg, rgba(112, 142, 123, 0.54) 0%, rgba(45, 65, 52, 0.72) 100%) !important;
  border-color: rgba(128, 160, 139, 0.25) !important;
  color: #e8f2eb !important;
  box-shadow:
    0 10px 22px rgba(0, 0, 0, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
}

.history-actions .history-delete,
.history-actions .record-delete-session,
.session-actions .session-delete {
  border-radius: 999px !important;
}

button:disabled,
button.ghost-button:disabled,
button.mini-button:disabled,
button.session-mini:disabled {
  opacity: 0.45 !important;
  cursor: not-allowed !important;
  transform: none !important;
}

/* Final color sync: make every button/tag use the Copy to ChatGPT green. */
button.ghost-button:not(:disabled),
button.mini-button:not(:disabled),
button.session-mini:not(:disabled),
button.primary-button:not(:disabled),
button.mini-button-primary:not(:disabled),
.page-nav-button:not(:disabled),
.template-tab:not(:disabled),
.delivery-mode-button:not(:disabled),
.records-mode-button:not(:disabled),
.records-filter-button:not(:disabled),
.history-mode:not(:disabled),
.history-state-pinned,
.history-state-session,
.history-state-single,
.status-pill:not(.subtle),
.status-pill-save,
.session-pin,
.answer-actions .ghost-button:not(:disabled),
.panel-tools .ghost-button:not(:disabled),
.button-row .ghost-button:not(:disabled),
.button-row .primary-button:not(:disabled),
.history-actions .mini-button:not(:disabled),
.session-actions .session-mini:not(:disabled),
.session-actions .session-pin-toggle:not(:disabled),
#section-tools .tool-item .ghost-button:not(:disabled),
#section-records-filters .ghost-button:not(:disabled),
#section-settings .ghost-button:not(:disabled),
#section-prompt .ghost-button:not(:disabled),
#open-chatgpt:not(:disabled),
#clear-draft:not(:disabled),
#copy-user-prompt-settings:not(:disabled),
#copy-system-prompt-settings:not(:disabled),
#clear-history:not(:disabled),
#toggle-conversation:not(:disabled),
#toggle-system-prompt:not(:disabled),
#toggle-render-mode:not(:disabled),
#toggle-settings:not(:disabled),
#toggle-structure:not(:disabled),
#answer-followup:not(:disabled),
#answer-refine:not(:disabled),
#answer-favorite:not(:disabled),
#copy-response:not(:disabled),
#resume-session:not(:disabled),
#leave-session:not(:disabled),
#clear-settings:not(:disabled),
#save-settings:not(:disabled),
#send-request:not(:disabled) {
  background: linear-gradient(135deg, rgba(118, 147, 125, 0.88) 0%, rgba(53, 77, 62, 0.96) 100%) !important;
  border: 1px solid rgba(88, 119, 97, 0.36) !important;
  color: #f6faf7 !important;
  box-shadow:
    0 12px 24px rgba(20, 34, 26, 0.13),
    inset 0 1px 0 rgba(255, 255, 255, 0.22) !important;
}

button.ghost-button:not(:disabled):hover,
button.mini-button:not(:disabled):hover,
button.session-mini:not(:disabled):hover,
button.primary-button:not(:disabled):hover,
button.mini-button-primary:not(:disabled):hover,
.page-nav-button:not(:disabled):hover,
.template-tab:not(:disabled):hover,
.delivery-mode-button:not(:disabled):hover,
.records-mode-button:not(:disabled):hover,
.records-filter-button:not(:disabled):hover,
.answer-actions .ghost-button:not(:disabled):hover,
.panel-tools .ghost-button:not(:disabled):hover,
.button-row .ghost-button:not(:disabled):hover,
.button-row .primary-button:not(:disabled):hover,
.history-actions .mini-button:not(:disabled):hover,
.session-actions .session-mini:not(:disabled):hover,
.session-actions .session-pin-toggle:not(:disabled):hover,
#section-tools .tool-item .ghost-button:not(:disabled):hover,
#section-records-filters .ghost-button:not(:disabled):hover,
#section-settings .ghost-button:not(:disabled):hover,
#section-prompt .ghost-button:not(:disabled):hover,
#open-chatgpt:not(:disabled):hover,
#clear-draft:not(:disabled):hover,
#copy-user-prompt-settings:not(:disabled):hover,
#copy-system-prompt-settings:not(:disabled):hover,
#clear-history:not(:disabled):hover,
#toggle-conversation:not(:disabled):hover,
#toggle-system-prompt:not(:disabled):hover,
#toggle-render-mode:not(:disabled):hover,
#toggle-settings:not(:disabled):hover,
#toggle-structure:not(:disabled):hover,
#answer-followup:not(:disabled):hover,
#answer-refine:not(:disabled):hover,
#answer-favorite:not(:disabled):hover,
#copy-response:not(:disabled):hover,
#resume-session:not(:disabled):hover,
#leave-session:not(:disabled):hover,
#clear-settings:not(:disabled):hover,
#save-settings:not(:disabled):hover,
#send-request:not(:disabled):hover {
  background: linear-gradient(135deg, rgba(128, 158, 136, 0.94) 0%, rgba(62, 88, 70, 1) 100%) !important;
  border-color: rgba(95, 128, 105, 0.44) !important;
  color: #ffffff !important;
  transform: none !important;
}

body[data-theme="dark"] button.ghost-button:not(:disabled),
body[data-theme="dark"] button.mini-button:not(:disabled),
body[data-theme="dark"] button.session-mini:not(:disabled),
body[data-theme="dark"] button.primary-button:not(:disabled),
body[data-theme="dark"] button.mini-button-primary:not(:disabled),
body[data-theme="dark"] .page-nav-button:not(:disabled),
body[data-theme="dark"] .template-tab:not(:disabled),
body[data-theme="dark"] .delivery-mode-button:not(:disabled),
body[data-theme="dark"] .records-mode-button:not(:disabled),
body[data-theme="dark"] .records-filter-button:not(:disabled),
body[data-theme="dark"] .history-mode:not(:disabled),
body[data-theme="dark"] .history-state-pinned,
body[data-theme="dark"] .history-state-session,
body[data-theme="dark"] .history-state-single,
body[data-theme="dark"] .status-pill:not(.subtle),
body[data-theme="dark"] .status-pill-save,
body[data-theme="dark"] .session-pin,
body[data-theme="dark"] .answer-actions .ghost-button:not(:disabled),
body[data-theme="dark"] .panel-tools .ghost-button:not(:disabled),
body[data-theme="dark"] .button-row .ghost-button:not(:disabled),
body[data-theme="dark"] .button-row .primary-button:not(:disabled),
body[data-theme="dark"] .history-actions .mini-button:not(:disabled),
body[data-theme="dark"] .session-actions .session-mini:not(:disabled),
body[data-theme="dark"] .session-actions .session-pin-toggle:not(:disabled),
body[data-theme="dark"] #section-tools .tool-item .ghost-button:not(:disabled),
body[data-theme="dark"] #section-records-filters .ghost-button:not(:disabled),
body[data-theme="dark"] #section-settings .ghost-button:not(:disabled),
body[data-theme="dark"] #section-prompt .ghost-button:not(:disabled),
body[data-theme="dark"] #open-chatgpt:not(:disabled),
body[data-theme="dark"] #clear-draft:not(:disabled),
body[data-theme="dark"] #copy-user-prompt-settings:not(:disabled),
body[data-theme="dark"] #copy-system-prompt-settings:not(:disabled),
body[data-theme="dark"] #clear-history:not(:disabled),
body[data-theme="dark"] #toggle-conversation:not(:disabled),
body[data-theme="dark"] #toggle-system-prompt:not(:disabled),
body[data-theme="dark"] #toggle-render-mode:not(:disabled),
body[data-theme="dark"] #toggle-settings:not(:disabled),
body[data-theme="dark"] #toggle-structure:not(:disabled),
body[data-theme="dark"] #answer-followup:not(:disabled),
body[data-theme="dark"] #answer-refine:not(:disabled),
body[data-theme="dark"] #answer-favorite:not(:disabled),
body[data-theme="dark"] #copy-response:not(:disabled),
body[data-theme="dark"] #resume-session:not(:disabled),
body[data-theme="dark"] #leave-session:not(:disabled),
body[data-theme="dark"] #clear-settings:not(:disabled),
body[data-theme="dark"] #save-settings:not(:disabled),
body[data-theme="dark"] #send-request:not(:disabled) {
  background: linear-gradient(135deg, rgba(112, 142, 123, 0.54) 0%, rgba(45, 65, 52, 0.72) 100%) !important;
  border-color: rgba(128, 160, 139, 0.25) !important;
  color: #e8f2eb !important;
  box-shadow:
    0 10px 22px rgba(0, 0, 0, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
}

body[data-theme="dark"] button.ghost-button:not(:disabled):hover,
body[data-theme="dark"] button.mini-button:not(:disabled):hover,
body[data-theme="dark"] button.session-mini:not(:disabled):hover,
body[data-theme="dark"] button.primary-button:not(:disabled):hover,
body[data-theme="dark"] button.mini-button-primary:not(:disabled):hover,
body[data-theme="dark"] .page-nav-button:not(:disabled):hover,
body[data-theme="dark"] .template-tab:not(:disabled):hover,
body[data-theme="dark"] .delivery-mode-button:not(:disabled):hover,
body[data-theme="dark"] .records-mode-button:not(:disabled):hover,
body[data-theme="dark"] .records-filter-button:not(:disabled):hover,
body[data-theme="dark"] .answer-actions .ghost-button:not(:disabled):hover,
body[data-theme="dark"] .panel-tools .ghost-button:not(:disabled):hover,
body[data-theme="dark"] .button-row .ghost-button:not(:disabled):hover,
body[data-theme="dark"] .button-row .primary-button:not(:disabled):hover,
body[data-theme="dark"] .history-actions .mini-button:not(:disabled):hover,
body[data-theme="dark"] .session-actions .session-mini:not(:disabled):hover,
body[data-theme="dark"] .session-actions .session-pin-toggle:not(:disabled):hover,
body[data-theme="dark"] #section-tools .tool-item .ghost-button:not(:disabled):hover,
body[data-theme="dark"] #section-records-filters .ghost-button:not(:disabled):hover,
body[data-theme="dark"] #section-settings .ghost-button:not(:disabled):hover,
body[data-theme="dark"] #section-prompt .ghost-button:not(:disabled):hover,
body[data-theme="dark"] #open-chatgpt:not(:disabled):hover,
body[data-theme="dark"] #clear-draft:not(:disabled):hover,
body[data-theme="dark"] #copy-user-prompt-settings:not(:disabled):hover,
body[data-theme="dark"] #copy-system-prompt-settings:not(:disabled):hover,
body[data-theme="dark"] #clear-history:not(:disabled):hover,
body[data-theme="dark"] #toggle-conversation:not(:disabled):hover,
body[data-theme="dark"] #toggle-system-prompt:not(:disabled):hover,
body[data-theme="dark"] #toggle-render-mode:not(:disabled):hover,
body[data-theme="dark"] #toggle-settings:not(:disabled):hover,
body[data-theme="dark"] #toggle-structure:not(:disabled):hover,
body[data-theme="dark"] #answer-followup:not(:disabled):hover,
body[data-theme="dark"] #answer-refine:not(:disabled):hover,
body[data-theme="dark"] #answer-favorite:not(:disabled):hover,
body[data-theme="dark"] #copy-response:not(:disabled):hover,
body[data-theme="dark"] #resume-session:not(:disabled):hover,
body[data-theme="dark"] #leave-session:not(:disabled):hover,
body[data-theme="dark"] #clear-settings:not(:disabled):hover,
body[data-theme="dark"] #save-settings:not(:disabled):hover,
body[data-theme="dark"] #send-request:not(:disabled):hover {
  background: linear-gradient(135deg, rgba(124, 156, 136, 0.64) 0%, rgba(55, 78, 63, 0.82) 100%) !important;
  border-color: rgba(140, 174, 151, 0.34) !important;
  color: #ffffff !important;
}

/* Correct button states: neutral by default, green only when selected or primary. */
.page-nav-button:not(.active):not(:disabled),
.template-tab:not(.active):not(:disabled),
.delivery-mode-button:not(.active):not(:disabled),
.records-mode-button:not(.active):not(:disabled),
.records-filter-button:not(.active):not(:disabled),
button.ghost-button:not(.delivery-mode-button):not(.records-mode-button):not(.records-filter-button):not(:disabled),
button.mini-button:not(.mini-button-primary):not(:disabled),
button.session-mini:not(.session-resume):not(.session-pin-toggle):not(:disabled),
.history-actions .mini-button:not(.mini-button-primary):not(:disabled),
.session-actions .session-mini:not(.session-resume):not(.session-pin-toggle):not(:disabled),
#clear-draft:not(:disabled),
#copy-user-prompt-settings:not(:disabled),
#copy-system-prompt-settings:not(:disabled),
#clear-history:not(:disabled),
#toggle-conversation:not(:disabled),
#toggle-system-prompt:not(:disabled),
#toggle-render-mode:not(:disabled),
#toggle-settings:not(:disabled),
#toggle-structure:not(:disabled),
#answer-refine:not(:disabled),
#answer-favorite:not(:disabled),
#copy-response:not(:disabled),
#leave-session:not(:disabled),
#clear-settings:not(:disabled) {
  background: rgba(255, 255, 255, 0.44) !important;
  border: 1px solid rgba(217, 226, 231, 0.76) !important;
  color: var(--muted) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.84),
    0 1px 2px rgba(24, 30, 35, 0.018) !important;
}

.page-nav-button:not(.active):not(:disabled):hover,
.template-tab:not(.active):not(:disabled):hover,
.delivery-mode-button:not(.active):not(:disabled):hover,
.records-mode-button:not(.active):not(:disabled):hover,
.records-filter-button:not(.active):not(:disabled):hover,
button.ghost-button:not(.delivery-mode-button):not(.records-mode-button):not(.records-filter-button):not(:disabled):hover,
button.mini-button:not(.mini-button-primary):not(:disabled):hover,
button.session-mini:not(.session-resume):not(.session-pin-toggle):not(:disabled):hover,
.history-actions .mini-button:not(.mini-button-primary):not(:disabled):hover,
.session-actions .session-mini:not(.session-resume):not(.session-pin-toggle):not(:disabled):hover,
#clear-draft:not(:disabled):hover,
#copy-user-prompt-settings:not(:disabled):hover,
#copy-system-prompt-settings:not(:disabled):hover,
#clear-history:not(:disabled):hover,
#toggle-conversation:not(:disabled):hover,
#toggle-system-prompt:not(:disabled):hover,
#toggle-render-mode:not(:disabled):hover,
#toggle-settings:not(:disabled):hover,
#toggle-structure:not(:disabled):hover,
#answer-refine:not(:disabled):hover,
#answer-favorite:not(:disabled):hover,
#copy-response:not(:disabled):hover,
#leave-session:not(:disabled):hover,
#clear-settings:not(:disabled):hover {
  background: rgba(255, 255, 255, 0.62) !important;
  border-color: rgba(206, 218, 224, 0.82) !important;
  color: var(--text) !important;
}

.page-nav-button.active:not(:disabled),
.template-tab.active:not(:disabled),
.delivery-mode-button.active:not(:disabled),
.records-mode-button.active:not(:disabled),
.records-filter-button.active:not(:disabled),
button.primary-button:not(:disabled),
button.primary-button.accent:not(:disabled),
button.mini-button-primary:not(:disabled),
.history-actions .mini-button-primary:not(:disabled),
.session-actions .session-resume:not(:disabled),
.session-actions .session-pin-toggle:not(:disabled),
#open-chatgpt:not(:disabled),
#resume-session:not(:disabled),
#save-settings:not(:disabled),
#send-request:not(:disabled),
#answer-followup:not(:disabled) {
  background: linear-gradient(135deg, rgba(118, 147, 125, 0.88) 0%, rgba(53, 77, 62, 0.96) 100%) !important;
  border: 1px solid rgba(88, 119, 97, 0.36) !important;
  color: #f6faf7 !important;
  box-shadow:
    0 12px 24px rgba(20, 34, 26, 0.13),
    inset 0 1px 0 rgba(255, 255, 255, 0.22) !important;
}

body[data-theme="dark"] .page-nav-button:not(.active):not(:disabled),
body[data-theme="dark"] .template-tab:not(.active):not(:disabled),
body[data-theme="dark"] .delivery-mode-button:not(.active):not(:disabled),
body[data-theme="dark"] .records-mode-button:not(.active):not(:disabled),
body[data-theme="dark"] .records-filter-button:not(.active):not(:disabled),
body[data-theme="dark"] button.ghost-button:not(.delivery-mode-button):not(.records-mode-button):not(.records-filter-button):not(:disabled),
body[data-theme="dark"] button.mini-button:not(.mini-button-primary):not(:disabled),
body[data-theme="dark"] button.session-mini:not(.session-resume):not(.session-pin-toggle):not(:disabled),
body[data-theme="dark"] .history-actions .mini-button:not(.mini-button-primary):not(:disabled),
body[data-theme="dark"] .session-actions .session-mini:not(.session-resume):not(.session-pin-toggle):not(:disabled),
body[data-theme="dark"] #clear-draft:not(:disabled),
body[data-theme="dark"] #copy-user-prompt-settings:not(:disabled),
body[data-theme="dark"] #copy-system-prompt-settings:not(:disabled),
body[data-theme="dark"] #clear-history:not(:disabled),
body[data-theme="dark"] #toggle-conversation:not(:disabled),
body[data-theme="dark"] #toggle-system-prompt:not(:disabled),
body[data-theme="dark"] #toggle-render-mode:not(:disabled),
body[data-theme="dark"] #toggle-settings:not(:disabled),
body[data-theme="dark"] #toggle-structure:not(:disabled),
body[data-theme="dark"] #answer-refine:not(:disabled),
body[data-theme="dark"] #answer-favorite:not(:disabled),
body[data-theme="dark"] #copy-response:not(:disabled),
body[data-theme="dark"] #leave-session:not(:disabled),
body[data-theme="dark"] #clear-settings:not(:disabled) {
  background: rgba(255, 255, 255, 0.052) !important;
  border-color: rgba(231, 237, 232, 0.1) !important;
  color: var(--muted) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.06),
    0 1px 2px rgba(0, 0, 0, 0.12) !important;
}

body[data-theme="dark"] .page-nav-button.active:not(:disabled),
body[data-theme="dark"] .template-tab.active:not(:disabled),
body[data-theme="dark"] .delivery-mode-button.active:not(:disabled),
body[data-theme="dark"] .records-mode-button.active:not(:disabled),
body[data-theme="dark"] .records-filter-button.active:not(:disabled),
body[data-theme="dark"] button.primary-button:not(:disabled),
body[data-theme="dark"] button.primary-button.accent:not(:disabled),
body[data-theme="dark"] button.mini-button-primary:not(:disabled),
body[data-theme="dark"] .history-actions .mini-button-primary:not(:disabled),
body[data-theme="dark"] .session-actions .session-resume:not(:disabled),
body[data-theme="dark"] .session-actions .session-pin-toggle:not(:disabled),
body[data-theme="dark"] #open-chatgpt:not(:disabled),
body[data-theme="dark"] #resume-session:not(:disabled),
body[data-theme="dark"] #save-settings:not(:disabled),
body[data-theme="dark"] #send-request:not(:disabled),
body[data-theme="dark"] #answer-followup:not(:disabled) {
  background: linear-gradient(135deg, rgba(112, 142, 123, 0.54) 0%, rgba(45, 65, 52, 0.72) 100%) !important;
  border-color: rgba(128, 160, 139, 0.25) !important;
  color: #e8f2eb !important;
  box-shadow:
    0 10px 22px rgba(0, 0, 0, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
}

/* Absolute final override at file end: all pages use neutral inactive states and green selected states. */
body .title-nav .page-nav-button:not(.active):not(:disabled),
body #section-question .template-tab:not(.active):not(:disabled),
body #section-settings .delivery-mode-button:not(.active):not(:disabled),
body #section-records-filters .records-filter-button:not(.active):not(:disabled),
body #section-records-filters .records-mode-button:not(.active):not(:disabled),
body #section-settings .ghost-button:not(.delivery-mode-button):not(:disabled),
body #section-structure .ghost-button:not(:disabled),
body #section-tools .tool-item .ghost-button:not(:disabled),
body #section-history .ghost-button:not(:disabled),
body #section-conversation .ghost-button:not(:disabled),
body #section-prompt .ghost-button:not(:disabled),
body #section-answer .ghost-button:not(#answer-followup):not(:disabled),
body #section-question .ghost-button:not(#open-chatgpt):not(#resume-session):not(:disabled),
body .history-actions .mini-button:not(.mini-button-primary):not(:disabled),
body .session-actions .session-mini:not(.session-resume):not(.session-pin-toggle):not(:disabled) {
  background: rgba(255, 255, 255, 0.44) !important;
  border: 1px solid rgba(217, 226, 231, 0.76) !important;
  color: var(--muted) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.84),
    0 1px 2px rgba(24, 30, 35, 0.018) !important;
}

body .title-nav .page-nav-button.active:not(:disabled),
body #section-question .template-tab.active:not(:disabled),
body #section-settings .delivery-mode-button.active:not(:disabled),
body #section-records-filters .records-filter-button.active:not(:disabled),
body #section-records-filters .records-mode-button.active:not(:disabled),
body #section-question .primary-button:not(:disabled),
body #section-settings .primary-button:not(:disabled),
body #open-chatgpt:not(:disabled),
body #resume-session:not(:disabled),
body #answer-followup:not(:disabled),
body .history-actions .mini-button-primary:not(:disabled),
body .session-actions .session-resume:not(:disabled),
body .session-actions .session-pin-toggle:not(:disabled) {
  background: linear-gradient(135deg, rgba(118, 147, 125, 0.88) 0%, rgba(53, 77, 62, 0.96) 100%) !important;
  border: 1px solid rgba(88, 119, 97, 0.36) !important;
  color: #f6faf7 !important;
  box-shadow:
    0 12px 24px rgba(20, 34, 26, 0.13),
    inset 0 1px 0 rgba(255, 255, 255, 0.22) !important;
}

body[data-theme="dark"] .title-nav .page-nav-button:not(.active):not(:disabled),
body[data-theme="dark"] #section-question .template-tab:not(.active):not(:disabled),
body[data-theme="dark"] #section-settings .delivery-mode-button:not(.active):not(:disabled),
body[data-theme="dark"] #section-records-filters .records-filter-button:not(.active):not(:disabled),
body[data-theme="dark"] #section-records-filters .records-mode-button:not(.active):not(:disabled),
body[data-theme="dark"] #section-settings .ghost-button:not(.delivery-mode-button):not(:disabled),
body[data-theme="dark"] #section-structure .ghost-button:not(:disabled),
body[data-theme="dark"] #section-tools .tool-item .ghost-button:not(:disabled),
body[data-theme="dark"] #section-history .ghost-button:not(:disabled),
body[data-theme="dark"] #section-conversation .ghost-button:not(:disabled),
body[data-theme="dark"] #section-prompt .ghost-button:not(:disabled),
body[data-theme="dark"] #section-answer .ghost-button:not(#answer-followup):not(:disabled),
body[data-theme="dark"] #section-question .ghost-button:not(#open-chatgpt):not(#resume-session):not(:disabled),
body[data-theme="dark"] .history-actions .mini-button:not(.mini-button-primary):not(:disabled),
body[data-theme="dark"] .session-actions .session-mini:not(.session-resume):not(.session-pin-toggle):not(:disabled) {
  background: rgba(255, 255, 255, 0.052) !important;
  border-color: rgba(231, 237, 232, 0.1) !important;
  color: var(--muted) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.06),
    0 1px 2px rgba(0, 0, 0, 0.12) !important;
}

body[data-theme="dark"] .title-nav .page-nav-button.active:not(:disabled),
body[data-theme="dark"] #section-question .template-tab.active:not(:disabled),
body[data-theme="dark"] #section-settings .delivery-mode-button.active:not(:disabled),
body[data-theme="dark"] #section-records-filters .records-filter-button.active:not(:disabled),
body[data-theme="dark"] #section-records-filters .records-mode-button.active:not(:disabled),
body[data-theme="dark"] #section-question .primary-button:not(:disabled),
body[data-theme="dark"] #section-settings .primary-button:not(:disabled),
body[data-theme="dark"] #open-chatgpt:not(:disabled),
body[data-theme="dark"] #resume-session:not(:disabled),
body[data-theme="dark"] #answer-followup:not(:disabled),
body[data-theme="dark"] .history-actions .mini-button-primary:not(:disabled),
body[data-theme="dark"] .session-actions .session-resume:not(:disabled),
body[data-theme="dark"] .session-actions .session-pin-toggle:not(:disabled) {
  background: linear-gradient(135deg, rgba(112, 142, 123, 0.54) 0%, rgba(45, 65, 52, 0.72) 100%) !important;
  border-color: rgba(128, 160, 139, 0.25) !important;
  color: #e8f2eb !important;
  box-shadow:
    0 10px 22px rgba(0, 0, 0, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
}

/* Final glass layer after the button contract. */
body .glass,
body .title-banner,
body .hero,
body .sidebar,
body .composer,
body .response-card,
body .sidebar .panel,
body #section-question #supplement-panel,
body #section-question .send-preview,
body #section-question .mode-switcher-block,
body .records-filters-stack,
body .records-filter-block,
body .tool-item,
body .history-item,
body .history-block-surface,
body .session-item,
body .conversation-toolbar {
  background: rgba(250, 252, 253, 0.48) !important;
  border-color: rgba(255, 255, 255, 0.72) !important;
  box-shadow:
    0 18px 42px rgba(34, 45, 50, 0.045),
    inset 0 1px 0 rgba(255, 255, 255, 0.82) !important;
  backdrop-filter: blur(32px) saturate(118%) !important;
  -webkit-backdrop-filter: blur(32px) saturate(118%) !important;
}

body[data-theme="dark"] .glass,
body[data-theme="dark"] .title-banner,
body[data-theme="dark"] .hero,
body[data-theme="dark"] .sidebar,
body[data-theme="dark"] .composer,
body[data-theme="dark"] .response-card,
body[data-theme="dark"] .sidebar .panel,
body[data-theme="dark"] #section-question #supplement-panel,
body[data-theme="dark"] #section-question .send-preview,
body[data-theme="dark"] #section-question .mode-switcher-block,
body[data-theme="dark"] .records-filters-stack,
body[data-theme="dark"] .records-filter-block,
body[data-theme="dark"] .tool-item,
body[data-theme="dark"] .history-item,
body[data-theme="dark"] .history-block-surface,
body[data-theme="dark"] .session-item,
body[data-theme="dark"] .conversation-toolbar {
  background: rgba(22, 28, 30, 0.5) !important;
  border-color: rgba(231, 237, 232, 0.105) !important;
  box-shadow:
    0 20px 44px rgba(0, 0, 0, 0.19),
    inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}

body input,
body textarea,
body .records-search-field,
body .records-search-field input,
body .response-card-answer .response-output,
body .history-block,
body .conversation-thread,
body #section-question #supplement-panel .supplement-card,
body #section-question .mode-switcher-hint,
body .page-switcher-nav,
body .template-switcher,
body .delivery-mode-switch,
body .records-filter-group {
  background: rgba(255, 255, 255, 0.4) !important;
  border-color: rgba(220, 228, 232, 0.68) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.86),
    0 1px 2px rgba(24, 30, 35, 0.014) !important;
  backdrop-filter: blur(24px) saturate(114%) !important;
  -webkit-backdrop-filter: blur(24px) saturate(114%) !important;
}

body[data-theme="dark"] input,
body[data-theme="dark"] textarea,
body[data-theme="dark"] .records-search-field,
body[data-theme="dark"] .records-search-field input,
body[data-theme="dark"] .response-card-answer .response-output,
body[data-theme="dark"] .history-block,
body[data-theme="dark"] .conversation-thread,
body[data-theme="dark"] #section-question #supplement-panel .supplement-card,
body[data-theme="dark"] #section-question .mode-switcher-hint,
body[data-theme="dark"] .page-switcher-nav,
body[data-theme="dark"] .template-switcher,
body[data-theme="dark"] .delivery-mode-switch,
body[data-theme="dark"] .records-filter-group {
  background: rgba(255, 255, 255, 0.045) !important;
  border-color: rgba(231, 237, 232, 0.095) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.055),
    0 1px 2px rgba(0, 0, 0, 0.1) !important;
}

#open-chatgpt[hidden] {
  display: none !important;
}

/* Final text-field unification at true file end. */
body input,
body textarea,
body #question,
body #concern,
body #background,
body #other-party,
body #goal,
body #assembled-prompt,
body #system-prompt-preview,
body #base-url,
body #api-key,
body #model,
body #temperature,
body #records-search,
body .system-preview,
body .response-output,
body .response-card-answer .response-output,
body .conversation-thread,
body .history-block,
body .history-block-surface,
body .history-question,
body .send-preview textarea,
body .supplement-card,
body .supplement-card textarea,
body #section-question .field textarea,
body #section-question #supplement-panel .supplement-card,
body #section-question #supplement-panel textarea,
body #section-settings input,
body #section-settings textarea,
body .records-search-field,
body .records-search-field input {
  background: rgba(255, 255, 255, 0.4) !important;
  border: 1px solid rgba(220, 228, 232, 0.68) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.86),
    0 1px 2px rgba(24, 30, 35, 0.014) !important;
  backdrop-filter: blur(24px) saturate(114%) !important;
  -webkit-backdrop-filter: blur(24px) saturate(114%) !important;
}

body[data-theme="dark"] input,
body[data-theme="dark"] textarea,
body[data-theme="dark"] #question,
body[data-theme="dark"] #concern,
body[data-theme="dark"] #background,
body[data-theme="dark"] #other-party,
body[data-theme="dark"] #goal,
body[data-theme="dark"] #assembled-prompt,
body[data-theme="dark"] #system-prompt-preview,
body[data-theme="dark"] #base-url,
body[data-theme="dark"] #api-key,
body[data-theme="dark"] #model,
body[data-theme="dark"] #temperature,
body[data-theme="dark"] #records-search,
body[data-theme="dark"] .system-preview,
body[data-theme="dark"] .response-output,
body[data-theme="dark"] .response-card-answer .response-output,
body[data-theme="dark"] .conversation-thread,
body[data-theme="dark"] .history-block,
body[data-theme="dark"] .history-block-surface,
body[data-theme="dark"] .history-question,
body[data-theme="dark"] .send-preview textarea,
body[data-theme="dark"] .supplement-card,
body[data-theme="dark"] .supplement-card textarea,
body[data-theme="dark"] #section-question .field textarea,
body[data-theme="dark"] #section-question #supplement-panel .supplement-card,
body[data-theme="dark"] #section-question #supplement-panel textarea,
body[data-theme="dark"] #section-settings input,
body[data-theme="dark"] #section-settings textarea,
body[data-theme="dark"] .records-search-field,
body[data-theme="dark"] .records-search-field input {
  background: rgba(255, 255, 255, 0.045) !important;
  border-color: rgba(231, 237, 232, 0.095) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.055),
    0 1px 2px rgba(0, 0, 0, 0.1) !important;
}

/* Final typography pass: harmonize the interface with the DISCERN wordmark. */
:root {
  --brand-serif: "Iowan Old Style", "Cormorant Garamond", "Didot", "Source Han Serif SC", "Noto Serif SC", serif;
  --ui-sans: "Inter", "Avenir Next", "PingFang SC", "Hiragino Sans GB", "Noto Sans SC", sans-serif;
}

body {
  font-family: var(--ui-sans) !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
  text-rendering: geometricPrecision;
}

.brand-mark,
.brand-main {
  font-family: var(--brand-serif) !important;
  font-weight: 500 !important;
  letter-spacing: 0.24em !important;
}

.brand-agent {
  font-family: var(--ui-sans) !important;
  font-weight: 400 !important;
  letter-spacing: 0.16em !important;
}

.title-copy,
.brand-copy {
  font-family: var(--ui-sans) !important;
  font-weight: 400 !important;
  letter-spacing: 0.04em !important;
}

.hero h2,
.panel-head h2,
.composer .panel-head h2,
.response-card-answer .panel-head h2,
.response-output.rendered h1,
.response-output.rendered h2,
.response-output.rendered h3 {
  font-family: var(--brand-serif) !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
}

.panel-head h2,
.composer .panel-head h2,
.response-card-answer .panel-head h2 {
  font-size: 1.18rem !important;
  line-height: 1.28 !important;
}

.hero h2 {
  font-size: clamp(2rem, 3.2vw, 3rem) !important;
  line-height: 1.12 !important;
}

.mode-switcher-title,
.supplement-panel-title,
.send-preview-title,
.tool-title,
.history-question-title,
.session-title,
.records-filter-caption,
.field > span,
.supplement-card > span {
  font-family: var(--ui-sans) !important;
  font-weight: 500 !important;
  letter-spacing: 0.02em !important;
}

.eyebrow,
.page-nav-button,
.template-tab,
.delivery-mode-button,
.records-filter-button,
.records-mode-button,
.ghost-button,
.primary-button,
.mini-button,
.session-mini,
.status-pill {
  font-family: var(--ui-sans) !important;
  font-weight: 500 !important;
  letter-spacing: 0.02em !important;
}

input,
textarea,
.response-output,
.conversation-thread,
.history-block,
.system-preview,
.micro-copy,
.section-note,
.mode-switcher-hint,
.composer-actions-note,
.supplement-panel-copy {
  font-family: var(--ui-sans) !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
}

.response-output.rendered p,
.response-output.rendered li,
.history-block,
.conversation-thread {
  line-height: 1.78 !important;
}

@media (max-width: 760px) {
  .brand-main {
    letter-spacing: 0.22em !important;
  }

  .panel-head h2,
  .composer .panel-head h2,
  .response-card-answer .panel-head h2 {
    font-size: 1.08rem !important;
  }
}

/* Final type correction: preserve DISCERN exactly, tune the rest around it. */
.brand-mark {
  display: flex !important;
  align-items: baseline !important;
  gap: 14px !important;
  width: fit-content !important;
  margin: 0 !important;
  color: var(--text) !important;
  background: none !important;
  -webkit-background-clip: initial !important;
  background-clip: initial !important;
  text-shadow: none !important;
  font-family: var(--serif) !important;
  font-weight: 500 !important;
  line-height: 0.95 !important;
  letter-spacing: normal !important;
}

.brand-main {
  display: inline-block !important;
  color: var(--text) !important;
  font-family: var(--serif) !important;
  font-size: inherit !important;
  font-weight: 500 !important;
  letter-spacing: 0.24em !important;
  text-transform: uppercase !important;
}

.brand-agent {
  display: inline-block !important;
  color: var(--muted) !important;
  font-family: var(--sans) !important;
  font-size: 0.22em !important;
  font-weight: 400 !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  transform: translateY(-0.18em) !important;
}

.title-banner h1.brand-mark {
  font-size: 3rem !important;
}

.brand-block h1.brand-mark {
  font-size: 2rem !important;
}

body {
  font-family: var(--sans) !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
}

.hero h2,
.panel-head h2,
.composer .panel-head h2,
.response-card-answer .panel-head h2,
.response-output.rendered h1,
.response-output.rendered h2,
.response-output.rendered h3 {
  font-family: var(--serif) !important;
  font-weight: 500 !important;
  letter-spacing: 0.01em !important;
}

.panel-head h2,
.composer .panel-head h2,
.response-card-answer .panel-head h2 {
  font-size: 1.16rem !important;
  line-height: 1.3 !important;
}

.mode-switcher-title,
.supplement-panel-title,
.send-preview-title,
.tool-title,
.history-question-title,
.session-title,
.records-filter-caption,
.field > span,
.supplement-card > span {
  font-family: var(--sans) !important;
  font-weight: 500 !important;
  letter-spacing: 0.015em !important;
}

input,
textarea,
.response-output,
.conversation-thread,
.history-block,
.system-preview,
.micro-copy,
.section-note,
.mode-switcher-hint,
.composer-actions-note,
.supplement-panel-copy,
.page-nav-button,
.template-tab,
.delivery-mode-button,
.records-filter-button,
.records-mode-button,
.ghost-button,
.primary-button,
.mini-button,
.session-mini,
.status-pill {
  font-family: var(--sans) !important;
}

/* Senior typography polish: keep DISCERN untouched, make the interface speak the same language. */
:root {
  --editorial-serif: var(--serif);
  --interface-sans: "Inter", "Avenir Next", "PingFang SC", "Hiragino Sans GB", "Noto Sans SC", sans-serif;
}

body {
  font-family: var(--interface-sans) !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
  font-optical-sizing: auto;
  -webkit-font-smoothing: antialiased;
  text-rendering: geometricPrecision;
}

.hero h2,
.panel-head h2,
.composer .panel-head h2,
.response-card-answer .panel-head h2,
.response-output.rendered h1,
.response-output.rendered h2,
.response-output.rendered h3 {
  font-family: var(--editorial-serif) !important;
  font-weight: 500 !important;
  letter-spacing: 0.015em !important;
  line-height: 1.24 !important;
}

.hero h2 {
  font-size: clamp(2.08rem, 3.1vw, 3.05rem) !important;
  letter-spacing: 0.01em !important;
}

.panel-head h2,
.composer .panel-head h2,
.response-card-answer .panel-head h2 {
  font-size: 1.18rem !important;
}

.mode-switcher-title,
.supplement-panel-title,
.send-preview-title,
.tool-title,
.history-question-title,
.session-title {
  font-family: var(--editorial-serif) !important;
  font-weight: 500 !important;
  letter-spacing: 0.015em !important;
  line-height: 1.35 !important;
}

.records-filter-caption,
.field > span,
.supplement-card > span {
  font-family: var(--interface-sans) !important;
  font-size: 0.84rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.018em !important;
}

.title-copy,
.brand-copy,
.hero-copy,
.micro-copy,
.section-note,
.mode-switcher-hint,
.composer-actions-note,
.supplement-panel-copy,
.response-output,
.conversation-thread,
.history-block,
.system-preview,
input,
textarea {
  font-family: var(--interface-sans) !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
}

.title-copy,
.brand-copy {
  letter-spacing: 0.04em !important;
}

.page-nav-button,
.template-tab,
.delivery-mode-button,
.records-filter-button,
.records-mode-button,
.ghost-button,
.primary-button,
.mini-button,
.session-mini,
.status-pill {
  font-family: var(--interface-sans) !important;
  font-weight: 500 !important;
  letter-spacing: 0.018em !important;
}

.response-output.rendered p,
.response-output.rendered li,
.conversation-thread,
.history-block,
input,
textarea {
  line-height: 1.78 !important;
}

.eyebrow {
  font-family: var(--interface-sans) !important;
  font-weight: 500 !important;
  letter-spacing: 0.14em !important;
}

@media (max-width: 760px) {
  .hero h2 {
    font-size: 2rem !important;
  }

  .panel-head h2,
  .composer .panel-head h2,
  .response-card-answer .panel-head h2 {
    font-size: 1.1rem !important;
  }
}

/* Final type scale and color hierarchy: consistent, quiet, and aligned with DISCERN. */
:root {
  --type-hero: clamp(2.06rem, 3vw, 3rem);
  --type-section: 1.18rem;
  --type-subtitle: 0.98rem;
  --type-body: 0.95rem;
  --type-small: 0.84rem;
  --type-micro: 0.78rem;
  --tone-heading: var(--text);
  --tone-body: color-mix(in srgb, var(--text) 88%, var(--muted));
  --tone-label: color-mix(in srgb, var(--text) 78%, var(--muted));
  --tone-muted: var(--muted);
}

.hero h2 {
  color: var(--tone-heading) !important;
  font-size: var(--type-hero) !important;
}

.panel-head h2,
.composer .panel-head h2,
.response-card-answer .panel-head h2,
.response-output.rendered h1,
.response-output.rendered h2,
.response-output.rendered h3 {
  color: var(--tone-heading) !important;
  font-size: var(--type-section) !important;
}

.mode-switcher-title,
.supplement-panel-title,
.send-preview-title,
.tool-title,
.history-question-title,
.session-title {
  color: var(--tone-heading) !important;
  font-size: var(--type-subtitle) !important;
}

.field > span,
.supplement-card > span,
.records-filter-caption,
.history-block-label,
.session-meta,
.history-meta {
  color: var(--tone-label) !important;
  font-size: var(--type-small) !important;
}

body,
input,
textarea,
.response-output,
.conversation-thread,
.history-block,
.system-preview,
.mode-switcher-hint,
.response-output.rendered p,
.response-output.rendered li {
  color: var(--tone-body) !important;
  font-size: var(--type-body) !important;
}

.title-copy,
.brand-copy,
.hero-copy,
.micro-copy,
.section-note,
.composer-actions-note,
.supplement-panel-copy,
.send-preview-copy,
.response-output.empty,
.conversation-thread.empty {
  color: var(--tone-muted) !important;
  font-size: var(--type-small) !important;
}

.eyebrow,
.status-pill,
.page-nav-button,
.template-tab,
.delivery-mode-button,
.records-filter-button,
.records-mode-button,
.ghost-button,
.primary-button,
.mini-button,
.session-mini {
  font-size: var(--type-small) !important;
}

.brand-copy,
.title-copy {
  font-size: var(--type-micro) !important;
}

body[data-theme="dark"] {
  --tone-body: color-mix(in srgb, var(--text) 86%, var(--muted));
  --tone-label: color-mix(in srgb, var(--text) 76%, var(--muted));
}

@media (max-width: 760px) {
  :root {
    --type-section: 1.1rem;
    --type-subtitle: 0.94rem;
    --type-body: 0.93rem;
  }
}

/* Brand lock: DISCERN keeps the same editorial typography system with spacing tuned for seven letters. */
.brand-mark {
  font-family: var(--serif) !important;
  font-weight: 500 !important;
  letter-spacing: normal !important;
  line-height: 0.95 !important;
}

.brand-main {
  font-family: var(--serif) !important;
  font-weight: 500 !important;
  letter-spacing: 0.24em !important;
  text-transform: uppercase !important;
}

.brand-agent {
  font-family: var(--sans) !important;
  font-size: 0.22em !important;
  font-weight: 400 !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  transform: translateY(-0.18em) !important;
}

/* Final material pass: clearer gray glass, lighter panels, consistent translucency. */
body {
  background:
    radial-gradient(circle at 12% 6%, rgba(255, 255, 255, 0.96), transparent 28rem),
    radial-gradient(circle at 82% 3%, rgba(205, 221, 213, 0.34), transparent 30rem),
    radial-gradient(circle at 78% 92%, rgba(172, 190, 182, 0.18), transparent 26rem),
    linear-gradient(135deg, #eef2f4 0%, #fbfcfc 46%, #e3e9ec 100%) !important;
}

body[data-theme="dark"] {
  background:
    radial-gradient(circle at 14% 4%, rgba(130, 158, 138, 0.12), transparent 30rem),
    radial-gradient(circle at 86% 10%, rgba(218, 231, 223, 0.055), transparent 28rem),
    radial-gradient(circle at 76% 92%, rgba(98, 126, 106, 0.07), transparent 24rem),
    linear-gradient(135deg, #101618 0%, #151b1d 48%, #0d1314 100%) !important;
}

body .glass,
body .title-banner,
body .hero,
body .sidebar,
body .composer,
body .response-card,
body .response-card-answer,
body .response-card-history,
body .response-card-conversation,
body .response-card-prompt,
body .sidebar .panel,
body #section-settings,
body #section-structure,
body #section-tools,
body #section-records-filters,
body #section-question,
body #section-answer,
body #section-history,
body #section-conversation,
body #section-prompt,
body #section-question #supplement-panel,
body #section-question .send-preview,
body #section-question .mode-switcher-block,
body .records-filters-stack,
body .records-filter-block,
body .tool-item,
body .history-item,
body .history-block-surface,
body .session-item,
body .conversation-toolbar {
  background: rgba(250, 252, 253, 0.34) !important;
  border: 1px solid rgba(255, 255, 255, 0.62) !important;
  box-shadow:
    0 18px 46px rgba(28, 38, 43, 0.034),
    inset 0 1px 0 rgba(255, 255, 255, 0.74),
    inset 0 -1px 0 rgba(255, 255, 255, 0.18) !important;
  backdrop-filter: blur(38px) saturate(124%) !important;
  -webkit-backdrop-filter: blur(38px) saturate(124%) !important;
}

body[data-theme="dark"] .glass,
body[data-theme="dark"] .title-banner,
body[data-theme="dark"] .hero,
body[data-theme="dark"] .sidebar,
body[data-theme="dark"] .composer,
body[data-theme="dark"] .response-card,
body[data-theme="dark"] .response-card-answer,
body[data-theme="dark"] .response-card-history,
body[data-theme="dark"] .response-card-conversation,
body[data-theme="dark"] .response-card-prompt,
body[data-theme="dark"] .sidebar .panel,
body[data-theme="dark"] #section-settings,
body[data-theme="dark"] #section-structure,
body[data-theme="dark"] #section-tools,
body[data-theme="dark"] #section-records-filters,
body[data-theme="dark"] #section-question,
body[data-theme="dark"] #section-answer,
body[data-theme="dark"] #section-history,
body[data-theme="dark"] #section-conversation,
body[data-theme="dark"] #section-prompt,
body[data-theme="dark"] #section-question #supplement-panel,
body[data-theme="dark"] #section-question .send-preview,
body[data-theme="dark"] #section-question .mode-switcher-block,
body[data-theme="dark"] .records-filters-stack,
body[data-theme="dark"] .records-filter-block,
body[data-theme="dark"] .tool-item,
body[data-theme="dark"] .history-item,
body[data-theme="dark"] .history-block-surface,
body[data-theme="dark"] .session-item,
body[data-theme="dark"] .conversation-toolbar {
  background: rgba(22, 28, 30, 0.34) !important;
  border-color: rgba(231, 237, 232, 0.095) !important;
  box-shadow:
    0 20px 48px rgba(0, 0, 0, 0.16),
    inset 0 1px 0 rgba(255, 255, 255, 0.07),
    inset 0 -1px 0 rgba(255, 255, 255, 0.025) !important;
}

body input,
body textarea,
body .records-search-field,
body .records-search-field input,
body .response-output,
body .response-card-answer .response-output,
body .conversation-thread,
body .history-block,
body .history-block-surface,
body .history-question,
body .system-preview,
body .send-preview textarea,
body .supplement-card,
body .supplement-card textarea,
body #section-question .mode-switcher-hint,
body .page-switcher-nav,
body .template-switcher,
body .delivery-mode-switch,
body .records-filter-group {
  background: rgba(255, 255, 255, 0.28) !important;
  border: 1px solid rgba(223, 231, 235, 0.56) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.78),
    0 1px 2px rgba(24, 30, 35, 0.01) !important;
  backdrop-filter: blur(28px) saturate(118%) !important;
  -webkit-backdrop-filter: blur(28px) saturate(118%) !important;
}

body[data-theme="dark"] input,
body[data-theme="dark"] textarea,
body[data-theme="dark"] .records-search-field,
body[data-theme="dark"] .records-search-field input,
body[data-theme="dark"] .response-output,
body[data-theme="dark"] .response-card-answer .response-output,
body[data-theme="dark"] .conversation-thread,
body[data-theme="dark"] .history-block,
body[data-theme="dark"] .history-block-surface,
body[data-theme="dark"] .history-question,
body[data-theme="dark"] .system-preview,
body[data-theme="dark"] .send-preview textarea,
body[data-theme="dark"] .supplement-card,
body[data-theme="dark"] .supplement-card textarea,
body[data-theme="dark"] #section-question .mode-switcher-hint,
body[data-theme="dark"] .page-switcher-nav,
body[data-theme="dark"] .template-switcher,
body[data-theme="dark"] .delivery-mode-switch,
body[data-theme="dark"] .records-filter-group {
  background: rgba(255, 255, 255, 0.036) !important;
  border-color: rgba(231, 237, 232, 0.082) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.05),
    0 1px 2px rgba(0, 0, 0, 0.09) !important;
}

body .panel,
body .panel-head {
  background: transparent !important;
}

/* Editorial refinement at true file end. */
:root {
  --luxury-radius-outer: 18px;
  --luxury-radius-inner: 12px;
  --luxury-border-light: rgba(255, 255, 255, 0.58);
  --luxury-border-inner: rgba(223, 231, 235, 0.5);
  --luxury-green: rgba(57, 77, 64, 0.84);
}

body .title-banner,
body .hero,
body .sidebar,
body .composer,
body .response-card,
body .sidebar .panel,
body #section-question #supplement-panel,
body #section-question .send-preview,
body #section-question .mode-switcher-block,
body .records-filters-stack,
body .tool-item,
body .history-item,
body .session-item {
  border-radius: var(--luxury-radius-outer) !important;
  border-color: var(--luxury-border-light) !important;
}

body input,
body textarea,
body .response-output,
body .conversation-thread,
body .history-block,
body .history-block-surface,
body .history-question,
body .system-preview,
body .supplement-card,
body .records-search-field,
body .mode-switcher-hint {
  border-radius: var(--luxury-radius-inner) !important;
  border-color: var(--luxury-border-inner) !important;
}

.title-banner {
  padding: 34px 36px !important;
  gap: 34px !important;
}

.title-copy,
.brand-copy {
  opacity: 0.72 !important;
}

.page-switcher-nav,
.template-switcher,
.delivery-mode-switch,
.records-filter-group {
  padding: 4px !important;
  gap: 4px !important;
}

.page-nav-button,
.template-tab,
.delivery-mode-button,
.records-filter-button,
.records-mode-button {
  min-height: 32px !important;
  padding: 8px 15px !important;
}

#section-question .mode-switcher-block {
  padding: 18px !important;
}

#section-question .mode-switcher-title {
  margin-bottom: 12px !important;
}

#section-question .mode-switcher-hint {
  margin-top: 12px !important;
  padding: 14px 16px !important;
  gap: 8px 18px !important;
}

#section-question .mode-switcher-hint strong {
  color: color-mix(in srgb, var(--text) 74%, var(--muted)) !important;
  font-weight: 500 !important;
}

body .ghost-button:not(.delivery-mode-button):not(.records-mode-button):not(.records-filter-button):not(.template-tab):not(.page-nav-button):not(:disabled),
body .mini-button:not(.mini-button-primary):not(:disabled),
body .session-mini:not(.session-resume):not(.session-pin-toggle):not(:disabled) {
  background: rgba(255, 255, 255, 0.18) !important;
  border-color: rgba(223, 231, 235, 0.42) !important;
  color: color-mix(in srgb, var(--muted) 92%, var(--text)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.58),
    0 1px 2px rgba(24, 30, 35, 0.008) !important;
}

body[data-theme="dark"] .ghost-button:not(.delivery-mode-button):not(.records-mode-button):not(.records-filter-button):not(.template-tab):not(.page-nav-button):not(:disabled),
body[data-theme="dark"] .mini-button:not(.mini-button-primary):not(:disabled),
body[data-theme="dark"] .session-mini:not(.session-resume):not(.session-pin-toggle):not(:disabled) {
  background: rgba(255, 255, 255, 0.028) !important;
  border-color: rgba(231, 237, 232, 0.07) !important;
  color: color-mix(in srgb, var(--muted) 92%, var(--text)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.035),
    0 1px 2px rgba(0, 0, 0, 0.08) !important;
}

body .page-nav-button.active:not(:disabled),
body .template-tab.active:not(:disabled),
body .delivery-mode-button.active:not(:disabled),
body .records-filter-button.active:not(:disabled),
body .records-mode-button.active:not(:disabled),
body .primary-button:not(:disabled),
body .mini-button-primary:not(:disabled),
body .session-resume:not(:disabled),
body .session-pin-toggle:not(:disabled),
body #answer-followup:not(:disabled) {
  background: linear-gradient(135deg, rgba(102, 130, 111, 0.78) 0%, var(--luxury-green) 100%) !important;
  border-color: rgba(126, 154, 135, 0.28) !important;
  box-shadow:
    0 10px 22px rgba(20, 34, 26, 0.11),
    inset 0 1px 0 rgba(255, 255, 255, 0.16) !important;
}

body[data-theme="dark"] .page-nav-button.active:not(:disabled),
body[data-theme="dark"] .template-tab.active:not(:disabled),
body[data-theme="dark"] .delivery-mode-button.active:not(:disabled),
body[data-theme="dark"] .records-filter-button.active:not(:disabled),
body[data-theme="dark"] .records-mode-button.active:not(:disabled),
body[data-theme="dark"] .primary-button:not(:disabled),
body[data-theme="dark"] .mini-button-primary:not(:disabled),
body[data-theme="dark"] .session-resume:not(:disabled),
body[data-theme="dark"] .session-pin-toggle:not(:disabled),
body[data-theme="dark"] #answer-followup:not(:disabled) {
  background: linear-gradient(135deg, rgba(112, 142, 123, 0.42) 0%, rgba(45, 65, 52, 0.68) 100%) !important;
  border-color: rgba(128, 160, 139, 0.22) !important;
}

input::placeholder,
textarea::placeholder {
  color: color-mix(in srgb, var(--muted) 62%, transparent) !important;
}

input:focus,
textarea:focus {
  border-color: rgba(126, 154, 135, 0.38) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.82),
    0 0 0 1px rgba(126, 154, 135, 0.1) !important;
}

.response-output.rendered p {
  margin-bottom: 1em !important;
}

.response-output.rendered h1,
.response-output.rendered h2,
.response-output.rendered h3 {
  margin-top: 1.4em !important;
  margin-bottom: 0.62em !important;
}

/* History summary metadata chips: keep them, but make the fill light gray. */
#section-history .history-summary .history-meta .history-mode,
#section-history .history-summary .history-meta .history-state,
#section-history .history-summary .history-meta .history-state-session,
#section-history .history-summary .history-meta .history-state-single,
#section-history .history-summary .history-meta .history-state-pinned {
  min-height: 22px !important;
  padding: 4px 9px !important;
  border-radius: 999px !important;
  background: #eef1f2 !important;
  border: 1px solid #dde3e6 !important;
  color: #7f878b !important;
  box-shadow: none !important;
  font-size: 0.76rem !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  letter-spacing: 0.01em !important;
}

body[data-theme="dark"] #section-history .history-summary .history-meta .history-mode,
body[data-theme="dark"] #section-history .history-summary .history-meta .history-state,
body[data-theme="dark"] #section-history .history-summary .history-meta .history-state-session,
body[data-theme="dark"] #section-history .history-summary .history-meta .history-state-single,
body[data-theme="dark"] #section-history .history-summary .history-meta .history-state-pinned {
  background: rgba(231, 237, 232, 0.12) !important;
  border-color: rgba(231, 237, 232, 0.14) !important;
  color: #a9ada5 !important;
}

/* Final pass: all non-interactive metadata chips use the same quiet light-gray fill. */
#section-history .history-meta .history-mode,
#section-history .history-meta .history-state,
#section-history .history-meta .history-state-session,
#section-history .history-meta .history-state-single,
#section-history .history-meta .history-state-pinned,
#section-conversation .session-meta span,
#section-conversation .session-pin,
.panel-tools .status-pill.subtle,
.composer .status-pill-save.subtle {
  min-height: 22px !important;
  width: auto !important;
  padding: 4px 9px !important;
  border-radius: 999px !important;
  background: #eef1f2 !important;
  border: 1px solid #dde3e6 !important;
  color: #7f878b !important;
  box-shadow: none !important;
  font-size: 0.76rem !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  letter-spacing: 0.01em !important;
}

body[data-theme="dark"] #section-history .history-meta .history-mode,
body[data-theme="dark"] #section-history .history-meta .history-state,
body[data-theme="dark"] #section-history .history-meta .history-state-session,
body[data-theme="dark"] #section-history .history-meta .history-state-single,
body[data-theme="dark"] #section-history .history-meta .history-state-pinned,
body[data-theme="dark"] #section-conversation .session-meta span,
body[data-theme="dark"] #section-conversation .session-pin,
body[data-theme="dark"] .panel-tools .status-pill.subtle,
body[data-theme="dark"] .composer .status-pill-save.subtle {
  background: rgba(231, 237, 232, 0.12) !important;
  border-color: rgba(231, 237, 232, 0.14) !important;
  color: #a9ada5 !important;
}

/* Title area: restrained green glass gradient, keeping the DISCERN typography untouched. */
body .title-banner {
  position: relative !important;
  overflow: hidden !important;
  background:
    linear-gradient(126deg, rgba(48, 70, 57, 0.22) 0%, rgba(236, 241, 237, 0.28) 42%, rgba(203, 216, 207, 0.34) 100%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.54) 0%, rgba(255, 255, 255, 0.18) 100%) !important;
  border-color: rgba(98, 121, 105, 0.22) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.68),
    inset 0 -1px 0 rgba(98, 121, 105, 0.08),
    0 18px 46px rgba(42, 54, 46, 0.08) !important;
}

body .title-banner::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.18) 0%, transparent 28%, rgba(77, 99, 84, 0.1) 100%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.16) 0%, transparent 36%) !important;
  opacity: 0.86 !important;
}

body .title-banner::after {
  content: "" !important;
  position: absolute !important;
  left: 18px !important;
  right: 18px !important;
  bottom: 0 !important;
  height: 1px !important;
  pointer-events: none !important;
  background: linear-gradient(90deg, transparent, rgba(79, 102, 87, 0.34), transparent) !important;
}

body .title-banner > * {
  position: relative !important;
  z-index: 1 !important;
}

body[data-theme="dark"] .title-banner {
  background:
    linear-gradient(128deg, rgba(12, 17, 14, 0.92) 0%, rgba(27, 42, 32, 0.78) 46%, rgba(67, 88, 72, 0.5) 100%),
    linear-gradient(180deg, rgba(231, 237, 232, 0.08) 0%, rgba(231, 237, 232, 0.018) 100%) !important;
  border-color: rgba(179, 198, 184, 0.14) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.08),
    inset 0 -1px 0 rgba(231, 237, 232, 0.04),
    0 22px 54px rgba(0, 0, 0, 0.2) !important;
}

body[data-theme="dark"] .title-banner::before {
  background:
    linear-gradient(90deg, rgba(231, 237, 232, 0.08) 0%, transparent 31%, rgba(133, 161, 142, 0.12) 100%),
    linear-gradient(180deg, rgba(231, 237, 232, 0.07) 0%, transparent 42%) !important;
  opacity: 0.72 !important;
}

body[data-theme="dark"] .title-banner::after {
  background: linear-gradient(90deg, transparent, rgba(179, 198, 184, 0.24), transparent) !important;
}

/* Premium title treatment: editorial green glass, quieter navigation, stronger material depth. */
body .title-banner {
  min-height: 154px !important;
  padding: 38px 42px !important;
  gap: 38px !important;
  align-items: center !important;
  border-radius: 20px !important;
  background:
    linear-gradient(118deg, rgba(39, 61, 48, 0.34) 0%, rgba(125, 148, 132, 0.2) 34%, rgba(244, 247, 244, 0.28) 68%, rgba(194, 209, 199, 0.38) 100%),
    linear-gradient(178deg, rgba(255, 255, 255, 0.58) 0%, rgba(255, 255, 255, 0.16) 56%, rgba(220, 228, 222, 0.22) 100%),
    repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.05) 0 1px, transparent 1px 18px) !important;
  border-color: rgba(129, 151, 136, 0.26) !important;
  backdrop-filter: blur(26px) saturate(1.16) !important;
  -webkit-backdrop-filter: blur(26px) saturate(1.16) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.74),
    inset 0 -1px 0 rgba(57, 77, 64, 0.1),
    0 24px 62px rgba(31, 43, 35, 0.1) !important;
}

body .title-banner::before {
  display: block !important;
  content: "" !important;
  position: absolute !important;
  inset: 1px !important;
  border-radius: inherit !important;
  pointer-events: none !important;
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.22) 0%, transparent 23%, rgba(68, 92, 76, 0.12) 100%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.18) 0%, transparent 44%),
    linear-gradient(135deg, transparent 0%, transparent 58%, rgba(60, 84, 68, 0.08) 58%, transparent 72%) !important;
  opacity: 0.9 !important;
}

body .title-banner::after {
  left: 42px !important;
  right: 42px !important;
  bottom: 18px !important;
  height: 1px !important;
  background: linear-gradient(90deg, rgba(49, 72, 58, 0.28), transparent 42%, rgba(255, 255, 255, 0.38)) !important;
}

body .title-banner-content {
  align-self: center !important;
}

body .title-banner .title-copy {
  margin-top: 14px !important;
  max-width: 36ch !important;
  color: color-mix(in srgb, var(--muted) 84%, var(--text)) !important;
  opacity: 0.78 !important;
}

body .title-banner-nav {
  align-self: center !important;
}

body .title-nav.page-switcher-nav {
  padding: 5px !important;
  gap: 5px !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.2) !important;
  border: 1px solid rgba(255, 255, 255, 0.38) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.48),
    0 8px 18px rgba(34, 47, 38, 0.05) !important;
  backdrop-filter: blur(20px) saturate(1.1) !important;
  -webkit-backdrop-filter: blur(20px) saturate(1.1) !important;
}

body .title-nav .page-nav-button:not(:disabled) {
  min-height: 31px !important;
  padding: 7px 14px !important;
  border-radius: 999px !important;
  font-size: 0.78rem !important;
  letter-spacing: 0.03em !important;
}

body[data-theme="dark"] .title-banner {
  background:
    linear-gradient(118deg, rgba(8, 12, 10, 0.96) 0%, rgba(20, 34, 26, 0.9) 36%, rgba(38, 58, 45, 0.76) 69%, rgba(92, 114, 96, 0.42) 100%),
    linear-gradient(180deg, rgba(231, 237, 232, 0.095) 0%, rgba(231, 237, 232, 0.022) 58%, rgba(126, 154, 135, 0.04) 100%),
    repeating-linear-gradient(90deg, rgba(231, 237, 232, 0.018) 0 1px, transparent 1px 18px) !important;
  border-color: rgba(179, 198, 184, 0.16) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.085),
    inset 0 -1px 0 rgba(231, 237, 232, 0.042),
    0 28px 68px rgba(0, 0, 0, 0.24) !important;
}

body[data-theme="dark"] .title-banner::before {
  background:
    linear-gradient(90deg, rgba(231, 237, 232, 0.075) 0%, transparent 28%, rgba(133, 161, 142, 0.13) 100%),
    linear-gradient(180deg, rgba(231, 237, 232, 0.07) 0%, transparent 44%),
    linear-gradient(135deg, transparent 0%, transparent 58%, rgba(180, 205, 187, 0.05) 58%, transparent 74%) !important;
  opacity: 0.82 !important;
}

body[data-theme="dark"] .title-banner::after {
  background: linear-gradient(90deg, rgba(179, 198, 184, 0.22), transparent 42%, rgba(231, 237, 232, 0.18)) !important;
}

body[data-theme="dark"] .title-banner .title-copy {
  color: color-mix(in srgb, var(--muted) 88%, var(--text)) !important;
  opacity: 0.8 !important;
}

body[data-theme="dark"] .title-nav.page-switcher-nav {
  background: rgba(231, 237, 232, 0.055) !important;
  border-color: rgba(231, 237, 232, 0.1) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.055),
    0 10px 22px rgba(0, 0, 0, 0.15) !important;
}

/* True final text-box unification: one glass material for all editable/readable text fields. */
:root {
  --text-box-bg-light: rgba(255, 255, 255, 0.36);
  --text-box-border-light: rgba(223, 231, 235, 0.52);
  --text-box-bg-light-focus: rgba(255, 255, 255, 0.46);
  --text-box-bg-dark: rgba(231, 237, 232, 0.048);
  --text-box-border-dark: rgba(231, 237, 232, 0.095);
  --text-box-bg-dark-focus: rgba(231, 237, 232, 0.066);
}

body .field,
body .composer .field,
body .send-preview .field,
body .records-search-field,
body .supplement-card {
  background: var(--text-box-bg-light) !important;
  border-color: var(--text-box-border-light) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.48),
    0 1px 2px rgba(24, 30, 35, 0.01) !important;
}

body input,
body textarea,
body #question,
body #concern,
body #background,
body #other-party,
body #goal,
body #assembled-prompt,
body #system-prompt-preview,
body #records-search,
body #base-url,
body #api-key,
body #model,
body #temperature,
body .system-preview,
body .records-search-field input,
body .send-preview textarea,
body .supplement-card textarea,
body #section-question .field textarea,
body #section-settings input,
body #section-settings textarea {
  background: var(--text-box-bg-light) !important;
  border-color: var(--text-box-border-light) !important;
  color: var(--text) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.44),
    0 1px 2px rgba(24, 30, 35, 0.008) !important;
}

body input:focus,
body textarea:focus,
body #question:focus,
body #concern:focus,
body #background:focus,
body #other-party:focus,
body #goal:focus,
body #assembled-prompt:focus,
body #system-prompt-preview:focus,
body #records-search:focus,
body #base-url:focus,
body #api-key:focus,
body #model:focus,
body #temperature:focus,
body .system-preview:focus,
body .records-search-field input:focus,
body .send-preview textarea:focus,
body .supplement-card textarea:focus,
body #section-question .field textarea:focus,
body #section-settings input:focus,
body #section-settings textarea:focus {
  background: var(--text-box-bg-light-focus) !important;
  border-color: rgba(126, 154, 135, 0.36) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.54),
    0 0 0 1px rgba(126, 154, 135, 0.1) !important;
}

body[data-theme="dark"] .field,
body[data-theme="dark"] .composer .field,
body[data-theme="dark"] .send-preview .field,
body[data-theme="dark"] .records-search-field,
body[data-theme="dark"] .supplement-card {
  background: var(--text-box-bg-dark) !important;
  border-color: var(--text-box-border-dark) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.035),
    0 1px 2px rgba(0, 0, 0, 0.08) !important;
}

body[data-theme="dark"] input,
body[data-theme="dark"] textarea,
body[data-theme="dark"] #question,
body[data-theme="dark"] #concern,
body[data-theme="dark"] #background,
body[data-theme="dark"] #other-party,
body[data-theme="dark"] #goal,
body[data-theme="dark"] #assembled-prompt,
body[data-theme="dark"] #system-prompt-preview,
body[data-theme="dark"] #records-search,
body[data-theme="dark"] #base-url,
body[data-theme="dark"] #api-key,
body[data-theme="dark"] #model,
body[data-theme="dark"] #temperature,
body[data-theme="dark"] .system-preview,
body[data-theme="dark"] .records-search-field input,
body[data-theme="dark"] .send-preview textarea,
body[data-theme="dark"] .supplement-card textarea,
body[data-theme="dark"] #section-question .field textarea,
body[data-theme="dark"] #section-settings input,
body[data-theme="dark"] #section-settings textarea {
  background: var(--text-box-bg-dark) !important;
  border-color: var(--text-box-border-dark) !important;
  color: var(--text) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.035),
    0 1px 2px rgba(0, 0, 0, 0.08) !important;
}

body[data-theme="dark"] input:focus,
body[data-theme="dark"] textarea:focus,
body[data-theme="dark"] #question:focus,
body[data-theme="dark"] #concern:focus,
body[data-theme="dark"] #background:focus,
body[data-theme="dark"] #other-party:focus,
body[data-theme="dark"] #goal:focus,
body[data-theme="dark"] #assembled-prompt:focus,
body[data-theme="dark"] #system-prompt-preview:focus,
body[data-theme="dark"] #records-search:focus,
body[data-theme="dark"] #base-url:focus,
body[data-theme="dark"] #api-key:focus,
body[data-theme="dark"] #model:focus,
body[data-theme="dark"] #temperature:focus,
body[data-theme="dark"] .system-preview:focus,
body[data-theme="dark"] .records-search-field input:focus,
body[data-theme="dark"] .send-preview textarea:focus,
body[data-theme="dark"] .supplement-card textarea:focus,
body[data-theme="dark"] #section-question .field textarea:focus,
body[data-theme="dark"] #section-settings input:focus,
body[data-theme="dark"] #section-settings textarea:focus {
  background: var(--text-box-bg-dark-focus) !important;
  border-color: rgba(151, 176, 158, 0.2) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.045),
    0 0 0 1px rgba(126, 154, 135, 0.08) !important;
}

/* Dark-mode readability pass: keep the glass subtle, but make text inside boxes legible. */
body[data-theme="dark"] {
  --readable-text-dark: #edf2ec;
  --readable-body-dark: #dce4dc;
  --readable-label-dark: #e4ebe3;
  --readable-muted-dark: #b7beb5;
  --readable-placeholder-dark: rgba(220, 228, 220, 0.58);
}

body[data-theme="dark"] input,
body[data-theme="dark"] textarea,
body[data-theme="dark"] #question,
body[data-theme="dark"] #concern,
body[data-theme="dark"] #background,
body[data-theme="dark"] #other-party,
body[data-theme="dark"] #goal,
body[data-theme="dark"] #assembled-prompt,
body[data-theme="dark"] #system-prompt-preview,
body[data-theme="dark"] #records-search,
body[data-theme="dark"] #base-url,
body[data-theme="dark"] #api-key,
body[data-theme="dark"] #model,
body[data-theme="dark"] #temperature,
body[data-theme="dark"] .system-preview,
body[data-theme="dark"] .records-search-field input,
body[data-theme="dark"] .send-preview textarea,
body[data-theme="dark"] .supplement-card textarea,
body[data-theme="dark"] #section-question .field textarea,
body[data-theme="dark"] #section-settings input,
body[data-theme="dark"] #section-settings textarea {
  color: var(--readable-text-dark) !important;
  caret-color: var(--readable-text-dark) !important;
  -webkit-text-fill-color: var(--readable-text-dark) !important;
}

body[data-theme="dark"] input::placeholder,
body[data-theme="dark"] textarea::placeholder,
body[data-theme="dark"] #question::placeholder,
body[data-theme="dark"] #concern::placeholder,
body[data-theme="dark"] #background::placeholder,
body[data-theme="dark"] #other-party::placeholder,
body[data-theme="dark"] #goal::placeholder,
body[data-theme="dark"] #assembled-prompt::placeholder,
body[data-theme="dark"] #system-prompt-preview::placeholder,
body[data-theme="dark"] #records-search::placeholder,
body[data-theme="dark"] #base-url::placeholder,
body[data-theme="dark"] #api-key::placeholder,
body[data-theme="dark"] #model::placeholder,
body[data-theme="dark"] #temperature::placeholder,
body[data-theme="dark"] .system-preview::placeholder,
body[data-theme="dark"] .records-search-field input::placeholder,
body[data-theme="dark"] .send-preview textarea::placeholder,
body[data-theme="dark"] .supplement-card textarea::placeholder,
body[data-theme="dark"] #section-question .field textarea::placeholder,
body[data-theme="dark"] #section-settings input::placeholder,
body[data-theme="dark"] #section-settings textarea::placeholder {
  color: var(--readable-placeholder-dark) !important;
  -webkit-text-fill-color: var(--readable-placeholder-dark) !important;
}

body[data-theme="dark"] .field > span,
body[data-theme="dark"] .field > span:first-child,
body[data-theme="dark"] .supplement-card > span,
body[data-theme="dark"] .supplement-panel-title,
body[data-theme="dark"] .send-preview-title,
body[data-theme="dark"] .mode-switcher-title,
body[data-theme="dark"] .records-search-field span {
  color: var(--readable-label-dark) !important;
}

body[data-theme="dark"] .field-meta,
body[data-theme="dark"] .micro-copy,
body[data-theme="dark"] .section-note,
body[data-theme="dark"] .supplement-panel-copy,
body[data-theme="dark"] .send-preview-copy,
body[data-theme="dark"] .composer-actions-note,
body[data-theme="dark"] .mode-switcher-hint,
body[data-theme="dark"] .mode-switcher-hint div,
body[data-theme="dark"] .mode-switcher-hint strong {
  color: var(--readable-muted-dark) !important;
}

body[data-theme="dark"] .response-output,
body[data-theme="dark"] .response-card-answer .response-output,
body[data-theme="dark"] .conversation-thread,
body[data-theme="dark"] .history-list,
body[data-theme="dark"] .session-list,
body[data-theme="dark"] .system-preview {
  color: var(--readable-body-dark) !important;
}

body[data-theme="dark"] .response-output.empty,
body[data-theme="dark"] .response-output.empty p,
body[data-theme="dark"] .conversation-thread.empty,
body[data-theme="dark"] .conversation-thread.empty p,
body[data-theme="dark"] .history-list.empty,
body[data-theme="dark"] .history-list.empty p,
body[data-theme="dark"] .session-list.empty,
body[data-theme="dark"] .session-list.empty p {
  color: var(--readable-muted-dark) !important;
}

/* Corrective pass: high-specificity field system so older ID rules cannot override it. */
:root {
  --field-shell-bg-light: rgba(255, 255, 255, 0.34);
  --field-shell-border-light: rgba(220, 228, 232, 0.58);
  --field-shell-focus-light: rgba(255, 255, 255, 0.42);
  --field-text-light: #18201b;
  --field-label-light: #26342b;
  --field-muted-light: #6c746d;
  --field-placeholder-light: rgba(88, 96, 90, 0.62);
}

body[data-theme="dark"] {
  --field-shell-bg-dark: rgba(231, 237, 232, 0.072);
  --field-shell-border-dark: rgba(231, 237, 232, 0.135);
  --field-shell-focus-dark: rgba(231, 237, 232, 0.096);
  --field-text-dark: #f1f5ef;
  --field-label-dark: #eef3ec;
  --field-muted-dark: #c2cac0;
  --field-placeholder-dark: rgba(224, 231, 223, 0.66);
}

body #section-question label.field,
body #section-question .field-question-primary,
body #section-question .field-concern-secondary,
body #section-question .send-preview label.field,
body #section-question #supplement-panel .supplement-card,
body #section-settings label.field,
body #section-records-filters label.records-search-field,
body .records-search-field {
  background: var(--field-shell-bg-light) !important;
  border: 1px solid var(--field-shell-border-light) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.5),
    0 1px 2px rgba(24, 30, 35, 0.012) !important;
}

body[data-theme="dark"] #section-question label.field,
body[data-theme="dark"] #section-question .field-question-primary,
body[data-theme="dark"] #section-question .field-concern-secondary,
body[data-theme="dark"] #section-question .send-preview label.field,
body[data-theme="dark"] #section-question #supplement-panel .supplement-card,
body[data-theme="dark"] #section-settings label.field,
body[data-theme="dark"] #section-records-filters label.records-search-field,
body[data-theme="dark"] .records-search-field {
  background: var(--field-shell-bg-dark) !important;
  border: 1px solid var(--field-shell-border-dark) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.048),
    0 1px 2px rgba(0, 0, 0, 0.1) !important;
}

body #section-question label.field:focus-within,
body #section-question .send-preview label.field:focus-within,
body #section-question #supplement-panel .supplement-card:focus-within,
body #section-settings label.field:focus-within,
body #section-records-filters label.records-search-field:focus-within,
body .records-search-field:focus-within {
  background: var(--field-shell-focus-light) !important;
  border-color: rgba(126, 154, 135, 0.36) !important;
}

body[data-theme="dark"] #section-question label.field:focus-within,
body[data-theme="dark"] #section-question .send-preview label.field:focus-within,
body[data-theme="dark"] #section-question #supplement-panel .supplement-card:focus-within,
body[data-theme="dark"] #section-settings label.field:focus-within,
body[data-theme="dark"] #section-records-filters label.records-search-field:focus-within,
body[data-theme="dark"] .records-search-field:focus-within {
  background: var(--field-shell-focus-dark) !important;
  border-color: rgba(151, 176, 158, 0.24) !important;
}

body #section-question label.field input,
body #section-question label.field textarea,
body #section-question #question,
body #section-question #concern,
body #section-question #background,
body #section-question #other-party,
body #section-question #goal,
body #section-question #assembled-prompt,
body #section-question .send-preview textarea,
body #section-question #supplement-panel .supplement-card textarea,
body #section-question #supplement-panel textarea,
body #section-settings label.field input,
body #section-settings label.field textarea,
body #section-settings #base-url,
body #section-settings #api-key,
body #section-settings #model,
body #section-settings #temperature,
body #section-records-filters #records-search,
body .records-search-field input {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
  color: var(--field-text-light) !important;
  caret-color: var(--field-text-light) !important;
  -webkit-text-fill-color: var(--field-text-light) !important;
}

body[data-theme="dark"] #section-question label.field input,
body[data-theme="dark"] #section-question label.field textarea,
body[data-theme="dark"] #section-question #question,
body[data-theme="dark"] #section-question #concern,
body[data-theme="dark"] #section-question #background,
body[data-theme="dark"] #section-question #other-party,
body[data-theme="dark"] #section-question #goal,
body[data-theme="dark"] #section-question #assembled-prompt,
body[data-theme="dark"] #section-question .send-preview textarea,
body[data-theme="dark"] #section-question #supplement-panel .supplement-card textarea,
body[data-theme="dark"] #section-question #supplement-panel textarea,
body[data-theme="dark"] #section-settings label.field input,
body[data-theme="dark"] #section-settings label.field textarea,
body[data-theme="dark"] #section-settings #base-url,
body[data-theme="dark"] #section-settings #api-key,
body[data-theme="dark"] #section-settings #model,
body[data-theme="dark"] #section-settings #temperature,
body[data-theme="dark"] #section-records-filters #records-search,
body[data-theme="dark"] .records-search-field input {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
  color: var(--field-text-dark) !important;
  caret-color: var(--field-text-dark) !important;
  -webkit-text-fill-color: var(--field-text-dark) !important;
}

body #section-question label.field input::placeholder,
body #section-question label.field textarea::placeholder,
body #section-question #question::placeholder,
body #section-question #concern::placeholder,
body #section-question #background::placeholder,
body #section-question #other-party::placeholder,
body #section-question #goal::placeholder,
body #section-question #assembled-prompt::placeholder,
body #section-question .send-preview textarea::placeholder,
body #section-question #supplement-panel textarea::placeholder,
body #section-settings label.field input::placeholder,
body #section-settings label.field textarea::placeholder,
body #section-records-filters #records-search::placeholder,
body .records-search-field input::placeholder {
  color: var(--field-placeholder-light) !important;
  -webkit-text-fill-color: var(--field-placeholder-light) !important;
}

body[data-theme="dark"] #section-question label.field input::placeholder,
body[data-theme="dark"] #section-question label.field textarea::placeholder,
body[data-theme="dark"] #section-question #question::placeholder,
body[data-theme="dark"] #section-question #concern::placeholder,
body[data-theme="dark"] #section-question #background::placeholder,
body[data-theme="dark"] #section-question #other-party::placeholder,
body[data-theme="dark"] #section-question #goal::placeholder,
body[data-theme="dark"] #section-question #assembled-prompt::placeholder,
body[data-theme="dark"] #section-question .send-preview textarea::placeholder,
body[data-theme="dark"] #section-question #supplement-panel textarea::placeholder,
body[data-theme="dark"] #section-settings label.field input::placeholder,
body[data-theme="dark"] #section-settings label.field textarea::placeholder,
body[data-theme="dark"] #section-records-filters #records-search::placeholder,
body[data-theme="dark"] .records-search-field input::placeholder {
  color: var(--field-placeholder-dark) !important;
  -webkit-text-fill-color: var(--field-placeholder-dark) !important;
}

body #section-question label.field > span,
body #section-question .supplement-card > span,
body #section-settings label.field > span,
body #section-records-filters .records-search-field > span {
  color: var(--field-label-light) !important;
}

body[data-theme="dark"] #section-question label.field > span,
body[data-theme="dark"] #section-question .supplement-card > span,
body[data-theme="dark"] #section-settings label.field > span,
body[data-theme="dark"] #section-records-filters .records-search-field > span {
  color: var(--field-label-dark) !important;
}

body[data-theme="dark"] #section-question .field-meta,
body[data-theme="dark"] #section-question .supplement-panel-copy,
body[data-theme="dark"] #section-question .send-preview-copy,
body[data-theme="dark"] #section-question .composer-actions-note,
body[data-theme="dark"] #section-settings .field-meta,
body[data-theme="dark"] #section-records-filters .records-filter-caption {
  color: var(--field-muted-dark) !important;
}

body #section-prompt #system-prompt-preview,
body #section-answer .response-output,
body #section-conversation .conversation-thread,
body #section-history .history-list {
  background: var(--field-shell-bg-light) !important;
  border-color: var(--field-shell-border-light) !important;
  color: var(--field-text-light) !important;
}

body[data-theme="dark"] #section-prompt #system-prompt-preview,
body[data-theme="dark"] #section-answer .response-output,
body[data-theme="dark"] #section-conversation .conversation-thread,
body[data-theme="dark"] #section-history .history-list {
  background: var(--field-shell-bg-dark) !important;
  border-color: var(--field-shell-border-dark) !important;
  color: var(--field-text-dark) !important;
  -webkit-text-fill-color: initial !important;
}

body[data-theme="dark"] #section-prompt #system-prompt-preview {
  -webkit-text-fill-color: var(--field-text-dark) !important;
}

body[data-theme="dark"] #section-answer .response-output.empty,
body[data-theme="dark"] #section-answer .response-output.empty p,
body[data-theme="dark"] #section-conversation .conversation-thread.empty,
body[data-theme="dark"] #section-conversation .conversation-thread.empty p,
body[data-theme="dark"] #section-history .history-list.empty,
body[data-theme="dark"] #section-history .history-list.empty p {
  color: var(--field-muted-dark) !important;
}

/* Dark panel title visibility: older heading colors were too close to the panel background. */
body[data-theme="dark"] .panel-head h2,
body[data-theme="dark"] .composer .panel-head h2,
body[data-theme="dark"] .response-card .panel-head h2,
body[data-theme="dark"] .sidebar .panel .panel-head h2,
body[data-theme="dark"] #question-panel-title,
body[data-theme="dark"] #section-question h2,
body[data-theme="dark"] #section-answer h2,
body[data-theme="dark"] #section-history h2,
body[data-theme="dark"] #section-conversation h2,
body[data-theme="dark"] #section-settings h2,
body[data-theme="dark"] #section-prompt h2 {
  color: var(--field-label-dark) !important;
  opacity: 1 !important;
  -webkit-text-fill-color: var(--field-label-dark) !important;
}

body[data-theme="dark"] .composer,
body[data-theme="dark"] .response-card,
body[data-theme="dark"] .panel,
body[data-theme="dark"] #section-question,
body[data-theme="dark"] #section-answer,
body[data-theme="dark"] #section-history,
body[data-theme="dark"] #section-conversation,
body[data-theme="dark"] #section-settings,
body[data-theme="dark"] #section-prompt {
  color: var(--field-text-dark) !important;
}

/* Final contrast tuning after screenshot review. */
body[data-theme="dark"] {
  --field-shell-bg-dark: rgba(231, 237, 232, 0.088);
  --field-shell-border-dark: rgba(231, 237, 232, 0.17);
  --field-shell-focus-dark: rgba(231, 237, 232, 0.118);
  --field-placeholder-dark: rgba(236, 241, 235, 0.72);
  --field-muted-dark: #d0d7ce;
}

/* Dark settings/tools and history summaries: make non-field copy readable. */
body[data-theme="dark"] #section-tools,
body[data-theme="dark"] #section-tools .tools-stack,
body[data-theme="dark"] #section-tools .tool-item,
body[data-theme="dark"] #section-history .history-item,
body[data-theme="dark"] #section-history .history-summary {
  color: var(--field-text-dark) !important;
}

body[data-theme="dark"] #section-tools .panel-head h2,
body[data-theme="dark"] #section-tools h2,
body[data-theme="dark"] #section-tools .tool-title,
body[data-theme="dark"] #section-tools .tool-copy,
body[data-theme="dark"] #section-history .history-question-title,
body[data-theme="dark"] #section-history .history-summary .history-question-title,
body[data-theme="dark"] #section-history .history-summary .history-question {
  color: #f2f6f0 !important;
  opacity: 1 !important;
  -webkit-text-fill-color: #f2f6f0 !important;
}

body[data-theme="dark"] #section-history .history-answer-preview,
body[data-theme="dark"] #section-history .history-summary .history-answer-preview,
body[data-theme="dark"] #section-history .history-meta,
body[data-theme="dark"] #section-history .history-meta > span:not(.history-mode):not(.history-state),
body[data-theme="dark"] #section-tools .tool-action-label {
  color: #cbd4c9 !important;
  opacity: 1 !important;
  -webkit-text-fill-color: #cbd4c9 !important;
}

body[data-theme="dark"] #section-history .history-block-label,
body[data-theme="dark"] #section-history .history-question,
body[data-theme="dark"] #section-history .history-answer,
body[data-theme="dark"] #section-history .history-note,
body[data-theme="dark"] #section-history .history-conversation-content {
  color: #e8eee6 !important;
  opacity: 1 !important;
}

body[data-theme="dark"] #section-tools .tool-item {
  background: rgba(231, 237, 232, 0.072) !important;
  border-color: rgba(231, 237, 232, 0.14) !important;
}

body[data-theme="dark"] #section-history .history-item {
  background: rgba(231, 237, 232, 0.064) !important;
  border-color: rgba(231, 237, 232, 0.13) !important;
}

/* Balanced hierarchy pass: keep both light and dark themes clear, layered, and editorial. */
:root {
  --field-shell-bg-light: rgba(255, 255, 255, 0.62);
  --field-shell-border-light: rgba(108, 125, 113, 0.22);
  --field-shell-focus-light: rgba(255, 255, 255, 0.74);
  --field-text-light: #161d18;
  --field-label-light: #202b23;
  --field-muted-light: #5f6961;
  --field-placeholder-light: rgba(65, 75, 68, 0.64);
  --surface-panel-bg-light: rgba(248, 250, 248, 0.48);
  --surface-panel-border-light: rgba(103, 122, 110, 0.18);
}

body[data-theme="dark"] {
  --field-shell-bg-dark: rgba(231, 237, 232, 0.088);
  --field-shell-border-dark: rgba(231, 237, 232, 0.17);
  --field-shell-focus-dark: rgba(231, 237, 232, 0.118);
  --field-text-dark: #f1f5ef;
  --field-label-dark: #eef3ec;
  --field-muted-dark: #d0d7ce;
  --field-placeholder-dark: rgba(236, 241, 235, 0.72);
  --surface-panel-bg-dark: rgba(11, 17, 14, 0.58);
  --surface-panel-border-dark: rgba(231, 237, 232, 0.115);
}

body .composer,
body .response-card,
body .sidebar .panel,
body #section-settings,
body #section-tools,
body #section-records-filters,
body #section-question,
body #section-answer,
body #section-history,
body #section-conversation,
body #section-prompt {
  background: var(--surface-panel-bg-light) !important;
  border-color: var(--surface-panel-border-light) !important;
}

body[data-theme="dark"] .composer,
body[data-theme="dark"] .response-card,
body[data-theme="dark"] .sidebar .panel,
body[data-theme="dark"] #section-settings,
body[data-theme="dark"] #section-tools,
body[data-theme="dark"] #section-records-filters,
body[data-theme="dark"] #section-question,
body[data-theme="dark"] #section-answer,
body[data-theme="dark"] #section-history,
body[data-theme="dark"] #section-conversation,
body[data-theme="dark"] #section-prompt {
  background: var(--surface-panel-bg-dark) !important;
  border-color: var(--surface-panel-border-dark) !important;
}

body #section-question label.field,
body #section-question .field-question-primary,
body #section-question .field-concern-secondary,
body #section-question .send-preview label.field,
body #section-question #supplement-panel .supplement-card,
body #section-settings label.field,
body #section-records-filters label.records-search-field,
body .records-search-field,
body #section-prompt #system-prompt-preview,
body #section-answer .response-output,
body #section-conversation .conversation-thread,
body #section-history .history-list {
  background: var(--field-shell-bg-light) !important;
  border-color: var(--field-shell-border-light) !important;
  color: var(--field-text-light) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.68),
    0 1px 2px rgba(20, 28, 23, 0.018) !important;
}

body[data-theme="dark"] #section-question label.field,
body[data-theme="dark"] #section-question .field-question-primary,
body[data-theme="dark"] #section-question .field-concern-secondary,
body[data-theme="dark"] #section-question .send-preview label.field,
body[data-theme="dark"] #section-question #supplement-panel .supplement-card,
body[data-theme="dark"] #section-settings label.field,
body[data-theme="dark"] #section-records-filters label.records-search-field,
body[data-theme="dark"] .records-search-field,
body[data-theme="dark"] #section-prompt #system-prompt-preview,
body[data-theme="dark"] #section-answer .response-output,
body[data-theme="dark"] #section-conversation .conversation-thread,
body[data-theme="dark"] #section-history .history-list {
  background: var(--field-shell-bg-dark) !important;
  border-color: var(--field-shell-border-dark) !important;
  color: var(--field-text-dark) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.05),
    0 1px 2px rgba(0, 0, 0, 0.1) !important;
}

body #section-question label.field input,
body #section-question label.field textarea,
body #section-question #question,
body #section-question #concern,
body #section-question #background,
body #section-question #other-party,
body #section-question #goal,
body #section-question #assembled-prompt,
body #section-settings label.field input,
body #section-settings label.field textarea,
body #section-records-filters #records-search,
body .records-search-field input {
  color: var(--field-text-light) !important;
  caret-color: var(--field-text-light) !important;
  -webkit-text-fill-color: var(--field-text-light) !important;
}

body[data-theme="dark"] #section-question label.field input,
body[data-theme="dark"] #section-question label.field textarea,
body[data-theme="dark"] #section-question #question,
body[data-theme="dark"] #section-question #concern,
body[data-theme="dark"] #section-question #background,
body[data-theme="dark"] #section-question #other-party,
body[data-theme="dark"] #section-question #goal,
body[data-theme="dark"] #section-question #assembled-prompt,
body[data-theme="dark"] #section-settings label.field input,
body[data-theme="dark"] #section-settings label.field textarea,
body[data-theme="dark"] #section-records-filters #records-search,
body[data-theme="dark"] .records-search-field input {
  color: var(--field-text-dark) !important;
  caret-color: var(--field-text-dark) !important;
  -webkit-text-fill-color: var(--field-text-dark) !important;
}

body #section-question label.field > span,
body #section-question .supplement-card > span,
body #section-settings label.field > span,
body #section-records-filters .records-search-field > span,
body .panel-head h2,
body #question-panel-title,
body #section-tools .tool-title,
body #section-history .history-question-title {
  color: var(--field-label-light) !important;
  opacity: 1 !important;
}

body[data-theme="dark"] #section-question label.field > span,
body[data-theme="dark"] #section-question .supplement-card > span,
body[data-theme="dark"] #section-settings label.field > span,
body[data-theme="dark"] #section-records-filters .records-search-field > span,
body[data-theme="dark"] .panel-head h2,
body[data-theme="dark"] #question-panel-title,
body[data-theme="dark"] #section-tools .tool-title,
body[data-theme="dark"] #section-history .history-question-title {
  color: var(--field-label-dark) !important;
  opacity: 1 !important;
  -webkit-text-fill-color: var(--field-label-dark) !important;
}

body .field-meta,
body .micro-copy,
body .section-note,
body .supplement-panel-copy,
body .send-preview-copy,
body .composer-actions-note,
body #section-history .history-answer-preview,
body #section-history .history-meta,
body #section-tools .tool-action-label {
  color: var(--field-muted-light) !important;
  opacity: 1 !important;
}

body[data-theme="dark"] .field-meta,
body[data-theme="dark"] .micro-copy,
body[data-theme="dark"] .section-note,
body[data-theme="dark"] .supplement-panel-copy,
body[data-theme="dark"] .send-preview-copy,
body[data-theme="dark"] .composer-actions-note,
body[data-theme="dark"] #section-history .history-answer-preview,
body[data-theme="dark"] #section-history .history-meta,
body[data-theme="dark"] #section-tools .tool-action-label {
  color: var(--field-muted-dark) !important;
  opacity: 1 !important;
  -webkit-text-fill-color: var(--field-muted-dark) !important;
}

body #section-question label.field:focus-within,
body #section-question .send-preview label.field:focus-within,
body #section-question #supplement-panel .supplement-card:focus-within,
body #section-settings label.field:focus-within,
body #section-records-filters label.records-search-field:focus-within {
  background: var(--field-shell-focus-light) !important;
  border-color: rgba(83, 111, 91, 0.34) !important;
}

body[data-theme="dark"] #section-question label.field:focus-within,
body[data-theme="dark"] #section-question .send-preview label.field:focus-within,
body[data-theme="dark"] #section-question #supplement-panel .supplement-card:focus-within,
body[data-theme="dark"] #section-settings label.field:focus-within,
body[data-theme="dark"] #section-records-filters label.records-search-field:focus-within {
  background: var(--field-shell-focus-dark) !important;
  border-color: rgba(151, 176, 158, 0.24) !important;
}

/* Absolute final textbox material: same-level text boxes use one visible surface everywhere. */
:root {
  --textbox-surface-light-final: rgba(255, 255, 255, 0.62);
  --textbox-surface-focus-light-final: rgba(255, 255, 255, 0.74);
  --textbox-border-light-final: rgba(108, 125, 113, 0.22);
  --textbox-border-focus-light-final: rgba(126, 154, 135, 0.36);
  --textbox-shadow-light-final: inset 0 1px 0 rgba(255, 255, 255, 0.68), 0 1px 2px rgba(20, 28, 23, 0.018);
}

body[data-theme="dark"] {
  --textbox-surface-dark-final: rgba(231, 237, 232, 0.088);
  --textbox-surface-focus-dark-final: rgba(231, 237, 232, 0.118);
  --textbox-border-dark-final: rgba(231, 237, 232, 0.17);
  --textbox-border-focus-dark-final: rgba(151, 176, 158, 0.24);
  --textbox-shadow-dark-final: inset 0 1px 0 rgba(255, 255, 255, 0.048), 0 1px 2px rgba(0, 0, 0, 0.1);
}

body #section-question label.field,
body #section-question .field-question-primary,
body #section-question .field-concern-secondary,
body #section-question .send-preview label.field,
body #section-question #supplement-panel .supplement-card,
body #section-settings label.field,
body #section-records-filters label.records-search-field,
body #section-answer .response-output,
body #section-prompt #system-prompt-preview,
body #section-history .history-block-surface,
body #section-history .history-conversation-item,
body #section-conversation .conversation-thread {
  background: var(--textbox-surface-light-final) !important;
  border: 1px solid var(--textbox-border-light-final) !important;
  border-radius: 16px !important;
  box-shadow: var(--textbox-shadow-light-final) !important;
  color: var(--field-text-light, var(--discern-text)) !important;
  -webkit-text-fill-color: var(--field-text-light, var(--discern-text)) !important;
  backdrop-filter: blur(18px) saturate(125%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(125%) !important;
}

body[data-theme="dark"] #section-question label.field,
body[data-theme="dark"] #section-question .field-question-primary,
body[data-theme="dark"] #section-question .field-concern-secondary,
body[data-theme="dark"] #section-question .send-preview label.field,
body[data-theme="dark"] #section-question #supplement-panel .supplement-card,
body[data-theme="dark"] #section-settings label.field,
body[data-theme="dark"] #section-records-filters label.records-search-field,
body[data-theme="dark"] #section-answer .response-output,
body[data-theme="dark"] #section-prompt #system-prompt-preview,
body[data-theme="dark"] #section-history .history-block-surface,
body[data-theme="dark"] #section-history .history-conversation-item,
body[data-theme="dark"] #section-conversation .conversation-thread {
  background: var(--textbox-surface-dark-final) !important;
  border: 1px solid var(--textbox-border-dark-final) !important;
  border-radius: 16px !important;
  box-shadow: var(--textbox-shadow-dark-final) !important;
  color: var(--field-text-dark, var(--discern-text)) !important;
  -webkit-text-fill-color: var(--field-text-dark, var(--discern-text)) !important;
}

body #section-question label.field:focus-within,
body #section-question .send-preview label.field:focus-within,
body #section-question #supplement-panel .supplement-card:focus-within,
body #section-settings label.field:focus-within,
body #section-records-filters label.records-search-field:focus-within {
  background: var(--textbox-surface-focus-light-final) !important;
  border-color: var(--textbox-border-focus-light-final) !important;
}

body[data-theme="dark"] #section-question label.field:focus-within,
body[data-theme="dark"] #section-question .send-preview label.field:focus-within,
body[data-theme="dark"] #section-question #supplement-panel .supplement-card:focus-within,
body[data-theme="dark"] #section-settings label.field:focus-within,
body[data-theme="dark"] #section-records-filters label.records-search-field:focus-within {
  background: var(--textbox-surface-focus-dark-final) !important;
  border-color: var(--textbox-border-focus-dark-final) !important;
}

body #section-question label.field input,
body #section-question label.field textarea,
body #section-question #question,
body #section-question #concern,
body #section-question #background,
body #section-question #other-party,
body #section-question #goal,
body #section-question #assembled-prompt,
body #section-question .send-preview textarea,
body #section-question #supplement-panel .supplement-card textarea,
body #section-question #supplement-panel textarea,
body #section-settings label.field input,
body #section-settings label.field textarea,
body #section-settings #base-url,
body #section-settings #api-key,
body #section-settings #model,
body #section-settings #temperature,
body #section-records-filters #records-search,
body #section-prompt #system-prompt-preview {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--field-text-light, var(--discern-text)) !important;
  -webkit-text-fill-color: var(--field-text-light, var(--discern-text)) !important;
}

body[data-theme="dark"] #section-question label.field input,
body[data-theme="dark"] #section-question label.field textarea,
body[data-theme="dark"] #section-question #question,
body[data-theme="dark"] #section-question #concern,
body[data-theme="dark"] #section-question #background,
body[data-theme="dark"] #section-question #other-party,
body[data-theme="dark"] #section-question #goal,
body[data-theme="dark"] #section-question #assembled-prompt,
body[data-theme="dark"] #section-question .send-preview textarea,
body[data-theme="dark"] #section-question #supplement-panel .supplement-card textarea,
body[data-theme="dark"] #section-question #supplement-panel textarea,
body[data-theme="dark"] #section-settings label.field input,
body[data-theme="dark"] #section-settings label.field textarea,
body[data-theme="dark"] #section-settings #base-url,
body[data-theme="dark"] #section-settings #api-key,
body[data-theme="dark"] #section-settings #model,
body[data-theme="dark"] #section-settings #temperature,
body[data-theme="dark"] #section-records-filters #records-search,
body[data-theme="dark"] #section-prompt #system-prompt-preview {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--field-text-dark, var(--discern-text)) !important;
  -webkit-text-fill-color: var(--field-text-dark, var(--discern-text)) !important;
}

/* Settings mode selector is a control group, not a text box. */
body #section-settings label.delivery-mode-field,
body[data-theme="dark"] #section-settings label.delivery-mode-field {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  padding: 0 !important;
  border-radius: 0 !important;
}

body #section-settings .delivery-mode-switch,
body[data-theme="dark"] #section-settings .delivery-mode-switch {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}

/* Tool rows are actionable text boxes, not plain layout rows. */
body #section-tools .tool-item {
  background: var(--textbox-surface-light-eof) !important;
  border: 1px solid var(--textbox-border-light-eof) !important;
  border-radius: 16px !important;
  padding: 12px 14px !important;
  box-shadow: var(--textbox-shadow-light-eof) !important;
  backdrop-filter: blur(18px) saturate(125%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(125%) !important;
}

body[data-theme="dark"] #section-tools .tool-item {
  background: var(--textbox-surface-dark-eof) !important;
  border: 1px solid var(--textbox-border-dark-eof) !important;
  border-radius: 16px !important;
  padding: 12px 14px !important;
  box-shadow: var(--textbox-shadow-dark-eof) !important;
}

body #section-tools .tool-item + .tool-item {
  margin-top: 10px !important;
}

/* Absolute final textbox material: keep same-level text boxes visually identical. */
:root {
  --textbox-surface-light-final: rgba(255, 255, 255, 0.62);
  --textbox-surface-focus-light-final: rgba(255, 255, 255, 0.74);
  --textbox-border-light-final: rgba(108, 125, 113, 0.22);
  --textbox-border-focus-light-final: rgba(126, 154, 135, 0.36);
  --textbox-shadow-light-final: inset 0 1px 0 rgba(255, 255, 255, 0.68), 0 1px 2px rgba(20, 28, 23, 0.018);
}

body[data-theme="dark"] {
  --textbox-surface-dark-final: rgba(231, 237, 232, 0.088);
  --textbox-surface-focus-dark-final: rgba(231, 237, 232, 0.118);
  --textbox-border-dark-final: rgba(231, 237, 232, 0.17);
  --textbox-border-focus-dark-final: rgba(151, 176, 158, 0.24);
  --textbox-shadow-dark-final: inset 0 1px 0 rgba(255, 255, 255, 0.048), 0 1px 2px rgba(0, 0, 0, 0.1);
}

body #section-question label.field,
body #section-question .field-question-primary,
body #section-question .field-concern-secondary,
body #section-question .send-preview label.field,
body #section-question #supplement-panel .supplement-card,
body #section-settings label.field,
body #section-records-filters label.records-search-field,
body #section-answer .response-output,
body #section-prompt #system-prompt-preview,
body #section-history .history-block-surface,
body #section-history .history-conversation-item,
body #section-conversation .conversation-thread {
  background: var(--textbox-surface-light-final) !important;
  border: 1px solid var(--textbox-border-light-final) !important;
  border-radius: 16px !important;
  box-shadow: var(--textbox-shadow-light-final) !important;
  color: var(--field-text-light, var(--discern-text)) !important;
  -webkit-text-fill-color: var(--field-text-light, var(--discern-text)) !important;
  backdrop-filter: blur(18px) saturate(125%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(125%) !important;
}

body[data-theme="dark"] #section-question label.field,
body[data-theme="dark"] #section-question .field-question-primary,
body[data-theme="dark"] #section-question .field-concern-secondary,
body[data-theme="dark"] #section-question .send-preview label.field,
body[data-theme="dark"] #section-question #supplement-panel .supplement-card,
body[data-theme="dark"] #section-settings label.field,
body[data-theme="dark"] #section-records-filters label.records-search-field,
body[data-theme="dark"] #section-answer .response-output,
body[data-theme="dark"] #section-prompt #system-prompt-preview,
body[data-theme="dark"] #section-history .history-block-surface,
body[data-theme="dark"] #section-history .history-conversation-item,
body[data-theme="dark"] #section-conversation .conversation-thread {
  background: var(--textbox-surface-dark-final) !important;
  border: 1px solid var(--textbox-border-dark-final) !important;
  border-radius: 16px !important;
  box-shadow: var(--textbox-shadow-dark-final) !important;
  color: var(--field-text-dark, var(--discern-text)) !important;
  -webkit-text-fill-color: var(--field-text-dark, var(--discern-text)) !important;
}

body #section-question label.field:focus-within,
body #section-question .send-preview label.field:focus-within,
body #section-question #supplement-panel .supplement-card:focus-within,
body #section-settings label.field:focus-within,
body #section-records-filters label.records-search-field:focus-within {
  background: var(--textbox-surface-focus-light-final) !important;
  border-color: var(--textbox-border-focus-light-final) !important;
}

body[data-theme="dark"] #section-question label.field:focus-within,
body[data-theme="dark"] #section-question .send-preview label.field:focus-within,
body[data-theme="dark"] #section-question #supplement-panel .supplement-card:focus-within,
body[data-theme="dark"] #section-settings label.field:focus-within,
body[data-theme="dark"] #section-records-filters label.records-search-field:focus-within {
  background: var(--textbox-surface-focus-dark-final) !important;
  border-color: var(--textbox-border-focus-dark-final) !important;
}

body #section-question label.field input,
body #section-question label.field textarea,
body #section-question #question,
body #section-question #concern,
body #section-question #background,
body #section-question #other-party,
body #section-question #goal,
body #section-question #assembled-prompt,
body #section-question .send-preview textarea,
body #section-question #supplement-panel .supplement-card textarea,
body #section-question #supplement-panel textarea,
body #section-settings label.field input,
body #section-settings label.field textarea,
body #section-settings #base-url,
body #section-settings #api-key,
body #section-settings #model,
body #section-settings #temperature,
body #section-records-filters #records-search,
body #section-prompt #system-prompt-preview {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--field-text-light, var(--discern-text)) !important;
  -webkit-text-fill-color: var(--field-text-light, var(--discern-text)) !important;
}

body[data-theme="dark"] #section-question label.field input,
body[data-theme="dark"] #section-question label.field textarea,
body[data-theme="dark"] #section-question #question,
body[data-theme="dark"] #section-question #concern,
body[data-theme="dark"] #section-question #background,
body[data-theme="dark"] #section-question #other-party,
body[data-theme="dark"] #section-question #goal,
body[data-theme="dark"] #section-question #assembled-prompt,
body[data-theme="dark"] #section-question .send-preview textarea,
body[data-theme="dark"] #section-question #supplement-panel .supplement-card textarea,
body[data-theme="dark"] #section-question #supplement-panel textarea,
body[data-theme="dark"] #section-settings label.field input,
body[data-theme="dark"] #section-settings label.field textarea,
body[data-theme="dark"] #section-settings #base-url,
body[data-theme="dark"] #section-settings #api-key,
body[data-theme="dark"] #section-settings #model,
body[data-theme="dark"] #section-settings #temperature,
body[data-theme="dark"] #section-records-filters #records-search,
body[data-theme="dark"] #section-prompt #system-prompt-preview {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--field-text-dark, var(--discern-text)) !important;
  -webkit-text-fill-color: var(--field-text-dark, var(--discern-text)) !important;
}

/* True final textbox material: same-level text boxes use one visible surface everywhere. */
:root {
  --textbox-surface-light: rgba(255, 255, 255, 0.62);
  --textbox-surface-focus-light: rgba(255, 255, 255, 0.74);
  --textbox-border-light: rgba(108, 125, 113, 0.22);
  --textbox-border-focus-light: rgba(126, 154, 135, 0.36);
  --textbox-shadow-light: inset 0 1px 0 rgba(255, 255, 255, 0.68), 0 1px 2px rgba(20, 28, 23, 0.018);
}

body[data-theme="dark"] {
  --textbox-surface-dark: rgba(231, 237, 232, 0.088);
  --textbox-surface-focus-dark: rgba(231, 237, 232, 0.118);
  --textbox-border-dark: rgba(231, 237, 232, 0.17);
  --textbox-border-focus-dark: rgba(151, 176, 158, 0.24);
  --textbox-shadow-dark: inset 0 1px 0 rgba(255, 255, 255, 0.048), 0 1px 2px rgba(0, 0, 0, 0.1);
}

body #section-question label.field,
body #section-question .field-question-primary,
body #section-question .field-concern-secondary,
body #section-question .send-preview label.field,
body #section-question #supplement-panel .supplement-card,
body #section-settings label.field,
body #section-records-filters label.records-search-field,
body #section-answer .response-output,
body #section-prompt #system-prompt-preview,
body #section-history .history-block-surface,
body #section-history .history-conversation-item,
body #section-conversation .conversation-thread {
  background: var(--textbox-surface-light) !important;
  border: 1px solid var(--textbox-border-light) !important;
  border-radius: 16px !important;
  box-shadow: var(--textbox-shadow-light) !important;
  color: var(--field-text-light, var(--discern-text)) !important;
  -webkit-text-fill-color: var(--field-text-light, var(--discern-text)) !important;
  backdrop-filter: blur(18px) saturate(125%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(125%) !important;
}

body[data-theme="dark"] #section-question label.field,
body[data-theme="dark"] #section-question .field-question-primary,
body[data-theme="dark"] #section-question .field-concern-secondary,
body[data-theme="dark"] #section-question .send-preview label.field,
body[data-theme="dark"] #section-question #supplement-panel .supplement-card,
body[data-theme="dark"] #section-settings label.field,
body[data-theme="dark"] #section-records-filters label.records-search-field,
body[data-theme="dark"] #section-answer .response-output,
body[data-theme="dark"] #section-prompt #system-prompt-preview,
body[data-theme="dark"] #section-history .history-block-surface,
body[data-theme="dark"] #section-history .history-conversation-item,
body[data-theme="dark"] #section-conversation .conversation-thread {
  background: var(--textbox-surface-dark) !important;
  border: 1px solid var(--textbox-border-dark) !important;
  border-radius: 16px !important;
  box-shadow: var(--textbox-shadow-dark) !important;
  color: var(--field-text-dark, var(--discern-text)) !important;
  -webkit-text-fill-color: var(--field-text-dark, var(--discern-text)) !important;
}

body #section-question label.field:focus-within,
body #section-question .send-preview label.field:focus-within,
body #section-question #supplement-panel .supplement-card:focus-within,
body #section-settings label.field:focus-within,
body #section-records-filters label.records-search-field:focus-within {
  background: var(--textbox-surface-focus-light) !important;
  border-color: var(--textbox-border-focus-light) !important;
}

body[data-theme="dark"] #section-question label.field:focus-within,
body[data-theme="dark"] #section-question .send-preview label.field:focus-within,
body[data-theme="dark"] #section-question #supplement-panel .supplement-card:focus-within,
body[data-theme="dark"] #section-settings label.field:focus-within,
body[data-theme="dark"] #section-records-filters label.records-search-field:focus-within {
  background: var(--textbox-surface-focus-dark) !important;
  border-color: var(--textbox-border-focus-dark) !important;
}

body #section-question label.field input,
body #section-question label.field textarea,
body #section-question #question,
body #section-question #concern,
body #section-question #background,
body #section-question #other-party,
body #section-question #goal,
body #section-question #assembled-prompt,
body #section-question .send-preview textarea,
body #section-question #supplement-panel .supplement-card textarea,
body #section-question #supplement-panel textarea,
body #section-settings label.field input,
body #section-settings label.field textarea,
body #section-settings #base-url,
body #section-settings #api-key,
body #section-settings #model,
body #section-settings #temperature,
body #section-records-filters #records-search,
body #section-prompt #system-prompt-preview {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--field-text-light, var(--discern-text)) !important;
  -webkit-text-fill-color: var(--field-text-light, var(--discern-text)) !important;
}

body[data-theme="dark"] #section-question label.field input,
body[data-theme="dark"] #section-question label.field textarea,
body[data-theme="dark"] #section-question #question,
body[data-theme="dark"] #section-question #concern,
body[data-theme="dark"] #section-question #background,
body[data-theme="dark"] #section-question #other-party,
body[data-theme="dark"] #section-question #goal,
body[data-theme="dark"] #section-question #assembled-prompt,
body[data-theme="dark"] #section-question .send-preview textarea,
body[data-theme="dark"] #section-question #supplement-panel .supplement-card textarea,
body[data-theme="dark"] #section-question #supplement-panel textarea,
body[data-theme="dark"] #section-settings label.field input,
body[data-theme="dark"] #section-settings label.field textarea,
body[data-theme="dark"] #section-settings #base-url,
body[data-theme="dark"] #section-settings #api-key,
body[data-theme="dark"] #section-settings #model,
body[data-theme="dark"] #section-settings #temperature,
body[data-theme="dark"] #section-records-filters #records-search,
body[data-theme="dark"] #section-prompt #system-prompt-preview {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--field-text-dark, var(--discern-text)) !important;
  -webkit-text-fill-color: var(--field-text-dark, var(--discern-text)) !important;
}

/* Final typography scale: same semantic level, same size, weight, and tone. */
:root {
  --ui-title-size: 1.16rem;
  --ui-section-size: 0.98rem;
  --ui-label-size: 0.86rem;
  --ui-body-size: 0.94rem;
  --ui-note-size: 0.82rem;
  --ui-chip-size: 0.76rem;
  --ui-title-weight: 500;
  --ui-label-weight: 500;
  --ui-body-weight: 400;
  --ui-note-weight: 400;
  --ui-title-light: #1b241e;
  --ui-label-light: #26342b;
  --ui-body-light: #2e3931;
  --ui-muted-light: #667069;
  --ui-title-dark: #eef3ec;
  --ui-label-dark: #e5ece4;
  --ui-body-dark: #dce5dc;
  --ui-muted-dark: #c0c9bf;
}

body .panel-head h2,
body .composer .panel-head h2,
body .response-card .panel-head h2,
body .sidebar .panel .panel-head h2,
body #question-panel-title,
body #section-settings .panel-head h2,
body #section-tools .panel-head h2,
body #section-records-filters .panel-head h2,
body #section-answer .panel-head h2,
body #section-history .panel-head h2,
body #section-conversation .panel-head h2,
body #section-prompt .panel-head h2 {
  color: var(--ui-title-light) !important;
  font-size: var(--ui-title-size) !important;
  font-weight: var(--ui-title-weight) !important;
  line-height: 1.35 !important;
  letter-spacing: 0 !important;
  opacity: 1 !important;
}

body[data-theme="dark"] .panel-head h2,
body[data-theme="dark"] .composer .panel-head h2,
body[data-theme="dark"] .response-card .panel-head h2,
body[data-theme="dark"] .sidebar .panel .panel-head h2,
body[data-theme="dark"] #question-panel-title,
body[data-theme="dark"] #section-settings .panel-head h2,
body[data-theme="dark"] #section-tools .panel-head h2,
body[data-theme="dark"] #section-records-filters .panel-head h2,
body[data-theme="dark"] #section-answer .panel-head h2,
body[data-theme="dark"] #section-history .panel-head h2,
body[data-theme="dark"] #section-conversation .panel-head h2,
body[data-theme="dark"] #section-prompt .panel-head h2 {
  color: var(--ui-title-dark) !important;
  -webkit-text-fill-color: var(--ui-title-dark) !important;
}

body .mode-switcher-title,
body #section-question .mode-switcher-title,
body .supplement-panel-title,
body #section-question #supplement-panel .supplement-panel-title,
body .send-preview-title,
body #section-tools .tool-title,
body .tool-title,
body .history-question-title,
body #section-history .history-question-title,
body .session-title {
  color: var(--ui-title-light) !important;
  font-size: var(--ui-section-size) !important;
  font-weight: var(--ui-label-weight) !important;
  line-height: 1.45 !important;
  letter-spacing: 0 !important;
  opacity: 1 !important;
}

body[data-theme="dark"] .mode-switcher-title,
body[data-theme="dark"] #section-question .mode-switcher-title,
body[data-theme="dark"] .supplement-panel-title,
body[data-theme="dark"] #section-question #supplement-panel .supplement-panel-title,
body[data-theme="dark"] .send-preview-title,
body[data-theme="dark"] #section-tools .tool-title,
body[data-theme="dark"] .tool-title,
body[data-theme="dark"] .history-question-title,
body[data-theme="dark"] #section-history .history-question-title,
body[data-theme="dark"] .session-title {
  color: var(--ui-title-dark) !important;
  -webkit-text-fill-color: var(--ui-title-dark) !important;
}

body .field > span,
body .field > span:first-child,
body #section-question label.field > span,
body #section-question .field > span,
body .supplement-card > span,
body #section-question #supplement-panel .supplement-card > span,
body #section-settings label.field > span,
body #section-records-filters .records-search-field > span,
body .history-block-label,
body .history-conversation-role {
  color: var(--ui-label-light) !important;
  font-size: var(--ui-label-size) !important;
  font-weight: var(--ui-label-weight) !important;
  line-height: 1.45 !important;
  letter-spacing: 0 !important;
  opacity: 1 !important;
}

body[data-theme="dark"] .field > span,
body[data-theme="dark"] .field > span:first-child,
body[data-theme="dark"] #section-question label.field > span,
body[data-theme="dark"] #section-question .field > span,
body[data-theme="dark"] .supplement-card > span,
body[data-theme="dark"] #section-question #supplement-panel .supplement-card > span,
body[data-theme="dark"] #section-settings label.field > span,
body[data-theme="dark"] #section-records-filters .records-search-field > span,
body[data-theme="dark"] .history-block-label,
body[data-theme="dark"] .history-conversation-role {
  color: var(--ui-label-dark) !important;
  -webkit-text-fill-color: var(--ui-label-dark) !important;
}

body input,
body textarea,
body #section-question textarea,
body #section-question #supplement-panel textarea,
body #section-settings input,
body #section-settings textarea,
body .response-output,
body .system-preview,
body .history-question,
body .history-answer,
body .history-note,
body .history-conversation-content {
  color: var(--ui-body-light) !important;
  font-size: var(--ui-body-size) !important;
  font-weight: var(--ui-body-weight) !important;
  line-height: 1.7 !important;
  letter-spacing: 0 !important;
}

body[data-theme="dark"] input,
body[data-theme="dark"] textarea,
body[data-theme="dark"] #section-question textarea,
body[data-theme="dark"] #section-question #supplement-panel textarea,
body[data-theme="dark"] #section-settings input,
body[data-theme="dark"] #section-settings textarea,
body[data-theme="dark"] .response-output,
body[data-theme="dark"] .system-preview,
body[data-theme="dark"] .history-question,
body[data-theme="dark"] .history-answer,
body[data-theme="dark"] .history-note,
body[data-theme="dark"] .history-conversation-content {
  color: var(--ui-body-dark) !important;
  -webkit-text-fill-color: var(--ui-body-dark) !important;
}

body .micro-copy,
body .section-note,
body .field-meta,
body .title-copy,
body .brand-copy,
body .supplement-panel-copy,
body #section-question #supplement-panel .supplement-panel-copy,
body .send-preview-copy,
body .composer-actions-note,
body .mode-switcher-hint,
body .mode-switcher-hint div,
body .mode-switcher-hint strong,
body .history-answer-preview,
body .history-meta,
body .history-meta > span,
body #section-tools .tool-action-label,
body .response-output.empty,
body .conversation-thread.empty,
body .history-list.empty {
  color: var(--ui-muted-light) !important;
  font-size: var(--ui-note-size) !important;
  font-weight: var(--ui-note-weight) !important;
  line-height: 1.65 !important;
  letter-spacing: 0 !important;
  opacity: 1 !important;
}

body[data-theme="dark"] .micro-copy,
body[data-theme="dark"] .section-note,
body[data-theme="dark"] .field-meta,
body[data-theme="dark"] .title-copy,
body[data-theme="dark"] .brand-copy,
body[data-theme="dark"] .supplement-panel-copy,
body[data-theme="dark"] #section-question #supplement-panel .supplement-panel-copy,
body[data-theme="dark"] .send-preview-copy,
body[data-theme="dark"] .composer-actions-note,
body[data-theme="dark"] .mode-switcher-hint,
body[data-theme="dark"] .mode-switcher-hint div,
body[data-theme="dark"] .mode-switcher-hint strong,
body[data-theme="dark"] .history-answer-preview,
body[data-theme="dark"] .history-meta,
body[data-theme="dark"] .history-meta > span,
body[data-theme="dark"] #section-tools .tool-action-label,
body[data-theme="dark"] .response-output.empty,
body[data-theme="dark"] .conversation-thread.empty,
body[data-theme="dark"] .history-list.empty {
  color: var(--ui-muted-dark) !important;
  -webkit-text-fill-color: var(--ui-muted-dark) !important;
}

body .history-mode,
body .history-state,
body .history-state-session,
body .history-state-single,
body .history-state-pinned,
body .status-pill,
body .status-pill-save {
  font-size: var(--ui-chip-size) !important;
  font-weight: var(--ui-note-weight) !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
}

/* Final title treatment: remove gradient color while keeping the glass surface. */
body .title-banner {
  background: rgba(248, 250, 248, 0.58) !important;
  border-color: rgba(103, 122, 110, 0.18) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.68),
    0 18px 44px rgba(35, 45, 38, 0.08) !important;
}

body[data-theme="dark"] .title-banner {
  background: rgba(11, 17, 14, 0.72) !important;
  border-color: rgba(231, 237, 232, 0.13) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.06),
    0 22px 54px rgba(0, 0, 0, 0.22) !important;
}

body .title-banner::before,
body[data-theme="dark"] .title-banner::before {
  display: none !important;
  background: none !important;
}

body .title-banner::after {
  background: rgba(103, 122, 110, 0.18) !important;
}

body[data-theme="dark"] .title-banner::after {
  background: rgba(231, 237, 232, 0.12) !important;
}

/* DISCERN restoration: one final material system for the whole UI. */
:root {
  --discern-bg-1: #eef2f4;
  --discern-bg-2: #e4e9ec;
  --discern-bg-3: #d7dde1;
  --discern-panel: rgba(247, 250, 251, 0.54);
  --discern-panel-strong: rgba(252, 254, 255, 0.68);
  --discern-field: rgba(255, 255, 255, 0.48);
  --discern-field-strong: rgba(255, 255, 255, 0.62);
  --discern-line: rgba(104, 118, 126, 0.22);
  --discern-line-strong: rgba(90, 106, 116, 0.3);
  --discern-text: #20282c;
  --discern-muted: #66737a;
  --discern-soft: #e9eef1;
  --discern-selected: rgba(76, 104, 86, 0.82);
  --discern-selected-hover: rgba(88, 118, 98, 0.9);
  --discern-shadow: 0 24px 70px rgba(44, 56, 64, 0.13);
  --discern-inner: inset 0 1px 0 rgba(255, 255, 255, 0.72);
}

body[data-theme="dark"] {
  --discern-bg-1: #0f1416;
  --discern-bg-2: #151b1e;
  --discern-bg-3: #1b2226;
  --discern-panel: rgba(22, 29, 32, 0.56);
  --discern-panel-strong: rgba(28, 36, 40, 0.68);
  --discern-field: rgba(28, 36, 40, 0.52);
  --discern-field-strong: rgba(34, 43, 47, 0.64);
  --discern-line: rgba(216, 226, 230, 0.13);
  --discern-line-strong: rgba(216, 226, 230, 0.2);
  --discern-text: #edf3f4;
  --discern-muted: #a6b0b4;
  --discern-soft: rgba(232, 239, 242, 0.08);
  --discern-selected: rgba(96, 128, 106, 0.86);
  --discern-selected-hover: rgba(108, 142, 118, 0.94);
  --discern-shadow: 0 28px 80px rgba(0, 0, 0, 0.34);
  --discern-inner: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

html,
body {
  background:
    radial-gradient(circle at 12% 0%, rgba(255, 255, 255, 0.36), transparent 28rem),
    radial-gradient(circle at 88% 12%, rgba(169, 183, 190, 0.2), transparent 24rem),
    linear-gradient(180deg, var(--discern-bg-1) 0%, var(--discern-bg-2) 52%, var(--discern-bg-3) 100%) !important;
  color: var(--discern-text) !important;
}

body[data-theme="dark"],
body[data-theme="dark"] html {
  background:
    radial-gradient(circle at 12% 0%, rgba(162, 181, 171, 0.11), transparent 26rem),
    radial-gradient(circle at 88% 10%, rgba(216, 226, 230, 0.055), transparent 22rem),
    linear-gradient(180deg, var(--discern-bg-1) 0%, var(--discern-bg-2) 52%, var(--discern-bg-3) 100%) !important;
  color: var(--discern-text) !important;
}

body .glass,
body .title-banner,
body .hero,
body .composer,
body .response-card,
body .panel,
body .layout-card,
body .mode-switcher-block,
body .supplement-panel,
body .send-preview,
body .tool-item,
body .history-item,
body .history-conversation,
body .session-context,
body .conversation-thread,
body .history-list,
body .response-output,
body .system-preview,
body .mode-switcher-hint,
body .supplement-card,
body .records-filter-block {
  background: var(--discern-panel) !important;
  border: 1px solid var(--discern-line) !important;
  box-shadow: var(--discern-inner), var(--discern-shadow) !important;
  backdrop-filter: blur(26px) saturate(135%) !important;
  -webkit-backdrop-filter: blur(26px) saturate(135%) !important;
}

body .title-banner,
body .hero,
body .composer,
body .response-card,
body .panel,
body .layout-card {
  border-radius: 24px !important;
}

body .title-banner,
body .mode-switcher-block,
body .supplement-panel,
body .send-preview {
  background: var(--discern-panel-strong) !important;
}

body[data-theme="dark"] .glass,
body[data-theme="dark"] .title-banner,
body[data-theme="dark"] .hero,
body[data-theme="dark"] .composer,
body[data-theme="dark"] .response-card,
body[data-theme="dark"] .panel,
body[data-theme="dark"] .layout-card,
body[data-theme="dark"] .mode-switcher-block,
body[data-theme="dark"] .supplement-panel,
body[data-theme="dark"] .send-preview,
body[data-theme="dark"] .tool-item,
body[data-theme="dark"] .history-item,
body[data-theme="dark"] .history-conversation,
body[data-theme="dark"] .session-context,
body[data-theme="dark"] .conversation-thread,
body[data-theme="dark"] .history-list,
body[data-theme="dark"] .response-output,
body[data-theme="dark"] .system-preview,
body[data-theme="dark"] .mode-switcher-hint,
body[data-theme="dark"] .supplement-card,
body[data-theme="dark"] .records-filter-block {
  background: var(--discern-panel) !important;
  border-color: var(--discern-line) !important;
  box-shadow: var(--discern-inner), var(--discern-shadow) !important;
}

body .title-banner::before,
body .title-banner::after,
body[data-theme="dark"] .title-banner::before,
body[data-theme="dark"] .title-banner::after {
  display: none !important;
  background: none !important;
}

/* EOF final history hierarchy lock: outer panel -> record item -> detail surface only. */
body #section-history .history-list,
body #section-history .history-list.empty,
body #section-history .history-summary,
body #section-history .history-body,
body #section-history .history-block,
body[data-theme="dark"] #section-history .history-list,
body[data-theme="dark"] #section-history .history-list.empty,
body[data-theme="dark"] #section-history .history-summary,
body[data-theme="dark"] #section-history .history-body,
body[data-theme="dark"] #section-history .history-block {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

body #section-history .history-list,
body[data-theme="dark"] #section-history .history-list {
  padding: 0 !important;
}

body #section-history .history-list.empty,
body[data-theme="dark"] #section-history .history-list.empty {
  padding: 10px 2px !important;
  min-height: 0 !important;
}

body #section-history .history-summary,
body[data-theme="dark"] #section-history .history-summary {
  padding: 0 !important;
}

body #section-history .history-block,
body[data-theme="dark"] #section-history .history-block {
  padding: 0 !important;
  margin-top: 14px !important;
}

body #section-history .history-item {
  background: var(--surface-panel-bg-light) !important;
  border: 1px solid var(--surface-panel-border-light) !important;
  border-radius: 18px !important;
  box-shadow: var(--discern-inner), 0 12px 28px rgba(44, 56, 64, 0.08) !important;
}

body[data-theme="dark"] #section-history .history-item {
  background: var(--surface-panel-bg-dark) !important;
  border: 1px solid var(--surface-panel-border-dark) !important;
  border-radius: 18px !important;
  box-shadow: var(--discern-inner), 0 16px 34px rgba(0, 0, 0, 0.16) !important;
}

body #section-history .history-block-surface,
body #section-history .history-conversation-item {
  background: var(--textbox-surface-light-eof) !important;
  border: 1px solid var(--textbox-border-light-eof) !important;
  border-radius: 16px !important;
  box-shadow: var(--textbox-shadow-light-eof) !important;
}

body[data-theme="dark"] #section-history .history-block-surface,
body[data-theme="dark"] #section-history .history-conversation-item {
  background: var(--textbox-surface-dark-eof) !important;
  border: 1px solid var(--textbox-border-dark-eof) !important;
  border-radius: 16px !important;
  box-shadow: var(--textbox-shadow-dark-eof) !important;
}

/* EOF history light-mode shadow cleanup: remove the visible extra shadow frame. */
body #section-history .history-item,
body #section-history .history-item.pinned,
body #section-history .history-item[open],
body #section-history .history-item:not([open]) {
  background: rgba(255, 255, 255, 0.38) !important;
  border: 1px solid rgba(108, 125, 113, 0.16) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.52) !important;
}

body #section-history .history-item:hover,
body #section-history .history-item:not([open]):hover {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.58) !important;
}

body #section-history .history-block-surface,
body #section-history .history-conversation-item {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.46) !important;
}

body[data-theme="dark"] #section-history .history-item,
body[data-theme="dark"] #section-history .history-item.pinned,
body[data-theme="dark"] #section-history .history-item[open],
body[data-theme="dark"] #section-history .history-item:not([open]) {
  background: var(--surface-panel-bg-dark) !important;
  border: 1px solid var(--surface-panel-border-dark) !important;
  box-shadow: var(--discern-inner), 0 16px 34px rgba(0, 0, 0, 0.16) !important;
}

/* EOF final-final history cleanup: summary text is not a nested textbox. */
body #section-history .history-summary,
body #section-history .history-summary *,
body[data-theme="dark"] #section-history .history-summary,
body[data-theme="dark"] #section-history .history-summary * {
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

body #section-history .history-summary,
body #section-history .history-summary .history-question,
body #section-history .history-summary .history-question-title,
body #section-history .history-summary .history-answer-preview,
body[data-theme="dark"] #section-history .history-summary,
body[data-theme="dark"] #section-history .history-summary .history-question,
body[data-theme="dark"] #section-history .history-summary .history-question-title,
body[data-theme="dark"] #section-history .history-summary .history-answer-preview {
  background: transparent !important;
  border: 0 !important;
}

body #section-history .history-summary .history-question,
body #section-history .history-summary .history-question-title,
body[data-theme="dark"] #section-history .history-summary .history-question,
body[data-theme="dark"] #section-history .history-summary .history-question-title {
  padding: 0 !important;
  min-height: 0 !important;
  border-radius: 0 !important;
}

body #section-history .history-summary .history-answer-preview,
body[data-theme="dark"] #section-history .history-summary .history-answer-preview {
  padding: 0 !important;
  border-radius: 0 !important;
}

body #section-history .history-summary .history-meta,
body[data-theme="dark"] #section-history .history-summary .history-meta {
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
}

body #section-history .history-summary .history-meta .history-mode,
body #section-history .history-summary .history-meta .history-state,
body[data-theme="dark"] #section-history .history-summary .history-meta .history-mode,
body[data-theme="dark"] #section-history .history-summary .history-meta .history-state {
  box-shadow: none !important;
}

/* EOF final-final history cleanup: summary text is not a nested textbox. */
body #section-history .history-summary,
body #section-history .history-summary *,
body[data-theme="dark"] #section-history .history-summary,
body[data-theme="dark"] #section-history .history-summary * {
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

body #section-history .history-summary,
body #section-history .history-summary .history-question,
body #section-history .history-summary .history-question-title,
body #section-history .history-summary .history-answer-preview,
body[data-theme="dark"] #section-history .history-summary,
body[data-theme="dark"] #section-history .history-summary .history-question,
body[data-theme="dark"] #section-history .history-summary .history-question-title,
body[data-theme="dark"] #section-history .history-summary .history-answer-preview {
  background: transparent !important;
  border: 0 !important;
}

body #section-history .history-summary .history-question,
body #section-history .history-summary .history-question-title,
body[data-theme="dark"] #section-history .history-summary .history-question,
body[data-theme="dark"] #section-history .history-summary .history-question-title {
  padding: 0 !important;
  min-height: 0 !important;
  border-radius: 0 !important;
}

body #section-history .history-summary .history-answer-preview,
body[data-theme="dark"] #section-history .history-summary .history-answer-preview {
  padding: 0 !important;
  border-radius: 0 !important;
}

body #section-history .history-summary .history-meta,
body[data-theme="dark"] #section-history .history-summary .history-meta {
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
}

body #section-history .history-summary .history-meta .history-mode,
body #section-history .history-summary .history-meta .history-state,
body[data-theme="dark"] #section-history .history-summary .history-meta .history-mode,
body[data-theme="dark"] #section-history .history-summary .history-meta .history-state {
  box-shadow: none !important;
}

/* EOF history hierarchy lock: no repeated middle frames in light or dark mode. */
body #section-history .history-list,
body #section-history .history-list.empty,
body #section-history .history-summary,
body #section-history .history-body,
body #section-history .history-block,
body[data-theme="dark"] #section-history .history-list,
body[data-theme="dark"] #section-history .history-list.empty,
body[data-theme="dark"] #section-history .history-summary,
body[data-theme="dark"] #section-history .history-body,
body[data-theme="dark"] #section-history .history-block {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

body #section-history .history-list,
body[data-theme="dark"] #section-history .history-list {
  padding: 0 !important;
}

body #section-history .history-list.empty,
body[data-theme="dark"] #section-history .history-list.empty {
  padding: 10px 2px !important;
  min-height: 0 !important;
}

body #section-history .history-summary,
body[data-theme="dark"] #section-history .history-summary {
  padding: 0 !important;
}

body #section-history .history-block,
body[data-theme="dark"] #section-history .history-block {
  padding: 0 !important;
  margin-top: 14px !important;
}

body #section-history .history-item,
body[data-theme="dark"] #section-history .history-item {
  background: var(--surface-panel-bg-light) !important;
  border: 1px solid var(--surface-panel-border-light) !important;
  border-radius: 18px !important;
  box-shadow: var(--discern-inner), 0 12px 28px rgba(44, 56, 64, 0.08) !important;
}

body[data-theme="dark"] #section-history .history-item {
  background: var(--surface-panel-bg-dark) !important;
  border-color: var(--surface-panel-border-dark) !important;
  box-shadow: var(--discern-inner), 0 16px 34px rgba(0, 0, 0, 0.16) !important;
}

body #section-history .history-block-surface,
body #section-history .history-conversation-item,
body[data-theme="dark"] #section-history .history-block-surface,
body[data-theme="dark"] #section-history .history-conversation-item {
  background: var(--textbox-surface-light-eof) !important;
  border: 1px solid var(--textbox-border-light-eof) !important;
  border-radius: 16px !important;
  box-shadow: var(--textbox-shadow-light-eof) !important;
}

body[data-theme="dark"] #section-history .history-block-surface,
body[data-theme="dark"] #section-history .history-conversation-item {
  background: var(--textbox-surface-dark-eof) !important;
  border-color: var(--textbox-border-dark-eof) !important;
  box-shadow: var(--textbox-shadow-dark-eof) !important;
}

body input,
body textarea,
body .records-search-field input,
body .send-preview textarea,
body .supplement-card textarea,
body #section-question label.field textarea,
body #section-question #supplement-panel textarea,
body #section-settings label.field input,
body #section-settings label.field textarea,
body .system-preview,
body .response-output,
body .history-question,
body .history-answer,
body .history-note,
body .history-conversation-content {
  background: var(--discern-field) !important;
  border: 1px solid var(--discern-line) !important;
  color: var(--discern-text) !important;
  -webkit-text-fill-color: var(--discern-text) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.42) !important;
  backdrop-filter: blur(18px) saturate(125%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(125%) !important;
}

body[data-theme="dark"] input,
body[data-theme="dark"] textarea,
body[data-theme="dark"] .records-search-field input,
body[data-theme="dark"] .send-preview textarea,
body[data-theme="dark"] .supplement-card textarea,
body[data-theme="dark"] #section-question label.field textarea,
body[data-theme="dark"] #section-question #supplement-panel textarea,
body[data-theme="dark"] #section-settings label.field input,
body[data-theme="dark"] #section-settings label.field textarea,
body[data-theme="dark"] .system-preview,
body[data-theme="dark"] .response-output,
body[data-theme="dark"] .history-question,
body[data-theme="dark"] .history-answer,
body[data-theme="dark"] .history-note,
body[data-theme="dark"] .history-conversation-content {
  background: var(--discern-field) !important;
  border-color: var(--discern-line) !important;
  color: var(--discern-text) !important;
  -webkit-text-fill-color: var(--discern-text) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07) !important;
}

body input:focus,
body textarea:focus,
body .records-search-field input:focus,
body .send-preview textarea:focus,
body .supplement-card textarea:focus,
body #section-question label.field textarea:focus,
body #section-settings label.field input:focus,
body #section-settings label.field textarea:focus {
  background: var(--discern-field-strong) !important;
  border-color: var(--discern-line-strong) !important;
  outline: none !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.52),
    0 0 0 3px rgba(96, 128, 106, 0.12) !important;
}

body[data-theme="dark"] input:focus,
body[data-theme="dark"] textarea:focus,
body[data-theme="dark"] .records-search-field input:focus,
body[data-theme="dark"] .send-preview textarea:focus,
body[data-theme="dark"] .supplement-card textarea:focus,
body[data-theme="dark"] #section-question label.field textarea:focus,
body[data-theme="dark"] #section-settings label.field input:focus,
body[data-theme="dark"] #section-settings label.field textarea:focus {
  background: var(--discern-field-strong) !important;
  border-color: var(--discern-line-strong) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.09),
    0 0 0 3px rgba(116, 148, 126, 0.13) !important;
}

body input::placeholder,
body textarea::placeholder {
  color: var(--discern-muted) !important;
  -webkit-text-fill-color: var(--discern-muted) !important;
  opacity: 0.72 !important;
}

body .template-tab,
body .page-nav-button:not(.active):not(:disabled),
body .delivery-mode-button:not(.active):not(:disabled),
body .records-filter-button:not(.active):not(:disabled),
body .records-mode-button:not(.active):not(:disabled),
body .ghost-button:not(.delivery-mode-button):not(.records-mode-button):not(.records-filter-button):not(.template-tab):not(.page-nav-button):not(:disabled),
body .mini-button:not(.mini-button-primary):not(:disabled) {
  background: rgba(255, 255, 255, 0.34) !important;
  border: 1px solid var(--discern-line) !important;
  color: var(--discern-muted) !important;
  -webkit-text-fill-color: var(--discern-muted) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.48) !important;
  backdrop-filter: blur(16px) saturate(125%) !important;
  -webkit-backdrop-filter: blur(16px) saturate(125%) !important;
}

body[data-theme="dark"] .template-tab,
body[data-theme="dark"] .page-nav-button:not(.active):not(:disabled),
body[data-theme="dark"] .delivery-mode-button:not(.active):not(:disabled),
body[data-theme="dark"] .records-filter-button:not(.active):not(:disabled),
body[data-theme="dark"] .records-mode-button:not(.active):not(:disabled),
body[data-theme="dark"] .ghost-button:not(.delivery-mode-button):not(.records-mode-button):not(.records-filter-button):not(.template-tab):not(.page-nav-button):not(:disabled),
body[data-theme="dark"] .mini-button:not(.mini-button-primary):not(:disabled) {
  background: rgba(232, 239, 242, 0.07) !important;
  border-color: var(--discern-line) !important;
  color: var(--discern-muted) !important;
  -webkit-text-fill-color: var(--discern-muted) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.055) !important;
}

body .template-tab:hover,
body .page-nav-button:not(.active):not(:disabled):hover,
body .delivery-mode-button:not(.active):not(:disabled):hover,
body .records-filter-button:not(.active):not(:disabled):hover,
body .records-mode-button:not(.active):not(:disabled):hover,
body .ghost-button:not(.delivery-mode-button):not(.records-mode-button):not(.records-filter-button):not(.template-tab):not(.page-nav-button):not(:disabled):hover,
body .mini-button:not(.mini-button-primary):not(:disabled):hover {
  background: rgba(255, 255, 255, 0.5) !important;
  border-color: var(--discern-line-strong) !important;
  color: var(--discern-text) !important;
  -webkit-text-fill-color: var(--discern-text) !important;
}

body .template-tab.active,
body .page-nav-button.active:not(:disabled),
body .delivery-mode-button.active:not(:disabled),
body .records-filter-button.active:not(:disabled),
body .records-mode-button.active:not(:disabled),
body .primary-button:not(:disabled),
body .primary-button.accent:not(:disabled),
body .mini-button-primary:not(:disabled) {
  background: var(--discern-selected) !important;
  border-color: rgba(255, 255, 255, 0.34) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.22),
    0 12px 26px rgba(50, 75, 58, 0.18) !important;
}

body .template-tab.active:hover,
body .page-nav-button.active:not(:disabled):hover,
body .delivery-mode-button.active:not(:disabled):hover,
body .records-filter-button.active:not(:disabled):hover,
body .records-mode-button.active:not(:disabled):hover,
body .primary-button:not(:disabled):hover,
body .mini-button-primary:not(:disabled):hover {
  background: var(--discern-selected-hover) !important;
}

body .history-mode,
body .history-state,
body .history-state-session,
body .history-state-single,
body .history-state-pinned,
body .status-pill,
body .status-pill-save {
  background: var(--discern-soft) !important;
  border: 1px solid var(--discern-line) !important;
  color: var(--discern-muted) !important;
  -webkit-text-fill-color: var(--discern-muted) !important;
}

/* History summary titles should read as text, not as another text box. */
body #section-history .history-summary .history-question-title,
body #section-history .history-summary .history-question.history-question-title,
body[data-theme="dark"] #section-history .history-summary .history-question-title,
body[data-theme="dark"] #section-history .history-summary .history-question.history-question-title {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  padding: 0 !important;
  min-height: 0 !important;
  color: var(--discern-text) !important;
  -webkit-text-fill-color: var(--discern-text) !important;
}

body #section-history .history-summary {
  row-gap: 8px !important;
}

/* History surfaces: remove the redundant middle frame inside the large cards. */
body #section-history .history-list,
body #section-conversation .conversation-thread,
body[data-theme="dark"] #section-history .history-list,
body[data-theme="dark"] #section-conversation .conversation-thread {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  padding: 0 !important;
}

body #section-history .history-list.empty,
body #section-conversation .conversation-thread.empty,
body[data-theme="dark"] #section-history .history-list.empty,
body[data-theme="dark"] #section-conversation .conversation-thread.empty {
  min-height: 0 !important;
  padding: 10px 2px !important;
  color: var(--discern-muted) !important;
  -webkit-text-fill-color: var(--discern-muted) !important;
}

body #section-history .history-item,
body[data-theme="dark"] #section-history .history-item {
  border-radius: 18px !important;
}

/* Final frame cleanup: only real panels and real content fields keep frames. */
body #section-settings .settings-body,
body #section-settings #settings-body,
body #section-settings #api-config-group,
body #section-settings label.field,
body #section-tools .tools-stack,
body #section-tools .tool-item,
body #section-records-filters .records-filters-stack,
body #section-records-filters .records-filter-block,
body #section-records-filters label.records-search-field,
body #section-history .history-summary,
body #section-history .history-body,
body #section-history .history-block,
body #section-conversation #conversation-body,
body[data-theme="dark"] #section-settings .settings-body,
body[data-theme="dark"] #section-settings #settings-body,
body[data-theme="dark"] #section-settings #api-config-group,
body[data-theme="dark"] #section-settings label.field,
body[data-theme="dark"] #section-tools .tools-stack,
body[data-theme="dark"] #section-tools .tool-item,
body[data-theme="dark"] #section-records-filters .records-filters-stack,
body[data-theme="dark"] #section-records-filters .records-filter-block,
body[data-theme="dark"] #section-records-filters label.records-search-field,
body[data-theme="dark"] #section-history .history-summary,
body[data-theme="dark"] #section-history .history-body,
body[data-theme="dark"] #section-history .history-block,
body[data-theme="dark"] #section-conversation #conversation-body {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

body #section-settings .settings-body,
body #section-settings #api-config-group,
body #section-tools .tools-stack,
body #section-records-filters .records-filters-stack,
body #section-history .history-body,
body #section-conversation #conversation-body {
  padding: 0 !important;
}

body #section-settings label.field,
body #section-records-filters label.records-search-field {
  padding: 0 !important;
  gap: 8px !important;
}

body #section-tools .tool-item {
  padding: 8px 0 !important;
  border-bottom: 1px solid var(--discern-line) !important;
  border-radius: 0 !important;
}

body #section-tools .tool-item:last-child {
  border-bottom: 0 !important;
}

body #section-records-filters .records-filter-block {
  padding: 0 !important;
}

body #section-history .history-summary {
  padding: 0 !important;
}

body #section-history .history-item {
  padding: 16px 18px !important;
}

body #section-history .history-block {
  padding: 0 !important;
  margin-top: 14px !important;
}

body #section-history .history-block-surface,
body #section-history .history-conversation-item,
body[data-theme="dark"] #section-history .history-block-surface,
body[data-theme="dark"] #section-history .history-conversation-item {
  background: var(--discern-field) !important;
  border: 1px solid var(--discern-line) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
  border-radius: 14px !important;
}

/* Records search input must match the other text fields after wrapper cleanup. */
body #section-records-filters #records-search,
body[data-theme="dark"] #section-records-filters #records-search {
  background: var(--discern-field) !important;
  border: 1px solid var(--discern-line) !important;
  color: var(--discern-text) !important;
  -webkit-text-fill-color: var(--discern-text) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
  backdrop-filter: blur(18px) saturate(125%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(125%) !important;
}

body #section-records-filters #records-search:focus,
body[data-theme="dark"] #section-records-filters #records-search:focus {
  background: var(--discern-field-strong) !important;
  border-color: var(--discern-line-strong) !important;
}

/* Final records search correction: same material and rounded shape as text inputs. */
body #section-records-filters label.records-search-field #records-search,
body[data-theme="dark"] #section-records-filters label.records-search-field #records-search {
  width: 100% !important;
  min-height: 44px !important;
  padding: 11px 16px !important;
  border-radius: 16px !important;
  background: var(--discern-field) !important;
  border: 1px solid var(--discern-line) !important;
  color: var(--discern-text) !important;
  -webkit-text-fill-color: var(--discern-text) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14) !important;
  appearance: none !important;
  -webkit-appearance: none !important;
}

body #section-records-filters label.records-search-field #records-search:focus,
body[data-theme="dark"] #section-records-filters label.records-search-field #records-search:focus {
  background: var(--discern-field-strong) !important;
  border-color: var(--discern-line-strong) !important;
  outline: none !important;
}

/* True final records search match: wrapper carries the field material, input stays transparent. */
body #section-records-filters label.records-search-field {
  background: var(--field-shell-bg-light) !important;
  border: 1px solid var(--field-shell-border-light) !important;
  border-radius: 16px !important;
  padding: 12px 14px !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.68),
    0 1px 2px rgba(20, 28, 23, 0.018) !important;
  backdrop-filter: blur(18px) saturate(125%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(125%) !important;
}

body[data-theme="dark"] #section-records-filters label.records-search-field {
  background: var(--field-shell-bg-dark) !important;
  border: 1px solid var(--field-shell-border-dark) !important;
  border-radius: 16px !important;
  padding: 12px 14px !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.048),
    0 1px 2px rgba(0, 0, 0, 0.1) !important;
  backdrop-filter: blur(18px) saturate(125%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(125%) !important;
}

body #section-records-filters label.records-search-field #records-search,
body[data-theme="dark"] #section-records-filters label.records-search-field #records-search {
  min-height: auto !important;
  padding: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

body #section-records-filters label.records-search-field:focus-within {
  background: var(--field-shell-focus-light) !important;
  border-color: rgba(126, 154, 135, 0.36) !important;
}

body[data-theme="dark"] #section-records-filters label.records-search-field:focus-within {
  background: var(--field-shell-focus-dark) !important;
  border-color: rgba(151, 176, 158, 0.24) !important;
}
/* EOF final textbox material: same-level text boxes use one visible surface everywhere. */
:root {
  --textbox-surface-light-eof: rgba(255, 255, 255, 0.62);
  --textbox-surface-focus-light-eof: rgba(255, 255, 255, 0.74);
  --textbox-border-light-eof: rgba(108, 125, 113, 0.22);
  --textbox-border-focus-light-eof: rgba(126, 154, 135, 0.36);
  --textbox-shadow-light-eof: inset 0 1px 0 rgba(255, 255, 255, 0.68), 0 1px 2px rgba(20, 28, 23, 0.018);
}

body[data-theme="dark"] {
  --textbox-surface-dark-eof: rgba(231, 237, 232, 0.088);
  --textbox-surface-focus-dark-eof: rgba(231, 237, 232, 0.118);
  --textbox-border-dark-eof: rgba(231, 237, 232, 0.17);
  --textbox-border-focus-dark-eof: rgba(151, 176, 158, 0.24);
  --textbox-shadow-dark-eof: inset 0 1px 0 rgba(255, 255, 255, 0.048), 0 1px 2px rgba(0, 0, 0, 0.1);
}

body #section-question label.field,
body #section-question .field-question-primary,
body #section-question .field-concern-secondary,
body #section-question .send-preview label.field,
body #section-question #supplement-panel .supplement-card,
body #section-settings label.field,
body #section-records-filters label.records-search-field,
body #section-answer .response-output,
body #section-prompt #system-prompt-preview,
body #section-history .history-block-surface,
body #section-history .history-conversation-item,
body #section-conversation .conversation-thread {
  background: var(--textbox-surface-light-eof) !important;
  border: 1px solid var(--textbox-border-light-eof) !important;
  border-radius: 16px !important;
  box-shadow: var(--textbox-shadow-light-eof) !important;
  color: var(--field-text-light, var(--discern-text)) !important;
  -webkit-text-fill-color: var(--field-text-light, var(--discern-text)) !important;
  backdrop-filter: blur(18px) saturate(125%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(125%) !important;
}

body[data-theme="dark"] #section-question label.field,
body[data-theme="dark"] #section-question .field-question-primary,
body[data-theme="dark"] #section-question .field-concern-secondary,
body[data-theme="dark"] #section-question .send-preview label.field,
body[data-theme="dark"] #section-question #supplement-panel .supplement-card,
body[data-theme="dark"] #section-settings label.field,
body[data-theme="dark"] #section-records-filters label.records-search-field,
body[data-theme="dark"] #section-answer .response-output,
body[data-theme="dark"] #section-prompt #system-prompt-preview,
body[data-theme="dark"] #section-history .history-block-surface,
body[data-theme="dark"] #section-history .history-conversation-item,
body[data-theme="dark"] #section-conversation .conversation-thread {
  background: var(--textbox-surface-dark-eof) !important;
  border: 1px solid var(--textbox-border-dark-eof) !important;
  border-radius: 16px !important;
  box-shadow: var(--textbox-shadow-dark-eof) !important;
  color: var(--field-text-dark, var(--discern-text)) !important;
  -webkit-text-fill-color: var(--field-text-dark, var(--discern-text)) !important;
}

body #section-question label.field:focus-within,
body #section-question .send-preview label.field:focus-within,
body #section-question #supplement-panel .supplement-card:focus-within,
body #section-settings label.field:focus-within,
body #section-records-filters label.records-search-field:focus-within {
  background: var(--textbox-surface-focus-light-eof) !important;
  border-color: var(--textbox-border-focus-light-eof) !important;
}

body[data-theme="dark"] #section-question label.field:focus-within,
body[data-theme="dark"] #section-question .send-preview label.field:focus-within,
body[data-theme="dark"] #section-question #supplement-panel .supplement-card:focus-within,
body[data-theme="dark"] #section-settings label.field:focus-within,
body[data-theme="dark"] #section-records-filters label.records-search-field:focus-within {
  background: var(--textbox-surface-focus-dark-eof) !important;
  border-color: var(--textbox-border-focus-dark-eof) !important;
}

body #section-question label.field input,
body #section-question label.field textarea,
body #section-question #question,
body #section-question #concern,
body #section-question #background,
body #section-question #other-party,
body #section-question #goal,
body #section-question #assembled-prompt,
body #section-question .send-preview textarea,
body #section-question #supplement-panel .supplement-card textarea,
body #section-question #supplement-panel textarea,
body #section-settings label.field input,
body #section-settings label.field textarea,
body #section-settings #base-url,
body #section-settings #api-key,
body #section-settings #model,
body #section-settings #temperature,
body #section-records-filters #records-search,
body #section-prompt #system-prompt-preview {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--field-text-light, var(--discern-text)) !important;
  -webkit-text-fill-color: var(--field-text-light, var(--discern-text)) !important;
}

body[data-theme="dark"] #section-question label.field input,
body[data-theme="dark"] #section-question label.field textarea,
body[data-theme="dark"] #section-question #question,
body[data-theme="dark"] #section-question #concern,
body[data-theme="dark"] #section-question #background,
body[data-theme="dark"] #section-question #other-party,
body[data-theme="dark"] #section-question #goal,
body[data-theme="dark"] #section-question #assembled-prompt,
body[data-theme="dark"] #section-question .send-preview textarea,
body[data-theme="dark"] #section-question #supplement-panel .supplement-card textarea,
body[data-theme="dark"] #section-question #supplement-panel textarea,
body[data-theme="dark"] #section-settings label.field input,
body[data-theme="dark"] #section-settings label.field textarea,
body[data-theme="dark"] #section-settings #base-url,
body[data-theme="dark"] #section-settings #api-key,
body[data-theme="dark"] #section-settings #model,
body[data-theme="dark"] #section-settings #temperature,
body[data-theme="dark"] #section-records-filters #records-search,
body[data-theme="dark"] #section-prompt #system-prompt-preview {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--field-text-dark, var(--discern-text)) !important;
  -webkit-text-fill-color: var(--field-text-dark, var(--discern-text)) !important;
}

/* EOF settings cleanup: mode selector is controls only, not an extra text box. */
body #section-settings label.delivery-mode-field,
body[data-theme="dark"] #section-settings label.delivery-mode-field {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  padding: 0 !important;
  border-radius: 0 !important;
}

body #section-settings .delivery-mode-field:focus-within,
body[data-theme="dark"] #section-settings .delivery-mode-field:focus-within,
body #section-settings .delivery-mode-switch,
body[data-theme="dark"] #section-settings .delivery-mode-switch {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}

/* EOF final correction: tool rows keep boxes, mode selector keeps only buttons. */
body #section-settings label.field.delivery-mode-field,
body #section-settings .settings-body > label.field.delivery-mode-field,
body[data-theme="dark"] #section-settings label.field.delivery-mode-field,
body[data-theme="dark"] #section-settings .settings-body > label.field.delivery-mode-field {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  padding: 0 !important;
  border-radius: 0 !important;
}

body #section-settings label.field.delivery-mode-field:focus-within,
body #section-settings label.field.delivery-mode-field .delivery-mode-switch,
body[data-theme="dark"] #section-settings label.field.delivery-mode-field:focus-within,
body[data-theme="dark"] #section-settings label.field.delivery-mode-field .delivery-mode-switch {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

body #section-tools .tools-stack > .tool-item {
  background: var(--textbox-surface-light-eof) !important;
  border: 1px solid var(--textbox-border-light-eof) !important;
  border-radius: 16px !important;
  padding: 12px 14px !important;
  box-shadow: var(--textbox-shadow-light-eof) !important;
  backdrop-filter: blur(18px) saturate(125%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(125%) !important;
}

body[data-theme="dark"] #section-tools .tools-stack > .tool-item {
  background: var(--textbox-surface-dark-eof) !important;
  border: 1px solid var(--textbox-border-dark-eof) !important;
  border-radius: 16px !important;
  padding: 12px 14px !important;
  box-shadow: var(--textbox-shadow-dark-eof) !important;
  backdrop-filter: blur(18px) saturate(125%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(125%) !important;
}

body #section-tools .tools-stack > .tool-item + .tool-item {
  margin-top: 10px !important;
}

/* EOF settings input layout: labels outside, input boxes as their own surfaces. */
body #section-settings label.field:not(.delivery-mode-field),
body[data-theme="dark"] #section-settings label.field:not(.delivery-mode-field),
body #section-settings label.field:not(.delivery-mode-field):focus-within,
body[data-theme="dark"] #section-settings label.field:not(.delivery-mode-field):focus-within {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  padding: 0 !important;
  border-radius: 0 !important;
  gap: 8px !important;
}

body #section-settings label.field:not(.delivery-mode-field) > span {
  color: var(--field-label-light, var(--discern-text)) !important;
  -webkit-text-fill-color: var(--field-label-light, var(--discern-text)) !important;
}

body[data-theme="dark"] #section-settings label.field:not(.delivery-mode-field) > span {
  color: var(--field-label-dark, var(--discern-text)) !important;
  -webkit-text-fill-color: var(--field-label-dark, var(--discern-text)) !important;
}

body #section-settings label.field:not(.delivery-mode-field) input,
body #section-settings label.field:not(.delivery-mode-field) textarea,
body #section-settings #base-url,
body #section-settings #api-key,
body #section-settings #model,
body #section-settings #temperature {
  background: var(--textbox-surface-light-eof) !important;
  border: 1px solid var(--textbox-border-light-eof) !important;
  border-radius: 16px !important;
  padding: 11px 16px !important;
  min-height: 44px !important;
  box-shadow: var(--textbox-shadow-light-eof) !important;
  color: var(--field-text-light, var(--discern-text)) !important;
  -webkit-text-fill-color: var(--field-text-light, var(--discern-text)) !important;
  backdrop-filter: blur(18px) saturate(125%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(125%) !important;
}

body[data-theme="dark"] #section-settings label.field:not(.delivery-mode-field) input,
body[data-theme="dark"] #section-settings label.field:not(.delivery-mode-field) textarea,
body[data-theme="dark"] #section-settings #base-url,
body[data-theme="dark"] #section-settings #api-key,
body[data-theme="dark"] #section-settings #model,
body[data-theme="dark"] #section-settings #temperature {
  background: var(--textbox-surface-dark-eof) !important;
  border: 1px solid var(--textbox-border-dark-eof) !important;
  border-radius: 16px !important;
  padding: 11px 16px !important;
  min-height: 44px !important;
  box-shadow: var(--textbox-shadow-dark-eof) !important;
  color: var(--field-text-dark, var(--discern-text)) !important;
  -webkit-text-fill-color: var(--field-text-dark, var(--discern-text)) !important;
}

body #section-settings label.field:not(.delivery-mode-field) input:focus,
body #section-settings label.field:not(.delivery-mode-field) textarea:focus {
  background: var(--textbox-surface-focus-light-eof) !important;
  border-color: var(--textbox-border-focus-light-eof) !important;
  outline: none !important;
}

body[data-theme="dark"] #section-settings label.field:not(.delivery-mode-field) input:focus,
body[data-theme="dark"] #section-settings label.field:not(.delivery-mode-field) textarea:focus {
  background: var(--textbox-surface-focus-dark-eof) !important;
  border-color: var(--textbox-border-focus-dark-eof) !important;
  outline: none !important;
}

/* EOF parity: Answer principles and Advanced prompt use the same panel material. */
body #section-structure,
body #section-prompt {
  background: var(--discern-panel) !important;
  border: 1px solid var(--discern-line) !important;
  border-radius: 24px !important;
  box-shadow: var(--discern-inner), var(--discern-shadow) !important;
  backdrop-filter: blur(26px) saturate(135%) !important;
  -webkit-backdrop-filter: blur(26px) saturate(135%) !important;
}

body[data-theme="dark"] #section-structure,
body[data-theme="dark"] #section-prompt {
  background: var(--discern-panel) !important;
  border: 1px solid var(--discern-line) !important;
  border-radius: 24px !important;
  box-shadow: var(--discern-inner), var(--discern-shadow) !important;
}

body #section-structure .panel-head,
body #section-prompt .panel-head,
body[data-theme="dark"] #section-structure .panel-head,
body[data-theme="dark"] #section-prompt .panel-head {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

body #section-structure h2,
body #section-prompt h2,
body #section-structure .panel-head h2,
body #section-prompt .panel-head h2 {
  color: var(--ui-title-light, var(--discern-text)) !important;
  -webkit-text-fill-color: var(--ui-title-light, var(--discern-text)) !important;
}

body[data-theme="dark"] #section-structure h2,
body[data-theme="dark"] #section-prompt h2,
body[data-theme="dark"] #section-structure .panel-head h2,
body[data-theme="dark"] #section-prompt .panel-head h2 {
  color: var(--ui-title-dark, var(--discern-text)) !important;
  -webkit-text-fill-color: var(--ui-title-dark, var(--discern-text)) !important;
}

/* EOF correction: Answer principles follows the original Advanced prompt panel material. */
body #section-prompt,
body #section-structure {
  background: var(--surface-panel-bg-light) !important;
  border: 1px solid var(--surface-panel-border-light) !important;
  border-radius: 24px !important;
  box-shadow: var(--discern-inner), var(--discern-shadow) !important;
  backdrop-filter: blur(26px) saturate(135%) !important;
  -webkit-backdrop-filter: blur(26px) saturate(135%) !important;
}

body[data-theme="dark"] #section-prompt,
body[data-theme="dark"] #section-structure {
  background: var(--surface-panel-bg-dark) !important;
  border: 1px solid var(--surface-panel-border-dark) !important;
  border-radius: 24px !important;
  box-shadow: var(--discern-inner), var(--discern-shadow) !important;
}

/* EOF title panel: match the lower page panels exactly. */
body .title-banner {
  background: var(--surface-panel-bg-light) !important;
  border: 1px solid var(--surface-panel-border-light) !important;
  border-radius: 24px !important;
  box-shadow: var(--discern-inner), var(--discern-shadow) !important;
  backdrop-filter: blur(26px) saturate(135%) !important;
  -webkit-backdrop-filter: blur(26px) saturate(135%) !important;
}

body[data-theme="dark"] .title-banner {
  background: var(--surface-panel-bg-dark) !important;
  border: 1px solid var(--surface-panel-border-dark) !important;
  border-radius: 24px !important;
  box-shadow: var(--discern-inner), var(--discern-shadow) !important;
}

body .title-banner::before,
body .title-banner::after,
body[data-theme="dark"] .title-banner::before,
body[data-theme="dark"] .title-banner::after {
  display: none !important;
  background: none !important;
}

/* EOF final history hierarchy lock: outer panel -> record item -> detail surface only. */
body #section-history .history-list,
body #section-history .history-list.empty,
body #section-history .history-summary,
body #section-history .history-body,
body #section-history .history-block,
body #section-history .history-summary .history-question,
body #section-history .history-summary .history-question-title,
body #section-history .history-summary .history-answer-preview,
body #section-history .history-summary .history-meta,
body[data-theme="dark"] #section-history .history-list,
body[data-theme="dark"] #section-history .history-list.empty,
body[data-theme="dark"] #section-history .history-summary,
body[data-theme="dark"] #section-history .history-body,
body[data-theme="dark"] #section-history .history-block,
body[data-theme="dark"] #section-history .history-summary .history-question,
body[data-theme="dark"] #section-history .history-summary .history-question-title,
body[data-theme="dark"] #section-history .history-summary .history-answer-preview,
body[data-theme="dark"] #section-history .history-summary .history-meta {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

body #section-history .history-list,
body[data-theme="dark"] #section-history .history-list {
  padding: 0 !important;
}

body #section-history .history-list.empty,
body[data-theme="dark"] #section-history .history-list.empty {
  padding: 10px 2px !important;
  min-height: 0 !important;
}

body #section-history .history-summary,
body[data-theme="dark"] #section-history .history-summary {
  padding: 0 !important;
}

body #section-history .history-summary .history-question,
body #section-history .history-summary .history-question-title,
body #section-history .history-summary .history-answer-preview,
body #section-history .history-summary .history-meta,
body[data-theme="dark"] #section-history .history-summary .history-question,
body[data-theme="dark"] #section-history .history-summary .history-question-title,
body[data-theme="dark"] #section-history .history-summary .history-answer-preview,
body[data-theme="dark"] #section-history .history-summary .history-meta {
  padding: 0 !important;
  min-height: 0 !important;
  border-radius: 0 !important;
}

body #section-history .history-block,
body[data-theme="dark"] #section-history .history-block {
  padding: 0 !important;
  margin-top: 14px !important;
}

body #section-history .history-item {
  background: var(--surface-panel-bg-light) !important;
  border: 1px solid var(--surface-panel-border-light) !important;
  border-radius: 18px !important;
  box-shadow: var(--discern-inner), 0 12px 28px rgba(44, 56, 64, 0.08) !important;
}

body[data-theme="dark"] #section-history .history-item {
  background: var(--surface-panel-bg-dark) !important;
  border: 1px solid var(--surface-panel-border-dark) !important;
  border-radius: 18px !important;
  box-shadow: var(--discern-inner), 0 16px 34px rgba(0, 0, 0, 0.16) !important;
}

body #section-history .history-block-surface,
body #section-history .history-conversation-item {
  background: var(--textbox-surface-light-eof) !important;
  border: 1px solid var(--textbox-border-light-eof) !important;
  border-radius: 16px !important;
  box-shadow: var(--textbox-shadow-light-eof) !important;
}

body[data-theme="dark"] #section-history .history-block-surface,
body[data-theme="dark"] #section-history .history-conversation-item {
  background: var(--textbox-surface-dark-eof) !important;
  border: 1px solid var(--textbox-border-dark-eof) !important;
  border-radius: 16px !important;
  box-shadow: var(--textbox-shadow-dark-eof) !important;
}
/* EOF append verification: history light-mode no extra shadow frame. */
body #section-history .history-item,
body #section-history .history-item.pinned,
body #section-history .history-item[open],
body #section-history .history-item:not([open]) {
  background: rgba(255, 255, 255, 0.38) !important;
  border: 1px solid rgba(108, 125, 113, 0.16) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.52) !important;
}

body #section-history .history-item:hover,
body #section-history .history-item:not([open]):hover {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.58) !important;
}

body #section-history .history-block-surface,
body #section-history .history-conversation-item {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.46) !important;
}

body[data-theme="dark"] #section-history .history-item,
body[data-theme="dark"] #section-history .history-item.pinned,
body[data-theme="dark"] #section-history .history-item[open],
body[data-theme="dark"] #section-history .history-item:not([open]) {
  background: var(--surface-panel-bg-dark) !important;
  border: 1px solid var(--surface-panel-border-dark) !important;
  box-shadow: var(--discern-inner), 0 16px 34px rgba(0, 0, 0, 0.16) !important;
}

/* TRUE EOF clarity finalization: same visual system, higher readability. */
:root {
  --bg: #eef1ed;
  --bg-deep: #dfe4dd;
  --text: #17211c;
  --muted: #526158;
  --discern-text: #17211c;
  --discern-muted: #56645c;
  --ui-title-light: #141d18;
  --field-label-light: #26342d;
  --field-text-light: #17211c;
  --surface-panel-bg-light: rgba(255, 255, 255, 0.58);
  --surface-panel-border-light: rgba(86, 105, 94, 0.24);
  --textbox-surface-light-eof: rgba(255, 255, 255, 0.72);
  --textbox-surface-focus-light-eof: rgba(255, 255, 255, 0.84);
  --textbox-border-light-eof: rgba(86, 105, 94, 0.28);
  --textbox-border-focus-light-eof: rgba(84, 119, 96, 0.44);
  --textbox-shadow-light-eof:
    inset 0 1px 0 rgba(255, 255, 255, 0.78),
    0 1px 2px rgba(24, 35, 29, 0.035);
  --discern-inner: inset 0 1px 0 rgba(255, 255, 255, 0.6);
  --discern-shadow: 0 18px 42px rgba(45, 58, 50, 0.09);
}

body[data-theme="dark"] {
  --bg: #101410;
  --bg-deep: #171d18;
  --text: #f1f6f0;
  --muted: #c0cabf;
  --discern-text: #f1f6f0;
  --discern-muted: #b9c3b7;
  --ui-title-dark: #f4f8f2;
  --field-label-dark: #d9e2d7;
  --field-text-dark: #f2f7f1;
  --surface-panel-bg-dark: rgba(236, 244, 236, 0.108);
  --surface-panel-border-dark: rgba(226, 238, 226, 0.19);
  --textbox-surface-dark-eof: rgba(236, 244, 236, 0.14);
  --textbox-surface-focus-dark-eof: rgba(236, 244, 236, 0.18);
  --textbox-border-dark-eof: rgba(226, 238, 226, 0.24);
  --textbox-border-focus-dark-eof: rgba(177, 204, 184, 0.36);
  --textbox-shadow-dark-eof:
    inset 0 1px 0 rgba(255, 255, 255, 0.07),
    0 1px 2px rgba(0, 0, 0, 0.16);
  --discern-inner: inset 0 1px 0 rgba(255, 255, 255, 0.07);
  --discern-shadow: 0 18px 46px rgba(0, 0, 0, 0.24);
}

html,
body {
  background:
    radial-gradient(circle at top left, rgba(92, 113, 101, 0.18), transparent 26rem),
    radial-gradient(circle at bottom right, rgba(202, 211, 201, 0.28), transparent 24rem),
    linear-gradient(180deg, #f3f5f2 0%, #e9eee8 48%, #dfe5de 100%) !important;
}

body[data-theme="dark"] {
  background:
    radial-gradient(circle at top left, rgba(96, 119, 104, 0.2), transparent 25rem),
    radial-gradient(circle at bottom right, rgba(58, 72, 62, 0.18), transparent 23rem),
    linear-gradient(180deg, #101410 0%, #141a15 48%, #1a211b 100%) !important;
}

body,
body .section-note,
body .micro-copy,
body .history-answer-preview,
body .history-meta,
body .tool-action-label,
body #section-question #supplement-panel .supplement-panel-copy {
  color: var(--discern-muted) !important;
  -webkit-text-fill-color: var(--discern-muted) !important;
}

body h1,
body h2,
body h3,
body .panel-head h2,
body .mode-switcher-title,
body .tool-title,
body .history-question-title,
body label.field > span,
body .records-search-field > span,
body #section-question #supplement-panel .supplement-card > span {
  color: var(--discern-text) !important;
  -webkit-text-fill-color: var(--discern-text) !important;
}

body input,
body textarea,
body .response-output,
body #system-prompt-preview,
body .history-question,
body .history-answer,
body .history-conversation-content {
  color: var(--discern-text) !important;
  -webkit-text-fill-color: var(--discern-text) !important;
}

body input::placeholder,
body textarea::placeholder {
  color: rgba(82, 97, 88, 0.72) !important;
  -webkit-text-fill-color: rgba(82, 97, 88, 0.72) !important;
}

body[data-theme="dark"] input::placeholder,
body[data-theme="dark"] textarea::placeholder {
  color: rgba(192, 202, 191, 0.62) !important;
  -webkit-text-fill-color: rgba(192, 202, 191, 0.62) !important;
}

body .title-banner,
body .sidebar .panel,
body .composer,
body .response-card-answer,
body .response-card-history,
body .response-card-conversation,
body .response-card-prompt,
body #section-structure,
body #section-prompt {
  background: var(--surface-panel-bg-light) !important;
  border: 1px solid var(--surface-panel-border-light) !important;
  box-shadow: var(--discern-inner), var(--discern-shadow) !important;
}

body[data-theme="dark"] .title-banner,
body[data-theme="dark"] .sidebar .panel,
body[data-theme="dark"] .composer,
body[data-theme="dark"] .response-card-answer,
body[data-theme="dark"] .response-card-history,
body[data-theme="dark"] .response-card-conversation,
body[data-theme="dark"] .response-card-prompt,
body[data-theme="dark"] #section-structure,
body[data-theme="dark"] #section-prompt {
  background: var(--surface-panel-bg-dark) !important;
  border: 1px solid var(--surface-panel-border-dark) !important;
  box-shadow: var(--discern-inner), var(--discern-shadow) !important;
}

body #section-question label.field,
body #section-question .field-question-primary,
body #section-question .field-concern-secondary,
body #section-question .send-preview label.field,
body #section-question #supplement-panel .supplement-card,
body #section-settings label.field:not(.delivery-mode-field) input,
body #section-settings label.field:not(.delivery-mode-field) textarea,
body #section-records-filters label.records-search-field,
body #section-answer .response-output,
body #section-prompt #system-prompt-preview,
body #section-history .history-block-surface,
body #section-history .history-conversation-item,
body #section-conversation .conversation-thread,
body #section-tools .tools-stack > .tool-item {
  background: var(--textbox-surface-light-eof) !important;
  border: 1px solid var(--textbox-border-light-eof) !important;
  box-shadow: var(--textbox-shadow-light-eof) !important;
}

body[data-theme="dark"] #section-question label.field,
body[data-theme="dark"] #section-question .field-question-primary,
body[data-theme="dark"] #section-question .field-concern-secondary,
body[data-theme="dark"] #section-question .send-preview label.field,
body[data-theme="dark"] #section-question #supplement-panel .supplement-card,
body[data-theme="dark"] #section-settings label.field:not(.delivery-mode-field) input,
body[data-theme="dark"] #section-settings label.field:not(.delivery-mode-field) textarea,
body[data-theme="dark"] #section-records-filters label.records-search-field,
body[data-theme="dark"] #section-answer .response-output,
body[data-theme="dark"] #section-prompt #system-prompt-preview,
body[data-theme="dark"] #section-history .history-block-surface,
body[data-theme="dark"] #section-history .history-conversation-item,
body[data-theme="dark"] #section-conversation .conversation-thread,
body[data-theme="dark"] #section-tools .tools-stack > .tool-item {
  background: var(--textbox-surface-dark-eof) !important;
  border: 1px solid var(--textbox-border-dark-eof) !important;
  box-shadow: var(--textbox-shadow-dark-eof) !important;
}

body #section-history .history-item,
body #section-history .history-item.pinned,
body #section-history .history-item[open],
body #section-history .history-item:not([open]) {
  background: rgba(255, 255, 255, 0.5) !important;
  border: 1px solid rgba(86, 105, 94, 0.22) !important;
  box-shadow: var(--discern-inner), 0 10px 24px rgba(45, 58, 50, 0.065) !important;
}

body[data-theme="dark"] #section-history .history-item,
body[data-theme="dark"] #section-history .history-item.pinned,
body[data-theme="dark"] #section-history .history-item[open],
body[data-theme="dark"] #section-history .history-item:not([open]) {
  background: var(--surface-panel-bg-dark) !important;
  border: 1px solid var(--surface-panel-border-dark) !important;
  box-shadow: var(--discern-inner), var(--discern-shadow) !important;
}

/* TRUE EOF editorial refinement: quieter borders, calmer buttons, lighter history index. */
:root {
  --textbox-border-light-eof: rgba(86, 105, 94, 0.22);
  --textbox-border-focus-light-eof: rgba(84, 119, 96, 0.4);
  --surface-panel-border-light: rgba(86, 105, 94, 0.22);
  --soft-control-bg-light: rgba(255, 255, 255, 0.34);
  --soft-control-border-light: rgba(86, 105, 94, 0.18);
  --soft-control-hover-light: rgba(255, 255, 255, 0.52);
  --soft-pill-bg-light: rgba(237, 241, 236, 0.76);
  --soft-pill-border-light: rgba(86, 105, 94, 0.14);
}

body[data-theme="dark"] {
  --textbox-border-dark-eof: rgba(226, 238, 226, 0.2);
  --textbox-border-focus-dark-eof: rgba(177, 204, 184, 0.32);
  --surface-panel-border-dark: rgba(226, 238, 226, 0.17);
  --soft-control-bg-dark: rgba(236, 244, 236, 0.065);
  --soft-control-border-dark: rgba(226, 238, 226, 0.15);
  --soft-control-hover-dark: rgba(236, 244, 236, 0.105);
  --soft-pill-bg-dark: rgba(236, 244, 236, 0.075);
  --soft-pill-border-dark: rgba(226, 238, 226, 0.12);
}

body .panel-head,
body .sidebar .panel .panel-head,
body .response-card-history .panel-head,
body .response-card-conversation .panel-head,
body .response-card-prompt .panel-head,
body .response-card-answer .panel-head {
  margin-bottom: 18px !important;
}

body .panel-head h2,
body .mode-switcher-title,
body #section-question #supplement-panel .supplement-panel-title,
body .tool-title {
  font-weight: 500 !important;
  letter-spacing: 0.015em !important;
}

body .section-note,
body .micro-copy,
body #section-question #supplement-panel .supplement-panel-copy,
body .tool-action-label {
  font-size: 0.88rem !important;
  line-height: 1.62 !important;
}

body #section-question label.field,
body #section-question .field-question-primary,
body #section-question .field-concern-secondary,
body #section-question .send-preview label.field,
body #section-question #supplement-panel .supplement-card,
body #section-settings label.field:not(.delivery-mode-field) input,
body #section-settings label.field:not(.delivery-mode-field) textarea,
body #section-records-filters label.records-search-field,
body #section-answer .response-output,
body #section-prompt #system-prompt-preview,
body #section-history .history-block-surface,
body #section-history .history-conversation-item,
body #section-conversation .conversation-thread,
body #section-tools .tools-stack > .tool-item {
  border-color: var(--textbox-border-light-eof) !important;
}

body[data-theme="dark"] #section-question label.field,
body[data-theme="dark"] #section-question .field-question-primary,
body[data-theme="dark"] #section-question .field-concern-secondary,
body[data-theme="dark"] #section-question .send-preview label.field,
body[data-theme="dark"] #section-question #supplement-panel .supplement-card,
body[data-theme="dark"] #section-settings label.field:not(.delivery-mode-field) input,
body[data-theme="dark"] #section-settings label.field:not(.delivery-mode-field) textarea,
body[data-theme="dark"] #section-records-filters label.records-search-field,
body[data-theme="dark"] #section-answer .response-output,
body[data-theme="dark"] #section-prompt #system-prompt-preview,
body[data-theme="dark"] #section-history .history-block-surface,
body[data-theme="dark"] #section-history .history-conversation-item,
body[data-theme="dark"] #section-conversation .conversation-thread,
body[data-theme="dark"] #section-tools .tools-stack > .tool-item {
  border-color: var(--textbox-border-dark-eof) !important;
}

body .ghost-button:not(.primary-button):not(:disabled),
body .mini-button:not(.mini-button-primary):not(:disabled),
body .template-tab:not(.active):not(:disabled),
body .page-nav-button:not(.active):not(:disabled),
body .records-mode-button:not(.active):not(:disabled),
body .records-filter-button:not(.active):not(:disabled),
body .delivery-mode-button:not(.active):not(:disabled),
body .session-mini:not(:disabled) {
  background: var(--soft-control-bg-light) !important;
  border-color: var(--soft-control-border-light) !important;
  color: var(--discern-muted) !important;
  -webkit-text-fill-color: var(--discern-muted) !important;
  box-shadow: none !important;
}

body[data-theme="dark"] .ghost-button:not(.primary-button):not(:disabled),
body[data-theme="dark"] .mini-button:not(.mini-button-primary):not(:disabled),
body[data-theme="dark"] .template-tab:not(.active):not(:disabled),
body[data-theme="dark"] .page-nav-button:not(.active):not(:disabled),
body[data-theme="dark"] .records-mode-button:not(.active):not(:disabled),
body[data-theme="dark"] .records-filter-button:not(.active):not(:disabled),
body[data-theme="dark"] .delivery-mode-button:not(.active):not(:disabled),
body[data-theme="dark"] .session-mini:not(:disabled) {
  background: var(--soft-control-bg-dark) !important;
  border-color: var(--soft-control-border-dark) !important;
  color: var(--discern-muted) !important;
  -webkit-text-fill-color: var(--discern-muted) !important;
  box-shadow: none !important;
}

body .ghost-button:not(.primary-button):not(:disabled):hover,
body .mini-button:not(.mini-button-primary):not(:disabled):hover,
body .template-tab:not(.active):not(:disabled):hover,
body .page-nav-button:not(.active):not(:disabled):hover,
body .records-mode-button:not(.active):not(:disabled):hover,
body .records-filter-button:not(.active):not(:disabled):hover,
body .delivery-mode-button:not(.active):not(:disabled):hover,
body .session-mini:not(:disabled):hover {
  background: var(--soft-control-hover-light) !important;
  color: var(--discern-text) !important;
  -webkit-text-fill-color: var(--discern-text) !important;
}

body[data-theme="dark"] .ghost-button:not(.primary-button):not(:disabled):hover,
body[data-theme="dark"] .mini-button:not(.mini-button-primary):not(:disabled):hover,
body[data-theme="dark"] .template-tab:not(.active):not(:disabled):hover,
body[data-theme="dark"] .page-nav-button:not(.active):not(:disabled):hover,
body[data-theme="dark"] .records-mode-button:not(.active):not(:disabled):hover,
body[data-theme="dark"] .records-filter-button:not(.active):not(:disabled):hover,
body[data-theme="dark"] .delivery-mode-button:not(.active):not(:disabled):hover,
body[data-theme="dark"] .session-mini:not(:disabled):hover {
  background: var(--soft-control-hover-dark) !important;
  color: var(--discern-text) !important;
  -webkit-text-fill-color: var(--discern-text) !important;
}

body .primary-button:not(:disabled),
body .primary-button.accent:not(:disabled),
body .mini-button-primary:not(:disabled),
body .template-tab.active:not(:disabled),
body .page-nav-button.active:not(:disabled),
body .records-mode-button.active:not(:disabled),
body .records-filter-button.active:not(:disabled),
body .delivery-mode-button.active:not(:disabled) {
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.18),
    0 10px 20px rgba(39, 58, 46, 0.12) !important;
}

body .history-summary {
  gap: 7px !important;
}

body #section-history .history-summary .history-question-title {
  font-size: 1rem !important;
  line-height: 1.5 !important;
  font-weight: 500 !important;
  letter-spacing: 0.01em !important;
}

body #section-history .history-summary .history-answer-preview {
  font-size: 0.9rem !important;
  line-height: 1.58 !important;
  color: var(--discern-muted) !important;
  -webkit-text-fill-color: var(--discern-muted) !important;
}

body .history-meta {
  gap: 7px !important;
  margin-top: 4px !important;
}

body .history-mode,
body .history-state,
body .history-state-session,
body .history-state-single,
body .history-state-pinned {
  min-height: 24px !important;
  padding: 3px 9px !important;
  border-radius: 999px !important;
  background: var(--soft-pill-bg-light) !important;
  border: 1px solid var(--soft-pill-border-light) !important;
  color: var(--discern-muted) !important;
  -webkit-text-fill-color: var(--discern-muted) !important;
  font-size: 0.78rem !important;
  font-weight: 400 !important;
  box-shadow: none !important;
}

body[data-theme="dark"] .history-mode,
body[data-theme="dark"] .history-state,
body[data-theme="dark"] .history-state-session,
body[data-theme="dark"] .history-state-single,
body[data-theme="dark"] .history-state-pinned {
  background: var(--soft-pill-bg-dark) !important;
  border-color: var(--soft-pill-border-dark) !important;
  color: var(--discern-muted) !important;
  -webkit-text-fill-color: var(--discern-muted) !important;
}

/* TRUE EOF button readability correction: same-level controls must stay legible. */
body #section-tools .tool-item .ghost-button:not(:disabled),
body #section-tools .tool-item .ghost-button:not(:disabled) .tool-action-label,
body #section-records-filters .ghost-button:not(:disabled),
body #section-settings .delivery-mode-button:not(:disabled),
body #section-settings .delivery-mode-button:not(:disabled) span,
body #export-history-settings:not(:disabled),
body #theme-toggle-settings:not(:disabled) {
  color: var(--discern-text) !important;
  -webkit-text-fill-color: var(--discern-text) !important;
}

body[data-theme="dark"] #section-tools .tool-item .ghost-button:not(:disabled),
body[data-theme="dark"] #section-tools .tool-item .ghost-button:not(:disabled) .tool-action-label,
body[data-theme="dark"] #section-records-filters .ghost-button:not(:disabled),
body[data-theme="dark"] #section-settings .delivery-mode-button:not(:disabled),
body[data-theme="dark"] #section-settings .delivery-mode-button:not(:disabled) span,
body[data-theme="dark"] #export-history-settings:not(:disabled),
body[data-theme="dark"] #theme-toggle-settings:not(:disabled) {
  color: var(--discern-text) !important;
  -webkit-text-fill-color: var(--discern-text) !important;
}

body #section-records-filters .ghost-button:not(.active):not(:disabled),
body #section-settings .delivery-mode-button:not(.active):not(:disabled) {
  background: var(--soft-control-bg-light) !important;
  border-color: var(--soft-control-border-light) !important;
}

body[data-theme="dark"] #section-records-filters .ghost-button:not(.active):not(:disabled),
body[data-theme="dark"] #section-settings .delivery-mode-button:not(.active):not(:disabled) {
  background: var(--soft-control-bg-dark) !important;
  border-color: var(--soft-control-border-dark) !important;
}

/* TRUE EOF selected button text: all active controls use white labels. */
body .template-tab.active:not(:disabled),
body .page-nav-button.active:not(:disabled),
body .records-mode-button.active:not(:disabled),
body .records-filter-button.active:not(:disabled),
body .delivery-mode-button.active:not(:disabled),
body .primary-button:not(:disabled),
body .primary-button.accent:not(:disabled),
body .mini-button-primary:not(:disabled),
body .history-actions .mini-button-primary:not(:disabled),
body .session-actions .session-resume:not(:disabled),
body .session-actions .session-pin-toggle:not(:disabled),
body .template-tab.active:not(:disabled) *,
body .page-nav-button.active:not(:disabled) *,
body .records-mode-button.active:not(:disabled) *,
body .records-filter-button.active:not(:disabled) *,
body .delivery-mode-button.active:not(:disabled) *,
body .primary-button:not(:disabled) *,
body .primary-button.accent:not(:disabled) *,
body .mini-button-primary:not(:disabled) * {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

body[data-theme="dark"] .template-tab.active:not(:disabled),
body[data-theme="dark"] .page-nav-button.active:not(:disabled),
body[data-theme="dark"] .records-mode-button.active:not(:disabled),
body[data-theme="dark"] .records-filter-button.active:not(:disabled),
body[data-theme="dark"] .delivery-mode-button.active:not(:disabled),
body[data-theme="dark"] .primary-button:not(:disabled),
body[data-theme="dark"] .primary-button.accent:not(:disabled),
body[data-theme="dark"] .mini-button-primary:not(:disabled),
body[data-theme="dark"] .history-actions .mini-button-primary:not(:disabled),
body[data-theme="dark"] .session-actions .session-resume:not(:disabled),
body[data-theme="dark"] .session-actions .session-pin-toggle:not(:disabled),
body[data-theme="dark"] .template-tab.active:not(:disabled) *,
body[data-theme="dark"] .page-nav-button.active:not(:disabled) *,
body[data-theme="dark"] .records-mode-button.active:not(:disabled) *,
body[data-theme="dark"] .records-filter-button.active:not(:disabled) *,
body[data-theme="dark"] .delivery-mode-button.active:not(:disabled) *,
body[data-theme="dark"] .primary-button:not(:disabled) *,
body[data-theme="dark"] .primary-button.accent:not(:disabled) *,
body[data-theme="dark"] .mini-button-primary:not(:disabled) * {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* TRUE EOF selected button specificity lock: override section-level readable-button rules. */
body #section-records-filters .ghost-button.active:not(:disabled),
body #section-records-filters .records-filter-button.active:not(:disabled),
body #section-records-filters .records-mode-button.active:not(:disabled),
body #section-settings .delivery-mode-button.active:not(:disabled),
body #section-question .template-tab.active:not(:disabled),
body .page-switcher-nav .page-nav-button.active:not(:disabled),
body #section-records-filters .ghost-button.active:not(:disabled) *,
body #section-records-filters .records-filter-button.active:not(:disabled) *,
body #section-records-filters .records-mode-button.active:not(:disabled) *,
body #section-settings .delivery-mode-button.active:not(:disabled) *,
body #section-question .template-tab.active:not(:disabled) *,
body .page-switcher-nav .page-nav-button.active:not(:disabled) * {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

body[data-theme="dark"] #section-records-filters .ghost-button.active:not(:disabled),
body[data-theme="dark"] #section-records-filters .records-filter-button.active:not(:disabled),
body[data-theme="dark"] #section-records-filters .records-mode-button.active:not(:disabled),
body[data-theme="dark"] #section-settings .delivery-mode-button.active:not(:disabled),
body[data-theme="dark"] #section-question .template-tab.active:not(:disabled),
body[data-theme="dark"] .page-switcher-nav .page-nav-button.active:not(:disabled),
body[data-theme="dark"] #section-records-filters .ghost-button.active:not(:disabled) *,
body[data-theme="dark"] #section-records-filters .records-filter-button.active:not(:disabled) *,
body[data-theme="dark"] #section-records-filters .records-mode-button.active:not(:disabled) *,
body[data-theme="dark"] #section-settings .delivery-mode-button.active:not(:disabled) *,
body[data-theme="dark"] #section-question .template-tab.active:not(:disabled) *,
body[data-theme="dark"] .page-switcher-nav .page-nav-button.active:not(:disabled) * {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* Public beta layer: anonymous session tracking, feedback form, and admin dashboard. */
.beta-locked .page-shell {
  filter: blur(10px);
  pointer-events: none;
  user-select: none;
}

.beta-gate {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(14, 20, 18, 0.66);
  backdrop-filter: blur(18px);
}

.beta-gate[hidden] {
  display: none;
}

.beta-card {
  width: min(460px, 100%);
  padding: 32px;
  border-radius: 18px;
  display: grid;
  gap: 16px;
}

.beta-card h2 {
  margin: 0;
  font-size: 1.6rem;
}

.beta-error {
  min-height: 20px;
  color: #b45353 !important;
}

.feedback-form {
  margin-top: 18px;
  padding: 18px;
  border: 1px solid var(--discern-border);
  border-radius: 16px;
  background: var(--surface-panel);
  display: grid;
  gap: 14px;
}

.feedback-form[hidden] {
  display: none;
}

.feedback-head {
  margin-bottom: 0;
}

.feedback-head h3 {
  margin: 0;
  font-size: 1rem;
}

.feedback-checkbox {
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 10px;
}

.feedback-checkbox input {
  width: 18px;
  height: 18px;
}

.admin-shell {
  width: min(1240px, calc(100% - 32px));
  margin: 32px auto;
}

.admin-panel {
  padding: 30px;
  border-radius: 24px;
}

.admin-panel h1 {
  margin: 4px 0 0;
}

.admin-login {
  display: flex;
  align-items: end;
  gap: 12px;
  margin: 24px 0;
}

.admin-login .field {
  flex: 1;
}

.admin-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin: 22px 0 16px;
}

.admin-stat {
  min-height: 118px;
  padding: 18px;
  border: 1px solid var(--discern-border);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.48);
  box-shadow: 0 12px 28px rgba(31, 44, 37, 0.06);
}

.admin-stat.primary {
  background: linear-gradient(135deg, rgba(98, 121, 104, 0.16), rgba(255, 255, 255, 0.58));
}

.admin-stat span,
.admin-stat small {
  display: block;
  color: var(--discern-muted);
}

.admin-stat span {
  font-size: 0.86rem;
  font-weight: 700;
}

.admin-stat strong {
  display: block;
  margin: 8px 0 6px;
  font-size: 2.1rem;
  line-height: 1;
}

.admin-stat small {
  font-size: 0.8rem;
}

.admin-tabs {
  display: inline-flex;
  gap: 6px;
  padding: 6px;
  margin: 2px 0 18px;
  border: 1px solid rgba(86, 105, 94, 0.16);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.38);
}

.admin-tab {
  min-height: 38px;
  padding: 0 16px;
  border: 0;
  border-radius: 12px;
  background: transparent;
  color: var(--discern-muted);
  cursor: pointer;
  font: inherit;
  font-weight: 700;
}

.admin-tab.active {
  background: rgba(94, 118, 101, 0.16);
  color: var(--discern-ink);
  box-shadow: inset 0 0 0 1px rgba(86, 105, 94, 0.12);
}

.admin-view {
  display: none;
}

.admin-view.active {
  display: block;
}

.admin-overview-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(320px, 0.8fr);
  gap: 16px;
}

.admin-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 16px;
  margin: 18px 0;
}

.admin-card {
  padding: 20px;
  border: 1px solid var(--discern-border);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.44);
  box-shadow: 0 14px 34px rgba(31, 44, 37, 0.055);
}

.admin-card-primary {
  background: rgba(248, 250, 247, 0.72);
}

.admin-card-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: baseline;
  margin-bottom: 12px;
}

.admin-card h2,
.admin-insight-group h3 {
  margin: 0;
  font-size: 1rem;
}

.admin-card-note,
.admin-empty {
  color: var(--discern-muted);
  font-size: 0.86rem;
}

.admin-users,
.admin-insights {
  display: grid;
  gap: 10px;
}

.admin-health-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.admin-health-grid article,
.admin-attention-item {
  padding: 16px;
  border: 1px solid rgba(86, 105, 94, 0.14);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.48);
}

.admin-health-grid span,
.admin-attention-item span {
  color: var(--discern-muted);
  font-size: 0.8rem;
  font-weight: 700;
}

.admin-health-grid strong {
  display: block;
  margin: 6px 0;
  font-size: 1.05rem;
}

.admin-health-grid p,
.admin-attention-item p {
  margin: 0;
  color: var(--discern-muted);
  font-size: 0.88rem;
  line-height: 1.55;
}

.admin-attention {
  display: grid;
  gap: 10px;
}

.admin-attention-item {
  display: grid;
  grid-template-columns: 96px 1fr;
  gap: 12px;
  align-items: center;
}

.admin-attention-item strong {
  display: block;
  font-size: 1.5rem;
}

.admin-user-row {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) minmax(260px, auto);
  gap: 12px;
  align-items: center;
  padding: 14px 0;
  border-top: 1px solid rgba(86, 105, 94, 0.14);
}

.admin-user-row:first-child {
  border-top: 0;
}

.admin-user-row strong,
.admin-user-row span {
  display: block;
}

.admin-user-row span,
.admin-user-metrics,
.admin-insight-group p span {
  color: var(--discern-muted);
  font-size: 0.84rem;
}

.admin-user-metrics {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.admin-user-metrics span,
.admin-score {
  padding: 4px 8px;
  border-radius: 999px;
  background: rgba(103, 122, 108, 0.1);
  color: var(--discern-ink);
}

.admin-user-progress {
  grid-column: 1 / -1;
  height: 6px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(103, 122, 108, 0.1);
}

.admin-user-progress span {
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, rgba(82, 112, 92, 0.5), rgba(82, 112, 92, 0.9));
}

.admin-insight-group {
  display: grid;
  gap: 8px;
}

.admin-insight-group + .admin-insight-group {
  padding-top: 12px;
  border-top: 1px solid rgba(86, 105, 94, 0.14);
}

.admin-insight-group p {
  margin: 0;
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.42);
  line-height: 1.55;
}

.admin-insight-group p strong,
.admin-insight-group p span {
  margin-right: 8px;
}

.admin-tools {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 220px;
  gap: 12px;
  margin: 0;
}

.admin-records-head {
  position: sticky;
  top: 0;
  z-index: 4;
  display: grid;
  grid-template-columns: minmax(180px, 0.5fr) minmax(420px, 1fr);
  gap: 18px;
  align-items: end;
  padding: 16px;
  margin-bottom: 14px;
  border: 1px solid rgba(86, 105, 94, 0.14);
  border-radius: 18px;
  background: rgba(242, 246, 240, 0.88);
  backdrop-filter: blur(16px);
}

.admin-records-head h2 {
  margin: 0 0 4px;
  font-size: 1.08rem;
}

.admin-search,
.admin-filter {
  display: grid;
  gap: 8px;
  color: var(--discern-muted);
  font-size: 0.86rem;
}

.admin-search input,
.admin-filter select {
  width: 100%;
  min-height: 46px;
  border-radius: 14px;
  border: 1px solid var(--discern-border);
  background: rgba(255, 255, 255, 0.58);
  color: var(--discern-ink);
  padding: 0 14px;
  font: inherit;
}

.admin-table {
  display: grid;
  gap: 8px;
  max-height: min(980px, 72vh);
  overflow: auto;
  padding-right: 4px;
}

.admin-history-list.history-list {
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.admin-history-item.history-item {
  border-color: rgba(86, 105, 94, 0.18);
  background: rgba(255, 255, 255, 0.44);
  border-radius: 14px;
}

.admin-history-item .history-summary {
  grid-template-columns: minmax(0, 1fr) 18px;
  min-height: 62px;
  padding: 10px 14px;
  align-items: center;
}

.admin-history-item .history-body {
  padding: 0 14px 14px;
}

.admin-record-titleline {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) auto;
  gap: 14px;
  align-items: center;
  min-width: 0;
}

.admin-record-titleline .history-question-title {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.94rem;
}

.admin-record-titleline .history-meta {
  justify-content: flex-end;
  flex-wrap: nowrap;
  white-space: nowrap;
}

.admin-record-titleline .history-meta > span:not(.history-state):not(.history-mode) {
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.admin-feedback-state {
  background: rgba(70, 116, 84, 0.12);
  color: #486c54;
}

.admin-score-state {
  background: rgba(103, 122, 108, 0.12);
  color: var(--discern-ink);
}

.admin-continue-state {
  background: rgba(55, 120, 79, 0.12);
  color: #3f744e;
}

.admin-stop-state {
  background: rgba(145, 115, 68, 0.12);
  color: #786340;
}

.admin-feedback-surface {
  background: rgba(255, 255, 255, 0.42);
}

.admin-feedback-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.admin-feedback-grid > div {
  padding: 12px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.42);
}

.admin-feedback-grid span {
  display: block;
  margin-bottom: 6px;
  color: var(--discern-muted);
  font-size: 0.82rem;
}

.admin-feedback-grid strong {
  font-size: 1rem;
}

.admin-feedback-grid p {
  margin: 0;
  white-space: pre-wrap;
  line-height: 1.6;
}

.admin-feedback-wide {
  grid-column: 1 / -1;
}

.admin-record {
  padding: 18px;
  border: 1px solid var(--discern-border);
  border-radius: 16px;
  background: var(--surface-panel);
}

.admin-record header {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}

.admin-record-meta {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.admin-record header span,
.admin-record time {
  color: var(--discern-muted);
  font-size: 0.86rem;
}

.admin-record section {
  margin-top: 14px;
}

.admin-record h3 {
  margin: 0 0 6px;
  font-size: 0.92rem;
}

.admin-record p {
  margin: 0;
  white-space: pre-wrap;
  line-height: 1.65;
}

@media (max-width: 980px) {
  .admin-summary,
  .admin-overview-grid,
  .admin-tools,
  .admin-records-head,
  .admin-feedback-grid {
    grid-template-columns: 1fr;
  }

  .admin-login,
  .admin-record header,
  .admin-user-row,
  .admin-record-titleline {
    display: grid;
    grid-template-columns: 1fr;
  }

  .admin-user-metrics,
  .admin-record-meta,
  .admin-record-titleline .history-meta {
    justify-content: flex-start;
    flex-wrap: wrap;
  }
}

@media (max-width: 720px) {
  .admin-panel {
    padding: 20px;
  }

  .admin-summary,
  .admin-health-grid {
    grid-template-columns: 1fr;
  }

  .admin-tabs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
  }

  .admin-attention-item {
    grid-template-columns: 1fr;
  }
}

/* Liquid Glass refresh for the public beta UI. Keep this layer last. */
:root {
  --bg: #eef4f6;
  --bg-deep: #dfe8ec;
  --card: rgba(255, 255, 255, 0.42);
  --card-strong: rgba(255, 255, 255, 0.56);
  --line: rgba(73, 92, 105, 0.16);
  --text: #172026;
  --muted: #62717b;
  --accent: #496a5a;
  --accent-strong: #193d31;
  --shadow: 0 28px 80px rgba(34, 47, 57, 0.18);
  --liquid-surface: rgba(255, 255, 255, 0.48);
  --liquid-surface-strong: rgba(255, 255, 255, 0.68);
  --liquid-edge: rgba(255, 255, 255, 0.76);
  --liquid-active: linear-gradient(135deg, rgba(67, 115, 94, 0.92), rgba(40, 80, 94, 0.9));
  --liquid-active-shadow: 0 14px 28px rgba(40, 78, 90, 0.22), inset 0 1px 1px rgba(255, 255, 255, 0.46);
  --liquid-shadow: 0 24px 70px rgba(29, 45, 57, 0.16), 0 2px 10px rgba(255, 255, 255, 0.38) inset;
}

body[data-theme="dark"] {
  --bg: #11181d;
  --bg-deep: #0c1115;
  --card: rgba(18, 25, 30, 0.48);
  --card-strong: rgba(24, 33, 39, 0.68);
  --line: rgba(215, 232, 238, 0.14);
  --text: #eff7f7;
  --muted: #a4b6bd;
  --accent: #77a989;
  --accent-strong: #dff5ea;
  --shadow: 0 30px 90px rgba(0, 0, 0, 0.42);
  --liquid-surface: rgba(20, 30, 36, 0.5);
  --liquid-surface-strong: rgba(28, 40, 48, 0.68);
  --liquid-edge: rgba(255, 255, 255, 0.17);
  --liquid-shadow: 0 26px 76px rgba(0, 0, 0, 0.42), 0 1px 0 rgba(255, 255, 255, 0.08) inset;
}

html,
body {
  background:
    linear-gradient(120deg, rgba(219, 235, 241, 0.94) 0%, rgba(242, 246, 242, 0.94) 35%, rgba(233, 229, 240, 0.9) 72%, rgba(226, 238, 236, 0.94) 100%),
    conic-gradient(from 210deg at 52% 22%, rgba(118, 165, 190, 0.28), rgba(210, 229, 216, 0.24), rgba(208, 191, 220, 0.22), rgba(226, 238, 236, 0.3), rgba(118, 165, 190, 0.28));
  background-attachment: fixed;
}

body[data-theme="dark"] {
  background:
    linear-gradient(120deg, rgba(12, 17, 21, 0.98) 0%, rgba(18, 31, 35, 0.96) 42%, rgba(27, 25, 38, 0.96) 76%, rgba(13, 22, 25, 0.98) 100%),
    conic-gradient(from 220deg at 48% 16%, rgba(78, 128, 150, 0.24), rgba(55, 91, 70, 0.2), rgba(94, 73, 112, 0.2), rgba(56, 93, 103, 0.22), rgba(78, 128, 150, 0.24));
}

body {
  color: var(--text);
  letter-spacing: 0;
}

.glass,
body .title-banner,
body .composer,
body .response-card,
body #section-records-filters,
body .supplement-panel,
body .records-filters-stack,
body .records-filter-block,
body .send-preview,
body .conversation-toolbar {
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0.34) 48%, rgba(236, 247, 250, 0.42)),
    var(--liquid-surface) !important;
  border: 1px solid var(--liquid-edge) !important;
  box-shadow: var(--liquid-shadow) !important;
  backdrop-filter: blur(34px) saturate(1.35) contrast(1.03);
  -webkit-backdrop-filter: blur(34px) saturate(1.35) contrast(1.03);
}

body[data-theme="dark"] .glass,
body[data-theme="dark"] .title-banner,
body[data-theme="dark"] .composer,
body[data-theme="dark"] .response-card,
body[data-theme="dark"] #section-records-filters,
body[data-theme="dark"] .supplement-panel,
body[data-theme="dark"] .records-filters-stack,
body[data-theme="dark"] .records-filter-block,
body[data-theme="dark"] .send-preview,
body[data-theme="dark"] .conversation-toolbar {
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.11), rgba(255, 255, 255, 0.045) 52%, rgba(90, 132, 148, 0.08)),
    var(--liquid-surface) !important;
  border-color: var(--liquid-edge) !important;
}

.glass::before,
body .title-banner::before,
body .composer::before,
body .response-card::before,
body #section-records-filters::before,
body .supplement-panel::before,
body .records-filters-stack::before,
body .records-filter-block::before,
body .send-preview::before,
body .conversation-toolbar::before {
  content: "";
  position: absolute;
  inset: 1px;
  pointer-events: none;
  border-radius: inherit;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.72) 0%, rgba(255, 255, 255, 0.12) 30%, transparent 54%),
    linear-gradient(315deg, rgba(130, 177, 198, 0.18), transparent 42%);
  opacity: 0.84;
  mix-blend-mode: screen;
}

body[data-theme="dark"] .glass::before,
body[data-theme="dark"] .title-banner::before,
body[data-theme="dark"] .composer::before,
body[data-theme="dark"] .response-card::before,
body[data-theme="dark"] #section-records-filters::before,
body[data-theme="dark"] .supplement-panel::before,
body[data-theme="dark"] .records-filters-stack::before,
body[data-theme="dark"] .records-filter-block::before,
body[data-theme="dark"] .send-preview::before,
body[data-theme="dark"] .conversation-toolbar::before {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.045) 34%, transparent 58%),
    linear-gradient(315deg, rgba(128, 196, 220, 0.12), transparent 46%);
  opacity: 0.72;
}

.glass > *,
body .title-banner > *,
body .composer > *,
body .response-card > *,
body #section-records-filters > *,
body .supplement-panel > *,
body .records-filters-stack > *,
body .records-filter-block > *,
body .send-preview > *,
body .conversation-toolbar > * {
  position: relative;
  z-index: 1;
}

body .title-banner,
body .composer,
body .response-card {
  border-radius: 30px !important;
}

body .title-banner {
  top: 16px;
  padding: 28px 32px;
}

body .title-banner h1.brand-mark,
body .brand-main {
  letter-spacing: 0.18em !important;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.65);
}

body[data-theme="dark"] .title-banner h1.brand-mark,
body[data-theme="dark"] .brand-main {
  text-shadow: 0 1px 18px rgba(189, 232, 236, 0.16);
}

body .title-copy,
body .brand-copy,
body .hero-copy,
body .micro-copy,
body .composer-actions-note,
body .privacy-note {
  color: var(--muted) !important;
}

body .page-switcher-nav,
body .template-switcher,
body .records-filter-group {
  background: rgba(255, 255, 255, 0.34) !important;
  border: 1px solid rgba(255, 255, 255, 0.62) !important;
  box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.62), 0 10px 28px rgba(31, 48, 59, 0.08) !important;
  backdrop-filter: blur(24px) saturate(1.25);
  -webkit-backdrop-filter: blur(24px) saturate(1.25);
}

body[data-theme="dark"] .page-switcher-nav,
body[data-theme="dark"] .template-switcher,
body[data-theme="dark"] .records-filter-group {
  background: rgba(255, 255, 255, 0.055) !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.08), 0 12px 30px rgba(0, 0, 0, 0.22) !important;
}

body .primary-button,
body .primary-button.accent,
body .page-nav-button.active:not(:disabled),
body .template-tab.active:not(:disabled),
body #section-records-filters .records-filter-button.active:not(:disabled),
body #section-records-filters .records-mode-button.active:not(:disabled) {
  color: #fff !important;
  background: var(--liquid-active) !important;
  border-color: rgba(255, 255, 255, 0.42) !important;
  box-shadow: var(--liquid-active-shadow) !important;
  text-shadow: 0 1px 12px rgba(0, 0, 0, 0.24);
}

body .ghost-button:not(:disabled),
body .template-tab:not(.active):not(:disabled),
body .page-nav-button:not(.active):not(:disabled),
body #section-records-filters .records-filter-button:not(.active):not(:disabled),
body #section-records-filters .records-mode-button:not(.active):not(:disabled),
body .mini-button:not(:disabled),
body .session-mini:not(:disabled) {
  background: rgba(255, 255, 255, 0.46) !important;
  border-color: rgba(255, 255, 255, 0.66) !important;
  color: var(--text) !important;
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.72), 0 8px 20px rgba(35, 50, 60, 0.06) !important;
  backdrop-filter: blur(18px) saturate(1.2);
  -webkit-backdrop-filter: blur(18px) saturate(1.2);
}

body[data-theme="dark"] .ghost-button:not(:disabled),
body[data-theme="dark"] .template-tab:not(.active):not(:disabled),
body[data-theme="dark"] .page-nav-button:not(.active):not(:disabled),
body[data-theme="dark"] #section-records-filters .records-filter-button:not(.active):not(:disabled),
body[data-theme="dark"] #section-records-filters .records-mode-button:not(.active):not(:disabled),
body[data-theme="dark"] .mini-button:not(:disabled),
body[data-theme="dark"] .session-mini:not(:disabled) {
  background: rgba(255, 255, 255, 0.07) !important;
  border-color: rgba(255, 255, 255, 0.13) !important;
  color: var(--text) !important;
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.08), 0 10px 22px rgba(0, 0, 0, 0.2) !important;
}

body .primary-button:hover,
body .ghost-button:not(:disabled):hover,
body .template-tab:not(:disabled):hover,
body .page-nav-button:not(:disabled):hover,
body .mini-button:not(:disabled):hover,
body .session-mini:not(:disabled):hover {
  transform: translateY(-1px);
  filter: brightness(1.03) saturate(1.04);
}

body input,
body textarea,
body select,
body .response-output,
body .system-preview,
body .conversation-thread.empty,
body .session-list.empty,
body .history-list.empty,
body .conversation-item,
body .session-item,
body .history-item,
body .history-block-surface,
body .history-conversation-item,
body #section-question #supplement-panel .supplement-card,
body #section-records-filters label.records-search-field {
  background: rgba(255, 255, 255, 0.5) !important;
  border: 1px solid rgba(255, 255, 255, 0.66) !important;
  box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.66), 0 10px 28px rgba(35, 50, 60, 0.07) !important;
  backdrop-filter: blur(18px) saturate(1.18);
  -webkit-backdrop-filter: blur(18px) saturate(1.18);
}

body[data-theme="dark"] input,
body[data-theme="dark"] textarea,
body[data-theme="dark"] select,
body[data-theme="dark"] .response-output,
body[data-theme="dark"] .system-preview,
body[data-theme="dark"] .conversation-thread.empty,
body[data-theme="dark"] .session-list.empty,
body[data-theme="dark"] .history-list.empty,
body[data-theme="dark"] .conversation-item,
body[data-theme="dark"] .session-item,
body[data-theme="dark"] .history-item,
body[data-theme="dark"] .history-block-surface,
body[data-theme="dark"] .history-conversation-item,
body[data-theme="dark"] #section-question #supplement-panel .supplement-card,
body[data-theme="dark"] #section-records-filters label.records-search-field {
  background: rgba(255, 255, 255, 0.065) !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.08), 0 14px 34px rgba(0, 0, 0, 0.2) !important;
}

body input:focus,
body textarea:focus,
body select:focus,
body #section-question #supplement-panel .supplement-card:focus-within,
body #section-records-filters label.records-search-field:focus-within {
  border-color: rgba(72, 125, 148, 0.42) !important;
  box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.72), 0 0 0 5px rgba(91, 147, 169, 0.14), 0 14px 34px rgba(35, 50, 60, 0.09) !important;
}

body .field-question-primary {
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.72), rgba(235, 247, 249, 0.46)) !important;
}

body[data-theme="dark"] .field-question-primary {
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.09), rgba(110, 154, 170, 0.07)) !important;
}

body .status-pill,
body .status-pill-save {
  background: rgba(255, 255, 255, 0.42) !important;
  border: 1px solid rgba(255, 255, 255, 0.62) !important;
  color: var(--muted) !important;
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.7) !important;
  backdrop-filter: blur(14px) saturate(1.16);
  -webkit-backdrop-filter: blur(14px) saturate(1.16);
}

body[data-theme="dark"] .status-pill,
body[data-theme="dark"] .status-pill-save {
  background: rgba(255, 255, 255, 0.07) !important;
  border-color: rgba(255, 255, 255, 0.13) !important;
  color: var(--muted) !important;
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.08) !important;
}

body .response-output {
  color: var(--text);
  line-height: 1.88;
}

body .response-output.empty {
  color: var(--muted);
}

body .toast {
  background: rgba(20, 34, 42, 0.72) !important;
  border: 1px solid rgba(255, 255, 255, 0.18);
  box-shadow: 0 20px 54px rgba(16, 28, 34, 0.26), inset 0 1px 1px rgba(255, 255, 255, 0.16);
  backdrop-filter: blur(24px) saturate(1.25);
  -webkit-backdrop-filter: blur(24px) saturate(1.25);
}

@media (max-width: 760px) {
  body {
    padding: 14px;
  }

  body .title-banner,
  body .composer,
  body .response-card {
    border-radius: 24px !important;
  }

  body .title-banner {
    padding: 22px;
  }

  body .title-banner h1.brand-mark {
    letter-spacing: 0.12em !important;
  }

  body .page-switcher-nav,
  body .template-switcher,
  body .records-filter-group {
    width: 100%;
  }
}

/* Liquid Glass component completion pass. Covers dynamic records, feedback, and admin UI. */
:root {
  --liquid-panel: linear-gradient(145deg, rgba(255, 255, 255, 0.66), rgba(255, 255, 255, 0.34) 56%, rgba(231, 244, 248, 0.38));
  --liquid-panel-subtle: linear-gradient(145deg, rgba(255, 255, 255, 0.54), rgba(255, 255, 255, 0.24) 58%, rgba(231, 244, 248, 0.28));
  --liquid-field: rgba(255, 255, 255, 0.48);
  --liquid-field-strong: rgba(255, 255, 255, 0.62);
  --liquid-pill: rgba(255, 255, 255, 0.44);
  --liquid-pill-border: rgba(255, 255, 255, 0.68);
  --liquid-readable: #172026;
  --liquid-muted-readable: #5e6d76;
}

body[data-theme="dark"] {
  --liquid-panel: linear-gradient(145deg, rgba(255, 255, 255, 0.105), rgba(255, 255, 255, 0.042) 58%, rgba(91, 147, 169, 0.075));
  --liquid-panel-subtle: linear-gradient(145deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.032) 58%, rgba(91, 147, 169, 0.055));
  --liquid-field: rgba(255, 255, 255, 0.062);
  --liquid-field-strong: rgba(255, 255, 255, 0.086);
  --liquid-pill: rgba(255, 255, 255, 0.07);
  --liquid-pill-border: rgba(255, 255, 255, 0.13);
  --liquid-readable: #eff7f7;
  --liquid-muted-readable: #a8b9bf;
}

body,
body * {
  scrollbar-color: rgba(91, 120, 132, 0.34) transparent;
}

body .mode-switcher-hint,
body .composer .field,
body .field-question-primary,
body .field-concern-secondary,
body .followup-guidance,
body .feedback-form,
body .admin-panel,
body .admin-card,
body .admin-stat,
body .admin-health-grid article,
body .admin-attention-item,
body .admin-records-head,
body .admin-user-row,
body .admin-insight-group p,
body .admin-feedback-grid > div,
body .admin-record,
body .admin-history-item.history-item,
body .tool-item,
body .supplemental-fields {
  position: relative;
  overflow: hidden;
  background: var(--liquid-panel-subtle) !important;
  border: 1px solid var(--liquid-edge) !important;
  box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.62), 0 14px 36px rgba(35, 50, 60, 0.075) !important;
  backdrop-filter: blur(24px) saturate(1.24);
  -webkit-backdrop-filter: blur(24px) saturate(1.24);
}

body[data-theme="dark"] .mode-switcher-hint,
body[data-theme="dark"] .composer .field,
body[data-theme="dark"] .field-question-primary,
body[data-theme="dark"] .field-concern-secondary,
body[data-theme="dark"] .followup-guidance,
body[data-theme="dark"] .feedback-form,
body[data-theme="dark"] .admin-panel,
body[data-theme="dark"] .admin-card,
body[data-theme="dark"] .admin-stat,
body[data-theme="dark"] .admin-health-grid article,
body[data-theme="dark"] .admin-attention-item,
body[data-theme="dark"] .admin-records-head,
body[data-theme="dark"] .admin-user-row,
body[data-theme="dark"] .admin-insight-group p,
body[data-theme="dark"] .admin-feedback-grid > div,
body[data-theme="dark"] .admin-record,
body[data-theme="dark"] .admin-history-item.history-item,
body[data-theme="dark"] .tool-item,
body[data-theme="dark"] .supplemental-fields {
  border-color: var(--liquid-edge) !important;
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.08), 0 16px 38px rgba(0, 0, 0, 0.2) !important;
}

body .admin-panel,
body .admin-card,
body .feedback-form {
  border-radius: 28px !important;
}

body .mode-switcher-hint,
body .composer .field,
body .followup-guidance,
body .admin-stat,
body .admin-health-grid article,
body .admin-attention-item,
body .admin-user-row,
body .admin-insight-group p,
body .admin-feedback-grid > div {
  border-radius: 18px !important;
}

body #section-question #supplement-panel,
body #section-question #supplement-panel .supplement-card,
body #section-question #supplement-panel textarea,
body #section-records-filters,
body #section-records-filters .records-search-field,
body #section-records-filters #records-search,
body .send-preview,
body .response-output,
body .conversation-thread,
body .history-list,
body .session-list,
body .conversation-item,
body .history-item,
body .session-item,
body .history-block-surface,
body .history-note-surface,
body .history-conversation-item,
body .admin-feedback-surface,
body .admin-search input,
body .admin-filter select,
body .admin-table,
body .admin-history-list.history-list {
  background: var(--liquid-field) !important;
  border: 1px solid var(--liquid-pill-border) !important;
  box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.58), 0 10px 28px rgba(35, 50, 60, 0.07) !important;
  backdrop-filter: blur(20px) saturate(1.18);
  -webkit-backdrop-filter: blur(20px) saturate(1.18);
}

body[data-theme="dark"] #section-question #supplement-panel,
body[data-theme="dark"] #section-question #supplement-panel .supplement-card,
body[data-theme="dark"] #section-question #supplement-panel textarea,
body[data-theme="dark"] #section-records-filters,
body[data-theme="dark"] #section-records-filters .records-search-field,
body[data-theme="dark"] #section-records-filters #records-search,
body[data-theme="dark"] .send-preview,
body[data-theme="dark"] .response-output,
body[data-theme="dark"] .conversation-thread,
body[data-theme="dark"] .history-list,
body[data-theme="dark"] .session-list,
body[data-theme="dark"] .conversation-item,
body[data-theme="dark"] .history-item,
body[data-theme="dark"] .session-item,
body[data-theme="dark"] .history-block-surface,
body[data-theme="dark"] .history-note-surface,
body[data-theme="dark"] .history-conversation-item,
body[data-theme="dark"] .admin-feedback-surface,
body[data-theme="dark"] .admin-search input,
body[data-theme="dark"] .admin-filter select,
body[data-theme="dark"] .admin-table,
body[data-theme="dark"] .admin-history-list.history-list {
  background: var(--liquid-field) !important;
  border-color: var(--liquid-pill-border) !important;
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.08), 0 14px 32px rgba(0, 0, 0, 0.2) !important;
}

body .history-list,
body .session-list,
body .conversation-thread,
body .admin-table,
body .admin-history-list.history-list {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

body .history-item,
body .session-item,
body .conversation-item,
body .history-block-surface,
body .history-conversation-item {
  border-radius: 18px !important;
}

body .history-summary,
body .history-item[open] .history-summary,
body .history-item:not([open]):hover .history-summary {
  background: transparent !important;
}

body .history-mode,
body .history-state,
body .history-state-session,
body .history-state-single,
body .history-state-pinned,
body .session-pin,
body .admin-score,
body .admin-feedback-state,
body .admin-score-state,
body .admin-continue-state,
body .admin-stop-state,
body .admin-user-metrics span,
body .status-pill,
body .status-pill-save,
body .answer-kicker {
  background: var(--liquid-pill) !important;
  border: 1px solid var(--liquid-pill-border) !important;
  color: var(--liquid-muted-readable) !important;
  -webkit-text-fill-color: var(--liquid-muted-readable) !important;
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.62) !important;
  backdrop-filter: blur(14px) saturate(1.16);
  -webkit-backdrop-filter: blur(14px) saturate(1.16);
}

body[data-theme="dark"] .history-mode,
body[data-theme="dark"] .history-state,
body[data-theme="dark"] .history-state-session,
body[data-theme="dark"] .history-state-single,
body[data-theme="dark"] .history-state-pinned,
body[data-theme="dark"] .session-pin,
body[data-theme="dark"] .admin-score,
body[data-theme="dark"] .admin-feedback-state,
body[data-theme="dark"] .admin-score-state,
body[data-theme="dark"] .admin-continue-state,
body[data-theme="dark"] .admin-stop-state,
body[data-theme="dark"] .admin-user-metrics span,
body[data-theme="dark"] .status-pill,
body[data-theme="dark"] .status-pill-save,
body[data-theme="dark"] .answer-kicker {
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.08) !important;
}

body .history-actions .mini-button-primary:not(:disabled),
body .session-actions .session-resume:not(:disabled),
body .session-actions .session-pin-toggle:not(:disabled),
body .admin-tab.active,
body .admin-user-progress span {
  background: var(--liquid-active) !important;
  border-color: rgba(255, 255, 255, 0.42) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  box-shadow: var(--liquid-active-shadow) !important;
}

body .admin-tabs {
  background: rgba(255, 255, 255, 0.32) !important;
  border: 1px solid rgba(255, 255, 255, 0.62) !important;
  box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.62), 0 10px 28px rgba(31, 48, 59, 0.08) !important;
  backdrop-filter: blur(22px) saturate(1.2);
  -webkit-backdrop-filter: blur(22px) saturate(1.2);
}

body[data-theme="dark"] .admin-tabs {
  background: rgba(255, 255, 255, 0.055) !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
}

body .admin-tab:not(.active):not(:disabled) {
  background: transparent !important;
  color: var(--liquid-muted-readable) !important;
  -webkit-text-fill-color: var(--liquid-muted-readable) !important;
}

body .admin-tab:not(.active):not(:disabled):hover {
  background: var(--liquid-pill) !important;
  color: var(--liquid-readable) !important;
  -webkit-text-fill-color: var(--liquid-readable) !important;
}

body input,
body textarea,
body select,
body button {
  color: var(--liquid-readable);
}

body .field span,
body .supplement-card > span,
body .mode-switcher-title,
body .supplement-panel-title,
body .history-question-title,
body .history-block-label,
body .conversation-role,
body .history-conversation-role,
body .admin-card h2,
body .admin-insight-group h3,
body .admin-records-head h2,
body .admin-stat strong,
body .admin-health-grid strong,
body .admin-attention-item strong,
body .admin-user-row strong,
body .admin-feedback-grid strong {
  color: var(--liquid-readable) !important;
  -webkit-text-fill-color: var(--liquid-readable) !important;
}

body .mode-switcher-hint,
body .mode-switcher-hint *,
body .supplement-panel-copy,
body .send-preview-copy,
body .history-answer-preview,
body .history-meta,
body .session-meta,
body .history-answer,
body .history-note,
body .admin-card-note,
body .admin-empty,
body .admin-stat span,
body .admin-stat small,
body .admin-health-grid span,
body .admin-health-grid p,
body .admin-attention-item span,
body .admin-attention-item p,
body .admin-user-row span,
body .admin-user-metrics,
body .admin-insight-group p span,
body .admin-feedback-grid span,
body .admin-feedback-grid p,
body .admin-search,
body .admin-filter,
body .admin-record header span,
body .admin-record time {
  color: var(--liquid-muted-readable) !important;
  -webkit-text-fill-color: var(--liquid-muted-readable) !important;
}

body .history-question,
body .history-answer,
body .history-conversation-content,
body .conversation-content,
body .response-output,
body .admin-record p {
  color: var(--liquid-readable) !important;
  -webkit-text-fill-color: var(--liquid-readable) !important;
}

body .resize-handle {
  background: rgba(255, 255, 255, 0.34) !important;
  border-color: rgba(255, 255, 255, 0.62) !important;
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.62), 0 8px 18px rgba(35, 50, 60, 0.08) !important;
  backdrop-filter: blur(16px) saturate(1.18);
  -webkit-backdrop-filter: blur(16px) saturate(1.18);
}

body .resize-handle::after {
  background: rgba(73, 106, 90, 0.7) !important;
}

body[data-theme="dark"] .resize-handle {
  background: rgba(255, 255, 255, 0.07) !important;
  border-color: rgba(255, 255, 255, 0.13) !important;
}

body .feedback-checkbox {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

body .feedback-checkbox input,
body .toggle-row input {
  width: 18px;
  height: 18px;
  accent-color: #49735e;
  box-shadow: none !important;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

body input::placeholder,
body textarea::placeholder,
body #section-question #supplement-panel textarea::placeholder,
body #section-records-filters #records-search::placeholder {
  color: rgba(94, 109, 118, 0.58) !important;
  -webkit-text-fill-color: rgba(94, 109, 118, 0.58) !important;
}

body[data-theme="dark"] input::placeholder,
body[data-theme="dark"] textarea::placeholder,
body[data-theme="dark"] #section-question #supplement-panel textarea::placeholder,
body[data-theme="dark"] #section-records-filters #records-search::placeholder {
  color: rgba(168, 185, 191, 0.48) !important;
  -webkit-text-fill-color: rgba(168, 185, 191, 0.48) !important;
}

body .admin-user-progress {
  background: rgba(255, 255, 255, 0.34) !important;
  border: 1px solid rgba(255, 255, 255, 0.54);
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.58);
}

body[data-theme="dark"] .admin-user-progress {
  background: rgba(255, 255, 255, 0.07) !important;
  border-color: rgba(255, 255, 255, 0.13);
}

body .toast.visible {
  opacity: 1;
}

@media (max-width: 720px) {
  body .admin-panel,
  body .admin-card,
  body .feedback-form {
    border-radius: 24px !important;
  }

  body .mode-switcher-hint,
  body .composer .field,
  body .admin-stat,
  body .admin-health-grid article,
  body .admin-attention-item,
  body .admin-user-row,
  body .admin-insight-group p,
  body .admin-feedback-grid > div {
    border-radius: 16px !important;
  }
}

/* Liquid Glass audit lock: neutralize older EOF layers and cover every component family. */
:root {
  --discern-ink: var(--liquid-readable);
  --discern-text: var(--liquid-readable);
  --discern-muted: var(--liquid-muted-readable);
  --discern-border: var(--liquid-pill-border);
  --discern-selected: rgba(67, 115, 94, 0.92);
  --discern-selected-hover: rgba(78, 130, 108, 0.96);
  --surface-panel: var(--liquid-panel-subtle);
  --surface-panel-bg-light: var(--liquid-panel-subtle);
  --surface-panel-border-light: var(--liquid-edge);
  --surface-panel-bg-dark: var(--liquid-panel-subtle);
  --surface-panel-border-dark: var(--liquid-edge);
  --textbox-surface-light-eof: var(--liquid-field);
  --textbox-border-light-eof: var(--liquid-pill-border);
  --textbox-shadow-light-eof: inset 0 1px 2px rgba(255, 255, 255, 0.58), 0 10px 28px rgba(35, 50, 60, 0.07);
  --textbox-surface-dark-eof: var(--liquid-field);
  --textbox-border-dark-eof: var(--liquid-pill-border);
  --textbox-shadow-dark-eof: inset 0 1px 1px rgba(255, 255, 255, 0.08), 0 14px 32px rgba(0, 0, 0, 0.2);
  --soft-control-bg-light: var(--liquid-pill);
  --soft-control-hover-light: rgba(255, 255, 255, 0.58);
  --soft-control-bg-dark: var(--liquid-pill);
  --soft-control-hover-dark: rgba(255, 255, 255, 0.1);
  --soft-pill-bg-light: var(--liquid-pill);
  --soft-pill-border-light: var(--liquid-pill-border);
  --soft-pill-bg-dark: var(--liquid-pill);
  --soft-pill-border-dark: var(--liquid-pill-border);
  --discern-inner: inset 0 1px 2px rgba(255, 255, 255, 0.58);
  --discern-shadow: 0 14px 36px rgba(35, 50, 60, 0.075);
}

body[data-theme="dark"] {
  --discern-inner: inset 0 1px 1px rgba(255, 255, 255, 0.08);
  --discern-shadow: 0 16px 38px rgba(0, 0, 0, 0.2);
}

body .beta-card,
body .panel,
body .layout-card,
body .response-card-answer,
body .response-card-history,
body .response-card-conversation,
body .response-card-prompt,
body .settings-panel,
body #section-settings,
body #section-tools,
body .tool-item,
body .feedback-form,
body .admin-panel,
body .admin-card,
body .admin-stat,
body .admin-records-head,
body .admin-record,
body .admin-history-item,
body .history-item,
body .session-item,
body .conversation-item,
body .history-block-surface,
body .history-conversation-item,
body .admin-feedback-surface,
body .admin-feedback-grid > div,
body .admin-health-grid article,
body .admin-attention-item,
body .admin-user-row,
body .admin-insight-group p,
body .mode-switcher-hint,
body .followup-guidance,
body .supplemental-fields,
body .send-preview,
body .conversation-toolbar,
body .answer-actions {
  background: var(--liquid-panel-subtle) !important;
  border: 1px solid var(--liquid-edge) !important;
  box-shadow: var(--discern-inner), var(--discern-shadow) !important;
  backdrop-filter: blur(24px) saturate(1.24) !important;
  -webkit-backdrop-filter: blur(24px) saturate(1.24) !important;
}

body .layout-slot,
body .layout-dropzone,
body .page-shell,
body .main-stage,
body .workspace,
body .workspace-left-column,
body .response-stack,
body .response-main-column,
body .response-side-column,
body .form-grid,
body .supplement-panel-grid,
body .sidebar-panels,
body .admin-content,
body .admin-view,
body .admin-overview,
body .admin-overview-grid,
body .admin-summary,
body .admin-users,
body .admin-insights,
body .admin-tools,
body .history-body,
body .history-footer,
body .history-actions,
body .session-actions,
body .history-conversation-list,
body .button-row,
body .panel-tools,
body .title-banner-content,
body .title-banner-nav,
body .brand-block {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

body .history-list,
body .session-list,
body .conversation-thread,
body .admin-table {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

body .history-list.empty,
body .session-list.empty,
body .conversation-thread.empty,
body .response-output,
body .system-preview,
body input,
body textarea,
body select,
body #section-settings input,
body #section-settings textarea,
body #section-question #supplement-panel textarea,
body #section-records-filters #records-search,
body .admin-search input,
body .admin-filter select {
  background: var(--liquid-field-strong) !important;
  border: 1px solid var(--liquid-pill-border) !important;
  box-shadow: var(--textbox-shadow-light-eof) !important;
  backdrop-filter: blur(20px) saturate(1.18) !important;
  -webkit-backdrop-filter: blur(20px) saturate(1.18) !important;
}

body[data-theme="dark"] .history-list.empty,
body[data-theme="dark"] .session-list.empty,
body[data-theme="dark"] .conversation-thread.empty,
body[data-theme="dark"] .response-output,
body[data-theme="dark"] .system-preview,
body[data-theme="dark"] input,
body[data-theme="dark"] textarea,
body[data-theme="dark"] select,
body[data-theme="dark"] #section-settings input,
body[data-theme="dark"] #section-settings textarea,
body[data-theme="dark"] #section-question #supplement-panel textarea,
body[data-theme="dark"] #section-records-filters #records-search,
body[data-theme="dark"] .admin-search input,
body[data-theme="dark"] .admin-filter select {
  background: var(--liquid-field) !important;
  box-shadow: var(--textbox-shadow-dark-eof) !important;
}

body .page-switcher-nav,
body .template-switcher,
body .records-filter-group,
body .delivery-mode-switch,
body .admin-tabs {
  background: rgba(255, 255, 255, 0.36) !important;
  border: 1px solid var(--liquid-pill-border) !important;
  box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.62), 0 10px 28px rgba(31, 48, 59, 0.08) !important;
  backdrop-filter: blur(22px) saturate(1.2) !important;
  -webkit-backdrop-filter: blur(22px) saturate(1.2) !important;
}

body[data-theme="dark"] .page-switcher-nav,
body[data-theme="dark"] .template-switcher,
body[data-theme="dark"] .records-filter-group,
body[data-theme="dark"] .delivery-mode-switch,
body[data-theme="dark"] .admin-tabs {
  background: rgba(255, 255, 255, 0.055) !important;
}

body button:not(:disabled),
body .ghost-button:not(:disabled),
body .mini-button:not(:disabled),
body .session-mini:not(:disabled),
body .template-tab:not(.active):not(:disabled),
body .page-nav-button:not(.active):not(:disabled),
body .records-filter-button:not(.active):not(:disabled),
body .records-mode-button:not(.active):not(:disabled),
body .delivery-mode-button:not(.active):not(:disabled),
body .admin-tab:not(.active):not(:disabled) {
  background: var(--liquid-pill) !important;
  border: 1px solid var(--liquid-pill-border) !important;
  color: var(--liquid-readable) !important;
  -webkit-text-fill-color: var(--liquid-readable) !important;
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.62), 0 8px 20px rgba(35, 50, 60, 0.06) !important;
  backdrop-filter: blur(18px) saturate(1.18) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.18) !important;
}

body .primary-button:not(:disabled),
body .primary-button.accent:not(:disabled),
body .template-tab.active:not(:disabled),
body .page-nav-button.active:not(:disabled),
body .records-filter-button.active:not(:disabled),
body .records-mode-button.active:not(:disabled),
body .delivery-mode-button.active:not(:disabled),
body .admin-tab.active:not(:disabled),
body .mini-button-primary:not(:disabled),
body .session-actions .session-resume:not(:disabled),
body .session-actions .session-pin-toggle:not(:disabled),
body #save-settings:not(:disabled),
body #answer-followup:not(:disabled) {
  background: var(--liquid-active) !important;
  border: 1px solid rgba(255, 255, 255, 0.42) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  box-shadow: var(--liquid-active-shadow) !important;
}

body button:disabled,
body .ghost-button:disabled,
body .mini-button:disabled,
body .session-mini:disabled,
body .template-tab:disabled {
  background: rgba(255, 255, 255, 0.26) !important;
  border: 1px solid rgba(255, 255, 255, 0.36) !important;
  color: rgba(94, 109, 118, 0.48) !important;
  -webkit-text-fill-color: rgba(94, 109, 118, 0.48) !important;
  box-shadow: none !important;
}

body[data-theme="dark"] button:disabled,
body[data-theme="dark"] .ghost-button:disabled,
body[data-theme="dark"] .mini-button:disabled,
body[data-theme="dark"] .session-mini:disabled,
body[data-theme="dark"] .template-tab:disabled {
  background: rgba(255, 255, 255, 0.04) !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
  color: rgba(168, 185, 191, 0.42) !important;
  -webkit-text-fill-color: rgba(168, 185, 191, 0.42) !important;
}

body .history-mode,
body .history-state,
body .session-pin,
body .status-pill,
body .status-pill-save,
body .answer-kicker,
body .admin-score,
body .admin-feedback-state,
body .admin-score-state,
body .admin-continue-state,
body .admin-stop-state,
body .admin-user-metrics span {
  background: var(--liquid-pill) !important;
  border: 1px solid var(--liquid-pill-border) !important;
  color: var(--liquid-muted-readable) !important;
  -webkit-text-fill-color: var(--liquid-muted-readable) !important;
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.58) !important;
  backdrop-filter: blur(14px) saturate(1.16) !important;
  -webkit-backdrop-filter: blur(14px) saturate(1.16) !important;
}

body .field span,
body .supplement-card > span,
body .mode-switcher-title,
body .supplement-panel-title,
body .send-preview-title,
body .session-title,
body .history-question-title,
body .history-block-label,
body .conversation-role,
body .history-conversation-role,
body .panel-head h1,
body .panel-head h2,
body .panel-head h3,
body .feedback-head h3,
body .admin-card h2,
body .admin-insight-group h3,
body .admin-records-head h2,
body .admin-stat strong,
body .admin-health-grid strong,
body .admin-attention-item strong,
body .admin-user-row strong,
body .admin-feedback-grid strong,
body .answer-summary-heading {
  color: var(--liquid-readable) !important;
  -webkit-text-fill-color: var(--liquid-readable) !important;
}

body .eyebrow,
body .micro-copy,
body .title-copy,
body .brand-copy,
body .hero-copy,
body .mode-switcher-hint,
body .mode-switcher-hint *,
body .supplement-panel-copy,
body .send-preview-copy,
body .session-meta,
body .history-answer-preview,
body .history-meta,
body .history-answer,
body .history-note,
body .answer-note,
body .admin-card-note,
body .admin-empty,
body .admin-stat span,
body .admin-stat small,
body .admin-health-grid span,
body .admin-health-grid p,
body .admin-attention-item span,
body .admin-attention-item p,
body .admin-user-row span,
body .admin-user-metrics,
body .admin-insight-group p span,
body .admin-feedback-grid span,
body .admin-feedback-grid p,
body .admin-search,
body .admin-filter,
body .admin-record header span,
body .admin-record time,
body .records-filter-caption,
body .session-context-label {
  color: var(--liquid-muted-readable) !important;
  -webkit-text-fill-color: var(--liquid-muted-readable) !important;
}

body .history-question,
body .history-answer,
body .history-conversation-content,
body .conversation-content,
body .response-output,
body .response-output.rendered,
body .response-output.rendered *,
body .system-preview,
body .admin-record p,
body .session-context-title {
  color: var(--liquid-readable) !important;
  -webkit-text-fill-color: var(--liquid-readable) !important;
}

body .feedback-checkbox,
body .feedback-checkbox input,
body .toggle-row input {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

body .feedback-checkbox input,
body .toggle-row input {
  accent-color: #49735e;
}

body .beta-gate {
  background: rgba(17, 26, 31, 0.38) !important;
  backdrop-filter: blur(28px) saturate(1.2) !important;
  -webkit-backdrop-filter: blur(28px) saturate(1.2) !important;
}

body .beta-error {
  color: #a75353 !important;
  -webkit-text-fill-color: #a75353 !important;
}

/* Liquid Glass explicit class coverage: state/subclasses audited from HTML and JS. */
body .glass,
body .composer,
body .field-question-primary,
body .field-concern-secondary,
body .records-filters-stack,
body .records-filter-block,
body .records-search-field,
body .history-note-surface,
body .admin-card-primary {
  background: var(--liquid-panel-subtle) !important;
  border: 1px solid var(--liquid-edge) !important;
  box-shadow: var(--discern-inner), var(--discern-shadow) !important;
  backdrop-filter: blur(24px) saturate(1.24) !important;
  -webkit-backdrop-filter: blur(24px) saturate(1.24) !important;
}

body .admin-shell,
body .admin-login,
body .admin-card-head,
body .admin-record-titleline,
body .admin-feedback-wide,
body .admin-history-list,
body .composer-actions,
body .field-span-2,
body .mode-switcher-block,
body .supplement-panel-head,
body .supplement-card-wide,
body .records-filter-group-mode,
body .session-context-copy,
body .title-nav {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

body .history-summary {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

body .history-item-session,
body .history-state-pinned,
body .history-state-session,
body .history-state-single {
  border-color: var(--liquid-pill-border) !important;
}

body .history-continue,
body .record-resume-conversation,
body .history-pin,
body .history-pin-session {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

body .history-note-session,
body .history-reuse,
body .history-export,
body .history-export-session,
body .history-copy-question,
body .history-copy-answer,
body .history-delete,
body .record-delete-session,
body .session-switch,
body .session-rename,
body .session-delete {
  color: var(--liquid-readable) !important;
  -webkit-text-fill-color: var(--liquid-readable) !important;
}

body .brand-mark,
body .brand-main,
body .brand-agent {
  color: var(--liquid-readable) !important;
  -webkit-text-fill-color: var(--liquid-readable) !important;
}

body .privacy-note,
body .composer-actions-note,
body .subtle,
body .is-saved {
  color: var(--liquid-muted-readable) !important;
  -webkit-text-fill-color: var(--liquid-muted-readable) !important;
}

body .admin-user-progress {
  background: var(--liquid-pill) !important;
  border: 1px solid var(--liquid-pill-border) !important;
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.58) !important;
}

body .beta-locked .page-shell {
  filter: blur(8px) saturate(0.82);
}

body .toast,
body .toast.visible {
  background: rgba(20, 34, 42, 0.72) !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
  box-shadow: 0 20px 54px rgba(16, 28, 34, 0.26), inset 0 1px 1px rgba(255, 255, 255, 0.16) !important;
  backdrop-filter: blur(24px) saturate(1.25) !important;
  -webkit-backdrop-filter: blur(24px) saturate(1.25) !important;
}

/* Stronger hero/title liquid-glass treatment. */
body .title-banner {
  background:
    linear-gradient(118deg, rgba(255, 255, 255, 0.38) 0%, rgba(255, 255, 255, 0.12) 40%, rgba(134, 196, 213, 0.22) 72%, rgba(255, 255, 255, 0.2) 100%),
    linear-gradient(178deg, rgba(255, 255, 255, 0.34), rgba(255, 255, 255, 0.04) 44%, rgba(78, 138, 160, 0.12)),
    rgba(255, 255, 255, 0.18) !important;
  border: 1px solid rgba(255, 255, 255, 0.72) !important;
  box-shadow:
    0 32px 86px rgba(31, 48, 59, 0.18),
    0 10px 24px rgba(31, 48, 59, 0.07),
    inset 0 1px 1px rgba(255, 255, 255, 0.82),
    inset 0 -1px 2px rgba(95, 145, 164, 0.2) !important;
  backdrop-filter: blur(46px) saturate(1.62) contrast(1.05) !important;
  -webkit-backdrop-filter: blur(46px) saturate(1.62) contrast(1.05) !important;
}

body .title-banner::before {
  opacity: 0.54 !important;
  background:
    linear-gradient(112deg, rgba(255, 255, 255, 0.72) 0%, rgba(255, 255, 255, 0.18) 13%, transparent 28%),
    linear-gradient(286deg, rgba(185, 226, 236, 0.28) 0%, transparent 34%),
    linear-gradient(178deg, rgba(255, 255, 255, 0.3), transparent 36%) !important;
}

body .title-banner::after {
  content: "";
  position: absolute;
  inset: 10px;
  z-index: 0;
  pointer-events: none;
  border-radius: 24px;
  border: 1px solid rgba(255, 255, 255, 0.32);
  background:
    linear-gradient(100deg, transparent 0 18%, rgba(255, 255, 255, 0.16) 22%, transparent 34%),
    linear-gradient(178deg, rgba(255, 255, 255, 0.16), transparent 42%);
  opacity: 0.46;
  mask-image: linear-gradient(90deg, black, rgba(0, 0, 0, 0.55), black);
  -webkit-mask-image: linear-gradient(90deg, black, rgba(0, 0, 0, 0.55), black);
}

body .title-banner .brand-mark {
  text-shadow:
    0 1px 0 rgba(255, 255, 255, 0.85),
    0 16px 34px rgba(39, 58, 68, 0.12) !important;
}

body[data-theme="dark"] .title-banner {
  background:
    linear-gradient(120deg, rgba(255, 255, 255, 0.11) 0%, rgba(255, 255, 255, 0.035) 42%, rgba(88, 152, 174, 0.16) 72%, rgba(255, 255, 255, 0.07) 100%),
    linear-gradient(178deg, rgba(255, 255, 255, 0.08), transparent 42%),
    rgba(18, 28, 34, 0.46) !important;
  border-color: rgba(255, 255, 255, 0.2) !important;
  box-shadow:
    0 34px 90px rgba(0, 0, 0, 0.42),
    inset 0 1px 2px rgba(255, 255, 255, 0.16),
    inset 0 -1px 2px rgba(120, 188, 210, 0.1) !important;
}

/* Restore visible answer-area actions after the global glass audit layer. */
body #section-answer .panel-tools .ghost-button:not(:disabled),
body #section-answer .answer-actions .ghost-button:not(:disabled) {
  background: var(--liquid-active) !important;
  border: 1px solid rgba(255, 255, 255, 0.48) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  box-shadow:
    0 14px 30px rgba(48, 91, 74, 0.24),
    inset 0 1px 1px rgba(255, 255, 255, 0.48) !important;
  backdrop-filter: blur(20px) saturate(1.26) !important;
  -webkit-backdrop-filter: blur(20px) saturate(1.26) !important;
}

body #section-answer .panel-tools .ghost-button:not(:disabled):hover,
body #section-answer .answer-actions .ghost-button:not(:disabled):hover {
  transform: translateY(-1px);
  box-shadow:
    0 18px 36px rgba(48, 91, 74, 0.3),
    inset 0 1px 1px rgba(255, 255, 255, 0.52) !important;
}

body #section-answer .answer-actions .ghost-button:disabled {
  background: rgba(255, 255, 255, 0.42) !important;
  border: 1px solid rgba(255, 255, 255, 0.62) !important;
  color: rgba(67, 88, 96, 0.74) !important;
  -webkit-text-fill-color: rgba(67, 88, 96, 0.74) !important;
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.66) !important;
}

body[data-theme="dark"] #section-answer .answer-actions .ghost-button:disabled {
  background: rgba(255, 255, 255, 0.08) !important;
  border-color: rgba(255, 255, 255, 0.16) !important;
  color: rgba(210, 225, 229, 0.58) !important;
  -webkit-text-fill-color: rgba(210, 225, 229, 0.58) !important;
}

body #toggle-render-mode:not(:disabled),
body #answer-followup:not(:disabled),
body #answer-refine:not(:disabled),
body #answer-favorite:not(:disabled),
body #copy-response:not(:disabled) {
  appearance: none !important;
  opacity: 1 !important;
  background-color: #4b765f !important;
  background-image: linear-gradient(135deg, #5f8b72 0%, #3f6f59 48%, #2f5a63 100%) !important;
  border: 1px solid rgba(255, 255, 255, 0.56) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  box-shadow:
    0 16px 34px rgba(39, 78, 62, 0.32),
    inset 0 1px 1px rgba(255, 255, 255, 0.52),
    inset 0 -1px 1px rgba(24, 58, 68, 0.22) !important;
  filter: none !important;
  mix-blend-mode: normal !important;
  position: relative;
  z-index: 2;
}

body #answer-followup:disabled,
body #answer-refine:disabled,
body #answer-favorite:disabled,
body #copy-response:disabled {
  appearance: none !important;
  opacity: 1 !important;
  background-color: rgba(76, 118, 95, 0.32) !important;
  background-image: linear-gradient(135deg, rgba(95, 139, 114, 0.44), rgba(47, 90, 99, 0.26)) !important;
  border: 1px solid rgba(74, 119, 97, 0.46) !important;
  color: rgba(35, 66, 53, 0.82) !important;
  -webkit-text-fill-color: rgba(35, 66, 53, 0.82) !important;
  box-shadow:
    inset 0 1px 1px rgba(255, 255, 255, 0.64),
    0 8px 18px rgba(48, 91, 74, 0.1) !important;
  filter: none !important;
  mix-blend-mode: normal !important;
}

body[data-theme="dark"] #answer-followup:disabled,
body[data-theme="dark"] #answer-refine:disabled,
body[data-theme="dark"] #answer-favorite:disabled,
body[data-theme="dark"] #copy-response:disabled {
  background: linear-gradient(135deg, rgba(91, 138, 116, 0.16), rgba(62, 119, 132, 0.12)) !important;
  border-color: rgba(139, 184, 162, 0.24) !important;
  color: rgba(205, 226, 216, 0.58) !important;
  -webkit-text-fill-color: rgba(205, 226, 216, 0.58) !important;
}

/* Final UI correction: neutral controls must never become white text on white glass. */
body .title-banner {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.34) 0%, rgba(255, 255, 255, 0.13) 48%, rgba(202, 232, 238, 0.16) 100%),
    linear-gradient(90deg, rgba(255, 255, 255, 0.28) 0%, rgba(220, 244, 247, 0.12) 42%, rgba(132, 195, 209, 0.16) 100%),
    rgba(255, 255, 255, 0.16) !important;
  border-color: rgba(255, 255, 255, 0.7) !important;
}

body .title-banner::before {
  opacity: 0.5 !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0.18) 18%, transparent 52%),
    linear-gradient(90deg, rgba(255, 255, 255, 0.22) 0%, transparent 38%, rgba(154, 208, 219, 0.2) 100%) !important;
}

body .title-banner::after {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.16), transparent 34%),
    linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.12) 52%, transparent 100%) !important;
  opacity: 0.34 !important;
}

body button:not(.primary-button):not(.accent):not(.active):not(.mini-button-primary):not(.session-resume):not(.session-pin-toggle):not(#send-request):not(#save-settings):not(#open-chatgpt):not(#resume-session):not(#answer-followup):not(#toggle-render-mode):not(:disabled),
body .ghost-button:not(.active):not(#answer-followup):not(#toggle-render-mode):not(:disabled),
body .page-nav-button:not(.active):not(:disabled),
body .template-tab:not(.active):not(:disabled),
body .records-filter-button:not(.active):not(:disabled),
body .records-mode-button:not(.active):not(:disabled),
body .delivery-mode-button:not(.active):not(:disabled),
body .admin-tab:not(.active):not(:disabled),
body .mini-button:not(.mini-button-primary):not(:disabled),
body .session-mini:not(.session-resume):not(.session-pin-toggle):not(:disabled) {
  background: rgba(255, 255, 255, 0.46) !important;
  background-image: linear-gradient(180deg, rgba(255, 255, 255, 0.58), rgba(255, 255, 255, 0.28)) !important;
  border: 1px solid rgba(190, 205, 210, 0.72) !important;
  color: #1d2a2e !important;
  -webkit-text-fill-color: #1d2a2e !important;
  text-shadow: none !important;
  box-shadow:
    inset 0 1px 1px rgba(255, 255, 255, 0.72),
    0 8px 18px rgba(28, 45, 54, 0.06) !important;
  opacity: 1 !important;
  filter: none !important;
  mix-blend-mode: normal !important;
}

body button:not(.primary-button):not(.accent):not(.active):not(.mini-button-primary):not(.session-resume):not(.session-pin-toggle):not(#send-request):not(#save-settings):not(#open-chatgpt):not(#resume-session):not(#answer-followup):not(#toggle-render-mode):not(:disabled) *,
body .ghost-button:not(.active):not(#answer-followup):not(#toggle-render-mode):not(:disabled) *,
body .page-nav-button:not(.active):not(:disabled) *,
body .template-tab:not(.active):not(:disabled) *,
body .records-filter-button:not(.active):not(:disabled) *,
body .records-mode-button:not(.active):not(:disabled) *,
body .delivery-mode-button:not(.active):not(:disabled) *,
body .admin-tab:not(.active):not(:disabled) *,
body .mini-button:not(.mini-button-primary):not(:disabled) *,
body .session-mini:not(.session-resume):not(.session-pin-toggle):not(:disabled) * {
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
}

body .primary-button:not(:disabled),
body .primary-button.accent:not(:disabled),
body .page-nav-button.active:not(:disabled),
body .template-tab.active:not(:disabled),
body .records-filter-button.active:not(:disabled),
body .records-mode-button.active:not(:disabled),
body .delivery-mode-button.active:not(:disabled),
body .admin-tab.active:not(:disabled),
body .mini-button-primary:not(:disabled),
body .session-resume:not(:disabled),
body .session-pin-toggle:not(:disabled),
body #send-request:not(:disabled),
body #save-settings:not(:disabled),
body #open-chatgpt:not(:disabled),
body #resume-session:not(:disabled),
body #answer-followup:not(:disabled),
body #toggle-render-mode:not(:disabled) {
  background-color: #4b765f !important;
  background-image: linear-gradient(135deg, #5f8b72 0%, #3f6f59 48%, #2f5a63 100%) !important;
  border: 1px solid rgba(255, 255, 255, 0.52) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  text-shadow: none !important;
  box-shadow:
    0 16px 34px rgba(39, 78, 62, 0.28),
    inset 0 1px 1px rgba(255, 255, 255, 0.48) !important;
  opacity: 1 !important;
  filter: none !important;
  mix-blend-mode: normal !important;
}

body .primary-button:not(:disabled) *,
body .primary-button.accent:not(:disabled) *,
body .page-nav-button.active:not(:disabled) *,
body .template-tab.active:not(:disabled) *,
body .records-filter-button.active:not(:disabled) *,
body .records-mode-button.active:not(:disabled) *,
body .delivery-mode-button.active:not(:disabled) *,
body .admin-tab.active:not(:disabled) *,
body .mini-button-primary:not(:disabled) *,
body .session-resume:not(:disabled) *,
body .session-pin-toggle:not(:disabled) *,
body #send-request:not(:disabled) *,
body #save-settings:not(:disabled) *,
body #open-chatgpt:not(:disabled) *,
body #resume-session:not(:disabled) *,
body #answer-followup:not(:disabled) *,
body #toggle-render-mode:not(:disabled) * {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

body button:disabled,
body .ghost-button:disabled,
body .mini-button:disabled,
body .session-mini:disabled,
body .template-tab:disabled,
body #answer-refine:disabled,
body #answer-favorite:disabled,
body #copy-response:disabled,
body #answer-followup:disabled {
  background: rgba(255, 255, 255, 0.38) !important;
  background-image: linear-gradient(180deg, rgba(255, 255, 255, 0.48), rgba(255, 255, 255, 0.24)) !important;
  border: 1px solid rgba(150, 173, 178, 0.48) !important;
  color: rgba(35, 52, 57, 0.62) !important;
  -webkit-text-fill-color: rgba(35, 52, 57, 0.62) !important;
  text-shadow: none !important;
  opacity: 1 !important;
  filter: none !important;
  mix-blend-mode: normal !important;
}

body button:disabled *,
body .ghost-button:disabled *,
body .mini-button:disabled *,
body .session-mini:disabled *,
body .template-tab:disabled *,
body #answer-refine:disabled *,
body #answer-favorite:disabled *,
body #copy-response:disabled *,
body #answer-followup:disabled * {
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
}

/* Absolute final answer-panel button correction. */
html body section#section-answer #toggle-render-mode.ghost-button:not(:disabled) {
  background: #416f58 !important;
  background-image: linear-gradient(135deg, #628f74 0%, #416f58 52%, #2f5a63 100%) !important;
  border: 1px solid rgba(255, 255, 255, 0.58) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  opacity: 1 !important;
  text-shadow: none !important;
  box-shadow:
    0 16px 32px rgba(39, 78, 62, 0.3),
    inset 0 1px 1px rgba(255, 255, 255, 0.52) !important;
}

html body section#section-answer .answer-actions button.ghost-button:disabled {
  background: rgba(255, 255, 255, 0.5) !important;
  background-image: linear-gradient(180deg, rgba(255, 255, 255, 0.62), rgba(226, 239, 238, 0.34)) !important;
  border: 1px solid rgba(93, 128, 113, 0.38) !important;
  color: rgba(27, 45, 39, 0.78) !important;
  -webkit-text-fill-color: rgba(27, 45, 39, 0.78) !important;
  opacity: 1 !important;
  text-shadow: none !important;
  box-shadow:
    inset 0 1px 1px rgba(255, 255, 255, 0.76),
    0 8px 18px rgba(38, 73, 58, 0.08) !important;
}

html body section#section-answer .answer-actions button.ghost-button:disabled * {
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
}

/* Remove redundant wrapper glass only in answer actions and records search. */
html body section#section-answer .answer-actions {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html body section#section-records-filters .records-filters-stack,
html body section#section-records-filters .records-filter-block,
html body section#section-records-filters .records-filter-group,
html body section#section-records-filters label.records-search-field {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html body section#section-records-filters .records-filters-stack::before,
html body section#section-records-filters .records-filter-block::before,
html body section#section-records-filters .records-filter-group::before,
html body section#section-records-filters label.records-search-field::before,
html body section#section-answer .answer-actions::before {
  display: none !important;
  content: none !important;
}

/* Give only the outer records-search panel a clearer liquid-glass surface. */
html body section#section-records-filters {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.42), rgba(255, 255, 255, 0.17) 58%, rgba(214, 239, 242, 0.2)),
    linear-gradient(90deg, rgba(255, 255, 255, 0.18), rgba(143, 202, 214, 0.12) 100%) !important;
  border: 1px solid rgba(255, 255, 255, 0.74) !important;
  box-shadow:
    0 26px 70px rgba(30, 47, 55, 0.14),
    inset 0 1px 1px rgba(255, 255, 255, 0.82),
    inset 0 -1px 1px rgba(92, 148, 160, 0.12) !important;
  backdrop-filter: blur(34px) saturate(1.38) !important;
  -webkit-backdrop-filter: blur(34px) saturate(1.38) !important;
}

html body section#section-records-filters::before {
  display: block !important;
  content: "" !important;
  position: absolute;
  inset: 1px;
  pointer-events: none;
  border-radius: inherit;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.38), transparent 34%),
    linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.14) 52%, transparent 100%) !important;
  opacity: 0.58 !important;
}

/* Make only the records search input visible inside the glass panel. */
html body section#section-records-filters input#records-search {
  background: rgba(255, 255, 255, 0.58) !important;
  background-image: linear-gradient(180deg, rgba(255, 255, 255, 0.68), rgba(241, 248, 248, 0.42)) !important;
  border: 1px solid rgba(137, 161, 166, 0.42) !important;
  box-shadow:
    inset 0 1px 1px rgba(255, 255, 255, 0.78),
    0 8px 20px rgba(30, 47, 55, 0.07) !important;
}

/* Higher-specificity final correction for the records search input. */
html body section#section-records-filters label.records-search-field input#records-search {
  display: block !important;
  width: 100% !important;
  min-height: 46px !important;
  padding: 0 16px !important;
  border-radius: 14px !important;
  background: rgba(255, 255, 255, 0.72) !important;
  background-image: linear-gradient(180deg, rgba(255, 255, 255, 0.82), rgba(235, 246, 246, 0.56)) !important;
  border: 1px solid rgba(102, 132, 138, 0.5) !important;
  color: #1d2a2e !important;
  -webkit-text-fill-color: #1d2a2e !important;
  box-shadow:
    inset 0 1px 1px rgba(255, 255, 255, 0.82),
    0 10px 24px rgba(30, 47, 55, 0.09) !important;
}

html body section#section-records-filters label.records-search-field input#records-search::placeholder {
  color: rgba(51, 70, 76, 0.46) !important;
  -webkit-text-fill-color: rgba(51, 70, 76, 0.46) !important;
}