:root {
  --xd-overview-width: 1120px;
  --xd-overview-height: 714px;
  --xd-overview-scale: 1;
}
.xd-preview-frame { position: relative; min-width: 0; }
.xd-overview-controls[hidden], .xd-preview-open[hidden] { display: none; }
.xd-overview-controls { display: flex; justify-content: space-between; align-items: center; gap: var(--xd-size-8); margin-bottom: var(--xd-size-10); }
.xd-overview-controls > span { color: var(--xd-muted); font-size: var(--xd-size-11); }
.xd-overview-controls > div { display: flex; gap: var(--xd-size-4); }
.xd-overview-controls button { min-height: var(--xd-size-36); min-width: var(--xd-size-48); padding: var(--xd-size-6) var(--xd-size-10); border: var(--xd-size-1) solid var(--xd-border); border-radius: var(--xd-size-6); background: var(--xd-raised); color: var(--xd-muted); cursor: pointer; }
.xd-overview-controls button[aria-pressed="true"] { color: var(--xd-text); border-color: var(--xd-accent); }
.xd-preview-open { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; border-radius: var(--xd-size-14); background: transparent; cursor: zoom-in; }
.xd-preview-open:hover { background: var(--wt-surface-soft); }
.xd-overview .xd-preview-frame { height: calc(var(--xd-overview-height) * var(--xd-overview-scale)); overflow: hidden; border-radius: var(--xd-size-8); }
.xd-overview .xd-window { width: var(--xd-overview-width); transform: scale(var(--xd-overview-scale)); transform-origin: left top; --xd-browser-width: 340px; --xc-sidebar-width: 15rem; --xc-panel-pad: 1.25rem; }
.xd-overview .xd-titlebar { grid-template-columns: 1fr auto 1fr; min-height: var(--xd-size-44); padding-inline: var(--xd-size-14); }
.xd-overview .xd-traffic { display: flex; }
.xd-overview .xd-brand { font-size: var(--xd-size-13); }
.xd-overview .xd-tabs { justify-self: center; }
.xd-overview .xd-tabs button { min-height: 0; min-width: var(--xd-size-58); padding: var(--xd-size-5) var(--xd-size-8); }
.xd-overview .xd-window-status { display: inline; }
.xd-overview .xd-shell { height: var(--xd-size-640); grid-template-columns: var(--xd-size-192) minmax(0, 1fr); }
.xd-overview .xd-shell[data-mode="agent"], .xd-overview .xd-shell[data-mode="chat"] { grid-template-columns: var(--xc-sidebar-width) minmax(0, 1fr); }
.xd-overview .xd-sidebar { display: flex; }
.xd-overview .xd-mobile-panes, .xd-overview .xd-mobile-select { display: none; }
.xd-overview .xd-workspace { display: grid; grid-template-columns: minmax(0, 1fr) var(--xd-browser-width); padding: var(--xd-space); }
.xd-overview .xd-code-workspace > .xd-terminal-area, .xd-overview .xd-code-workspace > .xd-panel-select { display: flex; height: auto; }
.xd-overview .xd-terminals { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(2, minmax(0, 1fr)); height: auto; }
.xd-overview .xd-terminal { display: flex; height: auto; }
.xd-overview .xd-terminal[data-session="senpi"] { grid-row: span 2; }
.xd-overview .xd-pane-head small { display: inline; }
.xd-overview .xd-session-tabs { flex-wrap: nowrap; min-height: var(--xd-size-39); }
.xd-overview .xd-session-tabs button { min-height: var(--xd-size-28); font-size: var(--xd-size-10); }
.xd-overview .xd-preview { min-height: 0; padding: var(--xd-size-18) var(--xd-size-20) var(--xd-size-12); }
.xd-overview .xd-preview h3 { font-size: var(--xd-size-28); }
.xd-overview .xd-preview-visual { height: var(--xd-size-147); }
.xd-overview .xd-preview-nav { margin-bottom: var(--xd-size-27); }
.xd-overview .xd-preview-cta, .xd-overview .xd-browser-tab, .xd-overview .xd-panel-tabs button, .xd-overview .xd-reload { min-height: var(--xd-size-30); }
.xd-overview .xd-status { min-height: var(--xd-size-28); font-size: var(--xd-size-9); }
.xd-overview .xd-status span:last-child { display: inline; }
.xd-overview .xc-conversation-head { min-height: var(--xd-size-58); padding: var(--xd-size-10) var(--xd-size-16); }
.xd-overview .xc-conversation-head strong > span { display: inline; }
.xd-overview .xc-chat-head > span { display: block; flex-basis: auto; order: 0; }
.xd-overview .xc-transcript { padding: var(--xc-panel-pad); }
.xd-overview .xc-user-message, .xd-overview .xc-answer { font-size: var(--xc-body-size); }
.xd-overview .xc-composer textarea { min-height: var(--xd-size-48); font-size: var(--xc-body-size); }
.xd-overview .xc-composer-toolbar select { font-size: var(--xd-size-10); }
.xp-demo { max-width: var(--xd-overview-width); }
@media (max-width: 1100px) {
  .x-showcase { min-height: 0; }
  [data-x-demo]:not([data-x-demo-ready]) { min-height: 24rem; }
}
