@layer theme, base, overrides, structure, scheme;
@layer theme { :root {
  --color-accent: oklch(0.838 0.114 88.743);
  --primary: oklch(0.838 0.114 88.743);
  --color-accent-text: oklch(0.842 0.114 88.743);
  --accent-text: oklch(0.842 0.114 88.743);
  --color-on-accent: oklch(0.185 0.022 86.427);
  --primary-foreground: oklch(0.185 0.022 86.427);
  --color-accent-subtle: oklch(0.228 0.023 87.883);
  --primary-container: oklch(0.228 0.023 87.883);
  --color-accent-bold: oklch(0.889 0.1 92.109);
  --color-accent-secondary: light-dark(oklch(0.731 0.115 174.991), oklch(0.85 0.115 174.991));
  --secondary: light-dark(oklch(0.731 0.115 174.991), oklch(0.85 0.115 174.991));
  --color-on-accent-secondary: light-dark(oklch(0.99 0.005 84.991), oklch(0.14 0.005 84.991));
  --secondary-foreground: light-dark(oklch(0.99 0.005 84.991), oklch(0.14 0.005 84.991));
  --color-accent-secondary-subtle: light-dark(oklch(0.95 0.03 174.991), oklch(0.3 0.04 174.991));
  --secondary-container: light-dark(oklch(0.95 0.03 174.991), oklch(0.3 0.04 174.991));
  --color-surface-canvas: oklch(0.114 0.004 106.953);
  --background: oklch(0.114 0.004 106.953);
  --color-surface-sunken: oklch(0.146 0.01 87.319);
  --surface-container-lowest: oklch(0.146 0.01 87.319);
  --color-surface-muted: oklch(0.211 0.021 86.146);
  --muted: oklch(0.211 0.021 86.146);
  --color-surface-muted-opaque: oklch(0.211 0.021 86.146);
  --color-surface-raised: oklch(0.161 0.011 80.982);
  --card: oklch(0.161 0.011 80.982);
  --color-surface-raised-opaque: oklch(0.161 0.011 80.982);
  --color-surface-overlay: oklch(0.185 0.022 86.427);
  --popover: oklch(0.185 0.022 86.427);
  --color-surface-muted-opaque: oklch(0.211 0.021 86.146);
  --color-surface-inverse: light-dark(oklch(0.18 0.005 84.991), oklch(0.92 0.005 84.991));
  --inverse-surface: light-dark(oklch(0.18 0.005 84.991), oklch(0.92 0.005 84.991));
  --color-text-primary: oklch(0.953 0.021 88.721);
  --foreground: oklch(0.953 0.021 88.721);
  --color-text-secondary: oklch(0.753 0.025 85.796);
  --muted-foreground: oklch(0.753 0.025 85.796);
  --color-text-muted: oklch(0.699 0.035 85.465);
  --color-text-inverse: light-dark(oklch(0.98 0.005 84.991), oklch(0.18 0.005 84.991));
  --inverse-on-surface: light-dark(oklch(0.98 0.005 84.991), oklch(0.18 0.005 84.991));
  --color-card-foreground: oklch(0.953 0.021 88.721);
  --card-foreground: oklch(0.953 0.021 88.721);
  --color-popover-foreground: oklch(0.953 0.021 88.721);
  --popover-foreground: oklch(0.953 0.021 88.721);
  --color-border-default: oklch(0.288 0.03 88.051);
  --border: oklch(0.288 0.03 88.051);
  --color-border-subtle: oklch(0.219 0.019 88.732);
  --border-subtle: oklch(0.219 0.019 88.732);
  --color-border-accent: light-dark(oklch(0.78 0.069 84.991), oklch(0.55 0.069 84.991));
  --ring: light-dark(oklch(0.78 0.069 84.991), oklch(0.55 0.069 84.991));
  --color-border-input: oklch(0.288 0.03 88.051);
  --input: oklch(0.288 0.03 88.051);
  --color-danger: light-dark(oklch(0.6 0.18 25), oklch(0.7 0.14 25));
  --destructive: light-dark(oklch(0.6 0.18 25), oklch(0.7 0.14 25));
  --color-danger-subtle: light-dark(oklch(0.95 0.03 25), oklch(0.3 0.04 25));
  --destructive-container: light-dark(oklch(0.95 0.03 25), oklch(0.3 0.04 25));
  --color-on-danger: light-dark(oklch(0.99 0.005 25), oklch(0.14 0.005 25));
  --destructive-foreground: light-dark(oklch(0.99 0.005 25), oklch(0.14 0.005 25));
  --color-on-danger-subtle: light-dark(oklch(0.2 0.09 25), oklch(0.92 0.05 25));
  --destructive-container-foreground: light-dark(oklch(0.2 0.09 25), oklch(0.92 0.05 25));
  --color-success: light-dark(oklch(0.55 0.18 145), oklch(0.72 0.14 145));
  --success: light-dark(oklch(0.55 0.18 145), oklch(0.72 0.14 145));
  --color-success-subtle: light-dark(oklch(0.95 0.03 145), oklch(0.3 0.04 145));
  --success-container: light-dark(oklch(0.95 0.03 145), oklch(0.3 0.04 145));
  --color-on-success: light-dark(oklch(0.99 0.005 145), oklch(0.14 0.005 145));
  --success-foreground: light-dark(oklch(0.99 0.005 145), oklch(0.14 0.005 145));
  --color-on-success-subtle: light-dark(oklch(0.2 0.08 145), oklch(0.92 0.05 145));
  --success-container-foreground: light-dark(oklch(0.2 0.08 145), oklch(0.92 0.05 145));
  --color-warning: light-dark(oklch(0.72 0.18 70), oklch(0.8 0.14 70));
  --warning: light-dark(oklch(0.72 0.18 70), oklch(0.8 0.14 70));
  --color-warning-subtle: light-dark(oklch(0.95 0.04 70), oklch(0.3 0.05 70));
  --warning-container: light-dark(oklch(0.95 0.04 70), oklch(0.3 0.05 70));
  --color-on-warning: light-dark(oklch(0.18 0.005 70), oklch(0.14 0.005 70));
  --warning-foreground: light-dark(oklch(0.18 0.005 70), oklch(0.14 0.005 70));
  --color-on-warning-subtle: light-dark(oklch(0.18 0.07 70), oklch(0.92 0.07 70));
  --warning-container-foreground: light-dark(oklch(0.18 0.07 70), oklch(0.92 0.07 70));
  --color-info: light-dark(oklch(0.55 0.18 230), oklch(0.72 0.14 230));
  --info: light-dark(oklch(0.55 0.18 230), oklch(0.72 0.14 230));
  --color-info-subtle: light-dark(oklch(0.95 0.03 230), oklch(0.3 0.04 230));
  --info-container: light-dark(oklch(0.95 0.03 230), oklch(0.3 0.04 230));
  --color-on-info: light-dark(oklch(0.99 0.005 230), oklch(0.14 0.005 230));
  --info-foreground: light-dark(oklch(0.99 0.005 230), oklch(0.14 0.005 230));
  --color-on-info-subtle: light-dark(oklch(0.2 0.07 230), oklch(0.92 0.05 230));
  --info-container-foreground: light-dark(oklch(0.2 0.07 230), oklch(0.92 0.05 230));
  --color-focus-ring: oklch(0.838 0.114 88.743);
  --color-scrim: oklch(0 0 0 / 0.5);
  --scrim: oklch(0 0 0 / 0.5);
  --color-chart-1: light-dark(oklch(0.62 0.18 84.991), oklch(0.72 0.18 84.991));
  --chart-1: light-dark(oklch(0.62 0.18 84.991), oklch(0.72 0.18 84.991));
  --color-chart-2: light-dark(oklch(0.62 0.18 156.991), oklch(0.72 0.18 156.991));
  --chart-2: light-dark(oklch(0.62 0.18 156.991), oklch(0.72 0.18 156.991));
  --color-chart-3: light-dark(oklch(0.62 0.18 228.991), oklch(0.72 0.18 228.991));
  --chart-3: light-dark(oklch(0.62 0.18 228.991), oklch(0.72 0.18 228.991));
  --color-chart-4: light-dark(oklch(0.62 0.18 300.991), oklch(0.72 0.18 300.991));
  --chart-4: light-dark(oklch(0.62 0.18 300.991), oklch(0.72 0.18 300.991));
  --color-chart-5: light-dark(oklch(0.62 0.18 372.991), oklch(0.72 0.18 372.991));
  --chart-5: light-dark(oklch(0.62 0.18 372.991), oklch(0.72 0.18 372.991));
  --spacing-xs: 0.250rem;
  --space-xs: 0.250rem;
  --space-1: 0.250rem;
  --spacing-sm: 0.500rem;
  --space-sm: 0.500rem;
  --space-2: 0.500rem;
  --spacing-md: clamp(0.750rem, 0.652rem + 0.435vw, 1.000rem);
  --space-md: clamp(0.750rem, 0.652rem + 0.435vw, 1.000rem);
  --space-4: clamp(0.750rem, 0.652rem + 0.435vw, 1.000rem);
  --spacing-lg: clamp(1.125rem, 0.978rem + 0.652vw, 1.500rem);
  --space-lg: clamp(1.125rem, 0.978rem + 0.652vw, 1.500rem);
  --space-6: clamp(1.125rem, 0.978rem + 0.652vw, 1.500rem);
  --spacing-xl: clamp(1.400rem, 1.165rem + 1.043vw, 2.000rem);
  --space-xl: clamp(1.400rem, 1.165rem + 1.043vw, 2.000rem);
  --space-8: clamp(1.400rem, 1.165rem + 1.043vw, 2.000rem);
  --space-3: 0.750rem;
  --space-5: 1.250rem;
  --space-7: 1.750rem;
  --radius-xs: 0.250rem;
  --radius-sm: 0.500rem;
  --radius-md: 0.750rem;
  --radius: 0.750rem;
  --radius-lg: 1.000rem;
  --radius-xl: 1.750rem;
  --radius-full: 9999px;
  --radius-none: 0.000rem;
  --font-weight-display-large: 400;
  --letter-spacing-display-large: 0.0000em;
  --line-height-display-large: 1.123;
  --font-weight-display-medium: 400;
  --letter-spacing-display-medium: 0.0000em;
  --line-height-display-medium: 1.123;
  --font-weight-display-small: 400;
  --letter-spacing-display-small: 0.0000em;
  --line-height-display-small: 1.123;
  --font-weight-headline-large: 400;
  --letter-spacing-headline-large: 0.0000em;
  --line-height-headline-large: 1.250;
  --font-weight-headline-medium: 400;
  --letter-spacing-headline-medium: 0.0000em;
  --line-height-headline-medium: 1.250;
  --font-weight-headline-small: 400;
  --letter-spacing-headline-small: 0.0000em;
  --line-height-headline-small: 1.250;
  --font-weight-title-large: 400;
  --letter-spacing-title-large: 0.0000em;
  --line-height-title-large: 1.270;
  --font-weight-title-medium: 400;
  --letter-spacing-title-medium: 0.0000em;
  --line-height-title-medium: 1.270;
  --font-weight-title-small: 400;
  --letter-spacing-title-small: 0.0000em;
  --line-height-title-small: 1.270;
  --font-weight-body-large: 400;
  --letter-spacing-body-large: 0.0312em;
  --line-height-body-large: 1.500;
  --font-weight-body-medium: 400;
  --letter-spacing-body-medium: 0.0156em;
  --line-height-body-medium: 1.500;
  --font-weight-body-small: 400;
  --letter-spacing-body-small: 0.0250em;
  --line-height-body-small: 1.500;
  --font-weight-label-large: 400;
  --letter-spacing-label-large: 0.0063em;
  --line-height-label-large: 1.430;
  --font-weight-label-medium: 400;
  --letter-spacing-label-medium: 0.0312em;
  --line-height-label-medium: 1.430;
  --font-weight-label-small: 400;
  --letter-spacing-label-small: 0.0312em;
  --line-height-label-small: 1.430;
  --font-body: Montserrat, sans-serif;
  --font-family-body: Montserrat, sans-serif;
  --font-family: Montserrat, sans-serif;
  --font-display: Cinzel, serif;
  --font-family-display: Cinzel, serif;
  --font-mono: ui-monospace, SFMono-Regular, monospace;
  --font-family-mono: ui-monospace, SFMono-Regular, monospace;
  --font-body: Montserrat, sans-serif;
  --font-family-body: Montserrat, sans-serif;
  --font-family: Montserrat, sans-serif;
  --shadow-xs: 0 1px 2px 0 rgba(0,0,0,0.05);
  --shadow-sm: 0 1px 2px 0 rgba(0,0,0,0.05);
  --shadow-md: 0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -2px rgba(0,0,0,0.1);
  --shadow-lg: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -4px rgba(0,0,0,0.1);
  --shadow-xl: 0 25px 50px -12px rgba(0,0,0,0.25);
  --shadow-gutter: 0.000rem;
  --clip-gutter: 4px;
  --motion-duration-standard: 200ms;
  --transition-duration: 200ms;
  --motion-easing-standard: cubic-bezier(0.2,0,0,1);
  --transition-easing: cubic-bezier(0.2,0,0,1);
  --motion-duration-emphasized: 320ms;
  --motion-easing-emphasized: cubic-bezier(0.2,0,0,1);
  --motion-duration-emphasized-accel: 120ms;
  --motion-easing-emphasized-accel: cubic-bezier(0.3,0,0.8,0.15);
  --motion-duration-emphasized-decel: 200ms;
  --motion-easing-emphasized-decel: cubic-bezier(0.05,0.7,0.1,1);
  --motion-duration-spring: 200ms;
  --motion-easing-spring: cubic-bezier(0.34,1.56,0.64,1);
  --field-role-border: 1px solid oklch(0.288 0.03 88.051);
  --field-role-shadow: none;
  --control-role-border: 1px solid oklch(0.219 0.019 88.732);
  --control-role-shadow: none;
  --control-height: 2.250rem;
  --control-inset-x: 0.625rem;
  --form-control-height: 2.500rem;
  --overlay-role-border: 1px solid oklch(0.219 0.019 88.732);
  --overlay-role-shadow: none;
  --color-background: var(--background);
  --color-foreground: var(--foreground);
  --color-primary: var(--primary);
  --color-destructive: var(--destructive);
  --font-size: 1rem;
  --font-size-body-medium: 1rem;
  --line-height: 1.5;
  --heading-weight: 600;
  --heading-line-height: 1.25;
  --heading-letter-spacing: -0.01em;
  --h1-size: clamp(1.500rem, 1.304rem + 0.870vw, 2.000rem);
  --h2-size: clamp(1.250rem, 1.152rem + 0.435vw, 1.500rem);
  --h3-size: clamp(1.125rem, 1.076rem + 0.217vw, 1.250rem);
  --h4-size: clamp(1.062rem, 1.038rem + 0.109vw, 1.125rem);
  --code-font-size: 0.875rem;
  --small-font-size: 0.875rem;
  --body-font-size: 1rem;
  --caption-size: 0.8125rem;
  --medium-weight: 500;
  --bold-weight: 700;
  --dialog-min-width: 320px;
  --dialog-max-width: 640px;
  --state-disabled-opacity: 0.5;
  --state-disabled-cursor: not-allowed;
  --state-invalid-border-color: var(--destructive);
  --state-invalid-ring: 0 0 0 3px color-mix(in oklch, var(--destructive) 30%, transparent);
  --state-focus-ring: 0 0 0 3px color-mix(in oklch, var(--primary) 40%, transparent);
  --state-readonly-bg: var(--muted);
  --state-readonly-opacity: 1;
  --state-busy-opacity: 0.6;
  --state-busy-cursor: progress;
  --state-busy-spinner: currentColor;
  --accent: oklch(0.211 0.021 86.146);
  --m3e-shape-to: none;
}
 }
@layer base { 
    *, *::before, *::after { box-sizing:border-box;margin:0;padding:0 }

    
    
    html { scrollbar-gutter:stable; background-color: var(--background) }

    
    html:has(.d-app-shell) { scrollbar-gutter:auto }

    
    .d-base {
      box-sizing:border-box;border:0 solid;
      flex-basis:auto;flex-shrink:0;
      margin:0;padding:0;
      min-height:0;min-width:0;
      
      overflow:clip;overflow-clip-margin:var(--clip-gutter, 4px);position:relative
    }

    
    button, input, optgroup, select, textarea {
      font-family: inherit;
      font-feature-settings: inherit;
      font-variation-settings: inherit;
      font-size: 100%;
      font-weight: inherit;
      line-height: inherit;
      letter-spacing: inherit;
      color: inherit;
      margin: 0;
      padding: 0;
    }
    button, [type='button'], [type='reset'], [type='submit'] {
      -webkit-appearance: button;
      background-color: transparent;
      background-image: none;
    }

    
    body {
      font-family: var(--font-family);
      font-size: var(--font-size);
      line-height: var(--line-height);
      color: var(--foreground);
      background: var(--background);
    }

    
    html { -webkit-text-size-adjust:100%; text-size-adjust:100% }
    body { overscroll-behavior:none; -webkit-tap-highlight-color:transparent }
    button, a, [role=button], summary, label, input[type=submit], input[type=button] { touch-action:manipulation }
    .nav-rail, .d-sidebar, [role=navigation], button, [role=button] {
      -webkit-touch-callout:none; -webkit-user-select:none; user-select:none;
    }
    input, textarea, select, [contenteditable], [contenteditable] * {
      -webkit-touch-callout:default; -webkit-user-select:text; user-select:text;
    }

    h1, h2, h3, h4 {
      font-weight: var(--heading-weight);
      line-height: var(--heading-line-height);
      color: var(--foreground);
      letter-spacing: var(--heading-letter-spacing);
    }
    h1 { font-size: var(--h1-size); }
    h2 { font-size: var(--h2-size); }
    h3 { font-size: var(--h3-size); }
    h4 { font-size: var(--h4-size); }

    p { color: var(--muted-foreground); }

    code {
      font-family: var(--font-mono);
      font-size: var(--code-font-size);
      background: var(--muted);
      padding: 0.2em 0.4em;
      border-radius: calc(var(--radius) * 0.5);
    }

    
    a {
      
      color: var(--accent-text, var(--primary));
      text-decoration: none;
      transition: color var(--transition-duration) var(--transition-easing);
    }
    a:hover { text-decoration:underline;text-underline-offset:4px }
    
    a.atom-pressable:hover { text-decoration:none }

    
    .d-anim-fade-in     { animation: d-anim-fade-in var(--d-anim-dur, 180ms) var(--transition-easing) both }
    .d-anim-slide-up    { animation: d-anim-slide-up var(--d-anim-dur, 180ms) var(--transition-easing) both }
    .d-anim-slide-down  { animation: d-anim-slide-down var(--d-anim-dur, 180ms) var(--transition-easing) both }
    .d-anim-scale-in    { animation: d-anim-scale-in var(--d-anim-dur, 180ms) var(--transition-easing) both }
    @keyframes d-anim-fade-in    { from { opacity: 0 } to { opacity: 1 } }
    @keyframes d-anim-slide-up   { from { opacity: 0; transform: translateY(8px) } to { opacity: 1; transform: translateY(0) } }
    @keyframes d-anim-slide-down { from { opacity: 0; transform: translateY(-8px) } to { opacity: 1; transform: translateY(0) } }
    @keyframes d-anim-scale-in   { from { opacity: 0; transform: scale(0.96) } to { opacity: 1; transform: scale(1) } }
 .cms-vis-root {display:flex;flex-direction:column;flex:1;min-height:0;min-width:0}#cms-vis-frame {width:100%;height:100%;border:0;display:block;background:var(--background,#0a0a0a);border-radius:var(--radius);clip-path:inset(0 round var(--radius));isolation:isolate;transition:width 200ms cubic-bezier(0.4,0,0.2,1)}.cms-vis-root[data-vp="mobile"] #cms-vis-frame { width:390px;max-width:100% }.cms-vis-root[data-vp="tablet"] #cms-vis-frame { width:834px;max-width:100% }.cms-vis-root[data-vp="desktop"] #cms-vis-frame { width:1280px;max-width:100% }  .cms-vis-frame-stage {position:relative;flex:1;display:flex;align-items:stretch;justify-content:center;min-height:0}  #cms-vis-deploy {position:absolute;left:0;right:0;bottom:0;height:3px;background:rgba(255,255,255,0.06);overflow:hidden;transition:opacity 220ms ease;opacity:0;pointer-events:none;z-index:2147483639;}#cms-vis-deploy.active { opacity:1 }#cms-vis-deploy::before {content:'';position:absolute;left:0;top:0;bottom:0;width:100%;transform-origin:left center;transform:scaleX(var(--progress,0));background:linear-gradient(90deg,color-mix(in oklch,var(--primary,#c12c65) 55%,transparent),var(--primary,#c12c65),color-mix(in oklch,var(--primary,#c12c65) 70%,white));box-shadow:0 0 16px -2px var(--primary,#c12c65),0 -8px 24px -10px var(--primary,#c12c65);transition:transform 240ms cubic-bezier(0.22,1,0.36,1),background 220ms ease,box-shadow 220ms ease;}#cms-vis-deploy.success::before {background:linear-gradient(90deg,var(--success,#10b981),#34d399);box-shadow:0 0 18px -2px var(--success,#10b981),0 -8px 26px -10px var(--success,#10b981);}#cms-vis-deploy.warn::before {background:linear-gradient(90deg,var(--warning,#f59e0b),#fbbf24);box-shadow:0 0 18px -2px var(--warning,#f59e0b),0 -8px 26px -10px var(--warning,#f59e0b);}#cms-vis-deploy.saving::before {background:linear-gradient(90deg,color-mix(in oklch,var(--primary,#c12c65) 70%,transparent),var(--primary,#c12c65));box-shadow:0 0 14px -2px var(--primary,#c12c65)}#cms-vis-deploy.error::before {background:linear-gradient(90deg,var(--destructive,#ef4444),#f87171) !important;box-shadow:0 0 18px -2px var(--destructive,#ef4444),0 -8px 26px -10px var(--destructive,#ef4444) !important}  #cms-vis-deploy-label {position:absolute;left:50%;bottom:18px;transform:translateX(-50%) translateY(8px);padding:7px 14px 7px 28px;font-size:12px;font-weight:500;letter-spacing:0.01em;color:rgba(255,255,255,0.94);background:rgba(20,20,22,0.78);border:1px solid rgba(255,255,255,0.08);border-radius:999px;backdrop-filter:saturate(140%) blur(14px);-webkit-backdrop-filter:saturate(140%) blur(14px);box-shadow:0 14px 38px -10px rgba(0,0,0,0.55),0 4px 12px -4px rgba(0,0,0,0.4);opacity:0;transition:opacity 220ms ease,transform 260ms cubic-bezier(0.22,1,0.36,1);pointer-events:none;white-space:nowrap;z-index:2147483641;}#cms-vis-deploy-label.active {opacity:1;transform:translateX(-50%) translateY(0)}#cms-vis-deploy-label::before {content:'';position:absolute;left:12px;top:50%;width:8px;height:8px;border-radius:50%;transform:translateY(-50%);background:var(--primary,#c12c65);box-shadow:0 0 10px var(--primary,#c12c65);animation:cmsVisDeployPulse 1.2s ease-in-out infinite;}#cms-vis-deploy-label.success::before {background:var(--success,#10b981);box-shadow:0 0 10px var(--success,#10b981);animation:none}#cms-vis-deploy-label.warn::before {background:var(--warning,#f59e0b);box-shadow:0 0 10px var(--warning,#f59e0b);animation:none}#cms-vis-deploy-label.error::before {background:var(--destructive,#ef4444) !important;box-shadow:0 0 10px var(--destructive,#ef4444) !important;animation:none !important}@keyframes cmsVisDeployPulse {0%,100% { opacity:1;transform:translateY(-50%) scale(1) }50% { opacity:0.55;transform:translateY(-50%) scale(0.82) } }  #cms-vis-save-slot {position:sticky;bottom:0;z-index:3;display:flex;align-items:center;justify-content:flex-end;gap:var(--space-2);margin-top:var(--space-3);padding:var(--space-3) 0 var(--space-1);background:var(--card,var(--background));border-top:1px solid var(--border);opacity:0.5;pointer-events:none;transition:opacity 160ms ease}#cms-vis-save-slot.is-active {opacity:1;pointer-events:auto}#cms-vis-save-slot.is-saving {opacity:0.6;pointer-events:none}#cms-vis-save-slot.is-saving .btn {cursor:wait}#cms-vis-save-slot .btn {flex:1 1 auto;justify-content:center;padding:12px 20px;font-size:15px;font-weight:600;letter-spacing:0.01em}#cms-vis-save-count {flex:0 0 auto;display:none;min-width:24px;height:24px;padding:0 8px;border-radius:999px;background:var(--primary,#c12c65);color:var(--primary-foreground,#fff);font-size:12px;font-weight:700;line-height:24px;text-align:center;font-variant-numeric:tabular-nums}#cms-vis-save-slot.is-active #cms-vis-save-count {display:inline-block}  .cms-vis-readonly input,.cms-vis-readonly textarea,.cms-vis-readonly select {pointer-events:none;opacity:0.6;background:var(--muted)}.cms-vis-img-progress {font-size:var(--caption-size);color:var(--muted-foreground);margin-top:var(--space-2)}input[data-cms-image-upload] {font-size:var(--small-font-size);color:var(--foreground)} 
    .d-main-slot { flex:1; display:flex; flex-direction:column; padding-block:var(--space-6) }
    .d-main-slot:not(:has(.d-auth-frame)) {
      padding-left:max(var(--space-4), env(safe-area-inset-left, 0px));
      padding-right:max(var(--space-4), env(safe-area-inset-right, 0px));
    }
  
    .d-auth-frame {
      flex:1; min-height:inherit; box-sizing:border-box;
      display:flex; flex-direction:column; align-items:center; justify-content:safe center;
      gap:var(--space-6);
      padding-left:max(var(--space-4), env(safe-area-inset-left, 0px));
      padding-right:max(var(--space-4), env(safe-area-inset-right, 0px));
    }
    .d-auth-card { box-sizing:border-box; width:100%; max-width:400px; min-width:0; flex-shrink:0 }
    .d-auth-toggles { display:flex; flex-direction:row; align-items:center; justify-content:center; gap:var(--space-2); flex-shrink:0 }
  
    .d-magic-btn {
      all: unset;
      box-sizing: border-box;
      cursor: pointer;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 100%;
      padding: 9px 14px;
      border-radius: 10px;
      font-size: 0.9375rem;
      font-weight: 600;
      color: var(--color-text-primary, #1f2328);
      border: 1px solid var(--color-border-default, rgba(27,31,36,0.15));
      background: transparent;
    }
    .d-magic-btn:hover { border-color: var(--color-primary, #6366f1) }
    .d-magic-btn:focus-visible {
      outline: none;
      box-shadow: var(--state-focus-ring, 0 0 0 3px color-mix(in oklch, var(--color-primary, #6366f1) 40%, transparent));
    }
    .d-magic-btn[disabled] { opacity: 0.5; cursor: progress }
    .d-magic-sent { font-size: 0.875rem; color: var(--color-text-secondary, #57606a) }
  
    .d-passkey-btn {
      all: unset;
      box-sizing: border-box;
      cursor: pointer;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 6px;
      width: 100%;
      padding: 9px 14px;
      border-radius: 10px;
      font-size: 0.9375rem;
      font-weight: 600;
      color: var(--color-text-primary, #1f2328);
      border: 1px solid var(--color-border-default, rgba(27,31,36,0.15));
      background: var(--color-surface-muted-opaque, #f6f8fa);
    }
    .d-passkey-btn:hover { border-color: var(--color-primary, #6366f1) }
    .d-passkey-btn:focus-visible {
      outline: none;
      box-shadow: var(--state-focus-ring, 0 0 0 3px color-mix(in oklch, var(--color-primary, #6366f1) 40%, transparent));
    }
    .d-passkey-btn[disabled] { opacity: 0.5; cursor: progress }
  
    .d-cmt-actroot { position:relative; display:block }
    .d-cmt-actions {
      position:absolute;
      
      top:0;
      z-index:2;
      display:inline-flex;
      gap:var(--space-1, .25rem);
      padding:2px;
      background:var(--card);
      border:1px solid var(--border);
      border-radius:var(--radius);
      box-shadow:var(--shadow-md, 0 2px 8px rgba(0,0,0,.15));
      opacity:0;
      pointer-events:none;
      transition:opacity 120ms var(--transition-easing, ease)
    }
    .d-cmt-actroot--end .d-cmt-actions { right:0 }
    .d-cmt-actroot--start .d-cmt-actions { left:0 }
    
    .d-cmt-actroot:hover .d-cmt-actions,
    .d-cmt-actroot:focus-within .d-cmt-actions { opacity:1; pointer-events:auto }
    .d-cmt-act {
      display:inline-flex;
      align-items:center;
      justify-content:center;
      width:28px;
      height:28px;
      padding:0;
      border:none;
      background:transparent;
      color:var(--muted-foreground);
      cursor:pointer;
      border-radius:var(--radius);
      transition:background 120ms ease,color 120ms ease
    }
    .d-cmt-act:hover { background:color-mix(in oklch,var(--accent) 14%,transparent); color:var(--foreground) }
    .d-cmt-act:focus-visible { outline:none; box-shadow:var(--state-focus-ring) }
    
    .d-cmt-act--danger:hover,
    .d-cmt-act--danger:focus-visible { background:color-mix(in oklch,var(--destructive) 14%,transparent); color:var(--destructive) }
  
    .d-scheme-click { display: contents }
  
    .tcm { box-sizing:border-box; display:flex; flex-direction:column; width:704px; max-width:calc(100vw - 32px); max-height:min(600px, calc(100dvh - 32px)); margin:0; padding:0; font-size:13px; line-height:20px; font-weight:400; color:var(--color-text-primary); background:var(--color-surface-overlay); border:1px solid var(--color-border-subtle); border-radius:16px; box-shadow:0 12px 32px -8px var(--color-scrim); overflow:hidden }
    .tcm *, .tcm *::before, .tcm *::after { box-sizing:border-box }
    .tcm-head { display:flex; align-items:center; justify-content:space-between; gap:16px; height:64px; min-height:64px; padding:0 16px 0 24px; border-bottom:1px solid var(--color-border-subtle); flex:none }
    .tcm-head-text { min-width:0; display:flex; flex-direction:column; gap:0 }
    .tcm-title { margin:0; font-size:16px; line-height:24px; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
    .tcm-sub { margin:0; font-size:12px; line-height:16px; color:var(--color-text-muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
    .tcm-sub b { font-weight:600; color:var(--color-text-secondary) }
    .tcm .tcm-x { width:32px; height:32px; min-width:32px; margin:0; padding:0; display:inline-flex; align-items:center; justify-content:center; border:0; border-radius:8px; background:transparent; color:var(--color-text-muted); cursor:pointer; flex:none }
    .tcm .tcm-x:hover { background:var(--color-surface-muted); color:var(--color-text-primary) }
    .tcm .tcm-x:focus-visible { outline:2px solid var(--color-focus-ring); outline-offset:2px }
    .tcm .tcm-x .icon { width:16px; height:16px }
    .tcm-body { display:grid; grid-template-columns:248px minmax(0, 1fr); gap:24px; padding:16px 24px; min-height:0; flex:1 1 auto; overflow:hidden }
    .tcm-foot { display:flex; align-items:center; justify-content:space-between; gap:8px; height:64px; min-height:64px; padding:0 24px; border-top:1px solid var(--color-border-subtle); flex:none }
    .tcm .tcm-btn { display:inline-flex; align-items:center; justify-content:center; height:32px; margin:0; padding:0 16px; border:1px solid var(--color-border-default); border-radius:8px; background:var(--color-surface-raised); color:var(--color-text-primary); font-size:13px; line-height:20px; font-weight:500; text-decoration:none; cursor:pointer; white-space:nowrap }
    .tcm .tcm-btn:hover { background:var(--color-surface-muted) }
    .tcm .tcm-btn:focus-visible { outline:2px solid var(--color-focus-ring); outline-offset:2px }
    .tcm .tcm-btn[aria-disabled="true"] { opacity:0.5; pointer-events:none }
    .tcm .tcm-btn--primary { background:var(--color-accent); border-color:var(--color-accent); color:var(--color-on-accent) }
    .tcm .tcm-btn--primary:hover { background:var(--color-accent); opacity:0.92 }
    @media (max-width:719px) {
      .tcm { width:calc(100vw - 32px) }
      .tcm-body { grid-template-columns:minmax(0, 1fr); gap:16px; padding:16px; overflow-y:auto }
      .tcm-head { padding:0 8px 0 16px }
      .tcm-foot { padding:0 16px }
      .tcm-list { max-height:264px; flex:none }
      .tcm-tune { overflow:visible; padding-right:0 }
    }
  
    .tcm-list { display:flex; flex-direction:column; gap:8px; min-height:0; overflow-y:auto; padding-right:4px; scrollbar-gutter:stable }
    .tcm .tcm-opt { display:flex; align-items:center; gap:12px; height:44px; min-height:44px; margin:0; padding:0 12px; border:1px solid var(--color-border-subtle); border-radius:10px; background:var(--color-surface-raised); color:var(--color-text-primary); font-size:13px; line-height:16px; text-decoration:none; cursor:pointer; flex:none }
    .tcm .tcm-opt:hover { border-color:var(--color-border-default); background:var(--color-surface-muted) }
    .tcm .tcm-opt:focus-visible { outline:2px solid var(--color-focus-ring); outline-offset:2px }
    .tcm .tcm-opt[data-tcm-preview] { border-color:var(--color-border-default); background:var(--color-accent-subtle) }
    .tcm .tcm-opt[aria-current="true"] { border-color:var(--color-accent); box-shadow:inset 0 0 0 1px var(--color-accent) }
    .tcm-strip { display:flex; width:42px; min-width:42px; height:20px; border:1px solid var(--color-border-subtle); border-radius:4px; overflow:hidden; flex:none }
    .tcm-strip span { display:block; flex:1 1 0; height:18px }
    .tcm-opt-text { display:flex; flex-direction:column; gap:0; min-width:0; flex:1 1 auto }
    .tcm-opt-name { display:block; height:16px; font-size:13px; line-height:16px; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
    .tcm-opt-trait { display:block; height:14px; font-size:11px; line-height:14px; color:var(--color-text-muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
    .tcm-opt-mark { display:inline-flex; width:16px; height:16px; color:var(--color-accent); flex:none }
    .tcm-opt-mark .icon { width:16px; height:16px }
  
    .d-center { display:flex;flex:1;justify-content:center;align-items:safe center;min-height:inherit }
    
    .d-center > * { max-width:100% }
  
    
    .d-cbox {
      display: flex;
      flex-direction: column;
      align-items: stretch;
      min-height: 0;
      min-width: min(var(--cb-minw, 0px), 100%);
    }
    
    .d-cbox > * { flex: 1 1 auto; min-width: 0 }
    
    .d-row > .d-cbox[data-cb-grow],
    .d-wrap > .d-cbox[data-cb-grow] { flex: 1 1 var(--cb-minw, auto) }
    
    .d-row:has(> .d-cbox[data-cb-grow]) { flex-wrap: wrap; row-gap: var(--d-gap, 0) }
  
    .atom-box {
      background:var(--b-bg);
      
      color:var(--surf-fg, inherit);
      border-radius:var(--b-radius);
      padding:var(--b-pad);
      
      border-top:var(--b-bt, none);
      border-right:var(--b-br, none);
      border-bottom:var(--b-bb, none);
      border-left:var(--b-bl, none);
      box-shadow:var(--b-shadow);
      backdrop-filter:var(--b-blur, none);
      -webkit-backdrop-filter:var(--b-blur, none)
    }
    
    [data-centered="1"] {
      display:inline-flex;
      align-items:center;
      justify-content:center
    }
    
    [data-clip="1"] {
      overflow:hidden
    }
    
    [data-sticky="top"]    { position:sticky; top:0; z-index:3 }
    [data-sticky="left"]   { position:sticky; left:0; z-index:2 }
    [data-sticky="corner"] { position:sticky; top:0; left:0; z-index:4 }
    
    [data-dv-href] { cursor:pointer }
   .d-expanded { min-height: 0; min-width: 0; display: flex; flex-direction: column; align-items: stretch; flex: var(--ex-flex) 1 0 }  .flexible { flex: 0 1 auto; min-height: 0; min-width: 0; display: flex; flex-direction: column; align-items: stretch } 
    .atom-pressable {
      
      box-sizing:border-box;
      
      width:fit-content;
    }
    
    .atom-pressable.pressable-expand {
      width:100%;
    }
    .atom-pressable {
      position:relative;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:var(--space-2);
      cursor:pointer;
      text-decoration:none;
      white-space:nowrap;
      color:inherit;
      
      font-family:var(--p-font-family, inherit);
      font-size:var(--p-font-size, inherit);
      font-weight:var(--p-font-weight, inherit);
      line-height:var(--p-line-height, inherit);
      overflow:hidden;
      background:var(--p-bg);
      
      color:var(--surf-fg, inherit);
      border-radius:var(--p-radius);
      padding:var(--p-pad);
      
      border-top:var(--p-bt, none);
      border-right:var(--p-br, none);
      border-bottom:var(--p-bb, none);
      border-left:var(--p-bl, none);
      box-shadow:var(--p-shadow);
      transition:var(--p-motion)
    }
    
    .atom-pressable > :not(.atom-state-layer):not(.atom-busy-spinner) {
      min-width:0;
      overflow-x:clip;
      text-overflow:ellipsis
    }
    
    .atom-pressable[role="menuitem"], .atom-pressable[role="menuitemcheckbox"] {
      justify-content:flex-start
    }
    
    .atom-pressable:focus-visible {
      outline:var(--p-focus, none);
      outline-offset:var(--p-focus-offset, 0);
      box-shadow:var(--p-focus-glow, var(--p-shadow))
    }
    
    .atom-pressable[disabled], .atom-pressable[aria-disabled="true"] {
      pointer-events:none;
      opacity:var(--state-disabled-opacity);
      cursor:var(--state-disabled-cursor)
    }
    
    .atom-pressable[aria-invalid="true"] {
      box-shadow:var(--state-invalid-ring)
    }
    
    .atom-pressable[aria-busy="true"] {
      cursor:var(--state-busy-cursor)
    }
    .atom-pressable[aria-busy="true"] > :not(.atom-busy-spinner) {
      opacity:var(--state-busy-opacity)
    }
    .atom-busy-spinner {
      position:absolute; inset:0; margin:auto;
      width:1em; height:1em; border-radius:50%;
      border:2px solid color-mix(in oklch, var(--state-busy-spinner) 30%, transparent);
      border-top-color:var(--state-busy-spinner);
      animation:atom-spin .6s linear infinite;
      pointer-events:none
    }
    @keyframes atom-spin { to { transform:rotate(360deg) } }
    @media (prefers-reduced-motion) { .atom-busy-spinner { animation:none } }
    .atom-state-layer {
      position:absolute;
      inset:0;
      background:transparent;
      pointer-events:none;
      transition:background var(--p-motion-state, 120ms ease)
    }
    .atom-pressable[data-hover="1"]:hover .atom-state-layer {
      background:var(--p-state-hover)
    }
    .atom-pressable[data-pressed="1"]:active .atom-state-layer {
      background:var(--p-state-pressed)
    }
    
    .atom-pressable[data-hover-kind="fillSwap"]:hover {
      background:var(--p-hover-bg)
    }
    .atom-pressable[data-pressed-kind="fillSwap"]:active {
      background:var(--p-pressed-bg)
    }
    
    .atom-pressable[data-morph="1"]:active {
      clip-path:var(--m3e-shape-to)
    }
    
    .atom-pressable:active {
      transform: scale(var(--p-press-scale, 1))
    }
  
    .d-iw { width: max-content }
    .d-iw[data-stretch] > * { width: 100% }
  
    
    .d-ih { display: flex; align-items: stretch }
    .d-ih > * { min-height: 100% }
  
    .mf {
      position:relative;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      line-height:0;
      flex:0 0 auto;
      border-radius:var(--mf-radius);
      background:var(--mf-bg);
      border:var(--mf-border,none);
      box-shadow:var(--mf-shadow,none);
      
      overflow:hidden;
    }
    
    .mf > img { border-radius:inherit }
    .mf-editable { cursor:pointer }
    .mf-overlay {
      position:absolute;
      inset:0;
      display:flex;
      align-items:center;
      justify-content:center;
      
      border-radius:inherit;
      background:color-mix(in oklch,#000 45%,transparent);
      color:#fff;
      opacity:0;
      transition:opacity 120ms ease;
      pointer-events:none;
    }
    
    .mf-editable:hover .mf-overlay,
    .mf-editable:focus-visible .mf-overlay { opacity:1 }
    .mf-editable:focus { outline:none }
    
    .mf-editable:focus-visible {
      outline:2px solid var(--state-focus-ring-color,var(--ring));
      outline-offset:2px;
    }
  
    .d-opacity {
      opacity:var(--d-opacity, 1);
      transition:opacity var(--d-opacity-ms, 0ms) var(--transition-easing)
    }
   .d-padded { padding: var(--d-pad,0) } 
    .positioned { position: absolute; top: var(--pos-top); right: var(--pos-right); bottom: var(--pos-bottom); left: var(--pos-left) }
    .positioned.pos-center { display: flex; align-items: center }
  
    input.data-view-sel-cb[type=checkbox] { appearance:auto; -webkit-appearance:auto; -moz-appearance:auto; opacity:1; position:static; width:14px; height:14px; cursor:pointer; accent-color:var(--primary); margin:0 }
    [data-dv-bulk-busy] { pointer-events:none; opacity:0.62; transition:opacity 120ms ease }
    [data-dv-bulk-busy] [data-dv-bulk-mutate].pending::after { content:""; display:inline-block; width:0.75em; height:0.75em; margin-left:0.5em; vertical-align:-0.05em; border:2px solid currentColor; border-right-color:transparent; border-radius:50%; animation:dv-bulk-spin 700ms linear infinite }
    @keyframes dv-bulk-spin { to { transform:rotate(360deg) } }
    @media (prefers-reduced-motion: reduce) { [data-dv-bulk-busy] [data-dv-bulk-mutate].pending::after { animation:none } }
  
    .d-ident { display: contents }
  
    .scv-shell { min-height: 0; min-width: 0 }
    .scv-shell[data-maxh] { max-height: var(--scv-maxh) }

    
    .scv-shell.scv-bleed {
      box-sizing: border-box;
      margin-inline: calc(-1 * var(--rv-pi, 0px));
      margin-block: calc(-1 * var(--space-6));
      padding-inline: var(--rv-pi, 0px);
      padding-block: var(--space-6);
      
      scrollbar-gutter: stable;
    }

    
    .d-expanded:has(> .scv-shell.scv-bleed),
    .flexible:has(> .scv-shell.scv-bleed) { overflow: visible }

    
    .scv-shell.overflow-x-auto { -webkit-overflow-scrolling: touch }
    .scv-shell.overflow-x-auto > *,
    .scv-shell.overflow-auto > * { min-width: max-content }

    
    .scv-shell.overflow-x-auto > .scv-self-width,
    .scv-shell.overflow-auto > .scv-self-width { min-width: 0 }
  
    .sizedbox[data-w] { width: var(--sb-w) } .sizedbox[data-h] { height: var(--sb-h) }
    .gap-xs { min-width:var(--space-1); min-height:var(--space-1) }
    .gap-sm { min-width:var(--space-2); min-height:var(--space-2) }
    .gap-md { min-width:var(--space-4); min-height:var(--space-4) }
    .gap-lg { min-width:var(--space-6); min-height:var(--space-6) }
    .gap-xl { min-width:var(--space-8); min-height:var(--space-8) }
   .stack { display:grid;position:relative;flex:1;min-height:inherit } .stack > * { grid-area:1/1 } 
    .d-rotate {
      display:inline-block;
      transform:rotate(var(--d-rot))
    }
  
    .matrix-cell { border:1px solid #e2e2e3; background:#fff; box-sizing:border-box }
    .matrix-cell[data-fit="fixed"] { width:300px; height:220px; overflow:hidden }
    .matrix-cell[data-fit="auto"] { min-width:90px; min-height:64px; padding:8px; display:flex; align-items:center; justify-content:center }
  
    .screen-cell { border:1px solid #e2e2e3; background:#fff; box-sizing:border-box; width:420px; height:360px; overflow:hidden; position:relative }
  
    .state-cell { width:220px; height:96px; border:1px solid #e2e2e3; background:#fff; box-sizing:border-box; overflow:hidden; display:flex; align-items:center; justify-content:center; padding:8px }
  
    .tcm-knob { display:flex; flex-direction:column; gap:4px }
    .tcm-knob-lbl { display:flex; align-items:baseline; justify-content:space-between; gap:8px; height:16px; margin:0; font-size:12px; line-height:16px; color:var(--color-text-secondary) }
    .tcm-knob-ends { font-size:11px; line-height:16px; color:var(--color-text-muted); white-space:nowrap }
    .tcm-seg { display:flex; width:360px; max-width:100%; height:32px; margin:0; padding:0; border:1px solid var(--color-border-default); border-radius:8px; background:var(--color-surface-muted); overflow:hidden }
    .tcm .tcm-stop { flex:1 1 0; min-width:0; height:30px; margin:0; padding:0 4px; display:inline-flex; align-items:center; justify-content:center; font-size:12px; line-height:16px; font-weight:500; color:var(--color-text-secondary); background:transparent; border:0; border-left:1px solid var(--color-border-subtle); border-radius:0; text-decoration:none; cursor:pointer; white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
    .tcm .tcm-stop:first-child { border-left:0 }
    .tcm .tcm-stop:hover { background:var(--color-surface-raised); color:var(--color-text-primary) }
    .tcm .tcm-stop:focus-visible { outline:2px solid var(--color-focus-ring); outline-offset:-2px }
    .tcm .tcm-stop[aria-current="true"] { background:var(--color-accent); color:var(--color-on-accent); font-weight:600 }
    @media (max-width:719px) { .tcm-seg { width:280px } }
  
    .tcm-tune { display:flex; flex-direction:column; gap:16px; min-height:0; overflow-y:auto; padding-right:4px }
    .tcm-group { display:flex; flex-direction:column; gap:8px }
    .tcm-h { margin:0; font-size:11px; line-height:16px; font-weight:600; letter-spacing:0.5px; text-transform:uppercase; color:var(--color-text-muted) }
    .tcm-swatches { display:flex; flex-wrap:wrap; align-items:center; gap:8px; min-height:32px }
    .tcm .tcm-sw { width:32px; height:32px; min-width:32px; margin:0; padding:0; border-radius:8px; border:1px solid var(--color-border-default); display:inline-flex; align-items:center; justify-content:center; text-decoration:none; cursor:pointer; flex:none }
    .tcm .tcm-sw:hover { border-color:var(--color-text-secondary) }
    .tcm .tcm-sw:focus-visible { outline:2px solid var(--color-focus-ring); outline-offset:2px }
    .tcm .tcm-sw[aria-current="true"] { box-shadow:0 0 0 2px var(--color-surface-overlay), 0 0 0 4px var(--color-accent) }
    .tcm .tcm-sw[aria-disabled="true"] { opacity:0.4; pointer-events:none }
    .tcm .tcm-swatches .tcm-well { width:32px; height:32px; min-width:32px; margin:0; padding:3px; border:1px solid var(--color-border-default); border-radius:8px; background:var(--color-surface-raised); font-size:13px; line-height:20px; box-shadow:none; cursor:pointer; appearance:none; -webkit-appearance:none; flex:none }
    .tcm .tcm-reset { color:var(--color-text-muted); background:var(--color-surface-raised) }
    .tcm .tcm-reset:hover { color:var(--color-text-primary) }
    .tcm .tcm-reset .icon { width:16px; height:16px }
  
    .theme-boundary-frame {
      width: 100%;
      height: 240px;
      border: 0;
      background: transparent;
      display: block;
    }
    
    .theme-boundary-contents { display: contents !important; }
  
    
    .d-copy-btn {
      all:unset;
      box-sizing:border-box;
      cursor:pointer;
      display:inline-flex;
      align-items:center;
      gap:5px;
      padding:2px 7px;
      border-radius:6px;
      font-size:var(--caption-size, 0.8125rem);
      font-weight:600;
      line-height:1.4;
      vertical-align:baseline;
      color:var(--color-text-secondary, #57606a);
      border:1px solid transparent;
      transition:background 120ms ease, color 120ms ease, border-color 120ms ease;
    }
    .d-copy-btn:hover {
      color:var(--color-text-primary, #1f2328);
      background:var(--color-surface-muted-opaque, #f6f8fa);
      border-color:var(--color-border-default, rgba(27,31,36,0.15));
    }
    
    .d-copy-btn:focus-visible {
      outline:none;
      box-shadow:var(--state-focus-ring, 0 0 0 3px color-mix(in oklch, var(--color-primary, #6366f1) 40%, transparent));
    }
    
    .d-copy-btn[data-copied] {
      color:var(--color-success, #1a7f37);
      background:transparent;
      border-color:transparent;
    }
    .d-copy-text { font-weight:600 }
    .d-copy-btn.d-copy-mono .d-copy-text {
      font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
      font-size:calc(var(--caption-size, 0.8125rem) * 1.02);
      letter-spacing:0;
    }
    
    .d-copy-glyph { display:inline-flex; align-items:center; line-height:0 }
    .d-copy-ico { width:13px; height:13px; display:block }
    .d-copy-ico-done { display:none }
    .d-copy-btn[data-copied] .d-copy-ico-idle { display:none }
    .d-copy-btn[data-copied] .d-copy-ico-done { display:block }
    @media (prefers-reduced-motion) { .d-copy-btn { transition:none } }
  
    .kb-col {
      flex: 0 0 auto;
      box-sizing: border-box;
      width: 300px;
      max-width: 85vw;
      display: flex;
      flex-direction: column;
      gap: var(--space-2, 8px);
      padding: var(--space-2, 8px);
      border-radius: var(--radius);
      background: color-mix(in oklch, var(--foreground) 3%, var(--background));
      outline: 2px solid transparent;
      outline-offset: -2px;
      transition: background 120ms ease, outline-color 120ms ease;
    }
    .kb-col.kb-drop-active {
      background: color-mix(in oklch, var(--primary) 8%, var(--background));
      outline-color: color-mix(in oklch, var(--primary) 40%, transparent);
    }
  
    .kb-card { cursor: grab; }
    .kb-card:active { cursor: grabbing; }
    .kb-card.kb-dragging { opacity: 0.5; }
    .kb-card.kb-saving { animation: kb-pulse 1s ease-in-out infinite; }
    @keyframes kb-pulse { 0%,100% { opacity: 1 } 50% { opacity: 0.55 } }
  
    
    
    
    .dv-grid { display:grid; grid-template-columns:var(--dv-cols, 1fr); grid-template-rows:auto auto;
               width:100%; min-width:0; min-height:0; --dv-row-min:44px;
      
      --dv-surface-raised:var(--color-surface-raised-opaque);
      
      --dv-frozen-divider:var(--border-subtle, var(--border));
      
      --dv-sel-w:var(--dv-sel-w-base, 56px);
      --dv-act-w:72px }
    
    @media (max-width:640px) {
      
      .dv-grid { --dv-sel-w:min(var(--dv-sel-w-base, 56px), 40px); --dv-act-w:44px }
    }
      
    .dv-thead { grid-column:1 / -1; display:grid; grid-template-columns:subgrid }
    .dv-tbody { grid-column:1 / -1; display:grid; grid-template-columns:subgrid }
    .dv-row {
      grid-column:1 / -1;
      display:grid;
      grid-template-columns:subgrid;
      align-items:center;
    }
    .dv-tbody .dv-row { min-height:var(--dv-row-min, 44px) }
    
    .dv-tbody[data-dv-fill] { align-content:stretch; min-height:0 }
    
    
    .dv-grid[data-dv-fill] { grid-template-rows:auto minmax(0,1fr); height:100%; min-height:0 }
    .dv-hcell, .dv-cell {
      box-sizing:border-box;
      overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
      min-width:0;
      padding:0 var(--space-4);
    }
    
    .dv-hcell { min-width:min-content }
    
    .dv-hcell.dv-hcell-rigid { min-width:0 }
    
    .dv-cell { color:var(--foreground) }
    
    .dv-cell:has([data-slot="badge"]) { overflow:visible; text-overflow:clip }
    
    .dv-hcell.dv-col-hidden, .dv-cell.dv-col-hidden {
      padding:0; border:0; overflow:hidden; visibility:hidden;
      
      min-width:0; width:0;
    }
    .dv-col-hidden .dv-col-resize { display:none }
    
    .dv-hcell {
      
      position:relative;
      font-size:var(--caption-size, var(--small-font-size, 0.8125rem));
      letter-spacing:0.01em; color:var(--muted-foreground);
      font-weight:var(--heading-weight, 600);
      padding-top:var(--space-3); padding-bottom:var(--space-3);
      
      background:var(--dv-surface-raised);
    }
    
    .dv-thead .dv-row { position:sticky; top:0; z-index:3; border-bottom:1px solid var(--border-subtle, var(--border)) }
    
    .dv-tbody .dv-row { border-bottom:1px solid var(--border-subtle, var(--border)) }
    .dv-tbody .dv-row:last-child { border-bottom:0 }
    
    
    @property --dv-state-layer { syntax:"<color>"; inherits:true; initial-value:transparent }
    .dv-tbody .dv-row {
      --dv-state-layer:transparent;
      
      --dv-row-bg:linear-gradient(var(--dv-state-layer),var(--dv-state-layer)),var(--dv-surface-raised);
      background:var(--dv-state-layer);
      transition:--dv-state-layer 120ms ease;
    }
    
    .dv-tbody .dv-row:hover {
      --dv-state-layer:color-mix(in oklch, var(--foreground) 8%, transparent);
      box-shadow:inset 2px 0 0 var(--state-focus-ring-color, var(--ring));
    }
    .dv-tbody .dv-row[data-dv-href] { cursor:pointer }
    
    .dv-tbody .dv-row[data-dv-selected="1"] {
      --dv-state-layer:color-mix(in oklch, var(--primary) 12%, transparent);
    }
    .dv-cell-ctr, .dv-hcell-ctr { text-align:center; justify-content:center }
    .dv-cell-r, .dv-hcell-r { text-align:right; justify-content:end }
    
    .dv-sticky-l { position:sticky; left:0; z-index:2 }
    .dv-sticky-r { position:sticky; right:0; z-index:2 }
    .dv-cell.dv-sticky-l, .dv-cell.dv-sticky-r {
      overflow:visible; text-overflow:clip;
      
      background:var(--dv-row-bg);
      
      display:flex; align-items:center; justify-content:center;
      padding-top:0; padding-bottom:0;
      
      align-self:stretch;
    }
    
    .dv-cell.dv-sticky-l { border-inline-end:1px solid var(--dv-frozen-divider) }
    .dv-cell.dv-sticky-r { border-inline-start:1px solid var(--dv-frozen-divider) }
    
    
    
    .dv-tbody .dv-row:hover .dv-cell.dv-sticky-l {
      box-shadow:inset 2px 0 0 var(--state-focus-ring-color, var(--ring));
    }
    .dv-tbody .dv-row:hover .dv-cell.dv-sticky-r {
      box-shadow:inset -2px 0 0 var(--state-focus-ring-color, var(--ring));
    }
    .dv-hcell.dv-sticky-l, .dv-hcell.dv-sticky-r {
      overflow:visible; text-overflow:clip;
      
      background:var(--dv-surface-raised);
      
      display:flex; align-items:center; justify-content:center;
      
      align-self:stretch;
    }
    .dv-hcell.dv-sticky-l { border-inline-end:1px solid var(--dv-frozen-divider) }
    .dv-hcell.dv-sticky-r { border-inline-start:1px solid var(--dv-frozen-divider) }
    
    
    .dv-hcell .sort-indicator, .dv-hcell .d-rotate { vertical-align:middle }
    .dv-empty { grid-column:1 / -1; padding:var(--space-6); text-align:center; color:var(--muted-foreground); white-space:normal }
    
    .dv-hcell .dv-col-resize {
      position:absolute; top:0; right:0; width:7px; height:100%;
      cursor:col-resize; user-select:none; touch-action:none; z-index:1;
    }
    .dv-col-resize::after {
      content:""; position:absolute; top:18%; right:2px; width:2px; height:64%;
      border-radius:1px; background:transparent;
      transform:scaleX(1); transform-origin:center;
      transition:background-color 120ms ease, transform 120ms ease;
    }
    
    .dv-col-resize:hover::after { background:color-mix(in oklch, var(--foreground) 30%, transparent); transform:scaleX(2) }
    .dv-col-resize--active::after { background:var(--state-focus-ring-color, var(--ring)); transform:scaleX(2.5) }
    
    body.dv-resizing { cursor:col-resize !important }
    body.dv-resizing * { cursor:col-resize !important; user-select:none !important }
    
    .dv-row-resize {
      position:absolute; left:0; right:0; bottom:-4px; height:9px;
      cursor:row-resize; user-select:none; touch-action:none; z-index:4;
    }
    .dv-row-resize::after {
      content:""; position:absolute; left:18%; right:18%; bottom:3px; height:2px;
      border-radius:1px; background:transparent;
      transform:scaleY(1); transform-origin:center;
      transition:background-color 120ms ease, transform 120ms ease;
    }
    .dv-row-resize:hover::after { background:color-mix(in oklch, var(--foreground) 30%, transparent); transform:scaleY(2) }
    .dv-row-resize--active::after { background:var(--state-focus-ring-color, var(--ring)); transform:scaleY(2.5) }
    body.dv-row-resizing { cursor:row-resize !important }
    body.dv-row-resizing * { cursor:row-resize !important; user-select:none !important }
    
    @media (max-width:640px) {
      .dv-cell.dv-sticky-d1 {
        position:sticky; left:var(--dv-sel-w, 0px); z-index:2;
        
        background:var(--dv-row-bg);
        border-inline-end:1px solid var(--dv-frozen-divider);
        
        align-self:stretch; display:flex; align-items:center;
      }
      .dv-cell.dv-sticky-d1 > :not([data-slot="badge"]) {
        min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
      }
      .dv-hcell.dv-sticky-d1 {
        position:sticky; left:var(--dv-sel-w, 0px); z-index:2;
        background:var(--dv-surface-raised);
        border-inline-end:1px solid var(--dv-frozen-divider);
      }
      
    }
    
    .dv-cell.dv-pin-l {
      position:sticky; z-index:2;
      
      background:var(--dv-row-bg);
      
      align-self:stretch; display:flex; align-items:center;
    }
    .dv-cell.dv-pin-l > :not([data-slot="badge"]) {
      min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
    }
    .dv-hcell.dv-pin-l { position:sticky; z-index:5; background:var(--dv-surface-raised) }
    
    .dv-cell.dv-pin-l-last { border-inline-end:1px solid var(--dv-frozen-divider) }
    .dv-hcell.dv-pin-l-last { border-inline-end:1px solid var(--dv-frozen-divider) }
    
    
    .dv-hcell.dv-col-dragging { opacity:0.45 }
    .dv-hcell.dv-drop-before { box-shadow:inset 2px 0 0 var(--state-focus-ring-color, var(--ring)) }
    .dv-hcell.dv-drop-after { box-shadow:inset -2px 0 0 var(--state-focus-ring-color, var(--ring)) }
    body.dv-col-reordering { cursor:grabbing !important }
    body.dv-col-reordering * { cursor:grabbing !important; user-select:none !important }
  
    .d-vschip {
      display:inline-flex;
      position:relative;
      cursor:pointer;
    }
    .d-vschip > input {
      position:absolute;
      opacity:0;
      width:0;
      height:0;
      pointer-events:none;
    }
    
    .d-vschip-body {
      display:inline-flex;
      align-items:center;
      gap:var(--space-2);
      padding:var(--space-2) var(--space-3);
      border-radius:var(--radius-lg);
      border:var(--vschip-border, 1px solid var(--border));
      background:var(--vschip-off-bg, transparent);
      color:var(--foreground);
      font-size:var(--small-font-size);
      user-select:none;
      transition:background var(--transition-duration) var(--transition-easing),border-color var(--transition-duration) var(--transition-easing),color var(--transition-duration) var(--transition-easing);
    }
    .d-vschip-body::before {
      content:'';
      width:9px;
      height:5px;
      flex-shrink:0;
      border:solid currentColor;
      border-width:0 0 2px 2px;
      transform:rotate(-45deg);
      margin-top:-3px;
      opacity:0;
      transition:opacity var(--transition-duration) var(--transition-easing);
    }
    
    input:checked + .d-vschip-body {
      background:var(--vschip-on-bg, var(--primary));
      border-color:var(--vschip-on-border, var(--primary));
      color:var(--vschip-on-fg, var(--primary-foreground));
    }
    input:checked + .d-vschip-body::before {
      opacity:1;
    }
    input:focus-visible + .d-vschip-body {
      box-shadow:var(--state-focus-ring);
    }
  
    .fidelity-row { display:flex; flex-direction:column; gap:.5rem; margin-bottom:1.5rem }
    .fidelity-score { min-height:1.5rem; font-size:1.25rem; font-weight:700; text-align:center; letter-spacing:.02em; color:var(--muted-foreground); font-variant-numeric:tabular-nums }
    .fidelity-pair { display:grid; grid-template-columns:1fr 1fr; gap:1rem; align-items:start }
    .fidelity-ref, .fidelity-datum { min-width:0 }
  
    .swipe-deck {
      position:relative;
      width:100%;
      
      min-height:60vh;
      touch-action:pan-y;
      user-select:none;
      -webkit-user-select:none;
    }
    .swipe-deck-card {
      position:absolute;
      inset:0;
      display:none;
      will-change:transform;
      transform-origin:50% 120%;
      
    }
    .swipe-deck-card.sd-live { display:block }
    .swipe-deck-card.sd-anim { transition:transform .32s cubic-bezier(.2,.8,.3,1), opacity .32s linear }
    .swipe-deck-card.sd-gone { opacity:0; pointer-events:none }
    .swipe-deck-empty { display:none; position:absolute; inset:0 }
    .swipe-deck.sd-exhausted .swipe-deck-empty { display:flex; align-items:center; justify-content:center }
    
    .swipe-deck-hint {
      position:absolute; top:16px; z-index:5; pointer-events:none;
      padding:6px 14px; border-radius:999px; font-weight:700; font-size:14px;
      letter-spacing:.04em; text-transform:uppercase; opacity:0;
      border:2px solid currentColor;
    }
    .swipe-deck-hint-yes { right:16px; color:var(--success, #16a34a); transform:rotate(8deg) }
    .swipe-deck-hint-no  { left:16px;  color:var(--destructive, #dc2626); transform:rotate(-8deg) }
    @media (prefers-reduced-motion: reduce) {
      .swipe-deck-card.sd-anim { transition-duration:.01ms }
    }
  
    .atom-spinner {
      display:inline-block;
      border:2px solid var(--sp-track);
      border-top-color:var(--sp-active);
      border-radius:var(--radius-full);
      width:var(--sp-sz);
      height:var(--sp-sz);
      animation:var(--sp-anim)
    }
  
    .meter-ring {
      position:relative;
      display:inline-grid;
      place-items:center;
      flex:0 0 auto;
      width:var(--mr-sz);
      height:var(--mr-sz)
    }
    .meter-ring-arc {
      position:absolute;
      inset:0;
      border-radius:var(--radius-full);
      background:conic-gradient(var(--mr-active) var(--mr-turn), var(--mr-track) 0);
      -webkit-mask:radial-gradient(farthest-side, transparent calc(100% - var(--mr-th)), #000 calc(100% - var(--mr-th)));
      mask:radial-gradient(farthest-side, transparent calc(100% - var(--mr-th)), #000 calc(100% - var(--mr-th)));
      transition:background var(--transition-duration) var(--transition-easing)
    }
    .meter-ring-num {
      position:relative;
      font-size:var(--mr-fs);
      font-weight:var(--bold-weight);
      line-height:1;
      color:var(--mr-active);
      font-variant-numeric:tabular-nums
    }
  
    @keyframes shimmer-sweep {
      0% {
        transform:translateX(-200%)
      }
      100% {
        transform:translateX(200%)
      }
    }
    @keyframes veil-in {
      from {
        opacity:0
      }
      to {
        opacity:1
      }
    }
    
    .shimmer-mode {
      position:relative;
      overflow:hidden;
      pointer-events:none;
      user-select:none
    }
    
    .shimmer-mode::before {
      content:'';
      position:absolute;
      inset:0;
      z-index:1;
      background:color-mix(in srgb,var(--background) 25%,transparent);
      opacity:0;
      animation:veil-in .12s ease-out .18s forwards;
      pointer-events:none
    }
    .shimmer-mode::after {
      content:'';
      position:absolute;
      inset:0;
      z-index:2;
      background:linear-gradient(105deg,transparent 35%,rgba(0,0,0,.12) 50%,transparent 65%);
      opacity:0;
      animation:veil-in .12s ease-out .18s forwards,shimmer-sweep 1.2s ease-in-out .18s infinite;
      pointer-events:none
    }
    
    .shimmer-mode [data-preserve] {
      pointer-events:auto;
      user-select:auto
    }
    .pending {
      opacity:.6;
      pointer-events:none;
      cursor:progress;
      transition:opacity 80ms
    }
    
    @keyframes sk-reveal {
      from { opacity:0 }
      to { opacity:1 }
    }
    .sk-delayed {
      opacity:0;
      animation:sk-reveal 140ms ease-out 500ms both;
      pointer-events:none;
      user-select:none
    }
    @media (prefers-reduced-motion:reduce) {
      .sk-delayed { animation:sk-reveal 1ms linear 500ms both }
    }
    .atom-skeleton {
      display:inline-block;
      vertical-align:middle;
      flex-shrink:0;
      background:var(--sk-grad);
      background-size:400% 100%;
      border-radius:var(--sk-r);
      width:var(--sk-w);
      height:var(--sk-h);
      animation:var(--sk-anim)
    }
    .atom-skeleton[data-shape="round"] {
      border-radius:var(--radius-full)
    }
    .sk {
      display:inline-block;
      vertical-align:middle;
      flex-shrink:0;
      background:linear-gradient(90deg,var(--muted) 25%,color-mix(in srgb,var(--muted) 40%,var(--card)) 50%,var(--muted) 75%);
      background-size:400% 100%;
      border-radius:4px;
      animation:datum-shimmer 1.6s ease-in-out infinite
    }
    .sk-h1 { height:1.75rem; width:7rem }
    .sk-h2 { height:1.375rem; width:9rem }
    .sk-h3 { height:1.25rem; width:7rem }
    .sk-h4 { height:1.1rem; width:5.5rem }
    .sk-p { height:1rem; width:11rem }
    .sk-sm { height:.75rem; width:5rem }
    .sk-badge { height:1.25rem; width:4rem; border-radius:var(--radius-full) }
    .sk-btn { height:2.25rem; width:5rem; border-radius:var(--radius) }
    .sk-link { height:1rem; width:6rem }
  
    .progress {
      width:100%
    }
    .progress-label {
      display:flex;
      justify-content:space-between;
      margin-bottom:var(--space-1);
      font-size:var(--small-font-size);
      color:var(--muted-foreground)
    }
    .progress-track {
      width:100%;
      height:var(--progress-track-h, 8px);
      border-radius:var(--radius-full);
      background:var(--muted);
      overflow:hidden
    }
    .progress-bar {
      height:100%;
      border-radius:var(--radius-full);
      background:var(--primary);
      transition:width var(--transition-duration) var(--transition-easing);
      width:var(--p-pct)
    }
  
    .chat-composer {
      display:flex;
      flex-direction:column;
      gap:var(--space-2);
      width:100%;
      position:relative;
      box-sizing:border-box;
      padding:var(--space-2);
      border:var(--field-border, 1px solid var(--border));
      border-radius:var(--field-radius, var(--radius));
      background:var(--field-bg, var(--card));
      transition:box-shadow var(--transition-duration) var(--transition-easing),border-color var(--transition-duration) var(--transition-easing),background-color 150ms ease
    }
    
    .chat-composer:focus-within {
      box-shadow:var(--state-focus-ring);
      border-color:var(--state-focus-ring-color, var(--ring))
    }
    
    .chat-composer.cc-internal-active {
      border-color:var(--warning, var(--destructive, #b45309));
      background:color-mix(in oklch, var(--warning, var(--destructive, #b45309)) 6%, var(--field-bg, var(--card)))
    }
    .cc-strip { display:flex }
    .cc-row { display:flex; align-items:flex-end; gap:var(--space-2) }
    
    
    
    .cc-rich { white-space:pre-wrap; overflow-wrap:anywhere; outline:none;
      min-height:1.5em; max-height:40vh; overflow-y:auto; cursor:text }
    .cc-rich:empty::before { content:attr(data-cc-ph); color:var(--muted-foreground);
      opacity:0.7; pointer-events:none }
    
    .cc-mk { font-size:0; opacity:0; transition:opacity 90ms ease }
    .cc-mk-on { font-size:inherit; opacity:0.35 }
    .cc-x-b { font-weight:700 }
    .cc-x-i { font-style:italic }
    .cc-x-s { text-decoration:line-through }
    .cc-x-code { font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
      background:var(--muted); border-radius:3px; padding:0 3px }
    .cc-fmt { display:flex; align-items:center; gap:2px; margin:0.15rem 0 0 0;
      opacity:0.55; transition:opacity 160ms ease }
    .chat-composer:focus-within .cc-fmt, .cc-fmt:hover { opacity:1 }
    .cc-fmt-btn { display:inline-flex; align-items:center; justify-content:center;
      width:26px; height:26px; padding:0; border:none; border-radius:var(--radius);
      background:transparent; color:var(--muted-foreground); cursor:pointer;
      transition:background-color 120ms ease, color 120ms ease }
    .cc-fmt-btn:hover { background:var(--muted); color:var(--foreground) }
    .cc-fmt-btn:active { background:var(--accent) }
    .cc-fmt-btn:focus-visible { outline:none; box-shadow:var(--state-focus-ring) }
    .cc-fmt-sep { width:1px; height:16px; margin:0 6px; background:var(--border);
      flex:0 0 auto }
    .cc-left { display:flex; align-items:center; gap:var(--space-1); flex:0 0 auto }
    .cc-btn {
      display:inline-flex;
      align-items:center;
      justify-content:center;
      width:36px;
      height:36px;
      padding:0;
      border:1px solid var(--border);
      border-radius:var(--radius);
      background:transparent;
      color:var(--muted-foreground);
      cursor:pointer;
      transition:background-color 120ms ease,color 120ms ease,border-color 120ms ease
    }
    .cc-btn:hover { background:color-mix(in oklch,var(--accent) 12%,transparent); color:var(--foreground) }
    .cc-btn:active { background:color-mix(in oklch,var(--primary) 16%,transparent) }
    
    .cc-btn:focus-visible { outline:none; border-color:var(--state-focus-ring-color, var(--ring)); box-shadow:var(--state-focus-ring) }
    
    .cc-internal-btn .cc-icon-lock { display:none }
    .chat-composer.cc-internal-active .cc-internal-btn {
      color:var(--warning, var(--destructive, #b45309));
      border-color:var(--warning, var(--destructive, #b45309));
      background:color-mix(in oklch, var(--warning, var(--destructive, #b45309)) 12%, transparent)
    }
    .chat-composer.cc-internal-active .cc-internal-btn .cc-icon-unlock { display:none }
    .chat-composer.cc-internal-active .cc-internal-btn .cc-icon-lock { display:inline-flex }
    .cc-editor {
      flex:1 1 auto;
      min-width:0;
      box-sizing:border-box;
      min-height:36px;
      max-height:var(--composer-max-h, 12rem);
      padding:6px var(--space-3);
      margin:0;
      border:none;
      background:transparent;
      color:var(--foreground);
      font-family:inherit;
      font-size:var(--small-font-size);
      line-height:1.5;
      resize:none;
      outline:none;
      overflow-y:hidden;
      transition:height 120ms ease
    }
    
    .cc-editor::placeholder { color:var(--muted-foreground); opacity:0.7; white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
    .cc-send {
      display:inline-flex;
      align-items:center;
      justify-content:center;
      width:36px;
      height:36px;
      padding:0;
      flex:0 0 auto;
      border:none;
      border-radius:var(--radius);
      background:var(--primary);
      color:var(--primary-foreground);
      cursor:pointer;
      transition:background-color 120ms ease,opacity 120ms ease
    }
    .cc-send:not(:disabled):hover { background:color-mix(in oklch,var(--primary) 88%,black) }
    .cc-send:focus-visible { outline:none; box-shadow:var(--state-focus-ring) }
    .cc-send:disabled { opacity:var(--state-disabled-opacity, 0.5); cursor:var(--state-disabled-cursor, not-allowed) }
    
    .cc-mentions {
      position:absolute;
      z-index:30;
      left:var(--space-2);
      bottom:calc(100% + var(--space-1));
      min-width:220px;
      max-width:min(360px, 92%);
      max-height:15rem;
      overflow-y:auto;
      padding:var(--space-1);
      background:var(--card);
      border:1px solid var(--border);
      border-radius:var(--radius);
      box-shadow:var(--shadow-md, 0 8px 24px rgba(0,0,0,.18))
    }
    .cc-mentions[hidden] { display:none }
    .cc-men-item {
      display:flex;
      flex-direction:column;
      gap:1px;
      padding:var(--space-1) var(--space-2);
      border-radius:var(--radius);
      cursor:pointer
    }
    .cc-men-item:hover,
    .cc-men-item.cc-men-active { background:color-mix(in oklch, var(--accent) 14%, transparent) }
    .cc-men-label { color:var(--foreground); font-size:var(--small-font-size); line-height:1.3 }
    .cc-men-detail { color:var(--muted-foreground); font-size:calc(var(--small-font-size) * 0.85); line-height:1.2 }
  
    .checkbox {
      display:flex;
      align-items:center;
      gap:var(--space-2);
      cursor:pointer;
      position:relative;
      font-size:var(--small-font-size);
      color:var(--foreground)
    }
    .checkbox > input {
      position:absolute;
      opacity:0;
      width:0;
      height:0;
      pointer-events:none
    }
    .checkbox-box {
      width:var(--checkbox-size, 18px);
      height:var(--checkbox-size, 18px);
      border:var(--checkbox-border, 2px solid var(--border));
      border-radius:var(--checkbox-radius, 2px);
      background:var(--checkbox-off-bg, transparent);
      display:inline-flex;
      align-items:center;
      justify-content:center;
      flex-shrink:0;
      transition:background var(--transition-duration) var(--transition-easing),border-color var(--transition-duration) var(--transition-easing);
      position:relative
    }
    .checkbox-box::after {
      content:'';
      width:10px;
      height:6px;
      border:solid var(--checkbox-check-color, var(--primary-foreground));
      border-width:0 0 2px 2px;
      transform:rotate(-45deg) scale(0) translate(1px, -1px);
      transform-origin:center;
      transition:transform 150ms var(--transition-easing);
      margin-top:-2px
    }
    .checkbox > input:checked + .checkbox-box {
      background:var(--checkbox-on-bg, var(--primary));
      border-color:var(--checkbox-on-border, var(--primary))
    }
    .checkbox > input:checked + .checkbox-box::after {
      transform:rotate(-45deg) scale(1) translate(1px, -1px)
    }
    
    .checkbox > input:focus-visible + .checkbox-box {
      box-shadow:var(--state-focus-ring)
    }
    
    .checkbox > input[aria-invalid="true"] + .checkbox-box {
      border-color:var(--state-invalid-border-color)
    }
    
    .checkbox > input:disabled + .checkbox-box, .checkbox > input[aria-disabled="true"] + .checkbox-box {
      opacity:var(--state-disabled-opacity);
      cursor:var(--state-disabled-cursor)
    }
    
    .checkbox > input[aria-busy="true"] + .checkbox-box {
      cursor:var(--state-busy-cursor)
    }
  
    .cs-toggle {
      display:inline-flex;
      gap:0;
      padding:var(--space-1);
      background:var(--color-surface-muted);
      border:1px solid var(--color-border-subtle);
      border-radius:var(--radius-md);
      font-size:var(--font-size-label-small, 0.75rem)
    }
    .cs-toggle button {
      appearance:none;
      background:transparent;
      border:0;
      padding:var(--space-1) var(--space-3);
      color:var(--color-text-secondary);
      cursor:pointer;
      border-radius:var(--radius-sm);
      font:inherit;
      line-height:1
    }
    .cs-toggle button:hover {
      color:var(--color-text-primary);
      font-weight:600
    }
    .cs-toggle button[aria-pressed=true] {
      background:var(--color-surface-canvas);
      color:var(--color-text-primary);
      box-shadow:var(--shadow-sm)
    }
  
    .data-view-edit-cell {
      display:inline-block;
      box-sizing:border-box;
      min-width:60px;
      max-width:100%;
      padding:2px 6px;
      margin:-2px -6px;
      border-radius:var(--radius);
      cursor:text;
      transition:background 100ms ease;
      outline:1px dashed transparent;
      outline-offset:2px;
      vertical-align:top;
      
      white-space:normal;
      overflow-wrap:anywhere
    }
    .data-view-edit-cell:hover {
      background:color-mix(in oklch, var(--primary) 6%, transparent);
      outline-color:color-mix(in oklch, var(--primary) 25%, transparent)
    }
    .data-view-edit-cell.data-view-saving {
      background:color-mix(in oklch, var(--primary) 12%, transparent)
    }
    .data-view-edit-cell.data-view-editing {
      padding:0;
      margin:0;
      outline:none;
      
      overflow:visible;
      white-space:normal;
      text-overflow:clip
    }
    .data-view-edit-cell input {
      box-sizing:border-box;
      height:32px;
      width:100%;
      min-width:100px;
      padding:4px 6px;
      font-size:var(--small-font-size);
      font-family:inherit;
      color:var(--foreground);
      background:var(--card);
      border:1px solid var(--ring);
      border-radius:var(--radius);
      box-shadow:0 0 0 3px color-mix(in oklch, var(--ring) 25%, transparent);
      outline:none
    }
   .file-field { margin-bottom:var(--space-4) }.file-field-label { display:block;font-size:14px;font-weight:500;margin-bottom:var(--space-1);color:var(--foreground) }.file-field-preview { max-width:200px;max-height:150px;border-radius:var(--radius);margin-bottom:var(--space-2);object-fit:cover;border:1px solid var(--border) }.file-field-input { display:block;width:100%;padding:var(--space-2);border:1px solid var(--border);border-radius:var(--radius);background:var(--background);color:var(--foreground);cursor:pointer }.file-field-input:hover { border-color:var(--primary);outline:1px solid var(--primary);outline-offset:-1px } 
    .inline-edit-field {
      position:relative;
      display:inline-flex;
      align-items:center;
      gap:var(--space-1, 4px);
      max-width:100%;
      padding:2px 6px;
      margin:-2px -6px;
      border-radius:var(--radius);
      cursor:pointer;
      vertical-align:middle;
      outline:1px solid transparent;
      outline-offset:1px;
      transition:background 120ms ease,outline-color 120ms ease,box-shadow 120ms ease
    }
    .inline-edit-field:hover {
      background:color-mix(in oklch, var(--primary) 6%, transparent);
      outline-color:color-mix(in oklch, var(--primary) 22%, transparent)
    }
    .inline-edit-field:focus-visible {
      outline:none;
      box-shadow:var(--state-focus-ring)
    }
    .inline-edit-field.inline-edit-saving {
      background:color-mix(in oklch, var(--primary) 12%, transparent)
    }
    .inline-edit-field.inline-edit-editing {
      cursor:default;
      background:transparent;
      outline-color:transparent;
      padding:0;
      margin:0
    }
    .inline-edit-display { display:inline-flex; align-items:center; min-width:0 }
    .inline-edit-pencil {
      display:inline-flex;
      align-items:center;
      color:var(--muted-foreground);
      
      opacity:0.28;
      pointer-events:none;
      transition:opacity 120ms ease
    }
    .inline-edit-field:hover .inline-edit-pencil,
    .inline-edit-field:focus-visible .inline-edit-pencil { opacity:0.75 }
    .inline-edit-field.inline-edit-editing .inline-edit-pencil { display:none }
    
    .inline-edit-field.inline-edit-editing .inline-edit-display { display:none }
    .inline-edit-input, .inline-edit-select {
      box-sizing:border-box;
      height:32px;
      min-width:120px;
      max-width:100%;
      padding:4px 8px;
      font-size:var(--small-font-size);
      font-family:inherit;
      color:var(--foreground);
      background:var(--card);
      border:1px solid var(--ring);
      border-radius:var(--radius);
      box-shadow:var(--state-focus-ring);
      outline:none
    }
    .inline-edit-select { cursor:pointer }
    
    
    .inline-edit-field.inline-edit-open {
      display:block;
      width:auto;
      min-width:0;
      padding:0;
      margin:0;
      cursor:default
    }
    .inline-edit-field.inline-edit-open:hover {
      background:transparent;
      outline-color:transparent
    }
    .inline-edit-open-select {
      
      width:auto;
      max-width:100%;
      
      height:var(--control-height, 36px);
      min-width:0;
      appearance:none;
      -webkit-appearance:none;
      background-image:linear-gradient(45deg,transparent 50%,var(--muted-foreground) 50%),linear-gradient(135deg,var(--muted-foreground) 50%,transparent 50%);
      background-position:calc(100% - 18px) center,calc(100% - 13px) center;
      background-size:5px 5px,5px 5px;
      background-repeat:no-repeat;
      padding-right:32px
    }
    .inline-edit-open-select option {
      background:var(--color-surface-overlay);
      color:var(--foreground)
    }
    
    
    .field-listbox.inline-edit-open-listbox { margin-bottom:0; min-width:0 }
    .inline-edit-tags {
      box-sizing:border-box;
      display:inline-flex;
      flex-wrap:wrap;
      align-items:center;
      gap:4px;
      min-width:160px;
      max-width:100%;
      padding:4px 6px;
      background:var(--card);
      border:1px solid var(--ring);
      border-radius:var(--radius);
      box-shadow:var(--state-focus-ring)
    }
    .inline-edit-chip {
      display:inline-flex;
      align-items:center;
      gap:2px;
      padding:1px 4px 1px 8px;
      font-size:var(--small-font-size);
      line-height:1.6;
      color:var(--foreground);
      background:color-mix(in oklch, var(--primary) 12%, transparent);
      border-radius:999px
    }
    .inline-edit-chip-x {
      display:inline-flex;
      align-items:center;
      justify-content:center;
      width:16px;
      height:16px;
      padding:0;
      border:none;
      background:transparent;
      color:var(--muted-foreground);
      cursor:pointer;
      border-radius:999px;
      font-size:14px;
      line-height:1
    }
    .inline-edit-chip-x:hover {
      color:var(--foreground);
      background:color-mix(in oklch, var(--foreground) 10%, transparent)
    }
    .inline-edit-tag-input {
      flex:1 1 60px;
      min-width:60px;
      border:none;
      outline:none;
      background:transparent;
      font-size:var(--small-font-size);
      font-family:inherit;
      color:var(--foreground)
    }
  
    .radio-group {
      display:var(--radio-group-display, flex);
      flex-direction:column;
      gap:var(--radio-group-gap, var(--space-2));
      margin-left:var(--radio-group-shift, 0)
    }
    .radio-item {
      display:flex;
      align-items:center;
      gap:var(--radio-item-gap, var(--space-2));
      cursor:pointer
    }
    .radio-circle {
      width:var(--radio-size, 18px);
      height:var(--radio-size, 18px);
      aspect-ratio:1/1;
      border-radius:var(--radius-full);
      border:var(--radio-border-off, 2px solid var(--input));
      flex-shrink:0;
      display:flex;
      align-items:center;
      justify-content:center;
      transition:border-color var(--transition-duration) var(--transition-easing),background var(--transition-duration) var(--transition-easing)
    }
    .radio-item input {
      display:none
    }
    .radio-item input:checked + .radio-circle {
      border-color:var(--radio-border-on-color, var(--primary))
    }
    .radio-item input:checked + .radio-circle::after {
      content:'';
      width:var(--radio-dot-size, 10px);
      height:var(--radio-dot-size, 10px);
      border-radius:var(--radius-full);
      background:var(--radio-dot-color, var(--primary))
    }
    
    .radio-item input:focus-visible + .radio-circle {
      box-shadow:var(--state-focus-ring)
    }
    
    .radio-item input[aria-invalid="true"] + .radio-circle {
      border-color:var(--state-invalid-border-color)
    }
    
    .radio-item input:disabled + .radio-circle, .radio-item input[aria-disabled="true"] + .radio-circle {
      opacity:var(--state-disabled-opacity);
      cursor:var(--state-disabled-cursor)
    }
    
    .radio-item input[aria-busy="true"] + .radio-circle {
      cursor:var(--state-busy-cursor)
    }
    .radio-label {
      font-size:var(--radio-label-size, var(--small-font-size));
      font-weight:var(--radio-label-weight, 400);
      line-height:var(--radio-label-leading, 1.5);
      color:var(--radio-label-color, var(--foreground))
    }
  
    .data-view-readonly { position:relative }
    .data-view-readonly:hover::after {
      content:'\1F512';
      position:absolute;
      right:-18px;
      top:50%;
      transform:translateY(-50%);
      font-size:0.8em;
      opacity:0.45
    }
  
    .rich-composer { display:flex;flex-direction:column;gap:var(--space-1);width:100% }
    .rich-composer-label { display:block;font-size:14px;font-weight:500;color:var(--foreground) }
    .rich-composer-toolbar {
      display:flex;
      flex-wrap:wrap;
      gap:2px;
      align-items:center;
      padding:var(--space-1);
      border:var(--field-border, 1px solid var(--border));
      border-bottom:none;
      border-radius:var(--field-radius, var(--radius)) var(--field-radius, var(--radius)) 0 0;
      background:var(--field-bg, var(--card))
    }
    .rc-tb-btn {
      display:inline-flex;
      align-items:center;
      justify-content:center;
      width:28px;
      height:28px;
      padding:0;
      border:none;
      border-radius:var(--radius);
      background:transparent;
      color:var(--muted-foreground);
      cursor:pointer;
      transition:background-color 100ms ease,color 100ms ease
    }
    .rc-tb-btn:hover { background:color-mix(in oklch,var(--accent) 12%,transparent);color:var(--foreground) }
    .rc-tb-btn:active { background:color-mix(in oklch,var(--primary) 16%,transparent) }
    .rc-tb-btn:focus-visible { outline:none;box-shadow:var(--state-focus-ring) }
    .rich-composer-editor {
      width:100%;
      min-height:5rem;
      max-height:24rem;
      padding:var(--field-padding, var(--space-2) var(--space-3));
      border:var(--field-border, 1px solid var(--border));
      border-radius:0 0 var(--field-radius, var(--radius)) var(--field-radius, var(--radius));
      background:var(--field-bg, var(--card));
      color:var(--foreground);
      font-size:var(--small-font-size);
      line-height:1.5;
      overflow-y:auto;
      outline:none;
      transition:box-shadow var(--transition-duration) var(--transition-easing),border-color var(--transition-duration) var(--transition-easing)
    }
    
    .rich-composer-editor:focus { border-color:var(--state-focus-ring-color, var(--ring));box-shadow:var(--state-focus-ring) }
    .rich-composer-editor:empty:not(:focus)::before {
      content:attr(data-placeholder);
      color:var(--muted-foreground);
      opacity:0.7;
      pointer-events:none
    }
    .rich-composer-editor p { margin:0 0 var(--space-2) }
    .rich-composer-editor ul, .rich-composer-editor ol { margin:var(--space-1) 0;padding-left:1.5rem }
    .rich-composer-editor a { color:var(--primary);text-decoration:underline }
  
    .segmented {
      display:inline-flex;
      gap:2px;
      padding:2px;
      border:1px solid var(--border);
      border-radius:var(--radius);
      background:var(--muted)
    }
    .segmented button {
      padding:var(--space-1) var(--space-3);
      font-size:var(--small-font-size);
      border:none;
      background:transparent;
      color:var(--muted-foreground);
      border-radius:calc(var(--radius) - 2px);
      cursor:pointer;
      transition:background var(--transition-duration) var(--transition-easing),color var(--transition-duration) var(--transition-easing)
    }
    .segmented button:hover {
      color:var(--foreground);
      font-weight:600
    }
    
    .segmented button:focus-visible {
      outline:none;
      box-shadow:var(--state-focus-ring)
    }
    .segmented button[data-active="1"] {
      background:var(--card);
      color:var(--foreground);
      box-shadow:var(--shadow-sm)
    }
    
    .segmented button:disabled, .segmented button[aria-disabled="true"] {
      opacity:var(--state-disabled-opacity);
      cursor:var(--state-disabled-cursor);
      pointer-events:none
    }
   .slider { width:100% }.slider-label { display:flex;justify-content:space-between;margin-bottom:var(--space-1);font-size:var(--small-font-size);color:var(--muted-foreground) }
    .slider input[type=range] {
      width:100%;
      height:var(--slider-track-height, 4px);
      appearance:none;
      background:var(--slider-inactive-track, var(--surface-container-highest, var(--muted)));
      border-radius:var(--radius-full);
      outline:none;
      cursor:pointer
    }
    .slider input[type=range]::-webkit-slider-thumb {
      appearance:none;
      width:var(--slider-handle-size, 20px);
      height:var(--slider-handle-size, 20px);
      border-radius:var(--radius-full);
      background:var(--slider-handle-color, var(--primary));
      cursor:pointer;
      border:none;
      box-shadow:0 1px 2px 0 rgba(0,0,0,0.30), 0 1px 3px 1px rgba(0,0,0,0.15)
    }
    .slider input[type=range]::-moz-range-thumb {
      width:var(--slider-handle-size, 20px);
      height:var(--slider-handle-size, 20px);
      border-radius:var(--radius-full);
      background:var(--slider-handle-color, var(--primary));
      cursor:pointer;
      border:none;
      box-shadow:0 1px 2px 0 rgba(0,0,0,0.30), 0 1px 3px 1px rgba(0,0,0,0.15)
    }
    .slider input[type=range]:hover::-webkit-slider-thumb {
      box-shadow:0 0 0 var(--slider-state-layer-radius, 10px) color-mix(in oklch, var(--primary) 8%, transparent),
                 0 1px 2px 0 rgba(0,0,0,0.30), 0 1px 3px 1px rgba(0,0,0,0.15)
    }
    .slider input[type=range]:focus::-webkit-slider-thumb {
      box-shadow:0 0 0 var(--slider-state-layer-radius, 10px) color-mix(in oklch, var(--primary) 12%, transparent),
                 0 1px 2px 0 rgba(0,0,0,0.30), 0 1px 3px 1px rgba(0,0,0,0.15)
    }
    
    .slider input[type=range]:focus-visible {
      box-shadow:var(--state-focus-ring)
    }
    
    .slider input[type=range]:disabled, .slider input[type=range][aria-disabled="true"] {
      opacity:var(--state-disabled-opacity);
      cursor:var(--state-disabled-cursor);
      pointer-events:none
    }
  
    .switch {
      display:flex;
      align-items:center;
      gap:var(--space-3);
      cursor:pointer
    }
    .switch-track {
      position:relative;
      width:var(--switch-track-w, 36px);
      height:var(--switch-track-h, 20px);
      border-radius:var(--radius-full);
      background:var(--switch-track-off-bg, var(--muted));
      border:var(--switch-track-border, 1px solid var(--border));
      transition:background var(--transition-duration) var(--transition-easing),border-color var(--transition-duration) var(--transition-easing)
    }
    .switch-thumb {
      position:absolute;
      top:var(--switch-thumb-off-top, 2px);
      left:var(--switch-thumb-off-left, 2px);
      width:var(--switch-thumb-w, 14px);
      height:var(--switch-thumb-h, 14px);
      border-radius:var(--radius-full);
      background:var(--switch-thumb-off-bg, var(--foreground));
      transition:transform var(--transition-duration) var(--transition-easing),background var(--transition-duration) var(--transition-easing),width var(--transition-duration) var(--transition-easing),height var(--transition-duration) var(--transition-easing),top var(--transition-duration) var(--transition-easing),left var(--transition-duration) var(--transition-easing)
    }
    .switch input {
      display:none
    }
    .switch input:checked + .switch-track {
      background:var(--switch-track-on-bg, var(--primary));
      border-color:var(--switch-track-on-border, var(--primary))
    }
    .switch:has(:checked) .switch-thumb {
      transform:translateX(var(--switch-thumb-on-shift, 16px));
      background:var(--switch-thumb-on-bg, var(--primary-foreground));
      width:var(--switch-thumb-on-w, var(--switch-thumb-w, 14px));
      height:var(--switch-thumb-on-h, var(--switch-thumb-h, 14px));
      top:var(--switch-thumb-on-top, var(--switch-thumb-off-top, 2px));
      left:var(--switch-thumb-on-left, var(--switch-thumb-off-left, 2px))
    }
    
    .switch input:focus-visible + .switch-track {
      box-shadow:var(--state-focus-ring)
    }
    
    .switch input[aria-invalid="true"] + .switch-track {
      border-color:var(--state-invalid-border-color)
    }
    
    .switch input:disabled + .switch-track, .switch input[aria-disabled="true"] + .switch-track {
      opacity:var(--state-disabled-opacity);
      cursor:var(--state-disabled-cursor)
    }
    
    .switch input[aria-busy="true"] + .switch-track {
      cursor:var(--state-busy-cursor)
    }
    .switch-label {
      font-size:var(--small-font-size);
      color:var(--foreground)
    }
  
    
    .text-area-input {
      width:100%;
      font-size:var(--small-font-size);
      padding:var(--field-padding, var(--space-2) var(--space-3));
      border:var(--field-border, 1px solid var(--border));
      border-bottom:var(--field-border-bottom, var(--field-border, 1px solid var(--border)));
      border-radius:var(--field-radius, var(--radius));
      background:var(--field-bg, var(--card));
      color:var(--foreground);
      transition:background-color 120ms ease,border-color var(--transition-duration) var(--transition-easing),box-shadow var(--transition-duration) var(--transition-easing)
    }
    .text-area-input::placeholder {
      color:var(--muted-foreground);
      opacity:0.7
    }
    .text-area-input:hover:not(:focus):not(:disabled) {
      background:var(--field-hover-bg, color-mix(in oklch,var(--accent) 8%,var(--card)));
      border-color:color-mix(in oklch,var(--border) 60%,var(--foreground) 20%);
      
      outline:1px solid var(--border);outline-offset:-1px
    }
    
    .text-area-input:focus-visible {
      outline:none;
      border-color:var(--state-focus-ring-color, var(--ring));
      box-shadow:var(--state-focus-ring)
    }
    .text-area-input:focus {
      outline:none;
      border-color:var(--state-focus-ring-color, var(--ring));
      box-shadow:var(--state-focus-ring)
    }
    
    .text-area-input[aria-invalid="true"], .text-area-input:user-invalid {
      border-color:var(--state-invalid-border-color);
      box-shadow:var(--state-invalid-ring)
    }
    
    .text-area-input:disabled, .text-area-input[aria-disabled="true"] {
      opacity:var(--state-disabled-opacity);
      cursor:var(--state-disabled-cursor);
      pointer-events:none
    }
    
    .text-area-input:read-only:not(:disabled), .text-area-input[data-readonly] {
      background:var(--state-readonly-bg);
      opacity:var(--state-readonly-opacity);
      cursor:default
    }
    .field-float > .text-area-input {
      padding:22px 12px 8px
    }
    
    .field-float:has(> .text-area-input) > .field-label {
      top:calc(22px + var(--field-band));
      transform:none
    }
    
    .field-float > .text-area-input:focus ~ .field-label,.field-float > .text-area-input:not(:placeholder-shown) ~ .field-label {
      top:var(--field-band);
      transform:translateY(-50%) scale(0.85);
      background:var(--field-bg, var(--card))
    }
    .field-float > .text-area-input:focus ~ .field-label {
      color:var(--primary)
    }
    
    .field-float > .text-area-input:placeholder-shown:not(:focus)::placeholder { color:transparent }

    
    .text-area-input-term {
      background:#0b0b0c;
      color:#d8d8dc;
      border:0;
      border-radius:0;
      font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;
      font-size:12.5px;
      line-height:1.45;
      
      resize:vertical;
      
      padding:8px 10px;
    }
    
    .text-area-input-term::placeholder { color:#6e6e77; opacity:1 }
    
    .text-area-input-term:hover:not(:focus):not(:disabled) {
      background:#0b0b0c;
      border:0;
      outline:none
    }
    
    .text-area-input-term:focus, .text-area-input-term:focus-visible {
      outline:none;
      border:0;
      box-shadow:inset 2px 0 0 var(--primary, #6366f1)
    }
  
    
    .text-field-input {
      width:100%;
      height:var(--field-height, var(--form-control-height,40px));
      box-sizing:border-box;
      font-size:var(--small-font-size);
      padding:var(--field-padding, 0 var(--space-3));
      
      border:var(--field-border, var(--field-role-border, 1px solid var(--input)));
      border-bottom:var(--field-border-bottom, var(--field-border, var(--field-role-border, 1px solid var(--input))));
      border-radius:var(--field-radius, var(--radius));
      background:var(--field-bg, var(--card));
      color:var(--foreground);
      
      box-shadow:var(--field-shadow, var(--field-role-shadow, none));
      transition:background 120ms ease,box-shadow 120ms ease,border-color 120ms ease
    }
    .text-field-input::placeholder {
      color:var(--muted-foreground);
      opacity:0.7
    }
    
    
    .text-field-input-bare {
      width:100%;
      height:auto;
      display:block;
      border:0;
      background:transparent;
      outline:none;
      padding:0;
      margin:0;
      color:var(--foreground);
      font:inherit;
      line-height:1.5
    }
    .text-field-input-bare::placeholder {
      color:var(--muted-foreground);
      opacity:0.7
    }
    .text-field-input:hover:not(:focus):not(:disabled) {
      background:var(--field-hover-bg, color-mix(in oklch,var(--accent) 8%,var(--card)));
      border-color:color-mix(in oklch,var(--border) 60%,var(--foreground) 20%);
      
      outline:1px solid var(--border);outline-offset:-1px
    }
    
    .text-field-input:focus-visible {
      outline:none;
      border-color:var(--state-focus-ring-color, var(--ring));
      box-shadow:var(--state-focus-ring)
    }
    
    .text-field-input:focus {
      outline:none;
      border-color:var(--state-focus-ring-color, var(--ring));
      box-shadow:var(--state-focus-ring)
    }
    
    .text-field-input[aria-invalid="true"], .text-field-input:user-invalid {
      border-color:var(--state-invalid-border-color);
      box-shadow:var(--state-invalid-ring)
    }
    
    .text-field-input:disabled, .text-field-input[aria-disabled="true"] {
      opacity:var(--state-disabled-opacity);
      cursor:var(--state-disabled-cursor);
      pointer-events:none
    }
    
    .text-field-input:read-only:not(:disabled), .text-field-input[data-readonly] {
      background:var(--state-readonly-bg);
      opacity:var(--state-readonly-opacity);
      cursor:default
    }
    
    .text-field-input[aria-busy="true"] {
      cursor:var(--state-busy-cursor);
      opacity:var(--state-busy-opacity)
    }
    .atom-busy-spinner {
      position:absolute; inset:0; margin:auto;
      width:1em; height:1em; border-radius:50%;
      border:2px solid color-mix(in oklch, var(--state-busy-spinner) 30%, transparent);
      border-top-color:var(--state-busy-spinner);
      animation:atom-spin .6s linear infinite;
      pointer-events:none
    }
    @keyframes atom-spin { to { transform:rotate(360deg) } }
    @media (prefers-reduced-motion) { .atom-busy-spinner { animation:none } }
    
    .field-float, .field-float-outlined {
      --field-band:var(--field-float-band, calc(var(--small-font-size, 0.875rem) * 0.5))
    }
    .field-float {
      position:relative;
      display:block;
      padding-top:var(--field-band);
      margin-bottom:max(0px, calc(var(--space-4) - var(--field-band)))
    }
    .field-float > .field-label {
      position:absolute;
      top:calc(50% + var(--field-band) / 2);
      transform:translateY(-50%);
      left:calc(var(--space-3) - 2px);
      font-size:var(--small-font-size);
      color:var(--muted-foreground);
      pointer-events:none;
      transition:transform 120ms ease,color 120ms ease,font-size 120ms ease;
      transform-origin:top left;
      background:transparent;
      padding:0 6px;
      line-height:1
    }
    
    .field-float > input:focus ~ .field-label,.field-float > input:not(:placeholder-shown) ~ .field-label {
      top:var(--field-band);
      transform:translateY(-50%) scale(0.85);
      background:var(--field-bg, var(--card));
      color:var(--muted-foreground)
    }
    .field-float > input:focus ~ .field-label {
      color:var(--ring)
    }
    
    .field-float > input:placeholder-shown:not(:focus)::placeholder { color:transparent }
    .field-float:has(> input[required]) > .field-label::after,.field-float:has(> textarea[required]) > .field-label::after {
      content:' *';
      color:var(--destructive);
      font-weight:600
    }
    .field-float-outlined {
      position:relative;
      display:block;
      padding-top:var(--field-band);
      margin-bottom:max(0px, calc(var(--space-4) - var(--field-band)))
    }
    .field-float-outlined > input {
      width:100%;
      height:var(--field-outlined-height, 56px);
      box-sizing:border-box;
      font-size:var(--small-font-size);
      padding:0 var(--space-4);
      border:var(--field-outlined-border, 1px solid var(--on-surface-variant, var(--border)));
      border-radius:var(--field-outlined-radius, 4px);
      background:transparent;
      color:var(--foreground);
      
      box-shadow:var(--field-outlined-shadow, var(--field-role-shadow, none));
      transition:border-color 120ms ease,box-shadow 120ms ease
    }
    .field-float-outlined > input:hover:not(:focus):not(:disabled) {
      border-color:var(--field-outlined-hover-border, var(--on-surface, var(--foreground)))
    }
    
    .field-float-outlined > input:focus {
      outline:none;
      border-color:var(--field-outlined-focus-border-color, var(--primary));
      box-shadow:var(--field-outlined-focus-shadow, inset 0 0 0 1px var(--field-outlined-focus-border-color, var(--primary)))
    }
    .field-float-outlined > input::placeholder { color:var(--muted-foreground); opacity:0.7 }
    
    .field-float-outlined > input:placeholder-shown:not(:focus)::placeholder { color:transparent }
    .field-float-outlined > .field-label {
      position:absolute;
      top:calc(50% + var(--field-band) / 2);
      transform:translateY(-50%);
      left:calc(var(--space-3) - 2px);
      font-size:var(--small-font-size);
      color:var(--on-surface-variant, var(--muted-foreground));
      pointer-events:none;
      transition:transform 120ms ease,color 120ms ease,font-size 120ms ease,padding 120ms ease;
      transform-origin:top left;
      background:transparent;
      padding:0 4px;
      line-height:1
    }
    
    .field-float-outlined > input:focus ~ .field-label,.field-float-outlined > input:not(:placeholder-shown) ~ .field-label {
      top:var(--field-band);
      transform:translateY(-50%) scale(0.75);
      background:var(--field-outlined-label-bg, var(--background));
      color:var(--on-surface-variant, var(--muted-foreground))
    }
    .field-float-outlined > input:focus ~ .field-label { color:var(--primary) }
    
    .field-chrome {
      position:relative;
      display:block;
      margin-bottom:var(--space-4)
    }
    
    .field-chrome.field-static > .field-static-label {
      display:block;
      font-size:var(--small-font-size);
      font-weight:var(--medium-weight, 500);
      color:var(--foreground);
      line-height:1.4;
      margin-bottom:var(--space-2)
    }
    .field-chrome.field-static:has(> input[required]) > .field-static-label::after,
    .field-chrome.field-static:has(> textarea[required]) > .field-static-label::after,
    .field-chrome.field-static:has(> select[required]) > .field-static-label::after {
      content:' *';
      color:var(--destructive);
      font-weight:600
    }
  
    
    :root {
      --d-sidebar-collapsed-w: 3.5rem;   
      --d-sidebar-expanded-w: 15rem;     
      --d-sidebar-current-w: var(--d-sidebar-collapsed-w);
      --d-sidebar-reserved-w: var(--d-sidebar-collapsed-w);
    }
    
    :root:has(.d-sidebar:hover),
    :root:has(.d-sidebar:focus-within) {
      --d-sidebar-current-w: var(--d-sidebar-expanded-w);
    }
    
    :root:has(.d-sidebar[data-cs-sidebar-pinned="true"]) {
      --d-sidebar-current-w: var(--d-sidebar-expanded-w);
      --d-sidebar-reserved-w: var(--d-sidebar-expanded-w);
    }
    
    .d-app-shell:has(.main-content [data-shell-chrome-collapse]):not([data-cs-sidebar-reveal=true]) {
      --d-sidebar-current-w: 0px;
      --d-sidebar-reserved-w: 0px;
    }
    
    @media (max-width: 640px) {
      :root,
      :root:has(.d-sidebar:hover),
      :root:has(.d-sidebar:focus-within),
      :root:has(.d-sidebar[data-cs-sidebar-pinned="true"]) {
        --d-sidebar-current-w: 0px;
        --d-sidebar-reserved-w: 0px;
      }
    }
    .d-sidebar {
      position: fixed;
      
      top: var(--d-safe-t, 0px);
      left: var(--d-safe-l, 0px);
      bottom: var(--d-safe-b, 0px);
      
      width: var(--d-sidebar-current-w);
      
      box-sizing: content-box;
      
      background: var(--d-sidebar-bg);
      color: var(--d-sidebar-fg, inherit);
      border-top: var(--d-sidebar-bt, none);
      border-right: var(--d-sidebar-br, none);
      border-bottom: var(--d-sidebar-bb, none);
      border-left: var(--d-sidebar-bl, none);
      box-shadow: var(--d-sidebar-shadow);
      padding: var(--d-sidebar-pad);
      
      overflow: clip;
      overflow-clip-margin: var(--shadow-gutter, 0px);
      
      z-index: 50;
      display: flex;
      flex-direction: column;
      transition: width 200ms var(--transition-easing)
    }
    
    .d-sidebar:hover, .d-sidebar:focus-within {
      
      box-shadow: 6px 0 28px -8px rgba(0,0,0,0.45)
    }
    .d-sidebar[data-cs-sidebar-pinned="true"] {
      box-shadow: none
    }
    
    .d-sidebar [data-collapsible-slot="1"] {
      opacity: 0;
      width: 0;
      max-width: 0;
      overflow: hidden;
      white-space: nowrap;
      transition: opacity 150ms var(--transition-easing);
      min-width: 0
    }
    
    
    .d-sidebar:hover [data-collapsible-slot="1"],
    .d-sidebar:focus-within [data-collapsible-slot="1"],
    .d-sidebar[data-cs-sidebar-open="true"] [data-collapsible-slot="1"],
    .d-sidebar[data-cs-sidebar-pinned="true"] [data-collapsible-slot="1"] {
      opacity: 1;
      width: auto;
      max-width: none;
      overflow: visible
    }
    
    @media (max-width: 640px) {
      .d-sidebar {
        display: none;
        position: fixed;
        inset: 0;
        z-index: 40;
        width: var(--d-sidebar-expanded-w)
      }
      .d-sidebar[data-cs-sidebar-open="true"] {
        display: flex
      }
      
      .d-app-shell[data-nav-surface=rail] .d-sidebar {
        display: flex;
        inset: auto;
        width: var(--d-sidebar-collapsed-w)
      }
      
      
      .d-app-shell:not([data-nav-surface=rail]) .d-sidebar[data-cs-sidebar-open="true"] {
        animation: d-drawer-in 220ms var(--transition-easing, ease);
        touch-action: pan-y;
        overscroll-behavior: contain
      }
      .d-app-shell:not([data-nav-surface=rail]) .d-sidebar-scrim[data-cs-sidebar-open="true"] {
        display: block;
        position: fixed;
        inset: 0;
        z-index: 39; 
        background: oklch(0 0 0 / 0.45);
        animation: d-scrim-in 220ms var(--transition-easing, ease)
      }
    }
    
    .d-sidebar-scrim { display: none }
    @keyframes d-drawer-in { from { transform: translateX(-100%) } }
    @keyframes d-scrim-in { from { opacity: 0 } }
  
    .d-drawer-close { display: none }
    @media (max-width: 640px) {
      .d-app-shell:not([data-nav-surface=rail]) .d-sidebar .d-drawer-close { display: inline-flex }
    }
  
    .d-hsc {
      position:relative;
      display:flex;
      align-items:center;
      
      overflow:visible;
    }
    .d-hsc-grow { flex:1 1 auto; min-width:0 }

    
    .d-hsc [data-hsc-view] {
      overflow-x:auto;
      overflow-y:hidden;
      scrollbar-width:none;
      -ms-overflow-style:none;
      min-width:0;
      flex:1 1 auto;
    }
    .d-hsc [data-hsc-view]::-webkit-scrollbar { display:none }

    
    .d-hsc-bar {
      position:absolute;
      left:0; right:0; bottom:0;
      height:9px;
      touch-action:none;
      z-index:2;
    }
    .d-hsc-bar[hidden] { display:none }
    .d-hsc-track {
      position:absolute;
      left:0; right:0; bottom:2px;
      height:4px;
      border-radius:2px;
      background:var(--d-hsc-track, var(--color-border-default, rgba(27,31,36,0.15)));
    }
    .d-hsc-thumb {
      position:absolute;
      bottom:2px; left:0;
      width:0;
      height:4px;
      border-radius:2px;
      background:var(--d-hsc-thumb, var(--color-text-secondary, #57606a));
      transition:background 120ms ease;
    }
    .d-hsc-bar[data-hsc-dragging] .d-hsc-thumb {
      background:var(--d-hsc-thumb-active, var(--color-primary, #6366f1));
    }
    @media (prefers-reduced-motion) { .d-hsc-thumb { transition:none } }
  
    .d-hover-reveal-zone {
      display: inline-flex;
      align-items: center;
      gap: var(--space-2);
    }
    .d-hover-reveal-zone .d-hover-reveal {
      opacity: 0;
      transition: opacity 120ms var(--transition-easing);
    }
    .d-hover-reveal-zone:hover .d-hover-reveal,
    .d-hover-reveal-zone:focus-within .d-hover-reveal {
      opacity: 1;
    }
  
    
    
    .d-scroll-log-term {
      background:#0b0b0c;
      border-radius:8px;
      color:#d8d8dc;
      font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;
      font-size:12.5px;
      line-height:1.45;
    }
    .d-scroll-log-term .d-scroll-log-list { gap:0 }
    .d-scroll-log-term pre,.d-scroll-log-term code {
      background:transparent;
      color:inherit;
      border:0;
      padding:0;
      margin:0;
      font:inherit;
      white-space:pre-wrap;
      overflow-wrap:anywhere;
    }
    .d-scroll-log {
      position:relative;
      display:flex;
      flex-direction:column;
      flex:1 1 auto;
      min-height:0;
      min-width:0;
    }
    
    .d-scroll-log:has(> .d-scroll-log-jump:not([hidden])) {
      padding-bottom:calc(var(--d-scroll-log-pad) + var(--d-scroll-log-jump-band, 30px));
    }
    
    .d-scroll-log-view {
      flex:1 1 auto;
      min-height:0;
      overflow-y:auto;
      overflow-x:hidden;
      overscroll-behavior:contain;
      scroll-behavior:smooth;
      scrollbar-width:thin;
    }
    .d-scroll-log-view::-webkit-scrollbar { width:8px }
    .d-scroll-log-view::-webkit-scrollbar-thumb {
      background:color-mix(in oklch, var(--muted-foreground, #71717a) 30%, transparent);
      border-radius:8px;
    }
    .d-scroll-log-list {
      display:flex;
      flex-direction:column;
      gap:var(--d-scroll-log-gap);
      padding:var(--d-scroll-log-pad);
    }
    
    .d-scroll-log-older {
      display:flex;
      flex-direction:column;
      gap:var(--d-scroll-log-gap);
    }
    .d-scroll-log-older[hidden] { display:none }
    
    .d-scroll-log-earlier {
      all:unset;
      box-sizing:border-box;
      cursor:pointer;
      align-self:center;
      display:inline-flex;
      align-items:center;
      gap:6px;
      padding:5px 12px;
      border-radius:999px;
      font-size:calc(var(--small-font-size, 13px) * 0.92);
      font-weight:600;
      line-height:1.2;
      color:var(--muted-foreground, #71717a);
      background:var(--card, #fff);
      border:1px solid var(--border, rgba(0,0,0,.12));
      transition:background 120ms ease, color 120ms ease;
    }
    .d-scroll-log-earlier:hover {
      background:color-mix(in oklch, var(--muted-foreground, #71717a) 10%, var(--card, #fff));
      color:var(--foreground, #111);
    }
    .d-scroll-log-earlier:focus-visible {
      outline:none;
      box-shadow:var(--state-focus-ring, 0 0 0 3px color-mix(in oklch, var(--primary, #6366f1) 40%, transparent));
    }
    .d-scroll-log-earlier[hidden] { display:none }
    .d-scroll-log-earlier svg { width:13px; height:13px }
    
    .d-scroll-log-jump {
      all:unset;
      box-sizing:border-box;
      cursor:pointer;
      position:absolute;
      left:50%;
      bottom:var(--d-scroll-log-pad);
      transform:translateX(-50%);
      z-index:2;
      display:inline-flex;
      align-items:center;
      gap:6px;
      padding:6px 13px;
      border-radius:999px;
      font-size:calc(var(--small-font-size, 13px) * 0.92);
      font-weight:600;
      line-height:1.2;
      color:var(--primary-foreground, #fff);
      background:var(--primary, #6366f1);
      box-shadow:0 6px 18px -6px rgba(0,0,0,.5), 0 2px 6px -2px rgba(0,0,0,.3);
      transition:transform 120ms ease, box-shadow 120ms ease;
    }
    .d-scroll-log-jump:hover { transform:translateX(-50%) translateY(-1px) }
    .d-scroll-log-jump:focus-visible {
      outline:none;
      box-shadow:var(--state-focus-ring, 0 0 0 3px color-mix(in oklch, var(--primary, #6366f1) 40%, transparent));
    }
    .d-scroll-log-jump[hidden] { display:none }
    .d-scroll-log-jump svg { width:13px; height:13px }
    @media (prefers-reduced-motion) {
      .d-scroll-log-view { scroll-behavior:auto }
      .d-scroll-log-jump, .d-scroll-log-earlier { transition:none }
    }
  
    .main-content {
      container-type:inline-size;
      
      margin-left:var(--d-sidebar-reserved-w);
      
      
      height:100dvh;
      display:flex;
      flex-direction:column;
      overflow-y:auto;
      overflow-x:hidden;
      
      scrollbar-gutter:stable;
      flex:1;
      
      min-height:0;
      min-width:0;
      transition:margin-left 200ms var(--transition-easing)
    }
    
    
    
    
    .main-content > .d-base { flex:1 0 auto;min-height:0;padding-inline:var(--rv-pi, 0px);padding-block:var(--space-6) }
    
    .main-content > .d-base.flex-1 { flex:1 1 0;min-height:0 }
    
    .main-content:has(> .d-base.flex-1) { scrollbar-gutter:auto }
    .main-content > nav {
      display:flex;
      align-items:center;
      gap:var(--space-1);
      padding:var(--space-3) 0;
      border-bottom:1px solid var(--border);
      margin-bottom:var(--space-6);
      flex:none
    }
    .main-content > nav a {
      font-size:var(--small-font-size);
      font-weight:var(--bold-weight);
      color:var(--muted-foreground);
      padding:var(--space-2) var(--space-3);
      border-radius:var(--radius);
      transition:all var(--transition-duration) var(--transition-easing)
    }
    .main-content > nav a:hover {
      color:var(--foreground);
      background:var(--accent);
      text-decoration:none
    }
    @container (max-width:640px) {
      h1{font-size:var(--h2-size)}
      h2{font-size:var(--h3-size)}
      h3{font-size:var(--h4-size)}
    }
    
    @media (max-width:640px) {
      .main-content {
        margin-left:0;
        
        
        height:100dvh;
        
        padding-bottom:calc(80px + env(safe-area-inset-bottom, 0px))
      }
      
      
      .d-app-shell[data-nav-surface=rail] .main-content {
        margin-left:var(--d-sidebar-reserved-w);
        padding-top:0;
        padding-bottom:0
      }
    }
    
    .d-app-shell[data-nav-surface=bar] .main-content {
      margin-left:0;
      padding-top:calc(44px + var(--space-3));
      padding-bottom:calc(80px + env(safe-area-inset-bottom, 0px))
    }
   .spacer { flex: var(--sp-flex) } 
    .d-two-pane {
      display:grid;
      grid-template-columns:minmax(0,1fr) var(--d-two-pane-right-w);
      gap:var(--d-two-pane-gap);
      align-items:start;
      width:100%
    }
    
    .d-two-pane > .d-two-pane-main { min-width:0 }
    
    .d-two-pane > .d-two-pane-side {
      position:sticky;
      top:0;
      align-self:start;
      min-width:0
    }
    
    @container (max-width:640px) {
      .d-two-pane[data-stack="sm"] { grid-template-columns:minmax(0,1fr) }
      .d-two-pane[data-stack="sm"] > .d-two-pane-side { position:static;top:auto }
    }
    @container (max-width:768px) {
      .d-two-pane[data-stack="md"] { grid-template-columns:minmax(0,1fr) }
      .d-two-pane[data-stack="md"] > .d-two-pane-side { position:static;top:auto }
    }
    @container (max-width:1024px) {
      .d-two-pane[data-stack="lg"] { grid-template-columns:minmax(0,1fr) }
      .d-two-pane[data-stack="lg"] > .d-two-pane-side { position:static;top:auto }
    }
  
    .d-iig {
      display:flex;
      flex-wrap:wrap;
      gap:var(--space-2, .5rem);
      max-width:100%
    }
    
    .d-iig-thumb {
      position:relative;
      display:block;
      box-sizing:border-box;
      width:17.5rem;
      max-width:100%;
      aspect-ratio:7 / 5;
      margin:0;
      padding:0;
      border:1px solid var(--border-subtle, var(--border));
      border-radius:var(--radius, .5rem);
      overflow:hidden;
      background:var(--muted, #f2f2f2);
      cursor:zoom-in;
      transition:box-shadow var(--d-motion, 120ms ease)
    }
    .d-iig-thumb:hover { box-shadow:0 0 0 2px var(--primary) }
    .d-iig-thumb:focus-visible { outline:2px solid var(--primary); outline-offset:2px }
    .d-iig-img {
      display:block;
      width:100%;
      height:100%;
      object-fit:cover
    }
    
    .d-iig-hint {
      position:absolute;
      top:var(--space-2, .5rem);
      right:var(--space-2, .5rem);
      display:inline-flex;
      align-items:center;
      justify-content:center;
      padding:.25rem;
      border-radius:9999px;
      background:var(--card, #fff);
      color:var(--foreground, #111);
      border:1px solid var(--border);
      box-shadow:var(--shadow-md, 0 2px 8px rgba(0,0,0,.25));
      opacity:0;
      transition:opacity var(--d-motion, 120ms ease);
      pointer-events:none
    }
    .d-iig-thumb:hover .d-iig-hint { opacity:1 }
    
    .d-iig-broken {
      display:none;
      position:absolute;
      inset:0;
      flex-direction:column;
      align-items:center;
      justify-content:center;
      gap:var(--space-1, .25rem);
      padding:var(--space-2, .5rem);
      text-align:center;
      color:var(--muted-foreground, #777);
      background:var(--muted, #f2f2f2);
      border:2px dashed var(--destructive, var(--border));
      border-radius:inherit
    }
    .d-iig-thumb--broken { cursor:default }
    .d-iig-thumb--broken .d-iig-img,
    .d-iig-thumb--broken .d-iig-hint { display:none }
    .d-iig-thumb--broken .d-iig-broken { display:flex }
    .d-iig-broken-label { font-weight:600; font-size:var(--caption-size, .8125rem) }
    .d-iig-broken-name {
      font-size:var(--caption-size, .8125rem);
      opacity:.8;
      max-width:100%;
      word-break:break-all;
      overflow:hidden;
      text-overflow:ellipsis;
      display:-webkit-box;
      -webkit-line-clamp:2;
      -webkit-box-orient:vertical
    }
  
    .atom-disclosure {
      transition:var(--d-motion);
      border-bottom:1px solid var(--border)
    }
    .atom-disclosure:last-child { border-bottom:none }
    .atom-disclosure > summary {
      display:flex;
      align-items:center;
      justify-content:space-between;
      padding:var(--space-3) var(--space-4);
      font-size:var(--small-font-size);
      font-weight:var(--bold-weight);
      cursor:pointer;
      list-style:none;
      color:var(--foreground);
      transition:background var(--transition-duration) var(--transition-easing)
    }
    .atom-disclosure > summary::-webkit-details-marker { display:none }
    .atom-disclosure > summary::after {
      content:'';
      width:16px;
      height:16px;
      flex-shrink:0;
      background:currentColor;
      -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center/contain no-repeat;
      mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center/contain no-repeat;
      transition:transform var(--transition-duration) var(--transition-easing)
    }
    .atom-disclosure[open] > summary::after { transform:rotate(180deg) }
    .atom-disclosure > summary:hover { background:var(--accent);box-shadow:inset 2px 0 0 var(--state-focus-ring-color, var(--ring)) }
    .atom-disclosure-body {
      padding:var(--space-3) var(--space-4);
      font-size:var(--small-font-size);
      color:var(--muted-foreground)
    }
  
    
    .d-navbar-row { display:contents }

    
    .d-navbar-row > .d-row { width:100%;min-width:0;gap:0 }
    .d-navbar-row > .d-row > * { flex:1 1 0;min-width:0 }

    
    .d-navbar-row > .d-row > * .atom-box { max-width:100% }

    
    .d-navbar-row > .d-row > * { padding-inline:2px }

    
    .d-navbar-row > .d-row > * > .d-col { width:100%;min-width:0 }
    .d-navbar-row > .d-row > * > .d-col > :last-child {
      display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;
      white-space:nowrap;text-align:center
    }

    
    .d-navbar-row > .d-row > * { color:var(--color-text-secondary) }
    .d-navbar-row [aria-current="true"] { color:var(--color-accent) }

    
    @media (hover:hover) {
      .d-navbar-row > .d-row > *:hover .atom-box {
        background-image:linear-gradient(color-mix(in oklch, currentColor 8%, transparent), color-mix(in oklch, currentColor 8%, transparent))
      }
    }
    .d-navbar-row > .d-row > *:active .atom-box {
      background-image:linear-gradient(color-mix(in oklch, currentColor 12%, transparent), color-mix(in oklch, currentColor 12%, transparent))
    }
  
    

    
    .nav-rail-list {
      display:flex;
      flex-direction:column;
      gap:2px;
      
      padding:max(var(--space-1),var(--shadow-gutter,0px)) 10px;
      flex:1;
      align-items:stretch;
      overflow-y:auto;
      overflow-x:hidden;
      -ms-overflow-style:none;
      scrollbar-width:none;
      
      background:
        linear-gradient(var(--d-sidebar-bg),var(--d-sidebar-bg)) top/100% 2px no-repeat local,
        linear-gradient(var(--d-sidebar-bg),var(--d-sidebar-bg)) bottom/100% 2px no-repeat local,
        linear-gradient(var(--border),var(--border)) top/100% 1px no-repeat scroll,
        linear-gradient(var(--border),var(--border)) bottom/100% 1px no-repeat scroll
    }
    .nav-rail-list::-webkit-scrollbar { display:none }

    
    .nav-rail-list .atom-pressable {
      width:100%;
      justify-content:flex-start;
      min-height:40px;
      padding:8px 0
    }
    .nav-rail-list .atom-pressable svg {
      flex-shrink:0;
      width:24px;
      height:24px;
      margin:0 6px
    }
    .nav-rail-list .atom-pressable.active {
      background:var(--primary);
      color:var(--primary-foreground)
    }
    .nav-rail-list .atom-pressable.active [data-collapsible-slot="1"] {
      color:var(--primary-foreground)
    }

    

    
    .d-sidebar button[data-d-pop-trigger="user-menu"] {
      flex-shrink:0
    }
    .d-sidebar button[data-d-pop-trigger="user-menu"] .atom-box {
      flex-shrink:0
    }

    
    .d-sidebar .d-row:has([data-rail-pin]) > .atom-box {
      flex-shrink:0
    }

    
    .d-sidebar button:hover [data-rail-pin] {
      background:var(--accent);
      color:var(--foreground)
    }
    .d-sidebar [data-rail-pin] {
      color:var(--muted-foreground);
      transition:color 150ms var(--transition-easing),background 150ms var(--transition-easing)
    }
    .d-sidebar[data-cs-sidebar-pinned="true"] [data-rail-pin] {
      color:var(--primary)
    }
    .d-sidebar[data-cs-sidebar-pinned="true"] [data-rail-pin] svg {
      transform:rotate(45deg);
      transition:transform 150ms var(--transition-easing)
    }

    
    @media (max-width:640px) {
      
      .d-sidebar button[data-rail-pin] { display:none !important }
    }
  
    .skip-link {
      position:absolute;
      top:-40px;
      left:0;
      background:var(--primary);
      color:var(--primary-foreground);
      padding:var(--space-2) var(--space-4);
      z-index:1000;
      font-size:var(--small-font-size);
      font-weight:var(--bold-weight);
      border-radius:0 0 var(--radius) 0;
      transition:top var(--transition-duration)
    }
    .skip-link:focus {
      top:0
    }
  
    .d-top-app-bar-shell {
      display: flex;
      flex-direction: column;
      min-height: 100vh;
    }
    .d-top-app-bar {
      position: sticky;
      top: 0;
      z-index: 30;
      height: 56px;
      display: flex;
      align-items: center;
      gap: var(--space-4);
      padding: 0 var(--space-4);
      background: var(--card);
      border-bottom: 1px solid var(--border)
    }
    .d-top-app-bar-brand {
      display: flex;
      align-items: center;
      gap: var(--space-2);
      font-weight: var(--heading-weight);
      font-size: var(--brand-font-size, var(--font-size-title-medium, 1.125rem));
      color: var(--foreground);
      white-space: nowrap;
      text-decoration: none;
      flex-shrink: 0
    }
    .d-top-app-bar-brand:hover { text-decoration: none; color: var(--foreground) }
    .d-top-app-bar-nav {
      display: flex;
      align-items: center;
      gap: var(--space-1);
      flex: 1;
      overflow-x: auto;
      -ms-overflow-style: none;
      scrollbar-width: none
    }
    .d-top-app-bar-nav::-webkit-scrollbar { display: none }
    .d-top-app-bar-actions {
      display: flex;
      align-items: center;
      gap: var(--space-2);
      flex-shrink: 0
    }
    .d-top-app-bar-user-wrap { position: relative; display: flex; align-items: center }
    .d-top-app-bar-user {
      display: flex;
      align-items: center;
      gap: var(--space-2);
      cursor: pointer
    }
    .d-top-app-bar-content {
      container-type: inline-size;
      padding: var(--space-6);
      flex: 1;
      overflow: hidden
    }
    .d-top-app-bar-toggle { display: none }
    .d-top-app-bar-mobile-tabs { display: none }
    @container (max-width: 640px) {
      h1 { font-size: var(--h2-size) }
      h2 { font-size: var(--h3-size) }
      h3 { font-size: var(--h4-size) }
    }
    @media (max-width: 768px) {
      .d-top-app-bar-nav { display: none }
      .d-top-app-bar-toggle {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        background: none;
        border: 0;
        color: var(--foreground);
        cursor: pointer;
        padding: var(--space-1)
      }
      .d-top-app-bar-shell[data-cs-navbar-open="true"] .d-top-app-bar-nav {
        display: flex;
        position: absolute;
        top: 56px;
        left: 0;
        right: 0;
        background: var(--card);
        border-bottom: 1px solid var(--border);
        flex-direction: column;
        padding: var(--space-2)
      }
      .d-top-app-bar-mobile-tabs { display: block }
      .d-top-app-bar-content {
        padding: var(--space-4);
        padding-bottom: calc(var(--space-4) + 72px)
      }
    }
  
    .dcmdk { position:fixed; inset:0; z-index:1000; display:block }
    .dcmdk[hidden] { display:none }
    .dcmdk-scrim { position:absolute; inset:0; background:var(--overlay, rgba(0,0,0,.5)); backdrop-filter:blur(2px) }
    .dcmdk-panel {
      position:relative; margin:12vh auto 0; width:min(640px, calc(100% - 2rem));
      max-height:64vh; display:flex; flex-direction:column; overflow:hidden;
      background:var(--background, #fff); color:var(--foreground, #111);
      border:1px solid var(--border, rgba(0,0,0,.12));
      border-radius:var(--radius-lg, 12px);
      box-shadow:0 16px 48px rgba(0,0,0,.28), 0 2px 8px rgba(0,0,0,.16);
      animation:dcmdk-in 140ms ease
    }
    @keyframes dcmdk-in { from{opacity:0; transform:translateY(-6px) scale(.99)} to{opacity:1; transform:none} }
    .dcmdk-inputwrap { display:flex; align-items:center; gap:.6rem; padding:.85rem 1rem; border-bottom:1px solid var(--border, rgba(0,0,0,.1)) }
    .dcmdk-inputwrap .icon { flex:0 0 auto; opacity:.55 }
    .dcmdk-input { flex:1 1 auto; border:0; outline:0; background:transparent; color:inherit; font-size:1rem; line-height:1.4; padding:0 }
    .dcmdk-input::placeholder { color:var(--muted-foreground, rgba(0,0,0,.45)) }
    .dcmdk-list { list-style:none; margin:0; padding:.35rem; overflow-y:auto; flex:1 1 auto }
    .dcmdk-group { margin:0 0 .15rem }
    .dcmdk-group[hidden] { display:none }
    .dcmdk-grp-h { font-size:.7rem; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--muted-foreground, rgba(0,0,0,.5)); padding:.5rem .6rem .3rem }
    .dcmdk-opt {
      display:flex; align-items:center; gap:.7rem; width:100%; text-align:left;
      border:0; background:transparent; color:inherit; cursor:pointer;
      padding:.55rem .6rem; border-radius:var(--radius, 8px); font-size:.925rem; line-height:1.3
    }
    .dcmdk-opt[hidden] { display:none }
    .dcmdk-opt .icon { flex:0 0 auto; opacity:.7 }
    .dcmdk-opt-l { flex:1 1 auto; white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
    .dcmdk-opt-sub { flex:0 0 auto; font-size:.78rem; color:var(--muted-foreground, rgba(0,0,0,.45)); margin-left:.4rem }
    .dcmdk-opt-go { flex:0 0 auto; opacity:0; font-size:.85rem; color:var(--muted-foreground, rgba(0,0,0,.5)) }
    .dcmdk-opt[aria-selected="true"] { background:var(--muted, var(--surface-muted, rgba(0,0,0,.06))) }
    .dcmdk-opt[aria-selected="true"] .dcmdk-opt-go { opacity:.9 }
    .dcmdk-opt:hover { background:var(--muted, var(--surface-muted, rgba(0,0,0,.05))) }
    .dcmdk-empty { padding:1.6rem 1rem; text-align:center; color:var(--muted-foreground, rgba(0,0,0,.5)); font-size:.9rem }
    .dcmdk-empty[hidden] { display:none }
    .dcmdk-foot { display:flex; gap:1rem; padding:.55rem .9rem; border-top:1px solid var(--border, rgba(0,0,0,.1)); font-size:.72rem; color:var(--muted-foreground, rgba(0,0,0,.5)) }
    .dcmdk-foot kbd { font:inherit; background:var(--muted, rgba(0,0,0,.07)); border-radius:4px; padding:.05rem .3rem; margin-right:.15rem }
    @media (max-width:640px) {
      .dcmdk-panel { margin:0; width:100%; height:100%; max-height:none; border:0; border-radius:0; box-shadow:none }
      .dcmdk-scrim { display:none }
      .dcmdk-foot { display:none }
    }
    @media (prefers-reduced-motion: reduce) { .dcmdk-panel { animation:none } }
  
    .ddb-bar {
      flex:none; min-width:0;
      margin:var(--space-4);
      padding:var(--space-3) var(--space-4);
      border:1px solid var(--border); border-radius:var(--radius);
      background:var(--card); color:var(--foreground);
      box-sizing:border-box
    }
    .ddb-bar[hidden] { display:none }
    .ddb-bar summary { cursor:pointer; min-height:44px; align-content:center }
    .ddb-bar summary:focus-visible { outline:2px solid var(--ring); outline-offset:4px }
    .ddb-bar summary span { margin-inline-start:var(--space-2); font-weight:var(--bold-weight) }
    .ddb-bar details[open] summary { margin-bottom:var(--space-3) }
    .ddb-bar input { max-width:100%; min-width:0 }
    .ddc-open { float:right; cursor:pointer; min-height:44px; padding:var(--space-2) var(--space-3); border:1px solid var(--border); border-radius:var(--radius); background:var(--background); color:var(--foreground); font:inherit }
    .ddc-dialog { margin:auto; width:min(44rem,calc(100vw - 2rem)); max-height:calc(100dvh - 2rem); padding:var(--space-5); border:1px solid var(--border); border-radius:var(--radius); background:var(--card); color:var(--foreground); box-sizing:border-box }
    .ddc-dialog::backdrop { background:rgb(0 0 0 / .55) }
    .ddc-dialog button { cursor:pointer; min-height:44px; padding:var(--space-2) var(--space-3); border:1px solid var(--border); border-radius:var(--radius); background:var(--background); color:var(--foreground); font:inherit }
    .ddc-heading { display:flex; align-items:center; justify-content:space-between; gap:var(--space-3) }
    .ddc-heading h2 { margin:0; font-size:1.3rem }
    .ddc-dialog p { line-height:1.5 }
    .ddc-note { color:var(--muted-foreground); font-size:.9rem }
    .ddc-search,.ddc-share { display:grid; gap:var(--space-2); margin-block:var(--space-4) }
    .ddc-search input,.ddc-share input { width:100%; box-sizing:border-box; padding:var(--space-3); border:1px solid var(--border); border-radius:var(--radius); background:var(--background); color:var(--foreground); font:inherit }
    .ddc-roles { max-height:42dvh; overflow:auto; overscroll-behavior:contain }
    .ddc-roles fieldset { margin:var(--space-2) 0 var(--space-4); padding:var(--space-2) var(--space-3); border:1px solid var(--border); border-radius:var(--radius) }
    .ddc-roles legend { padding-inline:var(--space-2); font-weight:var(--bold-weight) }
    .ddc-choice { display:flex; gap:var(--space-3); align-items:center; min-height:44px; cursor:pointer }
    .ddc-choice input { width:20px; height:20px; flex-shrink:0; accent-color:var(--primary) }
    .ddc-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:var(--space-2) }
    .ddc-dialog .ddc-start { background:var(--primary); color:var(--primary-foreground) }
    .ddc-dialog [hidden] { display:none }
    .ddc-dialog :focus-visible { outline:2px solid var(--ring); outline-offset:2px }
  
    .dtr-root { position:fixed; inset:0; z-index:1300; display:none }
    .dtr-root[data-on="1"] { display:block }
    .dtr-scrim {
      position:absolute; inset:0;
      background:var(--overlay, rgba(8,10,14,.72)); backdrop-filter:blur(2px);
      transition:clip-path 220ms ease
    }
    .dtr-ring {
      position:absolute; border-radius:var(--radius, 0.75rem); pointer-events:none;
      box-shadow:0 0 0 2px var(--ring, var(--primary, #4f8cff)),
                 0 0 0 8px color-mix(in srgb, var(--ring, var(--primary, #4f8cff)) 22%, transparent);
      transition:top 220ms ease,left 220ms ease,width 220ms ease,height 220ms ease;
      display:none
    }
    .dtr-ring[data-on="1"] { display:block }
    .dtr-card {
      position:absolute; width:min(24rem, calc(100vw - 2rem));
      transition:top 220ms ease,left 220ms ease
    }
    .dtr-step { display:none }
    .dtr-step[data-at="1"] { display:block }
    @media (prefers-reduced-motion: reduce) {
      .dtr-scrim, .dtr-ring, .dtr-card { transition:none }
    }
  
    .datum-dlg-scrim {
      display:none;
      position:fixed;
      inset:0;
      background:var(--overlay, rgba(0,0,0,.45));
      backdrop-filter:blur(4px);
      align-items:center;
      justify-content:center;
      z-index:200;
      animation:datum-dlg-fade-in 150ms ease
    }
    
    .datum-dlg-scrim[data-d-dialog-open] { display:flex; pointer-events:auto }
    .datum-dlg-scrim.datum-dlg-seethrough { background:transparent; backdrop-filter:none }
    
    
    .datum-dlg-scrim > * { max-height:calc(100dvh - 2rem);min-height:0;overflow:hidden }
  
    .datum-dlg-overlay {position:fixed;inset:0;background:var(--overlay,rgba(0,0,0,.5));backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:200;animation:datum-dlg-fade-in 150ms ease}
    @keyframes datum-dlg-fade-in { from{opacity:0} to{opacity:1} }
    
    @keyframes datum-dlg-slide-in { from{opacity:0;transform:translateY(8px) scale(.98)} to{opacity:1;transform:translateY(0) scale(1)} }
    .datum-dlg-shell { animation:datum-dlg-slide-in 200ms ease }
  
    .datum-dlg-header { display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-4) }
    .datum-dlg-header h3 { margin:0 }
    .datum-dlg-x {width:32px;height:32px;display:flex;align-items:center;justify-content:center;font-size:var(--h4-size);line-height:1;padding:0;border-radius:var(--radius);border:none;background:none;color:var(--muted-foreground);cursor:pointer;transition:all 150ms ease}
    .datum-dlg-x:hover { background:var(--accent);color:var(--foreground);outline:1px solid var(--border);outline-offset:-1px }
    .datum-dlg-body { display:flex;flex-direction:column;gap:var(--space-4);margin-bottom:var(--space-6);padding-top:12px }
    .datum-dlg-footer { display:flex;justify-content:flex-end;gap:var(--space-2);padding-top:var(--space-4);border-top:1px solid var(--border) }
  
    select {
      width:100%;
      height:var(--form-control-height,40px);
      box-sizing:border-box;
      font-size:var(--small-font-size);
      padding:0 var(--space-3);
      border:1px solid var(--border);
      border-radius:var(--radius);
      background:var(--card);
      color:var(--foreground);
      transition:background 120ms ease,box-shadow 120ms ease,border-color 120ms ease;
      appearance:none;
      -webkit-appearance:none;
      background-image:linear-gradient(45deg,transparent 50%,var(--muted-foreground) 50%),linear-gradient(135deg,var(--muted-foreground) 50%,transparent 50%);
      background-position:calc(100% - 18px) center,calc(100% - 13px) center;
      background-size:5px 5px,5px 5px;
      background-repeat:no-repeat;
      padding-right:32px;
      cursor:pointer
    }
    select:hover:not(:focus):not(:disabled) {
      background-color:color-mix(in oklch,var(--accent) 8%,var(--card));
      border-color:color-mix(in oklch,var(--border) 60%,var(--foreground) 20%);
      
      outline:1px solid var(--border);outline-offset:-1px
    }
    select:focus {
      outline:none;
      box-shadow:0 0 0 2px var(--ring),0 0 0 4px color-mix(in oklch,var(--ring) 22%,transparent)
    }
    
    select:focus-visible {
      outline:none;
      box-shadow:var(--state-focus-ring)
    }
    
    select[aria-invalid="true"], select:user-invalid {
      border-color:var(--state-invalid-border-color);
      box-shadow:var(--state-invalid-ring)
    }
    
    select:disabled, select[aria-disabled="true"] {
      opacity:var(--state-disabled-opacity);
      cursor:var(--state-disabled-cursor);
      pointer-events:none
    }
    select option {
      
      background:var(--color-surface-overlay);
      color:var(--foreground)
    }
    
    
    .field-float > select ~ .field-label {
      top:var(--field-band);
      transform:translateY(-50%) scale(0.85);
      background:var(--card);
      transition:transform 120ms ease,color 120ms ease,background 120ms ease
    }
    .field-float > select:focus ~ .field-label {
      color:var(--ring)
    }
    .field-float:has(> select option[value=""]:checked) > select {
      color:var(--muted-foreground)
    }
    .field-float:has(> select option[value=""]:checked) > select:focus {
      color:var(--foreground)
    }
    
    .field-chrome.field-static {
      position:relative;
      display:block;
      margin-bottom:var(--space-4)
    }
    .field-chrome.field-static > .field-static-label {
      display:block;
      font-size:var(--small-font-size);
      font-weight:var(--medium-weight, 500);
      color:var(--foreground);
      line-height:1.4;
      margin-bottom:var(--space-2)
    }
    .field-chrome.field-static:has(> select[required]) > .field-static-label::after {
      content:' *';
      color:var(--destructive);
      font-weight:600
    }
    
    .field-listbox {
      position:relative;
      display:block;
      margin-bottom:var(--space-4)
    }
    .field-listbox > .field-static-label {
      display:block;
      font-size:var(--small-font-size);
      font-weight:var(--medium-weight, 500);
      color:var(--foreground);
      line-height:1.4;
      margin-bottom:var(--space-2)
    }
    .field-listbox-btn {
      width:100%;
      height:var(--form-control-height,40px);
      box-sizing:border-box;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:var(--space-2);
      font-size:var(--small-font-size);
      text-align:left;
      padding:0 var(--space-3);
      border:var(--field-border, var(--field-role-border, 1px solid var(--input)));
      border-radius:var(--field-radius, var(--radius));
      background:var(--field-bg, var(--card));
      color:var(--foreground);
      cursor:pointer;
      transition:background 120ms ease,box-shadow 120ms ease,border-color 120ms ease
    }
    .field-listbox-btn:hover:not(:disabled) {
      background:var(--field-hover-bg, color-mix(in oklch,var(--accent) 8%,var(--card)));
      border-color:color-mix(in oklch,var(--border) 60%,var(--foreground) 20%);
      outline:1px solid var(--border);outline-offset:-1px
    }
    
    .field-listbox-btn:focus-visible { outline:none; border-color:var(--state-focus-ring-color, var(--ring)); box-shadow:var(--state-focus-ring) }
    .field-listbox-btn:focus { outline:none; border-color:var(--state-focus-ring-color, var(--ring)); box-shadow:var(--state-focus-ring) }
    .field-listbox-btn[aria-invalid="true"] {
      border-color:var(--state-invalid-border-color);
      box-shadow:var(--state-invalid-ring)
    }
    .field-listbox-btn:disabled {
      opacity:var(--state-disabled-opacity);
      cursor:var(--state-disabled-cursor);
      pointer-events:none
    }
    .field-listbox-value { overflow:hidden; text-overflow:ellipsis; white-space:nowrap }
    .field-listbox-arrow {
      width:0;height:0;flex:none;
      border-left:4px solid transparent;
      border-right:4px solid transparent;
      border-top:5px solid var(--muted-foreground)
    }
    .field-listbox-menu {
      position:absolute;
      z-index:50;
      left:0;right:0;
      top:calc(100% + 4px);
      margin:0;
      padding:var(--space-1);
      list-style:none;
      max-height:16rem;
      overflow-y:auto;
      
      background:var(--color-surface-overlay);
      color:var(--foreground);
      border:1px solid var(--border);
      border-radius:var(--radius);
      box-shadow:var(--shadow-md)
    }
    .field-listbox-menu[hidden] { display:none }
    .field-listbox-option {
      padding:var(--space-2) var(--space-3);
      border-radius:calc(var(--radius) - 2px);
      cursor:pointer;
      font-size:var(--small-font-size);
      line-height:1.4
    }
    .field-listbox-option:hover, .field-listbox-option:focus {
      background:var(--accent);
      color:var(--foreground);
      outline:none
    }
    .field-listbox-option[aria-selected="true"] {
      background:color-mix(in oklch,var(--primary) 12%,transparent);
      font-weight:var(--medium-weight, 500)
    }
    .field-listbox-option[hidden] { display:none }
    .field-listbox-searchrow {
      position:sticky;
      top:0;
      padding:0 0 var(--space-1) 0;
      background:var(--color-surface-overlay)
    }
    .field-listbox-search {
      width:100%;
      box-sizing:border-box;
      height:32px;
      padding:0 var(--space-2);
      border:1px solid var(--border);
      border-radius:calc(var(--radius) - 2px);
      background:var(--color-surface-overlay);
      color:var(--foreground);
      font-size:var(--small-font-size)
    }
    .field-listbox-search:focus { outline:none; box-shadow:var(--state-focus-ring) }
    
    .field-listbox-native {
      position:absolute;
      width:1px;height:1px;
      padding:0;margin:-1px;
      overflow:hidden;
      clip:rect(0,0,0,0);
      border:0
    }
  
    
    .floating-pane{position:fixed;z-index:var(--fp-z,150);display:flex;flex-direction:column;overflow:hidden;box-sizing:border-box;background:var(--color-surface-overlay,#ffffff);color:var(--color-text-primary,#111111);border:1px solid var(--color-border-default,rgba(0,0,0,0.12));border-radius:14px;box-shadow:0 18px 60px -12px rgba(0,0,0,0.45);width:var(--fp-w,390px)}
    .floating-pane.fp-snap{transition:left .22s ease,top .22s ease,right .22s ease,bottom .22s ease,width .22s ease,height .22s ease,border-radius .22s ease}
    .floating-pane[data-fp-dock=float]{left:var(--fp-x,auto);top:var(--fp-y,auto);right:var(--fp-r,24px);bottom:var(--fp-b,24px);height:var(--fp-h,auto);max-height:var(--fp-mh,74vh)}
    .floating-pane[data-fp-dock=left],.floating-pane[data-fp-dock=right]{top:0;bottom:0;height:auto;max-height:100vh;border-radius:0;width:var(--fp-w,390px)}
    .floating-pane[data-fp-dock=left]{left:0;right:auto}
    .floating-pane[data-fp-dock=right]{right:0;left:auto}
    .floating-pane[data-fp-dock=bottom]{left:0;right:0;width:auto;max-height:none;border-radius:0;height:var(--fp-h,40vh);bottom:0;top:auto}
    .floating-pane[data-fp-dock=max]{left:0;right:0;top:0;bottom:0;width:auto;height:auto;max-height:none;border-radius:0}
    .floating-pane[data-fp-dock=left],.floating-pane[data-fp-dock=right],.floating-pane[data-fp-dock=bottom],.floating-pane[data-fp-dock=max]{box-shadow:0 0 40px -8px rgba(0,0,0,0.35)}
    
    .floating-pane[data-fp-dock=zl]{left:0;right:auto;top:0;bottom:0;height:auto;width:50vw;max-height:100vh;border-radius:0}
    .floating-pane[data-fp-dock=zr]{right:0;left:auto;top:0;bottom:0;height:auto;width:50vw;max-height:100vh;border-radius:0}
    .floating-pane[data-fp-dock=zt]{left:0;right:0;top:0;bottom:0;width:auto;height:auto;max-height:none;border-radius:0}
    .floating-pane[data-fp-dock=zb]{left:0;right:0;bottom:0;top:auto;width:auto;height:50vh;max-height:none;border-radius:0}
    .floating-pane[data-fp-dock=ztl]{left:0;right:auto;top:0;bottom:auto;width:50vw;height:50vh;max-height:none;border-radius:0}
    .floating-pane[data-fp-dock=ztr]{right:0;left:auto;top:0;bottom:auto;width:50vw;height:50vh;max-height:none;border-radius:0}
    .floating-pane[data-fp-dock=zbl]{left:0;right:auto;bottom:0;top:auto;width:50vw;height:50vh;max-height:none;border-radius:0}
    .floating-pane[data-fp-dock=zbr]{right:0;left:auto;bottom:0;top:auto;width:50vw;height:50vh;max-height:none;border-radius:0}
    .floating-pane[data-fp-dock=zl],.floating-pane[data-fp-dock=zr],.floating-pane[data-fp-dock=zt],.floating-pane[data-fp-dock=zb],.floating-pane[data-fp-dock=ztl],.floating-pane[data-fp-dock=ztr],.floating-pane[data-fp-dock=zbl],.floating-pane[data-fp-dock=zbr]{box-shadow:0 0 40px -8px rgba(0,0,0,0.35)}
    .floating-pane-handle{cursor:grab;padding:10px 12px;font-weight:600;font-size:13px;background:var(--color-surface-muted,#f4f4f5);border-bottom:1px solid var(--color-border-default,rgba(0,0,0,0.1));-webkit-user-select:none;user-select:none;display:flex;align-items:center;gap:8px;touch-action:none}
    .floating-pane-handle:active{cursor:grabbing}
    .floating-pane-handle:focus-visible{outline:2px solid var(--color-accent,#6366f1);outline-offset:-2px}
    .floating-pane-grip{display:grid;grid-template-columns:repeat(2,3px);grid-template-rows:repeat(3,3px);gap:2px;flex:none;opacity:.55}
    .floating-pane-grip>span{width:3px;height:3px;border-radius:50%;background:currentColor}
    .floating-pane-title{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:flex;align-items:center;gap:6px}
    
    .floating-pane-title>*{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
    
    .floating-pane-action{display:flex;align-items:center;flex:none;margin-right:6px}
    .floating-pane-docks{display:flex;align-items:center;gap:2px;flex:none}
    .fp-dock-btn{all:unset;box-sizing:border-box;cursor:pointer;width:24px;height:24px;display:inline-flex;align-items:center;justify-content:center;border-radius:5px;opacity:.5;color:inherit}
    .fp-dock-btn:hover{opacity:1;background:var(--color-border-subtle,rgba(128,128,128,0.18))}
    .fp-dock-btn .fp-dock-ico{position:relative;width:12px;height:12px;border:1.5px solid currentColor;border-radius:2px;box-sizing:border-box}
    .fp-dock-btn .fp-dock-ico::after{content:"";position:absolute;background:currentColor}
    .fp-dock-btn[data-fp-dock-to=left] .fp-dock-ico::after{left:0;top:0;bottom:0;width:3px}
    .fp-dock-btn[data-fp-dock-to=right] .fp-dock-ico::after{right:0;top:0;bottom:0;width:3px}
    .fp-dock-btn[data-fp-dock-to=bottom] .fp-dock-ico::after{left:0;right:0;bottom:0;height:3px}
    .fp-dock-btn[data-fp-dock-to=max] .fp-dock-ico::after{left:0;right:0;top:0;bottom:0}
    
    .fp-dock-btn[data-fp-dock-to=min] .fp-dock-ico{border:none;border-radius:0}
    .fp-dock-btn[data-fp-dock-to=min] .fp-dock-ico::after{left:1px;right:1px;top:50%;bottom:auto;height:1.5px;margin-top:-1px;border-radius:1px}
    .fp-dock-btn[data-fp-dock-to=float] .fp-dock-ico::after{left:50%;top:50%;width:5px;height:5px;transform:translate(-50%,-50%);border-radius:1px}
    .floating-pane[data-fp-dock=left] .fp-dock-btn[data-fp-dock-to=left],.floating-pane[data-fp-dock=right] .fp-dock-btn[data-fp-dock-to=right],.floating-pane[data-fp-dock=bottom] .fp-dock-btn[data-fp-dock-to=bottom],.floating-pane[data-fp-dock=max] .fp-dock-btn[data-fp-dock-to=max],.floating-pane[data-fp-dock=float] .fp-dock-btn[data-fp-dock-to=float]{opacity:1;color:var(--color-accent,#6366f1)}
    
    .floating-pane{--fp-body-pad:12px;--fp-body-gap:8px}
    .floating-pane-body{flex:1;overflow:auto;padding:var(--fp-body-pad);display:flex;flex-direction:column;gap:var(--fp-body-gap)}
    
    .floating-pane-body:has(> [data-fp-flush]){padding:0;gap:0;overflow:hidden}
    
    .floating-pane-body:has(> [data-fp-flush]) > :not([data-fp-flush]){margin:var(--fp-body-gap) var(--fp-body-pad) 0;max-width:calc(100% - 2 * var(--fp-body-pad))}
    .floating-pane-body:has(> [data-fp-flush]) > :not([data-fp-flush]):last-child{margin-bottom:var(--fp-body-pad)}
    
    .fp-rz{position:absolute;z-index:5;display:none;touch-action:none}
    .fp-rz-e{top:0;right:0;width:8px;height:100%;cursor:ew-resize}
    .fp-rz-w{top:0;left:0;width:8px;height:100%;cursor:ew-resize}
    .fp-rz-s{left:0;bottom:0;height:8px;width:100%;cursor:ns-resize}
    .fp-rz-n{left:0;top:0;height:8px;width:100%;cursor:ns-resize}
    .fp-rz-se{right:0;bottom:0;cursor:nwse-resize}
    .fp-rz-ne{right:0;top:0;cursor:nesw-resize}
    .fp-rz-nw{left:0;top:0;cursor:nwse-resize}
    .fp-rz-sw{left:0;bottom:0;cursor:nesw-resize}
    .fp-rz-se,.fp-rz-ne,.fp-rz-nw,.fp-rz-sw{width:14px;height:14px;z-index:6}
    
    .floating-pane-docks{position:relative;z-index:7}
    
    .floating-pane[data-fp-resizable=true][data-fp-dock=float] .fp-rz{display:block}
    .floating-pane[data-fp-resizable=true][data-fp-dock=max] .fp-rz{display:block}
    .floating-pane[data-fp-resizable=true][data-fp-dock=zl] .fp-rz{display:block}
    .floating-pane[data-fp-resizable=true][data-fp-dock=zr] .fp-rz{display:block}
    .floating-pane[data-fp-resizable=true][data-fp-dock=zt] .fp-rz{display:block}
    .floating-pane[data-fp-resizable=true][data-fp-dock=zb] .fp-rz{display:block}
    .floating-pane[data-fp-resizable=true][data-fp-dock=ztl] .fp-rz{display:block}
    .floating-pane[data-fp-resizable=true][data-fp-dock=ztr] .fp-rz{display:block}
    .floating-pane[data-fp-resizable=true][data-fp-dock=zbl] .fp-rz{display:block}
    .floating-pane[data-fp-resizable=true][data-fp-dock=zbr] .fp-rz{display:block}
    .floating-pane[data-fp-resizable=true][data-fp-dock=left] .fp-rz-e{display:block}
    .floating-pane[data-fp-resizable=true][data-fp-dock=right] .fp-rz-w{display:block}
    .floating-pane[data-fp-resizable=true][data-fp-dock=bottom] .fp-rz-n{display:block}
    
    .floating-pane[data-fp-min=true]{display:none}

    
    .fp-tray{position:fixed;z-index:170;left:var(--fp-tray-x,16px);top:var(--fp-tray-y,16px);display:flex;align-items:center;gap:8px;box-sizing:border-box;padding:6px;max-width:calc(100vw - 24px);border-radius:16px;background:var(--color-surface-overlay,#ffffff);color:var(--color-text-primary,#111111);border:1px solid var(--color-border-default,rgba(0,0,0,0.12));box-shadow:0 1px 2px rgba(0,0,0,0.06),0 14px 40px -10px rgba(0,0,0,0.34);opacity:0;transition:opacity .16s ease}
    .fp-tray.fp-tray-shown{opacity:1}
    .fp-tray:not(.fp-tray-shown){pointer-events:none}
    .fp-tray-grip{flex:none;align-self:stretch;display:grid;grid-template-columns:repeat(2,3px);grid-template-rows:repeat(3,3px);gap:2px;align-content:center;justify-content:center;width:22px;min-height:34px;border-radius:10px;opacity:.5;cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none}
    .fp-tray-grip:hover{opacity:.9;background:var(--color-border-subtle,rgba(128,128,128,0.18))}
    .fp-tray-grip:active{cursor:grabbing}
    .fp-tray-grip:focus-visible{outline:2px solid var(--color-accent,#6366f1);outline-offset:1px;opacity:1}
    .fp-tray-grip>span{width:3px;height:3px;border-radius:50%;background:currentColor}
    
    
    
    .fp-tray-pills{display:flex;flex-wrap:nowrap;align-items:center;justify-content:flex-start;gap:6px;min-width:0;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
    .fp-tray-pills::-webkit-scrollbar{display:none}
    
    .fp-tray-pills>*{flex:none}
    .fp-tray-pill{all:unset;box-sizing:border-box;cursor:pointer;display:inline-flex;align-items:center;gap:6px;max-width:184px;height:34px;padding:0 12px 0 7px;border-radius:999px;background:var(--color-surface-muted,#f4f4f5);color:inherit;font-weight:600;font-size:13px;-webkit-user-select:none;user-select:none;touch-action:none;transition:background .12s ease}
    .fp-tray-pill:hover{background:var(--color-border-subtle,rgba(128,128,128,0.18))}
    .fp-tray-pill:focus-visible{outline:2px solid var(--color-accent,#6366f1);outline-offset:2px}
    
    .fp-tray-action{all:unset;box-sizing:border-box;cursor:pointer;display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 12px;border-radius:999px;background:var(--color-surface-muted,#f4f4f5);color:inherit;font-weight:600;font-size:13px;-webkit-user-select:none;user-select:none;flex:none}
    .fp-tray-action:hover{background:var(--color-border-subtle,rgba(128,128,128,0.18))}
    .fp-tray-action:focus-visible{outline:2px solid var(--color-accent,#6366f1);outline-offset:2px}
    
    @media (max-width:640px){
      
      
      .fp-tray-pill-label, .fp-tray-pill-label *:not(svg){font-size:0 !important;gap:0}
      .fp-tray-pill{padding:0 9px 0 7px}
      .fp-tray-action{font-size:0;padding:0 10px}
    }
    .fp-tray-pill-grip{flex:none;display:grid;grid-template-columns:repeat(2,3px);grid-template-rows:repeat(3,3px);gap:2px;opacity:.5;cursor:grab}
    .fp-tray-pill-grip>span{width:3px;height:3px;border-radius:50%;background:currentColor}
    .fp-tray-pill-label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:inline-flex;align-items:center;gap:6px}
    .fp-tray-pill-label>*{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
    
    .fp-tray-pill-flip{will-change:transform;transition:transform .16s ease}
    .fp-tray-pill-placeholder{opacity:.3}
    .fp-tray-pill-ghost{position:fixed;z-index:180;pointer-events:none;opacity:.97;box-shadow:0 16px 38px -10px rgba(0,0,0,0.55);transition:box-shadow .12s ease,outline-color .12s ease;will-change:transform}
    
    .fp-tray-pill-ghost.fp-tray-pill-expand{box-shadow:0 22px 52px -8px rgba(0,0,0,0.6);outline:2px solid var(--color-accent,#6366f1);outline-offset:2px}
    @media (prefers-reduced-motion){.fp-tray{transition:none}.fp-tray-pill{transition:none}.fp-tray-pill-flip{transition:none}}
    .fp-dock-preview{position:fixed;z-index:149;background:var(--color-accent,#6366f1);opacity:0;transition:opacity .12s ease;border:2px solid var(--color-accent,#6366f1);border-radius:10px;pointer-events:none;display:none;box-sizing:border-box}
    .fp-dock-preview.fp-on{opacity:.16}
    @media (prefers-reduced-motion){.floating-pane.fp-snap{transition:none}.fp-dock-preview{transition:none}}
  
    .d-lbx {
      display:none;
      position:fixed;
      inset:0;
      z-index:300;
      align-items:center;
      justify-content:center;
      background:var(--overlay, rgba(0,0,0,.85));
      backdrop-filter:blur(4px);
      animation:d-lbx-fade 150ms ease;
      outline:none
    }
    .d-lbx[data-open] { display:flex }
    @keyframes d-lbx-fade { from { opacity:0 } to { opacity:1 } }
    
    .d-lbx-stage {
      display:flex;
      align-items:center;
      justify-content:center;
      box-sizing:border-box;
      width:100%;
      height:100%;
      padding:6vh 6vw
    }
    .d-lbx-img {
      max-width:88vw;
      max-height:84vh;
      object-fit:contain;
      border-radius:var(--radius, .5rem);
      box-shadow:var(--shadow-lg, 0 8px 40px rgba(0,0,0,.5))
    }
    
    .d-lbx-broken {
      display:none;
      flex-direction:column;
      align-items:center;
      gap:var(--space-2, .5rem);
      padding:var(--space-6, 1.5rem);
      color:var(--muted-foreground, #bbb);
      border:2px dashed var(--destructive, var(--border));
      border-radius:var(--radius, .5rem);
      background:var(--card, #222)
    }
    .d-lbx-broken-label { font-weight:600 }
    
    .d-lbx-bar {
      position:absolute;
      top:0;
      left:0;
      right:0;
      display:flex;
      align-items:center;
      justify-content:space-between;
      padding:var(--space-4, 1rem);
      pointer-events:none
    }
    .d-lbx-bar > * { pointer-events:auto }
    
    .d-lbx-dl { display:inline-flex; align-items:center; justify-content:center;
      text-decoration:none; color:inherit }
    .d-lbx-counter {
      padding:.25rem .75rem;
      border-radius:9999px;
      background:var(--card, #fff);
      color:var(--foreground, #111);
      border:1px solid var(--border);
      font-size:var(--caption-size, .8125rem);
      font-weight:600
    }
    .d-lbx-btn, .d-lbx-nav {
      display:inline-flex;
      align-items:center;
      justify-content:center;
      border:1px solid var(--border);
      background:var(--card, #fff);
      color:var(--foreground, #111);
      cursor:pointer;
      box-shadow:var(--shadow-md, 0 2px 8px rgba(0,0,0,.3));
      transition:background var(--d-motion, 120ms ease)
    }
    .d-lbx-btn:hover, .d-lbx-nav:hover { background:var(--muted, #eee) }
    .d-lbx-btn {
      padding:var(--space-2, .5rem);
      border-radius:var(--radius, .5rem)
    }
    .d-lbx-nav {
      position:absolute;
      top:50%;
      transform:translateY(-50%);
      width:2.75rem;
      height:2.75rem;
      border-radius:9999px
    }
    .d-lbx-nav[disabled] { opacity:.35; cursor:default; pointer-events:none }
    .d-lbx-prev { left:var(--space-4, 1rem) }
    .d-lbx-next { right:var(--space-4, 1rem) }
    @media (prefers-reduced-motion) { .d-lbx { animation:none } }
  
    .d-menurow {
      display:grid;
      grid-template-columns:[leading] var(--menu-leading, 1.5rem) [label] 1fr [trailing] auto;
      align-items:center;
      column-gap:var(--space-2);
      width:100%;
      
      text-align:start;
    }
    .d-menurow-lead {
      display:inline-flex;
      align-items:center;
      justify-content:flex-start;
    }
    
    .d-menurow-trail {
      display:inline-flex;
      align-items:center;
      justify-content:flex-end;
      white-space:nowrap;
    }
  
    .d-cs-swap-light { display: contents }
    .d-cs-swap-dark { display: none }
    html[data-cs="dark"] .d-cs-swap-light { display: none }
    html[data-cs="dark"] .d-cs-swap-dark { display: contents }
  
    .dncp-scrim {
      position:fixed; inset:0; z-index:1200;
      display:flex; align-items:center; justify-content:center;
      box-sizing:border-box; padding:1rem;
      background:var(--overlay, rgba(0,0,0,.5)); backdrop-filter:blur(3px);
      animation:dncp-fade-in 150ms ease
    }
    .dncp-scrim[hidden] { display:none }
    @keyframes dncp-fade-in { from{opacity:0} to{opacity:1} }
    @media (prefers-reduced-motion: reduce) { .dncp-scrim { animation:none } }
  
    .dpcp-scrim {
      position:fixed; inset:0; z-index:1200;
      display:flex; align-items:center; justify-content:center;
      box-sizing:border-box; padding:1rem;
      background:var(--overlay, rgba(0,0,0,.5)); backdrop-filter:blur(3px);
      animation:dpcp-fade-in 150ms ease
    }
    
    .dpcp-scrim .datum-dlg-x { display:none }
    .dpcp-scrim[hidden] { display:none }
    @keyframes dpcp-fade-in { from{opacity:0} to{opacity:1} }
    @media (prefers-reduced-motion: reduce) { .dpcp-scrim { animation:none } }
  
    [data-d-pop-body] { display: none }
  
    .datum-pwa-scrim {
      position:fixed;
      left:0;right:0;bottom:0;
      display:flex;
      align-items:flex-end;
      justify-content:center;
      pointer-events:none;
      padding:1rem;
      
      padding-bottom:calc(1rem + env(safe-area-inset-bottom, 0px));
      
      pointer-events:auto;
      z-index:200;
      opacity:0;
      transition:opacity 250ms ease
    }
    .datum-pwa-scrim[hidden] { display:none }
    .datum-pwa-scrim.datum-pwa-show { opacity:1 }
    .datum-pwa-dock {
      width:100%;
      max-width:420px;
      pointer-events:auto;
      
      transform:translateY(16px);
      transition:transform 250ms ease
    }
    .datum-pwa-scrim.datum-pwa-show .datum-pwa-dock { transform:none }
    
    .datum-pwa-android, .datum-pwa-ios { display:none }
    #datum-pwa[data-pwa-mode="android"] .datum-pwa-android { display:block }
    #datum-pwa[data-pwa-mode="ios"] .datum-pwa-ios { display:block }
    @media (prefers-reduced-motion: reduce) {
      .datum-pwa-scrim { transition:opacity 120ms ease }
      .datum-pwa-dock { transition:none;transform:none }
      .datum-pwa-scrim.datum-pwa-show .datum-pwa-dock { transform:none }
    }
  
    .datum-pwa-head {
      display:flex;
      align-items:flex-start;
      justify-content:space-between;
      gap:var(--space-4, 1rem);
      margin-bottom:var(--space-2, .5rem)
    }
    .datum-pwa-title {
      margin:0;
      font-size:var(--h4-size, 1.125rem);
      font-weight:600;
      line-height:1.3
    }
    .datum-pwa-x {
      flex:0 0 auto;
      width:32px;
      height:32px;
      display:flex;
      align-items:center;
      justify-content:center;
      font-size:1.375rem;
      line-height:1;
      padding:0;
      border:none;
      border-radius:var(--radius, .5rem);
      background:none;
      color:var(--muted-foreground, inherit);
      cursor:pointer;
      transition:background 150ms ease, color 150ms ease
    }
    .datum-pwa-x:hover { background:var(--accent, rgba(127,127,127,.14));color:var(--foreground, inherit) }
    .datum-pwa-x:focus-visible { outline:2px solid var(--ring, var(--border, currentColor));outline-offset:2px }
    .datum-pwa-msg {
      margin:0 0 var(--space-4, 1rem);
      color:var(--muted-foreground, inherit);
      font-size:.9375rem;
      line-height:1.5
    }
    .datum-pwa-msg svg { display:inline;vertical-align:-.15em;margin:0 .1em }
    .datum-pwa-actions { display:flex;flex-direction:column;gap:var(--space-2, .5rem) }
    .datum-pwa-act { width:100% }
    
    .datum-pwa-act > .atom-pressable, .datum-pwa-act > button, .datum-pwa-act > a { width:100% }
  
    .d-tt {
      box-sizing:border-box;
      display:inline-flex;
      align-items:center;
      max-width:100%
    }
  
    .atom-audio-fit { display:block; width:100% }
  
    .atom-doc-embed-fit { display:block; width:100%; height:min(70vh, 800px); border:0 }
  
    .atom-img-cover { width:100%; height:100%; object-fit:cover }
  
    .atom-video-fit { display:block; width:100%; height:auto; max-height:70vh; background:#000 }
  
    .caption-value { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap }
    .caption-value:has([data-slot="badge"]) { overflow:visible; text-overflow:clip }
  
    .drop-zone { position:relative }
    .drop-zone-overlay {
      display:none;
      position:absolute;
      inset:0;
      z-index:50;
      align-items:center;
      justify-content:center;
      border:2px dashed var(--primary);
      border-radius:var(--radius);
      background:color-mix(in oklch,var(--primary) 8%,var(--background));
      pointer-events:none
    }
    .drop-zone.drop-zone-active .drop-zone-overlay { display:flex }
    .drop-zone-overlay-inner {
      display:flex;
      flex-direction:column;
      align-items:center;
      gap:var(--space-2);
      color:var(--primary);
      font-weight:600
    }
    .dz-manifest { display:flex; flex-wrap:wrap; gap:6px }
    .dz-manifest:not(:empty) { margin-top:8px }
    .dz-chip {
      display:inline-flex;
      align-items:center;
      gap:6px;
      padding:2px 10px;
      border:1px solid var(--border);
      border-radius:999px;
      font-size:12px;
      max-width:100%;
      overflow:hidden
    }
    .dz-chip-name { overflow:hidden; text-overflow:ellipsis; white-space:nowrap }
    .dz-chip-x {
      border:none;
      background:none;
      cursor:pointer;
      color:inherit;
      padding:0;
      font-size:14px;
      line-height:1
    }
  
    .ip-card {
      display:flex; flex-direction:column; gap:var(--space-4);
      border-radius:var(--ip-radius); background:var(--ip-bg);
      box-shadow:var(--ip-shadow,none); border:var(--ip-border,none);
      padding:var(--ip-pad); width:90vw; max-width:420px;
      color:var(--foreground);
    }
    .ip-head { display:flex; align-items:center; justify-content:space-between; gap:var(--space-3) }
    .ip-title { margin:0; font-size:var(--font-size-title-medium,1.125rem); font-weight:var(--heading-weight,650) }
    .ip-close {
      display:inline-flex; align-items:center; justify-content:center;
      width:28px; height:28px; border:0; background:none; color:var(--muted-foreground);
      border-radius:var(--radius); cursor:pointer; font-size:20px; line-height:1;
    }
    .ip-close:hover { background:color-mix(in oklch,var(--foreground) 8%,transparent); color:var(--foreground) }
    .ip-close:focus-visible { outline:2px solid var(--ring); outline-offset:2px }
    .ip-drop {
      display:flex; flex-direction:column; align-items:center; gap:var(--space-3);
      padding:var(--space-5); border:2px dashed var(--border); border-radius:var(--radius);
      background:var(--muted); transition:border-color 120ms ease,background-color 120ms ease;
    }
    .ip-drop.ip-drop-active { border-color:var(--primary); background:color-mix(in oklch,var(--primary) 8%,var(--background)) }
    .ip-preview {
      width:96px; height:96px; object-fit:cover; background:var(--background);
      border-radius:var(--ip-preview-radius,9999px); border:1px solid var(--border);
    }
    .ip-preview[hidden] { display:none }
    .ip-hint { font-size:var(--small-font-size); color:var(--muted-foreground); text-align:center }
    .ip-progress { width:100%; height:6px; border-radius:999px; background:var(--muted); overflow:hidden }
    .ip-progress[hidden] { display:none }
    .ip-bar { height:100%; width:0%; border-radius:999px; background:var(--primary); transition:width 120ms ease }
    .ip-actions { display:flex; justify-content:flex-end; gap:var(--space-2) }
    .ip-browse {
      display:inline-flex; align-items:center; gap:var(--space-2);
      padding:var(--space-2) var(--space-4);
      border:1px solid var(--border); border-radius:var(--radius);
      background:var(--primary); color:var(--primary-foreground,#fff); cursor:pointer;
      font-size:var(--small-font-size); font-weight:600;
    }
    .ip-browse:hover { filter:brightness(1.05) }
    .ip-browse:focus-visible { outline:2px solid var(--ring); outline-offset:2px }
    .ip-native { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); border:0 }
  
    .up-field { display:flex; flex-direction:column; gap:var(--space-2); width:100% }
    .up-row { display:flex; align-items:center; gap:var(--space-3) }
    .up-preview {
      width:64px; height:64px; object-fit:cover; flex:0 0 auto;
      border-radius:var(--radius); border:1px solid var(--border); background:var(--muted)
    }
    .up-preview[hidden] { display:none }
    .up-pick {
      display:inline-flex; align-items:center; gap:var(--space-2);
      padding:var(--space-2) var(--space-3);
      border:1px solid var(--border); border-radius:var(--radius);
      background:var(--background); color:var(--foreground); cursor:pointer;
      font-size:var(--small-font-size);
      transition:background-color 120ms ease,border-color 120ms ease
    }
    .up-pick:hover { border-color:var(--primary); background:color-mix(in oklch,var(--accent) 10%,transparent) }
    .up-pick:focus-visible { outline:none; border-color:var(--state-focus-ring-color,var(--ring)); box-shadow:var(--state-focus-ring) }
    .up-native { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); border:0 }
    .up-name { font-size:var(--small-font-size); color:var(--muted-foreground); min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap }
    .up-progress { width:100%; height:6px; border-radius:999px; background:var(--muted); overflow:hidden }
    .up-progress[hidden] { display:none }
    .up-bar { height:100%; width:0%; border-radius:999px; background:var(--primary); transition:width 120ms ease }
   }
@layer structure { 
    
    .d-modal [class*='atom-'] { box-sizing:border-box }

    
    .d-sidebar .atom-box:has(.d-media) { padding-inline:0 }
    
    body.datum-dlg-dragging { cursor:move !important }
    body.datum-dlg-dragging * { cursor:move !important;-webkit-user-select:none !important;user-select:none !important }
    
    
    body { min-height:100dvh;display:flex;flex-direction:column;overflow-wrap:break-word }

    
    button { overflow-wrap:normal }
    [role="button"], [role="tab"], [role="menuitem"], [role="option"] {
      overflow-wrap:normal
    }

    
    .d-col { display:flex;flex-direction:column;align-items:stretch;gap:var(--d-gap, 0) }
    
    .d-col.ai-start > * { max-width:100% }
    .d-col.ai-center > * { max-width:100% }
    .d-col.ai-end > * { max-width:100% }
    .d-row { display:flex;flex-direction:row;align-items:stretch;gap:var(--d-gap, 0) }
    .d-wrap { display:flex;flex-wrap:wrap;gap:var(--d-gap, 0) }
    
    .d-grid { display:grid;gap:var(--d-gap, 0);grid-template-columns:repeat(var(--d-cols, 1), 1fr) }
    .d-grid[data-rows] { grid-template-rows:repeat(var(--d-rows, 1), 1fr) }
    
    .d-grid-tpl { display:grid;gap:var(--d-tpl-gap, 0);padding:var(--d-tpl-pad, 0);grid-template-columns:var(--d-tpl);min-width:max-content }
    
    .d-auto-grid { display:grid;gap:var(--d-ag-gap, 0);padding:var(--d-ag-pad, 0);grid-template-columns:repeat(auto-fill, minmax(min(var(--d-ag-min, 280px), 100%), var(--d-ag-max, 1fr))) }

    
    .d-fixed { position:fixed;z-index:var(--d-fixed-z, 50) }
    

    .d-fixed[data-anchor=top]    { top:calc(var(--d-safe-t, 0px) + var(--d-fixed-gap, 0px));left:var(--d-fixed-gap, 0);right:var(--d-fixed-gap, 0) }
    .d-fixed[data-anchor=bottom] { bottom:calc(var(--d-safe-b, 0px) + var(--d-fixed-gap, 0px));left:var(--d-fixed-gap, 0);right:var(--d-fixed-gap, 0) }
    .d-fixed[data-anchor=left]   { left:var(--d-fixed-gap, 0);top:var(--d-fixed-gap, 0);bottom:var(--d-fixed-gap, 0) }
    .d-fixed[data-anchor=right]  { right:var(--d-fixed-gap, 0);top:var(--d-fixed-gap, 0);bottom:var(--d-fixed-gap, 0) }
    .d-fixed[data-anchor=tl]     { top:calc(var(--d-safe-t, 0px) + var(--d-fixed-gap, 0px));left:var(--d-fixed-gap, 0) }
    .d-fixed[data-anchor=tr]     { top:calc(var(--d-safe-t, 0px) + var(--d-fixed-gap, 0px));right:var(--d-fixed-gap, 0) }
    .d-fixed[data-anchor=bl]     { bottom:calc(var(--d-safe-b, 0px) + var(--d-fixed-gap, 0px));left:var(--d-fixed-gap, 0) }
    .d-fixed[data-anchor=br]     { bottom:var(--d-fixed-gap, 0);right:var(--d-fixed-gap, 0) }
    .d-fixed[data-anchor=tc]     { top:var(--d-fixed-gap, 0);left:50%;transform:translateX(-50%) }
    .d-fixed[data-anchor=bc]     { bottom:var(--d-fixed-gap, 0);left:50%;transform:translateX(-50%) }
    .d-fixed[data-anchor=cl]     { left:var(--d-fixed-gap, 0);top:50%;transform:translateY(-50%) }
    .d-fixed[data-anchor=cr]     { right:var(--d-fixed-gap, 0);top:50%;transform:translateY(-50%) }
    .d-fixed[data-anchor=c]      { top:50%;left:50%;transform:translate(-50%, -50%) }

    
    
    #datum-overlays { position:fixed;inset:var(--d-safe-t,0px) var(--d-safe-r,0px) var(--d-safe-b,0px) var(--d-safe-l,0px);pointer-events:none;z-index:var(--z-toast, 70) }
    .d-toast-viewport { position:absolute;display:flex;flex-direction:column;gap:.5rem;max-width:min(92vw, 380px);pointer-events:none }
    .d-toast-viewport[data-anchor=tr] { top:1rem;right:1rem }
    
    .d-toast-viewport[data-anchor=br] { bottom:calc(1rem + env(safe-area-inset-bottom, 0px) + var(--datum-toast-bottom-inset, 0px));right:1rem }
    .d-toast {
      pointer-events:auto;display:flex;gap:.5rem;align-items:flex-start;
      padding:var(--notification-role-inset, .75rem 1rem);
      border:var(--notification-role-border, var(--overlay-role-border, 1px solid var(--border)));
      border-radius:var(--notification-role-radius, var(--radius));
      box-shadow:var(--notification-role-shadow, var(--overlay-role-shadow));
      
      background-color:var(--color-surface-overlay);
      background-image:linear-gradient(var(--_toast-bg),var(--_toast-bg));
      color:var(--_toast-fg);
      transform:translateX(110%);opacity:0;
      transition:transform .24s var(--ease-emphasized, ease), opacity .24s
    }
    .d-toast.d-show { transform:none;opacity:1 }
    
    .d-toast-info    { --_toast-bg:var(--color-info-subtle);    --_toast-fg:var(--color-on-info-subtle);    --_toast-accent:var(--color-info) }
    .d-toast-success { --_toast-bg:var(--color-success-subtle); --_toast-fg:var(--color-on-success-subtle); --_toast-accent:var(--color-success) }
    .d-toast-warning { --_toast-bg:var(--color-warning-subtle); --_toast-fg:var(--color-on-warning-subtle); --_toast-accent:var(--color-warning) }
    .d-toast-error   { --_toast-bg:var(--color-danger-subtle);  --_toast-fg:var(--color-on-danger-subtle);  --_toast-accent:var(--color-danger) }
    .d-toast-icon { flex:0 0 auto;color:var(--_toast-accent);margin-top:.06rem }
    .d-toast-body { flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:.15rem;font-size:.875rem;line-height:1.35 }
    .d-toast-title { font-weight:600 }
    .d-toast-msg { overflow-wrap:anywhere }
    .d-toast-close { flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;padding:.1rem;margin:-.1rem -.15rem -.1rem 0;background:none;border:0;color:inherit;opacity:.65;cursor:pointer;border-radius:var(--radius, .25rem) }
    .d-toast-close:hover { opacity:1 }
    .d-toast-close:focus-visible { outline:2px solid var(--_toast-accent);outline-offset:1px;opacity:1 }
    @media (prefers-reduced-motion: reduce) { .d-toast { transition:opacity .12s } .d-toast:not(.d-show) { transform:none } }

    
    
    :root { --sidebar-width:var(--d-sidebar-expanded-w) }
    
    .d-app-shell {
      margin:var(--d-safe-t,0px) var(--d-safe-r,0px) var(--d-safe-b,0px) var(--d-safe-l,0px);
      
      height:calc(100dvh - var(--d-safe-t,0px) - var(--d-safe-b,0px));
      overflow:hidden;
      display:flex;
      flex-direction:row;
      
      isolation:isolate
    }
    
    
    .d-safe { padding:var(--d-safe-t,0px) var(--d-safe-r,0px) var(--d-safe-b,0px) var(--d-safe-l,0px) }
    .d-safe > * { --d-safe-t:0px;--d-safe-r:0px;--d-safe-b:0px;--d-safe-l:0px }
    
    .d-app-shell[data-imp-active="1"] { height:calc(100dvh - 32px);margin-top:32px }
    .d-app-shell[data-imp-active="1"] .nav-rail { top:32px }
    .d-app-shell[data-imp-active="1"] .main-content { height:calc(100dvh - 32px) }
    
    .d-app-shell > .d-fixed[data-anchor=bottom] { display:none }
    @media (max-width:640px) {
      .d-app-shell > .d-fixed[data-anchor=bottom] {
        display:block;
        
        padding-bottom:env(safe-area-inset-bottom, 0px);
        background:var(--color-surface-raised)
      }
      
      
      .d-app-shell > .d-fixed[data-anchor=bottom] {
        transition: transform 220ms var(--transition-easing, ease), visibility 0s 0s
      }
      .d-app-shell[data-cs-sidebar-open=true] > .d-fixed[data-anchor=bottom] {
        transform: translateY(calc(100% + env(safe-area-inset-bottom, 0px) + 8px));
        visibility: hidden;
        pointer-events: none;
        transition: transform 220ms var(--transition-easing, ease), visibility 0s 220ms
      }
    }
    
    .d-app-shell[data-nav-surface=bar] > .d-fixed[data-anchor=bottom] {
      display:block;
      padding-bottom:env(safe-area-inset-bottom, 0px);
      background:var(--color-surface-raised)
    }
    
    .d-app-shell[data-nav-surface=bar][data-cs-sidebar-open=true] > .d-fixed[data-anchor=bottom] {
      transform: translateY(calc(100% + env(safe-area-inset-bottom, 0px) + 8px));
      visibility: hidden;
      pointer-events: none;
      transition: transform 220ms var(--transition-easing, ease), visibility 0s 220ms
    }
    
    
    .d-app-shell:has(.main-content [data-shell-chrome-collapse]):not([data-cs-sidebar-reveal=true]) .d-sidebar { display:none }
    .d-app-shell:has(.main-content [data-shell-chrome-collapse]):not([data-cs-sidebar-reveal=true]) .main-content { margin-left:0 }
    .d-app-shell:has(.main-content [data-shell-chrome-collapse]):not([data-cs-sidebar-reveal=true]) > .d-fixed[data-anchor=bottom] { display:none }
    
    body:has(> .d-app-shell) { padding:0 !important }

    

    
    .d-ca { container-type:inline-size;display:block;min-width:0 }
    .d-cas { display:block;min-width:0 }
    .d-cas > .d-ca-slot { display:none }
    .d-cas > .d-ca-slot[data-ca=base] { display:contents }
    @container (min-width:641px) { .d-cas[data-cabp~=sm] > .d-ca-slot[data-ca=base] { display:none } .d-cas[data-cabp~=sm] > .d-ca-slot[data-ca=sm] { display:contents } }
    @container (min-width:769px) { .d-cas[data-cabp~=md] > .d-ca-slot[data-ca=base] { display:none } .d-cas[data-cabp~=md] > .d-ca-slot[data-ca=sm] { display:none } .d-cas[data-cabp~=md] > .d-ca-slot[data-ca=md] { display:contents } }
    @container (min-width:1025px) { .d-cas[data-cabp~=lg] > .d-ca-slot[data-ca=base] { display:none } .d-cas[data-cabp~=lg] > .d-ca-slot[data-ca=sm] { display:none } .d-cas[data-cabp~=lg] > .d-ca-slot[data-ca=md] { display:none } .d-cas[data-cabp~=lg] > .d-ca-slot[data-ca=lg] { display:contents } }
    @container (min-width:1281px) { .d-cas[data-cabp~=xl] > .d-ca-slot[data-ca=base] { display:none } .d-cas[data-cabp~=xl] > .d-ca-slot[data-ca=sm] { display:none } .d-cas[data-cabp~=xl] > .d-ca-slot[data-ca=md] { display:none } .d-cas[data-cabp~=xl] > .d-ca-slot[data-ca=lg] { display:none } .d-cas[data-cabp~=xl] > .d-ca-slot[data-ca=xl] { display:contents } }


    
    .d-r-p { --r-p: var(--r-p-base);padding: var(--r-p) }
    @container (min-width:641px) { .d-r-p { --r-p: var(--r-p-sm, var(--r-p-base)) } }
    @container (min-width:769px) { .d-r-p { --r-p: var(--r-p-md, var(--r-p-sm, var(--r-p-base))) } }
    @container (min-width:1025px) { .d-r-p { --r-p: var(--r-p-lg, var(--r-p-md, var(--r-p-sm, var(--r-p-base)))) } }
    @container (min-width:1281px) { .d-r-p { --r-p: var(--r-p-xl, var(--r-p-lg, var(--r-p-md, var(--r-p-sm, var(--r-p-base))))) } }
    .d-rv-p { --rv-p: var(--rv-p-base);padding: var(--rv-p) }
    @media (min-width:641px) { .d-rv-p { --rv-p: var(--rv-p-sm, var(--rv-p-base)) } }
    @media (min-width:769px) { .d-rv-p { --rv-p: var(--rv-p-md, var(--rv-p-sm, var(--rv-p-base))) } }
    @media (min-width:1025px) { .d-rv-p { --rv-p: var(--rv-p-lg, var(--rv-p-md, var(--rv-p-sm, var(--rv-p-base)))) } }
    @media (min-width:1281px) { .d-rv-p { --rv-p: var(--rv-p-xl, var(--rv-p-lg, var(--rv-p-md, var(--rv-p-sm, var(--rv-p-base))))) } }
    .d-r-pi { --r-pi: var(--r-pi-base);padding-inline: var(--r-pi) }
    @container (min-width:641px) { .d-r-pi { --r-pi: var(--r-pi-sm, var(--r-pi-base)) } }
    @container (min-width:769px) { .d-r-pi { --r-pi: var(--r-pi-md, var(--r-pi-sm, var(--r-pi-base))) } }
    @container (min-width:1025px) { .d-r-pi { --r-pi: var(--r-pi-lg, var(--r-pi-md, var(--r-pi-sm, var(--r-pi-base)))) } }
    @container (min-width:1281px) { .d-r-pi { --r-pi: var(--r-pi-xl, var(--r-pi-lg, var(--r-pi-md, var(--r-pi-sm, var(--r-pi-base))))) } }
    .d-rv-pi { --rv-pi: var(--rv-pi-base);padding-inline: var(--rv-pi) }
    @media (min-width:641px) { .d-rv-pi { --rv-pi: var(--rv-pi-sm, var(--rv-pi-base)) } }
    @media (min-width:769px) { .d-rv-pi { --rv-pi: var(--rv-pi-md, var(--rv-pi-sm, var(--rv-pi-base))) } }
    @media (min-width:1025px) { .d-rv-pi { --rv-pi: var(--rv-pi-lg, var(--rv-pi-md, var(--rv-pi-sm, var(--rv-pi-base)))) } }
    @media (min-width:1281px) { .d-rv-pi { --rv-pi: var(--rv-pi-xl, var(--rv-pi-lg, var(--rv-pi-md, var(--rv-pi-sm, var(--rv-pi-base))))) } }
    .d-r-g { --r-g: var(--r-g-base);gap: var(--r-g) }
    @container (min-width:641px) { .d-r-g { --r-g: var(--r-g-sm, var(--r-g-base)) } }
    @container (min-width:769px) { .d-r-g { --r-g: var(--r-g-md, var(--r-g-sm, var(--r-g-base))) } }
    @container (min-width:1025px) { .d-r-g { --r-g: var(--r-g-lg, var(--r-g-md, var(--r-g-sm, var(--r-g-base)))) } }
    @container (min-width:1281px) { .d-r-g { --r-g: var(--r-g-xl, var(--r-g-lg, var(--r-g-md, var(--r-g-sm, var(--r-g-base))))) } }
    .d-rv-g { --rv-g: var(--rv-g-base);gap: var(--rv-g) }
    @media (min-width:641px) { .d-rv-g { --rv-g: var(--rv-g-sm, var(--rv-g-base)) } }
    @media (min-width:769px) { .d-rv-g { --rv-g: var(--rv-g-md, var(--rv-g-sm, var(--rv-g-base))) } }
    @media (min-width:1025px) { .d-rv-g { --rv-g: var(--rv-g-lg, var(--rv-g-md, var(--rv-g-sm, var(--rv-g-base)))) } }
    @media (min-width:1281px) { .d-rv-g { --rv-g: var(--rv-g-xl, var(--rv-g-lg, var(--rv-g-md, var(--rv-g-sm, var(--rv-g-base))))) } }
    .d-r-fs { --r-fs: var(--r-fs-base);font-size: var(--r-fs) }
    @container (min-width:641px) { .d-r-fs { --r-fs: var(--r-fs-sm, var(--r-fs-base)) } }
    @container (min-width:769px) { .d-r-fs { --r-fs: var(--r-fs-md, var(--r-fs-sm, var(--r-fs-base))) } }
    @container (min-width:1025px) { .d-r-fs { --r-fs: var(--r-fs-lg, var(--r-fs-md, var(--r-fs-sm, var(--r-fs-base)))) } }
    @container (min-width:1281px) { .d-r-fs { --r-fs: var(--r-fs-xl, var(--r-fs-lg, var(--r-fs-md, var(--r-fs-sm, var(--r-fs-base))))) } }
    .d-rv-fs { --rv-fs: var(--rv-fs-base);font-size: var(--rv-fs) }
    @media (min-width:641px) { .d-rv-fs { --rv-fs: var(--rv-fs-sm, var(--rv-fs-base)) } }
    @media (min-width:769px) { .d-rv-fs { --rv-fs: var(--rv-fs-md, var(--rv-fs-sm, var(--rv-fs-base))) } }
    @media (min-width:1025px) { .d-rv-fs { --rv-fs: var(--rv-fs-lg, var(--rv-fs-md, var(--rv-fs-sm, var(--rv-fs-base)))) } }
    @media (min-width:1281px) { .d-rv-fs { --rv-fs: var(--rv-fs-xl, var(--rv-fs-lg, var(--rv-fs-md, var(--rv-fs-sm, var(--rv-fs-base))))) } }

    
    .main-content.d-rv-pi { padding-inline:0 }
    
    .flex-1 { flex:1;min-height:0 }

    
    
    [id^='dv-bar-'] > .d-row { flex-wrap:nowrap;row-gap:.5rem }
    [id^='dv-bar-'] > .d-row > .d-row { flex-wrap:nowrap;row-gap:.5rem }
    
    [id^='dv-bar-'] > .d-row > .d-expanded { min-width:0 }
    
    
    [id^='dv-bar-'] > .d-row > .d-expanded > .d-row > * { min-width:0;flex:0 1 auto }
    
    [id^='dv-bar-'] > .d-row > .d-expanded > .d-row > * > * { max-width:100%;min-width:0 }
    [id^='dv-bar-'] > .d-row > .d-expanded > .d-row > * > * > .d-row { min-width:0;max-width:100% }
    [id^='dv-bar-'] > .d-row > .d-expanded > .d-row > * > * > .d-row > span { min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap }
    
    
    .d-ovf { display:contents }
    @media (min-width:641px) { .d-ovf[data-ovf-scope=v][data-ovf-bp=sm] > [data-d-pop-body], .d-ovf[data-ovf-scope=v][data-ovf-bp=sm] > [data-d-pop-body] > .atom-box { display:contents } .d-ovf[data-ovf-scope=v][data-ovf-bp=sm] > [data-d-pop-body] > .atom-box > .d-col { flex-direction:row;align-items:center;gap:.5rem } .d-ovf[data-ovf-scope=v][data-ovf-bp=sm] > [data-d-pop-trigger] { display:none } }
    @container (min-width:641px) { .d-ovf[data-ovf-scope=c][data-ovf-bp=sm] > [data-d-pop-body], .d-ovf[data-ovf-scope=c][data-ovf-bp=sm] > [data-d-pop-body] > .atom-box { display:contents } .d-ovf[data-ovf-scope=c][data-ovf-bp=sm] > [data-d-pop-body] > .atom-box > .d-col { flex-direction:row;align-items:center;gap:.5rem } .d-ovf[data-ovf-scope=c][data-ovf-bp=sm] > [data-d-pop-trigger] { display:none } }
    @media (min-width:769px) { .d-ovf[data-ovf-scope=v][data-ovf-bp=md] > [data-d-pop-body], .d-ovf[data-ovf-scope=v][data-ovf-bp=md] > [data-d-pop-body] > .atom-box { display:contents } .d-ovf[data-ovf-scope=v][data-ovf-bp=md] > [data-d-pop-body] > .atom-box > .d-col { flex-direction:row;align-items:center;gap:.5rem } .d-ovf[data-ovf-scope=v][data-ovf-bp=md] > [data-d-pop-trigger] { display:none } }
    @container (min-width:769px) { .d-ovf[data-ovf-scope=c][data-ovf-bp=md] > [data-d-pop-body], .d-ovf[data-ovf-scope=c][data-ovf-bp=md] > [data-d-pop-body] > .atom-box { display:contents } .d-ovf[data-ovf-scope=c][data-ovf-bp=md] > [data-d-pop-body] > .atom-box > .d-col { flex-direction:row;align-items:center;gap:.5rem } .d-ovf[data-ovf-scope=c][data-ovf-bp=md] > [data-d-pop-trigger] { display:none } }
    @media (min-width:1025px) { .d-ovf[data-ovf-scope=v][data-ovf-bp=lg] > [data-d-pop-body], .d-ovf[data-ovf-scope=v][data-ovf-bp=lg] > [data-d-pop-body] > .atom-box { display:contents } .d-ovf[data-ovf-scope=v][data-ovf-bp=lg] > [data-d-pop-body] > .atom-box > .d-col { flex-direction:row;align-items:center;gap:.5rem } .d-ovf[data-ovf-scope=v][data-ovf-bp=lg] > [data-d-pop-trigger] { display:none } }
    @container (min-width:1025px) { .d-ovf[data-ovf-scope=c][data-ovf-bp=lg] > [data-d-pop-body], .d-ovf[data-ovf-scope=c][data-ovf-bp=lg] > [data-d-pop-body] > .atom-box { display:contents } .d-ovf[data-ovf-scope=c][data-ovf-bp=lg] > [data-d-pop-body] > .atom-box > .d-col { flex-direction:row;align-items:center;gap:.5rem } .d-ovf[data-ovf-scope=c][data-ovf-bp=lg] > [data-d-pop-trigger] { display:none } }
    @media (min-width:1281px) { .d-ovf[data-ovf-scope=v][data-ovf-bp=xl] > [data-d-pop-body], .d-ovf[data-ovf-scope=v][data-ovf-bp=xl] > [data-d-pop-body] > .atom-box { display:contents } .d-ovf[data-ovf-scope=v][data-ovf-bp=xl] > [data-d-pop-body] > .atom-box > .d-col { flex-direction:row;align-items:center;gap:.5rem } .d-ovf[data-ovf-scope=v][data-ovf-bp=xl] > [data-d-pop-trigger] { display:none } }
    @container (min-width:1281px) { .d-ovf[data-ovf-scope=c][data-ovf-bp=xl] > [data-d-pop-body], .d-ovf[data-ovf-scope=c][data-ovf-bp=xl] > [data-d-pop-body] > .atom-box { display:contents } .d-ovf[data-ovf-scope=c][data-ovf-bp=xl] > [data-d-pop-body] > .atom-box > .d-col { flex-direction:row;align-items:center;gap:.5rem } .d-ovf[data-ovf-scope=c][data-ovf-bp=xl] > [data-d-pop-trigger] { display:none } }
    .d-ovf.d-ovf-collapsed > [data-d-pop-body] { display:none }
    .d-ovf.d-ovf-collapsed > [data-d-pop-trigger] { display:inline-flex }
    .d-ovf.d-ovf-expanded > [data-d-pop-body], .d-ovf.d-ovf-expanded > [data-d-pop-body] > .atom-box { display:contents }
    .d-ovf.d-ovf-expanded > [data-d-pop-body] > .atom-box > .d-col { flex-direction:row;align-items:center;gap:.5rem }
    .d-ovf.d-ovf-expanded > [data-d-pop-trigger] { display:none }

    
    @media (max-width:640px) {
      
      [id^='dv-bar-'] > .d-row { flex-wrap:wrap }
      [id^='dv-bar-'] > .d-row > .d-row { flex-wrap:wrap }
      
      
      
      [id^='dv-bar-'] > .d-row > [id^='dv-search-'] { flex-basis:100%;width:100%;max-width:none !important }
      
      
      [id^='dv-bar-'] > .d-row > .d-expanded > .d-row > * { flex:0 0 auto;scroll-snap-align:start }
      
      
      [id^='dv-bar-'] > .d-row > .d-row { flex:0 0 auto;justify-content:flex-start }
      [id^='dv-bar-'] > .d-row > .d-row button, [id^='dv-bar-'] > .d-row > .d-row a { padding-inline:.375rem }
      
      [id^='dv-bar-'] > .d-row > .d-expanded { flex:1 1 0%;min-width:0 }
      
      [id^='dv-bar-'] > .d-row > .d-expanded > .d-row {
        flex-wrap:nowrap;
        overflow-x:auto;overflow-y:hidden;
        overscroll-behavior-x:contain;
        -webkit-overflow-scrolling:touch;
        scrollbar-width:none;
        scroll-snap-type:x proximity;
        padding-block:2px;
        
        margin-inline:calc(-1 * var(--rv-pi, 0px));
        padding-inline:var(--rv-pi, 0px);
        scroll-padding-inline:var(--rv-pi, 0px);
        -webkit-mask-image:linear-gradient(to right, transparent, #000 var(--rv-pi, 12px), #000 calc(100% - var(--rv-pi, 12px)), transparent);
        mask-image:linear-gradient(to right, transparent, #000 var(--rv-pi, 12px), #000 calc(100% - var(--rv-pi, 12px)), transparent)
      }
      [id^='dv-bar-'] > .d-row > .d-expanded > .d-row::-webkit-scrollbar { display:none }
      [id^='dv-bar-'] > .d-row > .d-expanded { overflow:visible }
      [id^='dv-bar-'] > .d-row { overflow:visible }
      .atom-box[data-clip='1'] > .d-col:has(> form > [id^='dv-bar-']) { overflow:visible }
      
      [id^='dv-bar-'] { padding-inline:0 }
      [id^='dv-chips-'] { padding-inline:0 }
      
      [id^='dv-bar-'] > .d-row > .d-row .d-ovf > [data-d-pop-trigger] > button > .d-row > span { display:none }
      
      [id^='dv-bar-'], [id^='dv-chips-'] { --control-height:30px }
      [id^='dv-bar-'] { padding-block:.375rem }
      [id^='dv-chips-'] { padding-block:.25rem }
      [id^='dv-bar-'] > .d-row { row-gap:.375rem }
      [id^='dv-bar-'] button, [id^='dv-bar-'] a { padding-block:.25rem }
      
      [id^='dv-chips-'] > .d-wrap {
        flex-wrap:nowrap;
        overflow-x:auto;overflow-y:hidden;
        overscroll-behavior-x:contain;
        -webkit-overflow-scrolling:touch;
        scrollbar-width:none;
        scroll-snap-type:x proximity;
        padding-block:2px;
        margin-inline:calc(-1 * var(--rv-pi, 0px));
        padding-inline:var(--rv-pi, 0px);
        scroll-padding-inline:var(--rv-pi, 0px);
        -webkit-mask-image:linear-gradient(to right, transparent, #000 var(--rv-pi, 12px), #000 calc(100% - var(--rv-pi, 12px)), transparent);
        mask-image:linear-gradient(to right, transparent, #000 var(--rv-pi, 12px), #000 calc(100% - var(--rv-pi, 12px)), transparent)
      }
      [id^='dv-chips-'] > .d-wrap::-webkit-scrollbar { display:none }
      [id^='dv-chips-'] > .d-wrap > * { flex:0 0 auto;scroll-snap-align:start }
      [id^='dv-chips-'] > .d-wrap > span { white-space:nowrap }
      
      [id^='dv-pager-'] { --control-height:30px;padding-block:.25rem }
      [id^='dv-pager-'] button, [id^='dv-pager-'] a { padding-block:.25rem }
    }

    
    #page-header > .d-row { flex-wrap:wrap;row-gap:var(--space-2) }
    #page-header > .d-row > *:first-child { min-width:12rem }

    
    [id^='ph-dock-'] { display:none }

    
    @media (max-width:640px) {
      #page-header > .d-row { flex-wrap:wrap;row-gap:var(--space-2) }
      #page-header > .d-row > .d-row { flex-basis:100%;min-width:0;justify-content:flex-start }
      
      .d-app-shell[data-nav-dup='1'] #page-header > .d-row > *:first-child > .d-col,
      .d-app-shell[data-nav-dup='1'] #page-header > .d-row > *:first-child > .d-row > .d-col {
        position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap
      }
      
      .d-app-shell:has([id^='ph-dock-']) [id^='ph-primary-'] { display:none }
      
      [id^='ph-dock-'] { display:block;padding-block:var(--space-2) }
      
      #page-header > .d-row > .d-row { flex-wrap:wrap;row-gap:var(--space-2) }
    }

    .jc-start { justify-content:flex-start }
    .jc-end { justify-content:flex-end }
    .jc-center { justify-content:center }
    .jc-between { justify-content:space-between }
    .jc-around { justify-content:space-around }
    .jc-evenly { justify-content:space-evenly }

    .ai-start { align-items:flex-start }
    .ai-end { align-items:flex-end }
    .ai-center { align-items:center }
    .ai-stretch { align-items:stretch }
    .ai-baseline { align-items:baseline }

    .overflow-auto { overflow:auto }
    .overflow-y-auto { overflow-y:auto }
    .overflow-x-auto { overflow-x:auto }

    
    .atom-box { box-sizing:border-box }
    .atom-box[data-centered="1"] { display:inline-flex;align-items:center;justify-content:center }
    .atom-box[data-clip="1"] { overflow:hidden }
    [data-sticky="top"]    { position:sticky;top:0;z-index:3 }
    [data-sticky="left"]   { position:sticky;left:0;z-index:2 }
    [data-sticky="corner"] { position:sticky;top:0;left:0;z-index:4 }
 }
@layer base {
@keyframes datum-spin {
}
@keyframes datum-skeleton {
}
@keyframes datum-pulse {
}
}
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important; } }
@media (forced-colors: active) { a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible,[tabindex]:focus-visible,[role='button']:focus-visible,[role='link']:focus-visible,[role='menuitem']:focus-visible,[role='menuitemcheckbox']:focus-visible,[role='option']:focus-visible,[role='tab']:focus-visible { outline:2px solid Highlight;outline-offset:1px } }
@media (prefers-contrast: more) and (forced-colors: none) { a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible,[tabindex]:focus-visible,[role='button']:focus-visible,[role='link']:focus-visible,[role='menuitem']:focus-visible,[role='menuitemcheckbox']:focus-visible,[role='option']:focus-visible,[role='tab']:focus-visible { outline:2px solid var(--foreground);outline-offset:1px } }
@layer overrides { body { background-color: oklch(0.114 0.004 106.953); color: oklch(0.953 0.021 88.721); } }
@layer scheme { :root { color-scheme: dark only; }
html[data-cs="dark"] { color-scheme: dark only; }
}
@layer overrides { :root { --state-disabled-opacity: 0.50;
--state-disabled-cursor: not-allowed;
--state-invalid-border-color: light-dark(oklch(0.6 0.18 25), oklch(0.7 0.14 25));
--state-invalid-ring: 0 0 0 0.125rem color-mix(in oklch, light-dark(oklch(0.6 0.18 25), oklch(0.7 0.14 25)) 22%, transparent);
--state-readonly-opacity: 1.00;
--state-readonly-bg: oklch(0.211 0.021 86.146);
--state-busy-opacity: 0.70;
--state-busy-cursor: progress;
--state-busy-spinner: oklch(0.838 0.114 88.743);
--state-focus-ring-color: oklch(0.838 0.114 88.743);
--state-focus-ring-width: 0.125rem;
--state-focus-ring-offset: 0.125rem;
--ic-gold: #e8c66e; --ic-ink: #f5efe0; --ic-muted: #b6ae9d; --ic-border: rgba(201,162,75,.22); --ic-edge: rgba(201,162,75,.12); --ic-metal: linear-gradient(108deg,#b28d31 0%,#e8c66e 22%,#f8e9b8 25%,#d9b65c 28%,#f2d98c 56%,#ba9234 100%); --ic-panel: linear-gradient(180deg,#100d08f5,#0a0805f5); } }

@font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 400; font-display: block; src: url('/_datum/themes/identity-code/montserrat-400.ttf') format('truetype'); }
@font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 500; font-display: block; src: url('/_datum/themes/identity-code/montserrat-500.ttf') format('truetype'); }
@font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 600; font-display: block; src: url('/_datum/themes/identity-code/montserrat-600.ttf') format('truetype'); }
@font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 700; font-display: block; src: url('/_datum/themes/identity-code/montserrat-700.ttf') format('truetype'); }
@font-face { font-family: 'Cinzel'; font-style: normal; font-weight: 600; font-display: block; src: url('/_datum/themes/identity-code/cinzel-600.ttf') format('truetype'); }
html { scrollbar-gutter:auto; }
body { margin:0; font:400 15px/1.5 'Montserrat',sans-serif; -webkit-font-smoothing:antialiased; background:#050504; color:var(--ic-ink); }
*,*::before,*::after { box-sizing:border-box; }
.ic-image { display:contents; }
.ic-shell { display:flex; height:100dvh; overflow:hidden; background:radial-gradient(circle at 50% -10%,#c9a24b1c,transparent 42%),radial-gradient(circle at 86% 82%,#c9a24b0f,transparent 36%),#050504; }
.ic-shell button,.ic-shell a { font:inherit; }
.ic-shell button:focus-visible,.ic-shell a:focus-visible,.ic-shell input:focus-visible { outline:2px solid var(--ic-gold); outline-offset:3px; }
.ic-shell svg { flex-shrink:0; }
.ic-shell [class^='ic-'] { min-width:0; }
.ic-text { color:inherit; font:inherit; }
.ic-sidebar { width:clamp(238px,19.08vw,242px); flex:0 0 clamp(238px,19.08vw,242px); display:flex; flex-direction:column; padding:18px 14px 14px; gap:10px; background:linear-gradient(180deg,#0a0908f5,#050504f0); border-right:1px solid var(--ic-edge); }
.ic-brand { height:77px; min-height:77px; display:flex; flex-direction:column; align-items:center; gap:5px; }
.ic-brand img { width:145px; height:38px; object-fit:contain; }
.ic-brand-name { font-size:9.5px; font-weight:600; letter-spacing:.32em; color:var(--ic-ink); }
.ic-brand-tier { font-size:7px; letter-spacing:.42em; color:#d9b65c; }
.ic-roles { display:grid; grid-template-columns:1fr 1fr; gap:2px; border:1px solid var(--ic-edge); border-radius:15px; padding:4px; }
.ic-role { border:1px solid transparent; border-radius:999px; min-height:24px; padding:3px; color:var(--ic-muted); font-size:9px!important; letter-spacing:.09em; background:transparent; }
.ic-role-selected { border-color:var(--ic-border); background:#c9a24b21; color:#e8c66e; }
.ic-navigation { display:flex; flex-direction:column; gap:10px; flex:1; }
.ic-nav-item { display:flex; align-items:center; gap:12px; width:100%; border:0; border-left:2px solid transparent; border-radius:10px; padding:4px 10px; min-height:28px; background:transparent; text-decoration:none; text-align:left; color:#ded8ca; }
.ic-nav-item svg { width:17px; height:17px; }
.ic-nav-label { font-size:13px; line-height:1.4; font-weight:500; }
.ic-nav-item-selected { background:#c9a24b12; border-left-color:#e8c66e; }
.ic-license { display:flex; align-items:center; gap:10px; padding:9px 11px; border:1px solid var(--ic-border); border-radius:12px; margin-top:auto; min-height:42px; }
.ic-license svg { color:var(--ic-gold); }
.ic-license-copy { display:flex; flex-direction:column; }
.ic-license-label { font-size:8px; letter-spacing:.18em; line-height:1.2; color:#a89d86; }
.ic-license-value { font-size:9px; font-weight:600; letter-spacing:.11em; line-height:1.2; margin-top:2px; }
.ic-workspace { flex:1; display:flex; flex-direction:column; overflow:hidden; }
.ic-topbar { height:77px; min-height:77px; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:18px 26px; border-bottom:1px solid var(--ic-edge); background:#050504eb; }
.ic-page-title { transform:translateY(3px); font-size:21px; font-weight:600; line-height:1.2; }
.ic-page-title-dashboard { color:var(--ic-gold); font-family:'Cinzel',serif; font-weight:600; font-size:20px; }
.ic-top-actions { display:flex; gap:9px; align-items:center; }
.ic-locale,.ic-icon-action { display:inline-flex; align-items:center; justify-content:center; gap:6px; height:40px; min-width:43px; border:1px solid var(--ic-edge); border-radius:999px; background:#ffffff02; color:var(--ic-muted); padding:8px; font-size:14px!important; }
.ic-locale { padding:8px 12px; }
.ic-notification { position:relative; }
.ic-notification-count { position:absolute; right:-2px; top:-3px; width:17px; height:17px; display:grid; place-items:center; border:1px solid #ffd4c0; border-radius:50%; background:#be4235; box-shadow:0 0 7px #ed796b55; color:white; font:500 12px/1 'Montserrat'; }
.ic-content { position:relative; isolation:isolate; flex:1; overflow:auto; scrollbar-width:none; padding:25px 26px; }
.ic-content-dashboard { padding-top:22px; }
.ic-content-chat { display:flex; padding:11px 24px 16px 28px; overflow:hidden; }
.ic-content::before { content:''; position:absolute; z-index:-1; pointer-events:none; width:540px; height:540px; border:1px solid #d4c8b10a; border-radius:50%; left:80px; top:315px; }
.ic-content::after { content:''; position:absolute; z-index:-1; pointer-events:none; width:630px; height:630px; border:1px solid #d4c8b109; border-radius:50%; right:-340px; top:-450px; }
.ic-dashboard,.ic-archetypes { display:grid; gap:18px; }
.ic-dashboard { gap:16px; }
.ic-streak-card,.ic-course-card,.ic-events-card,.ic-archetypes-card,.ic-expert-rail,.ic-chat-card,.ic-card { background:var(--ic-panel); border:1px solid var(--ic-border); border-radius:18px; box-shadow:0 18px 50px #00000052; overflow:hidden; }
.ic-streak-card { background:radial-gradient(circle at 62% 38%,#c9a24b1f,transparent 30%),linear-gradient(110deg,#0c0a07fc,#060504fa); }
.ic-streak-layout { display:grid; grid-template-columns:minmax(0,1fr) 185px; gap:12px; min-height:219px; padding:18px 25px 16px; }
.ic-streak-body { display:flex; flex-direction:column; justify-content:space-between; }
.ic-streak-heading { display:flex; align-items:center; gap:9px; font-size:10px; }
.ic-streak-heading::before { content:''; width:30px; height:1px; background:linear-gradient(90deg,transparent,#c7b98a); }
.ic-streak-heading::after { content:''; flex:1; height:1px; background:linear-gradient(90deg,#c7b98a,transparent); }
.ic-streak-summary { display:grid; grid-template-columns:1.4fr .8fr 1fr; gap:10px; align-items:center; margin-top:10px; }
.ic-current-streak { display:flex; align-items:center; gap:11px; min-height:89px; padding-right:11px; border-right:2px solid #eeca69a3; }
.ic-streak-orb { display:flex; flex-direction:column; align-items:center; justify-content:center; width:89px; height:89px; flex-shrink:0; border:2px solid #eeca69d1; border-radius:50%; position:relative; background:radial-gradient(circle,#c9a24b3d,#080705f0 64%); box-shadow:inset 0 0 22px #eeca6929,0 0 20px #c9a24b3b; }
.ic-streak-orb::after { content:''; position:absolute; inset:6px; border:1px solid #eeca698a; border-radius:inherit; }
.ic-streak-orb svg { width:16px; height:16px; color:#d3c49a; }
.ic-streak-count { font:600 28px/.9 'Cinzel',serif; }
.ic-current-copy,.ic-record-copy,.ic-mystery-copy { display:grid; gap:4px; }
.ic-eyebrow { font-size:13px; font-weight:400; line-height:1.4; color:var(--ic-muted); }
.ic-streak-status { font-size:15px; white-space:nowrap; color:#d4c8b1; }
.ic-record { display:flex; gap:8px; align-items:center; }
.ic-record-icon { width:40px; height:40px; display:grid; place-items:center; flex-shrink:0; border:1px solid #eeca6966; border-radius:50%; color:#d4c8b1; }
.ic-record-value { font-size:20px; font-weight:700; line-height:1; }
.ic-mystery { display:flex; align-items:center; justify-content:center; gap:10px; height:94px; padding:12px; border:1px solid #eeca6966; border-radius:999px; background:linear-gradient(100deg,transparent 10%,#f9edb322 24%,#fff7cb77 25%,transparent 29%),#050504b3; text-align:left; }
.ic-mystery img { width:47px; height:43px; object-fit:cover; border-radius:8px; border:1px solid var(--ic-border); }
.ic-mystery-title { font-size:11px; font-weight:700; color:var(--ic-ink); white-space:nowrap; }
.ic-calendar { display:grid; grid-template-columns:repeat(30,minmax(0,1fr)); gap:3px; margin-top:21px; }
.ic-day { display:flex; flex-direction:column; gap:7px; align-items:center; }
.ic-day-number { color:#a89d86; font-size:9px; }
.ic-day-missed .ic-day-number { color:#c78276; }
.ic-day-mark { width:21px; height:21px; border:1px solid #c9a24b14; border-radius:50%; display:grid; place-items:center; color:#c7b78c; font:400 15px/1 'Montserrat'; }
.ic-day-mark-missed { border-color:#a75c5280; color:#b97b70; }
.ic-day-mark-complete { border-color:#d7c57a; background:#c9a24b4d; color:#f2d98c; }
.ic-dna-orbit { display:flex; align-items:center; justify-content:center; position:relative; }
.ic-dna-orbit img { width:173px; height:173px; object-fit:cover; mix-blend-mode:screen; opacity:.9; mask-image:radial-gradient(ellipse 55% 58% at center,#000 32%,#000d 50%,#0004 74%,transparent 100%); }
.ic-dashboard-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.ic-course-inner,.ic-events-inner { padding:21px 16px 18px; height:295px; }
.ic-course-inner { display:grid; grid-template-rows:auto auto 1fr 45px 26px; gap:13px; }
.ic-card-heading { font-size:14.7px; font-weight:700; line-height:1.2; }
.ic-course-title { font-size:14.2px; font-weight:700; line-height:1.35; }
.ic-course-progress { display:flex; flex-direction:column; justify-content:center; gap:6px; }
.ic-caption { font-size:11px; color:var(--ic-muted); line-height:1.3; }
.ic-progress-row { display:flex; align-items:center; gap:9px; }
.ic-progress-row .progress { flex:1; }
.ic-progress-value { font-size:9px; color:#b0a58a; }
.ic-progress-track { height:6px; background:#caa44b1f; overflow:hidden; border-radius:999px; }
.ic-progress-bar { height:100%; background:var(--ic-metal); border-radius:inherit; }
.ic-button { background:var(--ic-metal); border:1px solid #d9b65c55; color:#171207; border-radius:999px; display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:10px 22px; text-decoration:none; }
.ic-button-label { font:700 14px/1.2 'Montserrat',sans-serif; color:inherit; }
.ic-shell .ic-button { font:700 14px/1.2 'Montserrat',sans-serif; }
.ic-button-outline { background:transparent; color:var(--ic-gold); border-color:var(--ic-border); }
.ic-button-ghost { background:transparent; border-color:transparent; color:var(--ic-gold); }
.ic-more { display:flex; align-items:center; gap:6px; padding:0; border:0; background:transparent; color:#c9b985; font-size:13px!important; text-align:left; white-space:nowrap; }
.ic-more svg { width:14px; height:14px; }
.ic-events-inner { display:flex; flex-direction:column; gap:15px; }
.ic-event { display:grid; grid-template-columns:75px 1fr; gap:12px; padding:6px; background:#ffffff02; border:1px solid var(--ic-edge); border-radius:15px; }
.ic-event-date { display:flex; flex-direction:column; align-items:center; justify-content:center; border-radius:12px; background:#f5efe014; min-height:86px; }
.ic-event-month { font-size:14px; font-weight:600; }
.ic-event-day { font-size:38px; font-weight:700; line-height:1.1; }
.ic-event-copy { display:flex; flex-direction:column; justify-content:center; gap:4px; }
.ic-event-title { font-size:18px; font-weight:700; line-height:1.15; }
.ic-event-time { font-size:13px; color:#b6ae9d; }
.ic-event-location { display:flex; align-items:center; gap:4px; font-size:13px; color:#c8b67e; }
.ic-event-location svg { width:13px; height:13px; }
.ic-expert-preview { margin-inline:-26px; display:grid; grid-template-columns:repeat(7,1fr); gap:4px; overflow:hidden; height:200px; }
.ic-expert-preview img { width:100%; height:200px; object-fit:cover; object-position:top; }
.ic-archetypes-inner { padding:20px 17px 18px; }
.ic-section-title { display:block; font-size:28px; font-weight:700; line-height:1.3; margin-bottom:33px; }
.ic-archetypes-bars { display:grid; gap:13px; }
.ic-archetype-row { display:grid; align-items:center; gap:14px; grid-template-columns:minmax(180px,.65fr) minmax(180px,1.35fr) 44px; }
.ic-archetype-label { font-size:15px; color:var(--ic-muted); }
.ic-archetype-value { color:#f2d98c; font-weight:700; text-align:right; font-size:14px; }
.ic-archetype-row .ic-progress-bar { background:linear-gradient(100deg,#9a7b2e,#e8c66e 22%,#f8e9b8 34%,#d9b65c 60%,#9a7b2e); }
.ic-archetype-row .ic-progress-track { height:7px; border-radius:0; }
.ic-dominant { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:21px; border-top:1px solid #e8c66e8c; border-bottom:1px solid #e8c66e8c; padding:47px 45px 46px; }
.ic-dominant-mark { width:73px; height:73px; display:grid; place-items:center; border:1px solid #e8c66e; border-radius:50%; color:var(--ic-gold); font:600 36px/1 'Cinzel',serif; background:radial-gradient(circle at 25% 15%,#e8c66e30,transparent 70%); }
.ic-dominant-copy { display:grid; gap:6px; }
.ic-dominant-title { font-size:22px; font-weight:700; line-height:1.4; }
.ic-dominant-description { font-size:15px; line-height:1.6; color:var(--ic-muted); }
.ic-dominant-value { color:#f2d98c; font-size:71px; font-weight:700; line-height:1.2; }
.ic-archetype-details { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.ic-chat-layout { display:grid; grid-template-columns:244px minmax(0,1fr); gap:14px; width:100%; height:100%; }
.ic-expert-rail { height:100%; }
.ic-expert-rail-inner { height:100%; display:flex; flex-direction:column; padding:18px 17px; gap:13px; }
.ic-expert-heading { position:relative; padding-right:20px; }
.ic-expert-heading .ic-eyebrow { display:block; margin-bottom:4px; }
.ic-expert-title { display:block; font-size:28px; font-weight:700; line-height:1.2; }
.ic-expert-heading>svg { position:absolute; right:10px; top:12px; color:#c9b985; }
.ic-expert-list { display:flex; flex-direction:column; gap:8px; overflow:auto; scrollbar-width:none; }
.ic-expert { position:relative; display:flex; align-items:center; gap:12px; flex-shrink:0; padding:10px; min-height:57px; width:100%; border:1px solid var(--ic-edge); border-radius:15px; background:#c9a24b06; color:var(--ic-ink); text-align:left; }
.ic-expert-selected { border-color:#e8c66e8c; box-shadow:inset 0 0 12px #e8c66e0a,0 0 12px #e8c66e0d; background:#c9a24b13; }
.ic-expert:disabled { border-color:#b457574d; color:#bd7373; opacity:.55; }
.ic-expert:disabled>svg { position:absolute; top:8px; left:8px; width:13px; height:13px; color:#c76a6a; }
.ic-expert>svg { width:13px; height:13px; color:#c9b985; margin-left:auto; }
.ic-expert-icon { width:33px; height:33px; flex-shrink:0; border:1px solid var(--ic-border); border-radius:50%; display:grid; place-items:center; overflow:hidden; background:#050504; }
.ic-expert-icon img { width:22px; height:22px; object-fit:cover; opacity:.7; }
.ic-expert-label { flex:1; font-size:12px; font-weight:600; line-height:1.4; }
.ic-chat-inner { height:100%; display:flex; flex-direction:column; padding:17px 17px 16px; }
.ic-chat-tabs { display:grid; grid-template-columns:1fr 1fr; background:#05050499; border:1px solid var(--ic-edge); border-radius:999px; padding:3px; gap:4px; margin-bottom:14px; }
.ic-chat-tab { border:1px solid transparent; border-radius:999px; height:38px; background:transparent; font-size:14px!important; font-weight:700!important; color:var(--ic-ink); }
.ic-chat-tab-selected { background:#c9a24b21; border-color:var(--ic-border); color:var(--ic-gold); }
.ic-thread { display:flex; flex-direction:column; gap:11px; flex:1; min-height:0; overflow:auto; scrollbar-width:none; padding:11px 12px 21px; background:linear-gradient(180deg,#0403028c,#040302ad),url('/_datum/themes/identity-code/chat-background.png') right center/cover no-repeat; border:1px solid var(--ic-edge); border-radius:15px; }
.ic-message { border:1px solid var(--ic-edge); border-radius:15px; padding:12px 13px 12px; background:#f5efe009; max-width:min(540px,86%); display:flex; flex-direction:column; gap:8px; color:#fff; }
.ic-message-user { position:relative; align-self:flex-end; background:#c9a24b1f; border-color:var(--ic-border); }
.ic-chat-status { position:absolute; top:1px; right:0; width:30px; height:30px; display:grid; place-items:center; border:1px solid #f27267; border-radius:50%; background:#5c1612c2; color:#f27267; box-shadow:0 0 14px #de493d33; }
.ic-chat-status svg { width:17px; height:17px; }
.ic-message-paragraph { font-size:15px; line-height:1.55; color:#e6e2da; }
.ic-message-time { font-size:12px; color:#ded8cf; align-self:flex-end; margin-top:0; }
.ic-composer { display:flex; align-items:center; gap:6px; padding:7px; border:1px solid var(--ic-edge); border-radius:999px; background:#050504c2; flex-shrink:0; min-height:54px; }
.ic-composer>div:not(.ic-attachment):not(.ic-microphone):not(.ic-send) { flex:1; }
.ic-composer input { width:100%; background:transparent; color:var(--ic-ink); border:0; outline:0; box-shadow:none; padding:8px; font:400 14px/1.4 'Montserrat'; }
.ic-composer input::placeholder { color:#837c6d; }
.ic-attachment,.ic-microphone,.ic-send { display:grid; place-items:center; border:0; background:transparent; color:#b6ae9d; width:32px; height:32px; border-radius:50%; padding:5px; flex-shrink:0; }
.ic-attachment svg,.ic-microphone svg { width:17px; height:17px; }
.ic-send { width:39px; height:39px; background:var(--ic-metal); color:#171207; }
@media(max-width:900px) { .ic-sidebar { width:200px; flex-basis:200px; } .ic-content { padding:18px; } .ic-streak-layout { grid-template-columns:1fr; } .ic-dna-orbit { display:none; } .ic-chat-layout { grid-template-columns:195px minmax(0,1fr); } .ic-more { white-space:normal; } }
@media(max-width:650px) { .ic-shell { height:auto; min-height:100dvh; overflow:visible; } .ic-sidebar { width:60px; flex-basis:60px; padding:16px 6px; } .ic-brand { height:40px; min-height:40px; } .ic-brand img { width:45px; height:30px; } .ic-brand-name,.ic-brand-tier,.ic-roles,.ic-nav-label,.ic-license { display:none; } .ic-nav-item { justify-content:center; padding:8px; } .ic-navigation { gap:8px; } .ic-topbar { padding:12px; height:auto; min-height:70px; gap:8px; flex-wrap:wrap; } .ic-page-title { transform:translateY(3px); font-size:17px; } .ic-content { padding:12px; } .ic-dashboard-grid { grid-template-columns:1fr; } .ic-streak-layout { padding:14px; } .ic-streak-summary { grid-template-columns:1fr; } .ic-current-streak { border:0; } .ic-record { display:none; } .ic-mystery { height:60px; } .ic-calendar { grid-template-columns:repeat(10,1fr); gap:5px; } .ic-day-mark { width:17px; height:17px; } .ic-section-title { font-size:20px; margin-bottom:20px; } .ic-archetype-row { grid-template-columns:minmax(0,1fr) 35px; gap:5px; } .ic-archetype-row>.progress { grid-column:1 / -1; grid-row:2; } .ic-dominant { grid-template-columns:50px 1fr; padding:22px 8px; gap:12px; } .ic-dominant-mark { width:50px; height:50px; } .ic-dominant-value { grid-column:2; font-size:44px; } .ic-chat-layout { grid-template-columns:1fr; } .ic-expert-rail { display:none; } .ic-chat-inner { padding:10px; min-height:600px; } .ic-thread { overflow:visible; } .ic-message { max-width:100%; } .ic-message-paragraph { font-size:13px; } .ic-chat-tab { font-size:11px!important; } .ic-chat-card { overflow:visible; } .ic-archetype-details { grid-template-columns:1fr; } }
@media(prefers-reduced-motion:reduce) { .ic-shell *, .ic-shell *::before, .ic-shell *::after { animation:none!important; transition:none!important; } }
