/* generated from smashandclash v1.0.0 — do not edit; the .design file is normative */

:root {
  --sc-color-primary: var(--sc-color-candy-sun-base);
  --sc-color-on-primary: var(--sc-color-ink);
  --sc-color-world-deep: #016dcb;
  --sc-color-world-mid: #0a8fe0;
  --sc-color-world-bright: #0abeff;
  --sc-color-world-pale: #8adfff;
  --sc-color-world-mist: #d9f5ff;
  --sc-color-ink: #0d1a4a;
  --sc-color-ink-2: #22357a;
  --sc-color-ink-3: #4a5e9c;
  --sc-color-ink-deep: #06102f;
  --sc-color-glass: rgb(13 26 74 / 0.82);
  --sc-color-glass-soft: rgb(13 26 74 / 0.62);
  --sc-color-scrim: rgb(6 16 47 / 0.5);
  --sc-color-shadow-ink: rgb(6 16 47);
  --sc-color-sugar: #ffffff;
  --sc-color-sugar-2: #eef6ff;
  --sc-color-sugar-3: #dcebff;
  --sc-color-sugar-edge: #b4d0f0;
  --sc-color-candy-sun-hi: #ffe872;
  --sc-color-candy-sun-base: #ffc21a;
  --sc-color-candy-sun-lip: #d98a00;
  --sc-color-candy-sugar-hi: #ffffff;
  --sc-color-candy-sugar-base: #e6f0ff;
  --sc-color-candy-sugar-lip: #b4d0f0;
  --sc-color-candy-mint-hi: #8bf7cf;
  --sc-color-candy-mint-base: #22d39a;
  --sc-color-candy-mint-lip: #0e9a6c;
  --sc-color-candy-grape-hi: #8a4bff;
  --sc-color-candy-grape-base: #5b25d6;
  --sc-color-candy-grape-lip: #3b139e;
  --sc-color-candy-sky-hi: #5ed3ff;
  --sc-color-candy-sky-base: #1398f0;
  --sc-color-candy-sky-lip: #0a62b8;
  --sc-color-candy-gum-hi: #ff8cc8;
  --sc-color-candy-gum-base: #ff3e9a;
  --sc-color-candy-gum-lip: #c4126a;
  --sc-color-candy-cherry-hi: #ff5a5a;
  --sc-color-candy-cherry-base: #e02030;
  --sc-color-candy-cherry-lip: #9e0f18;
  --sc-color-text-body: var(--sc-color-ink);
  --sc-color-text-muted: var(--sc-color-ink-2);
  --sc-color-text-subtle: var(--sc-color-ink-3);
  --sc-color-text-error: #b0105c;
  --sc-color-text-danger: #c0121e;
  --sc-color-text-on-fill: var(--sc-color-ink);
  --sc-color-text-on-deep: #ffffff;
  --sc-color-action-primary: var(--sc-color-candy-sun-base);
  --sc-color-action-primary-hi: var(--sc-color-candy-sun-hi);
  --sc-color-action-primary-lip: var(--sc-color-candy-sun-lip);
  --sc-color-action-secondary: var(--sc-color-candy-sugar-base);
  --sc-color-action-danger: var(--sc-color-candy-cherry-base);
  --sc-color-state-success: var(--sc-color-candy-mint-base);
  --sc-color-state-error: var(--sc-color-candy-gum-base);
  --sc-color-player-you: #2173e8;
  --sc-color-player-you-hi: #5fa6ff;
  --sc-color-player-you-lip: #134a9f;
  --sc-color-player-them: #f4581f;
  --sc-color-player-them-hi: #ff9a62;
  --sc-color-player-them-lip: #a8380c;
  --sc-color-mode-mutators: var(--sc-color-candy-grape-base);
  --sc-color-mode-classic: var(--sc-color-world-bright);
  --sc-color-card-frame-red: #ce3a3d;
  --sc-color-card-frame-orange: #eca441;
  --sc-color-card-frame-green: #56c841;
  --sc-color-card-frame-blue: #3493da;
  --sc-color-card-frame-purple: #b241ec;
  --sc-color-card-frame-pink: #fc41a3;
  --sc-color-card-frame-gray: #8a8f9c;
  --sc-color-card-badge-top: #FD5656;
  --sc-color-card-badge-right: #FFDE59;
  --sc-color-card-badge-bottom: #5271FF;
  --sc-color-card-badge-left: #7ED957;
  --sc-typography-display-font-family: Luckiest Guy, Lilita One, system-ui, sans-serif;
  --sc-typography-display-font-weight: 400;
  --sc-typography-display-letter-spacing: 0.02em;
  --sc-typography-display-line-height: 1;
  --sc-typography-screen-title-font-family: Luckiest Guy, Lilita One, system-ui, sans-serif;
  --sc-typography-screen-title-font-size: clamp(1.875rem, 1.2rem + 2.4vw, 3rem);
  --sc-typography-screen-title-font-weight: 400;
  --sc-typography-screen-title-line-height: 1;
  --sc-typography-ribbon-title-font-family: Luckiest Guy, Lilita One, system-ui, sans-serif;
  --sc-typography-ribbon-title-font-size: clamp(1.5rem, 1.2rem + 1vw, 2rem);
  --sc-typography-ribbon-title-font-weight: 400;
  --sc-typography-ribbon-title-line-height: 1;
  --sc-typography-hero-label-font-family: Luckiest Guy, Lilita One, system-ui, sans-serif;
  --sc-typography-hero-label-font-size: 2.25rem;
  --sc-typography-hero-label-font-weight: 400;
  --sc-typography-hero-label-line-height: 1;
  --sc-typography-card-value-font-family: Luckiest Guy, system-ui, sans-serif;
  --sc-typography-card-value-font-weight: 400;
  --sc-typography-card-value-line-height: 1;
  --sc-typography-card-value-font-feature: "tnum" 1;
  --sc-typography-label-font-family: Lilita One, Luckiest Guy, system-ui, sans-serif;
  --sc-typography-label-font-size: 1.0625rem;
  --sc-typography-label-font-weight: 400;
  --sc-typography-label-line-height: 1.05;
  --sc-typography-label-lg-font-family: Lilita One, Luckiest Guy, system-ui, sans-serif;
  --sc-typography-label-lg-font-size: 1.375rem;
  --sc-typography-label-lg-font-weight: 400;
  --sc-typography-label-lg-line-height: 1.05;
  --sc-typography-body-font-family: Rubik, system-ui, Segoe UI, Roboto, sans-serif;
  --sc-typography-body-font-size: 1rem;
  --sc-typography-body-font-weight: 600;
  --sc-typography-body-line-height: 1.35;
  --sc-typography-caption-font-family: Rubik, system-ui, Segoe UI, Roboto, sans-serif;
  --sc-typography-caption-font-size: 0.875rem;
  --sc-typography-caption-font-weight: 600;
  --sc-typography-caption-line-height: 1.3;
  --sc-typography-micro-font-family: Rubik, system-ui, Segoe UI, Roboto, sans-serif;
  --sc-typography-micro-font-size: 0.75rem;
  --sc-typography-micro-font-weight: 800;
  --sc-typography-micro-line-height: 1.1;
  --sc-typography-numeral-font-family: Rubik, system-ui, sans-serif;
  --sc-typography-numeral-font-weight: 800;
  --sc-typography-numeral-font-feature: "tnum" 1;
  --sc-spacing-unit: 4px;
  --sc-spacing-xs: 4px;
  --sc-spacing-sm: 8px;
  --sc-spacing-md: 12px;
  --sc-spacing-lg: 16px;
  --sc-spacing-xl: 24px;
  --sc-spacing-xxl: 32px;
  --sc-spacing-gutter: clamp(0.75rem, 0.5rem + 1.4vw, 2rem);
  --sc-spacing-target-min: 2.75rem;
  --sc-spacing-ring-room-x: 1.375rem;
  --sc-spacing-ring-room-y: 0.75rem;
  --sc-spacing-icon-gap: 0.625rem;
  --sc-radius-sm: 12px;
  --sc-radius-md: 18px;
  --sc-radius-lg: 26px;
  --sc-radius-xl: 34px;
  --sc-radius-icon-button: 30%;
  --sc-radius-card: 7%;
  --sc-radius-full: 9999px;
  --sc-shape-skew: -8deg;
  --sc-shape-unskew: 8deg;
  --sc-shape-card-aspect: 0.7333;
  --sc-shape-lip-sm: 4px;
  --sc-shape-lip-md: 6px;
  --sc-shape-lip-hero: 8px;
  --sc-shape-lip-pressed: 2px;
  --sc-elevation-lip-sm: 0 4px 0 var(--sc-lip, #b4d0f0);
  --sc-elevation-lip: 0 6px 0 var(--sc-lip, #b4d0f0);
  --sc-elevation-lip-hero: 0 8px 0 var(--sc-lip, #b4d0f0);
  --sc-elevation-lip-pressed: 0 2px 0 var(--sc-lip, #b4d0f0);
  --sc-elevation-panel: 0 6px 0 #b4d0f0;
  --sc-elevation-plate: 0 4px 0 #06102f;
  --sc-elevation-cast: 0 10px 24px rgb(6 16 47 / 0.28);
  --sc-elevation-grape-text: 0 2px 0 rgb(6 16 47 / 0.55);
  --sc-border-ring-gap: 3px;
  --sc-border-ring-band: 3px;
  --sc-border-ring-keyline: 2px;
  --sc-border-ring-band-color: #ffffff;
  --sc-border-ring-keyline-color: var(--sc-color-ink);
  --sc-motion-duration-press: 90ms;
  --sc-motion-duration-exit: 150ms;
  --sc-motion-duration-fade: 180ms;
  --sc-motion-duration-enter: 250ms;
  --sc-motion-duration-wipe: 560ms;
  --sc-motion-stagger-screen: 45ms;
  --sc-motion-stagger-dialog: 40ms;
  --sc-motion-stagger-tabs: 35ms;
  --sc-motion-stagger-list: 30ms;
  --sc-motion-stagger-max-items: 8;
  --sc-motion-easing-out: cubic-bezier(0.23, 1, 0.32, 1);
  --sc-motion-easing-pop: cubic-bezier(0.34, 1.56, 0.64, 1);
  --sc-motion-easing-cam: cubic-bezier(0.65, 0, 0.35, 1);
  --sc-motion-easing-exit: cubic-bezier(0.4, 0, 1, 1);
  --sc-motion-easing-wipe: cubic-bezier(0.76, 0, 0.24, 1);
  --sc-motion-spring-press-duration: 0.12s;
  --sc-motion-spring-press-bounce: 0;
  --sc-motion-spring-release-duration: 0.42s;
  --sc-motion-spring-release-bounce: 0.5;
  --sc-motion-spring-hover-duration: 0.36s;
  --sc-motion-spring-hover-bounce: 0.45;
  --sc-motion-spring-settle-duration: 0.3s;
  --sc-motion-spring-settle-bounce: 0.2;
  --sc-motion-spring-pill-duration: 0.38s;
  --sc-motion-spring-pill-bounce: 0.25;
  --sc-motion-spring-pop-duration: 0.42s;
  --sc-motion-spring-pop-bounce: 0.4;
  --sc-motion-spring-panel-duration: 0.45s;
  --sc-motion-spring-panel-bounce: 0.2;
  --sc-motion-spring-stamp-duration: 0.5s;
  --sc-motion-spring-stamp-bounce: 0.45;
  --sc-background-world: radial-gradient(130% 110% at 50% 0%, #0abeff 0%, #016dcb 80%);
  --sc-background-panel: linear-gradient(180deg, #ffffff, #eef6ff);
  --sc-background-sheet: linear-gradient(180deg, #ffffff, #eef6ff 70%, #dcebff);
  --sc-background-candy: linear-gradient(180deg, var(--sc-hi, #ffffff), var(--sc-base, #e6f0ff));
  --sc-breakpoint-stack: (max-aspect-ratio: 19/20);
  --sc-breakpoint-split: (min-aspect-ratio: 19/20);
  --sc-breakpoint-short: (min-aspect-ratio: 19/20) and (max-height: 30rem);
  --sc-breakpoint-big-screen: (min-width: 112.5rem) and (min-height: 62.5rem);
  --sc-breakpoint-four-k: (min-width: 160rem) and (min-height: 90rem);
  --sc-opacity-disabled: 0.5;
  --sc-opacity-glass: 0.82;
  --sc-opacity-glass-soft: 0.62;
  --sc-z-index-page: 25;
  --sc-z-index-overlay: 30;
  --sc-z-index-layer: 40;
  --sc-z-index-toast: 50;
  --sc-z-index-hints: 55;
  --sc-z-index-wipe: 60;
  --sc-iconography-set: house set - 24-unit viewBox, currentColor strokes;
  --sc-iconography-stroke: 2.4;
  --sc-iconography-caps: round;
  --sc-iconography-joins: round;
  --sc-iconography-sizes-sm: 16;
  --sc-iconography-sizes-md: 20;
  --sc-iconography-sizes-lg: 24;
  --sc-iconography-emoji: never;
  --sc-sound-enabled: True;
  --sc-sound-material: soft rounded candy-toy pops and plinks, cute cartoon, dry with no reverb, one hit, no sharp click;
  --sc-sound-peak: -3dBFS;
  --sc-sound-loudness-feedback: -18LUFS;
  --sc-sound-loudness-game: -14LUFS;
  --sc-sound-loudness-music: -16LUFS;
  --sc-sound-duration-tap: 60ms;
  --sc-sound-duration-hover: 50ms;
  --sc-sound-duration-place: 200ms;
  --sc-sound-duration-capture: 350ms;
  --sc-sound-duration-deny: 150ms;
  --sc-sound-sync-lag-max: 30ms;
}

:root[data-theme="high-contrast"] {
  --sc-color-glass: rgb(13 26 74 / 0.97);
  --sc-color-glass-soft: rgb(13 26 74 / 0.97);
  --sc-color-scrim: rgb(6 16 47 / 0.72);
  --sc-border-ring-gap: 2px;
  --sc-border-ring-band: 4px;
  --sc-border-ring-keyline-color: #000000;
}