/* Copyright text placeholder, Warner Bros. Discovery, Inc. */

/**
 * *** DO NOT EDIT THIS FILE DIRECTLY ***
 *
 * This file is generated by @wbd/dwt-style-dictionary using @wbd/design-systems package
 * Any modification applied to this file will be lost.
 */

.border-tokens {
  /**
   * Used for large corner radius on elements where action is emphasized.
   */
  --border-corner-action-lg-bp-01: 8px;
  /**
   * Used for medium corner radius on elements where action is emphasized.
   */
  --border-corner-action-md-bp-01: 4px;
  /**
   * Used for small corner radius on elements where action is emphasized.
   */
  --border-corner-action-sm-bp-01: 2px;
  /**
   * Corner radius token for the top-left of the tile badge
   */
  --border-corner-component-badge-anchor-bp-01: 0px;
  /**
   * Corner radius token for the bottom-left and top-right of the tile badge
   */
  --border-corner-component-badge-edge-bp-01: 0px;
  /**
   * Corner radius token for the bottom-right of the tile badge
   */
  --border-corner-component-badge-standard-bp-01: 2px;
  /**
   * Border token used for button (small size)
   */
  --border-corner-component-button-small-bp-01: 8px;
  /**
   * Border token used for button (standard size)
   */
  --border-corner-component-button-standard-bp-01: 8px;
  /**
   * Border token used for utility buttons
   */
  --border-corner-component-button-utility-bp-01: 999px;
  /**
   * Corner radius used on cards
   */
  --border-corner-component-card-standard-bp-01: 8px;
  /**
   * Corner radius token used for checkbox.
   */
  --border-corner-component-checkbox-bp-01: 4px;
  /**
   * Corner radius for the standard chip item
   */
  --border-corner-component-chip-standard-bp-01: 999px;
  /**
   * Corner radius for the suggestion chip item
   */
  --border-corner-component-chip-suggestion-bp-01: 999px;
  /**
   * (WeMo only) Used for the corner radii for the backplate of in-field action buttons.
   */
  --border-corner-component-input-field-action-bp-01: 4px;
  /**
   * Corner radius token used for pagination Indicators (pagination dots)
   */
  --border-corner-component-pagination-indicator-bp-01: 999px;
  /**
   * Corner radius token used for rows
   */
  --border-corner-component-row-bp-01: 8px;
  /**
   * Corner radius token for tile standard
   */
  --border-corner-component-tile-standard-bp-01: 0px;
  /**
   * Corner radius token used on toggle (container and thumb)
   */
  --border-corner-component-toggle-bp-01: 999px;
  /**
   * Used for containers with a fully rounded corner.
   */
  --border-corner-general-full-bp-01: 999px;
  /**
   * Used for containers with a large rounded corner radius.
   */
  --border-corner-general-lg-bp-01: 8px;
  /**
   * Used for containers with a medium rounded corner radius.
   */
  --border-corner-general-md-bp-01: 4px;
  /**
   * Used for containers with no corner radius.
   */
  --border-corner-general-none-bp-01: 0px;
  /**
   * Used for containers with a small rounded corner radius.
   */
  --border-corner-general-sm-bp-01: 2px;
  /**
   * Used for small corner radius on indicator elements.
   */
  --border-corner-indicator-sm-bp-01: 2px;
  /**
   * Used for corner radius of all text input fields.
   */
  --border-corner-input-standard-bp-01: 4px;
  /**
   * Used for medium borders on action components.
   */
  --border-stroke-action-md-bp-01: 1.5px;
  /**
   * Used for small borders on action components.
   */
  --border-stroke-action-sm-bp-01: 1px;
  /**
   * Stroke token used for button progress ring
   */
  --border-stroke-component-button-progress-ring-bp-01: 3px;
  /**
   * Stroke token used for base state of quiet button
   */
  --border-stroke-component-button-quiet-base-bp-01: 0px;
  /**
   * Stroke token used for hover state of quiet button
   */
  --border-stroke-component-button-quiet-hover-bp-01: 0px;
  /**
   * Border stroke for selected standard chip item
   */
  --border-stroke-component-chip-selected-bp-01: 1px;
  /**
   * Border stroke for unselected standard chip item
   */
  --border-stroke-component-chip-unselected-bp-01: 0px;
  /**
   * Inner focus ring stroke token for the medium variant
   */
  --border-stroke-component-focus-ring-md-inner-bp-01: 2px;
  /**
   * Outer focus ring stroke token for the medium variant
   */
  --border-stroke-component-focus-ring-md-outer-bp-01: 4.5px;
  /**
   * Inner focus ring stroke token for the small variant
   */
  --border-stroke-component-focus-ring-sm-inner-bp-01: 1px;
  /**
   * Outer focus ring stroke token for the small variant
   */
  --border-stroke-component-focus-ring-sm-outer-bp-01: 1.5px;
  /**
   * Used for large general borders.
   */
  --border-stroke-general-lg-bp-01: 2px;
  /**
   * Used for medium general borders
   */
  --border-stroke-general-md-bp-01: 1.5px;
  /**
   * Used for scenarios where a stroke must be provided, but none should be displayed.
   */
  --border-stroke-general-none-bp-01: 0px;
  /**
   * Used for small general borders.
   */
  --border-stroke-general-sm-bp-01: 1px;
  /**
   * Used for medium borders on indicator components.
   */
  --border-stroke-indicator-md-bp-01: 2px;
  /**
   * Used for small borders on indicator components.
   */
  --border-stroke-indicator-sm-bp-01: 1px;
  /**
   * Used for emphasized border widths on input components, typically for hover and focus states.
   */
  --border-stroke-input-emphasis-bp-01: 1.5px;
  /**
   * Used for heavily emphasized border widths on input components, such as active text fields.
   */
  --border-stroke-input-emphasis-plus-bp-01: 3px;
  /**
   * Used for standard border widths on input components.
   */
  --border-stroke-input-regular-bp-01: 1px;
  /**
   * Used for borders on some overlays.
   */
  --border-stroke-surface-overlay-bp-01: 0px;
  /**
   * Used for indicating progress within a component. 
   */
  --border-stroke-utility-progress-bp-01: 2px;
}

/* Copyright text placeholder, Warner Bros. Discovery, Inc. */

/**
 * *** DO NOT EDIT THIS FILE DIRECTLY ***
 *
 * This file is generated by @wbd/dwt-style-dictionary using @wbd/design-systems package
 * Any modification applied to this file will be lost.
 */

.border-tokens {
  /**
   * Used for large corner radius on elements where action is emphasized.
   */
  --border-corner-action-lg-bp-02: 8px;
  /**
   * Used for medium corner radius on elements where action is emphasized.
   */
  --border-corner-action-md-bp-02: 4px;
  /**
   * Used for small corner radius on elements where action is emphasized.
   */
  --border-corner-action-sm-bp-02: 2px;
  /**
   * Corner radius token for the top-left of the tile badge
   */
  --border-corner-component-badge-anchor-bp-02: 0px;
  /**
   * Corner radius token for the bottom-left and top-right of the tile badge
   */
  --border-corner-component-badge-edge-bp-02: 0px;
  /**
   * Corner radius token for the bottom-right of the tile badge
   */
  --border-corner-component-badge-standard-bp-02: 2px;
  /**
   * Border token used for button (small size)
   */
  --border-corner-component-button-small-bp-02: 8px;
  /**
   * Border token used for button (standard size)
   */
  --border-corner-component-button-standard-bp-02: 8px;
  /**
   * Border token used for utility buttons
   */
  --border-corner-component-button-utility-bp-02: 999px;
  /**
   * Corner radius used on cards
   */
  --border-corner-component-card-standard-bp-02: 8px;
  /**
   * Corner radius token used for checkbox.
   */
  --border-corner-component-checkbox-bp-02: 4px;
  /**
   * Corner radius for the standard chip item
   */
  --border-corner-component-chip-standard-bp-02: 999px;
  /**
   * Corner radius for the suggestion chip item
   */
  --border-corner-component-chip-suggestion-bp-02: 999px;
  /**
   * (WeMo only) Used for the corner radii for the backplate of in-field action buttons.
   */
  --border-corner-component-input-field-action-bp-02: 4px;
  /**
   * Corner radius token used for pagination Indicators (pagination dots)
   */
  --border-corner-component-pagination-indicator-bp-02: 999px;
  /**
   * Corner radius token used for rows
   */
  --border-corner-component-row-bp-02: 8px;
  /**
   * Corner radius token for tile standard
   */
  --border-corner-component-tile-standard-bp-02: 0px;
  /**
   * Corner radius token used on toggle (container and thumb)
   */
  --border-corner-component-toggle-bp-02: 999px;
  /**
   * Used for containers with a fully rounded corner.
   */
  --border-corner-general-full-bp-02: 999px;
  /**
   * Used for containers with a large rounded corner radius.
   */
  --border-corner-general-lg-bp-02: 8px;
  /**
   * Used for containers with a medium rounded corner radius.
   */
  --border-corner-general-md-bp-02: 4px;
  /**
   * Used for containers with no corner radius.
   */
  --border-corner-general-none-bp-02: 0px;
  /**
   * Used for containers with a small rounded corner radius.
   */
  --border-corner-general-sm-bp-02: 2px;
  /**
   * Used for small corner radius on indicator elements.
   */
  --border-corner-indicator-sm-bp-02: 2px;
  /**
   * Used for corner radius of all text input fields.
   */
  --border-corner-input-standard-bp-02: 4px;
  /**
   * Used for medium borders on action components.
   */
  --border-stroke-action-md-bp-02: 1.5px;
  /**
   * Used for small borders on action components.
   */
  --border-stroke-action-sm-bp-02: 1px;
  /**
   * Stroke token used for button progress ring
   */
  --border-stroke-component-button-progress-ring-bp-02: 3px;
  /**
   * Stroke token used for base state of quiet button
   */
  --border-stroke-component-button-quiet-base-bp-02: 0px;
  /**
   * Stroke token used for hover state of quiet button
   */
  --border-stroke-component-button-quiet-hover-bp-02: 0px;
  /**
   * Border stroke for selected standard chip item
   */
  --border-stroke-component-chip-selected-bp-02: 1px;
  /**
   * Border stroke for unselected standard chip item
   */
  --border-stroke-component-chip-unselected-bp-02: 0px;
  /**
   * Inner focus ring stroke token for the medium variant
   */
  --border-stroke-component-focus-ring-md-inner-bp-02: 2px;
  /**
   * Outer focus ring stroke token for the medium variant
   */
  --border-stroke-component-focus-ring-md-outer-bp-02: 4.5px;
  /**
   * Inner focus ring stroke token for the small variant
   */
  --border-stroke-component-focus-ring-sm-inner-bp-02: 1px;
  /**
   * Outer focus ring stroke token for the small variant
   */
  --border-stroke-component-focus-ring-sm-outer-bp-02: 1.5px;
  /**
   * Used for large general borders.
   */
  --border-stroke-general-lg-bp-02: 2px;
  /**
   * Used for medium general borders
   */
  --border-stroke-general-md-bp-02: 1.5px;
  /**
   * Used for scenarios where a stroke must be provided, but none should be displayed.
   */
  --border-stroke-general-none-bp-02: 0px;
  /**
   * Used for small general borders.
   */
  --border-stroke-general-sm-bp-02: 1px;
  /**
   * Used for medium borders on indicator components.
   */
  --border-stroke-indicator-md-bp-02: 2px;
  /**
   * Used for small borders on indicator components.
   */
  --border-stroke-indicator-sm-bp-02: 1px;
  /**
   * Used for emphasized border widths on input components, typically for hover and focus states.
   */
  --border-stroke-input-emphasis-bp-02: 1.5px;
  /**
   * Used for heavily emphasized border widths on input components, such as active text fields.
   */
  --border-stroke-input-emphasis-plus-bp-02: 3px;
  /**
   * Used for standard border widths on input components.
   */
  --border-stroke-input-regular-bp-02: 1px;
  /**
   * Used for borders on some overlays.
   */
  --border-stroke-surface-overlay-bp-02: 0px;
  /**
   * Used for indicating progress within a component. 
   */
  --border-stroke-utility-progress-bp-02: 2px;
}

/* Copyright text placeholder, Warner Bros. Discovery, Inc. */

/**
 * *** DO NOT EDIT THIS FILE DIRECTLY ***
 *
 * This file is generated by @wbd/dwt-style-dictionary using @wbd/design-systems package
 * Any modification applied to this file will be lost.
 */

.border-tokens {
  /**
   * Used for large corner radius on elements where action is emphasized.
   */
  --border-corner-action-lg-bp-03: 8px;
  /**
   * Used for medium corner radius on elements where action is emphasized.
   */
  --border-corner-action-md-bp-03: 4px;
  /**
   * Used for small corner radius on elements where action is emphasized.
   */
  --border-corner-action-sm-bp-03: 2px;
  /**
   * Corner radius token for the top-left of the tile badge
   */
  --border-corner-component-badge-anchor-bp-03: 0px;
  /**
   * Corner radius token for the bottom-left and top-right of the tile badge
   */
  --border-corner-component-badge-edge-bp-03: 0px;
  /**
   * Corner radius token for the bottom-right of the tile badge
   */
  --border-corner-component-badge-standard-bp-03: 2px;
  /**
   * Border token used for button (small size)
   */
  --border-corner-component-button-small-bp-03: 8px;
  /**
   * Border token used for button (standard size)
   */
  --border-corner-component-button-standard-bp-03: 8px;
  /**
   * Border token used for utility buttons
   */
  --border-corner-component-button-utility-bp-03: 999px;
  /**
   * Corner radius used on cards
   */
  --border-corner-component-card-standard-bp-03: 8px;
  /**
   * Corner radius token used for checkbox.
   */
  --border-corner-component-checkbox-bp-03: 4px;
  /**
   * Corner radius for the standard chip item
   */
  --border-corner-component-chip-standard-bp-03: 999px;
  /**
   * Corner radius for the suggestion chip item
   */
  --border-corner-component-chip-suggestion-bp-03: 999px;
  /**
   * (WeMo only) Used for the corner radii for the backplate of in-field action buttons.
   */
  --border-corner-component-input-field-action-bp-03: 4px;
  /**
   * Corner radius token used for pagination Indicators (pagination dots)
   */
  --border-corner-component-pagination-indicator-bp-03: 999px;
  /**
   * Corner radius token used for rows
   */
  --border-corner-component-row-bp-03: 8px;
  /**
   * Corner radius token for tile standard
   */
  --border-corner-component-tile-standard-bp-03: 0px;
  /**
   * Corner radius token used on toggle (container and thumb)
   */
  --border-corner-component-toggle-bp-03: 999px;
  /**
   * Used for containers with a fully rounded corner.
   */
  --border-corner-general-full-bp-03: 999px;
  /**
   * Used for containers with a large rounded corner radius.
   */
  --border-corner-general-lg-bp-03: 8px;
  /**
   * Used for containers with a medium rounded corner radius.
   */
  --border-corner-general-md-bp-03: 4px;
  /**
   * Used for containers with no corner radius.
   */
  --border-corner-general-none-bp-03: 0px;
  /**
   * Used for containers with a small rounded corner radius.
   */
  --border-corner-general-sm-bp-03: 2px;
  /**
   * Used for small corner radius on indicator elements.
   */
  --border-corner-indicator-sm-bp-03: 2px;
  /**
   * Used for corner radius of all text input fields.
   */
  --border-corner-input-standard-bp-03: 4px;
  /**
   * Used for medium borders on action components.
   */
  --border-stroke-action-md-bp-03: 1.5px;
  /**
   * Used for small borders on action components.
   */
  --border-stroke-action-sm-bp-03: 1px;
  /**
   * Stroke token used for button progress ring
   */
  --border-stroke-component-button-progress-ring-bp-03: 3px;
  /**
   * Stroke token used for base state of quiet button
   */
  --border-stroke-component-button-quiet-base-bp-03: 0px;
  /**
   * Stroke token used for hover state of quiet button
   */
  --border-stroke-component-button-quiet-hover-bp-03: 0px;
  /**
   * Border stroke for selected standard chip item
   */
  --border-stroke-component-chip-selected-bp-03: 1px;
  /**
   * Border stroke for unselected standard chip item
   */
  --border-stroke-component-chip-unselected-bp-03: 0px;
  /**
   * Inner focus ring stroke token for the medium variant
   */
  --border-stroke-component-focus-ring-md-inner-bp-03: 2px;
  /**
   * Outer focus ring stroke token for the medium variant
   */
  --border-stroke-component-focus-ring-md-outer-bp-03: 4.5px;
  /**
   * Inner focus ring stroke token for the small variant
   */
  --border-stroke-component-focus-ring-sm-inner-bp-03: 1px;
  /**
   * Outer focus ring stroke token for the small variant
   */
  --border-stroke-component-focus-ring-sm-outer-bp-03: 1.5px;
  /**
   * Used for large general borders.
   */
  --border-stroke-general-lg-bp-03: 2px;
  /**
   * Used for medium general borders
   */
  --border-stroke-general-md-bp-03: 1.5px;
  /**
   * Used for scenarios where a stroke must be provided, but none should be displayed.
   */
  --border-stroke-general-none-bp-03: 0px;
  /**
   * Used for small general borders.
   */
  --border-stroke-general-sm-bp-03: 1px;
  /**
   * Used for medium borders on indicator components.
   */
  --border-stroke-indicator-md-bp-03: 2px;
  /**
   * Used for small borders on indicator components.
   */
  --border-stroke-indicator-sm-bp-03: 1px;
  /**
   * Used for emphasized border widths on input components, typically for hover and focus states.
   */
  --border-stroke-input-emphasis-bp-03: 1.5px;
  /**
   * Used for heavily emphasized border widths on input components, such as active text fields.
   */
  --border-stroke-input-emphasis-plus-bp-03: 3px;
  /**
   * Used for standard border widths on input components.
   */
  --border-stroke-input-regular-bp-03: 1px;
  /**
   * Used for borders on some overlays.
   */
  --border-stroke-surface-overlay-bp-03: 0px;
  /**
   * Used for indicating progress within a component. 
   */
  --border-stroke-utility-progress-bp-03: 2px;
}

/* Copyright text placeholder, Warner Bros. Discovery, Inc. */

/**
 * *** DO NOT EDIT THIS FILE DIRECTLY ***
 *
 * This file is generated by @wbd/dwt-style-dictionary using @wbd/design-systems package
 * Any modification applied to this file will be lost.
 */

.border-tokens {
  /**
   * Used for large corner radius on elements where action is emphasized.
   */
  --border-corner-action-lg-bp-04: 8px;
  /**
   * Used for medium corner radius on elements where action is emphasized.
   */
  --border-corner-action-md-bp-04: 4px;
  /**
   * Used for small corner radius on elements where action is emphasized.
   */
  --border-corner-action-sm-bp-04: 2px;
  /**
   * Corner radius token for the top-left of the tile badge
   */
  --border-corner-component-badge-anchor-bp-04: 0px;
  /**
   * Corner radius token for the bottom-left and top-right of the tile badge
   */
  --border-corner-component-badge-edge-bp-04: 0px;
  /**
   * Corner radius token for the bottom-right of the tile badge
   */
  --border-corner-component-badge-standard-bp-04: 2px;
  /**
   * Border token used for button (small size)
   */
  --border-corner-component-button-small-bp-04: 8px;
  /**
   * Border token used for button (standard size)
   */
  --border-corner-component-button-standard-bp-04: 8px;
  /**
   * Border token used for utility buttons
   */
  --border-corner-component-button-utility-bp-04: 999px;
  /**
   * Corner radius used on cards
   */
  --border-corner-component-card-standard-bp-04: 8px;
  /**
   * Corner radius token used for checkbox.
   */
  --border-corner-component-checkbox-bp-04: 4px;
  /**
   * Corner radius for the standard chip item
   */
  --border-corner-component-chip-standard-bp-04: 999px;
  /**
   * Corner radius for the suggestion chip item
   */
  --border-corner-component-chip-suggestion-bp-04: 999px;
  /**
   * (WeMo only) Used for the corner radii for the backplate of in-field action buttons.
   */
  --border-corner-component-input-field-action-bp-04: 4px;
  /**
   * Corner radius token used for pagination Indicators (pagination dots)
   */
  --border-corner-component-pagination-indicator-bp-04: 999px;
  /**
   * Corner radius token used for rows
   */
  --border-corner-component-row-bp-04: 8px;
  /**
   * Corner radius token for tile standard
   */
  --border-corner-component-tile-standard-bp-04: 0px;
  /**
   * Corner radius token used on toggle (container and thumb)
   */
  --border-corner-component-toggle-bp-04: 999px;
  /**
   * Used for containers with a fully rounded corner.
   */
  --border-corner-general-full-bp-04: 999px;
  /**
   * Used for containers with a large rounded corner radius.
   */
  --border-corner-general-lg-bp-04: 8px;
  /**
   * Used for containers with a medium rounded corner radius.
   */
  --border-corner-general-md-bp-04: 4px;
  /**
   * Used for containers with no corner radius.
   */
  --border-corner-general-none-bp-04: 0px;
  /**
   * Used for containers with a small rounded corner radius.
   */
  --border-corner-general-sm-bp-04: 2px;
  /**
   * Used for small corner radius on indicator elements.
   */
  --border-corner-indicator-sm-bp-04: 2px;
  /**
   * Used for corner radius of all text input fields.
   */
  --border-corner-input-standard-bp-04: 4px;
  /**
   * Used for medium borders on action components.
   */
  --border-stroke-action-md-bp-04: 1.5px;
  /**
   * Used for small borders on action components.
   */
  --border-stroke-action-sm-bp-04: 1px;
  /**
   * Stroke token used for button progress ring
   */
  --border-stroke-component-button-progress-ring-bp-04: 3px;
  /**
   * Stroke token used for base state of quiet button
   */
  --border-stroke-component-button-quiet-base-bp-04: 0px;
  /**
   * Stroke token used for hover state of quiet button
   */
  --border-stroke-component-button-quiet-hover-bp-04: 0px;
  /**
   * Border stroke for selected standard chip item
   */
  --border-stroke-component-chip-selected-bp-04: 1px;
  /**
   * Border stroke for unselected standard chip item
   */
  --border-stroke-component-chip-unselected-bp-04: 0px;
  /**
   * Inner focus ring stroke token for the medium variant
   */
  --border-stroke-component-focus-ring-md-inner-bp-04: 2px;
  /**
   * Outer focus ring stroke token for the medium variant
   */
  --border-stroke-component-focus-ring-md-outer-bp-04: 4.5px;
  /**
   * Inner focus ring stroke token for the small variant
   */
  --border-stroke-component-focus-ring-sm-inner-bp-04: 1px;
  /**
   * Outer focus ring stroke token for the small variant
   */
  --border-stroke-component-focus-ring-sm-outer-bp-04: 1.5px;
  /**
   * Used for large general borders.
   */
  --border-stroke-general-lg-bp-04: 2px;
  /**
   * Used for medium general borders
   */
  --border-stroke-general-md-bp-04: 1.5px;
  /**
   * Used for scenarios where a stroke must be provided, but none should be displayed.
   */
  --border-stroke-general-none-bp-04: 0px;
  /**
   * Used for small general borders.
   */
  --border-stroke-general-sm-bp-04: 1px;
  /**
   * Used for medium borders on indicator components.
   */
  --border-stroke-indicator-md-bp-04: 2px;
  /**
   * Used for small borders on indicator components.
   */
  --border-stroke-indicator-sm-bp-04: 1px;
  /**
   * Used for emphasized border widths on input components, typically for hover and focus states.
   */
  --border-stroke-input-emphasis-bp-04: 1.5px;
  /**
   * Used for heavily emphasized border widths on input components, such as active text fields.
   */
  --border-stroke-input-emphasis-plus-bp-04: 3px;
  /**
   * Used for standard border widths on input components.
   */
  --border-stroke-input-regular-bp-04: 1px;
  /**
   * Used for borders on some overlays.
   */
  --border-stroke-surface-overlay-bp-04: 0px;
  /**
   * Used for indicating progress within a component. 
   */
  --border-stroke-utility-progress-bp-04: 2px;
}

/* Copyright text placeholder, Warner Bros. Discovery, Inc. */

/**
 * *** DO NOT EDIT THIS FILE DIRECTLY ***
 *
 * This file is generated by @wbd/dwt-style-dictionary using @wbd/design-systems package
 * Any modification applied to this file will be lost.
 */

.border-tokens {
  /**
   * Used for large corner radius on elements where action is emphasized.
   */
  --border-corner-action-lg-bp-05: 8px;
  /**
   * Used for medium corner radius on elements where action is emphasized.
   */
  --border-corner-action-md-bp-05: 4px;
  /**
   * Used for small corner radius on elements where action is emphasized.
   */
  --border-corner-action-sm-bp-05: 2px;
  /**
   * Corner radius token for the top-left of the tile badge
   */
  --border-corner-component-badge-anchor-bp-05: 0px;
  /**
   * Corner radius token for the bottom-left and top-right of the tile badge
   */
  --border-corner-component-badge-edge-bp-05: 0px;
  /**
   * Corner radius token for the bottom-right of the tile badge
   */
  --border-corner-component-badge-standard-bp-05: 2px;
  /**
   * Border token used for button (small size)
   */
  --border-corner-component-button-small-bp-05: 8px;
  /**
   * Border token used for button (standard size)
   */
  --border-corner-component-button-standard-bp-05: 8px;
  /**
   * Border token used for utility buttons
   */
  --border-corner-component-button-utility-bp-05: 999px;
  /**
   * Corner radius used on cards
   */
  --border-corner-component-card-standard-bp-05: 8px;
  /**
   * Corner radius token used for checkbox.
   */
  --border-corner-component-checkbox-bp-05: 4px;
  /**
   * Corner radius for the standard chip item
   */
  --border-corner-component-chip-standard-bp-05: 999px;
  /**
   * Corner radius for the suggestion chip item
   */
  --border-corner-component-chip-suggestion-bp-05: 999px;
  /**
   * (WeMo only) Used for the corner radii for the backplate of in-field action buttons.
   */
  --border-corner-component-input-field-action-bp-05: 4px;
  /**
   * Corner radius token used for pagination Indicators (pagination dots)
   */
  --border-corner-component-pagination-indicator-bp-05: 999px;
  /**
   * Corner radius token used for rows
   */
  --border-corner-component-row-bp-05: 8px;
  /**
   * Corner radius token for tile standard
   */
  --border-corner-component-tile-standard-bp-05: 0px;
  /**
   * Corner radius token used on toggle (container and thumb)
   */
  --border-corner-component-toggle-bp-05: 999px;
  /**
   * Used for containers with a fully rounded corner.
   */
  --border-corner-general-full-bp-05: 999px;
  /**
   * Used for containers with a large rounded corner radius.
   */
  --border-corner-general-lg-bp-05: 8px;
  /**
   * Used for containers with a medium rounded corner radius.
   */
  --border-corner-general-md-bp-05: 4px;
  /**
   * Used for containers with no corner radius.
   */
  --border-corner-general-none-bp-05: 0px;
  /**
   * Used for containers with a small rounded corner radius.
   */
  --border-corner-general-sm-bp-05: 2px;
  /**
   * Used for small corner radius on indicator elements.
   */
  --border-corner-indicator-sm-bp-05: 2px;
  /**
   * Used for corner radius of all text input fields.
   */
  --border-corner-input-standard-bp-05: 4px;
  /**
   * Used for medium borders on action components.
   */
  --border-stroke-action-md-bp-05: 1.5px;
  /**
   * Used for small borders on action components.
   */
  --border-stroke-action-sm-bp-05: 1px;
  /**
   * Stroke token used for button progress ring
   */
  --border-stroke-component-button-progress-ring-bp-05: 3px;
  /**
   * Stroke token used for base state of quiet button
   */
  --border-stroke-component-button-quiet-base-bp-05: 0px;
  /**
   * Stroke token used for hover state of quiet button
   */
  --border-stroke-component-button-quiet-hover-bp-05: 0px;
  /**
   * Border stroke for selected standard chip item
   */
  --border-stroke-component-chip-selected-bp-05: 1px;
  /**
   * Border stroke for unselected standard chip item
   */
  --border-stroke-component-chip-unselected-bp-05: 0px;
  /**
   * Inner focus ring stroke token for the medium variant
   */
  --border-stroke-component-focus-ring-md-inner-bp-05: 2px;
  /**
   * Outer focus ring stroke token for the medium variant
   */
  --border-stroke-component-focus-ring-md-outer-bp-05: 4.5px;
  /**
   * Inner focus ring stroke token for the small variant
   */
  --border-stroke-component-focus-ring-sm-inner-bp-05: 1px;
  /**
   * Outer focus ring stroke token for the small variant
   */
  --border-stroke-component-focus-ring-sm-outer-bp-05: 1.5px;
  /**
   * Used for large general borders.
   */
  --border-stroke-general-lg-bp-05: 2px;
  /**
   * Used for medium general borders
   */
  --border-stroke-general-md-bp-05: 1.5px;
  /**
   * Used for scenarios where a stroke must be provided, but none should be displayed.
   */
  --border-stroke-general-none-bp-05: 0px;
  /**
   * Used for small general borders.
   */
  --border-stroke-general-sm-bp-05: 1px;
  /**
   * Used for medium borders on indicator components.
   */
  --border-stroke-indicator-md-bp-05: 2px;
  /**
   * Used for small borders on indicator components.
   */
  --border-stroke-indicator-sm-bp-05: 1px;
  /**
   * Used for emphasized border widths on input components, typically for hover and focus states.
   */
  --border-stroke-input-emphasis-bp-05: 1.5px;
  /**
   * Used for heavily emphasized border widths on input components, such as active text fields.
   */
  --border-stroke-input-emphasis-plus-bp-05: 3px;
  /**
   * Used for standard border widths on input components.
   */
  --border-stroke-input-regular-bp-05: 1px;
  /**
   * Used for borders on some overlays.
   */
  --border-stroke-surface-overlay-bp-05: 0px;
  /**
   * Used for indicating progress within a component. 
   */
  --border-stroke-utility-progress-bp-05: 2px;
}

/* Copyright text placeholder, Warner Bros. Discovery, Inc. */

/**
 * *** DO NOT EDIT THIS FILE DIRECTLY ***
 *
 * This file is generated by @wbd/dwt-style-dictionary using @wbd/design-systems package
 * Any modification applied to this file will be lost.
 */

.border-tokens {
  /**
   * Used for large corner radius on elements where action is emphasized.
   */
  --border-corner-action-lg-bp-06: 8px;
  /**
   * Used for medium corner radius on elements where action is emphasized.
   */
  --border-corner-action-md-bp-06: 4px;
  /**
   * Used for small corner radius on elements where action is emphasized.
   */
  --border-corner-action-sm-bp-06: 2px;
  /**
   * Corner radius token for the top-left of the tile badge
   */
  --border-corner-component-badge-anchor-bp-06: 0px;
  /**
   * Corner radius token for the bottom-left and top-right of the tile badge
   */
  --border-corner-component-badge-edge-bp-06: 0px;
  /**
   * Corner radius token for the bottom-right of the tile badge
   */
  --border-corner-component-badge-standard-bp-06: 2px;
  /**
   * Border token used for button (small size)
   */
  --border-corner-component-button-small-bp-06: 8px;
  /**
   * Border token used for button (standard size)
   */
  --border-corner-component-button-standard-bp-06: 8px;
  /**
   * Border token used for utility buttons
   */
  --border-corner-component-button-utility-bp-06: 999px;
  /**
   * Corner radius used on cards
   */
  --border-corner-component-card-standard-bp-06: 8px;
  /**
   * Corner radius token used for checkbox.
   */
  --border-corner-component-checkbox-bp-06: 4px;
  /**
   * Corner radius for the standard chip item
   */
  --border-corner-component-chip-standard-bp-06: 999px;
  /**
   * Corner radius for the suggestion chip item
   */
  --border-corner-component-chip-suggestion-bp-06: 999px;
  /**
   * (WeMo only) Used for the corner radii for the backplate of in-field action buttons.
   */
  --border-corner-component-input-field-action-bp-06: 4px;
  /**
   * Corner radius token used for pagination Indicators (pagination dots)
   */
  --border-corner-component-pagination-indicator-bp-06: 999px;
  /**
   * Corner radius token used for rows
   */
  --border-corner-component-row-bp-06: 8px;
  /**
   * Corner radius token for tile standard
   */
  --border-corner-component-tile-standard-bp-06: 0px;
  /**
   * Corner radius token used on toggle (container and thumb)
   */
  --border-corner-component-toggle-bp-06: 999px;
  /**
   * Used for containers with a fully rounded corner.
   */
  --border-corner-general-full-bp-06: 999px;
  /**
   * Used for containers with a large rounded corner radius.
   */
  --border-corner-general-lg-bp-06: 8px;
  /**
   * Used for containers with a medium rounded corner radius.
   */
  --border-corner-general-md-bp-06: 4px;
  /**
   * Used for containers with no corner radius.
   */
  --border-corner-general-none-bp-06: 0px;
  /**
   * Used for containers with a small rounded corner radius.
   */
  --border-corner-general-sm-bp-06: 2px;
  /**
   * Used for small corner radius on indicator elements.
   */
  --border-corner-indicator-sm-bp-06: 2px;
  /**
   * Used for corner radius of all text input fields.
   */
  --border-corner-input-standard-bp-06: 4px;
  /**
   * Used for medium borders on action components.
   */
  --border-stroke-action-md-bp-06: 1.5px;
  /**
   * Used for small borders on action components.
   */
  --border-stroke-action-sm-bp-06: 1px;
  /**
   * Stroke token used for button progress ring
   */
  --border-stroke-component-button-progress-ring-bp-06: 3px;
  /**
   * Stroke token used for base state of quiet button
   */
  --border-stroke-component-button-quiet-base-bp-06: 0px;
  /**
   * Stroke token used for hover state of quiet button
   */
  --border-stroke-component-button-quiet-hover-bp-06: 0px;
  /**
   * Border stroke for selected standard chip item
   */
  --border-stroke-component-chip-selected-bp-06: 1px;
  /**
   * Border stroke for unselected standard chip item
   */
  --border-stroke-component-chip-unselected-bp-06: 0px;
  /**
   * Inner focus ring stroke token for the medium variant
   */
  --border-stroke-component-focus-ring-md-inner-bp-06: 2px;
  /**
   * Outer focus ring stroke token for the medium variant
   */
  --border-stroke-component-focus-ring-md-outer-bp-06: 4.5px;
  /**
   * Inner focus ring stroke token for the small variant
   */
  --border-stroke-component-focus-ring-sm-inner-bp-06: 1px;
  /**
   * Outer focus ring stroke token for the small variant
   */
  --border-stroke-component-focus-ring-sm-outer-bp-06: 1.5px;
  /**
   * Used for large general borders.
   */
  --border-stroke-general-lg-bp-06: 2px;
  /**
   * Used for medium general borders
   */
  --border-stroke-general-md-bp-06: 1.5px;
  /**
   * Used for scenarios where a stroke must be provided, but none should be displayed.
   */
  --border-stroke-general-none-bp-06: 0px;
  /**
   * Used for small general borders.
   */
  --border-stroke-general-sm-bp-06: 1px;
  /**
   * Used for medium borders on indicator components.
   */
  --border-stroke-indicator-md-bp-06: 2px;
  /**
   * Used for small borders on indicator components.
   */
  --border-stroke-indicator-sm-bp-06: 1px;
  /**
   * Used for emphasized border widths on input components, typically for hover and focus states.
   */
  --border-stroke-input-emphasis-bp-06: 1.5px;
  /**
   * Used for heavily emphasized border widths on input components, such as active text fields.
   */
  --border-stroke-input-emphasis-plus-bp-06: 3px;
  /**
   * Used for standard border widths on input components.
   */
  --border-stroke-input-regular-bp-06: 1px;
  /**
   * Used for borders on some overlays.
   */
  --border-stroke-surface-overlay-bp-06: 0px;
  /**
   * Used for indicating progress within a component. 
   */
  --border-stroke-utility-progress-bp-06: 2px;
}

/* Copyright text placeholder, Warner Bros. Discovery, Inc. */

/**
 * *** DO NOT EDIT THIS FILE DIRECTLY ***
 *
 * This file is generated by @wbd/dwt-style-dictionary using @wbd/design-systems package
 * Any modification applied to this file will be lost.
 */

.border-tokens {
  /**
   * Used for large corner radius on elements where action is emphasized.
   */
  --border-corner-action-lg-bp-07: 8px;
  /**
   * Used for medium corner radius on elements where action is emphasized.
   */
  --border-corner-action-md-bp-07: 4px;
  /**
   * Used for small corner radius on elements where action is emphasized.
   */
  --border-corner-action-sm-bp-07: 2px;
  /**
   * Corner radius token for the top-left of the tile badge
   */
  --border-corner-component-badge-anchor-bp-07: 0px;
  /**
   * Corner radius token for the bottom-left and top-right of the tile badge
   */
  --border-corner-component-badge-edge-bp-07: 0px;
  /**
   * Corner radius token for the bottom-right of the tile badge
   */
  --border-corner-component-badge-standard-bp-07: 2px;
  /**
   * Border token used for button (small size)
   */
  --border-corner-component-button-small-bp-07: 8px;
  /**
   * Border token used for button (standard size)
   */
  --border-corner-component-button-standard-bp-07: 8px;
  /**
   * Border token used for utility buttons
   */
  --border-corner-component-button-utility-bp-07: 999px;
  /**
   * Corner radius used on cards
   */
  --border-corner-component-card-standard-bp-07: 8px;
  /**
   * Corner radius token used for checkbox.
   */
  --border-corner-component-checkbox-bp-07: 4px;
  /**
   * Corner radius for the standard chip item
   */
  --border-corner-component-chip-standard-bp-07: 999px;
  /**
   * Corner radius for the suggestion chip item
   */
  --border-corner-component-chip-suggestion-bp-07: 999px;
  /**
   * (WeMo only) Used for the corner radii for the backplate of in-field action buttons.
   */
  --border-corner-component-input-field-action-bp-07: 4px;
  /**
   * Corner radius token used for pagination Indicators (pagination dots)
   */
  --border-corner-component-pagination-indicator-bp-07: 999px;
  /**
   * Corner radius token used for rows
   */
  --border-corner-component-row-bp-07: 8px;
  /**
   * Corner radius token for tile standard
   */
  --border-corner-component-tile-standard-bp-07: 0px;
  /**
   * Corner radius token used on toggle (container and thumb)
   */
  --border-corner-component-toggle-bp-07: 999px;
  /**
   * Used for containers with a fully rounded corner.
   */
  --border-corner-general-full-bp-07: 999px;
  /**
   * Used for containers with a large rounded corner radius.
   */
  --border-corner-general-lg-bp-07: 8px;
  /**
   * Used for containers with a medium rounded corner radius.
   */
  --border-corner-general-md-bp-07: 4px;
  /**
   * Used for containers with no corner radius.
   */
  --border-corner-general-none-bp-07: 0px;
  /**
   * Used for containers with a small rounded corner radius.
   */
  --border-corner-general-sm-bp-07: 2px;
  /**
   * Used for small corner radius on indicator elements.
   */
  --border-corner-indicator-sm-bp-07: 2px;
  /**
   * Used for corner radius of all text input fields.
   */
  --border-corner-input-standard-bp-07: 4px;
  /**
   * Used for medium borders on action components.
   */
  --border-stroke-action-md-bp-07: 1.5px;
  /**
   * Used for small borders on action components.
   */
  --border-stroke-action-sm-bp-07: 1px;
  /**
   * Stroke token used for button progress ring
   */
  --border-stroke-component-button-progress-ring-bp-07: 3px;
  /**
   * Stroke token used for base state of quiet button
   */
  --border-stroke-component-button-quiet-base-bp-07: 0px;
  /**
   * Stroke token used for hover state of quiet button
   */
  --border-stroke-component-button-quiet-hover-bp-07: 0px;
  /**
   * Border stroke for selected standard chip item
   */
  --border-stroke-component-chip-selected-bp-07: 1px;
  /**
   * Border stroke for unselected standard chip item
   */
  --border-stroke-component-chip-unselected-bp-07: 0px;
  /**
   * Inner focus ring stroke token for the medium variant
   */
  --border-stroke-component-focus-ring-md-inner-bp-07: 2px;
  /**
   * Outer focus ring stroke token for the medium variant
   */
  --border-stroke-component-focus-ring-md-outer-bp-07: 4.5px;
  /**
   * Inner focus ring stroke token for the small variant
   */
  --border-stroke-component-focus-ring-sm-inner-bp-07: 1px;
  /**
   * Outer focus ring stroke token for the small variant
   */
  --border-stroke-component-focus-ring-sm-outer-bp-07: 1.5px;
  /**
   * Used for large general borders.
   */
  --border-stroke-general-lg-bp-07: 2px;
  /**
   * Used for medium general borders
   */
  --border-stroke-general-md-bp-07: 1.5px;
  /**
   * Used for scenarios where a stroke must be provided, but none should be displayed.
   */
  --border-stroke-general-none-bp-07: 0px;
  /**
   * Used for small general borders.
   */
  --border-stroke-general-sm-bp-07: 1px;
  /**
   * Used for medium borders on indicator components.
   */
  --border-stroke-indicator-md-bp-07: 2px;
  /**
   * Used for small borders on indicator components.
   */
  --border-stroke-indicator-sm-bp-07: 1px;
  /**
   * Used for emphasized border widths on input components, typically for hover and focus states.
   */
  --border-stroke-input-emphasis-bp-07: 1.5px;
  /**
   * Used for heavily emphasized border widths on input components, such as active text fields.
   */
  --border-stroke-input-emphasis-plus-bp-07: 3px;
  /**
   * Used for standard border widths on input components.
   */
  --border-stroke-input-regular-bp-07: 1px;
  /**
   * Used for borders on some overlays.
   */
  --border-stroke-surface-overlay-bp-07: 0px;
  /**
   * Used for indicating progress within a component. 
   */
  --border-stroke-utility-progress-bp-07: 2px;
}

/**
 * // Copyright text placeholder, Warner Bros. Discovery, Inc.

 * 
  // ***DO NOT EDIT THIS FILE DIRECTLY***
  // This file is generated by @wbd/dwt-style-dictionary using @wbd/design-systems package
  // Any modification applied to this file will be lost.

 */

:root {
  --color_action_link_inverse_text_base: rgb(36, 98, 152);
  --color_action_link_inverse_text_hover: rgb(80, 143, 195);
  --color_action_link_inverse_text_press: rgb(79, 118, 149);
  --color_action_link_text_base: rgb(113, 184, 242);
  --color_action_link_text_hover: rgb(128, 198, 255);
  --color_action_link_text_press: rgb(80, 143, 195);
  --color_action_neutral_border_high: rgb(255, 255, 255);
  --color_action_neutral_border_mid: rgb(221, 221, 221);
  --color_action_neutral_border_selected: rgba(255, 255, 255, 0.5);
  --color_action_neutral_fill_high: rgba(255, 255, 255, 0.13);
  --color_action_neutral_fill_low: rgba(221, 221, 221, 0.06);
  --color_action_neutral_fill_mid: rgba(221, 221, 221, 0.1);
  --color_action_neutral_fill_selected: rgba(74, 74, 74, 0.85);
  --color_action_neutral_text_high: rgb(255, 255, 255);
  --color_action_neutral_text_low: rgba(255, 255, 255, 0.65);
  --color_action_neutral_text_mid: rgba(255, 255, 255, 0.8);
  --color_action_primary_fill_high: rgb(255, 255, 255);
  --color_action_primary_fill_low: rgba(255, 255, 255, 0.8);
  --color_action_primary_fill_mid: rgb(221, 221, 221);
  --color_action_primary_text: rgb(0, 0, 0);
  --color_action_secondary_fill_high: rgba(74, 74, 74, 0.85);
  --color_action_secondary_fill_low: rgba(62, 62, 62, 0.45);
  --color_action_secondary_fill_mid: rgba(62, 62, 62, 0.75);
  --color_action_secondary_fill_selected: rgba(74, 74, 74, 0.85);
  --color_action_secondary_text: rgb(255, 255, 255);
  --color_card_border_high: rgb(255, 255, 255);
  --color_card_border_low: rgba(255, 255, 255, 0.5);
  --color_card_border_mid: rgba(221, 221, 221, 0.8);
  --color_card_border_selected: rgb(221, 221, 221);
  --color_card_neutral_fill_high: rgba(255, 255, 255, 0.13);
  --color_card_neutral_fill_low: rgba(221, 221, 221, 0.06);
  --color_card_neutral_fill_mid: rgba(221, 221, 221, 0.1);
  --color_card_primary_fill_high: rgba(221, 221, 221, 0.1);
  --color_card_primary_fill_low: rgba(221, 221, 221, 0.06);
  --color_card_primary_fill_mid: rgba(36, 36, 36, 0.7);
  --color_component_badge_rating_fill: rgba(0, 0, 0, 0);
  --color_component_button_ghost_fill_base: rgba(0, 0, 0, 0);
  --color_component_button_ghost_fill_focus: rgb(245, 245, 247);
  --color_component_button_ghost_fill_hover: rgba(62, 62, 62, 0.75);
  --color_component_button_ghost_fill_press: rgba(62, 62, 62, 0.45);
  --color_component_button_ghost_inverse_fill_base: rgba(0, 0, 0, 0);
  --color_component_button_ghost_inverse_fill_focus: rgba(0, 0, 0, 0.9);
  --color_component_button_ghost_inverse_fill_hover: rgba(15, 15, 15, 0.08);
  --color_component_button_ghost_inverse_fill_press: rgba(163, 163, 163, 0.75);
  --color_component_button_ghost_inverse_text_base: rgb(0, 0, 0);
  --color_component_button_ghost_inverse_text_focus: rgb(255, 255, 255);
  --color_component_button_ghost_inverse_text_hover: rgb(0, 0, 0);
  --color_component_button_ghost_inverse_text_press: rgba(0, 0, 0, 0.9);
  --color_component_button_ghost_text_base: rgb(255, 255, 255);
  --color_component_button_ghost_text_focus: rgb(0, 0, 0);
  --color_component_button_ghost_text_hover: rgb(255, 255, 255);
  --color_component_button_ghost_text_press: rgb(255, 255, 255);
  --color_component_button_loud_fill_base: rgb(221, 221, 221);
  --color_component_button_loud_fill_hover: rgb(255, 255, 255);
  --color_component_button_loud_fill_press: rgba(255, 255, 255, 0.8);
  --color_component_button_loud_player_fill_base: rgb(221, 221, 221);
  --color_component_button_loud_player_fill_hover: rgb(255, 255, 255);
  --color_component_button_loud_player_fill_press: rgba(255, 255, 255, 0.8);
  --color_component_button_loud_player_progress_fill_time: rgb(0, 0, 0);
  --color_component_button_loud_player_progress_track_time: rgba(0, 0, 0, 0.2);
  --color_component_button_loud_player_text_base: rgb(0, 0, 0);
  --color_component_button_loud_player_text_hover: rgb(0, 0, 0);
  --color_component_button_loud_player_text_press: rgb(0, 0, 0);
  --color_component_button_loud_progress_fill_basic: rgb(0, 0, 0);
  --color_component_button_loud_progress_fill_live: rgb(186, 35, 108);
  --color_component_button_loud_progress_fill_time: rgb(0, 0, 0);
  --color_component_button_loud_progress_track_basic: rgba(0, 0, 0, 0.2);
  --color_component_button_loud_progress_track_live: rgba(0, 0, 0, 0.2);
  --color_component_button_loud_progress_track_time: rgba(0, 0, 0, 0.2);
  --color_component_button_loud_text_base: rgb(0, 0, 0);
  --color_component_button_loud_text_hover: rgb(0, 0, 0);
  --color_component_button_loud_text_press: rgb(0, 0, 0);
  --color_component_button_quiet_border_base: rgba(0, 0, 0, 0);
  --color_component_button_quiet_border_hover: rgba(0, 0, 0, 0);
  --color_component_button_quiet_border_press: rgba(0, 0, 0, 0);
  --color_component_button_quiet_fill_base: rgba(62, 62, 62, 0.75);
  --color_component_button_quiet_fill_focus: rgb(245, 245, 247);
  --color_component_button_quiet_fill_hover: rgba(74, 74, 74, 0.85);
  --color_component_button_quiet_fill_press: rgba(62, 62, 62, 0.45);
  --color_component_button_quiet_inverse_border_base: rgba(0, 0, 0, 0);
  --color_component_button_quiet_inverse_border_hover: rgba(0, 0, 0, 0);
  --color_component_button_quiet_inverse_border_press: rgba(0, 0, 0, 0);
  --color_component_button_quiet_inverse_fill_base: rgba(15, 15, 15, 0.08);
  --color_component_button_quiet_inverse_fill_focus: rgba(0, 0, 0, 0.9);
  --color_component_button_quiet_inverse_fill_hover: rgba(189, 189, 189, 0.75);
  --color_component_button_quiet_inverse_fill_press: rgba(163, 163, 163, 0.75);
  --color_component_button_quiet_inverse_text_base: rgb(0, 0, 0);
  --color_component_button_quiet_inverse_text_focus: rgb(255, 255, 255);
  --color_component_button_quiet_inverse_text_hover: rgb(0, 0, 0);
  --color_component_button_quiet_inverse_text_press: rgba(0, 0, 0, 0.9);
  --color_component_button_quiet_player_border_base: rgba(0, 0, 0, 0);
  --color_component_button_quiet_player_border_hover: rgba(0, 0, 0, 0);
  --color_component_button_quiet_player_border_press: rgba(0, 0, 0, 0);
  --color_component_button_quiet_player_fill_base: rgba(62, 62, 62, 0.75);
  --color_component_button_quiet_player_fill_focus: rgb(245, 245, 247);
  --color_component_button_quiet_player_fill_hover: rgba(74, 74, 74, 0.85);
  --color_component_button_quiet_player_fill_press: rgba(62, 62, 62, 0.45);
  --color_component_button_quiet_player_progress_fill_time_base: rgb(255, 255, 255);
  --color_component_button_quiet_player_progress_fill_time_focus: rgb(0, 0, 0);
  --color_component_button_quiet_player_progress_track_time_base: rgba(255, 255, 255, 0.3);
  --color_component_button_quiet_player_progress_track_time_focus: rgba(0, 0, 0, 0.3);
  --color_component_button_quiet_player_text_base: rgb(255, 255, 255);
  --color_component_button_quiet_player_text_focus: rgb(0, 0, 0);
  --color_component_button_quiet_player_text_hover: rgb(255, 255, 255);
  --color_component_button_quiet_player_text_press: rgb(255, 255, 255);
  --color_component_button_quiet_progress_fill_basic_base: rgb(255, 255, 255);
  --color_component_button_quiet_progress_fill_basic_focus: rgb(0, 0, 0);
  --color_component_button_quiet_progress_fill_live_base: rgb(186, 35, 108);
  --color_component_button_quiet_progress_fill_live_focus: rgb(186, 35, 108);
  --color_component_button_quiet_progress_fill_time_base: rgb(255, 255, 255);
  --color_component_button_quiet_progress_fill_time_focus: rgb(0, 0, 0);
  --color_component_button_quiet_progress_track_basic_base: rgba(255, 255, 255, 0.3);
  --color_component_button_quiet_progress_track_basic_focus: rgba(0, 0, 0, 0.3);
  --color_component_button_quiet_progress_track_live_base: rgba(255, 255, 255, 0.3);
  --color_component_button_quiet_progress_track_live_focus: rgba(0, 0, 0, 0.3);
  --color_component_button_quiet_progress_track_time_base: rgba(255, 255, 255, 0.3);
  --color_component_button_quiet_progress_track_time_focus: rgba(0, 0, 0, 0.3);
  --color_component_button_quiet_text_base: rgb(255, 255, 255);
  --color_component_button_quiet_text_focus: rgb(0, 0, 0);
  --color_component_button_quiet_text_hover: rgb(255, 255, 255);
  --color_component_button_quiet_text_press: rgb(255, 255, 255);
  --color_component_button_utility_overlay_fill_base: rgba(0, 0, 0, 0.7);
  --color_component_button_utility_overlay_fill_hover: rgba(0, 0, 0, 0.8);
  --color_component_button_utility_overlay_fill_press: rgba(0, 0, 0, 0.6);
  --color_component_button_utility_overlay_text_base: rgba(255, 255, 255, 0.65);
  --color_component_button_utility_overlay_text_hover: rgb(255, 255, 255);
  --color_component_button_utility_overlay_text_press: rgb(255, 255, 255);
  --color_component_card_border_unselected_base: rgba(0, 0, 0, 0);
  --color_component_chip_border_focus: rgba(0, 0, 0, 0);
  --color_component_chip_border_hover: rgba(0, 0, 0, 0);
  --color_component_chip_border_press: rgba(0, 0, 0, 0);
  --color_component_chip_border_selected_base: rgba(255, 255, 255, 0.5);
  --color_component_chip_border_unselected_base: rgba(0, 0, 0, 0);
  --color_component_chip_fill_focus: rgb(245, 245, 247);
  --color_component_chip_fill_hover: rgb(255, 255, 255);
  --color_component_chip_fill_press: rgba(255, 255, 255, 0.8);
  --color_component_chip_fill_selected_base: rgba(0, 0, 0, 0);
  --color_component_chip_fill_unselected_base: rgba(0, 0, 0, 0);
  --color_component_chip_stacked_fill_selected_base: rgba(74, 74, 74, 0.85);
  --color_component_chip_stacked_fill_unselected_base: rgba(0, 0, 0, 0);
  --color_component_chip_stacked_text_selected_base: rgb(255, 255, 255);
  --color_component_chip_stacked_text_unselected_base: rgba(255, 255, 255, 0.8);
  --color_component_chip_suggestion_border_selected_base: rgba(0, 0, 0, 0);
  --color_component_chip_suggestion_border_unselected_base: rgba(0, 0, 0, 0);
  --color_component_chip_suggestion_fill_selected_base: rgba(74, 74, 74, 0.85);
  --color_component_chip_suggestion_fill_unselected_base: rgba(255, 255, 255, 0.13);
  --color_component_chip_suggestion_text_selected_base: rgb(255, 255, 255);
  --color_component_chip_suggestion_text_unselected_base: rgba(255, 255, 255, 0.8);
  --color_component_chip_text_focus: rgb(0, 0, 0);
  --color_component_chip_text_hover: rgb(0, 0, 0);
  --color_component_chip_text_press: rgb(0, 0, 0);
  --color_component_chip_text_selected_base: rgb(255, 255, 255);
  --color_component_chip_text_unselected_base: rgba(255, 255, 255, 0.8);
  --color_component_inline_message_error_border: rgba(255, 109, 100, 0);
  --color_component_inline_message_error_fill: rgba(255, 76, 76, 0.15);
  --color_component_inline_message_error_text: rgb(255, 109, 100);
  --color_component_inline_message_info_border: rgba(255, 255, 255, 0.13);
  --color_component_inline_message_info_fill: rgb(69, 91, 115);
  --color_component_inline_message_info_text: rgb(255, 255, 255);
  --color_component_input_field_action_active_fill: rgba(255, 255, 255, 0.08);
  --color_component_input_field_action_basic_fill: rgba(255, 255, 255, 0.08);
  --color_component_input_field_active_border: rgb(80, 143, 195);
  --color_component_input_option_backplate_fill_focus: rgb(245, 245, 247);
  --color_component_input_option_backplate_fill_press: rgba(245, 245, 247, 0.8);
  --color_component_input_option_border_error_focus: rgb(185, 34, 88);
  --color_component_input_option_border_selected_focus: rgb(80, 143, 195);
  --color_component_input_option_border_unselected_focus: rgba(0, 0, 0, 0.5);
  --color_component_input_option_fill_selected_focus: rgb(80, 143, 195);
  --color_component_input_option_indicator_selected_focus: rgb(255, 255, 255);
  --color_component_input_option_indicator_unselected_focus: rgb(255, 255, 255);
  --color_component_input_option_text_error_focus: rgb(185, 34, 88);
  --color_component_input_option_text_focus: rgb(0, 0, 0);
  --color_component_list_item_progress_fill_basic: rgb(255, 255, 255);
  --color_component_list_item_progress_fill_live: rgb(186, 35, 108);
  --color_component_list_item_progress_track_basic: rgba(255, 255, 255, 0.3);
  --color_component_list_item_progress_track_live: rgba(255, 255, 255, 0.3);
  --color_component_row_fill_focus: rgb(245, 245, 247);
  --color_component_row_fill_press: rgba(245, 245, 247, 0.8);
  --color_component_row_inline_message_error_border_focus: rgb(185, 34, 88);
  --color_component_row_inline_message_error_fill_focus: rgba(255, 76, 76, 0.15);
  --color_component_row_inline_message_error_text_focus: rgb(185, 34, 88);
  --color_component_row_inline_message_info_border_focus: rgb(69, 91, 115);
  --color_component_row_inline_message_info_fill_focus: rgba(79, 105, 132, 0.15);
  --color_component_row_inline_message_info_text_focus: rgb(0, 0, 0);
  --color_component_row_input_neutral_border_low_focus: rgb(140, 140, 140);
  --color_component_row_input_neutral_border_unselected_focus: rgba(0, 0, 0, 0.5);
  --color_component_row_input_neutral_fill_low_focus: rgba(102, 102, 102, 0.5);
  --color_component_row_input_neutral_indicator_focus: rgb(255, 255, 255);
  --color_component_row_input_primary_border_selected_focus: rgb(80, 143, 195);
  --color_component_row_input_primary_option_fill_selected_focus: rgb(80, 143, 195);
  --color_component_row_input_primary_option_indicator_focus: rgb(255, 255, 255);
  --color_component_row_rating_border_focus: rgba(0, 0, 0, 0.3);
  --color_component_row_rating_fill_focus: rgb(232, 232, 232);
  --color_component_row_rating_text_focus: rgb(0, 0, 0);
  --color_component_row_text_high_focus: rgb(0, 0, 0);
  --color_component_row_text_mid_focus: rgba(0, 0, 0, 0.8);
  --color_component_row_toggle_indicator_icon_focus: rgb(46, 63, 77);
  --color_component_sheet_grabber_fill: rgba(255, 255, 255, 0.65);
  --color_component_tile_overlay_press: rgba(0, 0, 0, 0.2);
  --color_component_tile_progress_fill_basic: rgb(255, 255, 255);
  --color_component_tile_progress_fill_live: rgb(186, 35, 108);
  --color_component_tile_progress_track_basic: rgba(74, 74, 74, 0.85);
  --color_component_tile_progress_track_live: rgba(74, 74, 74, 0.85);
  --color_component_toggle_border_unselected_focus: rgb(140, 140, 140);
  --color_component_toggle_fill_unselected_focus: rgba(102, 102, 102, 0.5);
  --color_component_toggle_indicator_icon: rgb(46, 63, 77);
  --color_component_toggle_indicator_icon_focus: rgb(46, 63, 77);
  --color_general_border_error: rgb(255, 109, 100);
  --color_general_border_low: rgba(255, 255, 255, 0.8);
  --color_general_border_lowest: rgba(255, 255, 255, 0.3);
  --color_general_border_mid: rgb(221, 221, 221);
  --color_general_inverse_border_error: rgb(185, 34, 88);
  --color_general_inverse_border_low: rgba(0, 0, 0, 0.8);
  --color_general_inverse_border_lowest: rgba(0, 0, 0, 0.3);
  --color_general_inverse_border_mid: rgb(15, 15, 15);
  --color_general_inverse_text_error: rgb(185, 34, 88);
  --color_general_inverse_text_high: rgb(0, 0, 0);
  --color_general_inverse_text_low: rgba(0, 0, 0, 0.65);
  --color_general_inverse_text_mid: rgba(0, 0, 0, 0.8);
  --color_general_text_error: rgb(255, 109, 100);
  --color_general_text_high: rgb(255, 255, 255);
  --color_general_text_low: rgba(255, 255, 255, 0.65);
  --color_general_text_mid: rgba(255, 255, 255, 0.8);
  --color_general_transparent: rgba(0, 0, 0, 0);
  --color_indicator_access_fill_high: rgb(0, 0, 0);
  --color_indicator_access_fill_low: rgba(0, 0, 0, 0.7);
  --color_indicator_access_text: rgb(255, 255, 255);
  --color_indicator_ad_fill: rgb(250, 255, 17);
  --color_indicator_ad_text: rgb(0, 0, 0);
  --color_indicator_award_fill_low: rgba(0, 0, 0, 0.7);
  --color_indicator_award_text: rgb(221, 191, 132);
  --color_indicator_commerce_primary_fill: rgb(113, 184, 242);
  --color_indicator_commerce_primary_text: rgb(0, 0, 0);
  --color_indicator_commerce_secondary_fill: rgb(19, 19, 21);
  --color_indicator_commerce_secondary_text: rgb(128, 198, 255);
  --color_indicator_commerce_tertiary_fill: rgb(57, 64, 74);
  --color_indicator_commerce_tertiary_text: rgb(216, 217, 219);
  --color_indicator_live_fill: rgb(186, 35, 108);
  --color_indicator_live_text: rgb(255, 255, 255);
  --color_indicator_neutral_border_high: rgb(255, 255, 255);
  --color_indicator_neutral_border_low: rgba(255, 255, 255, 0.13);
  --color_indicator_neutral_fill_low: rgba(0, 0, 0, 0.7);
  --color_indicator_neutral_fill_mid: rgba(255, 255, 255, 0.13);
  --color_indicator_neutral_text: rgb(255, 255, 255);
  --color_indicator_player_fill: rgb(255, 255, 255);
  --color_indicator_player_text: rgb(0, 0, 0);
  --color_indicator_primary_fill: rgb(255, 255, 255);
  --color_indicator_primary_text: rgb(0, 0, 0);
  --color_indicator_secondary_fill: rgb(46, 63, 77);
  --color_indicator_secondary_text_low: rgba(255, 255, 255, 0.8);
  --color_indicator_secondary_text_mid: rgb(255, 255, 255);
  --color_indicator_social_fill_low: rgba(0, 0, 0, 0.7);
  --color_indicator_social_text: rgb(255, 255, 255);
  --color_indicator_special_use_fill_low: rgba(0, 0, 0, 0.7);
  --color_indicator_special_use_text: rgb(255, 255, 255);
  --color_indicator_sport_fill: rgb(140, 255, 63);
  --color_indicator_sport_text: rgb(0, 0, 0);
  --color_indicator_tune_in_fill_low: rgba(0, 0, 0, 0.7);
  --color_indicator_tune_in_text: rgb(191, 194, 212);
  --color_indicator_upsell_fill_low: rgba(0, 0, 0, 0.7);
  --color_indicator_upsell_text: rgb(221, 191, 132);
  --color_input_neutral_border_low: rgb(140, 140, 140);
  --color_input_neutral_border_unselected: rgba(255, 255, 255, 0.8);
  --color_input_neutral_fill_high: rgba(18, 18, 18, 0.7);
  --color_input_neutral_fill_low: rgba(74, 74, 74, 0.5);
  --color_input_neutral_fill_mid: rgba(0, 0, 0, 0.2);
  --color_input_neutral_indicator: rgb(245, 245, 247);
  --color_input_neutral_inverse_border_low: rgb(140, 140, 140);
  --color_input_neutral_inverse_border_unselected: rgba(0, 0, 0, 0.5);
  --color_input_neutral_inverse_fill_high: rgba(255, 255, 255, 0.3);
  --color_input_neutral_inverse_fill_low: rgba(102, 102, 102, 0.5);
  --color_input_neutral_inverse_fill_mid: rgba(255, 255, 255, 0.05);
  --color_input_neutral_inverse_indicator: rgb(255, 255, 255);
  --color_input_neutral_inverse_text_high: rgb(0, 0, 0);
  --color_input_neutral_inverse_text_low: rgba(0, 0, 0, 0.65);
  --color_input_neutral_text_high: rgb(255, 255, 255);
  --color_input_neutral_text_low: rgba(255, 255, 255, 0.65);
  --color_input_primary_border_selected: rgb(80, 143, 195);
  --color_input_primary_fill_high: rgba(25, 25, 25, 0.8);
  --color_input_primary_inverse_border_selected: rgb(80, 143, 195);
  --color_input_primary_inverse_fill_high: rgba(255, 255, 255, 0.8);
  --color_input_primary_inverse_option_fill_selected: rgb(80, 143, 195);
  --color_input_primary_inverse_option_indicator: rgb(255, 255, 255);
  --color_input_primary_inverse_text_high: rgb(0, 0, 0);
  --color_input_primary_inverse_text_low: rgba(0, 0, 0, 0.65);
  --color_input_primary_option_fill_selected: rgb(80, 143, 195);
  --color_input_primary_option_indicator: rgb(255, 255, 255);
  --color_input_primary_text_high: rgb(255, 255, 255);
  --color_input_primary_text_low: rgba(255, 255, 255, 0.65);
  --color_input_spotlight: rgba(255, 255, 255, 0.08);
  --color_scrim_low: rgba(0, 0, 0, 0.4);
  --color_scrim_mid: rgba(0, 0, 0, 0.7);
  --color_surface_border_high: rgb(87, 87, 87);
  --color_surface_border_mid: rgb(40, 40, 40);
  --color_surface_high: rgb(25, 25, 25);
  --color_surface_inverse_border_high: rgb(255, 255, 255);
  --color_surface_inverse_border_mid: rgb(188, 188, 188);
  --color_surface_inverse_high: rgb(248, 248, 248);
  --color_surface_inverse_low: rgb(221, 221, 221);
  --color_surface_inverse_mid: rgb(232, 232, 232);
  --color_surface_inverse_opacity_low: rgba(255, 255, 255, 0.9);
  --color_surface_low: rgb(0, 0, 0);
  --color_surface_mid: rgb(15, 15, 15);
  --color_surface_opacity_high: rgba(25, 25, 25, 0.85);
  --color_surface_opacity_low: rgba(0, 0, 0, 0.9);
  --color_tile_fill_focus: rgba(18, 18, 18, 0.7);
  --color_tile_fill_high: rgba(62, 62, 62, 0.75);
  --color_tile_fill_low: rgba(36, 36, 36, 0.7);
  --color_tile_fill_mid: rgba(36, 36, 36, 0.88);
  --color_tile_neutral_border_low: rgba(255, 255, 255, 0.15);
  --color_tile_neutral_fill_high: rgba(0, 0, 0, 0.7);
  --color_tile_neutral_fill_low: rgba(15, 15, 15, 0.6);
  --color_tile_neutral_fill_mid: rgba(19, 19, 21, 0.8);
  --color_utility_commerce_accent_text: rgb(172, 213, 245);
  --color_utility_error_border_low: rgba(255, 109, 100, 0);
  --color_utility_error_border_mid: rgb(255, 109, 100);
  --color_utility_error_fill: rgba(255, 76, 76, 0.15);
  --color_utility_error_text_link_base: rgb(255, 255, 255);
  --color_utility_error_text_link_hover: rgba(255, 255, 255, 0.8);
  --color_utility_error_text_mid: rgb(255, 109, 100);
  --color_utility_focus_border_inner: rgb(0, 0, 0);
  --color_utility_focus_border_outer: rgb(255, 255, 255);
  --color_utility_focus_ctv_fill_focus: rgb(245, 245, 247);
  --color_utility_focus_ctv_fill_press: rgba(245, 245, 247, 0.8);
  --color_utility_focus_ctv_text: rgb(0, 0, 0);
  --color_utility_focus_inverse_border_inner: rgb(255, 255, 255);
  --color_utility_focus_inverse_border_outer: rgb(0, 0, 0);
  --color_utility_focus_inverse_ctv_fill_focus: rgba(0, 0, 0, 0.9);
  --color_utility_focus_inverse_ctv_fill_press: rgba(15, 15, 15, 0.75);
  --color_utility_focus_inverse_ctv_text: rgb(255, 255, 255);
  --color_utility_info_border_low: rgba(255, 255, 255, 0.13);
  --color_utility_info_border_mid: rgb(69, 91, 115);
  --color_utility_info_fill: rgb(69, 91, 115);
  --color_utility_info_text_link_base: rgb(172, 216, 252);
  --color_utility_info_text_link_hover: rgba(172, 216, 252, 0.8);
  --color_utility_info_text_mid: rgb(255, 255, 255);
  --color_utility_player_indicator: rgb(255, 255, 255);
  --color_utility_player_progress_fill_current: rgba(255, 255, 255, 0.6);
  --color_utility_player_progress_fill_elapsed: rgba(255, 255, 255, 0.3);
  --color_utility_player_progress_track: rgba(255, 255, 255, 0.3);
  --color_utility_progress_fill_high: rgb(255, 255, 255);
  --color_utility_progress_fill_low: rgba(74, 74, 74, 0.5);
  --color_utility_progress_fill_mid: rgba(255, 255, 255, 0.4);
  --color_utility_progress_inverse_fill_high: rgb(0, 0, 0);
  --color_utility_progress_inverse_fill_low: rgba(74, 74, 74, 0.5);
  --color_utility_skeleton_fill_high: rgb(65, 65, 65);
  --color_utility_skeleton_fill_low: rgba(25, 25, 25, 0.8);
  --color_utility_skeleton_fill_mid: rgba(65, 65, 65, 0.6);
}

/* Copyright text placeholder, Warner Bros. Discovery, Inc. */

/**
 * *** DO NOT EDIT THIS FILE DIRECTLY ***
 *
 * This file is generated by @wbd/dwt-style-dictionary using @wbd/design-systems package
 * Any modification applied to this file will be lost.
 */

.spacer-tokens {
  --spacer-size-icon-action-jumbo-bp-01: 40px;
  --spacer-size-icon-action-lg-bp-01: 24px;
  --spacer-size-icon-action-md-bp-01: 20px;
  --spacer-size-icon-action-sm-bp-01: 16px;
  --spacer-size-icon-action-xs-bp-01: 12px;
  --spacer-size-icon-badge-bp-01: 10px;
  /**
   * Used on list Tiles for icons indicating unentitled content.
   */
  --spacer-size-icon-component-tile-access-list-bp-01: 20px;
  /**
   * Icon size token for access item (banner icon) icon on tile
   */
  --spacer-size-icon-component-tile-access-standard-bp-01: 20px;
  /**
   * Used on list Tiles for icons indicating unentitled content.
   */
  --spacer-size-icon-component-tile-action-list-bp-01: 20px;
  /**
   * Icon size token for action (play) icon on tile
   */
  --spacer-size-icon-component-tile-action-standard-bp-01: 20px;
  --spacer-size-icon-inline-bp-01: 16px;
  --spacer-size-icon-message-lg-bp-01: 24px;
  --spacer-size-icon-message-md-bp-01: 20px;
  /**
   * Used for pictogram ratings in Info Block and CDP components.
   */
  --spacer-size-icon-rating-md-bp-01: 19px;
  /**
   * Used for pictogram ratings in Tiles and List Item Accordion.
   */
  --spacer-size-icon-rating-sm-bp-01: 15px;
  /**
   * Use for the min-height of elements
   */
  --spacer-size-min-height-2-xs-bp-01: 16px;
  /**
   * Use for the min-height of elements
   */
  --spacer-size-min-height-lg-bp-01: 64px;
  /**
   * Use for the min-height of elements
   */
  --spacer-size-min-height-md-bp-01: 48px;
  /**
   * Use for the min-height of elements
   */
  --spacer-size-min-height-sm-bp-01: 40px;
  /**
   * Use for the min-height of elements
   */
  --spacer-size-min-height-xs-bp-01: 32px;
  --spacer-space-grid-gutter-bp-01: 10px;
  --spacer-space-grid-page-margin-bp-01: 20px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-far-lg-bp-01: 24px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-far-md-bp-01: 20px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-far-sm-bp-01: 8px;
  /**
   * Use for horizontal spacing between elements in a layout
   */
  --spacer-space-horizontal-far-xl-bp-01: 48px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-far-xs-bp-01: 6px;
  /**
   * Use for horizontal spacing between elements in a layout
   */
  --spacer-space-horizontal-near-lg-bp-01: 20px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-near-md-bp-01: 12px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-near-sm-bp-01: 4px;
  /**
   * Use for horizontal spacing between elements in a layout
   */
  --spacer-space-horizontal-near-xl-bp-01: 24px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-near-xs-bp-01: 2px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-none-bp-01: 0px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-large-ample-bp-01: 48px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-large-dense-bp-01: 20px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-large-regular-bp-01: 24px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-large-spacious-bp-01: 32px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-medium-dense-bp-01: 8px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-medium-regular-bp-01: 12px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-medium-spacious-bp-01: 16px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-none-bp-01: 0px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-small-dense-bp-01: 1px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-small-regular-bp-01: 2px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-small-spacious-bp-01: 4px;
  /**
   * Use for vertical spacing between elements in a layout
   */
  --spacer-space-vertical-far-2-xl-bp-01: 48px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-far-lg-bp-01: 24px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-far-md-bp-01: 16px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-far-sm-bp-01: 12px;
  /**
   * Use for vertical spacing between elements in a layout
   */
  --spacer-space-vertical-far-xl-bp-01: 32px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-far-xs-bp-01: 6px;
  /**
   * Use for vertical spacing between elements in a layout
   */
  --spacer-space-vertical-near-lg-bp-01: 12px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-near-md-bp-01: 8px;
  --spacer-space-vertical-near-sm-bp-01: 4px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-near-xl-bp-01: 16px;
  /**
   * Use for vertical spacing (gap) between objects in elements. (was stack/2xs)
   */
  --spacer-space-vertical-near-xs-bp-01: 2px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-none-bp-01: 0px;
  /**
   * Use this spacer vertically between components in a page layout. This is the compact vertical spacing between sections.
   */
  --spacer-space-vertical-page-compact-bp-01: 20px;
  /**
   * Use this vertical spacer at the bottom of each page (before the footer on web) below all components on the page.
   */
  --spacer-space-vertical-page-end-bp-01: 100px;
  /**
   * Use this spacer vertically between components in a page layout. This is the standard vertical spacing between elements.
   */
  --spacer-space-vertical-page-standard-bp-01: 20px;
}

/* Copyright text placeholder, Warner Bros. Discovery, Inc. */

/**
 * *** DO NOT EDIT THIS FILE DIRECTLY ***
 *
 * This file is generated by @wbd/dwt-style-dictionary using @wbd/design-systems package
 * Any modification applied to this file will be lost.
 */

.spacer-tokens {
  --spacer-size-icon-action-jumbo-bp-02: 40px;
  --spacer-size-icon-action-lg-bp-02: 24px;
  --spacer-size-icon-action-md-bp-02: 20px;
  --spacer-size-icon-action-sm-bp-02: 16px;
  --spacer-size-icon-action-xs-bp-02: 12px;
  --spacer-size-icon-badge-bp-02: 10px;
  /**
   * Used on list Tiles for icons indicating unentitled content.
   */
  --spacer-size-icon-component-tile-access-list-bp-02: 20px;
  /**
   * Icon size token for access item (banner icon) icon on tile
   */
  --spacer-size-icon-component-tile-access-standard-bp-02: 20px;
  /**
   * Used on list Tiles for icons indicating unentitled content.
   */
  --spacer-size-icon-component-tile-action-list-bp-02: 20px;
  /**
   * Icon size token for action (play) icon on tile
   */
  --spacer-size-icon-component-tile-action-standard-bp-02: 20px;
  --spacer-size-icon-inline-bp-02: 16px;
  --spacer-size-icon-message-lg-bp-02: 24px;
  --spacer-size-icon-message-md-bp-02: 20px;
  /**
   * Used for pictogram ratings in Info Block and CDP components.
   */
  --spacer-size-icon-rating-md-bp-02: 19px;
  /**
   * Used for pictogram ratings in Tiles and List Item Accordion.
   */
  --spacer-size-icon-rating-sm-bp-02: 15px;
  /**
   * Use for the min-height of elements
   */
  --spacer-size-min-height-2-xs-bp-02: 16px;
  /**
   * Use for the min-height of elements
   */
  --spacer-size-min-height-lg-bp-02: 64px;
  /**
   * Use for the min-height of elements
   */
  --spacer-size-min-height-md-bp-02: 48px;
  /**
   * Use for the min-height of elements
   */
  --spacer-size-min-height-sm-bp-02: 40px;
  /**
   * Use for the min-height of elements
   */
  --spacer-size-min-height-xs-bp-02: 32px;
  --spacer-space-grid-gutter-bp-02: 10px;
  --spacer-space-grid-page-margin-bp-02: 20px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-far-lg-bp-02: 24px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-far-md-bp-02: 20px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-far-sm-bp-02: 8px;
  /**
   * Use for horizontal spacing between elements in a layout
   */
  --spacer-space-horizontal-far-xl-bp-02: 48px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-far-xs-bp-02: 6px;
  /**
   * Use for horizontal spacing between elements in a layout
   */
  --spacer-space-horizontal-near-lg-bp-02: 20px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-near-md-bp-02: 12px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-near-sm-bp-02: 4px;
  /**
   * Use for horizontal spacing between elements in a layout
   */
  --spacer-space-horizontal-near-xl-bp-02: 24px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-near-xs-bp-02: 2px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-none-bp-02: 0px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-large-ample-bp-02: 48px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-large-dense-bp-02: 20px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-large-regular-bp-02: 24px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-large-spacious-bp-02: 32px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-medium-dense-bp-02: 8px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-medium-regular-bp-02: 12px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-medium-spacious-bp-02: 16px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-none-bp-02: 0px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-small-dense-bp-02: 1px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-small-regular-bp-02: 2px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-small-spacious-bp-02: 4px;
  /**
   * Use for vertical spacing between elements in a layout
   */
  --spacer-space-vertical-far-2-xl-bp-02: 48px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-far-lg-bp-02: 24px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-far-md-bp-02: 16px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-far-sm-bp-02: 12px;
  /**
   * Use for vertical spacing between elements in a layout
   */
  --spacer-space-vertical-far-xl-bp-02: 32px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-far-xs-bp-02: 6px;
  /**
   * Use for vertical spacing between elements in a layout
   */
  --spacer-space-vertical-near-lg-bp-02: 12px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-near-md-bp-02: 8px;
  --spacer-space-vertical-near-sm-bp-02: 4px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-near-xl-bp-02: 16px;
  /**
   * Use for vertical spacing (gap) between objects in elements. (was stack/2xs)
   */
  --spacer-space-vertical-near-xs-bp-02: 2px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-none-bp-02: 0px;
  /**
   * Use this spacer vertically between components in a page layout. This is the compact vertical spacing between sections.
   */
  --spacer-space-vertical-page-compact-bp-02: 20px;
  /**
   * Use this vertical spacer at the bottom of each page (before the footer on web) below all components on the page.
   */
  --spacer-space-vertical-page-end-bp-02: 100px;
  /**
   * Use this spacer vertically between components in a page layout. This is the standard vertical spacing between elements.
   */
  --spacer-space-vertical-page-standard-bp-02: 20px;
}

/* Copyright text placeholder, Warner Bros. Discovery, Inc. */

/**
 * *** DO NOT EDIT THIS FILE DIRECTLY ***
 *
 * This file is generated by @wbd/dwt-style-dictionary using @wbd/design-systems package
 * Any modification applied to this file will be lost.
 */

.spacer-tokens {
  --spacer-size-icon-action-jumbo-bp-03: 40px;
  --spacer-size-icon-action-lg-bp-03: 24px;
  --spacer-size-icon-action-md-bp-03: 20px;
  --spacer-size-icon-action-sm-bp-03: 16px;
  --spacer-size-icon-action-xs-bp-03: 12px;
  --spacer-size-icon-badge-bp-03: 10px;
  /**
   * Used on list Tiles for icons indicating unentitled content.
   */
  --spacer-size-icon-component-tile-access-list-bp-03: 20px;
  /**
   * Icon size token for access item (banner icon) icon on tile
   */
  --spacer-size-icon-component-tile-access-standard-bp-03: 20px;
  /**
   * Used on list Tiles for icons indicating unentitled content.
   */
  --spacer-size-icon-component-tile-action-list-bp-03: 24px;
  /**
   * Icon size token for action (play) icon on tile
   */
  --spacer-size-icon-component-tile-action-standard-bp-03: 24px;
  --spacer-size-icon-inline-bp-03: 16px;
  --spacer-size-icon-message-lg-bp-03: 24px;
  --spacer-size-icon-message-md-bp-03: 20px;
  /**
   * Used for pictogram ratings in Info Block and CDP components.
   */
  --spacer-size-icon-rating-md-bp-03: 19px;
  /**
   * Used for pictogram ratings in Tiles and List Item Accordion.
   */
  --spacer-size-icon-rating-sm-bp-03: 15px;
  /**
   * Use for the min-height of elements
   */
  --spacer-size-min-height-2-xs-bp-03: 16px;
  /**
   * Use for the min-height of elements
   */
  --spacer-size-min-height-lg-bp-03: 64px;
  /**
   * Use for the min-height of elements
   */
  --spacer-size-min-height-md-bp-03: 48px;
  /**
   * Use for the min-height of elements
   */
  --spacer-size-min-height-sm-bp-03: 40px;
  /**
   * Use for the min-height of elements
   */
  --spacer-size-min-height-xs-bp-03: 32px;
  --spacer-space-grid-gutter-bp-03: 8px;
  --spacer-space-grid-page-margin-bp-03: 24px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-far-lg-bp-03: 24px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-far-md-bp-03: 20px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-far-sm-bp-03: 8px;
  /**
   * Use for horizontal spacing between elements in a layout
   */
  --spacer-space-horizontal-far-xl-bp-03: 48px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-far-xs-bp-03: 6px;
  /**
   * Use for horizontal spacing between elements in a layout
   */
  --spacer-space-horizontal-near-lg-bp-03: 20px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-near-md-bp-03: 12px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-near-sm-bp-03: 4px;
  /**
   * Use for horizontal spacing between elements in a layout
   */
  --spacer-space-horizontal-near-xl-bp-03: 24px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-near-xs-bp-03: 2px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-none-bp-03: 0px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-large-ample-bp-03: 48px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-large-dense-bp-03: 20px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-large-regular-bp-03: 24px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-large-spacious-bp-03: 32px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-medium-dense-bp-03: 8px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-medium-regular-bp-03: 12px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-medium-spacious-bp-03: 16px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-none-bp-03: 0px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-small-dense-bp-03: 1px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-small-regular-bp-03: 2px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-small-spacious-bp-03: 4px;
  /**
   * Use for vertical spacing between elements in a layout
   */
  --spacer-space-vertical-far-2-xl-bp-03: 48px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-far-lg-bp-03: 24px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-far-md-bp-03: 16px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-far-sm-bp-03: 12px;
  /**
   * Use for vertical spacing between elements in a layout
   */
  --spacer-space-vertical-far-xl-bp-03: 32px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-far-xs-bp-03: 6px;
  /**
   * Use for vertical spacing between elements in a layout
   */
  --spacer-space-vertical-near-lg-bp-03: 12px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-near-md-bp-03: 8px;
  --spacer-space-vertical-near-sm-bp-03: 4px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-near-xl-bp-03: 16px;
  /**
   * Use for vertical spacing (gap) between objects in elements. (was stack/2xs)
   */
  --spacer-space-vertical-near-xs-bp-03: 2px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-none-bp-03: 0px;
  /**
   * Use this spacer vertically between components in a page layout. This is the compact vertical spacing between sections.
   */
  --spacer-space-vertical-page-compact-bp-03: 20px;
  /**
   * Use this vertical spacer at the bottom of each page (before the footer on web) below all components on the page.
   */
  --spacer-space-vertical-page-end-bp-03: 104px;
  /**
   * Use this spacer vertically between components in a page layout. This is the standard vertical spacing between elements.
   */
  --spacer-space-vertical-page-standard-bp-03: 24px;
}

/* Copyright text placeholder, Warner Bros. Discovery, Inc. */

/**
 * *** DO NOT EDIT THIS FILE DIRECTLY ***
 *
 * This file is generated by @wbd/dwt-style-dictionary using @wbd/design-systems package
 * Any modification applied to this file will be lost.
 */

.spacer-tokens {
  --spacer-size-icon-action-jumbo-bp-04: 40px;
  --spacer-size-icon-action-lg-bp-04: 24px;
  --spacer-size-icon-action-md-bp-04: 20px;
  --spacer-size-icon-action-sm-bp-04: 16px;
  --spacer-size-icon-action-xs-bp-04: 12px;
  --spacer-size-icon-badge-bp-04: 10px;
  /**
   * Used on list Tiles for icons indicating unentitled content.
   */
  --spacer-size-icon-component-tile-access-list-bp-04: 20px;
  /**
   * Icon size token for access item (banner icon) icon on tile
   */
  --spacer-size-icon-component-tile-access-standard-bp-04: 20px;
  /**
   * Used on list Tiles for icons indicating unentitled content.
   */
  --spacer-size-icon-component-tile-action-list-bp-04: 24px;
  /**
   * Icon size token for action (play) icon on tile
   */
  --spacer-size-icon-component-tile-action-standard-bp-04: 24px;
  --spacer-size-icon-inline-bp-04: 16px;
  --spacer-size-icon-message-lg-bp-04: 24px;
  --spacer-size-icon-message-md-bp-04: 20px;
  /**
   * Used for pictogram ratings in Info Block and CDP components.
   */
  --spacer-size-icon-rating-md-bp-04: 19px;
  /**
   * Used for pictogram ratings in Tiles and List Item Accordion.
   */
  --spacer-size-icon-rating-sm-bp-04: 15px;
  /**
   * Use for the min-height of elements
   */
  --spacer-size-min-height-2-xs-bp-04: 16px;
  /**
   * Use for the min-height of elements
   */
  --spacer-size-min-height-lg-bp-04: 64px;
  /**
   * Use for the min-height of elements
   */
  --spacer-size-min-height-md-bp-04: 48px;
  /**
   * Use for the min-height of elements
   */
  --spacer-size-min-height-sm-bp-04: 40px;
  /**
   * Use for the min-height of elements
   */
  --spacer-size-min-height-xs-bp-04: 32px;
  --spacer-space-grid-gutter-bp-04: 12px;
  --spacer-space-grid-page-margin-bp-04: 36px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-far-lg-bp-04: 24px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-far-md-bp-04: 20px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-far-sm-bp-04: 8px;
  /**
   * Use for horizontal spacing between elements in a layout
   */
  --spacer-space-horizontal-far-xl-bp-04: 48px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-far-xs-bp-04: 6px;
  /**
   * Use for horizontal spacing between elements in a layout
   */
  --spacer-space-horizontal-near-lg-bp-04: 20px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-near-md-bp-04: 12px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-near-sm-bp-04: 4px;
  /**
   * Use for horizontal spacing between elements in a layout
   */
  --spacer-space-horizontal-near-xl-bp-04: 24px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-near-xs-bp-04: 2px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-none-bp-04: 0px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-large-ample-bp-04: 48px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-large-dense-bp-04: 20px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-large-regular-bp-04: 24px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-large-spacious-bp-04: 32px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-medium-dense-bp-04: 8px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-medium-regular-bp-04: 12px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-medium-spacious-bp-04: 16px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-none-bp-04: 0px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-small-dense-bp-04: 1px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-small-regular-bp-04: 2px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-small-spacious-bp-04: 4px;
  /**
   * Use for vertical spacing between elements in a layout
   */
  --spacer-space-vertical-far-2-xl-bp-04: 48px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-far-lg-bp-04: 24px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-far-md-bp-04: 16px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-far-sm-bp-04: 12px;
  /**
   * Use for vertical spacing between elements in a layout
   */
  --spacer-space-vertical-far-xl-bp-04: 32px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-far-xs-bp-04: 6px;
  /**
   * Use for vertical spacing between elements in a layout
   */
  --spacer-space-vertical-near-lg-bp-04: 12px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-near-md-bp-04: 8px;
  --spacer-space-vertical-near-sm-bp-04: 4px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-near-xl-bp-04: 16px;
  /**
   * Use for vertical spacing (gap) between objects in elements. (was stack/2xs)
   */
  --spacer-space-vertical-near-xs-bp-04: 2px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-none-bp-04: 0px;
  /**
   * Use this spacer vertically between components in a page layout. This is the compact vertical spacing between sections.
   */
  --spacer-space-vertical-page-compact-bp-04: 20px;
  /**
   * Use this vertical spacer at the bottom of each page (before the footer on web) below all components on the page.
   */
  --spacer-space-vertical-page-end-bp-04: 116px;
  /**
   * Use this spacer vertically between components in a page layout. This is the standard vertical spacing between elements.
   */
  --spacer-space-vertical-page-standard-bp-04: 36px;
}

/* Copyright text placeholder, Warner Bros. Discovery, Inc. */

/**
 * *** DO NOT EDIT THIS FILE DIRECTLY ***
 *
 * This file is generated by @wbd/dwt-style-dictionary using @wbd/design-systems package
 * Any modification applied to this file will be lost.
 */

.spacer-tokens {
  --spacer-size-icon-action-jumbo-bp-05: 40px;
  --spacer-size-icon-action-lg-bp-05: 28px;
  --spacer-size-icon-action-md-bp-05: 24px;
  --spacer-size-icon-action-sm-bp-05: 20px;
  --spacer-size-icon-action-xs-bp-05: 14px;
  --spacer-size-icon-badge-bp-05: 12px;
  /**
   * Used on list Tiles for icons indicating unentitled content.
   */
  --spacer-size-icon-component-tile-access-list-bp-05: 28px;
  /**
   * Icon size token for access item (banner icon) icon on tile
   */
  --spacer-size-icon-component-tile-access-standard-bp-05: 28px;
  /**
   * Used on list Tiles for icons indicating unentitled content.
   */
  --spacer-size-icon-component-tile-action-list-bp-05: 28px;
  /**
   * Icon size token for action (play) icon on tile
   */
  --spacer-size-icon-component-tile-action-standard-bp-05: 28px;
  --spacer-size-icon-inline-bp-05: 20px;
  --spacer-size-icon-message-lg-bp-05: 32px;
  --spacer-size-icon-message-md-bp-05: 24px;
  /**
   * Used for pictogram ratings in Info Block and CDP components.
   */
  --spacer-size-icon-rating-md-bp-05: 23px;
  /**
   * Used for pictogram ratings in Tiles and List Item Accordion.
   */
  --spacer-size-icon-rating-sm-bp-05: 21px;
  /**
   * Use for the min-height of elements
   */
  --spacer-size-min-height-2-xs-bp-05: 20px;
  /**
   * Use for the min-height of elements
   */
  --spacer-size-min-height-lg-bp-05: 72px;
  /**
   * Use for the min-height of elements
   */
  --spacer-size-min-height-md-bp-05: 52px;
  /**
   * Use for the min-height of elements
   */
  --spacer-size-min-height-sm-bp-05: 44px;
  /**
   * Use for the min-height of elements
   */
  --spacer-size-min-height-xs-bp-05: 36px;
  --spacer-space-grid-gutter-bp-05: 16px;
  --spacer-space-grid-page-margin-bp-05: 48px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-far-lg-bp-05: 30px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-far-md-bp-05: 24px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-far-sm-bp-05: 10px;
  /**
   * Use for horizontal spacing between elements in a layout
   */
  --spacer-space-horizontal-far-xl-bp-05: 60px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-far-xs-bp-05: 6px;
  /**
   * Use for horizontal spacing between elements in a layout
   */
  --spacer-space-horizontal-near-lg-bp-05: 24px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-near-md-bp-05: 14px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-near-sm-bp-05: 4px;
  /**
   * Use for horizontal spacing between elements in a layout
   */
  --spacer-space-horizontal-near-xl-bp-05: 30px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-near-xs-bp-05: 2px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-none-bp-05: 0px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-large-ample-bp-05: 60px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-large-dense-bp-05: 24px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-large-regular-bp-05: 30px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-large-spacious-bp-05: 40px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-medium-dense-bp-05: 10px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-medium-regular-bp-05: 14px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-medium-spacious-bp-05: 18px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-none-bp-05: 0px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-small-dense-bp-05: 1px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-small-regular-bp-05: 2px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-small-spacious-bp-05: 4px;
  /**
   * Use for vertical spacing between elements in a layout
   */
  --spacer-space-vertical-far-2-xl-bp-05: 60px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-far-lg-bp-05: 30px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-far-md-bp-05: 18px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-far-sm-bp-05: 14px;
  /**
   * Use for vertical spacing between elements in a layout
   */
  --spacer-space-vertical-far-xl-bp-05: 40px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-far-xs-bp-05: 6px;
  /**
   * Use for vertical spacing between elements in a layout
   */
  --spacer-space-vertical-near-lg-bp-05: 14px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-near-md-bp-05: 10px;
  --spacer-space-vertical-near-sm-bp-05: 4px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-near-xl-bp-05: 18px;
  /**
   * Use for vertical spacing (gap) between objects in elements. (was stack/2xs)
   */
  --spacer-space-vertical-near-xs-bp-05: 2px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-none-bp-05: 0px;
  /**
   * Use this spacer vertically between components in a page layout. This is the compact vertical spacing between sections.
   */
  --spacer-space-vertical-page-compact-bp-05: 24px;
  /**
   * Use this vertical spacer at the bottom of each page (before the footer on web) below all components on the page.
   */
  --spacer-space-vertical-page-end-bp-05: 104px;
  /**
   * Use this spacer vertically between components in a page layout. This is the standard vertical spacing between elements.
   */
  --spacer-space-vertical-page-standard-bp-05: 24px;
}

/* Copyright text placeholder, Warner Bros. Discovery, Inc. */

/**
 * *** DO NOT EDIT THIS FILE DIRECTLY ***
 *
 * This file is generated by @wbd/dwt-style-dictionary using @wbd/design-systems package
 * Any modification applied to this file will be lost.
 */

.spacer-tokens {
  --spacer-size-icon-action-jumbo-bp-06: 40px;
  --spacer-size-icon-action-lg-bp-06: 28px;
  --spacer-size-icon-action-md-bp-06: 24px;
  --spacer-size-icon-action-sm-bp-06: 20px;
  --spacer-size-icon-action-xs-bp-06: 14px;
  --spacer-size-icon-badge-bp-06: 12px;
  /**
   * Used on list Tiles for icons indicating unentitled content.
   */
  --spacer-size-icon-component-tile-access-list-bp-06: 28px;
  /**
   * Icon size token for access item (banner icon) icon on tile
   */
  --spacer-size-icon-component-tile-access-standard-bp-06: 28px;
  /**
   * Used on list Tiles for icons indicating unentitled content.
   */
  --spacer-size-icon-component-tile-action-list-bp-06: 28px;
  /**
   * Icon size token for action (play) icon on tile
   */
  --spacer-size-icon-component-tile-action-standard-bp-06: 28px;
  --spacer-size-icon-inline-bp-06: 20px;
  --spacer-size-icon-message-lg-bp-06: 32px;
  --spacer-size-icon-message-md-bp-06: 24px;
  /**
   * Used for pictogram ratings in Info Block and CDP components.
   */
  --spacer-size-icon-rating-md-bp-06: 23px;
  /**
   * Used for pictogram ratings in Tiles and List Item Accordion.
   */
  --spacer-size-icon-rating-sm-bp-06: 21px;
  /**
   * Use for the min-height of elements
   */
  --spacer-size-min-height-2-xs-bp-06: 20px;
  /**
   * Use for the min-height of elements
   */
  --spacer-size-min-height-lg-bp-06: 72px;
  /**
   * Use for the min-height of elements
   */
  --spacer-size-min-height-md-bp-06: 52px;
  /**
   * Use for the min-height of elements
   */
  --spacer-size-min-height-sm-bp-06: 44px;
  /**
   * Use for the min-height of elements
   */
  --spacer-size-min-height-xs-bp-06: 36px;
  --spacer-space-grid-gutter-bp-06: 20px;
  --spacer-space-grid-page-margin-bp-06: 60px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-far-lg-bp-06: 30px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-far-md-bp-06: 24px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-far-sm-bp-06: 10px;
  /**
   * Use for horizontal spacing between elements in a layout
   */
  --spacer-space-horizontal-far-xl-bp-06: 60px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-far-xs-bp-06: 6px;
  /**
   * Use for horizontal spacing between elements in a layout
   */
  --spacer-space-horizontal-near-lg-bp-06: 24px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-near-md-bp-06: 14px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-near-sm-bp-06: 4px;
  /**
   * Use for horizontal spacing between elements in a layout
   */
  --spacer-space-horizontal-near-xl-bp-06: 30px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-near-xs-bp-06: 2px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-none-bp-06: 0px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-large-ample-bp-06: 60px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-large-dense-bp-06: 24px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-large-regular-bp-06: 30px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-large-spacious-bp-06: 40px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-medium-dense-bp-06: 10px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-medium-regular-bp-06: 14px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-medium-spacious-bp-06: 18px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-none-bp-06: 0px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-small-dense-bp-06: 1px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-small-regular-bp-06: 2px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-small-spacious-bp-06: 4px;
  /**
   * Use for vertical spacing between elements in a layout
   */
  --spacer-space-vertical-far-2-xl-bp-06: 60px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-far-lg-bp-06: 30px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-far-md-bp-06: 18px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-far-sm-bp-06: 14px;
  /**
   * Use for vertical spacing between elements in a layout
   */
  --spacer-space-vertical-far-xl-bp-06: 40px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-far-xs-bp-06: 6px;
  /**
   * Use for vertical spacing between elements in a layout
   */
  --spacer-space-vertical-near-lg-bp-06: 14px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-near-md-bp-06: 10px;
  --spacer-space-vertical-near-sm-bp-06: 4px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-near-xl-bp-06: 18px;
  /**
   * Use for vertical spacing (gap) between objects in elements. (was stack/2xs)
   */
  --spacer-space-vertical-near-xs-bp-06: 2px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-none-bp-06: 0px;
  /**
   * Use this spacer vertically between components in a page layout. This is the compact vertical spacing between sections.
   */
  --spacer-space-vertical-page-compact-bp-06: 24px;
  /**
   * Use this vertical spacer at the bottom of each page (before the footer on web) below all components on the page.
   */
  --spacer-space-vertical-page-end-bp-06: 110px;
  /**
   * Use this spacer vertically between components in a page layout. This is the standard vertical spacing between elements.
   */
  --spacer-space-vertical-page-standard-bp-06: 30px;
}

/* Copyright text placeholder, Warner Bros. Discovery, Inc. */

/**
 * *** DO NOT EDIT THIS FILE DIRECTLY ***
 *
 * This file is generated by @wbd/dwt-style-dictionary using @wbd/design-systems package
 * Any modification applied to this file will be lost.
 */

.spacer-tokens {
  --spacer-size-icon-action-jumbo-bp-07: 40px;
  --spacer-size-icon-action-lg-bp-07: 28px;
  --spacer-size-icon-action-md-bp-07: 24px;
  --spacer-size-icon-action-sm-bp-07: 20px;
  --spacer-size-icon-action-xs-bp-07: 14px;
  --spacer-size-icon-badge-bp-07: 12px;
  /**
   * Used on list Tiles for icons indicating unentitled content.
   */
  --spacer-size-icon-component-tile-access-list-bp-07: 28px;
  /**
   * Icon size token for access item (banner icon) icon on tile
   */
  --spacer-size-icon-component-tile-access-standard-bp-07: 28px;
  /**
   * Used on list Tiles for icons indicating unentitled content.
   */
  --spacer-size-icon-component-tile-action-list-bp-07: 28px;
  /**
   * Icon size token for action (play) icon on tile
   */
  --spacer-size-icon-component-tile-action-standard-bp-07: 28px;
  --spacer-size-icon-inline-bp-07: 20px;
  --spacer-size-icon-message-lg-bp-07: 32px;
  --spacer-size-icon-message-md-bp-07: 24px;
  /**
   * Used for pictogram ratings in Info Block and CDP components.
   */
  --spacer-size-icon-rating-md-bp-07: 23px;
  /**
   * Used for pictogram ratings in Tiles and List Item Accordion.
   */
  --spacer-size-icon-rating-sm-bp-07: 21px;
  /**
   * Use for the min-height of elements
   */
  --spacer-size-min-height-2-xs-bp-07: 20px;
  /**
   * Use for the min-height of elements
   */
  --spacer-size-min-height-lg-bp-07: 72px;
  /**
   * Use for the min-height of elements
   */
  --spacer-size-min-height-md-bp-07: 52px;
  /**
   * Use for the min-height of elements
   */
  --spacer-size-min-height-sm-bp-07: 44px;
  /**
   * Use for the min-height of elements
   */
  --spacer-size-min-height-xs-bp-07: 36px;
  --spacer-space-grid-gutter-bp-07: 20px;
  --spacer-space-grid-page-margin-bp-07: 60px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-far-lg-bp-07: 30px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-far-md-bp-07: 24px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-far-sm-bp-07: 10px;
  /**
   * Use for horizontal spacing between elements in a layout
   */
  --spacer-space-horizontal-far-xl-bp-07: 60px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-far-xs-bp-07: 6px;
  /**
   * Use for horizontal spacing between elements in a layout
   */
  --spacer-space-horizontal-near-lg-bp-07: 24px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-near-md-bp-07: 14px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-near-sm-bp-07: 4px;
  /**
   * Use for horizontal spacing between elements in a layout
   */
  --spacer-space-horizontal-near-xl-bp-07: 30px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-near-xs-bp-07: 2px;
  /**
   * Use for horizontal spacing (gap) between objects in elements
   */
  --spacer-space-horizontal-none-bp-07: 0px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-large-ample-bp-07: 60px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-large-dense-bp-07: 24px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-large-regular-bp-07: 30px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-large-spacious-bp-07: 40px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-medium-dense-bp-07: 10px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-medium-regular-bp-07: 14px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-medium-spacious-bp-07: 18px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-none-bp-07: 0px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-small-dense-bp-07: 1px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-small-regular-bp-07: 2px;
  /**
   * Use for inset padding within an element
   */
  --spacer-space-padding-small-spacious-bp-07: 4px;
  /**
   * Use for vertical spacing between elements in a layout
   */
  --spacer-space-vertical-far-2-xl-bp-07: 60px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-far-lg-bp-07: 30px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-far-md-bp-07: 18px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-far-sm-bp-07: 14px;
  /**
   * Use for vertical spacing between elements in a layout
   */
  --spacer-space-vertical-far-xl-bp-07: 40px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-far-xs-bp-07: 6px;
  /**
   * Use for vertical spacing between elements in a layout
   */
  --spacer-space-vertical-near-lg-bp-07: 14px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-near-md-bp-07: 10px;
  --spacer-space-vertical-near-sm-bp-07: 4px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-near-xl-bp-07: 18px;
  /**
   * Use for vertical spacing (gap) between objects in elements. (was stack/2xs)
   */
  --spacer-space-vertical-near-xs-bp-07: 2px;
  /**
   * Use for vertical spacing (gap) between objects in elements
   */
  --spacer-space-vertical-none-bp-07: 0px;
  /**
   * Use this spacer vertically between components in a page layout. This is the compact vertical spacing between sections.
   */
  --spacer-space-vertical-page-compact-bp-07: 24px;
  /**
   * Use this vertical spacer at the bottom of each page (before the footer on web) below all components on the page.
   */
  --spacer-space-vertical-page-end-bp-07: 110px;
  /**
   * Use this spacer vertically between components in a page layout. This is the standard vertical spacing between elements.
   */
  --spacer-space-vertical-page-standard-bp-07: 30px;
}

/**
 * // Copyright text placeholder, Warner Bros. Discovery, Inc.
 */

/**
 * // Copyright text placeholder, Warner Bros. Discovery, Inc.

 * 
  // ***DO NOT EDIT THIS FILE DIRECTLY***
  // This file is generated by @wbd/dwt-style-dictionary using @wbd/design-systems package
  // Any modification applied to this file will be lost.

 */

.font-dense-slate3 {
  --font_action_md_bp_01_font_size-slate3: 17px;
  --font_action_md_bp_01_line_height-slate3: 130%;
  --font_action_md_low_bp_01_font_size-slate3: 17px;
  --font_action_md_low_bp_01_line_height-slate3: 130%;
  --font_action_sm_bp_01_font_size-slate3: 13.8px;
  --font_action_sm_bp_01_line_height-slate3: 130%;
  --font_action_sm_low_bp_01_font_size-slate3: 13.8px;
  --font_action_sm_low_bp_01_line_height-slate3: 130%;
  --font_action_xs_bp_01_font_size-slate3: 11.24px;
  --font_action_xs_bp_01_line_height-slate3: 130%;
  --font_action_xs_low_bp_01_font_size-slate3: 11.24px;
  --font_action_xs_low_bp_01_line_height-slate3: 130%;
  --font_body_lg_bp_01_font_size-slate3: 21px;
  --font_body_lg_bp_01_line_height-slate3: 150%;
  --font_body_lg_strong_bp_01_font_size-slate3: 21px;
  --font_body_lg_strong_bp_01_line_height-slate3: 150%;
  --font_body_md_bp_01_font_size-slate3: 17px;
  --font_body_md_bp_01_line_height-slate3: 150%;
  --font_body_md_strong_bp_01_font_size-slate3: 17px;
  --font_body_md_strong_bp_01_line_height-slate3: 150%;
  --font_body_sm_bp_01_font_size-slate3: 13.8px;
  --font_body_sm_bp_01_line_height-slate3: 150%;
  --font_body_sm_strong_bp_01_font_size-slate3: 13.8px;
  --font_body_sm_strong_bp_01_line_height-slate3: 150%;
  --font_body_xs_bp_01_font_size-slate3: 11.24px;
  --font_body_xs_bp_01_line_height-slate3: 150%;
  --font_body_xs_strong_bp_01_font_size-slate3: 11.24px;
  --font_body_xs_strong_bp_01_line_height-slate3: 150%;
  --font_heading_lg_bp_01_font_size-slate3: 25px;
  --font_heading_lg_bp_01_line_height-slate3: 130%;
  --font_heading_md_bp_01_font_size-slate3: 21px;
  --font_heading_md_bp_01_line_height-slate3: 130%;
  --font_heading_sm_bp_01_font_size-slate3: 17px;
  --font_heading_sm_bp_01_line_height-slate3: 130%;
  --font_heading_xl_bp_01_font_size-slate3: 31.25px;
  --font_heading_xl_bp_01_line_height-slate3: 130%;
  --font_heading_xs_bp_01_font_size-slate3: 13.8px;
  --font_heading_xs_bp_01_line_height-slate3: 130%;
  --font_indicator_code_bp_01_font_size-slate3: 13.8px;
  --font_indicator_code_bp_01_line_height-slate3: 130%;
  --font_indicator_sm_bp_01_font_size-slate3: 11.24px;
  --font_indicator_sm_bp_01_line_height-slate3: 160%;
  --font_indicator_sm_low_bp_01_font_size-slate3: 11.24px;
  --font_indicator_sm_low_bp_01_line_height-slate3: 160%;
  --font_input_inline_bp_01_font_size-slate3: 17px;
  --font_input_inline_bp_01_line_height-slate3: 150%;
  --font_input_inline_sm_bp_01_font_size-slate3: 13.8px;
  --font_input_inline_sm_bp_01_line_height-slate3: 150%;
  --font_input_inset_bp_01_font_size-slate3: 17px;
  --font_input_inset_bp_01_line_height-slate3: 150%;
  --font_input_inset_high_bp_01_font_size-slate3: 17px;
  --font_input_inset_high_bp_01_line_height-slate3: 150%;
  --font_input_inset_segment_bp_01_font_size-slate3: 21px;
  --font_input_inset_segment_bp_01_line_height-slate3: 150%;
  --font_input_stacked_bp_01_font_size-slate3: 17px;
  --font_input_stacked_bp_01_line_height-slate3: 150%;
  --font_metadata_sm_bp_01_font_size-slate3: 11.24px;
  --font_metadata_sm_bp_01_line_height-slate3: 130%;
  --font_metadata_sm_high_bp_01_font_size-slate3: 11.24px;
  --font_metadata_sm_high_bp_01_line_height-slate3: 130%;
}

/**
 * // Copyright text placeholder, Warner Bros. Discovery, Inc.

 * 
  // ***DO NOT EDIT THIS FILE DIRECTLY***
  // This file is generated by @wbd/dwt-style-dictionary using @wbd/design-systems package
  // Any modification applied to this file will be lost.

 */

.font-dense-slate3 {
  --font_action_md_bp_02_font_size-slate3: 17px;
  --font_action_md_bp_02_line_height-slate3: 130%;
  --font_action_md_low_bp_02_font_size-slate3: 17px;
  --font_action_md_low_bp_02_line_height-slate3: 130%;
  --font_action_sm_bp_02_font_size-slate3: 13.8px;
  --font_action_sm_bp_02_line_height-slate3: 130%;
  --font_action_sm_low_bp_02_font_size-slate3: 13.8px;
  --font_action_sm_low_bp_02_line_height-slate3: 130%;
  --font_action_xs_bp_02_font_size-slate3: 11.24px;
  --font_action_xs_bp_02_line_height-slate3: 130%;
  --font_action_xs_low_bp_02_font_size-slate3: 11.24px;
  --font_action_xs_low_bp_02_line_height-slate3: 130%;
  --font_body_lg_bp_02_font_size-slate3: 21px;
  --font_body_lg_bp_02_line_height-slate3: 150%;
  --font_body_lg_strong_bp_02_font_size-slate3: 21px;
  --font_body_lg_strong_bp_02_line_height-slate3: 150%;
  --font_body_md_bp_02_font_size-slate3: 17px;
  --font_body_md_bp_02_line_height-slate3: 150%;
  --font_body_md_strong_bp_02_font_size-slate3: 17px;
  --font_body_md_strong_bp_02_line_height-slate3: 150%;
  --font_body_sm_bp_02_font_size-slate3: 13.8px;
  --font_body_sm_bp_02_line_height-slate3: 150%;
  --font_body_sm_strong_bp_02_font_size-slate3: 13.8px;
  --font_body_sm_strong_bp_02_line_height-slate3: 150%;
  --font_body_xs_bp_02_font_size-slate3: 11.24px;
  --font_body_xs_bp_02_line_height-slate3: 150%;
  --font_body_xs_strong_bp_02_font_size-slate3: 11.24px;
  --font_body_xs_strong_bp_02_line_height-slate3: 150%;
  --font_heading_lg_bp_02_font_size-slate3: 25px;
  --font_heading_lg_bp_02_line_height-slate3: 130%;
  --font_heading_md_bp_02_font_size-slate3: 21px;
  --font_heading_md_bp_02_line_height-slate3: 130%;
  --font_heading_sm_bp_02_font_size-slate3: 17px;
  --font_heading_sm_bp_02_line_height-slate3: 130%;
  --font_heading_xl_bp_02_font_size-slate3: 31.25px;
  --font_heading_xl_bp_02_line_height-slate3: 130%;
  --font_heading_xs_bp_02_font_size-slate3: 13.8px;
  --font_heading_xs_bp_02_line_height-slate3: 130%;
  --font_indicator_code_bp_02_font_size-slate3: 13.8px;
  --font_indicator_code_bp_02_line_height-slate3: 130%;
  --font_indicator_sm_bp_02_font_size-slate3: 11.24px;
  --font_indicator_sm_bp_02_line_height-slate3: 160%;
  --font_indicator_sm_low_bp_02_font_size-slate3: 11.24px;
  --font_indicator_sm_low_bp_02_line_height-slate3: 160%;
  --font_input_inline_bp_02_font_size-slate3: 17px;
  --font_input_inline_bp_02_line_height-slate3: 150%;
  --font_input_inline_sm_bp_02_font_size-slate3: 13.8px;
  --font_input_inline_sm_bp_02_line_height-slate3: 150%;
  --font_input_inset_bp_02_font_size-slate3: 17px;
  --font_input_inset_bp_02_line_height-slate3: 150%;
  --font_input_inset_high_bp_02_font_size-slate3: 17px;
  --font_input_inset_high_bp_02_line_height-slate3: 150%;
  --font_input_inset_segment_bp_02_font_size-slate3: 21px;
  --font_input_inset_segment_bp_02_line_height-slate3: 150%;
  --font_input_stacked_bp_02_font_size-slate3: 17px;
  --font_input_stacked_bp_02_line_height-slate3: 150%;
  --font_metadata_sm_bp_02_font_size-slate3: 11.24px;
  --font_metadata_sm_bp_02_line_height-slate3: 130%;
  --font_metadata_sm_high_bp_02_font_size-slate3: 11.24px;
  --font_metadata_sm_high_bp_02_line_height-slate3: 130%;
}

/**
 * // Copyright text placeholder, Warner Bros. Discovery, Inc.

 * 
  // ***DO NOT EDIT THIS FILE DIRECTLY***
  // This file is generated by @wbd/dwt-style-dictionary using @wbd/design-systems package
  // Any modification applied to this file will be lost.

 */

.font-dense-slate3 {
  --font_action_md_bp_03_font_size-slate3: 17px;
  --font_action_md_bp_03_line_height-slate3: 130%;
  --font_action_md_low_bp_03_font_size-slate3: 17px;
  --font_action_md_low_bp_03_line_height-slate3: 130%;
  --font_action_sm_bp_03_font_size-slate3: 13.8px;
  --font_action_sm_bp_03_line_height-slate3: 130%;
  --font_action_sm_low_bp_03_font_size-slate3: 13.8px;
  --font_action_sm_low_bp_03_line_height-slate3: 130%;
  --font_action_xs_bp_03_font_size-slate3: 11.24px;
  --font_action_xs_bp_03_line_height-slate3: 130%;
  --font_action_xs_low_bp_03_font_size-slate3: 11.24px;
  --font_action_xs_low_bp_03_line_height-slate3: 130%;
  --font_body_lg_bp_03_font_size-slate3: 21px;
  --font_body_lg_bp_03_line_height-slate3: 150%;
  --font_body_lg_strong_bp_03_font_size-slate3: 21px;
  --font_body_lg_strong_bp_03_line_height-slate3: 150%;
  --font_body_md_bp_03_font_size-slate3: 17px;
  --font_body_md_bp_03_line_height-slate3: 150%;
  --font_body_md_strong_bp_03_font_size-slate3: 17px;
  --font_body_md_strong_bp_03_line_height-slate3: 150%;
  --font_body_sm_bp_03_font_size-slate3: 13.8px;
  --font_body_sm_bp_03_line_height-slate3: 150%;
  --font_body_sm_strong_bp_03_font_size-slate3: 13.8px;
  --font_body_sm_strong_bp_03_line_height-slate3: 150%;
  --font_body_xs_bp_03_font_size-slate3: 11.24px;
  --font_body_xs_bp_03_line_height-slate3: 150%;
  --font_body_xs_strong_bp_03_font_size-slate3: 11.24px;
  --font_body_xs_strong_bp_03_line_height-slate3: 150%;
  --font_heading_lg_bp_03_font_size-slate3: 25px;
  --font_heading_lg_bp_03_line_height-slate3: 130%;
  --font_heading_md_bp_03_font_size-slate3: 21px;
  --font_heading_md_bp_03_line_height-slate3: 130%;
  --font_heading_sm_bp_03_font_size-slate3: 17px;
  --font_heading_sm_bp_03_line_height-slate3: 130%;
  --font_heading_xl_bp_03_font_size-slate3: 31.25px;
  --font_heading_xl_bp_03_line_height-slate3: 130%;
  --font_heading_xs_bp_03_font_size-slate3: 13.8px;
  --font_heading_xs_bp_03_line_height-slate3: 130%;
  --font_indicator_code_bp_03_font_size-slate3: 13.8px;
  --font_indicator_code_bp_03_line_height-slate3: 130%;
  --font_indicator_sm_bp_03_font_size-slate3: 11.24px;
  --font_indicator_sm_bp_03_line_height-slate3: 160%;
  --font_indicator_sm_low_bp_03_font_size-slate3: 11.24px;
  --font_indicator_sm_low_bp_03_line_height-slate3: 160%;
  --font_input_inline_bp_03_font_size-slate3: 17px;
  --font_input_inline_bp_03_line_height-slate3: 150%;
  --font_input_inline_sm_bp_03_font_size-slate3: 13.8px;
  --font_input_inline_sm_bp_03_line_height-slate3: 150%;
  --font_input_inset_bp_03_font_size-slate3: 17px;
  --font_input_inset_bp_03_line_height-slate3: 150%;
  --font_input_inset_high_bp_03_font_size-slate3: 17px;
  --font_input_inset_high_bp_03_line_height-slate3: 150%;
  --font_input_inset_segment_bp_03_font_size-slate3: 21px;
  --font_input_inset_segment_bp_03_line_height-slate3: 150%;
  --font_input_stacked_bp_03_font_size-slate3: 17px;
  --font_input_stacked_bp_03_line_height-slate3: 150%;
  --font_metadata_sm_bp_03_font_size-slate3: 11.24px;
  --font_metadata_sm_bp_03_line_height-slate3: 130%;
  --font_metadata_sm_high_bp_03_font_size-slate3: 11.24px;
  --font_metadata_sm_high_bp_03_line_height-slate3: 130%;
}

/**
 * // Copyright text placeholder, Warner Bros. Discovery, Inc.

 * 
  // ***DO NOT EDIT THIS FILE DIRECTLY***
  // This file is generated by @wbd/dwt-style-dictionary using @wbd/design-systems package
  // Any modification applied to this file will be lost.

 */

.font-dense-slate3 {
  --font_action_md_bp_04_font_size-slate3: 17px;
  --font_action_md_bp_04_line_height-slate3: 130%;
  --font_action_md_low_bp_04_font_size-slate3: 17px;
  --font_action_md_low_bp_04_line_height-slate3: 130%;
  --font_action_sm_bp_04_font_size-slate3: 13.8px;
  --font_action_sm_bp_04_line_height-slate3: 130%;
  --font_action_sm_low_bp_04_font_size-slate3: 13.8px;
  --font_action_sm_low_bp_04_line_height-slate3: 130%;
  --font_action_xs_bp_04_font_size-slate3: 11.24px;
  --font_action_xs_bp_04_line_height-slate3: 130%;
  --font_action_xs_low_bp_04_font_size-slate3: 11.24px;
  --font_action_xs_low_bp_04_line_height-slate3: 130%;
  --font_body_lg_bp_04_font_size-slate3: 21px;
  --font_body_lg_bp_04_line_height-slate3: 150%;
  --font_body_lg_strong_bp_04_font_size-slate3: 21px;
  --font_body_lg_strong_bp_04_line_height-slate3: 150%;
  --font_body_md_bp_04_font_size-slate3: 17px;
  --font_body_md_bp_04_line_height-slate3: 150%;
  --font_body_md_strong_bp_04_font_size-slate3: 17px;
  --font_body_md_strong_bp_04_line_height-slate3: 150%;
  --font_body_sm_bp_04_font_size-slate3: 13.8px;
  --font_body_sm_bp_04_line_height-slate3: 150%;
  --font_body_sm_strong_bp_04_font_size-slate3: 13.8px;
  --font_body_sm_strong_bp_04_line_height-slate3: 150%;
  --font_body_xs_bp_04_font_size-slate3: 11.24px;
  --font_body_xs_bp_04_line_height-slate3: 150%;
  --font_body_xs_strong_bp_04_font_size-slate3: 11.24px;
  --font_body_xs_strong_bp_04_line_height-slate3: 150%;
  --font_heading_lg_bp_04_font_size-slate3: 25px;
  --font_heading_lg_bp_04_line_height-slate3: 130%;
  --font_heading_md_bp_04_font_size-slate3: 21px;
  --font_heading_md_bp_04_line_height-slate3: 130%;
  --font_heading_sm_bp_04_font_size-slate3: 17px;
  --font_heading_sm_bp_04_line_height-slate3: 130%;
  --font_heading_xl_bp_04_font_size-slate3: 31.25px;
  --font_heading_xl_bp_04_line_height-slate3: 130%;
  --font_heading_xs_bp_04_font_size-slate3: 13.8px;
  --font_heading_xs_bp_04_line_height-slate3: 130%;
  --font_indicator_code_bp_04_font_size-slate3: 13.8px;
  --font_indicator_code_bp_04_line_height-slate3: 130%;
  --font_indicator_sm_bp_04_font_size-slate3: 11.24px;
  --font_indicator_sm_bp_04_line_height-slate3: 160%;
  --font_indicator_sm_low_bp_04_font_size-slate3: 11.24px;
  --font_indicator_sm_low_bp_04_line_height-slate3: 160%;
  --font_input_inline_bp_04_font_size-slate3: 17px;
  --font_input_inline_bp_04_line_height-slate3: 150%;
  --font_input_inline_sm_bp_04_font_size-slate3: 13.8px;
  --font_input_inline_sm_bp_04_line_height-slate3: 150%;
  --font_input_inset_bp_04_font_size-slate3: 17px;
  --font_input_inset_bp_04_line_height-slate3: 150%;
  --font_input_inset_high_bp_04_font_size-slate3: 17px;
  --font_input_inset_high_bp_04_line_height-slate3: 150%;
  --font_input_inset_segment_bp_04_font_size-slate3: 21px;
  --font_input_inset_segment_bp_04_line_height-slate3: 150%;
  --font_input_stacked_bp_04_font_size-slate3: 17px;
  --font_input_stacked_bp_04_line_height-slate3: 150%;
  --font_metadata_sm_bp_04_font_size-slate3: 11.24px;
  --font_metadata_sm_bp_04_line_height-slate3: 130%;
  --font_metadata_sm_high_bp_04_font_size-slate3: 11.24px;
  --font_metadata_sm_high_bp_04_line_height-slate3: 130%;
}

/**
 * // Copyright text placeholder, Warner Bros. Discovery, Inc.

 * 
  // ***DO NOT EDIT THIS FILE DIRECTLY***
  // This file is generated by @wbd/dwt-style-dictionary using @wbd/design-systems package
  // Any modification applied to this file will be lost.

 */

.font-dense-slate3 {
  --font_action_md_bp_05_font_size-slate3: 21px;
  --font_action_md_bp_05_line_height-slate3: 130%;
  --font_action_md_low_bp_05_font_size-slate3: 21px;
  --font_action_md_low_bp_05_line_height-slate3: 130%;
  --font_action_sm_bp_05_font_size-slate3: 17.667px;
  --font_action_sm_bp_05_line_height-slate3: 130%;
  --font_action_sm_low_bp_05_font_size-slate3: 17.667px;
  --font_action_sm_low_bp_05_line_height-slate3: 130%;
  --font_action_xs_bp_05_font_size-slate3: 14.889px;
  --font_action_xs_bp_05_line_height-slate3: 131%;
  --font_action_xs_low_bp_05_font_size-slate3: 14.889px;
  --font_action_xs_low_bp_05_line_height-slate3: 131%;
  --font_body_lg_bp_05_font_size-slate3: 25px;
  --font_body_lg_bp_05_line_height-slate3: 150%;
  --font_body_lg_strong_bp_05_font_size-slate3: 25px;
  --font_body_lg_strong_bp_05_line_height-slate3: 150%;
  --font_body_md_bp_05_font_size-slate3: 21px;
  --font_body_md_bp_05_line_height-slate3: 150%;
  --font_body_md_strong_bp_05_font_size-slate3: 21px;
  --font_body_md_strong_bp_05_line_height-slate3: 150%;
  --font_body_sm_bp_05_font_size-slate3: 17.667px;
  --font_body_sm_bp_05_line_height-slate3: 150%;
  --font_body_sm_strong_bp_05_font_size-slate3: 17.667px;
  --font_body_sm_strong_bp_05_line_height-slate3: 150%;
  --font_body_xs_bp_05_font_size-slate3: 14.889px;
  --font_body_xs_bp_05_line_height-slate3: 150%;
  --font_body_xs_strong_bp_05_font_size-slate3: 14.889px;
  --font_body_xs_strong_bp_05_line_height-slate3: 150%;
  --font_heading_lg_bp_05_font_size-slate3: 28.8px;
  --font_heading_lg_bp_05_line_height-slate3: 130%;
  --font_heading_md_bp_05_font_size-slate3: 25px;
  --font_heading_md_bp_05_line_height-slate3: 130%;
  --font_heading_sm_bp_05_font_size-slate3: 21px;
  --font_heading_sm_bp_05_line_height-slate3: 130%;
  --font_heading_xl_bp_05_font_size-slate3: 34.56px;
  --font_heading_xl_bp_05_line_height-slate3: 130%;
  --font_heading_xs_bp_05_font_size-slate3: 17.667px;
  --font_heading_xs_bp_05_line_height-slate3: 130%;
  --font_indicator_code_bp_05_font_size-slate3: 17.667px;
  --font_indicator_code_bp_05_line_height-slate3: 130%;
  --font_indicator_sm_bp_05_font_size-slate3: 14.889px;
  --font_indicator_sm_bp_05_line_height-slate3: 155%;
  --font_indicator_sm_low_bp_05_font_size-slate3: 14.889px;
  --font_indicator_sm_low_bp_05_line_height-slate3: 155%;
  --font_input_inline_bp_05_font_size-slate3: 21px;
  --font_input_inline_bp_05_line_height-slate3: 150%;
  --font_input_inline_sm_bp_05_font_size-slate3: 17.667px;
  --font_input_inline_sm_bp_05_line_height-slate3: 150%;
  --font_input_inset_bp_05_font_size-slate3: 21px;
  --font_input_inset_bp_05_line_height-slate3: 150%;
  --font_input_inset_high_bp_05_font_size-slate3: 21px;
  --font_input_inset_high_bp_05_line_height-slate3: 150%;
  --font_input_inset_segment_bp_05_font_size-slate3: 25px;
  --font_input_inset_segment_bp_05_line_height-slate3: 150%;
  --font_input_stacked_bp_05_font_size-slate3: 21px;
  --font_input_stacked_bp_05_line_height-slate3: 150%;
  --font_metadata_sm_bp_05_font_size-slate3: 14.889px;
  --font_metadata_sm_bp_05_line_height-slate3: 131%;
  --font_metadata_sm_high_bp_05_font_size-slate3: 14.889px;
  --font_metadata_sm_high_bp_05_line_height-slate3: 131%;
}

/**
 * // Copyright text placeholder, Warner Bros. Discovery, Inc.

 * 
  // ***DO NOT EDIT THIS FILE DIRECTLY***
  // This file is generated by @wbd/dwt-style-dictionary using @wbd/design-systems package
  // Any modification applied to this file will be lost.

 */

.font-dense-slate3 {
  --font_action_md_bp_06_font_size-slate3: 21px;
  --font_action_md_bp_06_line_height-slate3: 130%;
  --font_action_md_low_bp_06_font_size-slate3: 21px;
  --font_action_md_low_bp_06_line_height-slate3: 130%;
  --font_action_sm_bp_06_font_size-slate3: 17.667px;
  --font_action_sm_bp_06_line_height-slate3: 130%;
  --font_action_sm_low_bp_06_font_size-slate3: 17.667px;
  --font_action_sm_low_bp_06_line_height-slate3: 130%;
  --font_action_xs_bp_06_font_size-slate3: 14.889px;
  --font_action_xs_bp_06_line_height-slate3: 131%;
  --font_action_xs_low_bp_06_font_size-slate3: 14.889px;
  --font_action_xs_low_bp_06_line_height-slate3: 131%;
  --font_body_lg_bp_06_font_size-slate3: 25px;
  --font_body_lg_bp_06_line_height-slate3: 150%;
  --font_body_lg_strong_bp_06_font_size-slate3: 25px;
  --font_body_lg_strong_bp_06_line_height-slate3: 150%;
  --font_body_md_bp_06_font_size-slate3: 21px;
  --font_body_md_bp_06_line_height-slate3: 150%;
  --font_body_md_strong_bp_06_font_size-slate3: 21px;
  --font_body_md_strong_bp_06_line_height-slate3: 150%;
  --font_body_sm_bp_06_font_size-slate3: 17.667px;
  --font_body_sm_bp_06_line_height-slate3: 150%;
  --font_body_sm_strong_bp_06_font_size-slate3: 17.667px;
  --font_body_sm_strong_bp_06_line_height-slate3: 150%;
  --font_body_xs_bp_06_font_size-slate3: 14.889px;
  --font_body_xs_bp_06_line_height-slate3: 150%;
  --font_body_xs_strong_bp_06_font_size-slate3: 14.889px;
  --font_body_xs_strong_bp_06_line_height-slate3: 150%;
  --font_heading_lg_bp_06_font_size-slate3: 28.8px;
  --font_heading_lg_bp_06_line_height-slate3: 130%;
  --font_heading_md_bp_06_font_size-slate3: 25px;
  --font_heading_md_bp_06_line_height-slate3: 130%;
  --font_heading_sm_bp_06_font_size-slate3: 21px;
  --font_heading_sm_bp_06_line_height-slate3: 130%;
  --font_heading_xl_bp_06_font_size-slate3: 34.56px;
  --font_heading_xl_bp_06_line_height-slate3: 130%;
  --font_heading_xs_bp_06_font_size-slate3: 17.667px;
  --font_heading_xs_bp_06_line_height-slate3: 130%;
  --font_indicator_code_bp_06_font_size-slate3: 17.667px;
  --font_indicator_code_bp_06_line_height-slate3: 130%;
  --font_indicator_sm_bp_06_font_size-slate3: 14.889px;
  --font_indicator_sm_bp_06_line_height-slate3: 155%;
  --font_indicator_sm_low_bp_06_font_size-slate3: 14.889px;
  --font_indicator_sm_low_bp_06_line_height-slate3: 155%;
  --font_input_inline_bp_06_font_size-slate3: 21px;
  --font_input_inline_bp_06_line_height-slate3: 150%;
  --font_input_inline_sm_bp_06_font_size-slate3: 17.667px;
  --font_input_inline_sm_bp_06_line_height-slate3: 150%;
  --font_input_inset_bp_06_font_size-slate3: 21px;
  --font_input_inset_bp_06_line_height-slate3: 150%;
  --font_input_inset_high_bp_06_font_size-slate3: 21px;
  --font_input_inset_high_bp_06_line_height-slate3: 150%;
  --font_input_inset_segment_bp_06_font_size-slate3: 25px;
  --font_input_inset_segment_bp_06_line_height-slate3: 150%;
  --font_input_stacked_bp_06_font_size-slate3: 21px;
  --font_input_stacked_bp_06_line_height-slate3: 150%;
  --font_metadata_sm_bp_06_font_size-slate3: 14.889px;
  --font_metadata_sm_bp_06_line_height-slate3: 131%;
  --font_metadata_sm_high_bp_06_font_size-slate3: 14.889px;
  --font_metadata_sm_high_bp_06_line_height-slate3: 131%;
}

/**
 * // Copyright text placeholder, Warner Bros. Discovery, Inc.

 * 
  // ***DO NOT EDIT THIS FILE DIRECTLY***
  // This file is generated by @wbd/dwt-style-dictionary using @wbd/design-systems package
  // Any modification applied to this file will be lost.

 */

.font-dense-slate3 {
  --font_action_md_bp_07_font_size-slate3: 21px;
  --font_action_md_bp_07_line_height-slate3: 130%;
  --font_action_md_low_bp_07_font_size-slate3: 21px;
  --font_action_md_low_bp_07_line_height-slate3: 130%;
  --font_action_sm_bp_07_font_size-slate3: 17.667px;
  --font_action_sm_bp_07_line_height-slate3: 130%;
  --font_action_sm_low_bp_07_font_size-slate3: 17.667px;
  --font_action_sm_low_bp_07_line_height-slate3: 130%;
  --font_action_xs_bp_07_font_size-slate3: 14.889px;
  --font_action_xs_bp_07_line_height-slate3: 131%;
  --font_action_xs_low_bp_07_font_size-slate3: 14.889px;
  --font_action_xs_low_bp_07_line_height-slate3: 131%;
  --font_body_lg_bp_07_font_size-slate3: 25px;
  --font_body_lg_bp_07_line_height-slate3: 150%;
  --font_body_lg_strong_bp_07_font_size-slate3: 25px;
  --font_body_lg_strong_bp_07_line_height-slate3: 150%;
  --font_body_md_bp_07_font_size-slate3: 21px;
  --font_body_md_bp_07_line_height-slate3: 150%;
  --font_body_md_strong_bp_07_font_size-slate3: 21px;
  --font_body_md_strong_bp_07_line_height-slate3: 150%;
  --font_body_sm_bp_07_font_size-slate3: 17.667px;
  --font_body_sm_bp_07_line_height-slate3: 150%;
  --font_body_sm_strong_bp_07_font_size-slate3: 17.667px;
  --font_body_sm_strong_bp_07_line_height-slate3: 150%;
  --font_body_xs_bp_07_font_size-slate3: 14.889px;
  --font_body_xs_bp_07_line_height-slate3: 150%;
  --font_body_xs_strong_bp_07_font_size-slate3: 14.889px;
  --font_body_xs_strong_bp_07_line_height-slate3: 150%;
  --font_heading_lg_bp_07_font_size-slate3: 28.8px;
  --font_heading_lg_bp_07_line_height-slate3: 130%;
  --font_heading_md_bp_07_font_size-slate3: 25px;
  --font_heading_md_bp_07_line_height-slate3: 130%;
  --font_heading_sm_bp_07_font_size-slate3: 21px;
  --font_heading_sm_bp_07_line_height-slate3: 130%;
  --font_heading_xl_bp_07_font_size-slate3: 34.56px;
  --font_heading_xl_bp_07_line_height-slate3: 130%;
  --font_heading_xs_bp_07_font_size-slate3: 17.667px;
  --font_heading_xs_bp_07_line_height-slate3: 130%;
  --font_indicator_code_bp_07_font_size-slate3: 17.667px;
  --font_indicator_code_bp_07_line_height-slate3: 130%;
  --font_indicator_sm_bp_07_font_size-slate3: 14.889px;
  --font_indicator_sm_bp_07_line_height-slate3: 155%;
  --font_indicator_sm_low_bp_07_font_size-slate3: 14.889px;
  --font_indicator_sm_low_bp_07_line_height-slate3: 155%;
  --font_input_inline_bp_07_font_size-slate3: 21px;
  --font_input_inline_bp_07_line_height-slate3: 150%;
  --font_input_inline_sm_bp_07_font_size-slate3: 17.667px;
  --font_input_inline_sm_bp_07_line_height-slate3: 150%;
  --font_input_inset_bp_07_font_size-slate3: 21px;
  --font_input_inset_bp_07_line_height-slate3: 150%;
  --font_input_inset_high_bp_07_font_size-slate3: 21px;
  --font_input_inset_high_bp_07_line_height-slate3: 150%;
  --font_input_inset_segment_bp_07_font_size-slate3: 25px;
  --font_input_inset_segment_bp_07_line_height-slate3: 150%;
  --font_input_stacked_bp_07_font_size-slate3: 21px;
  --font_input_stacked_bp_07_line_height-slate3: 150%;
  --font_metadata_sm_bp_07_font_size-slate3: 14.889px;
  --font_metadata_sm_bp_07_line_height-slate3: 131%;
  --font_metadata_sm_high_bp_07_font_size-slate3: 14.889px;
  --font_metadata_sm_high_bp_07_line_height-slate3: 131%;
}

