:root[data-template="dandelion"] {
  --orange-100: #fbf1ec;
  --orange-200: #ff5000;
  --orange-300: #e24e0f;
  --orange-400: #ce4a10;
  --orange-500: #fbe5db;
  --orange-600: #fbe5db;
  --black-100: #292929;
  --black-200: #332824;
  --black-300: #000000;
  --gray-100: #d2d2d2;
  --gray-200: #777777;
  --gray-300: #f2f2f2;
  --gray-400: #747474;
  --gray-500: #fdf5f2;
  --gray-600: #faf6f5;
  --white: #ffffff;
  --white-100: #f0e3dd;
  --red-200: #e00404;
  --blue-100: #c5dff2;
  --peach-100: #fdf5f2;
  --peach-200: #faf6f5;
  --gray-300: #afafaf;
  --gray-400: #e7e6e9;
  --black-300: #1f1f1f;

  --color-bg: var(--white);
  --color-surface: var(--orange-100);
  --color-fg: var(--black-100);
  --color-muted: var(--black-200);
  --color-subtle: var(--gray-200);
  --color-primary: var(--orange-300);
  --color-primary-hover: var(--orange-400);
  --color-primary-fg: var(--white);
  --color-primary-sg: var(--gray-500);
  --color-primary-vg: var(--orange-600);
  --color-accent: var(--orange-400);
  --color-danger: var(--red-200);
  --color-divider: var(--white-100);
  --color-text-inverse: var(--white);
  --color-surface-tertiary: var(--gray-600);
  --color-credit-overlay: var(--blue-100);
  --color-media-fallback: var(--gray-400);
  --color-card-overlay: rgba(0, 0, 0, 0.7);
  --color-card-overlay-solid: var(--black-300);

  --color-rating-active: var(--color-primary);
  --color-rating-empty: var(--gray-100);

  --color-card-surface: var(--peach-100);
  --color-input-bg: var(--peach-200);
  --color-switch-off: var(--white-100);
  --color-switch-on: rgba(226, 78, 15, 0.5);
  --color-swatch-ring: var(--gray-400);
  --color-text-disabled: var(--gray-300);

  --gallery-backdrop: var(--black-300);
  --gallery-control: var(--white);
  --gallery-control-bg: rgba(255, 255, 255, 0.12);
  --gallery-control-bg-hover: rgba(255, 255, 255, 0.24);
  --gallery-arrow-bg: rgba(251, 241, 236, 0.2);
  --gallery-arrow-bg-hover: rgba(251, 241, 236, 0.4);
  --gallery-arrow-fg: var(--color-primary);
  --color-bg-card-media: var(--gray-300);
  --color-card-gradient-start: var(--gray-500);
  --color-card-gradient-end: var(--orange-500);
  --advantage-card-line-bg: linear-gradient(
    90deg,
    transparent 0%,
    var(--color-primary) 50%,
    transparent 100%
  );
  --advantage-card-overlay-bg: linear-gradient(
    180deg,
    transparent 0%,
    rgba(0, 0, 0, 0.7) 30%,
    var(--black-300) 100%
  );

  --header-bg: var(--white);
  --header-border: rgba(240, 227, 221, 0.5);
  --header-shadow: 0 18px 60px rgba(41, 41, 41, 0.08);

  --running-line-height: 46px;
  --header-height: 60px;
  --header-height-desktop: 80px;
  --menu-offset-top: calc(var(--running-line-height) + var(--header-height));

  --container-max-width: 1336px;

  --breakpoint-xxs: 360px;
  --breakpoint-xl: 1440px;
}