/* Subscription contents only; do not change application/host viewport geometry. */
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-welcome__subscription {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 18px 16px;
  width: 100%;
  margin: 0 0 18px;
  padding: 16px 0;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid var(--chat-line) !important;
  border-radius: 0;
  text-align: left;
}
html body #app-container #documents-container.docs-provider-mcp .docs-subscription-heading { display: grid; gap: 4px; min-width: 0; }
html body #app-container #documents-container.docs-provider-mcp .docs-subscription-heading strong { font-size: 16px; font-weight: 600; line-height: 1.4; color: var(--chat-text); }
html body #app-container #documents-container.docs-provider-mcp .docs-subscription-heading > span { font-size: 12px; line-height: 1.5; color: var(--chat-muted); }
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-welcome__subscription > .docs-codex-limit { grid-column: 1 / -1; }
html body #app-container #documents-container.docs-provider-mcp .docs-mcp-welcome__subscription > .docs-subscription-cta { grid-column: auto; justify-self: stretch; }

html body #app-container #documents-container.docs-provider-mcp .docs-subscription-cta,
html body #app-container #documents-container.docs-provider-mcp .docs-codex-subscription__actions > button:not(.is-danger) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 40px;
  padding: 9px 14px;
  border: 1px solid var(--chat-action) !important;
  border-radius: 8px;
  background: var(--chat-action) !important;
  background-image: none !important;
  color: var(--chat-on-action) !important;
  box-shadow: none !important;
  text-shadow: none !important;
  font: 600 13px/1.4 var(--chat-font);
  letter-spacing: 0;
  white-space: normal;
  cursor: pointer;
  transform: none !important;
}
html body #app-container #documents-container.docs-provider-mcp .docs-subscription-cta::before,
html body #app-container #documents-container.docs-provider-mcp .docs-subscription-cta::after { display: none !important; }
html body #app-container #documents-container.docs-provider-mcp .docs-subscription-cta span { color: inherit !important; font: inherit; }
html body #app-container #documents-container.docs-provider-mcp .docs-subscription-cta .docs-codex-upgrade-btn__icon { border: 0; background: transparent; width: 16px; height: 16px; padding: 0; }
html body #app-container #documents-container.docs-provider-mcp .docs-subscription-cta svg { flex: 0 0 16px; width: 16px; height: 16px; color: inherit; }
html body #app-container #documents-container.docs-provider-mcp .docs-subscription-cta:hover { filter: brightness(1.12); }
html body #app-container #documents-container.docs-provider-mcp .docs-subscription-cta:disabled { opacity: .55; cursor: wait; }
html body #app-container #documents-container.docs-provider-mcp .docs-subscription-cta:focus-visible { outline: 2px solid var(--chat-focus); outline-offset: 3px; }

html body #app-container #documents-container.docs-provider-mcp .docs-codex-limit {
  --limit-fill: #148568;
  display: grid;
  gap: 8px;
  width: 100%;
  min-width: 0;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  text-align: left;
}
html.app-theme-dark body #app-container #documents-container.docs-provider-mcp .docs-codex-limit,
html.dark body #app-container #documents-container.docs-provider-mcp .docs-codex-limit { --limit-fill: #60bba0; }
html body #app-container #documents-container.docs-provider-mcp .docs-codex-limit.is-low { --limit-fill: #c17a26; }
html body #app-container #documents-container.docs-provider-mcp .docs-codex-limit__head { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 6px 16px; }
html body #app-container #documents-container.docs-provider-mcp .docs-codex-limit__head > span { font-size: 13px; font-weight: 500; color: var(--chat-text); line-height: 1.5; }
html body #app-container #documents-container.docs-provider-mcp .docs-codex-limit__head strong { color: var(--chat-text); font-size: 18px; line-height: 1.3; font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
html body #app-container #documents-container.docs-provider-mcp .docs-codex-limit__head strong small { color: var(--chat-muted); font-size: 12px; font-weight: 400; }
html body #app-container #documents-container.docs-provider-mcp .docs-codex-limit__bar { width: 100%; height: 6px; border-radius: 3px; background: var(--chat-line); overflow: hidden; }
html body #app-container #documents-container.docs-provider-mcp .docs-codex-limit__bar span { display: block; height: 100%; background: var(--limit-fill) !important; border-radius: inherit; }
html body #app-container #documents-container.docs-provider-mcp .docs-codex-limit > small { font-size: 12px; line-height: 1.5; font-weight: 400; color: var(--chat-muted); }
html body #app-container #documents-container.docs-provider-mcp .docs-codex-limit-list { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; padding: 16px 0 0; }
html body #app-container #documents-container.docs-provider-mcp .docs-codex-subscription { background: transparent; box-shadow: none; border: 0; padding: 12px 0; }

html body dialog.docs-subscription-modal,
html body .docs-folder-modal.docs-subscription-confirm {
  --subscription-top: max(16px, calc(var(--tg-safe-area-inset-top, 0px) + var(--tg-content-safe-area-inset-top, 0px) + 12px), env(safe-area-inset-top, 0px));
  --subscription-bottom: max(16px, calc(var(--tg-safe-bottom, 0px) + 12px), env(safe-area-inset-bottom, 0px));
}
html body dialog.docs-subscription-modal {
  position: fixed;
  inset: var(--subscription-top) 0 var(--subscription-bottom);
  width: min(860px, calc(100% - 32px));
  max-width: none;
  height: fit-content;
  max-height: calc(100dvh - var(--subscription-top) - var(--subscription-bottom));
  margin: auto;
  padding: 24px;
  border: 1px solid var(--chat-line);
  border-radius: 8px;
  background: var(--chat-surface);
  color: var(--chat-text);
  box-shadow: 0 20px 70px #0003;
  font: 14px/1.5 var(--chat-font);
  letter-spacing: 0;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
}
.docs-subscription-modal::backdrop { background: #0008; }
.docs-subscription-modal .docs-subscription-modal__head { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; margin-bottom: 24px; }
.docs-subscription-modal h2 { margin: 0; font-size: 22px; font-weight: 600; line-height: 1.4; }
.docs-subscription-modal p { margin: 6px 0 0; color: var(--chat-muted); font-size: 13px; }
.docs-subscription-modal [data-plans-close] { display: grid; place-items: center; flex: 0 0 36px; width: 36px; height: 36px; padding: 8px; border: 0; border-radius: 6px; background: var(--chat-raised); color: var(--chat-text); cursor: pointer; }
.docs-subscription-modal [data-plans-close] svg { width: 18px; height: 18px; }
.docs-subscription-modal :is(button, a):focus-visible { outline: 2px solid var(--chat-focus); outline-offset: 3px; }
.docs-subscription-modal .docs-codex-plan-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; }
@media (min-width: 561px) {
  .docs-subscription-modal .docs-codex-plan-list:has(> .docs-codex-plan-option:nth-child(4)) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.docs-subscription-modal .docs-codex-plan-option { display: flex; flex-direction: column; align-items: stretch; gap: 24px; min-width: 0; margin: 0; padding: 20px; border: 1px solid var(--chat-line); border-radius: 8px; background: var(--chat-surface); color: var(--chat-text); font: inherit; letter-spacing: 0; box-shadow: none; text-align: left; cursor: pointer; }
.docs-subscription-modal button.docs-codex-plan-option:hover:not(:disabled) { border-color: var(--chat-muted); background: var(--chat-raised); }
.docs-subscription-modal button:disabled { opacity: .6; cursor: wait; }
.docs-subscription-modal .docs-codex-plan-option.is-current { background: var(--chat-raised); cursor: default; }
.docs-subscription-modal .docs-codex-plan-option__identity { display: grid; gap: 8px; }
.docs-subscription-modal .docs-codex-plan-option__title { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.docs-subscription-modal .docs-codex-plan-option__title strong { font-size: 17px; font-weight: 600; overflow-wrap: anywhere; }
.docs-subscription-modal .docs-codex-plan-option__ratio { background: var(--chat-raised); border: 1px solid var(--chat-line); border-radius: 4px; padding: 0 6px; font-size: 12px; color: var(--chat-muted); }
.docs-subscription-modal .docs-codex-plan-option__limits { font-size: 13px; color: var(--chat-muted); }
.docs-subscription-modal .docs-codex-plan-option__current { font-size: 11px; color: var(--chat-muted); }
.docs-subscription-modal .docs-codex-plan-option__price { display: grid; gap: 4px; margin-top: auto; }
.docs-subscription-modal .docs-codex-plan-option__price strong { font-size: 26px; font-weight: 600; line-height: 1.3; font-variant-numeric: tabular-nums; }
.docs-subscription-modal .docs-codex-plan-option__price small { font-size: 12px; color: var(--chat-muted); }
.docs-subscription-modal .docs-codex-plan-option__cta { display: block; padding: 9px 8px; border-radius: 6px; background: var(--chat-action); color: var(--chat-on-action); font-size: 13px; font-weight: 500; text-align: center; }
.docs-subscription-modal .docs-codex-plan-empty { grid-column: 1 / -1; padding: 12px 0; color: var(--chat-muted); }
.docs-subscription-modal .docs-subscription-modal__status { margin: 0 0 16px; }
.docs-subscription-modal .docs-subscription-modal__feedback { margin: 16px 0; color: var(--chat-text); }
.docs-subscription-modal .docs-subscription-modal__feedback p { color: inherit; margin: 0 0 10px; }
.docs-subscription-modal [data-plans-retry], .docs-subscription-modal__payment a { display: inline-flex; justify-content: center; align-items: center; min-height: 40px; padding: 8px 16px; border-radius: 6px; border: 1px solid var(--chat-line); background: var(--chat-action); color: var(--chat-on-action); font: 500 13px/1.5 var(--chat-font); text-decoration: none; cursor: pointer; }
.docs-subscription-modal .docs-subscription-modal__payment { display: grid; justify-items: start; gap: 10px; margin-top: 20px; }
.docs-subscription-modal .docs-subscription-modal__payment p { color: var(--chat-text); font-weight: 600; }
.docs-subscription-modal .docs-subscription-modal__payment small { font-size: 12px; color: var(--chat-muted); }
.docs-subscription-modal .docs-subscription-modal__footer { margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--chat-line); font-size: 12px; line-height: 1.6; color: var(--chat-muted); }
html body .docs-folder-modal.docs-subscription-confirm { padding-top: var(--subscription-top); padding-bottom: var(--subscription-bottom); }
html body .docs-folder-modal.docs-subscription-confirm .docs-folder-modal__card { width: min(460px, 100%); max-height: calc(100dvh - var(--subscription-top) - var(--subscription-bottom)); overflow: auto; background: var(--chat-surface); color: var(--chat-text); border: 1px solid var(--chat-line); border-radius: 8px; font-family: var(--chat-font); }
html body .docs-folder-modal.docs-subscription-confirm .docs-folder-modal__title { font: 600 20px/1.4 var(--chat-font); letter-spacing: 0; color: var(--chat-text); }
html body .docs-folder-modal.docs-subscription-confirm .docs-confirm-modal__details dd { font-size: 14px; font-weight: 600; color: var(--chat-text); }
html body .docs-folder-modal.docs-subscription-confirm :is(.docs-folder-modal__hint, .docs-confirm-modal__note, .docs-confirm-modal__details dt) { font-size: 13px; line-height: 1.5; color: var(--chat-muted); }
html body .docs-folder-modal.docs-subscription-confirm .docs-confirm-modal__details { background: transparent; border: 0; }
html body .docs-subscription-confirm .docs-folder-modal__btn { min-height: 40px; border-radius: 6px; box-shadow: none; background-image: none; font: 500 13px/1.5 var(--chat-font); }
html body .docs-subscription-confirm .docs-folder-modal__btn--primary { background: var(--chat-action); color: var(--chat-on-action); }
html body .docs-subscription-confirm .docs-folder-modal__btn--ghost { background: var(--chat-raised); color: var(--chat-text); border-color: var(--chat-line); }
@media (max-width: 560px) {
  html body dialog.docs-subscription-modal { padding: 16px; width: calc(100% - 24px); }
  .docs-subscription-modal h2 { font-size: 20px; }
  .docs-subscription-modal .docs-subscription-modal__head { margin-bottom: 16px; }
  .docs-subscription-modal .docs-codex-plan-list { grid-template-columns: minmax(0, 1fr); }
  .docs-subscription-modal .docs-codex-plan-option { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; padding: 16px; }
  .docs-subscription-modal .docs-codex-plan-option__price { text-align: right; margin: 0; }
  .docs-subscription-modal .docs-codex-plan-option__price strong { font-size: 21px; }
  .docs-subscription-modal .docs-codex-plan-option__cta { grid-column: 1 / -1; }
}
@media (max-width: 380px) {
  html body #app-container #documents-container.docs-provider-mcp .docs-mcp-welcome__subscription { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  html body #app-container #documents-container.docs-provider-mcp .docs-subscription-cta { width: 100%; }
}