/* Projects only. Native viewport reservations remain owned by platform_insets. */
html body #app-container #documents-container.docs-provider-mcp {
  --project-line: color-mix(in srgb, var(--chat-text) 10%, transparent);
  --project-selected: color-mix(in srgb, var(--chat-text) 7%, var(--chat-sidebar));
  --project-menu-shadow: 0 12px 40px #00000018, 0 2px 6px #00000008;
  font-family: var(--chat-font);
  letter-spacing: 0;
}
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-shell--ide {
  margin-inline: 0;
  width: 100%;
  max-width: none;
  border: 0;
}
html body #app-container #documents-container.docs-provider-mcp :is(.docs-mcp-explorer, .docs-mcp-chat-panel--codex) {
  border: 0 !important;
  border-radius: 0;
}
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-explorer-resizer::before {
  width: 1px;
  background: var(--project-line);
}
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-workspace-topbar {
  padding-inline: 20px;
  min-height: 52px;
  gap: 10px;
  border: 0;
}
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-workspace-context small { display: none; }
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-workspace-context strong {
  font-size: 15px;
  line-height: 24px;
  font-weight: 600;
}
html body #app-container #documents-container.docs-provider-mcp :is(.docs-mcp-workspace-explorer, .docs-mcp-workspace-close) {
  border-radius: 8px;
  color: var(--chat-muted) !important;
}

/* One compact navigation rail, with no inset frame or repeated section headings. */
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-explorer__head {
  min-height: 52px;
  padding: 8px 14px;
}
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-explorer__head > strong { font-size: 14px; }
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-explorer__path {
  margin: 4px 14px 12px;
  padding: 4px 0;
}
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-explorer__path-copy small { display: none; }
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-explorer__path-copy strong { font-weight: 500; }
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-explorer-tabs {
  background: transparent !important;
  padding: 0;
  margin: 0 12px 14px;
  gap: 4px;
}
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-explorer-tabs button {
  height: 34px;
  min-height: 34px;
  color: var(--chat-muted);
  font-weight: 500;
  background: transparent !important;
  box-shadow: none !important;
}
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-explorer-tabs button.is-active {
  background: var(--project-selected) !important;
  color: var(--chat-text);
}
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-explorer-chats__head {
  display: block;
  padding: 0 2px 12px;
}
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-explorer-chats__head > strong { display: none; }
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-explorer-chats__head .docs-mcp-new-task {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  width: 100%;
  min-height: 40px;
  padding: 8px 10px;
  border: 1px solid var(--project-line) !important;
  border-radius: 8px;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--chat-text);
  font: 500 13px/20px var(--chat-font);
}
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-new-task svg { width: 17px; height: 17px; flex-shrink: 0; }
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-explorer-chat {
  min-height: 38px;
  border-radius: 7px;
}
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-explorer-chat.is-active { background: var(--project-selected) !important; }
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-explorer-chat__main { min-height: 38px; }
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-explorer-chat__main strong { font-size: 13px; }
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-explorer-chat.is-active .docs-mcp-explorer-chat__main strong { font-weight: 500; }
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-explorer :is(button, summary):hover:not(:disabled) { background-color: var(--chat-hover) !important; }

/* Conversation and composer share one reading column. */
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-messages {
  width: 100% !important;
  max-width: none !important;
  margin-inline: 0 !important;
  --chat-message-size: 15px;
  --chat-message-leading: 1.65;
  padding-inline: max(20px, calc((100% - 760px) / 2));
  padding-top: 22px;
  padding-bottom: 24px;
  gap: 28px;
  border: 0 !important;
  scrollbar-color: var(--project-line) transparent;
}
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-message--user { padding: 10px 16px; }
html body #app-container #documents-container.docs-provider-mcp :is(.docs-codex-answer, .docs-codex-result) :is(h2, h3) {
  font-size: 18px;
  line-height: 1.4;
  font-weight: 600;
}
html body #app-container #documents-container.docs-provider-mcp .docs-codex-work__heading { font-weight: 400; font-size: 13px; }
html body #app-container #documents-container.docs-provider-mcp .docs-codex-progress__header { font-size: 12px; }
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-markdown-code {
  border: 1px solid var(--project-line) !important;
  background: color-mix(in srgb, var(--chat-raised) 65%, var(--chat-surface)) !important;
  border-radius: 8px;
  font-size: 13px;
  line-height: 1.65;
}
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-chat-panel--codex .docs-mcp-composer {
  flex-shrink: 0;
  width: min(calc(100% - 40px), 760px) !important;
  max-width: none !important;
  margin-inline: auto !important;
  padding: 8px 10px !important;
  border: 1px solid var(--project-line) !important;
  border-radius: 18px !important;
  background: var(--chat-raised) !important;
  transition: border-color 140ms ease;
}
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-composer:focus-within { border-color: color-mix(in srgb, var(--chat-text) 25%, transparent) !important; }
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-composer-footer {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto 34px auto 34px;
  align-items: end;
  gap: 4px;
}
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-composer textarea {
  grid-row: 1;
  grid-column: 1 / -1;
  min-height: 34px;
  padding: 5px 6px !important;
  font-size: 16px !important;
}
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-composer textarea::placeholder { font: inherit !important; color: var(--chat-muted) !important; opacity: 1; }
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-composer-footer > :not(textarea) { grid-row: 2; }
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-attach-btn { grid-column: 1; }
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-composer .docs-model-picker { grid-column: 2; justify-self: start; max-width: 100%; }
html body #app-container #documents-container.docs-provider-mcp .docs-access-picker { grid-column: 3; }
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-settings-btn { grid-column: 4; }
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-stop-btn { grid-column: 5; }
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-send-btn { grid-column: 6; }
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-composer :is(.docs-mcp-attach-btn, .docs-mcp-settings-btn, .docs-mcp-send-btn, .docs-mcp-stop-btn) {
  width: 34px; height: 34px; min-width: 34px; min-height: 34px; padding: 8px;
}
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-composer :is(.docs-model-picker, .docs-access-picker) > summary {
  min-height: 34px;
  padding: 5px 7px;
  gap: 5px;
  font: 500 13px/20px var(--chat-font);
  color: var(--chat-muted);
}
html body #app-container #documents-container.docs-provider-mcp [data-mcp-model-name] { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html body #app-container #documents-container.docs-provider-mcp :is(.docs-model-menu, .docs-access-menu) {
  width: var(--project-menu-width, 328px);
  max-width: none;
  max-height: min(500px, var(--project-menu-height, 55dvh));
  border: 1px solid var(--project-line);
  border-radius: 12px;
  background: var(--chat-surface);
  box-shadow: var(--project-menu-shadow);
  scrollbar-width: thin;
}
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-composer :is(.docs-model-menu, .docs-access-menu) {
  top: auto;
  bottom: calc(100% + var(--project-menu-gap, 12px));
  right: auto;
  left: var(--project-menu-shift, 0px);
}
html body #app-container #documents-container.docs-provider-mcp .docs-access-picker { position: relative; }
html body #app-container #documents-container.docs-provider-mcp .docs-access-picker > summary {
  display: flex; align-items: center; list-style: none; cursor: pointer; border-radius: 7px; white-space: nowrap;
}
html body #app-container #documents-container.docs-provider-mcp .docs-access-picker > summary::-webkit-details-marker { display: none; }
html body #app-container #documents-container.docs-provider-mcp .docs-access-picker > summary:hover { background: var(--chat-hover); }
html body #app-container #documents-container.docs-provider-mcp .docs-access-picker[open] .docs-model-chevron { transform: rotate(180deg); }
html body #app-container #documents-container.docs-provider-mcp .docs-access-menu { position: absolute; z-index: 80; padding: 8px; overflow-y: auto; }
html body #app-container #documents-container.docs-provider-mcp :is(.docs-access-option, .docs-access-settings) {
  display: flex; align-items: center; gap: 10px; width: 100%; min-height: 40px; padding: 9px 10px;
  border: 0; border-radius: 7px; background: transparent; color: var(--chat-text); text-align: left; font: 400 13px/20px var(--chat-font);
}
html body #app-container #documents-container.docs-provider-mcp .docs-access-option { justify-content: space-between; }
html body #app-container #documents-container.docs-provider-mcp :is(.docs-access-option, .docs-access-settings):hover:not(:disabled) { background: var(--chat-raised); }
html body #app-container #documents-container.docs-provider-mcp .docs-access-option[aria-pressed="true"] { background: var(--chat-raised); }
html body #app-container #documents-container.docs-provider-mcp .docs-access-option:disabled { opacity: .45; cursor: not-allowed; }
html body #app-container #documents-container.docs-provider-mcp .docs-access-settings { margin-top: 8px; }
html body #app-container #documents-container.docs-provider-mcp .docs-access-settings svg { width: 16px; height: 16px; }
html body #app-container #documents-container.docs-provider-mcp :is(.docs-access-picker, .docs-model-picker) > summary:focus-visible { outline: 2px solid var(--chat-focus); outline-offset: 2px; }
html body #app-container #documents-container.docs-provider-mcp .docs-model-menu button.docs-model-option { min-height: 56px; padding: 9px 10px; }
html body #app-container #documents-container.docs-provider-mcp .docs-model-menu .docs-model-option[aria-pressed="true"] { background: var(--chat-raised) !important; }
html body #app-container #documents-container.docs-provider-mcp .docs-model-menu__settings { border-top-color: var(--project-line); gap: 10px; }
html body #app-container #documents-container.docs-provider-mcp .docs-model-menu .docs-model-field { display: grid; grid-template-columns: minmax(0, 1fr) minmax(110px, 45%); align-items: center; gap: 12px; font-size: 12px; font-weight: 400; }
html body #app-container #documents-container.docs-provider-mcp .docs-codex-input-modes {
  padding: 0 0 8px;
  gap: 4px;
  border: 0;
  background: transparent;
}
html body #app-container #documents-container.docs-provider-mcp .docs-codex-input-modes button {
  min-height: 30px;
  border: 0;
  border-radius: 6px;
  font: 400 12px/18px var(--chat-font);
  background: transparent;
  color: var(--chat-muted);
  box-shadow: none;
}
html body #app-container #documents-container.docs-provider-mcp .docs-codex-input-modes button.is-active { color: var(--chat-text); background: var(--chat-hover); }
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-welcome__eyebrow { display: none; }
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-welcome h2 { font-size: 26px; font-weight: 600; letter-spacing: 0; }
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-welcome__examples { gap: 6px; }
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-welcome__examples button {
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px;
  box-shadow: none !important;
  color: var(--chat-muted) !important;
  font: 400 13px/1.5 var(--chat-font);
  text-align: left;
  padding: 12px;
}
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-welcome__examples button:hover { background: var(--chat-raised) !important; color: var(--chat-text) !important; }
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-welcome__subscription {
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  padding: 8px 0;
  margin-bottom: 20px;
  border: 0 !important;
}
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-welcome__subscription .docs-subscription-heading { gap: 2px; }
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-welcome__subscription .docs-subscription-heading strong { font-size: 13px; font-weight: 500; color: var(--chat-muted); }
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-welcome__subscription .docs-subscription-heading > span { font-size: 12px; }
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-welcome__subscription .docs-subscription-cta {
  width: auto; min-height: 32px; padding: 5px 8px; justify-self: end;
  border: 0 !important; background: transparent !important; color: var(--chat-muted) !important;
  font: 400 13px/20px var(--chat-font); filter: none;
}
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-welcome__subscription .docs-subscription-cta:hover { background: var(--chat-raised) !important; color: var(--chat-text) !important; filter: none; }
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-welcome__subscription .docs-subscription-cta :is(svg, .docs-codex-upgrade-btn__icon) { display: none; }

/* Body-mounted settings keep their existing safe-area/scroll container. */
html body .docs-mcp-composer-settings-modal__card { border: 1px solid var(--chat-line); border-radius: 12px; box-shadow: 0 20px 70px #00000030 !important; }
html body .docs-mcp-composer-settings-modal__head { padding-bottom: 16px; border: 0; }
html body .docs-mcp-composer-settings-modal .docs-model-settings-fields { gap: 0; }
html body .docs-mcp-composer-settings-modal .docs-model-field {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(130px, 48%);
  align-items: center;
  gap: 16px;
  padding: 12px 0;
  border-bottom: 1px solid color-mix(in srgb, var(--chat-text) 8%, transparent);
  font-weight: 400;
}
html body .docs-mcp-composer-settings-modal .docs-model-field:last-child { border-bottom: 0; }
html body .docs-mcp-composer-settings-modal .docs-model-field select { font-size: 13px; font-weight: 400; min-height: 36px; border-radius: 7px; }
html body .docs-mcp-composer-settings-modal .docs-folder-modal__actions { border: 0; padding-top: 16px; }
html body .docs-mcp-composer-settings-modal .docs-folder-modal__btn { border-radius: 8px; min-height: 38px; font-size: 13px; font-weight: 500; }

html body #app-container #documents-container.docs-provider-mcp .docs-settings-simple :is(button, select, input, label, summary, strong, h3) { font-family: var(--chat-font); letter-spacing: 0; }
html body #app-container #documents-container.docs-provider-mcp .docs-settings-simple .docs-mcp-settings-tabs { background: transparent !important; padding: 0 0 12px; }
html body #app-container #documents-container.docs-provider-mcp .docs-settings-simple .docs-mcp-settings-tabs button { flex: 0 1 auto; min-width: 100px; font-size: 13px; }
html body #app-container #documents-container.docs-provider-mcp .docs-settings-simple .docs-mcp-settings-tabs button.is-active { background: var(--chat-raised) !important; }
html body #app-container #documents-container.docs-provider-mcp .docs-settings-simple .docs-model-settings-fields { gap: 0; }
html body #app-container #documents-container.docs-provider-mcp .docs-settings-simple .docs-model-field {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(160px, 48%); align-items: center;
  gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--project-line); font-size: 14px; font-weight: 400;
}
html body #app-container #documents-container.docs-provider-mcp .docs-settings-simple .docs-model-field:last-child { border-bottom: 0; }
html body #app-container #documents-container.docs-provider-mcp .docs-settings-simple .docs-model-field select { font-size: 13px; font-weight: 400; }
html body #app-container #documents-container.docs-provider-mcp .docs-settings-simple .docs-settings-project-title { display: none; }
html body #app-container #documents-container.docs-provider-mcp .docs-settings-simple .docs-project-settings-group__head strong { font-size: 14px; font-weight: 500; }
html body #app-container #documents-container.docs-provider-mcp .docs-settings-simple .docs-mcp-field > span { font-weight: 400; font-size: 13px; }
html body #app-container #documents-container.docs-provider-mcp .docs-settings-simple :is(.docs-settings-link, .docs-settings-billing) { border: 0; }
html body #app-container #documents-container.docs-provider-mcp .docs-settings-simple .docs-settings-link { width: 100%; padding: 12px 8px; border-radius: 7px; font-weight: 400; }
html body #app-container #documents-container.docs-provider-mcp .docs-settings-simple .docs-settings-link:hover { background: var(--chat-raised); }
html body #app-container #documents-container.docs-provider-mcp .docs-settings-simple .docs-settings-billing { padding-block: 4px; }
html body #app-container #documents-container.docs-provider-mcp .docs-settings-simple .docs-settings-billing > summary { padding: 12px 8px; font-weight: 400; }
html body #app-container #documents-container.docs-provider-mcp .docs-settings-simple .docs-cloud-custom-form { border-color: var(--project-line) !important; background: transparent !important; box-shadow: none !important; border-radius: 8px; }
html body #app-container #documents-container.docs-provider-mcp .docs-settings-simple .docs-cloud-custom-form > summary { color: var(--chat-text) !important; background: transparent !important; }
html body #app-container #documents-container.docs-provider-mcp .docs-settings-simple .docs-cloud-custom-summary__icon { color: var(--chat-muted); border-color: var(--project-line); background: transparent; }
html body #app-container #documents-container.docs-provider-mcp .docs-settings-simple .docs-cloud-custom-summary__copy strong { font-weight: 500; font-size: 14px; }

@media (max-width: 768px) {
  html body #app-container #documents-container.docs-provider-mcp .docs-mcp-workspace-topbar { padding-inline: 12px; }
  html body #app-container #documents-container.docs-provider-mcp .docs-mcp-messages { padding-inline: 16px; }
  html body #app-container #documents-container.docs-provider-mcp .docs-mcp-chat-panel--codex .docs-mcp-composer { width: calc(100% - 20px) !important; }
}
@media (max-width: 380px) {
  html body #app-container #documents-container.docs-provider-mcp .docs-settings-simple .docs-model-field { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  html body .docs-mcp-composer-settings-modal .docs-model-field { grid-template-columns: minmax(0, 1fr); gap: 6px; }
  html body #app-container #documents-container.docs-provider-mcp .docs-mcp-composer .docs-model-picker > summary { font-size: 12px; padding-inline: 3px; }
  html body #app-container #documents-container.docs-provider-mcp .docs-mcp-composer-footer { grid-template-columns: 30px minmax(0, 1fr) auto 0 auto 30px; gap: 2px; }
  html body #app-container #documents-container.docs-provider-mcp .docs-mcp-composer .docs-mcp-settings-btn { display: none; }
  html body #app-container #documents-container.docs-provider-mcp .docs-mcp-composer :is(.docs-mcp-attach-btn, .docs-mcp-send-btn, .docs-mcp-stop-btn) { width: 30px; min-width: 30px; }
}
@media (prefers-reduced-motion: reduce) {
  html body #app-container #documents-container.docs-provider-mcp .docs-mcp-composer { transition: none; }
}