/* MagicMax UI palette 0.2 | accepted basis 2026-10-28 | product surfaces only */
[data-magic-theme="dark"] {
  --magic-background: #1C1C1C;
  --magic-chrome: #3D3F43;
  --magic-surface: #292B2E;
  --magic-note: #242628;
  --magic-border: #77828C;
  --magic-text: #E3E7EA;
  --magic-muted: #AEBBC7;
  --magic-nameGray: #AEBBC7;
  --magic-nameOrange: #FF6900;
  --magic-onFill: #FF6900;
  --magic-onArc: #FF6900;
  --magic-onIcon: #1C1C1C;
  --magic-traffic: #1C1C1C;
  --magic-offFill: #292B2E;
  --magic-offArc: #FF9C92;
  --magic-offIcon: #FF9C92;
  --magic-onState: #FF9D56;
  --magic-error: #FF9C92;
  --magic-windowBorder: color-mix(in srgb, var(--magic-border) 55%, var(--magic-background));
  --magic-chromeDivider: color-mix(in srgb, var(--magic-border) 45%, var(--magic-chrome));
  --magic-noteBorder: color-mix(in srgb, var(--magic-border) 30%, var(--magic-note));
  --magic-logsDivider: color-mix(in srgb, var(--magic-border) 40%, var(--magic-background));
}
[data-magic-theme="light"] {
  --magic-background: #EEF2F5;
  --magic-chrome: #CFDAE2;
  --magic-surface: #FFFFFF;
  --magic-note: #E4E9ED;
  --magic-border: #7E878F;
  --magic-text: #22272B;
  --magic-muted: #4B5C69;
  --magic-nameGray: #4B5C69;
  --magic-nameOrange: #FF6900;
  --magic-onFill: #FF6900;
  --magic-onArc: #FF6900;
  --magic-onIcon: #1C1C1C;
  --magic-traffic: #1C1C1C;
  --magic-offFill: #FFFFFF;
  --magic-offArc: #A3342E;
  --magic-offIcon: #A3342E;
  --magic-onState: #A84400;
  --magic-error: #A3342E;
  --magic-windowBorder: color-mix(in srgb, var(--magic-border) 55%, var(--magic-background));
  --magic-chromeDivider: color-mix(in srgb, var(--magic-border) 45%, var(--magic-chrome));
  --magic-noteBorder: color-mix(in srgb, var(--magic-border) 30%, var(--magic-note));
  --magic-logsDivider: color-mix(in srgb, var(--magic-border) 40%, var(--magic-background));
}