/* Workspace chrome, content and operational details have separate tokens. */
:root[data-theme=dark] {
  --b1x-bg:#0b121b;--b1x-bg-image:none;--b1x-solid:#111c28;--b1x-solid-strong:#182330;--b1x-solid-weak:#13202c;
  --b1x-text:#e7edf3;--b1x-muted:#b2becb;--b1x-accent:#5ee0e6;--b1x-focus:#5ee0e6;
  --b1x-border:rgba(255, 255, 255, 0.08);--b1x-border-subtle:rgba(255, 255, 255, 0.04);--b1x-control:#182330;--b1x-glass:#111c28;--b1x-glass-strong:#182330;
  --b1x-shadow:none;--b1x-primary-shadow:none;--b1x-sheen:transparent;--b1x-edge:transparent;--b1x-selection:#203e49;
}
:root[data-theme=light] {
  --b1x-bg:#e9edef;--b1x-bg-image:none;--b1x-solid:#f2f4f3;--b1x-solid-strong:#fbfaf7;--b1x-solid-weak:#eef1ef;
  --b1x-text:#222d36;--b1x-muted:#52616c;--b1x-accent:#00676b;--b1x-focus:#00676b;
  --b1x-border:rgba(0, 0, 0, 0.08);--b1x-border-subtle:rgba(0, 0, 0, 0.04);--b1x-control:#f7f8f5;--b1x-glass:#f2f4f3;--b1x-glass-strong:#fbfaf7;
  --b1x-shadow:none;--b1x-primary-shadow:none;--b1x-sheen:transparent;--b1x-edge:transparent;--b1x-selection:#d9eded;
}
:root {--reading-bg:#182330;--reading-text:#e7edf3;--reading-muted:#b2becb;--reading-border:rgba(255, 255, 255, 0.08);--reading-accent:#5ee0e6;--reading-control:#223342;--reading-scheme:dark;--reading-measure:76ch}
:root[data-theme=light]:not([data-reading=dark]),:root[data-reading=light] {
  --reading-bg:#fbfaf7;--reading-text:#222d36;--reading-muted:#52616c;--reading-border:rgba(0, 0, 0, 0.08);--reading-accent:#00676b;--reading-control:#eef1ed;--reading-scheme:light;
}
.liquid-scene {opacity:.08;pointer-events:none}
#shell.unified-shell {--workspace-secondary:var(--muted)}
:root[data-theme] :is(.reading-surface,.result-card,.message.user,.research-notebook-content,.research-notebook-theme,#richard-response,.live-transcript-body,.arena-question-text) {
  --text:var(--reading-text);--muted:var(--reading-muted);--cyan:var(--reading-accent);--line:var(--reading-border);--raised:var(--reading-control);--panel:var(--reading-bg);--bg:var(--reading-bg);
  background:var(--reading-bg);color:var(--reading-text);color-scheme:var(--reading-scheme);text-shadow:none;box-shadow:none;
}
:root[data-theme] .result-card :is(.message-body,.arena-card-body,.message-answer-window,.arena-answer-window) {background:transparent;color:var(--reading-text);box-shadow:none}
:root[data-theme] :is(.reading-prose,.side-transcript pre,.task-step pre,.task-run>details>pre,.tool-result,.plugin-results pre,.memory-card-content,.legacy-answer-content) {background:var(--reading-bg);color:var(--reading-text);color-scheme:var(--reading-scheme);border-color:var(--reading-border);text-shadow:none}

/* Response / Answers card directly at the forefront with frosted glass depth and luxurious elevation */
:root[data-theme] .message.assistant.result-card,
:root[data-theme] .arena-card.result-card,
:root[data-theme] #messages .message.assistant {
  position: relative !important;
  z-index: 10 !important;
  height: auto;
  min-height: 0;
  max-height: none;
  overflow: visible;
  border-radius: 18px !important;
  padding: 0 !important;
  background: rgba(12, 21, 38, 0.88) !important;
  backdrop-filter: blur(28px) saturate(160%) !important;
  -webkit-backdrop-filter: blur(28px) saturate(160%) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  box-shadow: 0 24px 64px -12px rgba(0, 0, 0, 0.75), 0 4px 16px rgba(0, 0, 0, 0.35), 0 0 0 1px rgba(255, 255, 255, 0.04) !important;
  margin-block: 18px !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
:root[data-theme=light] .message.assistant.result-card,
:root[data-theme=light] .arena-card.result-card,
:root[data-theme=light] #messages .message.assistant {
  background: rgba(255, 255, 255, 0.94) !important;
  backdrop-filter: blur(28px) saturate(160%) !important;
  -webkit-backdrop-filter: blur(28px) saturate(160%) !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  box-shadow: 0 20px 48px -10px rgba(18, 42, 66, 0.15), 0 2px 10px rgba(18, 42, 66, 0.06), 0 0 0 1px rgba(0, 0, 0, 0.03) !important;
}
:root[data-theme] .result-card :is(.message-answer-window,.arena-answer-window) {flex:none;height:auto;max-height:none;overflow:visible;padding:clamp(20px,3vw,40px) clamp(20px,4vw,64px)}
:root[data-theme] .result-card .message-body {font-size:1rem;line-height:1.5;max-width:var(--reading-measure);margin-inline:auto;width:100%;min-width:0;overflow-wrap:anywhere}
:root[data-theme] .result-card .message-body :is(h1,h2,h3,h4) {color:var(--reading-text);line-height:1.3;letter-spacing:-.02em;margin:1.4em 0 .65em}
:root[data-theme] .result-card .message-body a {color:var(--reading-accent);text-decoration:underline;text-underline-offset:3px}
:root[data-theme] .result-card .message-body :is(pre,code,blockquote) {color:var(--reading-text);border-color:var(--reading-border)}
:root[data-theme] .result-card .message-body pre {background:var(--reading-control);border-radius:10px;padding:14px}
:root[data-theme] .result-card .message-body :is(img,video,canvas,svg) {filter:none}

/* Sleek borderless markdown tables with soft hairlines & container isolation */
:root[data-theme] .result-card .message-body table,
:root[data-theme] .message.assistant .message-body table,
:root[data-theme] .message-body table {
  display: table !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  width: 100% !important;
  margin: 1.1em 0 !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  border-radius: 8px !important;
  overflow: hidden !important;
  background: rgba(255, 255, 255, 0.02) !important;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.15) !important;
}
:root[data-theme] .result-card .message-body th,
:root[data-theme] .message.assistant .message-body th,
:root[data-theme] .message-body th {
  background: rgba(255, 255, 255, 0.08) !important;
  color: #f3f7f5 !important;
  font-weight: 700 !important;
  text-align: left !important;
  padding: 6px 10px !important;
  border: none !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12) !important;
  font-size: 11.5px !important;
  letter-spacing: 0.02em !important;
}
:root[data-theme] .result-card .message-body td,
:root[data-theme] .message.assistant .message-body td,
:root[data-theme] .message-body td {
  padding: 6px 10px !important;
  border: none !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
  font-size: 11.5px !important;
  line-height: 1.45 !important;
  color: #e4eee9 !important;
}
:root[data-theme] .result-card .message-body tr:last-child td,
:root[data-theme] .message.assistant .message-body tr:last-child td,
:root[data-theme] .message-body tr:last-child td {
  border-bottom: none !important;
}
:root[data-theme] .result-card .message-body tr:hover td,
:root[data-theme] .message.assistant .message-body tr:hover td,
:root[data-theme] .message-body tr:hover td {
  background: rgba(255, 255, 255, 0.04) !important;
}

/* Light mode table overrides with high contrast and balanced spacing */
:root[data-theme=light] .result-card .message-body table,
:root[data-theme=light] .message.assistant .message-body table,
:root[data-theme=light] .message-body table {
  border: 1px solid #c9d8d1 !important;
  background: #ffffff !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04) !important;
}
:root[data-theme=light] .result-card .message-body th,
:root[data-theme=light] .message.assistant .message-body th,
:root[data-theme=light] .message-body th {
  background: #eef4f1 !important;
  color: #0c1813 !important;
  font-weight: 700 !important;
  border-bottom: 1px solid #c9d8d1 !important;
  font-size: 11.5px !important;
}
:root[data-theme=light] .result-card .message-body td,
:root[data-theme=light] .message.assistant .message-body td,
:root[data-theme=light] .message-body td {
  border-bottom: 1px solid #e1ebe6 !important;
  color: #122019 !important;
  font-size: 11.5px !important;
}
:root[data-theme=light] .result-card .message-body tr:hover td,
:root[data-theme=light] .message.assistant .message-body tr:hover td,
:root[data-theme=light] .message-body tr:hover td {
  background: #f7faf9 !important;
}

:root[data-theme] .result-card > header {padding:14px 22px;border-bottom:1px solid rgba(255, 255, 255, 0.06);background:rgba(255, 255, 255, 0.02);color:var(--reading-muted);border-radius:18px 18px 0 0}
:root[data-theme=light] .result-card > header {border-bottom:1px solid rgba(0, 0, 0, 0.06);background:rgba(0, 0, 0, 0.02)}
.result-card .result-metrics {padding:0;border:0;font-size:12px;color:var(--reading-muted);background:transparent}
.result-metrics>details>summary {cursor:pointer;padding:8px 22px;min-height:36px;border-bottom:1px solid rgba(255, 255, 255, 0.05);background:rgba(255, 255, 255, 0.015)}
:root[data-theme=light] .result-metrics>details>summary {border-bottom:1px solid rgba(0, 0, 0, 0.05);background:rgba(0, 0, 0, 0.015)}
.result-detail-body {padding:12px 22px;max-height:260px;overflow:auto;border-bottom:1px solid rgba(255, 255, 255, 0.05);line-height:1.65;background:rgba(0, 0, 0, 0.15)}
:root[data-theme=light] .result-detail-body {border-bottom:1px solid rgba(0, 0, 0, 0.05);background:rgba(0, 0, 0, 0.02)}
.result-status {font-size:12px;color:var(--reading-muted);margin-inline-start:auto}
.result-status[data-state=failed],.result-status[data-state=partial],.result-status[data-state=cancelled] {font-weight:600}
:root[data-theme] .result-card .response-actions-toolbar {display:flex;align-items:center;gap:4px;flex-wrap:wrap;padding:8px 16px;border-top:1px solid rgba(255, 255, 255, 0.06)!important;background:rgba(255, 255, 255, 0.02);border-radius:0 0 18px 18px}
:root[data-theme=light] .result-card .response-actions-toolbar {border-top:1px solid rgba(0, 0, 0, 0.06)!important;background:rgba(0, 0, 0, 0.02)}
:root[data-theme] .result-card :is(.response-btn,.result-expand,.arena-focus-answer) {min-height:36px;color:var(--reading-text);background:transparent;box-shadow:none;border:1px solid transparent;font-size:12px;padding:6px 9px;border-radius:6px}
:root[data-theme] .result-card button:hover {background:var(--reading-control);border-color:var(--reading-border)}
.reading-mode-control {display:inline-flex;gap:8px;align-items:center;font-size:12px;color:var(--muted)}
.reading-mode-control select {max-width:150px;min-height:36px;background:var(--raised);border:1px solid var(--line);border-radius:6px;padding:6px 8px;color:var(--text)}
.content-expansion {width:min(1200px,calc(100vw - 40px));height:calc(100dvh - 40px);max-width:none;max-height:none;padding:0;border:1px solid var(--line);border-radius:14px;background:var(--bg);color:var(--text);overflow:hidden}
.content-expansion::backdrop {background:#030910b8}
.content-expansion[open] {display:flex;flex-direction:column}
.content-expansion>header {display:flex;align-items:center;justify-content:space-between;flex-shrink:0;padding:12px 18px;gap:12px;border-bottom:1px solid var(--line)}
.content-expansion>header button {min-height:40px}
.content-expansion-body {flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;padding:clamp(24px,5vw,96px)}
:root[data-theme] .content-expansion .result-card.surface-expanded {width:100%;height:100%;min-height:0;overflow:hidden;display:flex;flex-direction:column;margin:0}
:root[data-theme] .content-expansion .result-card.surface-expanded :is(.message-answer-window,.arena-answer-window) {flex:1 1 0;min-height:80px;overflow:auto;overscroll-behavior:contain}
.content-expansion .result-expand,.content-expansion .arena-focus-answer {display:none!important}
:is(.reading-surface,.result-card,.content-expansion) :focus-visible {outline:2px solid var(--reading-accent,var(--cyan));outline-offset:3px}
.arena-sync-label {display:inline-flex;align-items:center;gap:7px;font-size:12px;min-height:36px}
.arena-sync-label input {accent-color:var(--cyan);width:17px;height:17px}
.arena-card.result-card {border-radius:12px!important}
#arena-view .arena-card-head {padding:12px 14px;grid-template-columns:minmax(0,1fr) auto;min-height:78px;align-items:center}
#arena-view .arena-card-title {min-height:32px;display:flex;align-items:center}
#arena-view .arena-card-telemetry {display:none}
#arena-view .result-status {grid-row:2;grid-column:1/-1;margin:0}
#arena-view .result-metrics {padding:0;font-size:12px}
#arena-view .result-metrics summary {padding:8px 16px}
#arena-view .response-actions-toolbar {padding:8px;flex-wrap:wrap;overflow:visible;gap:3px}
@media(max-width:700px) {
  .content-expansion {width:100vw;height:100dvh;border-radius:0;border:0;margin:0}
  .content-expansion-body {padding:8px}.arena-sync-label {display:none}
  :root[data-theme] .result-card .message-body {font-size:15px;line-height:1.7}
  .reading-mode-control>span {display:none}
}
@media(pointer:coarse) {:root[data-theme] :is(.result-card,.content-expansion,.reading-mode-control) :is(button,summary,select) {min-height:44px}}
@media(forced-colors:active) {:root {--reading-bg:Canvas;--reading-text:CanvasText;--reading-muted:CanvasText;--reading-border:ButtonText;--reading-accent:LinkText;--reading-control:Canvas}}

/* --- Distinct outstanding answer surface --------------------------------- */
:root[data-theme] .result-card :is(.message-answer-window,.arena-answer-window) {
  background: linear-gradient(180deg, rgba(94,224,230,.05), rgba(94,224,230,.015) 46%, rgba(124,58,237,.045)) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 14px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 2px 16px rgba(0,0,0,.2) !important;
  margin: 10px clamp(12px,2.4vw,26px) 16px;
}
:root[data-theme=light] .result-card :is(.message-answer-window,.arena-answer-window) {
  background: linear-gradient(180deg, rgba(0,103,107,.055), rgba(0,103,107,.015) 46%, rgba(0,103,107,.03)) !important;
  border: 1px solid rgba(0,0,0,.07) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.65), 0 1px 10px rgba(18,42,66,.05) !important;
}

/* --- macOS-style window motion: entry, expand, dismiss --------------------- */
@keyframes result-card-enter {
  from { opacity: 0; transform: translateY(14px) scale(.985); }
  to { opacity: 1; transform: none; }
}
:root[data-theme] :is(.message.user,.message.assistant.result-card,.arena-card.result-card) {
  animation: result-card-enter .34s cubic-bezier(.22,.9,.3,1.15);
}
:root[data-theme] :is(.message.assistant.result-card,.arena-card.result-card) {
  transition: transform .28s cubic-bezier(.22,.9,.3,1), box-shadow .28s ease, border-color .25s ease, height .35s cubic-bezier(.22,.9,.3,1);
}
.content-expansion {
  opacity: 0;
  transform: scale(.965) translateY(12px);
  transition: opacity .24s ease, transform .26s cubic-bezier(.22,.9,.3,1.1), display .26s allow-discrete, overlay .26s allow-discrete;
}
.content-expansion[open] { opacity: 1; transform: none; }
@starting-style { .content-expansion[open] { opacity: 0; transform: scale(.965) translateY(12px); } }
/* Browsers without discrete transition support must never leave the dialog invisible. */
@supports not (transition-behavior: allow-discrete) {
  .content-expansion { opacity: 1; transform: none; transition: none; }
}

/* --- Processing runs at the forefront of the workspace -------------------- */
/* #messages carries an ID-scoped elevation rule, so the running card needs a
   matching ID-scoped override to actually stay above it. */
:root[data-theme] .result-card:has(.result-metrics[data-state="active"]),
:root[data-theme] #messages .message.assistant.result-card:has(.result-metrics[data-state="active"]) {
  z-index: 30 !important;
  border-color: rgba(94,224,230,.45) !important;
}
:root[data-theme=light] .result-card:has(.result-metrics[data-state="active"]),
:root[data-theme=light] #messages .message.assistant.result-card:has(.result-metrics[data-state="active"]) {
  border-color: rgba(0,103,107,.5) !important;
}
:root[data-theme] .result-card:has(.result-metrics[data-state="active"]) :is(.message-answer-window,.arena-answer-window) {
  border-color: rgba(94,224,230,.3) !important;
}
:root[data-theme=light] .result-card:has(.result-metrics[data-state="active"]) :is(.message-answer-window,.arena-answer-window) {
  border-color: rgba(0,103,107,.3) !important;
}
/* The pulse lives on an overlay so it is not pinned down by the card's own
   !important box-shadow declarations. */
:root[data-theme] .result-card:has(.result-metrics[data-state="active"])::after {
  content: '';
  position: absolute;
  inset: -2px;
  border-radius: 20px;
  pointer-events: none;
  animation: result-processing-breathe 2.2s ease-in-out infinite;
}
@keyframes result-processing-breathe {
  0%,100% { opacity: .55; box-shadow: 0 0 0 1px rgba(94,224,230,.2), 0 0 24px rgba(94,224,230,.1); }
  50% { opacity: 1; box-shadow: 0 0 0 1px rgba(94,224,230,.45), 0 0 46px rgba(94,224,230,.24); }
}

@media (prefers-reduced-motion: reduce) {
  :root[data-theme] :is(.message.user,.message.assistant.result-card,.arena-card.result-card,.content-expansion) { animation: none !important; transition: none !important; }
}