templates/data-app/themes/sticker-pop/theme.css

:root {
  color-scheme: light dark;
  --adaptive-theme: 1;
  --font-sans: ui-rounded, "SF Pro Rounded", system-ui, sans-serif;
  --background: light-dark(#fff8fc, #20151d);
  --surface: light-dark(#fff, #2b1d28);
  --surface-raised: light-dark(#fff, #332131);
  --muted: light-dark(#fff0f8, #382438);
  --control: light-dark(#fff, #2b1d28);
  --control-hover: light-dark(#fff0f8, #40263b);
  --interaction-hover: var(--muted);
  --interaction-active: var(--control-hover);
  --text: light-dark(#261526, #fff0f8);
  --secondary: light-dark(#856f80, #d4aec7);
  --border: light-dark(#f2b9da, #6c3d60);
  --border-strong: light-dark(#df7fba, #995579);
  --accent: light-dark(#7450ff, #a592ff);
  --positive: light-dark(#14824c, #7cdda4);
  --negative: light-dark(#d43764, #ff8cab);
  --chart-1: light-dark(#ff5ea8, #ff83bb);
  --chart-2: light-dark(#7450ff, #a592ff);
  --chart-3: #00a9c7;
  --chart-4: #e47d00;
  --chart-5: #24a963;
  --chart-6: #ee5636;
  --chart-7: #c28b00;
  --chart-8: #2e76ff;
  --movement-positive: color-mix(in srgb, var(--chart-1) 70%, var(--text));
  --movement-negative: color-mix(in srgb, var(--chart-4) 70%, var(--text));
  --chart-neutral-fill: color-mix(in srgb, var(--text) 3%, var(--surface));
  --ranked-list-fill: color-mix(in srgb, var(--chart-1) 16%, var(--surface));
  --ranked-list-fill-hover: color-mix(in srgb, var(--chart-1) 24%, var(--surface));
  --movement-total: var(--secondary);
  --card-radius: 24px;
  --control-radius: 16px;
  --mark-radius: 12;
  --card-shadow: 0 4px 0 light-dark(#f2b9da, #6c3d60);
  --shadow: 0 4px 0 light-dark(#f2b9da, #6c3d60);
}