:root {
  color-scheme: light;
  --codex-ink: #17202a;
  --codex-muted: #5f6b7a;
  --codex-line: #d9ded7;
  --codex-paper: #f7f8f5;
  --codex-panel: rgba(255, 255, 255, 0.82);
  --codex-panel-solid: #ffffff;
  --codex-teal: #0f766e;
  --codex-blue: #2457c5;
  --codex-amber: #b7791f;
  --codex-rose: #b4233a;
  --codex-shadow: 0 18px 54px rgba(24, 31, 42, 0.1);
  --semi-border-radius-small: 7px;
  --semi-border-radius-medium: 8px;
  --semi-border-radius-large: 8px;
  --semi-color-primary: var(--codex-ink);
  --semi-color-primary-hover: #243042;
  --semi-color-primary-active: #0f1724;
  --semi-color-link: var(--codex-blue);
}

html,
body {
  min-height: 100%;
  background:
    radial-gradient(circle at 14% 12%, rgba(15, 118, 110, 0.08), transparent 28rem),
    radial-gradient(circle at 84% 20%, rgba(183, 121, 31, 0.08), transparent 28rem),
    linear-gradient(180deg, #fbfbf7 0%, #eef2ee 100%) !important;
}

body {
  color: var(--codex-ink);
  font-family:
    Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont,
    "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif !important;
  letter-spacing: 0 !important;
}

body[theme-mode="dark"],
html.dark body {
  --codex-ink: #e5edf8;
  --codex-muted: #a8b3c2;
  --codex-line: rgba(255, 255, 255, 0.11);
  --codex-paper: #111827;
  --codex-panel: rgba(17, 24, 39, 0.82);
  --codex-panel-solid: #151e2d;
  background:
    radial-gradient(circle at 12% 12%, rgba(20, 184, 166, 0.1), transparent 28rem),
    radial-gradient(circle at 86% 18%, rgba(245, 158, 11, 0.08), transparent 28rem),
    linear-gradient(180deg, #101722 0%, #0c111a 100%) !important;
}

#root {
  min-height: 100vh;
}

#root > .semi-layout,
.semi-layout {
  background: transparent !important;
}

.semi-layout-sider,
aside[class*="sider"],
[class*="Sider"] {
  border-right: 1px solid var(--codex-line) !important;
  background: rgba(255, 255, 255, 0.7) !important;
  backdrop-filter: blur(18px);
}

body[theme-mode="dark"] .semi-layout-sider,
html.dark .semi-layout-sider,
body[theme-mode="dark"] aside[class*="sider"],
html.dark aside[class*="sider"] {
  background: rgba(17, 24, 39, 0.72) !important;
}

.semi-layout-header,
.semi-page-header,
.semi-navigation-header,
body > header {
  background: rgba(255, 255, 255, 0.72) !important;
  border-bottom: 1px solid var(--codex-line) !important;
  backdrop-filter: blur(18px);
  box-shadow: none !important;
}

body[theme-mode="dark"] .semi-layout-header,
html.dark .semi-layout-header,
body[theme-mode="dark"] .semi-page-header,
html.dark .semi-page-header,
body[theme-mode="dark"] .semi-navigation-header,
html.dark .semi-navigation-header,
body[theme-mode="dark"] > header,
html.dark body > header {
  background: rgba(17, 24, 39, 0.72) !important;
}

.semi-navigation,
.semi-navigation-sub,
.semi-navigation-item,
.semi-navigation-item-text {
  letter-spacing: 0 !important;
}

.semi-navigation {
  background: transparent !important;
}

.semi-navigation-item {
  border-radius: 7px !important;
  margin: 2px 8px !important;
}

.semi-navigation-item-selected,
.semi-navigation-item-active {
  background: rgba(23, 32, 42, 0.08) !important;
  color: var(--codex-ink) !important;
}

body[theme-mode="dark"] .semi-navigation-item-selected,
html.dark .semi-navigation-item-selected,
body[theme-mode="dark"] .semi-navigation-item-active,
html.dark .semi-navigation-item-active {
  background: rgba(255, 255, 255, 0.1) !important;
}

.semi-card,
.semi-table,
.semi-modal-content,
.semi-drawer-content,
.semi-collapse,
.semi-tabs-content,
.semi-list,
.semi-descriptions,
.semi-form,
.semi-banner,
.semi-popover,
.semi-tooltip-wrapper {
  border-color: var(--codex-line) !important;
  border-radius: 8px !important;
}

.semi-card,
.semi-table,
.semi-modal-content,
.semi-drawer-content,
.semi-collapse,
.semi-list,
.semi-descriptions,
.semi-form {
  background: var(--codex-panel) !important;
  box-shadow: none !important;
}

.semi-card {
  box-shadow: var(--codex-shadow) !important;
}

.semi-card-body,
.semi-card-header {
  border-color: var(--codex-line) !important;
}

.semi-table-container,
.semi-table-body,
.semi-table-thead > .semi-table-row > .semi-table-row-head {
  background: transparent !important;
}

.semi-table-thead > .semi-table-row > .semi-table-row-head {
  color: #3f4d5f !important;
  font-size: 12px !important;
  font-weight: 720 !important;
  letter-spacing: 0 !important;
}

.semi-table-tbody > .semi-table-row:hover > .semi-table-row-cell {
  background: rgba(15, 118, 110, 0.05) !important;
}

.semi-button {
  border-radius: 8px !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  transition:
    transform 0.16s ease,
    box-shadow 0.16s ease,
    background 0.16s ease !important;
}

.semi-button:not(.semi-button-disabled):hover {
  transform: translateY(-1px);
}

.semi-button-primary,
.semi-button-primary.semi-button-solid {
  border-color: var(--codex-ink) !important;
  background: var(--codex-ink) !important;
  color: #fff !important;
  box-shadow: 0 12px 28px rgba(23, 32, 42, 0.18) !important;
}

.semi-button-light,
.semi-button-borderless,
.semi-button-tertiary {
  background: rgba(255, 255, 255, 0.68) !important;
}

body[theme-mode="dark"] .semi-button-light,
html.dark .semi-button-light,
body[theme-mode="dark"] .semi-button-borderless,
html.dark .semi-button-borderless,
body[theme-mode="dark"] .semi-button-tertiary,
html.dark .semi-button-tertiary {
  background: rgba(255, 255, 255, 0.08) !important;
}

.semi-input-wrapper,
.semi-select-selection,
.semi-input-number,
.semi-datepicker-input,
.semi-textarea-wrapper,
.semi-cascader-selection,
.semi-tree-select-selection {
  border-color: var(--codex-line) !important;
  border-radius: 8px !important;
  background: rgba(255, 255, 255, 0.72) !important;
  box-shadow: none !important;
}

body[theme-mode="dark"] .semi-input-wrapper,
html.dark .semi-input-wrapper,
body[theme-mode="dark"] .semi-select-selection,
html.dark .semi-select-selection,
body[theme-mode="dark"] .semi-input-number,
html.dark .semi-input-number,
body[theme-mode="dark"] .semi-datepicker-input,
html.dark .semi-datepicker-input,
body[theme-mode="dark"] .semi-textarea-wrapper,
html.dark .semi-textarea-wrapper,
body[theme-mode="dark"] .semi-cascader-selection,
html.dark .semi-cascader-selection,
body[theme-mode="dark"] .semi-tree-select-selection,
html.dark .semi-tree-select-selection {
  background: rgba(255, 255, 255, 0.08) !important;
}

.semi-tag,
.semi-badge-count,
.semi-avatar,
.semi-pagination-item,
.semi-pagination-item-active {
  border-radius: 7px !important;
  letter-spacing: 0 !important;
}

.semi-tag-green,
.semi-tag-light-green {
  background: rgba(15, 118, 110, 0.12) !important;
  color: var(--codex-teal) !important;
}

.semi-tag-blue,
.semi-tag-light-blue {
  background: rgba(36, 87, 197, 0.11) !important;
  color: var(--codex-blue) !important;
}

.semi-tabs-tab {
  border-radius: 7px !important;
}

.semi-tabs-tab-active {
  color: var(--codex-ink) !important;
  font-weight: 720 !important;
}

.semi-tabs-bar-line.semi-tabs-bar-top,
.semi-tabs-bar-line.semi-tabs-bar-bottom {
  border-color: var(--codex-line) !important;
}

.semi-typography,
.semi-typography h1,
.semi-typography h2,
.semi-typography h3,
.semi-typography h4,
.semi-typography h5,
.semi-typography h6,
h1,
h2,
h3,
h4,
h5,
h6 {
  letter-spacing: 0 !important;
}

pre,
code,
.semi-code-highlight {
  border-radius: 8px !important;
  font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace !important;
}

.codex-cache-widget {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 2147482800;
  width: 210px;
  padding: 14px;
  border: 1px solid var(--codex-line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.88);
  box-shadow: 0 18px 48px rgba(24, 31, 42, 0.14);
  color: var(--codex-ink);
  backdrop-filter: blur(18px);
}

body[theme-mode="dark"] .codex-cache-widget,
html.dark .codex-cache-widget {
  background: rgba(17, 24, 39, 0.88);
}

.codex-cache-widget__label {
  color: var(--codex-muted);
  font-size: 12px;
  font-weight: 700;
}

.codex-cache-widget__value {
  margin-top: 6px;
  font-size: 30px;
  font-weight: 780;
  line-height: 1;
}

.codex-cache-widget__meta {
  margin-top: 8px;
  color: var(--codex-muted);
  font-size: 12px;
  line-height: 1.45;
}

.codex-cache-widget__bar {
  height: 7px;
  margin-top: 12px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(23, 32, 42, 0.1);
}

.codex-cache-widget__bar i {
  display: block;
  width: 0;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #14b8a6, #60a5fa, #f59e0b);
  transition: width 0.25s ease;
}

@media (max-width: 760px) {
  .semi-layout-sider {
    backdrop-filter: none;
  }

  .codex-cache-widget {
    right: 12px;
    bottom: 12px;
    width: min(210px, calc(100vw - 24px));
  }
}

/* Codex API visual pass v2: target the actual New API shell classes. */
body {
  --semi-color-bg-0: rgba(255, 255, 255, 0.82) !important;
  --semi-color-bg-1: rgba(255, 255, 255, 0.74) !important;
  --semi-color-bg-2: rgba(248, 250, 247, 0.9) !important;
  --semi-color-border: rgba(23, 32, 42, 0.1) !important;
  --semi-color-fill-0: rgba(23, 32, 42, 0.045) !important;
  --semi-color-fill-1: rgba(23, 32, 42, 0.075) !important;
  --semi-color-fill-2: rgba(15, 118, 110, 0.11) !important;
}

body[theme-mode="dark"],
html.dark body {
  --semi-color-bg-0: rgba(17, 24, 39, 0.88) !important;
  --semi-color-bg-1: rgba(21, 30, 45, 0.88) !important;
  --semi-color-bg-2: rgba(29, 40, 58, 0.92) !important;
  --semi-color-border: rgba(255, 255, 255, 0.11) !important;
  --semi-color-fill-0: rgba(255, 255, 255, 0.06) !important;
  --semi-color-fill-1: rgba(255, 255, 255, 0.1) !important;
  --semi-color-fill-2: rgba(20, 184, 166, 0.16) !important;
}

#root > div,
#root .semi-layout,
#root .flex.flex-col {
  background: transparent !important;
}

[class*="text-semi-color-text-0"][class*="sticky"][class*="top-0"] {
  margin: 12px 16px 0 !important;
  border: 1px solid rgba(23, 32, 42, 0.1) !important;
  border-radius: 8px !important;
  background: rgba(255, 255, 255, 0.76) !important;
  box-shadow: 0 16px 46px rgba(24, 31, 42, 0.09) !important;
  backdrop-filter: blur(18px) saturate(1.1) !important;
}

html.dark [class*="text-semi-color-text-0"][class*="sticky"][class*="top-0"],
body[theme-mode="dark"] [class*="text-semi-color-text-0"][class*="sticky"][class*="top-0"] {
  border-color: rgba(255, 255, 255, 0.1) !important;
  background: rgba(17, 24, 39, 0.76) !important;
}

[class*="text-semi-color-text-0"][class*="sticky"][class*="top-0"] .w-full {
  padding-left: 14px !important;
  padding-right: 14px !important;
}

.sidebar-container,
.sidebar-nav {
  border-right: 0 !important;
  background:
    linear-gradient(180deg, rgba(23, 32, 42, 0.98), rgba(17, 24, 39, 0.96)) !important;
  color: rgba(255, 255, 255, 0.82) !important;
}

.sidebar-container {
  margin: 12px 0 12px 12px !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 8px !important;
  box-shadow: 0 22px 60px rgba(17, 24, 39, 0.2) !important;
  overflow: hidden !important;
}

.sidebar-nav {
  padding: 14px 8px !important;
}

.sidebar-group-label {
  margin: 18px 10px 8px !important;
  color: rgba(255, 255, 255, 0.42) !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

.sidebar-divider {
  border-color: rgba(255, 255, 255, 0.08) !important;
}

.sidebar-icon-container,
.sbg-icon {
  color: #9ff2e7 !important;
}

.sidebar-container .semi-navigation-item,
.sidebar-container .sbg-button,
.sidebar-container a,
.sidebar-container button {
  color: rgba(255, 255, 255, 0.72) !important;
}

.sidebar-container .semi-navigation-item,
.sidebar-container .sbg-button {
  min-height: 38px !important;
  border-radius: 7px !important;
  transition:
    color 0.16s ease,
    background 0.16s ease,
    transform 0.16s ease !important;
}

.sidebar-container .semi-navigation-item:hover,
.sidebar-container .sbg-button:hover,
.sidebar-container a:hover {
  background: rgba(255, 255, 255, 0.08) !important;
  color: #fff !important;
  transform: translateX(1px);
}

.sidebar-container .semi-navigation-item-selected,
.sidebar-container .semi-navigation-item-active,
.sidebar-container .sbg-badge-active {
  background: linear-gradient(90deg, rgba(20, 184, 166, 0.24), rgba(96, 165, 250, 0.16)) !important;
  color: #fff !important;
  box-shadow: inset 3px 0 0 #14b8a6 !important;
}

.sidebar-collapse-button {
  background: rgba(17, 24, 39, 0.96) !important;
  border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
}

.sidebar-collapse-icon-container {
  background: rgba(255, 255, 255, 0.08) !important;
  color: #fff !important;
}

main,
.semi-layout-content,
[class*="pricing-content"],
[class*="pricing-layout"] {
  background: transparent !important;
}

.semi-card,
.semi-table,
.semi-modal-content,
.semi-sidesheet-content,
.semi-drawer-content {
  position: relative;
  border: 1px solid rgba(23, 32, 42, 0.1) !important;
  background: rgba(255, 255, 255, 0.84) !important;
  box-shadow: 0 18px 54px rgba(24, 31, 42, 0.1) !important;
  backdrop-filter: blur(14px) !important;
}

html.dark .semi-card,
html.dark .semi-table,
html.dark .semi-modal-content,
html.dark .semi-sidesheet-content,
html.dark .semi-drawer-content,
body[theme-mode="dark"] .semi-card,
body[theme-mode="dark"] .semi-table,
body[theme-mode="dark"] .semi-modal-content,
body[theme-mode="dark"] .semi-sidesheet-content,
body[theme-mode="dark"] .semi-drawer-content {
  border-color: rgba(255, 255, 255, 0.1) !important;
  background: rgba(17, 24, 39, 0.84) !important;
}

.semi-card::before,
.semi-modal-content::before,
.semi-sidesheet-content::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 3px;
  border-radius: 8px 8px 0 0;
  background: linear-gradient(90deg, #14b8a6, #60a5fa, #f59e0b);
  opacity: 0.9;
  pointer-events: none;
}

.semi-card-header {
  padding: 16px 18px 12px !important;
  border-bottom: 1px solid rgba(23, 32, 42, 0.08) !important;
}

.semi-card-body {
  padding: 18px !important;
}

.table-scroll-card {
  border-radius: 8px !important;
  overflow: hidden !important;
}

.table-scroll-card .semi-card-body {
  padding: 0 !important;
}

.semi-table {
  overflow: hidden !important;
}

.semi-table-thead > .semi-table-row > .semi-table-row-head {
  height: 42px !important;
  background: rgba(23, 32, 42, 0.035) !important;
  color: #334155 !important;
}

html.dark .semi-table-thead > .semi-table-row > .semi-table-row-head,
body[theme-mode="dark"] .semi-table-thead > .semi-table-row > .semi-table-row-head {
  background: rgba(255, 255, 255, 0.06) !important;
  color: rgba(255, 255, 255, 0.78) !important;
}

.semi-table-tbody > .semi-table-row > .semi-table-row-cell {
  border-color: rgba(23, 32, 42, 0.065) !important;
}

.semi-table-tbody > .semi-table-row:hover > .semi-table-row-cell {
  background: rgba(20, 184, 166, 0.075) !important;
}

.semi-button-primary,
.semi-button-primary.semi-button-solid,
[class*="bg-black"][class*="text-white"],
[class*="!bg-blue-500"] {
  border: 0 !important;
  background: linear-gradient(135deg, #17202a 0%, #0f766e 58%, #2457c5 100%) !important;
  color: #fff !important;
  box-shadow: 0 14px 34px rgba(15, 118, 110, 0.24) !important;
}

.semi-button-primary:hover,
[class*="bg-black"][class*="text-white"]:hover,
[class*="!bg-blue-500"]:hover {
  filter: brightness(1.04);
  box-shadow: 0 18px 40px rgba(15, 118, 110, 0.28) !important;
}

.semi-button-light,
.semi-button-tertiary,
.semi-button-borderless,
[class*="!bg-semi-color-fill-0"] {
  border: 1px solid rgba(23, 32, 42, 0.08) !important;
  background: rgba(255, 255, 255, 0.66) !important;
}

.semi-input-wrapper,
.semi-select-selection,
.semi-datepicker-input,
.semi-input-number,
.semi-tagInput,
.semi-textarea-wrapper {
  min-height: 38px !important;
  border: 1px solid rgba(23, 32, 42, 0.12) !important;
  background: rgba(255, 255, 255, 0.78) !important;
}

.semi-input-wrapper-focus,
.semi-select-selection-focus,
.semi-datepicker-input-focus,
.semi-textarea-wrapper-focus {
  border-color: rgba(15, 118, 110, 0.6) !important;
  box-shadow: 0 0 0 3px rgba(15, 118, 110, 0.12) !important;
}

.semi-tag {
  border: 1px solid rgba(23, 32, 42, 0.07) !important;
  font-weight: 700 !important;
}

.semi-tabs-bar {
  border-color: rgba(23, 32, 42, 0.08) !important;
}

.semi-tabs-tab-active {
  background: rgba(15, 118, 110, 0.1) !important;
}

.semi-tabs-tab-line.semi-tabs-tab-active,
.semi-tabs-tab-button.semi-tabs-tab-active {
  color: #0f766e !important;
}

[class*="relative overflow-hidden bg-gray-100"][class*="justify-center"] {
  background:
    radial-gradient(circle at 16% 16%, rgba(15, 118, 110, 0.12), transparent 28rem),
    radial-gradient(circle at 86% 24%, rgba(183, 121, 31, 0.12), transparent 26rem),
    linear-gradient(180deg, #fbfbf7 0%, #eef2ee 100%) !important;
}

[class*="relative overflow-hidden bg-gray-100"][class*="justify-center"] .semi-card,
[class*="relative overflow-hidden bg-gray-100"][class*="justify-center"] [class*="border-0"][class*="rounded"] {
  border: 1px solid rgba(23, 32, 42, 0.1) !important;
  background: rgba(255, 255, 255, 0.86) !important;
  box-shadow: 0 24px 80px rgba(24, 31, 42, 0.16) !important;
  backdrop-filter: blur(18px) !important;
}

[class*="fixed inset-0"][class*="justify-center"] {
  background:
    radial-gradient(circle at 20% 20%, rgba(20, 184, 166, 0.1), transparent 26rem),
    linear-gradient(180deg, rgba(251, 251, 247, 0.92), rgba(238, 242, 238, 0.92)) !important;
}

.semi-dropdown,
.semi-popover,
.semi-tooltip {
  border-radius: 8px !important;
}

.semi-dropdown-menu,
.semi-popover-content,
.semi-tooltip-content {
  border: 1px solid rgba(23, 32, 42, 0.1) !important;
  border-radius: 8px !important;
  background: rgba(255, 255, 255, 0.92) !important;
  box-shadow: 0 18px 46px rgba(24, 31, 42, 0.14) !important;
  backdrop-filter: blur(16px) !important;
}

.semi-chat,
.semi-chat-container,
.semi-chat-content {
  background: transparent !important;
}

.semi-chat-chatBox-content {
  border-radius: 8px !important;
}

.debug-panel .semi-tabs,
.debug-panel .semi-tabs-content {
  background: transparent !important;
}

@media (max-width: 767px) {
  [class*="text-semi-color-text-0"][class*="sticky"][class*="top-0"] {
    margin: 8px 10px 0 !important;
  }

  .sidebar-container {
    margin: 0 !important;
    border-radius: 0 !important;
  }

  .semi-card-body {
    padding: 14px !important;
  }

  .codex-cache-widget {
    transform: scale(0.92);
    transform-origin: right bottom;
  }
}

/* Dashboard/card redesign v3. */
.codex-pro-ui .semi-layout-content,
.codex-pro-ui main {
  padding: 22px 24px 36px !important;
}

.codex-console-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(360px, 0.8fr);
  gap: 22px;
  align-items: stretch;
  margin: 0 0 22px;
  padding: 24px;
  border: 1px solid rgba(23, 32, 42, 0.1);
  border-radius: 8px;
  color: #f8fafc;
  background:
    linear-gradient(135deg, rgba(23, 32, 42, 0.96), rgba(15, 118, 110, 0.88) 58%, rgba(36, 87, 197, 0.86)),
    radial-gradient(circle at 12% 18%, rgba(255, 255, 255, 0.2), transparent 24rem);
  box-shadow: 0 24px 80px rgba(23, 32, 42, 0.18);
  overflow: hidden;
}

.codex-console-hero__eyebrow {
  display: inline-flex;
  align-items: center;
  width: max-content;
  margin-bottom: 12px;
  padding: 6px 10px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.1);
  color: rgba(255, 255, 255, 0.82);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.04em;
}

.codex-console-hero h1 {
  margin: 0;
  color: #fff !important;
  font-size: clamp(30px, 4vw, 52px) !important;
  font-weight: 820 !important;
  line-height: 1.02 !important;
}

.codex-console-hero p {
  max-width: 680px;
  margin: 12px 0 0;
  color: rgba(255, 255, 255, 0.72);
  font-size: 15px;
  line-height: 1.8;
}

.codex-console-hero__metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  align-items: stretch;
}

.codex-console-hero__metrics > div {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  min-height: 126px;
  padding: 16px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(10px);
}

.codex-console-hero__metrics b {
  color: #fff;
  font-size: 28px;
  font-weight: 820;
  line-height: 1;
}

.codex-console-hero__metrics span {
  margin-top: 9px;
  color: rgba(255, 255, 255, 0.64);
  font-size: 12px;
  font-weight: 720;
}

.codex-stat-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(190px, 1fr)) !important;
  gap: 16px !important;
  margin-bottom: 18px !important;
}

.codex-card-grid {
  gap: 16px !important;
}

.semi-card.codex-pro-card {
  border-radius: 8px !important;
  overflow: hidden !important;
  transition:
    transform 0.18s ease,
    box-shadow 0.18s ease,
    border-color 0.18s ease !important;
}

.semi-card.codex-pro-card:hover {
  transform: translateY(-2px);
  border-color: rgba(15, 118, 110, 0.24) !important;
  box-shadow: 0 26px 80px rgba(24, 31, 42, 0.14) !important;
}

.semi-card.codex-stat-card {
  min-height: 146px !important;
  border: 0 !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(250, 252, 250, 0.82)) !important;
  box-shadow:
    inset 0 0 0 1px rgba(23, 32, 42, 0.09),
    0 18px 56px rgba(24, 31, 42, 0.1) !important;
}

.semi-card.codex-stat-card::before {
  height: 100% !important;
  border-radius: 8px !important;
  background:
    radial-gradient(circle at 88% 18%, rgba(20, 184, 166, 0.18), transparent 5.5rem),
    linear-gradient(90deg, #14b8a6 0 4px, transparent 4px) !important;
  opacity: 1 !important;
}

.semi-card.codex-stat-card::after {
  content: "";
  position: absolute;
  right: 18px;
  top: 18px;
  width: 42px;
  height: 42px;
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(20, 184, 166, 0.18), rgba(96, 165, 250, 0.18)),
    rgba(255, 255, 255, 0.64);
  box-shadow: inset 0 0 0 1px rgba(15, 118, 110, 0.12);
  pointer-events: none;
}

.semi-card.codex-stat-card .semi-card-body {
  min-height: 146px !important;
  padding: 20px 72px 18px 20px !important;
}

.semi-card.codex-stat-card .semi-typography,
.semi-card.codex-stat-card p,
.semi-card.codex-stat-card span {
  color: #5f6b7a;
}

.semi-card.codex-stat-card b,
.semi-card.codex-stat-card strong,
.semi-card.codex-stat-card .semi-statistic-content,
.semi-card.codex-stat-card .semi-statistic-number,
.semi-card.codex-stat-card [class*="text-2xl"],
.semi-card.codex-stat-card [class*="text-3xl"],
.semi-card.codex-stat-card [class*="text-4xl"] {
  color: #17202a !important;
  font-size: clamp(26px, 3vw, 40px) !important;
  font-weight: 840 !important;
  line-height: 1.05 !important;
}

.semi-card.codex-stat-card [class*="text-xs"],
.semi-card.codex-stat-card [class*="text-sm"] {
  font-weight: 720 !important;
  letter-spacing: 0 !important;
}

.semi-card.codex-data-card {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.72)) !important;
}

.semi-card.codex-data-card::before {
  background: linear-gradient(90deg, rgba(15, 118, 110, 0.78), rgba(36, 87, 197, 0.66)) !important;
}

.semi-card.codex-table-card {
  box-shadow: 0 22px 70px rgba(24, 31, 42, 0.12) !important;
}

.semi-card.codex-table-card .semi-card-header {
  min-height: 56px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.86), rgba(248, 250, 247, 0.72)) !important;
}

.semi-card.codex-table-card .semi-card-body {
  padding: 0 !important;
}

.semi-card.codex-table-card .semi-table {
  border: 0 !important;
  box-shadow: none !important;
}

.semi-card.codex-table-card .semi-table-thead > .semi-table-row > .semi-table-row-head {
  height: 48px !important;
  background: #f3f6f2 !important;
  color: #334155 !important;
}

.semi-card.codex-table-card .semi-table-tbody > .semi-table-row > .semi-table-row-cell {
  height: 50px !important;
}

.semi-card.codex-table-card .semi-pagination {
  padding: 14px 16px !important;
}

html.dark .semi-card.codex-stat-card,
body[theme-mode="dark"] .semi-card.codex-stat-card,
html.dark .semi-card.codex-data-card,
body[theme-mode="dark"] .semi-card.codex-data-card {
  background:
    linear-gradient(180deg, rgba(21, 30, 45, 0.94), rgba(17, 24, 39, 0.82)) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.1),
    0 22px 70px rgba(0, 0, 0, 0.28) !important;
}

html.dark .semi-card.codex-stat-card b,
html.dark .semi-card.codex-stat-card strong,
html.dark .semi-card.codex-stat-card .semi-statistic-content,
html.dark .semi-card.codex-stat-card .semi-statistic-number,
html.dark .semi-card.codex-stat-card [class*="text-2xl"],
html.dark .semi-card.codex-stat-card [class*="text-3xl"],
html.dark .semi-card.codex-stat-card [class*="text-4xl"],
body[theme-mode="dark"] .semi-card.codex-stat-card b,
body[theme-mode="dark"] .semi-card.codex-stat-card strong,
body[theme-mode="dark"] .semi-card.codex-stat-card .semi-statistic-content,
body[theme-mode="dark"] .semi-card.codex-stat-card .semi-statistic-number,
body[theme-mode="dark"] .semi-card.codex-stat-card [class*="text-2xl"],
body[theme-mode="dark"] .semi-card.codex-stat-card [class*="text-3xl"],
body[theme-mode="dark"] .semi-card.codex-stat-card [class*="text-4xl"] {
  color: #f8fafc !important;
}

html.dark .semi-card.codex-stat-card .semi-typography,
html.dark .semi-card.codex-stat-card p,
html.dark .semi-card.codex-stat-card span,
body[theme-mode="dark"] .semi-card.codex-stat-card .semi-typography,
body[theme-mode="dark"] .semi-card.codex-stat-card p,
body[theme-mode="dark"] .semi-card.codex-stat-card span {
  color: rgba(229, 237, 248, 0.68);
}

@media (max-width: 1180px) {
  .codex-stat-grid {
    grid-template-columns: repeat(2, minmax(180px, 1fr)) !important;
  }

  .codex-console-hero {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 680px) {
  .codex-pro-ui .semi-layout-content,
  .codex-pro-ui main {
    padding: 14px !important;
  }

  .codex-console-hero {
    padding: 18px;
  }

  .codex-console-hero__metrics,
  .codex-stat-grid {
    grid-template-columns: 1fr !important;
  }

  .semi-card.codex-stat-card .semi-card-body {
    padding-right: 20px !important;
  }
}

/* v4: aggressive card and layout override for New API utility-class cards. */
.codex-pro-ui [class*="py-12"],
.codex-pro-ui [class*="px-4"][class*="py-"],
.codex-pro-ui .semi-layout-content > div,
.codex-pro-ui main > div {
  max-width: 1500px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.codex-pro-ui .codex-pro-card,
.codex-pro-ui [class*="!rounded-2xl"].codex-pro-card,
.codex-pro-ui [class*="rounded-2xl"].codex-pro-card,
.codex-pro-ui [class*="rounded-xl"].codex-pro-card {
  position: relative !important;
  border: 1px solid rgba(23, 32, 42, 0.1) !important;
  border-radius: 8px !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(248, 250, 247, 0.78)) !important;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.72) inset,
    0 22px 64px rgba(24, 31, 42, 0.12) !important;
  overflow: hidden !important;
  isolation: isolate;
}

.codex-pro-ui .codex-pro-card::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  border-radius: inherit;
  background:
    radial-gradient(circle at 92% 0%, rgba(20, 184, 166, 0.13), transparent 8rem),
    radial-gradient(circle at 8% 110%, rgba(36, 87, 197, 0.09), transparent 9rem);
  pointer-events: none;
}

.codex-pro-ui .codex-pro-card::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 3px;
  background: linear-gradient(90deg, #14b8a6, #60a5fa, #f59e0b);
  opacity: 0.85;
  pointer-events: none;
}

.codex-pro-ui .codex-pro-card > .semi-card-body,
.codex-pro-ui .codex-pro-card > div:not(.semi-card-header):not(.semi-card-body) {
  position: relative;
  z-index: 1;
}

.codex-pro-ui .codex-stat-card {
  min-height: 168px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  background:
    linear-gradient(145deg, rgba(23, 32, 42, 0.98), rgba(15, 118, 110, 0.9) 62%, rgba(36, 87, 197, 0.86)) !important;
  color: #fff !important;
  box-shadow: 0 26px 84px rgba(15, 118, 110, 0.22) !important;
}

.codex-pro-ui .codex-stat-card::before {
  z-index: 0;
  background:
    radial-gradient(circle at 86% 22%, rgba(255, 255, 255, 0.18), transparent 7rem),
    radial-gradient(circle at 8% 105%, rgba(245, 158, 11, 0.18), transparent 8rem) !important;
}

.codex-pro-ui .codex-stat-card::after {
  height: 100%;
  width: 4px;
  right: auto;
  bottom: 0;
  background: linear-gradient(180deg, #14b8a6, #60a5fa, #f59e0b) !important;
}

.codex-pro-ui .codex-stat-card .semi-card-body,
.codex-pro-ui .codex-stat-card > div {
  width: 100%;
  min-height: 168px !important;
  padding: 22px 22px 20px 24px !important;
}

.codex-pro-ui .codex-stat-card .semi-card-body > *,
.codex-pro-ui .codex-stat-card > div > * {
  position: relative;
  z-index: 1;
}

.codex-pro-ui .codex-stat-card :is(span, p, div, label) {
  color: rgba(255, 255, 255, 0.68) !important;
}

.codex-pro-ui .codex-stat-card :is(b, strong, h1, h2, h3, h4, .semi-typography, .semi-statistic-content, .semi-statistic-number, [class*="text-2xl"], [class*="text-3xl"], [class*="text-4xl"]) {
  color: #fff !important;
}

.codex-pro-ui .codex-stat-card :is(b, strong, .semi-statistic-content, .semi-statistic-number, [class*="text-2xl"], [class*="text-3xl"], [class*="text-4xl"]) {
  display: block !important;
  margin-top: 6px !important;
  font-size: clamp(30px, 4vw, 48px) !important;
  font-weight: 850 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
}

.codex-pro-ui .codex-stat-card :is([class*="text-xs"], [class*="text-sm"], .semi-statistic-title) {
  font-size: 12px !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
}

.codex-pro-ui .codex-stat-card .semi-tag,
.codex-pro-ui .codex-stat-card [class*="badge"],
.codex-pro-ui .codex-stat-card [class*="Badge"] {
  border-color: rgba(255, 255, 255, 0.16) !important;
  background: rgba(255, 255, 255, 0.12) !important;
  color: #fff !important;
}

.codex-pro-ui .codex-data-card {
  min-height: 180px !important;
}

.codex-pro-ui .codex-chart-card {
  min-height: 280px !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(246, 249, 248, 0.84)) !important;
}

.codex-pro-ui .codex-table-card {
  border-radius: 8px !important;
  background: rgba(255, 255, 255, 0.9) !important;
}

.codex-pro-ui .codex-table-card .semi-card-header,
.codex-pro-ui .codex-table-card > div:first-child:not(.semi-card-body) {
  min-height: 64px !important;
  padding: 18px 20px !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(245, 248, 246, 0.82)) !important;
}

.codex-pro-ui .codex-table-card .semi-table,
.codex-pro-ui .codex-table-card table {
  border-radius: 0 !important;
  background: transparent !important;
}

.codex-pro-ui .codex-table-card .semi-table-thead > .semi-table-row > .semi-table-row-head,
.codex-pro-ui .codex-table-card thead th {
  background: #eef4f1 !important;
  color: #334155 !important;
  font-size: 12px !important;
  font-weight: 850 !important;
  text-transform: uppercase;
}

.codex-pro-ui .codex-table-card .semi-table-tbody > .semi-table-row > .semi-table-row-cell,
.codex-pro-ui .codex-table-card tbody td {
  background: rgba(255, 255, 255, 0.42) !important;
}

.codex-pro-ui .codex-stat-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)) !important;
  gap: 18px !important;
  align-items: stretch !important;
}

.codex-pro-ui .codex-card-grid {
  gap: 18px !important;
  align-items: stretch !important;
}

.codex-pro-ui .codex-card-grid > .codex-pro-card,
.codex-pro-ui .codex-stat-grid > .codex-pro-card {
  height: 100% !important;
}

.codex-pro-ui .grid[class*="grid-cols-1"],
.codex-pro-ui [class*="grid-cols-1"] {
  gap: 18px !important;
}

.codex-pro-ui [class*="lg:grid-cols-2"],
.codex-pro-ui [class*="md:grid-cols-2"] {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

.codex-pro-ui [class*="lg:grid-cols-3"],
.codex-pro-ui [class*="md:grid-cols-3"] {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

.codex-pro-ui [class*="lg:grid-cols-4"],
.codex-pro-ui [class*="md:grid-cols-4"] {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}

.codex-pro-ui .semi-card-header :is(h1, h2, h3, h4, h5, .semi-typography),
.codex-pro-ui .codex-pro-card :is(h1, h2, h3, h4, h5) {
  font-weight: 820 !important;
  letter-spacing: 0 !important;
}

.codex-pro-ui .semi-table-wrapper,
.codex-pro-ui .semi-table-container {
  border-radius: 0 !important;
}

.codex-pro-ui .semi-pagination {
  justify-content: flex-end !important;
  padding: 14px 18px !important;
  border-top: 1px solid rgba(23, 32, 42, 0.08) !important;
  background: rgba(248, 250, 247, 0.72) !important;
}

html.dark .codex-pro-ui .codex-pro-card,
body[theme-mode="dark"].codex-pro-ui .codex-pro-card {
  border-color: rgba(255, 255, 255, 0.12) !important;
  background:
    linear-gradient(180deg, rgba(21, 30, 45, 0.92), rgba(17, 24, 39, 0.84)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.06),
    0 24px 80px rgba(0, 0, 0, 0.3) !important;
}

html.dark .codex-pro-ui .codex-stat-card,
body[theme-mode="dark"].codex-pro-ui .codex-stat-card {
  background:
    linear-gradient(145deg, rgba(8, 13, 22, 0.98), rgba(12, 83, 78, 0.9) 62%, rgba(30, 64, 175, 0.84)) !important;
}

html.dark .codex-pro-ui .codex-table-card .semi-table-thead > .semi-table-row > .semi-table-row-head,
body[theme-mode="dark"].codex-pro-ui .codex-table-card .semi-table-thead > .semi-table-row > .semi-table-row-head {
  background: rgba(255, 255, 255, 0.07) !important;
  color: rgba(255, 255, 255, 0.76) !important;
}

@media (max-width: 920px) {
  .codex-pro-ui [class*="lg:grid-cols-2"],
  .codex-pro-ui [class*="md:grid-cols-2"],
  .codex-pro-ui [class*="lg:grid-cols-3"],
  .codex-pro-ui [class*="md:grid-cols-3"],
  .codex-pro-ui [class*="lg:grid-cols-4"],
  .codex-pro-ui [class*="md:grid-cols-4"] {
    grid-template-columns: 1fr !important;
  }
}

/* v5: fix dashboard metric readability and analysis tabs. */
.codex-pro-ui .codex-metric-card,
.codex-pro-ui .semi-card.codex-metric-card {
  min-height: 210px !important;
  display: flex !important;
  align-items: stretch !important;
  border: 0 !important;
  border-radius: 8px !important;
  background:
    linear-gradient(145deg, #111827 0%, #153a3a 52%, #2457c5 100%) !important;
  color: #fff !important;
  box-shadow: 0 26px 80px rgba(17, 24, 39, 0.22) !important;
}

.codex-pro-ui .codex-metric-card:nth-of-type(2n),
.codex-pro-ui .semi-card.codex-metric-card:nth-of-type(2n) {
  background:
    linear-gradient(145deg, #132033 0%, #0f766e 58%, #0ea5e9 100%) !important;
}

.codex-pro-ui .codex-metric-card:nth-of-type(3n),
.codex-pro-ui .semi-card.codex-metric-card:nth-of-type(3n) {
  background:
    linear-gradient(145deg, #1b2333 0%, #7c3aed 54%, #f59e0b 100%) !important;
}

.codex-pro-ui .codex-metric-card::before {
  z-index: 0 !important;
  background:
    radial-gradient(circle at 84% 16%, rgba(255, 255, 255, 0.24), transparent 7rem),
    linear-gradient(180deg, rgba(255, 255, 255, 0.08), transparent) !important;
  opacity: 1 !important;
}

.codex-pro-ui .codex-metric-card::after {
  display: none !important;
}

.codex-pro-ui .codex-metric-card .semi-card-body,
.codex-pro-ui .codex-metric-card > div {
  width: 100% !important;
  min-height: 210px !important;
  padding: 22px !important;
  display: grid !important;
  align-content: end !important;
  gap: 12px !important;
  position: relative !important;
  z-index: 1 !important;
}

.codex-pro-ui .codex-metric-card :is(*, .text-white, [class*="text-white"]) {
  color: rgba(255, 255, 255, 0.78) !important;
}

.codex-pro-ui .codex-metric-card :is(b, strong, h1, h2, h3, .semi-typography, [class*="text-2xl"], [class*="text-3xl"], [class*="text-4xl"]) {
  color: #fff !important;
  text-shadow: 0 1px 16px rgba(0, 0, 0, 0.18);
}

.codex-pro-ui .codex-metric-card [class*="text-xs"],
.codex-pro-ui .codex-metric-card [class*="text-sm"] {
  color: rgba(255, 255, 255, 0.68) !important;
  font-weight: 750 !important;
}

.codex-pro-ui .codex-metric-card svg,
.codex-pro-ui .codex-metric-card canvas {
  filter: drop-shadow(0 8px 18px rgba(0, 0, 0, 0.18));
}

.codex-pro-ui .codex-metric-card [class*="bg-white"],
.codex-pro-ui .codex-metric-card [class*="bg-gray"],
.codex-pro-ui .codex-metric-card [class*="bg-slate"] {
  background: rgba(255, 255, 255, 0.14) !important;
}

.codex-pro-ui .codex-analysis-card,
.codex-pro-ui .semi-card.codex-analysis-card {
  border: 1px solid rgba(23, 32, 42, 0.09) !important;
  background: rgba(255, 255, 255, 0.92) !important;
  box-shadow: 0 24px 80px rgba(24, 31, 42, 0.13) !important;
}

.codex-pro-ui .codex-analysis-card .semi-card-header,
.codex-pro-ui .codex-analysis-card > div:first-child:not(.semi-card-body) {
  min-height: 72px !important;
  padding: 14px 18px !important;
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(244, 248, 246, 0.9)) !important;
  border-bottom: 1px solid rgba(23, 32, 42, 0.08) !important;
}

.codex-pro-ui .codex-analysis-card .semi-card-body {
  padding: 22px 24px 26px !important;
}

.codex-pro-ui .codex-analysis-card .codex-analysis-tab {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 34px !important;
  margin: 0 3px !important;
  padding: 0 13px !important;
  border: 1px solid transparent !important;
  border-radius: 8px !important;
  color: #526173 !important;
  font-size: 13px !important;
  font-weight: 720 !important;
  background: transparent !important;
  transition:
    color 0.16s ease,
    background 0.16s ease,
    box-shadow 0.16s ease,
    transform 0.16s ease !important;
}

.codex-pro-ui .codex-analysis-card .codex-analysis-tab::before,
.codex-pro-ui .codex-analysis-card .codex-analysis-tab::after {
  display: none !important;
}

.codex-pro-ui .codex-analysis-card .codex-analysis-tab:hover {
  color: #0f766e !important;
  background: rgba(15, 118, 110, 0.08) !important;
}

.codex-pro-ui .codex-analysis-card .codex-analysis-tab-active,
.codex-pro-ui .codex-analysis-card .semi-tabs-tab-active,
.codex-pro-ui .codex-analysis-card [aria-selected="true"] {
  color: #fff !important;
  border-color: rgba(15, 118, 110, 0.18) !important;
  background: linear-gradient(135deg, #17202a, #0f766e) !important;
  box-shadow: 0 10px 24px rgba(15, 118, 110, 0.18) !important;
  transform: translateY(-1px);
}

.codex-pro-ui .codex-analysis-card .semi-divider,
.codex-pro-ui .codex-analysis-card span:empty,
.codex-pro-ui .codex-analysis-card .codex-analysis-tab + span {
  color: transparent !important;
}

.codex-pro-ui .codex-analysis-card :is(.semi-tabs-bar, .semi-tabs-nav) {
  padding: 4px !important;
  border: 1px solid rgba(23, 32, 42, 0.08) !important;
  border-radius: 8px !important;
  background: rgba(23, 32, 42, 0.045) !important;
}

.codex-pro-ui .codex-analysis-card canvas,
.codex-pro-ui .codex-analysis-card svg {
  max-width: 100% !important;
}

html.dark .codex-pro-ui .codex-analysis-card,
body[theme-mode="dark"].codex-pro-ui .codex-analysis-card {
  background: rgba(17, 24, 39, 0.9) !important;
}

html.dark .codex-pro-ui .codex-analysis-card .semi-card-header,
body[theme-mode="dark"].codex-pro-ui .codex-analysis-card .semi-card-header {
  background: rgba(255, 255, 255, 0.06) !important;
}

/* v6: make every dashboard stat card readable, not just the first metric card. */
.codex-pro-ui .codex-stat-card,
.codex-pro-ui .semi-card.codex-stat-card {
  min-height: 210px !important;
  border: 0 !important;
  background:
    linear-gradient(145deg, #121b28 0%, #15413f 55%, #2457c5 100%) !important;
  color: #fff !important;
  box-shadow: 0 26px 80px rgba(17, 24, 39, 0.22) !important;
}

.codex-pro-ui .codex-stat-card:nth-of-type(2n),
.codex-pro-ui .semi-card.codex-stat-card:nth-of-type(2n) {
  background:
    linear-gradient(145deg, #122236 0%, #0f766e 55%, #0ea5e9 100%) !important;
}

.codex-pro-ui .codex-stat-card:nth-of-type(3n),
.codex-pro-ui .semi-card.codex-stat-card:nth-of-type(3n) {
  background:
    linear-gradient(145deg, #1b2333 0%, #3051a4 50%, #f59e0b 100%) !important;
}

.codex-pro-ui .codex-stat-card::before {
  z-index: 0 !important;
  background:
    radial-gradient(circle at 84% 16%, rgba(255, 255, 255, 0.24), transparent 7rem),
    radial-gradient(circle at 18% 110%, rgba(245, 158, 11, 0.14), transparent 8rem) !important;
  opacity: 1 !important;
}

.codex-pro-ui .codex-stat-card::after {
  display: none !important;
}

.codex-pro-ui .codex-stat-card .semi-card-body,
.codex-pro-ui .codex-stat-card > div {
  width: 100% !important;
  min-height: 210px !important;
  padding: 22px !important;
  display: grid !important;
  align-content: end !important;
  gap: 12px !important;
  position: relative !important;
  z-index: 1 !important;
}

.codex-pro-ui .codex-stat-card :is(*, .text-white, [class*="text-white"], [class*="text-gray"], [class*="text-slate"], .semi-typography) {
  color: rgba(255, 255, 255, 0.74) !important;
}

.codex-pro-ui .codex-stat-card :is(b, strong, h1, h2, h3, h4, .font-medium, .font-semibold, .font-bold, .semi-statistic-content, .semi-statistic-number, [class*="text-2xl"], [class*="text-3xl"], [class*="text-4xl"]) {
  color: #fff !important;
  text-shadow: 0 1px 16px rgba(0, 0, 0, 0.18);
}

.codex-pro-ui .codex-stat-card :is([class*="text-xs"], [class*="text-sm"], .semi-statistic-title) {
  color: rgba(255, 255, 255, 0.68) !important;
  font-weight: 760 !important;
}

.codex-pro-ui .codex-stat-card [class*="bg-white"],
.codex-pro-ui .codex-stat-card [class*="bg-gray"],
.codex-pro-ui .codex-stat-card [class*="bg-slate"] {
  background: rgba(255, 255, 255, 0.14) !important;
}

.codex-pro-ui .codex-stat-card svg,
.codex-pro-ui .codex-stat-card canvas {
  filter: drop-shadow(0 8px 18px rgba(0, 0, 0, 0.2));
}

.codex-pro-ui .codex-analysis-card .codex-analysis-separator {
  display: none !important;
}

.codex-pro-ui .codex-analysis-card .codex-analysis-tab {
  min-height: 38px !important;
  padding: 0 16px !important;
  border: 1px solid rgba(23, 32, 42, 0.08) !important;
  background: rgba(23, 32, 42, 0.045) !important;
  color: #445266 !important;
}

.codex-pro-ui .codex-analysis-card .codex-analysis-tab-active,
.codex-pro-ui .codex-analysis-card .semi-tabs-tab-active,
.codex-pro-ui .codex-analysis-card [aria-selected="true"] {
  color: #fff !important;
  background: linear-gradient(135deg, #17202a, #0f766e, #2457c5) !important;
  border-color: rgba(15, 118, 110, 0.22) !important;
  box-shadow: 0 12px 28px rgba(15, 118, 110, 0.24) !important;
}

/* v7: force dashboard metric text contrast. */
.codex-pro-ui .codex-stat-card,
.codex-pro-ui .codex-stat-card *,
.codex-pro-ui .codex-metric-card,
.codex-pro-ui .codex-metric-card * {
  color: #ffffff !important;
  opacity: 1 !important;
  text-shadow: 0 1px 12px rgba(0, 0, 0, 0.28) !important;
}

.codex-pro-ui .codex-stat-card :is([class*="text-xs"], [class*="text-sm"], p, span, label),
.codex-pro-ui .codex-metric-card :is([class*="text-xs"], [class*="text-sm"], p, span, label) {
  color: rgba(255, 255, 255, 0.92) !important;
  font-weight: 760 !important;
}

.codex-pro-ui .codex-stat-card :is(b, strong, [class*="text-lg"], [class*="text-xl"], [class*="text-2xl"], [class*="text-3xl"], [class*="text-4xl"]),
.codex-pro-ui .codex-metric-card :is(b, strong, [class*="text-lg"], [class*="text-xl"], [class*="text-2xl"], [class*="text-3xl"], [class*="text-4xl"]) {
  color: #ffffff !important;
  font-weight: 850 !important;
}

.codex-pro-ui .codex-stat-card .semi-button,
.codex-pro-ui .codex-metric-card .semi-button {
  border-color: rgba(255, 255, 255, 0.28) !important;
  background: rgba(255, 255, 255, 0.14) !important;
  color: #fff !important;
}

.codex-pro-ui .codex-stat-card svg,
.codex-pro-ui .codex-stat-card svg *,
.codex-pro-ui .codex-metric-card svg,
.codex-pro-ui .codex-metric-card svg * {
  color: #fff !important;
  stroke: currentColor;
}

.codex-pro-ui .codex-greeting {
  color: #17202a !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

html.dark .codex-pro-ui .codex-greeting,
body[theme-mode="dark"].codex-pro-ui .codex-greeting {
  color: #f8fafc !important;
}

/* v8: compact dashboard cards and transparent sparklines. */
.codex-pro-ui .codex-stat-card,
.codex-pro-ui .codex-metric-card,
.codex-pro-ui .semi-card.codex-stat-card,
.codex-pro-ui .semi-card.codex-metric-card {
  height: 172px !important;
  min-height: 172px !important;
  max-height: none !important;
  display: flex !important;
  flex-direction: column !important;
}

.codex-pro-ui .semi-card.codex-stat-card > .semi-card-body,
.codex-pro-ui .semi-card.codex-metric-card > .semi-card-body {
  flex: 1 1 auto !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  padding: 12px 18px 16px !important;
  display: block !important;
  overflow: visible !important;
}

.codex-pro-ui .semi-card.codex-stat-card > .semi-card-header,
.codex-pro-ui .semi-card.codex-metric-card > .semi-card-header {
  flex: 0 0 50px !important;
  min-height: 50px !important;
  padding: 14px 18px 10px !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  background: transparent !important;
}

.codex-pro-ui .semi-card.codex-stat-card > .semi-card-body > .space-y-4,
.codex-pro-ui .semi-card.codex-metric-card > .semi-card-body > .space-y-4 {
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-end !important;
  gap: 8px !important;
}

.codex-pro-ui .semi-card.codex-stat-card > .semi-card-body > .space-y-4 > :not([hidden]) ~ :not([hidden]),
.codex-pro-ui .semi-card.codex-metric-card > .semi-card-body > .space-y-4 > :not([hidden]) ~ :not([hidden]) {
  margin-top: 0 !important;
}

.codex-pro-ui .codex-stat-card > div:not(.semi-card-body),
.codex-pro-ui .codex-metric-card > div:not(.semi-card-body) {
  max-height: none !important;
  overflow: visible !important;
}

.codex-pro-ui .codex-stat-card :is(b, strong, [class*="text-lg"], [class*="text-xl"], [class*="text-2xl"], [class*="text-3xl"], [class*="text-4xl"]),
.codex-pro-ui .codex-metric-card :is(b, strong, [class*="text-lg"], [class*="text-xl"], [class*="text-2xl"], [class*="text-3xl"], [class*="text-4xl"]) {
  font-size: 20px !important;
  line-height: 1.08 !important;
}

.codex-pro-ui .codex-stat-card :is([class*="text-xs"], [class*="text-sm"], p, span, label),
.codex-pro-ui .codex-metric-card :is([class*="text-xs"], [class*="text-sm"], p, span, label) {
  font-size: 12px !important;
  line-height: 1.25 !important;
}

.codex-pro-ui .codex-stat-card canvas,
.codex-pro-ui .codex-stat-card svg,
.codex-pro-ui .codex-metric-card canvas,
.codex-pro-ui .codex-metric-card svg {
  background: transparent !important;
}

.codex-pro-ui .codex-stat-card canvas,
.codex-pro-ui .codex-metric-card canvas {
  border-radius: 6px !important;
  opacity: 0.9 !important;
  mix-blend-mode: luminosity !important;
}

.codex-pro-ui .codex-stat-card :is(div, span):has(> canvas),
.codex-pro-ui .codex-stat-card :is(div, span):has(> svg),
.codex-pro-ui .codex-metric-card :is(div, span):has(> canvas),
.codex-pro-ui .codex-metric-card :is(div, span):has(> svg) {
  background: transparent !important;
}

.codex-pro-ui .codex-stat-card [class*="bg-white"]:has(canvas),
.codex-pro-ui .codex-stat-card [class*="bg-white"]:has(svg),
.codex-pro-ui .codex-stat-card [class*="bg-gray"]:has(canvas),
.codex-pro-ui .codex-stat-card [class*="bg-gray"]:has(svg),
.codex-pro-ui .codex-metric-card [class*="bg-white"]:has(canvas),
.codex-pro-ui .codex-metric-card [class*="bg-white"]:has(svg),
.codex-pro-ui .codex-metric-card [class*="bg-gray"]:has(canvas),
.codex-pro-ui .codex-metric-card [class*="bg-gray"]:has(svg) {
  background: transparent !important;
  box-shadow: none !important;
}

/* v9: compact dashboard stat strip and remove pale mini-chart blocks. */
.codex-pro-ui .codex-stat-grid {
  grid-template-columns: repeat(4, minmax(220px, 1fr)) !important;
  gap: 14px !important;
  margin-bottom: 16px !important;
}

.codex-pro-ui .codex-stat-card,
.codex-pro-ui .codex-metric-card,
.codex-pro-ui .semi-card.codex-stat-card,
.codex-pro-ui .semi-card.codex-metric-card {
  height: 138px !important;
  min-height: 138px !important;
  border-radius: 8px !important;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.14) inset,
    0 18px 46px rgba(17, 24, 39, 0.18) !important;
}

.codex-pro-ui .semi-card.codex-stat-card > .semi-card-header,
.codex-pro-ui .semi-card.codex-metric-card > .semi-card-header {
  flex: 0 0 42px !important;
  min-height: 42px !important;
  padding: 12px 18px 8px !important;
}

.codex-pro-ui .semi-card.codex-stat-card > .semi-card-body,
.codex-pro-ui .semi-card.codex-metric-card > .semi-card-body {
  padding: 8px 18px 14px !important;
}

.codex-pro-ui .semi-card.codex-stat-card > .semi-card-body > .space-y-4,
.codex-pro-ui .semi-card.codex-metric-card > .semi-card-body > .space-y-4 {
  justify-content: center !important;
  gap: 8px !important;
}

.codex-pro-ui .codex-stat-card :is([class*="text-lg"], [class*="text-xl"], [class*="text-2xl"], [class*="text-3xl"], [class*="text-4xl"], b, strong),
.codex-pro-ui .codex-metric-card :is([class*="text-lg"], [class*="text-xl"], [class*="text-2xl"], [class*="text-3xl"], [class*="text-4xl"], b, strong) {
  font-size: 18px !important;
  line-height: 1.05 !important;
}

.codex-pro-ui .codex-stat-card :is([class*="text-xs"], [class*="text-sm"], p, span, label),
.codex-pro-ui .codex-metric-card :is([class*="text-xs"], [class*="text-sm"], p, span, label) {
  font-size: 12px !important;
  line-height: 1.2 !important;
}

.codex-pro-ui .codex-stat-card .w-24.h-10,
.codex-pro-ui .codex-metric-card .w-24.h-10,
.codex-pro-ui .codex-stat-card :is(div, span):has(> canvas),
.codex-pro-ui .codex-metric-card :is(div, span):has(> canvas) {
  display: none !important;
}

.codex-pro-ui .codex-stat-card [class*="justify-between"],
.codex-pro-ui .codex-metric-card [class*="justify-between"] {
  gap: 10px !important;
}

.codex-pro-ui .codex-stat-card [class*="space-x-3"],
.codex-pro-ui .codex-metric-card [class*="space-x-3"] {
  min-width: 0 !important;
}

.codex-pro-ui .codex-stat-card [class*="space-x-3"] > :last-child,
.codex-pro-ui .codex-metric-card [class*="space-x-3"] > :last-child {
  min-width: 0 !important;
}

.codex-pro-ui .codex-analysis-card .semi-card-header,
.codex-pro-ui .codex-analysis-card > div:first-child:not(.semi-card-body) {
  min-height: 64px !important;
  padding: 10px 16px !important;
}

.codex-pro-ui .codex-analysis-card .codex-analysis-tab {
  min-height: 34px !important;
  padding: 0 14px !important;
}

@media (max-width: 1280px) {
  .codex-pro-ui .codex-stat-grid {
    grid-template-columns: repeat(2, minmax(220px, 1fr)) !important;
  }
}

/* v10: fix sidebar selected contrast and Semi light primary buttons. */
.codex-pro-ui .sidebar-container .semi-navigation-item-selected,
.codex-pro-ui .sidebar-container .semi-navigation-item-active,
.codex-pro-ui .sidebar-container .sbg-badge-active {
  background:
    linear-gradient(90deg, rgba(20, 184, 166, 0.38), rgba(36, 87, 197, 0.24)),
    rgba(255, 255, 255, 0.08) !important;
  color: #ffffff !important;
  box-shadow:
    inset 4px 0 0 #14b8a6,
    0 10px 24px rgba(0, 0, 0, 0.16) !important;
}

.codex-pro-ui .sidebar-container .semi-navigation-item-selected *,
.codex-pro-ui .sidebar-container .semi-navigation-item-active *,
.codex-pro-ui .sidebar-container .sbg-badge-active *,
.codex-pro-ui .sidebar-container .semi-navigation-item-selected a,
.codex-pro-ui .sidebar-container .semi-navigation-item-active a {
  color: #ffffff !important;
  opacity: 1 !important;
}

.codex-pro-ui .sidebar-container .semi-navigation-item-selected svg,
.codex-pro-ui .sidebar-container .semi-navigation-item-active svg,
.codex-pro-ui .sidebar-container .sbg-badge-active svg {
  color: #8ff5ea !important;
  stroke: currentColor !important;
}

.codex-pro-ui .sidebar-container .semi-navigation-item:not(.semi-navigation-item-selected):not(.semi-navigation-item-active) *,
.codex-pro-ui .sidebar-container .sbg-button:not(.sbg-badge-active) * {
  color: rgba(255, 255, 255, 0.72) !important;
}

.codex-pro-ui .semi-button-primary.semi-button-light,
.codex-pro-ui .semi-button-primary.semi-button-borderless,
.codex-pro-ui .semi-button-primary.semi-button-tertiary {
  border: 0 !important;
  background: linear-gradient(135deg, #17202a 0%, #0f766e 58%, #2457c5 100%) !important;
  color: #ffffff !important;
  box-shadow: 0 12px 28px rgba(15, 118, 110, 0.22) !important;
}

.codex-pro-ui .semi-button-primary.semi-button-light *,
.codex-pro-ui .semi-button-primary.semi-button-borderless *,
.codex-pro-ui .semi-button-primary.semi-button-tertiary * {
  color: #ffffff !important;
}

.codex-pro-ui .semi-button-primary.semi-button-light:hover,
.codex-pro-ui .semi-button-primary.semi-button-borderless:hover,
.codex-pro-ui .semi-button-primary.semi-button-tertiary:hover {
  background: linear-gradient(135deg, #0f1724 0%, #0f766e 52%, #1d4ed8 100%) !important;
  color: #ffffff !important;
}

.codex-pro-ui .semi-button-light:not(.semi-button-primary):not(.semi-button-danger),
.codex-pro-ui .semi-button-borderless:not(.semi-button-primary):not(.semi-button-danger),
.codex-pro-ui .semi-button-tertiary:not(.semi-button-primary):not(.semi-button-danger) {
  color: #243042 !important;
}

.codex-pro-ui .semi-button-light:not(.semi-button-primary):not(.semi-button-danger) *,
.codex-pro-ui .semi-button-borderless:not(.semi-button-primary):not(.semi-button-danger) *,
.codex-pro-ui .semi-button-tertiary:not(.semi-button-primary):not(.semi-button-danger) * {
  color: inherit !important;
}

.codex-pro-ui .sidebar-collapse-button .semi-button,
.codex-pro-ui .sidebar-container .semi-button-light:not(.semi-button-primary):not(.semi-button-danger),
.codex-pro-ui .sidebar-container .semi-button-borderless:not(.semi-button-primary):not(.semi-button-danger),
.codex-pro-ui .sidebar-container .semi-button-tertiary:not(.semi-button-primary):not(.semi-button-danger) {
  background: rgba(255, 255, 255, 0.14) !important;
  color: rgba(255, 255, 255, 0.86) !important;
  border-color: rgba(255, 255, 255, 0.16) !important;
}

.codex-pro-ui .sidebar-collapse-button .semi-button *,
.codex-pro-ui .sidebar-container .semi-button-light:not(.semi-button-primary):not(.semi-button-danger) *,
.codex-pro-ui .sidebar-container .semi-button-borderless:not(.semi-button-primary):not(.semi-button-danger) *,
.codex-pro-ui .sidebar-container .semi-button-tertiary:not(.semi-button-primary):not(.semi-button-danger) * {
  color: inherit !important;
}

html.dark .codex-pro-ui .semi-button-light:not(.semi-button-primary):not(.semi-button-danger),
body[theme-mode="dark"].codex-pro-ui .semi-button-light:not(.semi-button-primary):not(.semi-button-danger),
html.dark .codex-pro-ui .semi-button-borderless:not(.semi-button-primary):not(.semi-button-danger),
body[theme-mode="dark"].codex-pro-ui .semi-button-borderless:not(.semi-button-primary):not(.semi-button-danger),
html.dark .codex-pro-ui .semi-button-tertiary:not(.semi-button-primary):not(.semi-button-danger),
body[theme-mode="dark"].codex-pro-ui .semi-button-tertiary:not(.semi-button-primary):not(.semi-button-danger) {
  color: #e5edf8 !important;
}

/* v11: dashboard service availability and FAQ layout. */
.codex-dashboard-priority-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 18px;
  margin: 0 0 18px !important;
}

.codex-pro-ui .codex-uptime-card,
.codex-pro-ui .semi-card.codex-uptime-card {
  width: 100% !important;
  min-height: 0 !important;
  height: auto !important;
  border: 1px solid rgba(15, 118, 110, 0.16) !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(246, 250, 248, 0.86)) !important;
  color: #17202a !important;
  box-shadow: 0 18px 54px rgba(24, 31, 42, 0.1) !important;
}

.codex-pro-ui .codex-uptime-card::before {
  z-index: 0 !important;
  background:
    linear-gradient(90deg, #14b8a6 0 4px, transparent 4px),
    radial-gradient(circle at 94% 10%, rgba(20, 184, 166, 0.16), transparent 8rem) !important;
  opacity: 1 !important;
}

.codex-pro-ui .codex-uptime-card::after {
  display: none !important;
}

.codex-pro-ui .semi-card.codex-uptime-card > .semi-card-header,
.codex-pro-ui .semi-card.codex-uptime-card > .semi-card-body,
.codex-pro-ui .codex-uptime-card > div {
  min-height: 0 !important;
  height: auto !important;
  padding: 16px 20px !important;
  color: #17202a !important;
  display: block !important;
  overflow: visible !important;
}

.codex-pro-ui .codex-uptime-card *,
.codex-pro-ui .codex-uptime-card .semi-typography {
  color: inherit !important;
  text-shadow: none !important;
}

.codex-pro-ui .codex-uptime-card :is(p, span, label, [class*="text-xs"], [class*="text-sm"]) {
  color: #5f6b7a !important;
}

.codex-pro-ui .codex-uptime-card :is(b, strong, h1, h2, h3, h4, [class*="text-lg"], [class*="text-xl"], [class*="text-2xl"], [class*="font-semibold"], [class*="font-bold"]) {
  color: #17202a !important;
  font-size: inherit !important;
  line-height: inherit !important;
}

.codex-pro-ui .codex-uptime-card .semi-tag,
.codex-pro-ui .codex-uptime-card [class*="bg-green"],
.codex-pro-ui .codex-uptime-card [class*="text-green"] {
  color: #0f766e !important;
}

.codex-pro-ui .codex-faq-card,
.codex-pro-ui .semi-card.codex-faq-card {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  min-height: 0 !important;
  height: auto !important;
  color: #17202a !important;
}

.codex-pro-ui .codex-faq-card *,
.codex-pro-ui .codex-faq-card .semi-typography {
  text-shadow: none !important;
}

.codex-pro-ui .codex-faq-card :is(.semi-card-body, .semi-collapse, .semi-list, .semi-empty) {
  width: 100% !important;
}

html.dark .codex-pro-ui .codex-uptime-card,
body[theme-mode="dark"].codex-pro-ui .codex-uptime-card,
html.dark .codex-pro-ui .codex-faq-card,
body[theme-mode="dark"].codex-pro-ui .codex-faq-card {
  border-color: rgba(20, 184, 166, 0.24) !important;
  background:
    linear-gradient(180deg, rgba(21, 30, 45, 0.94), rgba(17, 24, 39, 0.86)) !important;
  color: #e5edf8 !important;
}

html.dark .codex-pro-ui .codex-uptime-card :is(p, span, label, [class*="text-xs"], [class*="text-sm"]),
body[theme-mode="dark"].codex-pro-ui .codex-uptime-card :is(p, span, label, [class*="text-xs"], [class*="text-sm"]) {
  color: rgba(229, 237, 248, 0.72) !important;
}

@media (min-width: 1180px) {
  .codex-dashboard-priority-row .codex-uptime-card {
    max-width: none !important;
  }

  .codex-pro-ui .codex-faq-card {
    grid-column: span 2 !important;
  }
}

@media (max-width: 680px) {
  .codex-console-hero__metrics {
    grid-template-columns: 1fr !important;
  }
}