/* OpenAI Platform public CSS captured 2026-11-03; see frontend-design-system.md.
   Colors include alpha composition. Geometry uses B=7, phi-quarter D(k).
   This file is consumed by both applications; do not fork the palette. */
:root, [data-theme="light"] {
  --ui-canvas: #fff;
  --ui-sidebar: #f3f3f3;
  --ui-subtle: #f9f9f9;
  --ui-elevated: #fff;
  --ui-elevated-secondary: #f9f9f9;
  --ui-text: #282828;
  --ui-heading: #0d0d0d;
  --ui-muted: #5d5d5d;
  --ui-tertiary: #8f8f8f;
  --ui-disabled: #8f8f8f;
  --ui-fill: #ededed;
  --ui-hover: color-mix(in oklab, #0d0d0d 5%, transparent);
  --ui-active: color-mix(in oklab, #0d0d0d 8%, transparent);
  --ui-border: color-mix(in oklab, #0d0d0d 10%, transparent);
  --ui-border-subtle: color-mix(in oklab, #0d0d0d 5%, transparent);
  --ui-border-strong: color-mix(in oklab, #0d0d0d 15%, transparent);
  --ui-primary: #181818;
  --ui-primary-hover: #414141;
  --ui-on-primary: #fff;
  --ui-focus: #0169cc;
  --ui-success: #008635;
  --ui-danger: #ba2623;
  --ui-warning: #923b0f;
  --ui-overlay: rgb(0 0 0 / 28%);
  --ui-shadow: 0 10px 15px -3px rgb(0 0 0 / 10%), 0 4px 6px -4px rgb(0 0 0 / 10%), 0 0 0 .5px rgb(0 0 0 / 10%);
  --ui-glass: var(--ui-elevated);
  --ui-space-1: 8px; /* D1 */
  --ui-space-2: 13px; /* D5 */
  --ui-space-3: 21px; /* D9 */
  --ui-space-4: 33px; /* D13 */
  --ui-control: 33px; /* D13 */
  --ui-target: 38px; /* D14 */
  --ui-header: 48px; /* D16 */
  --ui-rail: 54px; /* D17 */
  --ui-sidebar-width: 203px; /* D28 */
  --ui-radius-sm: 6px; /* D-1 */
  --ui-radius: 10px; /* D3 */
  --ui-radius-lg: 16px; /* D7 */
}
[data-theme="dark"] {
  --ui-canvas: #212121;
  --ui-sidebar: #131313;
  --ui-subtle: #181818;
  --ui-elevated: #303030;
  --ui-elevated-secondary: #414141;
  --ui-text: #dcdcdc;
  --ui-heading: #fff;
  --ui-muted: #afafaf;
  --ui-tertiary: #8f8f8f;
  --ui-disabled: #5d5d5d;
  --ui-fill: #303030;
  --ui-hover: color-mix(in oklab, #fff 12%, transparent);
  --ui-active: color-mix(in oklab, #fff 16%, transparent);
  --ui-border: color-mix(in oklab, #fff 12%, transparent);
  --ui-border-subtle: color-mix(in oklab, #fff 6%, transparent);
  --ui-border-strong: color-mix(in oklab, #fff 20%, transparent);
  --ui-primary: #f3f3f3;
  --ui-primary-hover: #dfdfdf;
  --ui-on-primary: #0d0d0d;
  --ui-focus: #0285ff;
  --ui-success: #04b84c;
  --ui-danger: #fa423e;
  --ui-warning: #fb6a22;
  --ui-overlay: rgb(0 0 0 / 48%);
  --ui-shadow: 0 10px 15px -3px rgb(0 0 0 / 20%), 0 4px 6px -4px rgb(0 0 0 / 20%), 0 0 0 .5px rgb(255 255 255 / 12%);
  --ui-glass: var(--ui-elevated);
}

/* S: 2026-11-03 user-selected reference. Public Dreamina CSS variables and
   computed composition, recorded in .private/jimeng-framework-20261103/.
   Product-scoped: MS and Account keep their existing appearance contract. */
html[data-product="strobe"], html[data-product="strobe"] [data-theme="light"] {
  --font-display: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", Arial, sans-serif;
  --font-body-cjk: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", Arial, sans-serif;
  --ui-canvas: #f8f9fa;
  --ui-sidebar: #fff;
  --ui-subtle: #f8f9fa;
  --ui-elevated: #fff;
  --ui-elevated-secondary: #fff;
  --ui-text: #000;
  --ui-heading: #000;
  --ui-muted: #737373;
  --ui-tertiary: #8c8c8c;
  --ui-disabled: #73737359;
  --ui-fill: #00000008;
  --ui-hover: #00000012;
  --ui-active: #0000001a;
  --ui-border: #00000012;
  --ui-border-subtle: #0000000d;
  --ui-border-strong: #00000026;
  --ui-primary: #000;
  --ui-primary-hover: #262626;
  --ui-on-primary: #fff;
  --ui-focus: #737373;
  --ui-overlay: #0006;
  --ui-shadow: 0 8px 32px #0000001f, 0 0 0 1px #0000000d;
  --ui-glass: var(--ui-elevated);
  --ui-selected: #0009;
  --ui-sidebar-width: 240px;
  --ui-rail: 64px;
  --ui-motion-feedback: 100ms;
  --ui-motion-element: 200ms;
  --ui-motion-overlay: 300ms;
  --ui-motion-soft: cubic-bezier(.4, 0, .2, 1);
  --ui-motion-sidebar: 520ms cubic-bezier(.22, 1, .36, 1);
  --ui-motion-popover: cubic-bezier(.34, .69, .1, 1);
}
html[data-product="strobe"][data-theme="dark"], html[data-product="strobe"] [data-theme="dark"] {
  --ui-canvas: #0d0d0d;
  --ui-sidebar: #171717;
  --ui-subtle: #121212;
  --ui-elevated: #1a1a1a;
  --ui-elevated-secondary: #262626;
  --ui-text: #fff;
  --ui-heading: #fff;
  --ui-muted: #ffffffb2;
  --ui-tertiary: #ffffff99;
  --ui-disabled: #ffffff4d;
  --ui-fill: #ffffff0a;
  --ui-hover: #ffffff1f;
  --ui-active: #ffffff29;
  --ui-border: #ffffff14;
  --ui-border-subtle: #ffffff0a;
  --ui-border-strong: #ffffff33;
  --ui-primary: #fff;
  --ui-primary-hover: #e5e5e5;
  --ui-on-primary: #0d0d0d;
  --ui-focus: #ffffff99;
  --ui-overlay: #0009;
  --ui-shadow: 0 8px 32px #0006, 0 0 0 1px #ffffff0a;
  --ui-selected: #ffffff99;
}