:root {
  color-scheme: dark;

  /* Primitive colour families. */
  --turn-ink: #08090a;
  --turn-paper: #fff8e8;
  --turn-white: #fffdf6;
  --turn-road: #44494f;
  --turn-muted: #d6d0c2;
  --turn-warm-grey-300: #cba;
  --turn-warm-grey-500: #90887f;

  --turn-yellow-600: #ffbd12;
  --turn-yellow-400: #ffd43b;
  --turn-yellow-200: #ffe087;
  --turn-yellow-100: #fff0a8;

  --turn-blue-600: #35b8e7;
  --turn-blue-500: #38d9ff;
  --turn-blue-300: #68c8f2;
  --turn-blue-200: #8ed8ff;
  --turn-blue-100: #bdeeff;

  --turn-pink-500: #ea5da1;
  --turn-pink-200: #ff8caf;
  --turn-pink-100: #ffd1e6;

  --turn-red-500: #ff6b6b;
  --turn-red-200: #ff9b91;

  --turn-green-500: #8ce99a;
  --turn-green-200: #d9f5c2;
  --turn-green-100: #c8f5d0;

  --turn-orange-500: #ff7b54;
  --turn-orange-200: #ffb89f;
  --turn-orange-100: #ffd0ae;

  --turn-violet-200: #d0bfff;

  --turn-teal-200: #7dd;

  /* Theme roles (#1067). Neutral surfaces and the ink on them change with the theme;
     anything on a semantic colour keeps --turn-ink. Hard shadows have their own colour,
     so they stay an elevation cue in both themes. */
  --turn-surface-page: var(--turn-paper);
  --turn-surface-raised: var(--turn-white);
  --turn-surface-bright: #ffffff;
  --turn-surface-card: #fffcf2;
  --turn-text: var(--turn-ink);
  --turn-text-heading: var(--turn-ink);
  --turn-text-heading-muted: var(--turn-text-muted);
  --turn-text-muted: rgb(8 9 10 / 0.68);
  --turn-text-faint: rgb(8 9 10 / 0.32);
  --turn-outline: var(--turn-ink);
  --turn-outline-muted: var(--turn-text-faint);
  --turn-shadow-color: var(--turn-ink);
  /* Decorative separation inside a coloured frame; focus stays on outline. */
  --turn-frame-inner-edge-color: rgb(8 9 10 / 0.18);
  --turn-shadow-frame-inner: inset 0 0 0 1px var(--turn-frame-inner-edge-color);

  /* Semantic UI roles. */
  /* Teal is the primary action and the selected form control (#1268); pink opens a sheet. */
  --turn-action-primary: var(--turn-teal-200);
  --turn-action-sheet: var(--turn-pink-200);
  --turn-action-utility: var(--turn-surface-page);
  --turn-action-information: var(--turn-blue-500);
  --turn-accessibility-mark: #154F91;
  --turn-action-game: var(--turn-blue-500);
  --turn-action-success: var(--turn-green-500);
  --turn-action-warning: var(--turn-yellow-400);
  --turn-action-danger: var(--turn-red-500);
  --turn-action-reset: var(--turn-red-200);
  --turn-action-navigation: var(--turn-orange-500);

  /* HOW TO PLAY scenery: keep the ground distinct from the sky in both themes. */
  --turn-demo-ground: #337700;

  /* Native form and disclosure roles. */
  --turn-form-control-idle: var(--turn-surface-page);
  --turn-form-control-selected: var(--turn-teal-200);
  --turn-form-control-focus: var(--turn-blue-500);
  --turn-disclosure-trigger: var(--turn-blue-300);
  --turn-disclosure-panel: var(--turn-surface-page);

  /* Four track difficulty tiers communicate challenge, not success or failure. */
  --turn-difficulty-easy: var(--turn-green-200);
  --turn-difficulty-medium: var(--turn-yellow-200);
  --turn-difficulty-advanced: var(--turn-orange-200);
  --turn-difficulty-expert: var(--turn-red-200);
  --turn-difficulty-hard: var(--turn-difficulty-expert);
  --turn-difficulty-locked: var(--turn-muted);

  /* Perk rarity (#1247): always named in words and presentation only. */
  --turn-rarity-common: var(--turn-green-200);
  --turn-rarity-rare: var(--turn-blue-200);
  --turn-rarity-epic: var(--turn-violet-200);
  --turn-rarity-legendary: var(--turn-yellow-600);
  --turn-rarity-mythic: var(--turn-red-500);

  /* Driving-control roles. */
  --turn-control-gas: var(--turn-green-500);
  --turn-control-drift: var(--turn-blue-500);
  --turn-control-boost: var(--turn-yellow-400);
  --turn-control-boost-empty: var(--turn-yellow-200);
  --turn-control-brake: var(--turn-orange-500);
  /* FLOW's colour, on the control that just earned it (ui/flow-pulses.js). */
  --turn-control-flow: var(--turn-pink-500);
  /* LOCK beside the pad, SHIFT while it is on, and OVERCHARGE's purple, which LOCK
     turns while it builds it. The race's drive pad (drive-pad.css) and BOOST bar
     (gameplay-v2.css) read them, as do HOW TO PLAY's demos (ui/how-to-play-demos.js). */
  --turn-control-lock: #748ffc;
  --turn-control-shift-on: #51cf66;
  --turn-control-overcharge: #8b5cf6;
  /* PRECISION multiplier beside the OVERCHARGE meter, with a matching glow. */
  --turn-control-precision: #a477ff;
  /* OVERCHARGE's deep and light ends, where it widens the BOOST bar past full. */
  --turn-control-overcharge-deep: #5f3dc4;
  --turn-control-overcharge-light: #d0bfff;
  /* What the car leaves behind (#1209, render/drive-effects.js): BOOST's wake runs from
     BOOST yellow into a warm tail, and a slide throws pale tyre smoke. OVERCHARGE's wake
     uses the OVERCHARGE roles above. */
  --turn-effect-boost: var(--turn-yellow-400);
  --turn-effect-boost-tail: #ff922b;
  --turn-effect-turbo: var(--turn-red-500);
  --turn-effect-turbo-tail: var(--turn-orange-500);
  --turn-effect-drift-smoke: #d9d4cc;
  /* The cream ring on a pressed drive-pad zone, and on a pressed LOCK or REVERSE. */
  --turn-control-pressed: color-mix(in srgb, var(--turn-paper) 78%, transparent);
  --turn-control-pressed-bubble: color-mix(in srgb, var(--turn-paper) 62%, transparent);

  /* Social challenge identity. Join order stays stable even when race order changes. */
  --turn-social-racer-1: var(--turn-pink-100);
  --turn-social-racer-2: var(--turn-blue-100);
  --turn-social-racer-3: var(--turn-green-100);
  --turn-social-racer-4: var(--turn-yellow-100);
  --turn-social-racer-5: var(--turn-orange-100);

  /* Geometry. */
  --turn-border-micro: 1.5px;
  --turn-border-compact: 2.25px;
  --turn-border-default: 3px;
  --turn-border-heavy: 4.5px;
  --turn-radius-micro: 6px;
  --turn-radius-compact: 9px;
  --turn-radius-default: 13.5px;
  --turn-radius-hero: 21px;
  --turn-radius-pill: 749.25px;
  --turn-radius-circle: 50%;
  /* Elevation lives in design-scale.css; these older names map onto its levels. */
  --turn-shadow-compact: var(--turn-shadow-control, 3px 3px 0 var(--turn-ink));
  --turn-shadow-default: var(--turn-shadow-card, 6px 6px 0 var(--turn-ink));
  --turn-shadow-hero: var(--turn-shadow-dialog, 8px 8px 0 var(--turn-ink));

  /* Spacing. */
  --turn-space-1: 3px;
  --turn-space-2: 6px;
  --turn-space-3: 9px;
  --turn-space-4: 12px;
  --turn-space-6: 18px;
  --turn-space-8: 24px;
  --turn-space-12: 36px;

  /* Backwards-compatible production aliases. */
  --ink: var(--turn-ink);
  --paper: var(--turn-paper);
  --cyan: var(--turn-blue-500);
  --pink: var(--turn-pink-200);
  --yellow: var(--turn-yellow-400);
  --lime: var(--turn-green-500);
  --m8-ink: var(--turn-ink);
  --m8-cream: var(--turn-paper);
  --m8-pink: var(--turn-pink-200);
  --m8-yellow: var(--turn-yellow-600);
  --m8-blue: var(--turn-blue-300);
}

/* Dark theme (#1067), set by the theme resolver in index.html. Neutral surfaces become
   warm night greys and the ink on them becomes cream; semantic colours (actions,
   accents, the --turn-ink on them) keep their values. Hard shadows go darker than any
   surface, so they still read as elevation rather than glow. Large headings and
   active outlines use warm grey; inactive outlines use its quieter shade. Smaller
   text keeps Paper cream. Against the brightest neutral surface (#2e3035), headings
   and active outlines exceed 7:1; inactive outlines exceed 3:1. */
:root[data-theme="dark"] {
  --turn-surface-page: #1c1d20;
  --turn-surface-raised: #26282c;
  --turn-surface-bright: #2e3035;
  --turn-surface-card: #26282c;
  --turn-text: #fff8e8;
  --turn-text-heading: var(--turn-warm-grey-300);
  --turn-text-heading-muted: var(--turn-warm-grey-300);
  --turn-text-muted: rgb(255 248 232 / 0.72);
  --turn-text-faint: rgb(255 248 232 / 0.42);
  --turn-outline: var(--turn-warm-grey-300);
  --turn-outline-muted: var(--turn-warm-grey-500);
  --turn-shadow-color: #000000;
  --turn-frame-inner-edge-color: rgb(0 0 0 / 0.42);
  --turn-header: #111214;
}

/* Heading colour is independent of body copy. Component titles can use the same
   role; small section labels with their own text role keep that role. */
:where(h1, h2) {
  color: var(--turn-text-heading);
}

/* These display-sized labels use the text role in their component styles. Scope
   that role to heading ink without changing neighbouring body copy. */
:where(.track-intro-name, .install-copy) {
  --turn-text: var(--turn-text-heading);
}

/* An inactive control (locked or disabled) keeps the muted outline in the dark theme. */
:root[data-theme="dark"] :is(button, [role="button"]):is(:disabled, [aria-disabled="true"], .is-locked):not([aria-busy="true"]) {
  border-color: var(--turn-outline-muted);
}

/* Colour surfaces (#1067). A component painted in a semantic colour carries the light
   theme with it: its text is Ink and every role inside it is the light one, exactly as
   in light. Its own outline stays the dark theme's warm grey against the night around it;
   the outlines inside it are Ink. This one list names every such component. */
:root[data-theme="dark"] :is(
  /* Coloured controls */
  .turn-pr-button:is(.is-primary, .is-sheet):not(.is-locked), .garage-back, .garage-step,
  .turn-home-sheet-close, .turn-pr-close, .m8-dialog-head > button,
  .install-primary, .install-close, .install-kicker, .install-step-number, .share-symbol, .install-copy-address,
  .m8-achievements-button, .turn-race-achievements-button, .turn-race-sheet .turn-race-menu > .spectate-button,
  .m8-reset-rivals, .m8-reset-cancel, .m8-reset-confirm, .m8-reset-confirm-button,
  .roadbook-rivals-reset-button, .roadbook-rivals-confirm-button,
  .back-to-lot-button, .sound-guide-close, .spectate-button, .spectate-close, .spectate-next,
  .utility-group > :is(.sound-guide-button, .audio-settings-button, .reset-rivals-button),
  .back-to-start-button.is-lap-invalid, .utility-group[data-menu-state="racing"] .back-to-start-button, [data-turn-navigation-action],
  .turn-race-pause-resume, .turn-race-pause-leave, .turn-visit-summary-close, .turn-update-toast-restart, .turn-update-toast-later,
  .nuke-ghosts-button, .nuke-confirm, .nuke-dialog-icon,
  .garage-shift-cancel, .garage-shift-save, .garage .garage-shift.is-active,
  .turn-yourturn-share-submit, .turn-yourturn-share-back,
  .yourturn-actions button:is(.is-primary, .is-navigation, .is-destructive, .is-game, .is-back),
  .yourturn-full-game-button, .yourturn-challenge-button.is-lap-invalid,
  .yourturn-details, .yourturn-order-1, .yourturn-order-2, .yourturn-order-3, .yourturn-order-4, .yourturn-order-5,
  .turn-dbe-training-actions button, .turn-dbe-training-race-nav button[data-training-race-restart],
  .turn-achievements-filters button[aria-pressed="true"], .turn-history-tabs button[aria-selected="true"],
  .m8-guide-disclosure > summary, .m8-dbe-guide > summary, .manual-steer,
  .drive-reverse-bubble, .drive-shift-bubble, .drive-lock-bubble,
  .turn-screen-blank-control[data-state="active"],
  /* Yellow sheet heads */
  .turn-home-sheet-head, .turn-pr-sheet-head, .turn-pr-panel-head,
  /* Pastel cards, tiles, notes and toasts */
  .turn-pr-lock-note, .garage-lock-note, .garage-secret-chip,
  .turn-dbe-training-how, .turn-dbe-training-settings, .turn-dbe-training-sound-key, .turn-dbe-training-visual-hint,
  .turn-achievements-storage-note, .turn-achievement-card.is-unlocked, .turn-achievement-icon,
  .turn-achievement-toast, .turn-trophy-reward-toast, .turn-unlock-notice, .turn-unlock-notice-icon,
  .turn-trophy-road-marker, .turn-trophy-road-highlights > article[data-trophy-reward-type],
  .turn-trophy-road-detail[data-trophy-reward-type], .turn-trophy-road-detail-close,
  .roadbook-goal:is(.is-earned, .is-gated, .is-next),
  .turn-motion-denied-kicker, .turn-yourturn-share-details,
  .chip.is-invalid-lap, .lap-result-toast.is-invalid, .score-feedback-callout
) {
  --turn-surface-page: var(--turn-paper);
  --turn-surface-raised: var(--turn-white);
  --turn-surface-bright: #ffffff;
  --turn-surface-card: #fffcf2;
  --turn-pr-card: var(--turn-surface-card);
  --turn-action-utility: var(--turn-surface-page);
  --turn-form-control-idle: var(--turn-surface-page);
  --turn-disclosure-panel: var(--turn-surface-page);
  --turn-text: var(--turn-ink);
  --turn-text-heading: var(--turn-ink);
  --turn-text-heading-muted: var(--turn-text-muted);
  --turn-text-muted: rgb(8 9 10 / 0.68);
  --turn-text-faint: rgb(8 9 10 / 0.32);
  --turn-pr-muted: var(--turn-text-muted);
  --turn-pr-faint: var(--turn-text-faint);
  color: var(--turn-ink);
}

:root[data-theme="dark"] :is(
  /* Coloured controls */
  .turn-pr-button:is(.is-primary, .is-sheet):not(.is-locked), .garage-back, .garage-step,
  .turn-home-sheet-close, .turn-pr-close, .m8-dialog-head > button,
  .install-primary, .install-close, .install-kicker, .install-step-number, .share-symbol, .install-copy-address,
  .m8-achievements-button, .turn-race-achievements-button, .turn-race-sheet .turn-race-menu > .spectate-button,
  .m8-reset-rivals, .m8-reset-cancel, .m8-reset-confirm, .m8-reset-confirm-button,
  .roadbook-rivals-reset-button, .roadbook-rivals-confirm-button,
  .back-to-lot-button, .sound-guide-close, .spectate-button, .spectate-close, .spectate-next,
  .utility-group > :is(.sound-guide-button, .audio-settings-button, .reset-rivals-button),
  .back-to-start-button.is-lap-invalid, .utility-group[data-menu-state="racing"] .back-to-start-button, [data-turn-navigation-action],
  .turn-race-pause-resume, .turn-race-pause-leave, .turn-visit-summary-close, .turn-update-toast-restart, .turn-update-toast-later,
  .nuke-ghosts-button, .nuke-confirm, .nuke-dialog-icon,
  .garage-shift-cancel, .garage-shift-save, .garage .garage-shift.is-active,
  .turn-yourturn-share-submit, .turn-yourturn-share-back,
  .yourturn-actions button:is(.is-primary, .is-navigation, .is-destructive, .is-game, .is-back),
  .yourturn-full-game-button, .yourturn-challenge-button.is-lap-invalid,
  .yourturn-details, .yourturn-order-1, .yourturn-order-2, .yourturn-order-3, .yourturn-order-4, .yourturn-order-5,
  .turn-dbe-training-actions button, .turn-dbe-training-race-nav button[data-training-race-restart],
  .turn-achievements-filters button[aria-pressed="true"], .turn-history-tabs button[aria-selected="true"],
  .m8-guide-disclosure > summary, .m8-dbe-guide > summary, .manual-steer,
  .drive-reverse-bubble, .drive-shift-bubble, .drive-lock-bubble,
  .turn-screen-blank-control[data-state="active"],
  /* Yellow sheet heads */
  .turn-home-sheet-head, .turn-pr-sheet-head, .turn-pr-panel-head,
  /* Pastel cards, tiles, notes and toasts */
  .turn-pr-lock-note, .garage-lock-note, .garage-secret-chip,
  .turn-dbe-training-how, .turn-dbe-training-settings, .turn-dbe-training-sound-key, .turn-dbe-training-visual-hint,
  .turn-achievements-storage-note, .turn-achievement-card.is-unlocked, .turn-achievement-icon,
  .turn-achievement-toast, .turn-trophy-reward-toast, .turn-unlock-notice, .turn-unlock-notice-icon,
  .turn-trophy-road-marker, .turn-trophy-road-highlights > article[data-trophy-reward-type],
  .turn-trophy-road-detail[data-trophy-reward-type], .turn-trophy-road-detail-close,
  .roadbook-goal:is(.is-earned, .is-gated, .is-next),
  .turn-motion-denied-kicker, .turn-yourturn-share-details,
  .chip.is-invalid-lap, .lap-result-toast.is-invalid, .score-feedback-callout
) * {
  --turn-outline: var(--turn-ink);
  --turn-outline-muted: var(--turn-ink);
  --turn-pr-rule: 3px solid var(--turn-ink);
}

/* Pills on a night surface (Erik): a coloured wireframe, the pill's own colour (its
   --turn-pill) on its text and border, over Ink. On a colour surface a pill keeps its
   fill, as in light. */
:root[data-theme="dark"] :is(
  .turn-pr-chip:is(.is-easy, .is-medium, .is-advanced, .is-expert, .is-common, .is-rare, .is-epic, .is-legendary, .is-mythic), .garage-perk-chip,
  .roadbook-goal-pill, .roadbook-goal-tag.is-hidden, .turn-achievement-tag:is([data-achievement-tag="hidden"], [data-achievement-tag="new"]),
  .turn-support-challenge-topline > b, .m8-guide-card-number, .m8-guide-wide > strong, .garage-car-card.is-selected .garage-car-ordinal
):not(:is(
  /* Coloured controls */
  .turn-pr-button:is(.is-primary, .is-sheet):not(.is-locked), .garage-back, .garage-step,
  .turn-home-sheet-close, .turn-pr-close, .m8-dialog-head > button,
  .install-primary, .install-close, .install-kicker, .install-step-number, .share-symbol, .install-copy-address,
  .m8-achievements-button, .turn-race-achievements-button, .turn-race-sheet .turn-race-menu > .spectate-button,
  .m8-reset-rivals, .m8-reset-cancel, .m8-reset-confirm, .m8-reset-confirm-button,
  .roadbook-rivals-reset-button, .roadbook-rivals-confirm-button,
  .back-to-lot-button, .sound-guide-close, .spectate-button, .spectate-close, .spectate-next,
  .utility-group > :is(.sound-guide-button, .audio-settings-button, .reset-rivals-button),
  .back-to-start-button.is-lap-invalid, .utility-group[data-menu-state="racing"] .back-to-start-button, [data-turn-navigation-action],
  .turn-race-pause-resume, .turn-race-pause-leave, .turn-visit-summary-close, .turn-update-toast-restart, .turn-update-toast-later,
  .nuke-ghosts-button, .nuke-confirm, .nuke-dialog-icon,
  .garage-shift-cancel, .garage-shift-save, .garage .garage-shift.is-active,
  .turn-yourturn-share-submit, .turn-yourturn-share-back,
  .yourturn-actions button:is(.is-primary, .is-navigation, .is-destructive, .is-game, .is-back),
  .yourturn-full-game-button, .yourturn-challenge-button.is-lap-invalid,
  .yourturn-details, .yourturn-order-1, .yourturn-order-2, .yourturn-order-3, .yourturn-order-4, .yourturn-order-5,
  .turn-dbe-training-actions button, .turn-dbe-training-race-nav button[data-training-race-restart],
  .turn-achievements-filters button[aria-pressed="true"], .turn-history-tabs button[aria-selected="true"],
  .m8-guide-disclosure > summary, .m8-dbe-guide > summary, .manual-steer,
  .drive-reverse-bubble, .drive-shift-bubble, .drive-lock-bubble,
  .turn-screen-blank-control[data-state="active"],
  /* Yellow sheet heads */
  .turn-home-sheet-head, .turn-pr-sheet-head, .turn-pr-panel-head,
  /* Pastel cards, tiles, notes and toasts */
  .turn-pr-lock-note, .garage-lock-note, .garage-secret-chip,
  .turn-dbe-training-how, .turn-dbe-training-settings, .turn-dbe-training-sound-key, .turn-dbe-training-visual-hint,
  .turn-achievements-storage-note, .turn-achievement-card.is-unlocked, .turn-achievement-icon,
  .turn-achievement-toast, .turn-trophy-reward-toast, .turn-unlock-notice, .turn-unlock-notice-icon,
  .turn-trophy-road-marker, .turn-trophy-road-highlights > article[data-trophy-reward-type],
  .turn-trophy-road-detail[data-trophy-reward-type], .turn-trophy-road-detail-close,
  .roadbook-goal:is(.is-earned, .is-gated, .is-next),
  .turn-motion-denied-kicker, .turn-yourturn-share-details,
  .chip.is-invalid-lap, .lap-result-toast.is-invalid, .score-feedback-callout
) *) {
  border-color: var(--turn-pill) !important;
  background: var(--turn-ink) !important;
  box-shadow: inset 0 0 0 2px var(--turn-pill) !important;
  color: var(--turn-pill) !important;
}

/* Dark drive pad (Erik's design, #1067): muted control colours with cream labels,
   cream dividers and a cream border, instead of the light pad's bright fills and Ink.
   Scoped to the pad, so GARAGE and the pre-race records keep the light control
   colours, and the REVERSE, SHIFT and LOCK bubbles beside the pad keep theirs.
   BOOST and GAS sit a shade under the design's values so cream reads at 4.5:1.
   HOW TO PLAY's picture of the pad (ui/how-to-play-demos.js) is dark the same way. */
:root[data-theme="dark"] .turn-demo-pad,
:root[data-theme="dark"] .drive-pad {
  --turn-control-drift: #327484;
  --turn-control-boost: #7f7322;
  /* BOOST fills with its charge over the night track, like the boost bar. */
  --turn-control-boost-empty: var(--turn-surface-page);
  --turn-yellow-600: #827203;
  --turn-control-gas: #477e53;
  --turn-control-brake: #7e391c;
}

/* Display P3 accents. Same OKLab lightness and hue as the sRGB values above, with
   chroma raised (up to 25%) inside the P3 gamut; contrast with ink changes by at most
   0.2 and every pair stays above WCAG AA. Pink is the exact P3 equivalent of its sRGB
   value: raised, it was far louder than every other accent.
   Paper, ink and tints stay sRGB. Role tokens inherit the upgrade through var(). */
/* Button labels are CAPS (#1269), as a presentation rule: source strings and accessible
   names keep their natural casing. Zero specificity, so a component's own casing wins.
   A button that is a card (a track, a car, a perk, a goal, a reward marker, a training
   part) holds a name and body copy, and keeps the casing of what it says; its own
   labels are capitalised where it sets them. Headings, body copy and summaries are not
   buttons and are untouched. */
:where(button, [role="button"], input:is([type="button"], [type="submit"], [type="reset"]), a.turn-pr-button) {
  text-transform: uppercase;
}

:where(
  .turn-pr-card, .garage-car-card, .garage-perk-card, .garage-disclosure-toggle,
  .roadbook-goal, .turn-trophy-road-marker, .turn-trophy-road-highlights > article, .turn-achievement-toast,
  .turn-dbe-training-dialog li > button[data-training-stage]
) {
  text-transform: none;
}

@media (color-gamut: p3) {
  @supports (color: color(display-p3 1 1 1)) {
    :root {
      --turn-pink-500: color(display-p3 0.852 0.4 0.623);
      --turn-blue-500: color(display-p3 0.391 0.843 0.999);
      --turn-yellow-400: color(display-p3 0.998 0.831 0.168);
      --turn-yellow-600: color(display-p3 0.985 0.742 0.073);
      --turn-green-500: color(display-p3 0.581 0.924 0.583);
      --turn-orange-500: color(display-p3 0.995 0.456 0.275);
      --turn-red-500: color(display-p3 0.994 0.385 0.384);
      --turn-violet-200: color(display-p3 0.816 0.749 1);
      --turn-control-precision: color(display-p3 0.64 0.38 1);
    }
  }
}
