/*!
 * DSH Aurora Nexus — flagship demo theme for dsh-custom-css
 * Version: 1.0.0
 *
 * Design direction: editorial typography + prismatic glass + restrained motion.
 * No remote fonts, images, @import, or network requests are used.
 *
 * Official DSH styling seams covered:
 * - complete --dsw-alias-* and --dsw-specific-* semantic palette
 * - official static brand/state scales used directly by a few components
 * - official typography, motion, gradient, blur, shadow, and scrollbar tokens
 * - Shiki syntax-highlight tokens
 * - body[data-ds-dark-theme] light/dark branch
 * - prefers-reduced-motion / prefers-contrast / forced-colors accessibility
 *
 * The final “progressive enhancement” section uses documented DSH roles,
 * data-* attributes, and CSS-Modules substring hooks. Token overrides remain
 * the stable core if those implementation-detail selectors change later.
 */

/* ========================================================================== */
/* 01. Foundation: font, rhythm, motion                                        */
/* ========================================================================== */

:root {
  --aurora-font-sans: Inter, 'SF Pro Display', 'SF Pro Text', 'Segoe UI Variable',
    'Segoe UI', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei',
    'Helvetica Neue', Arial, sans-serif;
  --aurora-font-mono: 'SFMono-Regular', 'SF Mono', 'JetBrains Mono',
    'Cascadia Code', 'Fira Code', Consolas, 'Liberation Mono', Menlo,
    'PingFang SC', 'Microsoft YaHei', monospace;

  --aurora-accent: #685cf6;
  --aurora-accent-2: #1bbfd6;
  --aurora-accent-3: #c85cff;
  --aurora-success: #22b987;
  --aurora-warning: #e4a13a;
  --aurora-danger: #e55370;

  --aurora-radius-xs: 7px;
  --aurora-radius-sm: 10px;
  --aurora-radius-md: 14px;
  --aurora-radius-lg: 20px;
  --aurora-radius-xl: 26px;

  --dsw-font-family: var(--aurora-font-sans) !important;
  --ds-font-family-code: var(--aurora-font-mono) !important;
  --ds-ease-in-out: cubic-bezier(0.22, 1, 0.36, 1) !important;
  --ds-transition-duration: 220ms !important;
  --ds-transition-duration-fast: 130ms !important;
  --ds-transition-duration-slow: 420ms !important;
}

body {
  --dsw-font-family: var(--aurora-font-sans) !important;
  --ds-font-family-code: var(--aurora-font-mono) !important;

  /* Markdown scale */
  --dsw-font-markdown-h1: 700 28px/38px var(--dsw-font-family) !important;
  --dsw-font-markdown-h1-font-family: var(--dsw-font-family) !important;
  --dsw-font-markdown-h1-font-weight: 700 !important;
  --dsw-font-markdown-h1-line-height: 38px !important;
  --dsw-font-markdown-h1-font-size: 28px !important;
  --dsw-font-markdown-h1-font-style: normal !important;

  --dsw-font-markdown-h2: 700 24px/34px var(--dsw-font-family) !important;
  --dsw-font-markdown-h2-font-family: var(--dsw-font-family) !important;
  --dsw-font-markdown-h2-font-weight: 700 !important;
  --dsw-font-markdown-h2-line-height: 34px !important;
  --dsw-font-markdown-h2-font-size: 24px !important;
  --dsw-font-markdown-h2-font-style: normal !important;

  --dsw-font-markdown-h3: 650 21px/31px var(--dsw-font-family) !important;
  --dsw-font-markdown-h3-font-family: var(--dsw-font-family) !important;
  --dsw-font-markdown-h3-font-weight: 650 !important;
  --dsw-font-markdown-h3-line-height: 31px !important;
  --dsw-font-markdown-h3-font-size: 21px !important;
  --dsw-font-markdown-h3-font-style: normal !important;

  --dsw-font-markdown-h4: 600 18px/28px var(--dsw-font-family) !important;
  --dsw-font-markdown-h4-font-family: var(--dsw-font-family) !important;
  --dsw-font-markdown-h4-font-weight: 600 !important;
  --dsw-font-markdown-h4-line-height: 28px !important;
  --dsw-font-markdown-h4-font-size: 18px !important;
  --dsw-font-markdown-h4-font-style: normal !important;

  --dsw-font-markdown-base: 400 16px/29px var(--dsw-font-family) !important;
  --dsw-font-markdown-base-font-family: var(--dsw-font-family) !important;
  --dsw-font-markdown-base-font-weight: 400 !important;
  --dsw-font-markdown-base-line-height: 29px !important;
  --dsw-font-markdown-base-font-size: 16px !important;
  --dsw-font-markdown-base-font-style: normal !important;

  --dsw-font-markdown-base-strong: 600 16px/29px var(--dsw-font-family) !important;
  --dsw-font-markdown-base-strong-font-family: var(--dsw-font-family) !important;
  --dsw-font-markdown-base-strong-font-weight: 600 !important;
  --dsw-font-markdown-base-strong-line-height: 29px !important;
  --dsw-font-markdown-base-strong-font-size: 16px !important;
  --dsw-font-markdown-base-strong-font-style: normal !important;

  --dsw-font-markdown-base-italic: italic 400 16px/29px var(--dsw-font-family) !important;
  --dsw-font-markdown-base-italic-font-family: var(--dsw-font-family) !important;
  --dsw-font-markdown-base-italic-font-weight: 400 !important;
  --dsw-font-markdown-base-italic-line-height: 29px !important;
  --dsw-font-markdown-base-italic-font-size: 16px !important;
  --dsw-font-markdown-base-italic-font-style: italic !important;

  --dsw-font-markdown-base-strong-italic: italic 600 16px/29px var(--dsw-font-family) !important;
  --dsw-font-markdown-base-strong-italic-font-family: var(--dsw-font-family) !important;
  --dsw-font-markdown-base-strong-italic-font-weight: 600 !important;
  --dsw-font-markdown-base-strong-italic-line-height: 29px !important;
  --dsw-font-markdown-base-strong-italic-font-size: 16px !important;
  --dsw-font-markdown-base-strong-italic-font-style: italic !important;

  --dsw-font-markdown-table: 400 14px/24px var(--dsw-font-family) !important;
  --dsw-font-markdown-table-font-family: var(--dsw-font-family) !important;
  --dsw-font-markdown-table-font-weight: 400 !important;
  --dsw-font-markdown-table-line-height: 24px !important;
  --dsw-font-markdown-table-font-size: 14px !important;
  --dsw-font-markdown-table-font-style: normal !important;

  --dsw-font-markdown-table-head: 600 14px/24px var(--dsw-font-family) !important;
  --dsw-font-markdown-table-head-font-family: var(--dsw-font-family) !important;
  --dsw-font-markdown-table-head-font-weight: 600 !important;
  --dsw-font-markdown-table-head-line-height: 24px !important;
  --dsw-font-markdown-table-head-font-size: 14px !important;
  --dsw-font-markdown-table-head-font-style: normal !important;

  --dsw-font-markdown-small: 400 14px/24px var(--dsw-font-family) !important;
  --dsw-font-markdown-small-font-family: var(--dsw-font-family) !important;
  --dsw-font-markdown-small-font-weight: 400 !important;
  --dsw-font-markdown-small-line-height: 24px !important;
  --dsw-font-markdown-small-font-size: 14px !important;
  --dsw-font-markdown-small-font-style: normal !important;

  --dsw-font-markdown-small-strong: 600 14px/24px var(--dsw-font-family) !important;
  --dsw-font-markdown-small-strong-font-family: var(--dsw-font-family) !important;
  --dsw-font-markdown-small-strong-font-weight: 600 !important;
  --dsw-font-markdown-small-strong-line-height: 24px !important;
  --dsw-font-markdown-small-strong-font-size: 14px !important;
  --dsw-font-markdown-small-strong-font-style: normal !important;

  --dsw-font-markdown-small-italic: italic 400 14px/24px var(--dsw-font-family) !important;
  --dsw-font-markdown-small-italic-font-family: var(--dsw-font-family) !important;
  --dsw-font-markdown-small-italic-font-weight: 400 !important;
  --dsw-font-markdown-small-italic-line-height: 24px !important;
  --dsw-font-markdown-small-italic-font-size: 14px !important;
  --dsw-font-markdown-small-italic-font-style: italic !important;

  --dsw-font-markdown-small-strong-italic: italic 600 14px/24px var(--dsw-font-family) !important;
  --dsw-font-markdown-small-strong-italic-font-family: var(--dsw-font-family) !important;
  --dsw-font-markdown-small-strong-italic-font-weight: 600 !important;
  --dsw-font-markdown-small-strong-italic-line-height: 24px !important;
  --dsw-font-markdown-small-strong-italic-font-size: 14px !important;
  --dsw-font-markdown-small-strong-italic-font-style: italic !important;

  --dsw-font-markdown-code: 400 13px/22px var(--ds-font-family-code) !important;
  --dsw-font-markdown-code-font-family: var(--ds-font-family-code) !important;
  --dsw-font-markdown-code-font-weight: 400 !important;
  --dsw-font-markdown-code-line-height: 22px !important;
  --dsw-font-markdown-code-font-size: 13px !important;
  --dsw-font-markdown-code-font-style: normal !important;

  --dsw-font-markdown-code-block: 400 13px/21px var(--ds-font-family-code) !important;
  --dsw-font-markdown-code-block-font-family: var(--ds-font-family-code) !important;
  --dsw-font-markdown-code-block-font-weight: 400 !important;
  --dsw-font-markdown-code-block-line-height: 21px !important;
  --dsw-font-markdown-code-block-font-size: 13px !important;
  --dsw-font-markdown-code-block-font-style: normal !important;

  --dsw-font-markdown-code-block-small: 400 12px/19px var(--ds-font-family-code) !important;
  --dsw-font-markdown-code-block-small-font-family: var(--ds-font-family-code) !important;
  --dsw-font-markdown-code-block-small-font-weight: 400 !important;
  --dsw-font-markdown-code-block-small-line-height: 19px !important;
  --dsw-font-markdown-code-block-small-font-size: 12px !important;
  --dsw-font-markdown-code-block-small-font-style: normal !important;

  /* UI scale */
  --dsw-font-xl-24: 650 26px/34px var(--dsw-font-family) !important;
  --dsw-font-xl-24-font-family: var(--dsw-font-family) !important;
  --dsw-font-xl-24-font-weight: 650 !important;
  --dsw-font-xl-24-line-height: 34px !important;
  --dsw-font-xl-24-font-size: 26px !important;
  --dsw-font-xl-24-font-style: normal !important;

  --dsw-font-l-20: 600 20px/28px var(--dsw-font-family) !important;
  --dsw-font-l-20-font-family: var(--dsw-font-family) !important;
  --dsw-font-l-20-font-weight: 600 !important;
  --dsw-font-l-20-line-height: 28px !important;
  --dsw-font-l-20-font-size: 20px !important;
  --dsw-font-l-20-font-style: normal !important;

  --dsw-font-m-18: 500 18px/26px var(--dsw-font-family) !important;
  --dsw-font-m-18-font-family: var(--dsw-font-family) !important;
  --dsw-font-m-18-font-weight: 500 !important;
  --dsw-font-m-18-line-height: 26px !important;
  --dsw-font-m-18-font-size: 18px !important;
  --dsw-font-m-18-font-style: normal !important;

  --dsw-font-base-16: 400 16px/24px var(--dsw-font-family) !important;
  --dsw-font-base-16-font-family: var(--dsw-font-family) !important;
  --dsw-font-base-16-font-weight: 400 !important;
  --dsw-font-base-16-line-height: 24px !important;
  --dsw-font-base-16-font-size: 16px !important;
  --dsw-font-base-16-font-style: normal !important;

  --dsw-font-base-strong-16: 600 16px/24px var(--dsw-font-family) !important;
  --dsw-font-base-strong-16-font-family: var(--dsw-font-family) !important;
  --dsw-font-base-strong-16-font-weight: 600 !important;
  --dsw-font-base-strong-16-line-height: 24px !important;
  --dsw-font-base-strong-16-font-size: 16px !important;
  --dsw-font-base-strong-16-font-style: normal !important;

  --dsw-font-s-14: 400 14px/22px var(--dsw-font-family) !important;
  --dsw-font-s-14-font-family: var(--dsw-font-family) !important;
  --dsw-font-s-14-font-weight: 400 !important;
  --dsw-font-s-14-line-height: 22px !important;
  --dsw-font-s-14-font-size: 14px !important;
  --dsw-font-s-14-font-style: normal !important;

  --dsw-font-s-strong-14: 600 14px/22px var(--dsw-font-family) !important;
  --dsw-font-s-strong-14-font-family: var(--dsw-font-family) !important;
  --dsw-font-s-strong-14-font-weight: 600 !important;
  --dsw-font-s-strong-14-line-height: 22px !important;
  --dsw-font-s-strong-14-font-size: 14px !important;
  --dsw-font-s-strong-14-font-style: normal !important;

  --dsw-font-xs-13: 400 13px/20px var(--dsw-font-family) !important;
  --dsw-font-xs-13-font-family: var(--dsw-font-family) !important;
  --dsw-font-xs-13-font-weight: 400 !important;
  --dsw-font-xs-13-line-height: 20px !important;
  --dsw-font-xs-13-font-size: 13px !important;
  --dsw-font-xs-13-font-style: normal !important;

  --dsw-font-xs-strong-13: 600 13px/20px var(--dsw-font-family) !important;
  --dsw-font-xs-strong-13-font-family: var(--dsw-font-family) !important;
  --dsw-font-xs-strong-13-font-weight: 600 !important;
  --dsw-font-xs-strong-13-line-height: 20px !important;
  --dsw-font-xs-strong-13-font-size: 13px !important;
  --dsw-font-xs-strong-13-font-style: normal !important;

  --dsw-font-xxs-12: 400 12px/18px var(--dsw-font-family) !important;
  --dsw-font-xxs-12-font-family: var(--dsw-font-family) !important;
  --dsw-font-xxs-12-font-weight: 400 !important;
  --dsw-font-xxs-12-line-height: 18px !important;
  --dsw-font-xxs-12-font-size: 12px !important;
  --dsw-font-xxs-12-font-style: normal !important;

  --dsw-font-xxs-strong-12: 600 12px/18px var(--dsw-font-family) !important;
  --dsw-font-xxs-strong-12-font-family: var(--dsw-font-family) !important;
  --dsw-font-xxs-strong-12-font-weight: 600 !important;
  --dsw-font-xxs-strong-12-line-height: 18px !important;
  --dsw-font-xxs-strong-12-font-size: 12px !important;
  --dsw-font-xxs-strong-12-font-style: normal !important;

  --dsw-font-xxxs-11: 400 11px/16px var(--dsw-font-family) !important;
  --dsw-font-xxxs-11-font-family: var(--dsw-font-family) !important;
  --dsw-font-xxxs-11-font-weight: 400 !important;
  --dsw-font-xxxs-11-line-height: 16px !important;
  --dsw-font-xxxs-11-font-size: 11px !important;
  --dsw-font-xxxs-11-font-style: normal !important;

  --dsw-font-xxxs-strong-11: 600 11px/16px var(--dsw-font-family) !important;
  --dsw-font-xxxs-strong-11-font-family: var(--dsw-font-family) !important;
  --dsw-font-xxxs-strong-11-font-weight: 600 !important;
  --dsw-font-xxxs-strong-11-line-height: 16px !important;
  --dsw-font-xxxs-strong-11-font-size: 11px !important;
  --dsw-font-xxxs-strong-11-font-style: normal !important;
}

/* ========================================================================== */
/* 02. Official static scales                                                  */
/* ========================================================================== */

body {
  --dsw-static-amber-100: #fff3dc !important;
  --dsw-static-amber-400: #ffc96d !important;
  --dsw-static-amber-500: #efa943 !important;
  --dsw-static-amber-600: #c97b20 !important;
  --dsw-static-amber-900: #49320e !important;

  --dsw-static-blue-50: #eff7ff !important;
  --dsw-static-blue-50p: #eaf4ff !important;
  --dsw-static-blue-75: #e5f1ff !important;
  --dsw-static-blue-100: #d9eaff !important;
  --dsw-static-blue-300: #9bc8ff !important;
  --dsw-static-blue-400: #70adff !important;
  --dsw-static-blue-450: #5b98ff !important;
  --dsw-static-blue-500: #447cff !important;
  --dsw-static-blue-600: #315ee7 !important;
  --dsw-static-blue-800: #213f9f !important;
  --dsw-static-blue-900: #182d72 !important;
  --dsw-static-blue-950: #101c49 !important;

  --dsw-static-deepseek-50: #f3f0ff !important;
  --dsw-static-deepseek-100: #e9e4ff !important;
  --dsw-static-deepseek-200: #d9d0ff !important;
  --dsw-static-deepseek-300: #c3b4ff !important;
  --dsw-static-deepseek-400: #a18cff !important;
  --dsw-static-deepseek-450: #907cff !important;
  --dsw-static-deepseek-500: #7564f6 !important;
  --dsw-static-deepseek-600: #6352d9 !important;
  --dsw-static-deepseek-700-delete: #5042b0 !important;
  --dsw-static-deepseek-800: #352f68 !important;
  --dsw-static-deepseek-900: #252342 !important;

  --dsw-static-green-100: #ddf8ed !important;
  --dsw-static-green-400: #55d7a8 !important;
  --dsw-static-green-500: #22b987 !important;
  --dsw-static-green-900: #143f31 !important;

  --dsw-static-red-50: #fff0f3 !important;
  --dsw-static-red-100: #ffe0e7 !important;
  --dsw-static-red-400: #ff8098 !important;
  --dsw-static-red-500: #e55370 !important;
  --dsw-static-red-600: #c63857 !important;
  --dsw-static-red-900: #551827 !important;

  --dsw-static-neutral-00: #ffffff !important;
  --dsw-static-neutral-50: #fafbff !important;
  --dsw-static-neutral-100: #f4f5fa !important;
  --dsw-static-neutral-150: #eceef5 !important;
  --dsw-static-neutral-200: #e3e5ee !important;
  --dsw-static-neutral-250: #d9dce8 !important;
  --dsw-static-neutral-300: #cdd1de !important;
  --dsw-static-neutral-400: #a8adbd !important;
  --dsw-static-neutral-500: #858b9e !important;
  --dsw-static-neutral-550: #747a8d !important;
  --dsw-static-neutral-600: #63697b !important;
  --dsw-static-neutral-700: #4d5263 !important;
  --dsw-static-neutral-800: #333746 !important;
  --dsw-static-neutral-850: #272b38 !important;
  --dsw-static-neutral-900: #171a24 !important;
  --dsw-static-neutral-1000: #06070c !important;

  --dsw-static-neutral-bluish-00: #ffffff !important;
  --dsw-static-neutral-bluish-50: #fafbff !important;
  --dsw-static-neutral-bluish-60: #f7f8fd !important;
  --dsw-static-neutral-bluish-75: #f1f3fa !important;
  --dsw-static-neutral-bluish-100: #eaecf5 !important;
  --dsw-static-neutral-bluish-150: #e3e6f0 !important;
  --dsw-static-neutral-bluish-200: #d9dde9 !important;
  --dsw-static-neutral-bluish-300: #c7ccd9 !important;
  --dsw-static-neutral-bluish-400: #a5abbd !important;
  --dsw-static-neutral-bluish-500: #858ca1 !important;
  --dsw-static-neutral-bluish-600: #6a7187 !important;
  --dsw-static-neutral-bluish-700: #50566a !important;
  --dsw-static-neutral-bluish-750: #41475b !important;
  --dsw-static-neutral-bluish-800: #323748 !important;
  --dsw-static-neutral-bluish-850: #282c3b !important;
  --dsw-static-neutral-bluish-875: #212532 !important;
  --dsw-static-neutral-bluish-900: #181b27 !important;
  --dsw-static-neutral-bluish-950: #0d101a !important;
  --dsw-static-neutral-bluish-1000: #060710 !important;
}

/* ========================================================================== */
/* 03. Light palette — all official alias/specific tokens                      */
/* ========================================================================== */

body:not([data-ds-dark-theme]) {
  --aurora-canvas: #eef1f9;
  --aurora-surface-0: rgb(247 248 253 / 88%);
  --aurora-surface-1: rgb(255 255 255 / 72%);
  --aurora-surface-2: rgb(255 255 255 / 88%);
  --aurora-surface-3: rgb(255 255 255 / 96%);
  --aurora-ink: #181a2a;
  --aurora-ink-2: #4c5068;
  --aurora-ink-3: #777c93;
  --aurora-ink-4: #a0a5b8;
  --aurora-line-1: rgb(39 43 70 / 6%);
  --aurora-line-2: rgb(39 43 70 / 11%);
  --aurora-line-3: rgb(39 43 70 / 17%);
  --aurora-line-4: rgb(39 43 70 / 25%);

  --dsw-alias-bg-base: var(--aurora-surface-0) !important;
  --dsw-alias-bg-layer-1: var(--aurora-surface-1) !important;
  --dsw-alias-bg-layer-2: var(--aurora-surface-2) !important;
  --dsw-alias-bg-layer-3: var(--aurora-surface-3) !important;
  --dsw-alias-bg-mask-1: rgb(18 20 36 / 28%) !important;
  --dsw-alias-bg-mask-2: rgb(18 20 36 / 14%) !important;
  --dsw-alias-bg-mask-3: rgb(18 20 36 / 48%) !important;
  --dsw-alias-bg-mask-photo: rgb(7 8 15 / 90%) !important;
  --dsw-alias-bg-module-platform: rgb(242 244 251 / 86%) !important;
  --dsw-alias-bg-multi-select: rgb(235 238 249 / 88%) !important;
  --dsw-alias-bg-overlay: rgb(224 228 240 / 94%) !important;
  --dsw-alias-bg-skeleton: rgb(70 75 112 / 7%) !important;

  --dsw-alias-border-inverted2: rgb(255 255 255 / 66%) !important;
  --dsw-alias-border-inverted: rgb(255 255 255 / 82%) !important;
  --dsw-alias-border-l1: var(--aurora-line-1) !important;
  --dsw-alias-border-l2-darkmode-thin: rgb(39 43 70 / 9%) !important;
  --dsw-alias-border-l2: var(--aurora-line-2) !important;
  --dsw-alias-border-l3: var(--aurora-line-3) !important;
  --dsw-alias-border-l4: var(--aurora-line-4) !important;

  --dsw-alias-brand-primary-invert: #ffffff !important;
  --dsw-alias-brand-primary-new-colorprimary-new-color: #685cf6 !important;
  --dsw-alias-brand-primary: #685cf6 !important;
  --dsw-alias-brand-text: #5547e7 !important;

  --dsw-alias-button-contrast-fill: #35394c !important;
  --dsw-alias-button-elevated-fill: rgb(255 255 255 / 84%) !important;
  --dsw-alias-button-floating-fill: rgb(255 255 255 / 88%) !important;
  --dsw-alias-button-floating-hover: rgb(244 245 252 / 98%) !important;
  --dsw-alias-button-ghost-active-border: rgb(104 92 246 / 42%) !important;
  --dsw-alias-button-ghost-active-fill: rgb(104 92 246 / 11%) !important;
  --dsw-alias-button-ghost-active-hover: rgb(104 92 246 / 16%) !important;
  --dsw-alias-button-info-fill: #685cf6 !important;
  --dsw-alias-button-info-hover: #5648e5 !important;
  --dsw-alias-button-primary-dimmed: rgb(104 92 246 / 13%) !important;
  --dsw-alias-button-primary-fill: linear-gradient(135deg, #7568ff 0%, #6559f4 48%, #25bdd2 125%) !important;
  --dsw-alias-button-primary-hover: linear-gradient(135deg, #6658f4 0%, #5548e5 50%, #16a9c1 125%) !important;
  --dsw-alias-button-tool-bar-fill-invisible: rgb(34 37 55 / 24%) !important;
  --dsw-alias-button-tool-bar-fill: rgb(42 45 65 / 46%) !important;
  --dsw-alias-button-tool-bar-hover: rgb(42 45 65 / 58%) !important;

  --dsw-alias-interactive-bg-active: rgb(104 92 246 / 14%) !important;
  --dsw-alias-interactive-bg-hover-accent: rgb(104 92 246 / 17%) !important;
  --dsw-alias-interactive-bg-hover-danger: rgb(229 83 112 / 9%) !important;
  --dsw-alias-interactive-bg-hover-solid: #eceefa !important;
  --dsw-alias-interactive-bg-hover: rgb(75 80 113 / 7%) !important;

  --dsw-alias-label-caption: var(--aurora-ink-4) !important;
  --dsw-alias-label-dimmed: #c1c5d3 !important;
  --dsw-alias-label-primary-bluish: #5547d8 !important;
  --dsw-alias-label-primary-dimmed: #555a70 !important;
  --dsw-alias-label-primary-foreground: #ffffff !important;
  --dsw-alias-label-primary-inverted: #ffffff !important;
  --dsw-alias-label-primary: var(--aurora-ink) !important;
  --dsw-alias-label-secondary: var(--aurora-ink-2) !important;
  --dsw-alias-label-tertiary: var(--aurora-ink-3) !important;

  --dsw-alias-markdown-citation: rgb(104 92 246 / 18%) !important;
  --dsw-alias-markdown-code-block-banner: rgb(239 240 248 / 96%) !important;
  --dsw-alias-markdown-code-block: rgb(244 245 251 / 96%) !important;
  --dsw-alias-markdown-code-segment-selected: #ffffff !important;
  --dsw-alias-markdown-code-segment-unselected: #eceef7 !important;
  --dsw-alias-markdown-inline-code: rgb(104 92 246 / 11%) !important;
  --dsw-alias-markdown-placeholder: rgb(239 241 248 / 92%) !important;
  --dsw-alias-markdown-tag: rgb(104 92 246 / 10%) !important;

  --dsw-alias-scrollbar-bg-l1: rgb(74 79 107 / 20%) !important;
  --dsw-alias-scrollbar-bg-l2: rgb(74 79 107 / 28%) !important;
  --dsw-alias-scrollbar-hover-l1: rgb(104 92 246 / 38%) !important;
  --dsw-alias-scrollbar-hover-l2: rgb(104 92 246 / 48%) !important;

  --dsw-alias-state-business-primary: #685cf6 !important;
  --dsw-alias-state-business-tertiary: rgb(104 92 246 / 12%) !important;
  --dsw-alias-state-error-primary: #cf4563 !important;
  --dsw-alias-state-error-secondary: #ee7890 !important;
  --dsw-alias-state-success-primary: #169f73 !important;
  --dsw-alias-state-success-secondary: #4bc89b !important;
  --dsw-alias-state-success-tertiary: rgb(22 159 115 / 12%) !important;
  --dsw-alias-state-warn-label: #a96813 !important;
  --dsw-alias-state-warn-primary: #df9630 !important;
  --dsw-alias-state-warn-secondary: #f2bb62 !important;
  --dsw-alias-state-warn-tertiary: rgb(223 150 48 / 14%) !important;

  --dsw-alias-toast-bg: #303447 !important;
  --dsw-alias-tooltip-bg: #272a3a !important;

  --dsw-specific-bubble-highlight: linear-gradient(135deg, rgb(104 92 246 / 22%), rgb(27 191 214 / 18%)) !important;
  --dsw-specific-bubble: linear-gradient(135deg, rgb(104 92 246 / 13%), rgb(36 190 212 / 10%)) !important;
  --dsw-specific-input-major: rgb(255 255 255 / 82%) !important;
  --dsw-specific-login-input: rgb(247 248 253 / 92%) !important;
  --dsw-specific-menu: rgb(255 255 255 / 92%) !important;
  --dsw-specific-selector: rgb(104 92 246 / 10%) !important;
  --dsw-specific-sidebar-fill: rgb(242 244 251 / 78%) !important;
  --dsw-specific-sidebar-nav-item-active-accent: rgb(104 92 246 / 16%) !important;
  --dsw-specific-sidebar-nav-item-active: linear-gradient(90deg, rgb(104 92 246 / 14%), rgb(27 191 214 / 8%)) !important;
  --dsw-specific-sidebar-nav-item-hover: rgb(75 80 113 / 7%) !important;
  --dsw-specific-tip: rgb(244 246 252 / 88%) !important;

  /* Official components currently consume these three compatibility names. */
  --dsw-alias-label-quaternary: #bec2d0 !important;
  --dsw-alias-line-secondary: rgb(39 43 70 / 10%) !important;
  --dsw-alias-separator-primary: #b4b8c8 !important;

  --dsw-linear-gradient-think: linear-gradient(180deg, rgb(247 248 253 / 96%) 18%, rgb(247 248 253 / 0%) 100%) !important;
  --dsw-linear-think-select: linear-gradient(180deg, rgb(235 238 249 / 96%) 18%, rgb(235 238 249 / 0%) 100%) !important;
  --dsw-shadow-lv1: 0 1px 2px rgb(35 38 58 / 5%), 0 8px 24px rgb(43 48 84 / 7%) !important;
  --dsw-shadow-lv1-blur: 0 8px 30px rgb(43 48 84 / 7%) !important;
  --dsw-shadow-lv2: 0 2px 5px rgb(35 38 58 / 7%), 0 16px 42px rgb(43 48 84 / 12%) !important;
  --dsw-shadow-lv3: 0 1px 1px rgb(35 38 58 / 8%), 0 20px 60px rgb(43 48 84 / 18%), 0 0 0 1px rgb(255 255 255 / 65%) inset !important;
  --dsw-mask-blur: blur(18px) saturate(1.18) !important;

  --shiki-foreground: #25283a !important;
  --shiki-background: var(--dsw-alias-markdown-code-block) !important;
  --shiki-token-constant: #4f62d8 !important;
  --shiki-token-string: #16815e !important;
  --shiki-token-comment: #8b90a7 !important;
  --shiki-token-keyword: #bd3e74 !important;
  --shiki-token-parameter: #b75d19 !important;
  --shiki-token-function: #6a43c4 !important;
  --shiki-token-string-expression: #19795a !important;
  --shiki-token-punctuation: #555a70 !important;
  --shiki-token-link: #1676b7 !important;
}

/* ========================================================================== */
/* 04. Dark palette — all official alias/specific tokens                       */
/* ========================================================================== */

body[data-ds-dark-theme] {
  --aurora-canvas: #070912;
  --aurora-surface-0: rgb(8 10 20 / 88%);
  --aurora-surface-1: rgb(14 17 30 / 82%);
  --aurora-surface-2: rgb(20 23 39 / 90%);
  --aurora-surface-3: rgb(27 31 51 / 96%);
  --aurora-ink: #f4f5ff;
  --aurora-ink-2: #c1c5dc;
  --aurora-ink-3: #8e94ad;
  --aurora-ink-4: #676e89;
  --aurora-line-1: rgb(218 223 255 / 7%);
  --aurora-line-2: rgb(218 223 255 / 12%);
  --aurora-line-3: rgb(218 223 255 / 18%);
  --aurora-line-4: rgb(218 223 255 / 27%);

  --dsw-alias-bg-base: var(--aurora-surface-0) !important;
  --dsw-alias-bg-layer-1: var(--aurora-surface-1) !important;
  --dsw-alias-bg-layer-2: var(--aurora-surface-2) !important;
  --dsw-alias-bg-layer-3: var(--aurora-surface-3) !important;
  --dsw-alias-bg-mask-1: rgb(0 1 7 / 62%) !important;
  --dsw-alias-bg-mask-2: rgb(0 1 7 / 30%) !important;
  --dsw-alias-bg-mask-3: rgb(0 1 7 / 72%) !important;
  --dsw-alias-bg-mask-photo: rgb(0 0 4 / 94%) !important;
  --dsw-alias-bg-module-platform: rgb(28 32 53 / 84%) !important;
  --dsw-alias-bg-multi-select: rgb(34 38 62 / 86%) !important;
  --dsw-alias-bg-overlay: rgb(52 57 84 / 94%) !important;
  --dsw-alias-bg-skeleton: rgb(231 234 255 / 8%) !important;

  --dsw-alias-border-inverted2: rgb(255 255 255 / 9%) !important;
  --dsw-alias-border-inverted: rgb(255 255 255 / 8%) !important;
  --dsw-alias-border-l1: var(--aurora-line-1) !important;
  --dsw-alias-border-l2-darkmode-thin: rgb(218 223 255 / 9%) !important;
  --dsw-alias-border-l2: var(--aurora-line-2) !important;
  --dsw-alias-border-l3: var(--aurora-line-3) !important;
  --dsw-alias-border-l4: var(--aurora-line-4) !important;

  --dsw-alias-brand-primary-invert: #111426 !important;
  --dsw-alias-brand-primary-new-colorprimary-new-color: #9183ff !important;
  --dsw-alias-brand-primary: #9183ff !important;
  --dsw-alias-brand-text: #ada4ff !important;

  --dsw-alias-button-contrast-fill: #f1f3ff !important;
  --dsw-alias-button-elevated-fill: rgb(35 39 62 / 90%) !important;
  --dsw-alias-button-floating-fill: rgb(29 33 53 / 92%) !important;
  --dsw-alias-button-floating-hover: rgb(40 45 70 / 98%) !important;
  --dsw-alias-button-ghost-active-border: rgb(145 131 255 / 48%) !important;
  --dsw-alias-button-ghost-active-fill: rgb(145 131 255 / 16%) !important;
  --dsw-alias-button-ghost-active-hover: rgb(145 131 255 / 22%) !important;
  --dsw-alias-button-info-fill: #8376ff !important;
  --dsw-alias-button-info-hover: #9a8fff !important;
  --dsw-alias-button-primary-dimmed: rgb(145 131 255 / 18%) !important;
  --dsw-alias-button-primary-fill: linear-gradient(135deg, #8f82ff 0%, #7467f8 48%, #34cde1 125%) !important;
  --dsw-alias-button-primary-hover: linear-gradient(135deg, #a094ff 0%, #887bff 50%, #48d7e8 125%) !important;
  --dsw-alias-button-tool-bar-fill-invisible: rgb(8 10 20 / 42%) !important;
  --dsw-alias-button-tool-bar-fill: rgb(75 80 111 / 52%) !important;
  --dsw-alias-button-tool-bar-hover: rgb(91 97 132 / 64%) !important;

  --dsw-alias-interactive-bg-active: rgb(145 131 255 / 18%) !important;
  --dsw-alias-interactive-bg-hover-accent: rgb(145 131 255 / 24%) !important;
  --dsw-alias-interactive-bg-hover-danger: rgb(255 111 142 / 15%) !important;
  --dsw-alias-interactive-bg-hover-solid: #242942 !important;
  --dsw-alias-interactive-bg-hover: rgb(223 227 255 / 8%) !important;

  --dsw-alias-label-caption: var(--aurora-ink-4) !important;
  --dsw-alias-label-dimmed: #4f566e !important;
  --dsw-alias-label-primary-bluish: #c2bcff !important;
  --dsw-alias-label-primary-dimmed: #aeb3ca !important;
  --dsw-alias-label-primary-foreground: #0b0d17 !important;
  --dsw-alias-label-primary-inverted: #121528 !important;
  --dsw-alias-label-primary: var(--aurora-ink) !important;
  --dsw-alias-label-secondary: var(--aurora-ink-2) !important;
  --dsw-alias-label-tertiary: var(--aurora-ink-3) !important;

  --dsw-alias-markdown-citation: rgb(145 131 255 / 28%) !important;
  --dsw-alias-markdown-code-block-banner: rgb(23 27 46 / 98%) !important;
  --dsw-alias-markdown-code-block: rgb(13 16 29 / 96%) !important;
  --dsw-alias-markdown-code-segment-selected: #292e49 !important;
  --dsw-alias-markdown-code-segment-unselected: #171b2e !important;
  --dsw-alias-markdown-inline-code: rgb(145 131 255 / 17%) !important;
  --dsw-alias-markdown-placeholder: rgb(23 27 45 / 92%) !important;
  --dsw-alias-markdown-tag: rgb(145 131 255 / 16%) !important;

  --dsw-alias-scrollbar-bg-l1: rgb(183 190 224 / 20%) !important;
  --dsw-alias-scrollbar-bg-l2: rgb(183 190 224 / 28%) !important;
  --dsw-alias-scrollbar-hover-l1: rgb(145 131 255 / 46%) !important;
  --dsw-alias-scrollbar-hover-l2: rgb(145 131 255 / 58%) !important;

  --dsw-alias-state-business-primary: #9183ff !important;
  --dsw-alias-state-business-tertiary: rgb(145 131 255 / 17%) !important;
  --dsw-alias-state-error-primary: #ff7895 !important;
  --dsw-alias-state-error-secondary: #ff9aae !important;
  --dsw-alias-state-success-primary: #49d7a5 !important;
  --dsw-alias-state-success-secondary: #72e5bc !important;
  --dsw-alias-state-success-tertiary: rgb(73 215 165 / 15%) !important;
  --dsw-alias-state-warn-label: #ffc66d !important;
  --dsw-alias-state-warn-primary: #f5b95c !important;
  --dsw-alias-state-warn-secondary: #ffd184 !important;
  --dsw-alias-state-warn-tertiary: rgb(245 185 92 / 16%) !important;

  --dsw-alias-toast-bg: #333851 !important;
  --dsw-alias-tooltip-bg: #34394f !important;

  --dsw-specific-bubble-highlight: linear-gradient(135deg, rgb(145 131 255 / 31%), rgb(52 205 225 / 22%)) !important;
  --dsw-specific-bubble: linear-gradient(135deg, rgb(145 131 255 / 20%), rgb(52 205 225 / 12%)) !important;
  --dsw-specific-input-major: rgb(18 21 36 / 88%) !important;
  --dsw-specific-login-input: rgb(11 14 26 / 94%) !important;
  --dsw-specific-menu: rgb(24 28 47 / 94%) !important;
  --dsw-specific-selector: rgb(145 131 255 / 16%) !important;
  --dsw-specific-sidebar-fill: rgb(9 12 24 / 86%) !important;
  --dsw-specific-sidebar-nav-item-active-accent: rgb(145 131 255 / 24%) !important;
  --dsw-specific-sidebar-nav-item-active: linear-gradient(90deg, rgb(145 131 255 / 20%), rgb(52 205 225 / 10%)) !important;
  --dsw-specific-sidebar-nav-item-hover: rgb(223 227 255 / 8%) !important;
  --dsw-specific-tip: rgb(25 29 48 / 90%) !important;

  --dsw-alias-label-quaternary: #50576f !important;
  --dsw-alias-line-secondary: rgb(218 223 255 / 10%) !important;
  --dsw-alias-separator-primary: #596078 !important;

  --dsw-linear-gradient-think: linear-gradient(180deg, rgb(8 10 20 / 98%) 18%, rgb(8 10 20 / 0%) 100%) !important;
  --dsw-linear-think-select: linear-gradient(180deg, rgb(31 35 57 / 98%) 18%, rgb(31 35 57 / 0%) 100%) !important;
  --dsw-shadow-lv1: 0 1px 2px rgb(0 0 0 / 26%), 0 10px 28px rgb(0 0 0 / 20%) !important;
  --dsw-shadow-lv1-blur: 0 12px 34px rgb(0 0 0 / 22%) !important;
  --dsw-shadow-lv2: 0 3px 8px rgb(0 0 0 / 28%), 0 20px 52px rgb(0 0 0 / 34%) !important;
  --dsw-shadow-lv3: 0 1px 1px rgb(255 255 255 / 6%) inset, 0 26px 80px rgb(0 0 0 / 52%), 0 0 50px rgb(104 92 246 / 10%) !important;
  --dsw-mask-blur: blur(22px) saturate(1.24) !important;

  --shiki-foreground: #e8eaff !important;
  --shiki-background: var(--dsw-alias-markdown-code-block) !important;
  --shiki-token-constant: #91a7ff !important;
  --shiki-token-string: #70e0b3 !important;
  --shiki-token-comment: #737b99 !important;
  --shiki-token-keyword: #ff8fba !important;
  --shiki-token-parameter: #ffc27a !important;
  --shiki-token-function: #c3a8ff !important;
  --shiki-token-string-expression: #8ce7bd !important;
  --shiki-token-punctuation: #c5cae0 !important;
  --shiki-token-link: #65d8ff !important;
}

/* ========================================================================== */
/* 05. Canvas, native controls, selection, scrollbar                           */
/* ========================================================================== */

html {
  background: var(--aurora-canvas);
}

body {
  min-width: 320px;
  margin: 0;
  overflow: hidden;
  background-color: var(--aurora-canvas);
  background-image:
    radial-gradient(circle at 12% 8%, rgb(104 92 246 / 16%), transparent 32%),
    radial-gradient(circle at 88% 12%, rgb(27 191 214 / 13%), transparent 30%),
    radial-gradient(circle at 72% 92%, rgb(200 92 255 / 10%), transparent 34%),
    linear-gradient(145deg, var(--aurora-canvas), color-mix(in srgb, var(--aurora-canvas) 84%, #8796ff));
  background-size: 120% 120%, 120% 120%, 130% 130%, 100% 100%;
  background-attachment: fixed;
  color: var(--dsw-alias-label-primary);
  font-family: var(--dsw-font-family);
  font-feature-settings: 'cv02', 'cv03', 'cv04', 'cv11';
  font-kerning: normal;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  accent-color: var(--dsw-alias-state-business-primary);
  animation: aurora-canvas-drift 24s var(--ds-ease-in-out) infinite alternate;
}

body[data-ds-dark-theme] {
  background-image:
    radial-gradient(circle at 10% 4%, rgb(104 92 246 / 25%), transparent 34%),
    radial-gradient(circle at 92% 10%, rgb(27 191 214 / 18%), transparent 32%),
    radial-gradient(circle at 72% 96%, rgb(200 92 255 / 13%), transparent 38%),
    linear-gradient(145deg, #060811, #0a0d19 54%, #080a14);
}

::selection {
  background: color-mix(in srgb, var(--dsw-alias-state-business-primary) 34%, transparent);
  color: var(--dsw-alias-label-primary);
}

:where(button, input, textarea, select) {
  font-family: var(--dsw-font-family);
}

:where(code, pre, kbd, samp) {
  font-family: var(--ds-font-family-code);
  font-variant-ligatures: contextual;
}

:where(input, textarea, select):not([data-phase]) {
  transition:
    border-color var(--ds-transition-duration-fast) var(--ds-ease-in-out),
    background-color var(--ds-transition-duration-fast) var(--ds-ease-in-out),
    box-shadow var(--ds-transition-duration) var(--ds-ease-in-out);
}

:where(button, a, input, textarea, select, [role='treeitem'], [role='menuitem'], [tabindex]):focus-visible {
  outline: 2px solid color-mix(in srgb, var(--dsw-alias-state-business-primary) 78%, white 22%);
  outline-offset: 2px;
}

:where(button, [role='menuitem'], [role='treeitem']) {
  transition:
    color var(--ds-transition-duration-fast) var(--ds-ease-in-out),
    background-color var(--ds-transition-duration-fast) var(--ds-ease-in-out),
    border-color var(--ds-transition-duration-fast) var(--ds-ease-in-out),
    box-shadow var(--ds-transition-duration) var(--ds-ease-in-out),
    filter var(--ds-transition-duration-fast) var(--ds-ease-in-out);
}

:where(button, [role='menuitem']):active:not(:disabled) {
  filter: brightness(0.96) saturate(1.05);
}

::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

::-webkit-scrollbar-thumb {
  min-height: 36px;
  border: 3px solid transparent;
  border-radius: 999px;
  background: var(--dsh-scrollbar-thumb);
  background-clip: padding-box;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--dsh-scrollbar-thumb-hover);
  background-clip: padding-box;
}

/* ========================================================================== */
/* 06. Progressive enhancement: frame, sidebar, navigation                    */
/* ========================================================================== */

/* AppFrame is identified by its documented column class hooks. */
div[class*='_frame']:has(> [class*='_sidebarCol']) {
  background:
    radial-gradient(circle at 18% 4%, color-mix(in srgb, var(--dsw-alias-state-business-primary) 10%, transparent), transparent 30%),
    radial-gradient(circle at 82% 92%, color-mix(in srgb, var(--aurora-accent-2) 8%, transparent), transparent 34%),
    var(--dsw-alias-bg-base);
}

[class*='_sidebarCol'] {
  border-right-color: color-mix(in srgb, var(--dsw-alias-border-l2) 84%, transparent) !important;
  box-shadow: 12px 0 40px rgb(20 23 45 / 4%);
}

body[data-ds-dark-theme] [class*='_sidebarCol'] {
  box-shadow: 18px 0 54px rgb(0 0 0 / 20%);
}

[class*='_detailsCol'] {
  border-left-color: var(--dsw-alias-border-l2) !important;
  box-shadow: -16px 0 46px rgb(20 23 45 / 5%);
}

button[class*='_newSession'] {
  border-color: color-mix(in srgb, var(--dsw-alias-state-business-primary) 22%, var(--dsw-alias-border-l2));
  box-shadow: var(--dsw-shadow-lv1);
  backdrop-filter: blur(16px) saturate(1.15);
}

button[class*='_newSession']:hover:not(:disabled) {
  border-color: color-mix(in srgb, var(--dsw-alias-state-business-primary) 44%, var(--dsw-alias-border-l2));
  box-shadow: 0 10px 28px color-mix(in srgb, var(--dsw-alias-state-business-primary) 13%, transparent);
}

/* Sidebar settings is a compact utility control, not a full-width hover pill. */
[class*='_footArea'] > button[class*='_trigger'] {
  position: relative;
  border: 1px solid transparent !important;
  background: transparent !important;
  color: var(--dsw-alias-label-secondary) !important;
  text-align: left;
  transition:
    color var(--ds-transition-duration-fast) var(--ds-ease-in-out),
    border-color var(--ds-transition-duration-fast) var(--ds-ease-in-out),
    background var(--ds-transition-duration-fast) var(--ds-ease-in-out),
    box-shadow var(--ds-transition-duration) var(--ds-ease-in-out),
    transform var(--ds-transition-duration-fast) var(--ds-ease-in-out);
}

[class*='_footArea'] > button[class*='_trigger']:not([class*='_rail']) {
  inline-size: fit-content !important;
  block-size: 40px !important;
  min-inline-size: 0;
  margin: 8px 0 1px !important;
  padding: 5px 10px 5px 6px !important;
  gap: 8px !important;
  border-radius: 12px !important;
}

[class*='_footArea'] > button[class*='_trigger'] > svg {
  box-sizing: border-box;
  inline-size: 28px !important;
  block-size: 28px !important;
  padding: 5px;
  border: 1px solid color-mix(in srgb, var(--dsw-alias-state-business-primary) 18%, transparent);
  border-radius: 9px;
  background: color-mix(in srgb, var(--dsw-alias-state-business-primary) 8%, transparent);
  color: var(--dsw-alias-state-business-primary);
  transition:
    color var(--ds-transition-duration-fast) var(--ds-ease-in-out),
    border-color var(--ds-transition-duration-fast) var(--ds-ease-in-out),
    background-color var(--ds-transition-duration-fast) var(--ds-ease-in-out),
    transform var(--ds-transition-duration) var(--ds-ease-in-out);
}

[class*='_footArea'] > button[class*='_trigger'] [class*='_triggerLabel'] {
  font-size: 13px;
  font-weight: 550;
  line-height: 20px;
  letter-spacing: -0.01em;
}

[class*='_footArea'] > button[class*='_trigger']:hover:not(:disabled),
[class*='_footArea'] > button[class*='_trigger'][aria-expanded='true'] {
  border-color: color-mix(in srgb, var(--dsw-alias-state-business-primary) 22%, var(--dsw-alias-border-l1)) !important;
  background:
    linear-gradient(135deg,
      color-mix(in srgb, var(--dsw-alias-bg-layer-2) 88%, transparent),
      color-mix(in srgb, var(--dsw-alias-state-business-primary) 9%, var(--dsw-alias-bg-layer-1))) !important;
  color: var(--dsw-alias-label-primary) !important;
  box-shadow:
    0 8px 22px color-mix(in srgb, var(--dsw-alias-state-business-primary) 10%, transparent),
    inset 0 1px 0 color-mix(in srgb, white 52%, transparent);
  transform: translateY(-1px);
}

[class*='_footArea'] > button[class*='_trigger']:hover:not(:disabled) > svg,
[class*='_footArea'] > button[class*='_trigger'][aria-expanded='true'] > svg {
  border-color: color-mix(in srgb, var(--dsw-alias-state-business-primary) 34%, transparent);
  background: color-mix(in srgb, var(--dsw-alias-state-business-primary) 14%, transparent);
  transform: rotate(-5deg) scale(1.04);
}

[class*='_footArea'] > button[class*='_trigger']:active:not(:disabled) {
  box-shadow: none;
  transform: translateY(0) scale(0.98);
}

[class*='_footArea'] > button[class*='_trigger'][class*='_rail'] {
  border-radius: 11px !important;
}

[role='treeitem'] {
  border-radius: 11px;
}

[role='treeitem'][aria-selected='true'] {
  background: var(--dsw-specific-sidebar-nav-item-active);
  box-shadow: inset 2px 0 0 var(--dsw-alias-state-business-primary);
}

[role='treeitem']:hover:not([aria-selected='true']) {
  background: var(--dsw-specific-sidebar-nav-item-hover);
}

[class*='_fade'] {
  opacity: 0.86;
}

/* ========================================================================== */
/* 07. Composer: prismatic input material                                      */
/* ========================================================================== */

@property --aurora-orbit {
  syntax: '<angle>';
  inherits: false;
  initial-value: 0deg;
}

[data-composer-card] {
  isolation: isolate;
  border-color: color-mix(in srgb, var(--dsw-alias-state-business-primary) 18%, var(--dsw-alias-border-l2));
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--dsw-specific-input-major) 92%, white 8%), var(--dsw-specific-input-major));
  box-shadow:
    var(--dsw-shadow-lv2),
    0 0 0 1px color-mix(in srgb, var(--dsw-alias-state-business-primary) 5%, transparent) inset;
  transition:
    border-color var(--ds-transition-duration) var(--ds-ease-in-out),
    box-shadow var(--ds-transition-duration-slow) var(--ds-ease-in-out),
    background-color var(--ds-transition-duration) var(--ds-ease-in-out);
}

[data-composer-card]::before {
  position: absolute;
  z-index: -1;
  inset: -1px;
  padding: 1px;
  border-radius: inherit;
  background: conic-gradient(
    from var(--aurora-orbit),
    transparent 0 18%,
    color-mix(in srgb, var(--aurora-accent) 80%, transparent) 28%,
    color-mix(in srgb, var(--aurora-accent-2) 82%, transparent) 42%,
    transparent 54% 76%,
    color-mix(in srgb, var(--aurora-accent-3) 70%, transparent) 86%,
    transparent 96%
  );
  content: '';
  opacity: 0.18;
  pointer-events: none;
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  animation: aurora-border-orbit 8s linear infinite paused;
  transition: opacity var(--ds-transition-duration) var(--ds-ease-in-out);
}

[data-composer-card]:hover::before,
[data-composer-card]:focus-within::before {
  opacity: 0.92;
  animation-play-state: running;
}

[data-composer-card]:focus-within {
  border-color: color-mix(in srgb, var(--dsw-alias-state-business-primary) 58%, var(--dsw-alias-border-l2));
  box-shadow:
    var(--dsw-shadow-lv2),
    0 0 0 4px color-mix(in srgb, var(--dsw-alias-state-business-primary) 11%, transparent),
    0 18px 60px color-mix(in srgb, var(--dsw-alias-state-business-primary) 12%, transparent);
}

[data-composer-card] textarea[data-phase] {
  caret-color: var(--dsw-alias-state-business-primary) !important;
}

[data-composer-card] button[class*='_primary'] {
  box-shadow:
    0 8px 20px color-mix(in srgb, var(--dsw-alias-state-business-primary) 30%, transparent),
    0 1px 0 rgb(255 255 255 / 30%) inset;
}

[data-composer-card] button[class*='_primary']:hover:not(:disabled) {
  box-shadow:
    0 10px 28px color-mix(in srgb, var(--dsw-alias-state-business-primary) 38%, transparent),
    0 1px 0 rgb(255 255 255 / 38%) inset;
  filter: saturate(1.12);
}

[data-composer-card] button[class*='_add'] {
  border: 1px solid color-mix(in srgb, var(--dsw-alias-state-business-primary) 14%, transparent);
}

/* ========================================================================== */
/* 08. Conversation, hero, messages                                            */
/* ========================================================================== */

[class*='_heroGlow'] {
  filter: hue-rotate(16deg) saturate(1.2) drop-shadow(0 28px 70px color-mix(in srgb, var(--dsw-alias-state-business-primary) 20%, transparent));
  animation: aurora-hero-breathe 8s var(--ds-ease-in-out) infinite alternate;
}

[class*='_headlineText'] {
  background: linear-gradient(115deg, var(--dsw-alias-label-primary) 12%, var(--dsw-alias-state-business-primary) 54%, var(--aurora-accent-2) 105%);
  background-clip: text;
  color: transparent !important;
  letter-spacing: -0.035em;
  text-wrap: balance;
}

[class*='_fish'] {
  filter: drop-shadow(0 8px 18px color-mix(in srgb, var(--dsw-alias-state-business-primary) 26%, transparent));
  animation: aurora-float 5s var(--ds-ease-in-out) infinite alternate;
}

[data-conversation-scroll] [class*='_flowItem'] {
  animation: aurora-message-in 480ms var(--ds-ease-in-out) both;
}

[data-time-hover-root] > [class*='_bubble'] {
  border: 1px solid color-mix(in srgb, var(--dsw-alias-state-business-primary) 14%, var(--dsw-alias-border-l1));
  box-shadow:
    0 10px 28px color-mix(in srgb, var(--dsw-alias-state-business-primary) 8%, transparent),
    0 1px 0 rgb(255 255 255 / 24%) inset;
}

[data-pending-steering] > [class*='_bubble'] {
  opacity: 0.78;
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--dsw-alias-state-business-primary) 22%, transparent) inset;
}

[data-ref-chip] {
  border: 1px solid color-mix(in srgb, var(--dsw-alias-state-business-primary) 25%, transparent);
  background: linear-gradient(135deg, color-mix(in srgb, var(--dsw-alias-state-business-primary) 18%, transparent), color-mix(in srgb, var(--aurora-accent-2) 12%, transparent)) !important;
  font-family: var(--ds-font-family-code);
  font-size: 0.8em !important;
  font-weight: 600;
  letter-spacing: -0.01em;
}

[class*='_turnStatus'] {
  filter: drop-shadow(0 0 12px color-mix(in srgb, var(--dsw-alias-state-business-primary) 16%, transparent));
}

[data-tool],
[class*='_card'][data-state] {
  border-radius: var(--aurora-radius-sm);
  transition: background-color var(--ds-transition-duration-fast) var(--ds-ease-in-out);
}

[data-tool]:hover,
[class*='_card'][data-state]:hover {
  background: color-mix(in srgb, var(--dsw-alias-interactive-bg-hover) 72%, transparent);
}

/* ========================================================================== */
/* 09. Markdown, code, terminal, diff, search, web                             */
/* ========================================================================== */

[class*='_markdown'] {
  letter-spacing: -0.006em;
}

[class*='_markdown'] :where(h1, h2, h3) {
  color: var(--dsw-alias-label-primary);
  letter-spacing: -0.035em;
  text-wrap: balance;
}

[class*='_markdown'] :where(h1, h2) {
  position: relative;
}

[class*='_markdown'] :where(h1, h2)::after {
  display: block;
  width: 48px;
  height: 2px;
  margin-top: 10px;
  border-radius: 99px;
  background: linear-gradient(90deg, var(--dsw-alias-state-business-primary), var(--aurora-accent-2), transparent);
  content: '';
  opacity: 0.7;
}

[class*='_markdown'] a {
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

[class*='_markdown'] blockquote {
  padding: 10px 14px !important;
  border-left: 3px solid var(--dsw-alias-state-business-primary) !important;
  border-radius: 0 12px 12px 0;
  background: linear-gradient(90deg, color-mix(in srgb, var(--dsw-alias-state-business-primary) 10%, transparent), transparent 78%);
  color: var(--dsw-alias-label-secondary);
}

[class*='_markdown'] hr {
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--dsw-alias-border-l3), transparent) !important;
}

[class*='_markdown'] :not(pre) > code {
  border: 1px solid color-mix(in srgb, var(--dsw-alias-state-business-primary) 16%, transparent);
  box-shadow: 0 1px 0 rgb(255 255 255 / 18%) inset;
}

[class*='_markdown'] table {
  overflow: hidden;
  border: 1px solid var(--dsw-alias-border-l2);
  border-radius: var(--aurora-radius-md);
  background: color-mix(in srgb, var(--dsw-alias-bg-layer-1) 86%, transparent);
}

[class*='_markdown'] th {
  background: color-mix(in srgb, var(--dsw-alias-bg-module-platform) 84%, transparent);
}

[class*='_markdown'] img {
  border: 1px solid var(--dsw-alias-border-l2);
  box-shadow: var(--dsw-shadow-lv2);
}

[class*='_markdown'] [class*='_block'],
:where(
  [class*='_ioCard'],
  [class*='_instructionsCard'],
  [class*='_codeBody'],
  [class*='_terminalBody'],
  [class*='_diffBody'],
  [class*='_readBody'],
  [class*='_searchBody'],
  [class*='_webBody']
) {
  border-color: color-mix(in srgb, var(--dsw-alias-state-business-primary) 10%, var(--dsw-alias-border-l1));
  box-shadow:
    0 12px 34px rgb(16 19 38 / 8%),
    0 1px 0 rgb(255 255 255 / 5%) inset;
}

pre.shiki {
  tab-size: 2;
}

/* ========================================================================== */
/* 10. Dialogs, settings, menus, tooltip                                       */
/* ========================================================================== */

[role='dialog'] {
  border: 1px solid var(--dsw-alias-border-inverted);
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--dsw-alias-bg-layer-2) 92%, white 8%), var(--dsw-alias-bg-layer-2));
  box-shadow: var(--dsw-shadow-lv3);
  animation: aurora-dialog-in 360ms var(--ds-ease-in-out) both;
}

body[data-ds-dark-theme] [role='dialog'] {
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--dsw-alias-bg-layer-2) 96%, #7787ff 4%), var(--dsw-alias-bg-layer-2));
}

[role='dialog']:has(> nav) > nav {
  border-right: 1px solid var(--dsw-alias-border-l1);
  background: linear-gradient(180deg, color-mix(in srgb, var(--dsw-specific-sidebar-fill) 92%, transparent), transparent);
}

[role='dialog'] [aria-current='true'] {
  color: var(--dsw-alias-label-primary);
  box-shadow: inset 2px 0 0 var(--dsw-alias-state-business-primary);
}

[role='presentation'] > [aria-hidden='true'][class*='_mask'] {
  background:
    radial-gradient(circle at 50% 38%, color-mix(in srgb, var(--dsw-alias-state-business-primary) 10%, transparent), transparent 35%),
    var(--dsw-alias-bg-mask-1);
}

[role='menu'] {
  border-color: var(--dsw-alias-border-inverted);
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--dsw-specific-menu) 94%, white 6%), var(--dsw-specific-menu));
  box-shadow: var(--dsw-shadow-lv3);
  animation: aurora-menu-in 220ms var(--ds-ease-in-out) both;
  transform-origin: top center;
}

body[data-ds-dark-theme] [role='menu'] {
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--dsw-specific-menu) 96%, #7787ff 4%), var(--dsw-specific-menu));
}

[role='menuitem'] {
  border: 1px solid transparent !important;
}

[role='menuitem']:hover:not(:disabled),
[role='menuitem']:focus-visible {
  border-color: color-mix(in srgb, var(--dsw-alias-state-business-primary) 10%, transparent) !important;
  background: linear-gradient(90deg, var(--dsw-alias-interactive-bg-hover), color-mix(in srgb, var(--dsw-alias-state-business-primary) 5%, transparent)) !important;
}

[role='tooltip'] {
  border: 1px solid rgb(255 255 255 / 8%);
  box-shadow: 0 10px 30px rgb(0 0 0 / 24%);
  letter-spacing: 0.005em;
}

/* Models/settings cards */
[role='dialog'] :where(
  [class*='_rowCard'],
  [class*='_addCard'],
  [class*='_setupCard'],
  [class*='_modelEntry']
) {
  background: color-mix(in srgb, var(--dsw-alias-bg-layer-1) 76%, transparent);
  box-shadow: 0 1px 0 rgb(255 255 255 / 5%) inset;
  transition:
    border-color var(--ds-transition-duration-fast) var(--ds-ease-in-out),
    box-shadow var(--ds-transition-duration) var(--ds-ease-in-out),
    background-color var(--ds-transition-duration) var(--ds-ease-in-out);
}

[role='dialog'] :where(
  [class*='_rowCard'],
  [class*='_addCard'],
  [class*='_setupCard'],
  [class*='_modelEntry']
):hover {
  border-color: color-mix(in srgb, var(--dsw-alias-state-business-primary) 24%, var(--dsw-alias-border-l2));
  box-shadow: 0 14px 34px color-mix(in srgb, var(--dsw-alias-state-business-primary) 7%, transparent);
}

/* The demo styles its own editor to make the plugin capability immediately visible. */
div:has(> #dsh-custom-css-textarea) {
  width: min(760px, 100%) !important;
  padding: 1px !important;
  border: 1px solid color-mix(in srgb, var(--dsw-alias-state-business-primary) 20%, var(--dsw-alias-border-l2));
  border-radius: 22px !important;
  background: linear-gradient(135deg, var(--aurora-accent), var(--aurora-accent-2), var(--aurora-accent-3)) !important;
  box-shadow: var(--dsw-shadow-lv2);
}

div:has(> #dsh-custom-css-textarea)::before {
  inset: 1px !important;
  border-radius: 20px !important;
  background: var(--dsw-alias-bg-layer-2) !important;
  filter: none !important;
}

div:has(> #dsh-custom-css-textarea)::after {
  inset: -1px !important;
  border-radius: 22px !important;
  background: linear-gradient(135deg, var(--aurora-accent), var(--aurora-accent-2), var(--aurora-accent-3)) !important;
  opacity: 0.72;
  filter: blur(10px);
}

#dsh-custom-css-textarea {
  min-height: 430px !important;
  padding: 24px !important;
  border-radius: 20px;
  color: var(--dsw-alias-label-primary) !important;
  caret-color: var(--dsw-alias-state-business-primary);
  font-family: var(--ds-font-family-code) !important;
  font-size: 13px !important;
  font-variant-ligatures: contextual;
  line-height: 1.72 !important;
  tab-size: 2;
}

/* ========================================================================== */
/* 11. Buttons, statuses, trajectory                                           */
/* ========================================================================== */

button[class*='_primary']:not(:disabled),
button[class*='primaryButton']:not(:disabled) {
  box-shadow:
    0 8px 22px color-mix(in srgb, var(--dsw-alias-state-business-primary) 25%, transparent),
    0 1px 0 rgb(255 255 255 / 24%) inset;
}

button[class*='_primary']:hover:not(:disabled),
button[class*='primaryButton']:hover:not(:disabled) {
  box-shadow:
    0 12px 30px color-mix(in srgb, var(--dsw-alias-state-business-primary) 34%, transparent),
    0 1px 0 rgb(255 255 255 / 32%) inset;
  filter: saturate(1.1);
}

[class*='_banner'][role='status'],
[role='alert'] {
  box-shadow: var(--dsw-shadow-lv1);
}

tr[data-kind] {
  transition:
    background-color var(--ds-transition-duration-fast) var(--ds-ease-in-out),
    opacity var(--ds-transition-duration-fast) var(--ds-ease-in-out),
    filter var(--ds-transition-duration-fast) var(--ds-ease-in-out);
}

tr[data-kind][data-selected='true'] {
  box-shadow: inset 3px 0 0 var(--dsw-alias-state-business-primary);
}

[data-timeline-span] {
  filter: drop-shadow(0 0 5px color-mix(in srgb, currentColor 22%, transparent));
  transition:
    opacity var(--ds-transition-duration-fast) var(--ds-ease-in-out),
    filter var(--ds-transition-duration-fast) var(--ds-ease-in-out);
}

[data-timeline-span][data-current='true'],
[data-timeline-span][data-hovered='true'] {
  filter: drop-shadow(0 0 8px color-mix(in srgb, var(--dsw-alias-state-business-primary) 48%, transparent));
}

/* ========================================================================== */
/* 12. Glass capability gate                                                   */
/* ========================================================================== */

@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  /* Do not apply backdrop-filter to frame columns: it would create a fixed-position
     containing block and trap overlays/dialogs inside the sidebar or details rail. */
  [data-composer-card],
  [role='dialog'],
  [role='menu'] {
    -webkit-backdrop-filter: blur(24px) saturate(1.35);
    backdrop-filter: blur(24px) saturate(1.35);
  }

  [role='tooltip'] {
    -webkit-backdrop-filter: blur(14px) saturate(1.25);
    backdrop-filter: blur(14px) saturate(1.25);
  }
}

/* ========================================================================== */
/* 13. Motion                                                                  */
/* ========================================================================== */

@keyframes aurora-canvas-drift {
  0% {
    background-position: 0% 0%, 100% 0%, 78% 100%, 0 0;
  }
  100% {
    background-position: 8% 5%, 92% 8%, 68% 92%, 0 0;
  }
}

@keyframes aurora-border-orbit {
  to { --aurora-orbit: 1turn; }
}

@keyframes aurora-hero-breathe {
  from {
    opacity: 0.76;
    transform: translate(-50%, 50%) scale(0.98);
  }
  to {
    opacity: 1;
    transform: translate(-50%, 50%) scale(1.035);
  }
}

@keyframes aurora-float {
  from { transform: translateY(0) rotate(-1deg); }
  to { transform: translateY(-4px) rotate(1deg); }
}

@keyframes aurora-message-in {
  from {
    opacity: 0;
    transform: translateY(8px) scale(0.995);
    filter: blur(3px);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
    filter: blur(0);
  }
}

@keyframes aurora-dialog-in {
  from {
    opacity: 0;
    transform: translateY(12px) scale(0.985);
    filter: blur(5px);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
    filter: blur(0);
  }
}

@keyframes aurora-menu-in {
  from {
    opacity: 0;
    transform: translateY(-5px) scale(0.985);
    filter: blur(3px);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
    filter: blur(0);
  }
}

/* ========================================================================== */
/* 14. Responsive and accessibility                                            */
/* ========================================================================== */

@media (max-width: 760px) {
  body {
    background-size: 150% 150%, 150% 150%, 160% 160%, 100% 100%;
  }

  [data-composer-card] {
    border-radius: 18px !important;
  }

  [role='dialog'] {
    border-radius: 20px !important;
  }

  #dsh-custom-css-textarea {
    min-height: 320px !important;
    padding: 18px !important;
    font-size: 12px !important;
  }

  [data-time-hover-root] > [class*='_bubble'] {
    max-width: 92% !important;
  }
}

@media (max-width: 560px) {
  /* The settings dialog is mounted from inside the sidebar. Reflow its desktop
     rail into compact horizontal tabs so every official settings surface stays
     usable on phone-sized viewports. */
  [role='dialog']:has(> nav) {
    flex-direction: column !important;
  }

  [role='dialog']:has(> nav) > nav {
    flex: 0 0 auto !important;
    inline-size: 100% !important;
    block-size: auto !important;
    padding: 10px 12px !important;
    border-right: 0 !important;
    border-bottom: 1px solid var(--dsw-alias-border-l1);
  }

  [role='dialog']:has(> nav) > nav > :first-child {
    display: none !important;
  }

  [role='dialog']:has(> nav) > nav > :last-child {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 4px;
    inline-size: 100% !important;
  }

  [role='dialog']:has(> nav) > nav > :last-child > button {
    min-inline-size: 0 !important;
    gap: 4px !important;
    padding-inline: 4px !important;
    justify-content: center;
    font-size: 13px !important;
  }

  [role='dialog']:has(> nav) > :not(nav) {
    flex: 1 1 auto !important;
    inline-size: 100% !important;
    min-inline-size: 0 !important;
    block-size: auto !important;
    min-block-size: 0 !important;
  }
}

@media (prefers-contrast: more) {
  body:not([data-ds-dark-theme]),
  body[data-ds-dark-theme] {
    --dsw-alias-border-l1: color-mix(in srgb, currentColor 12%, transparent) !important;
    --dsw-alias-border-l2: color-mix(in srgb, currentColor 24%, transparent) !important;
    --dsw-alias-border-l3: color-mix(in srgb, currentColor 36%, transparent) !important;
    --dsw-alias-border-l4: color-mix(in srgb, currentColor 50%, transparent) !important;
  }

  [data-composer-card],
  [role='dialog'],
  [role='menu'] {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }

  [class*='_heroGlow'],
  [class*='_fish'] {
    transform: none !important;
    filter: none !important;
  }
}

@media (forced-colors: active) {
  body {
    background: Canvas !important;
    color: CanvasText !important;
    animation: none !important;
  }

  [data-composer-card],
  [role='dialog'],
  [role='menu'],
  [role='tooltip'],
  [data-time-hover-root] > [class*='_bubble'] {
    border: 1px solid CanvasText !important;
    background: Canvas !important;
    color: CanvasText !important;
    box-shadow: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }
}