/* B1Xagi experience refresh. Loaded after every other workspace stylesheet.
   Scope:
   1 · Header theme button boundary removal
   2 · Execution cards: upper card sticking to activity card + smallest font topology
   3 · Composer dock centered during execution
   4 · Laser print hand runtime & animation styling
   5 · Live audio orb restoration: visible emblem behind button, whole self heartbeat glow & gradient ambiance clouds
   6 · Modernized workspace selector menu & mode switcher
   7 · Bigger version new chat button inside question/answer panel
   8 · Delivered answer fills workspace without protruding buttons; images in text order
*/

:root {
  --b1x-fs-smallest: 11px;
  --b1x-lh-smallest: 1.45;
  --laser-color: var(--b1x-accent, #00d8ef);
}

/* ==========================================================================
   1 · Header theme button: no boundary box in any state
   ========================================================================== */
:root[data-theme] body #shell#shell#shell#shell#shell#shell .topbar #theme-toggle,
:root[data-theme] body #shell#shell#shell#shell#shell#shell .topbar #theme-toggle:hover,
:root[data-theme] body #shell#shell#shell#shell#shell#shell .topbar #theme-toggle:active,
:root[data-theme] body #shell#shell#shell#shell#shell#shell .topbar #theme-toggle:focus,
:root[data-theme] body #shell#shell#shell#shell#shell#shell .topbar #theme-toggle[aria-expanded="true"],
:root[data-theme] body #shell#shell#shell#shell#shell#shell .topbar #theme-toggle.theme-command-trigger {
  border: 0 !important;
  border-radius: 50% !important;
  background: transparent !important;
  box-shadow: none !important;
  outline: 0 !important;
}
:root[data-theme] body #shell#shell#shell#shell#shell#shell .topbar #theme-toggle:hover {
  background: color-mix(in srgb, var(--b1x-accent, #00d8ef) 12%, transparent) !important;
}
:root[data-theme] body #shell#shell#shell#shell#shell#shell .topbar #theme-toggle:focus-visible {
  outline: 2px solid var(--b1x-accent, #00d8ef) !important;
  outline-offset: 3px !important;
}

/* ==========================================================================
   2 · Execution cards: upper card sticks to activity card + smallest font topology
   ========================================================================== */
:root[data-theme] #shell .message.assistant.result-card > header,
:root[data-theme] #shell .message.assistant.result-card > header :is(span, small, strong, b),
:root[data-theme] #shell .message.assistant.result-card :is(.document-phase, .document-phase *, .result-metrics, .result-metrics *, .result-status, .result-expand, .result-expand *),
:root[data-theme] #shell #workspace-execution-feed,
:root[data-theme] #shell #workspace-execution-feed :is(summary, summary *, li, li *, small, .execution-feed-model, .execution-feed-stage-pill, .execution-feed-label, .execution-feed-count, .execution-feed-tag, .execution-feed-row-model, .execution-feed-row-label, .execution-pipeline-num, .execution-pipeline-name) {
  font-size: var(--b1x-fs-smallest) !important;
  line-height: var(--b1x-lh-smallest) !important;
}

/* Stick upper card and activity card seamlessly */
:root[data-theme] #shell #messages > #workspace-execution-feed,
:root[data-theme] #shell .composer-area > #workspace-execution-feed {
  width: 100%;
  max-width: var(--workspace-answer-width, 880px);
  margin: -1px auto 14px !important;
  border-top-left-radius: 0 !important;
  border-top-right-radius: 0 !important;
  border-top: 1px dashed color-mix(in srgb, var(--b1x-border) 45%, transparent) !important;
}

:root[data-theme] #shell #messages > .message.assistant.result-card:has(+ #workspace-execution-feed:not([hidden])) {
  margin-bottom: 0 !important;
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
  border-bottom: 0 !important;
}

/* ==========================================================================
   3 · Composer: Centered during execution & Actives Out when active
   ========================================================================== */
:root[data-theme] body #shell.unified-shell #composer#composer#composer#composer#composer#composer {
  transition: transform .22s cubic-bezier(0.16, 1, 0.3, 1),
              box-shadow .22s cubic-bezier(0.16, 1, 0.3, 1),
              border-color .2s ease,
              background .2s ease !important;
}

/* Active state: composer shows with a clean, calm, thin 1px border */
:root[data-theme] body #shell.unified-shell #composer#composer#composer#composer#composer#composer:is(:focus-within, .is-active, .has-content, .expanded) {
  border: 1px solid var(--b1x-accent, #10b981) !important;
  background: var(--b1x-solid, #1b2220) !important;
  transform: none !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.16) !important;
  outline: none !important;
  z-index: 30 !important;
}

:root[data-theme="light"] body #shell.unified-shell #composer#composer#composer#composer#composer#composer:is(:focus-within, .is-active, .has-content, .expanded) {
  background: #ffffff !important;
  border: 1px solid var(--b1x-accent, #086753) !important;
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.05) !important;
  outline: none !important;
}

/* Send button activates and glows when composer is active */
:root[data-theme] body #shell.unified-shell #composer:is(:focus-within, .has-content, .is-active) .send {
  background: var(--b1x-accent, #00d8ef) !important;
  color: var(--b1x-on-accent, #030a10) !important;
  box-shadow: 0 0 16px color-mix(in srgb, var(--b1x-accent, #00d8ef) 60%, transparent) !important;
  transform: scale(1.03);
  transition: transform .18s ease, box-shadow .18s ease !important;
}

/* Centered & Actives Out during execution — thin 1px border */
:root[data-theme] body #shell.unified-shell #composer#composer#composer#composer#composer#composer:is([data-presence="running"], [data-presence="ready"]) {
  margin-left: auto !important;
  margin-right: auto !important;
  float: none !important;
  transform: none !important;
  border: 1px solid var(--b1x-accent, #10b981) !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.16) !important;
}
:root[data-theme="light"] body #shell.unified-shell #composer#composer#composer#composer#composer#composer:is([data-presence="running"], [data-presence="ready"]) {
  border: 1px solid var(--b1x-accent, #086753) !important;
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.05) !important;
}

/* ==========================================================================
   4 · Laser print head: visible tinny laser hand moving across document
   ========================================================================== */
.laser-print-head {
  position: fixed;
  left: 0;
  top: 0;
  z-index: 10000;
  width: 0;
  height: 0;
  pointer-events: none;
  opacity: 0;
  transition: opacity .18s ease;
  will-change: transform, opacity;
}
.laser-print-head.is-printing {
  opacity: var(--laser-opacity,.65);
  visibility: visible;
  /* The animation loop already eases glow; do not restart a CSS fade each frame. */
  transition: none;
}
.laser-print-head:not(.is-printing){visibility:hidden}
.laser-print-head::before {
  /* tiny laser point */
  content: "";
  position: absolute;
  left: -3px;
  top: -3px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #ffffff;
  box-shadow:
    0 0 6px 2px var(--laser-color, #00d8ef),
    0 0 16px 5px color-mix(in srgb, var(--laser-color, #00d8ef) 60%, transparent);
}
.laser-print-head::after {
  /* lightweight trailing laser hand beam */
  content: "";
  position: absolute;
  left: -0.5px;
  bottom: 3px;
  width: 2px;
  height: 40px;
  background: linear-gradient(180deg, transparent, var(--laser-color, #00d8ef));
  opacity: 1;
  box-shadow:0 0 7px 1px var(--laser-color,#00d8ef);
}
@media (prefers-reduced-motion: reduce) {
  .laser-print-head { display: none; }
}
:root[data-motion="reduced"] .laser-print-head { display: none; }

/* ==========================================================================
   5 · Live audio orb restoration: visible emblem behind button, heartbeat glow, ambiance clouds
   ========================================================================== */
/* Emblem sits visible behind button controls, not hidden under a layer */
.neural-orb-host > img {
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  z-index: 0 !important;
  pointer-events: none !important;
  opacity: .95 !important;
  border-radius: 50% !important;
  filter: hue-rotate(var(--cortex-hue, -35deg)) drop-shadow(0 0 12px color-mix(in srgb, var(--orb-ink, var(--b1x-accent, #64dcc0)) 65%, transparent)) !important;
  animation: cortex-heartbeat-glow 2.2s ease-in-out infinite !important;
}

.neural-orb-host > .neural-orb {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  background: transparent !important;
  pointer-events: none !important;
}

/* Whole self heartbeat glow & gradient ambiance clouds */
.neural-orb::before {
  content: "";
  position: absolute;
  inset: -28%;
  border-radius: 50%;
  background: radial-gradient(circle at center,
    color-mix(in srgb, var(--orb-ink, currentColor) 48%, transparent) 0%,
    color-mix(in srgb, var(--orb-ink, currentColor) 22%, transparent) 42%,
    transparent 74%);
  filter: blur(10px);
  opacity: .85;
  pointer-events: none;
  z-index: -1;
  animation: orb-cloud-breathe 2.4s ease-in-out infinite;
}

.neural-orb .orb-cloud {
  inset: 12% !important;
  border-radius: 50% !important;
  background: radial-gradient(ellipse at 35% 35%, color-mix(in srgb, currentColor 55%, transparent), transparent 68%) !important;
  filter: blur(4px) !important;
  opacity: .75 !important;
  animation: orb-cloud-drift var(--orb-cloud-cycle, 10s) ease-in-out infinite !important;
}

.neural-orb .orb-smoke {
  inset: 8% !important;
  border-radius: 50% !important;
  opacity: .45 !important;
  background: conic-gradient(from 40deg, transparent 0deg, currentColor 55deg, transparent 115deg, currentColor 180deg, transparent 240deg, currentColor 295deg, transparent 360deg) !important;
  filter: blur(5px) !important;
  mix-blend-mode: screen !important;
  animation: orb-smoke-drift 6s linear infinite !important;
}

@media (prefers-reduced-motion: reduce) {
  .neural-orb-host > img,
  .neural-orb::before,
  .neural-orb .orb-cloud,
  .neural-orb .orb-smoke {
    animation: none !important;
  }
}

/* ==========================================================================
   6 · Modernized workspace selector menu
   ========================================================================== */
.workspace-project-picker,
.topbar .breadcrumb,
#workspace-mode:not(.workspace-mode-select-sync),
.workspace-mode-trigger {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 4px 10px !important;
  border-radius: 999px !important;
  background: color-mix(in srgb, var(--b1x-control, #162422) 80%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--b1x-border, #2d4542) 70%, transparent) !important;
  backdrop-filter: blur(8px) !important;
  font: 500 12px/1 var(--sans, system-ui) !important;
  color: var(--b1x-text, #e4f9f2) !important;
  transition: all .16s ease !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.12) !important;
}
.workspace-project-picker:hover,
#workspace-mode:not(.workspace-mode-select-sync):hover,
.workspace-mode-trigger:hover {
  background: color-mix(in srgb, var(--b1x-control, #162422) 95%, transparent) !important;
  border-color: var(--b1x-accent, #00d8ef) !important;
  box-shadow: 0 0 8px color-mix(in srgb, var(--b1x-accent, #00d8ef) 30%, transparent) !important;
}

/* ==========================================================================
   7 · Bigger version chat button within question/answer panel
   ========================================================================== */
.workspace-subbar {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
}
.subbar-actions {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin-left: auto !important;
}
.panel-new-chat-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  padding: 5px 12px !important;
  border-radius: 999px !important;
  border: 1px solid color-mix(in srgb, var(--b1x-accent, #00d8ef) 35%, transparent) !important;
  background: color-mix(in srgb, var(--b1x-accent, #00d8ef) 14%, var(--b1x-control, #12211f)) !important;
  color: var(--b1x-text, #e4f9f2) !important;
  font: 600 11px/1.2 var(--sans, system-ui) !important;
  cursor: pointer !important;
  transition: all .18s cubic-bezier(0.16, 1, 0.3, 1) !important;
  box-shadow: 0 2px 8px color-mix(in srgb, var(--b1x-accent, #00d8ef) 18%, transparent) !important;
}
.panel-new-chat-btn:hover {
  background: color-mix(in srgb, var(--b1x-accent, #00d8ef) 24%, var(--b1x-control, #12211f)) !important;
  border-color: var(--b1x-accent, #00d8ef) !important;
  box-shadow: 0 0 12px color-mix(in srgb, var(--b1x-accent, #00d8ef) 40%, transparent) !important;
  transform: translateY(-1px) !important;
}
.panel-new-chat-kbd {
  font-size: 9px !important;
  padding: 2px 4px !important;
  border-radius: 4px !important;
  background: rgba(0,0,0,0.3) !important;
  color: var(--b1x-muted, #7ea59c) !important;
  border: 1px solid rgba(255,255,255,0.1) !important;
}

/* ==========================================================================
   8 · Delivered answer fills workspace without protruding buttons; images in text order
   ========================================================================== */
/* Answer fills workspace properly */
:root[data-theme] #shell .message.assistant.result-card[data-document-state="refined"],
:root[data-theme] #shell .message.assistant.result-card {
  width: 100% !important;
  max-width: var(--workspace-answer-width, 880px) !important;
  box-sizing: border-box !important;
}

/* All workspace buttons must NOT protrude horizontally while keeping popovers unclipped */
:root[data-theme] #shell .message.assistant.result-card {
  contain: layout !important;
  overflow-x: clip !important;
  overflow-y: visible !important;
}
:root[data-theme] #shell .reading-surface,
:root[data-theme] #shell .active-inquiry-bar {
  contain: layout !important;
  overflow: hidden !important;
}

:root[data-theme] #shell :is(.document-options-panel, .inquiry-actions, .response-toolbar, .result-metrics, .message-actions, .document-actions) {
  max-width: 100% !important;
  box-sizing: border-box !important;
  margin-right: 0 !important;
  right: 0 !important;
  contain: layout !important;
}

/* Images flow in natural markdown text order */
.b1x-inline-image-card {
  display: block !important;
  clear: both !important;
  margin: 16px 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}
.b1x-inline-image-wrap img {
  display: block !important;
  max-width: 100% !important;
  height: auto !important;
  border-radius: 8px !important;
}



/* Compact execution controls: one quiet surface with clear keyboard focus. */
:root[data-theme] body #shell.unified-shell #composer#composer#composer#composer#composer#composer:is([data-presence="running"],[data-presence="ready"]) {
  border:1px solid var(--b1x-border,#dfe5e7)!important;
  box-shadow:0 3px 14px rgb(0 0 0 / 8%)!important;
  background:var(--b1x-solid,#fff)!important;
  transform:none!important;
}
:root[data-theme] body #shell.unified-shell #composer#composer#composer#composer#composer#composer:is([data-presence="running"],[data-presence="ready"])::before {display:none!important}
:root[data-theme] body #shell.unified-shell #composer#composer#composer#composer#composer#composer:is([data-presence="running"],[data-presence="ready"]) :is(.composer-presence-toggle,#stop) {
  border:0!important;box-shadow:none!important;outline:none;
  background:transparent!important;border-radius:12px!important;
  min-height:40px!important;
}
:root[data-theme] body #shell.unified-shell #composer#composer#composer#composer#composer#composer[data-presence="running"] #stop {
  width:40px!important;height:40px!important;min-width:40px!important;
  background:color-mix(in srgb,var(--b1x-accent) 9%,var(--b1x-solid))!important;
}
:root[data-theme] body #shell.unified-shell #composer#composer#composer#composer#composer#composer :is(.composer-presence-toggle,#stop):focus-visible {
  outline:2px solid var(--b1x-accent)!important;outline-offset:2px!important;
}
:root[data-theme] #shell .message.assistant.result-card .result-expand {
  border:0!important;box-shadow:none!important;border-radius:8px;
  background:var(--b1x-control)!important;
}

:root[data-theme] #shell .message.assistant.result-card .document-phase {
  display:inline-flex!important;flex-wrap:wrap;gap:6px 8px;
  max-width:100%;box-sizing:border-box;padding:6px 10px!important;
  border:0!important;border-radius:10px!important;box-shadow:none!important;
  background:var(--b1x-control)!important;
}
:root[data-theme] #shell .message.assistant.result-card .document-phase-model {
  border:0!important;box-shadow:none!important;background:transparent!important;padding:0!important;
}

/* Smallest workspace typography, with geometry sized to match the labels. */
#account-visible-balance{display:inline-flex!important;visibility:visible!important;opacity:1!important;flex:0 0 auto;white-space:nowrap;font-family:inherit;font-variant-numeric:tabular-nums}
.has-laser-space{margin-top:64px!important}
.ledger-head .ledger-info{display:none!important}
.result-status-unified .result-status {display:none!important}
.document-phase[hidden] {display:none!important}
.result-status-unified .result-metrics {border:1px solid var(--b1x-border,#dfe5e7);border-radius:12px;background:var(--b1x-solid,transparent);margin:10px 0;overflow:hidden}
.result-status-unified .result-meta-toggle {padding:10px 12px;font-size:12px;min-height:40px;gap:8px}
.result-status-unified .result-detail-body {font-size:12px;line-height:1.6;padding:12px;border-top:1px solid var(--b1x-border,#dfe5e7)}
.laser-print-head[data-stage=recovering] {--laser-color:#ad8755}
.asset-icon {display:inline-block;flex:none;width:18px;height:18px;vertical-align:-3px;margin-inline-end:7px;pointer-events:none}
.artifact-header h3 .asset-icon,.answer-attachment .asset-icon {color:var(--b1x-accent,currentColor)}
.document-options>summary .asset-icon {width:16px;height:16px;vertical-align:-3px;margin-inline-end:5px}
.message-body .answer-embedded-asset {
  margin:18px 0;max-width:100%;min-width:0;padding:12px;
  border:1px solid var(--b1x-border,#dfe5e7);border-radius:14px;
  background:var(--b1x-solid,transparent);box-shadow:none;
}
.message-body .answer-embedded-asset .artifact-header {padding:0 0 10px;gap:8px}
.message-body .answer-embedded-asset .artifact-header h3 {font-size:14px;font-weight:600}
.message-body .answer-embedded-asset .artifact-content {border:0;background:transparent}
.message-body .answer-embedded-asset .artifact-image-viewport {max-height:none;background:transparent;overflow:visible}
.message-body img.answer-image-open {display:block;max-width:100%;max-height:65dvh;width:auto!important;height:auto;object-fit:contain;margin:0 auto;border-radius:10px;cursor:zoom-in!important}
.message-body img.answer-image-open:focus-visible {outline:2px solid var(--b1x-accent,#7054b0);outline-offset:4px}
.message-body .answer-embedded-asset .artifact-table-scroll {max-height:420px;overflow:auto;overscroll-behavior:contain}
.message-body .answer-embedded-asset :is(th,td) {padding:8px 12px;font-size:12px;line-height:1.45}
.message-body .answer-embedded-asset tbody tr:nth-child(even) {background:color-mix(in srgb,var(--b1x-text,#203b42) 3%,transparent)}
.message-body .answer-embedded-asset .artifact-code-tabs [aria-selected=true] {background:color-mix(in srgb,var(--b1x-accent,#7054b0) 12%,transparent);font-weight:600}
@media(max-width:600px){
 .message-body .answer-embedded-asset {padding:8px;margin:12px 0;border-radius:10px}
 .message-body .answer-embedded-asset .artifact-code-tabs {padding:6px 0}
 .message-body .answer-embedded-asset .artifact-table-scroll {max-height:50dvh}
}
:root[data-theme] #shell#shell#shell .message-body .text-diagram-svg text {
  font:12px/1.4 var(--font-code,Consolas,monospace)!important;
}
:root[data-theme] #shell .b1x-diagram-frame svg:not(.text-diagram-svg) :is(text,.nodeLabel,.edgeLabel) {
  font-size:12px!important;
}
/* Keep KaTeX's mathematical fonts and metrics intact: ordinary interface
   fonts distort fractions, radicals and aligned operators. */
.document-math[data-math-display=true]{
  box-sizing:border-box;max-width:100%;margin:14px 0;padding:16px 18px;
  overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;
  border:1px solid color-mix(in srgb,var(--b1x-accent,#3d715b) 15%,transparent);
  border-radius:12px;background:color-mix(in srgb,var(--b1x-accent,#3d715b) 3%,var(--b1x-solid,#fff));
  color:var(--b1x-text,inherit);
}
.document-math[data-math-display=true] .katex-display{margin:0;padding:3px 0;text-align:center}
.document-math .katex{font-size:1.08em;text-rendering:optimizeLegibility}
.document-math[data-math-display=false]{padding-inline:.08em}
.math-source-fallback{font-family:var(--font-code,Consolas,monospace);font-size:.9em;line-height:1.6}
@media(max-width:600px){.document-math[data-math-display=true]{padding:12px;margin:10px 0;border-radius:9px}}
@media print{.document-math[data-math-display=true]{background:transparent;border-color:#dce3df;overflow:visible}}

/* ==========================================================================
   9 · Pillar 1: A4 12px Normal Margin Contract, Question Title Dominance,
       Code Word-Wrap, High-DPI Media & Mobile Calm Light Fullscreen
   ========================================================================== */
:root[data-theme] body #shell#shell#shell#shell#shell#shell #workspace-view {
  width: 100% !important;
  max-width: min(var(--doc-a4-width, 210mm), 100%) !important;
  margin-inline: auto !important;
  padding: 12px !important;
  padding-right: 12px !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
}

:root[data-theme] body #shell#shell#shell#shell#shell#shell #thread {
  overflow-y: auto !important;
  overflow-x: hidden !important;
  overscroll-behavior-y: contain !important;
  -webkit-overflow-scrolling: touch !important;
  touch-action: pan-y !important;
  overflow-anchor: none !important;
}

:root[data-theme] body #shell#shell#shell#shell#shell#shell :is(
  .message.assistant.result-card,
  .qa-bundle,
  .qa-answer-tree
) {
  width: 100% !important;
  max-width: min(var(--doc-a4-width, 210mm), 100%) !important;
  margin-inline: auto !important;
  padding: 12px !important;
  padding-right: 12px !important;
  box-sizing: border-box !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow-x: clip !important;
  overflow-y: visible !important;
  overscroll-behavior: auto !important;
}

:root[data-theme] body #shell#shell#shell#shell#shell#shell .arena-card.result-card {
  width: 100% !important;
  max-width: min(var(--doc-a4-width, 210mm), 100%) !important;
  margin-inline: auto !important;
  padding: 12px !important;
  padding-right: 12px !important;
  box-sizing: border-box !important;
  overflow-x: clip !important;
}

:root[data-theme] body #shell#shell#shell#shell#shell#shell :is(
  .message-answer-window,
  .message.assistant .message-body,
  .result-card .message-body
) {
  width: 100% !important;
  max-width: 100% !important;
  padding: 12px !important;
  padding-right: 12px !important;
  box-sizing: border-box !important;
  flex: none !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow-x: clip !important;
  overflow-y: visible !important;
  overscroll-behavior: auto !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}

:root[data-theme] body #shell#shell#shell#shell#shell#shell :is(
  .arena-answer-window,
  .arena-card-body
) {
  width: 100% !important;
  max-width: 100% !important;
  padding: 12px !important;
  padding-right: 12px !important;
  box-sizing: border-box !important;
  overflow-x: clip !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}

/* Guarantee no child element inside an answer ever surpasses the 12px A4 margin */
:root[data-theme] body #shell#shell#shell#shell#shell#shell .message-body * {
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* Question Title Dominance: Higher heading than any heading in the answer body */
:root[data-theme] body #shell#shell#shell#shell#shell#shell :is(
  .qa-question-title,
  .qa-question-title :is(strong, b, span),
  .arena-question-text,
  #arena-inquiry-text
) {
  font-size: var(--doc-question-title-size, 18px) !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
  letter-spacing: -0.01em !important;
  color: var(--b1x-text) !important;
}

/* Subordinate Answer Headings & Prominent Answer Body */
:root[data-theme] body #shell#shell#shell#shell#shell#shell .message-body h1 {
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}
:root[data-theme] body #shell#shell#shell#shell#shell#shell .message-body h2 {
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}
:root[data-theme] body #shell#shell#shell#shell#shell#shell .message-body :is(h3, h4, h5, h6) {
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}

@media (max-width: 700px) {
  :root[data-theme] body #shell#shell#shell#shell#shell#shell :is(
    .qa-question-title,
    .qa-question-title :is(strong, b, span),
    .arena-question-text,
    #arena-inquiry-text
  ) {
    font-size: var(--doc-question-title-size-mobile, 16px) !important;
  }
  :root[data-theme] body #shell#shell#shell#shell#shell#shell .message-body h1 {
    font-size: 14.5px !important;
  }
  :root[data-theme] body #shell#shell#shell#shell#shell#shell .message-body h2 {
    font-size: 13.5px !important;
  }
  :root[data-theme] body #shell#shell#shell#shell#shell#shell .message-body :is(h3, h4, h5, h6) {
    font-size: 12.5px !important;
  }
}

/* Code Word-Wrap inside 12px A4 Margin */
:root[data-theme] body #shell#shell#shell#shell#shell#shell .message-body :is(
  pre,
  code,
  .code-ide-card,
  .code-ide-body,
  .code-line,
  .code-line-code,
  .code-line-code span
) {
  white-space: pre-wrap !important;
  word-break: break-word !important;
  overflow-wrap: anywhere !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

:root[data-theme] body #shell#shell#shell#shell#shell#shell .message-body .code-line {
  display: flex !important;
  align-items: flex-start !important;
  width: 100% !important;
}
:root[data-theme] body #shell#shell#shell#shell#shell#shell .message-body .code-line-num {
  flex: 0 0 auto !important;
  white-space: nowrap !important;
}
:root[data-theme] body #shell#shell#shell#shell#shell#shell .message-body .code-line-code {
  flex: 1 1 0% !important;
  min-width: 0 !important;
}

/* High-DPI Precision for Charts, Graphs, Diagrams, Pictures, Formulas, Icons & Tables */
:root[data-theme] body #shell#shell#shell#shell#shell#shell :is(
  .b1x-diagram-frame svg,
  .text-diagram-svg,
  .icon-2d,
  .b1x-ui-icon,
  .asset-icon
) {
  shape-rendering: geometricPrecision !important;
  text-rendering: geometricPrecision !important;
}

:root[data-theme] body #shell#shell#shell#shell#shell#shell :is(
  .b1x-inline-image,
  .b1x-inline-image-wrap img,
  .answer-embedded-asset img
) {
  max-width: 100% !important;
  height: auto !important;
  image-rendering: -webkit-optimize-contrast;
}

:root[data-theme] body #shell#shell#shell#shell#shell#shell .message-body :is(.ledger-card, .ledger-table-wrap) {
  width: 100% !important;
  max-width: 100% !important;
  padding: 8px 12px !important;
  box-sizing: border-box !important;
  overflow-x: auto !important;
}

:root[data-theme] body #shell#shell#shell#shell#shell#shell .message-body table {
  width: 100% !important;
  max-width: 100% !important;
  table-layout: auto !important;
  border-collapse: collapse !important;
  box-sizing: border-box !important;
}

:root[data-theme] body #shell#shell#shell#shell#shell#shell .message-body :is(th, td) {
  border: 1px solid color-mix(in srgb, var(--b1x-border, #87978f) 55%, transparent) !important;
  padding: 6px 8px !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}

/* Mobile Browser Fullscreen Mode & Calm Light Exit Control */
:root[data-mobile-fullscreen="true"] body,
:root[data-mobile-fullscreen="true"] #shell {
  min-height: 100dvh !important;
  height: 100dvh !important;
  width: 100vw !important;
  max-width: 100vw !important;
  margin: 0 !important;
}

:root[data-mobile-fullscreen="true"] #shell #main {
  padding-left: env(safe-area-inset-left, 0px) !important;
  padding-right: env(safe-area-inset-right, 0px) !important;
  padding-bottom: env(safe-area-inset-bottom, 0px) !important;
}

#b1x-calm-fullscreen-toggle {
  position: fixed;
  top: calc(env(safe-area-inset-top, 0px) + 54px);
  right: 12px;
  z-index: 9500;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 28px;
  padding: 4px 10px;
  border-radius: 999px;
  font: 500 11px/1.2 var(--sans, system-ui, sans-serif);
  background: rgba(244, 246, 244, 0.78);
  color: #1f2d2a;
  border: 1px solid rgba(120, 145, 138, 0.32);
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  cursor: pointer;
  transition: opacity 0.25s ease, transform 0.18s ease, background 0.2s ease;
  opacity: 0.78;
  user-select: none;
  touch-action: manipulation;
}
:root[data-theme="dark"] #b1x-calm-fullscreen-toggle {
  background: rgba(26, 36, 34, 0.72);
  color: #dcebe6;
  border-color: rgba(110, 155, 142, 0.28);
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.28);
}
#b1x-calm-fullscreen-toggle.is-calm-idle {
  opacity: 0.36;
}
#b1x-calm-fullscreen-toggle:hover,
#b1x-calm-fullscreen-toggle:focus-visible,
#b1x-calm-fullscreen-toggle:active {
  opacity: 0.96 !important;
  transform: translateY(-1px);
  outline: none;
}
#b1x-calm-fullscreen-toggle svg {
  width: 12px;
  height: 12px;
  flex: 0 0 12px;
}
#b1x-calm-fullscreen-toggle[hidden] {
  display: none !important;
}
:root[data-flutter-app="true"] #b1x-calm-fullscreen-toggle {
  display: none !important;
}
