/* CHATGPT_UI ZIP02 — semantic design-system bridge for canonical and legacy surfaces. */
html[data-ui-version="v2"]{
  --cg-surface:var(--ds-color-surface);
  --cg-surface-subtle:var(--ds-color-surface-subtle);
  --cg-border:var(--ds-color-border);
  --cg-divider:var(--ds-color-divider);
  --cg-text:var(--ds-color-text);
  --cg-muted:var(--ds-color-text-muted);
  --cg-primary:var(--ds-color-brand);
  --cg-primary-hover:var(--ds-color-brand-hover);
  --cg-danger:var(--ds-color-danger);
  --cg-success:var(--ds-color-success);
  --cg-warning:var(--ds-color-warning);
  --cg-focus:var(--ds-color-focus);
  --cg-control-height:var(--ds-control-height);
  --cg-radius:var(--ds-radius-md);
  --cg-card-radius:var(--ds-radius-lg);
  --cg-shadow:var(--ds-shadow-surface);
}
html[data-ui-version="v2"] .legacy-functional-surface{color:var(--cg-text);font-family:var(--ds-font-sans);font-size:var(--ds-text-md);line-height:var(--ds-leading-normal)}
html[data-ui-version="v2"] .legacy-functional-surface :where(h1,h2,h3,h4){color:var(--ds-color-text-strong);letter-spacing:var(--ds-letter-tight);line-height:var(--ds-leading-tight)}
html[data-ui-version="v2"] .legacy-functional-surface :where(.muted,.small,.section-sub,.section-subtitle,.metric-note,.empty-note){color:var(--cg-muted)}
html[data-ui-version="v2"] .legacy-functional-surface :where(.card,.section-card,.metric-card,.summary-card,.info-card,.stat-card,.service-board-card,.command-center-card,.glass-section,.panel){border:1px solid var(--cg-border);border-radius:var(--cg-card-radius);background:var(--cg-surface);box-shadow:var(--cg-shadow)}
html[data-ui-version="v2"] .legacy-functional-surface :where(.section-head,.card-header,.summary-card-header){border-block-end-color:var(--cg-divider)}
html[data-ui-version="v2"] .legacy-functional-surface :where(.btn,button:not(.ds-button),a.btn){min-block-size:var(--cg-control-height);border:1px solid var(--cg-border);border-radius:var(--cg-radius);font-weight:var(--ds-weight-semibold);line-height:var(--ds-leading-snug);transition:background-color var(--ds-duration-fast) var(--ds-ease-standard),border-color var(--ds-duration-fast) var(--ds-ease-standard),color var(--ds-duration-fast) var(--ds-ease-standard),box-shadow var(--ds-duration-fast) var(--ds-ease-standard)}
html[data-ui-version="v2"] .legacy-functional-surface :where(.btn.primary,.primary.btn,button.primary,a.btn.primary){border-color:var(--cg-primary);background:var(--cg-primary);color:var(--ds-color-on-brand)}
html[data-ui-version="v2"] .legacy-functional-surface :where(.btn.primary,.primary.btn,button.primary,a.btn.primary):hover{border-color:var(--cg-primary-hover);background:var(--cg-primary-hover)}
html[data-ui-version="v2"] .legacy-functional-surface :where(.btn.secondary,.secondary.btn,button.secondary,a.btn.secondary){border-color:var(--ds-color-border-strong);background:var(--cg-surface);color:var(--cg-text)}
html[data-ui-version="v2"] .legacy-functional-surface :where(.btn.ghost,.ghost.btn,button.ghost,a.btn.ghost){background:transparent;color:var(--cg-text)}
html[data-ui-version="v2"] .legacy-functional-surface :where(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),select,textarea){min-block-size:var(--cg-control-height);border:1px solid var(--cg-border);border-radius:var(--cg-radius);background:var(--cg-surface);color:var(--cg-text);padding-inline:var(--ds-space-3)}
html[data-ui-version="v2"] .legacy-functional-surface textarea{padding-block:var(--ds-space-3);line-height:var(--ds-leading-normal)}
html[data-ui-version="v2"] .legacy-functional-surface :where(input,select,textarea,button,a[href],summary,[tabindex]):focus-visible{outline:var(--ds-focus-ring-width) solid var(--cg-focus);outline-offset:2px;box-shadow:var(--ds-shadow-focus)}
html[data-ui-version="v2"] .legacy-functional-surface :where(input,select,textarea):disabled{border-color:var(--ds-color-divider);background:var(--ds-color-disabled-bg);color:var(--ds-color-disabled-text);cursor:not-allowed;opacity:1}
html[data-ui-version="v2"] .legacy-functional-surface :where(.badge,.chip,.status-pill){display:inline-flex;align-items:center;gap:var(--ds-space-1);max-inline-size:100%;border:1px solid var(--cg-border);border-radius:var(--ds-radius-pill);padding:.2rem .55rem;font-size:var(--ds-text-xs);font-weight:var(--ds-weight-semibold);line-height:var(--ds-leading-snug)}
html[data-ui-version="v2"] .legacy-functional-surface :where(.badge.ok,.badge.success,.success.badge){border-color:var(--ds-color-success-border);background:var(--ds-color-success-soft);color:var(--ds-color-success-text)}
html[data-ui-version="v2"] .legacy-functional-surface :where(.badge.warn,.badge.warning,.warn.badge){border-color:var(--ds-color-warning-border);background:var(--ds-color-warning-soft);color:var(--ds-color-warning-text)}
html[data-ui-version="v2"] .legacy-functional-surface :where(.badge.error,.badge.danger,.danger.badge){border-color:var(--ds-color-danger-border);background:var(--ds-color-danger-soft);color:var(--ds-color-danger-text)}
html[data-ui-version="v2"] .legacy-functional-surface :where(table){color:var(--cg-text);font-variant-numeric:tabular-nums}
html[data-ui-version="v2"] .legacy-functional-surface :where(th){color:var(--ds-color-text-strong);font-size:var(--ds-text-xs);font-weight:var(--ds-weight-semibold);letter-spacing:var(--ds-letter-wide)}
html[data-ui-version="v2"] .legacy-functional-surface :where(th,td){border-block-end-color:var(--cg-divider)}
html[data-ui-version="v2"] .legacy-functional-surface :where(tbody tr):hover{background:var(--ds-color-row-hover)}
@media (prefers-reduced-motion:reduce){html[data-ui-version="v2"] .legacy-functional-surface *,html[data-ui-version="v2"] .legacy-functional-surface *::before,html[data-ui-version="v2"] .legacy-functional-surface *::after{scroll-behavior:auto;transition-duration:.001ms;animation-duration:.001ms;animation-iteration-count:1}}
