@ebay/skin/dist/bundles/skin-full.css

Skin - CSS modules that represent the brand eBay

@charset "UTF-8";
/*!
Skin
Copyright 2017 eBay! Inc. All rights reserved.
Licensed under the BSD License.
https://github.com/eBay/skin/blob/master/LICENSE.txt
*/
:root{
  --border-radius-50:8px;
  --border-radius-100:16px;
  --border-radius-150:24px;
  --color-neutral-100:#fff;
  --color-neutral-100-rgb:255, 255, 255;
  --color-neutral-200:#f7f7f7;
  --color-neutral-200-rgb:247, 247, 247;
  --color-neutral-300:#e5e5e5;
  --color-neutral-400:#c7c7c7;
  --color-neutral-500:#8f8f8f;
  --color-neutral-600:#707070;
  --color-neutral-700:#363636;
  --color-neutral-800:#191919;
  --color-neutral-800-rgb:25, 25, 25;
  --color-neutral-900:#000;
  --color-neutral-900-rgb:0, 0, 0;
  --color-orange-100:#fffaf5;
  --color-orange-200:#ffead3;
  --color-orange-300:#ffc382;
  --color-orange-400:#ff8806;
  --color-orange-500:#ec7303;
  --color-orange-600:#c15100;
  --color-orange-700:#562501;
  --color-orange-800:#2f1604;
  --color-coral-100:#fff7f5;
  --color-coral-200:#ffe1d7;
  --color-coral-300:#ffa78a;
  --color-coral-400:#ff6a38;
  --color-coral-500:#f3511b;
  --color-coral-600:#d03706;
  --color-coral-700:#5e1d08;
  --color-coral-800:#2f0e04;
  --color-red-100:#fff5f5;
  --color-red-200:#ffdede;
  --color-red-300:#ffa0a0;
  --color-red-400:#ff5c5c;
  --color-red-500:#f02d2d;
  --color-red-600:#d50b0b;
  --color-red-700:#570303;
  --color-red-800:#2a0303;
  --color-pink-100:#fef6fa;
  --color-pink-200:#fcdcec;
  --color-pink-300:#f79cc8;
  --color-pink-400:#f155a0;
  --color-pink-500:#de458e;
  --color-pink-600:#a51359;
  --color-pink-700:#4b112d;
  --color-pink-800:#360606;
  --color-indigo-100:#f5fbff;
  --color-indigo-200:#d3effe;
  --color-indigo-300:#80d0fd;
  --color-indigo-400:#0aa7ff;
  --color-indigo-500:#0099f0;
  --color-indigo-600:#0364ab;
  --color-indigo-700:#003c66;
  --color-indigo-800:#01193d;
  --color-blue-100:#f5f9ff;
  --color-blue-200:#d4e5fe;
  --color-blue-300:#93c9ff;
  --color-blue-400:#659eff;
  --color-blue-500:#3665f3;
  --color-blue-600:#382aef;
  --color-blue-650:#003aa5;
  --color-blue-700:#002a69;
  --color-blue-800:#19133a;
  --color-violet-100:#f6f5fe;
  --color-violet-200:#e2ddfd;
  --color-violet-300:#ad9efa;
  --color-violet-400:#836bff;
  --color-violet-500:#583aee;
  --color-violet-600:#3b1fc6;
  --color-violet-700:#271a68;
  --color-violet-800:#20092b;
  --color-lilac-100:#faf5fe;
  --color-lilac-200:#efddfd;
  --color-lilac-300:#cc9ef0;
  --color-lilac-400:#b56bf0;
  --color-lilac-500:#8935cb;
  --color-lilac-600:#631f99;
  --color-lilac-700:#3e135f;
  --color-lilac-800:#2f041e;
  --color-green-100:#fbfef6;
  --color-green-200:#f0fce1;
  --color-green-300:#d5f6aa;
  --color-green-400:#aaed56;
  --color-green-500:#92c821;
  --color-green-600:#507d17;
  --color-green-700:#345110;
  --color-green-800:#1c2d06;
  --color-jade-100:#f7fdfd;
  --color-jade-200:#d8f8ee;
  --color-jade-300:#8feace;
  --color-jade-400:#1ed49e;
  --color-jade-500:#1ed49e;
  --color-jade-600:#0f805e;
  --color-jade-700:#055743;
  --color-jade-800:#002b20;
  --color-kiwi-100:#f6fef6;
  --color-kiwi-200:#e0fae0;
  --color-kiwi-300:#a6f0a5;
  --color-kiwi-400:#4ce160;
  --color-kiwi-500:#3cc14e;
  --color-kiwi-600:#288034;
  --color-kiwi-700:#1b561a;
  --color-kiwi-800:#0c310d;
  --color-marigold-100:#fffbf5;
  --color-marigold-200:#fff0d3;
  --color-marigold-300:#ffd480;
  --color-marigold-400:#ffa800;
  --color-marigold-500:#e99a02;
  --color-marigold-600:#a36302;
  --color-marigold-700:#562f01;
  --color-marigold-800:#2f1b04;
  --color-yellow-100:#fffcf5;
  --color-yellow-200:#fff8d5;
  --color-yellow-300:#ffe58a;
  --color-yellow-400:#ffbd14;
  --color-yellow-500:#eebb04;
  --color-yellow-600:#855f00;
  --color-yellow-700:#553b06;
  --color-yellow-800:#312102;
  --color-dijon-100:#fffdf5;
  --color-dijon-200:#fcf9de;
  --color-dijon-300:#faef8a;
  --color-dijon-400:#f6e016;
  --color-dijon-500:#e8d20c;
  --color-dijon-600:#766f28;
  --color-dijon-700:#524500;
  --color-dijon-800:#2e2400;
  --color-teal-100:#f7fdfd;
  --color-teal-200:#d7f4f6;
  --color-teal-300:#8edfe5;
  --color-teal-400:#44ccd5;
  --color-teal-500:#1bbfca;
  --color-teal-600:#006f93;
  --color-teal-700:#07465a;
  --color-teal-800:#04252f;
  --color-avocado-100:#fdfef6;
  --color-avocado-200:#f8fcde;
  --color-avocado-300:#e9f5a0;
  --color-avocado-400:#e3f13c;
  --color-avocado-500:#c1d737;
  --color-avocado-600:#68770d;
  --color-avocado-700:#4e4e0c;
  --color-avocado-800:#282306;
  --color-ai-solid-green-strong:#4ee04b;
  --color-ai-solid-green-subtle:#f1fdf1;
  --color-ai-solid-green-subtle-dark:#112611;
  --color-ai-solid-blue-strong:#0968f6;
  --color-ai-solid-blue-subtle:#f0f6fe;
  --color-ai-solid-blue-subtle-dark:#112c31;
  --color-ai-solid-purple-strong:#993ee0;
  --color-ai-solid-purple-subtle:#f9f3fd;
  --color-ai-solid-purple-subtle-dark:#20172f;
  --color-ai-solid-red-strong:#ff4242;
  --color-ai-solid-red-subtle:#fff4f4;
  --color-ai-solid-red-subtle-dark:#321919;
  --color-ai-solid-yellow-strong:#ffd80e;
  --opacity-50:0.04;
  --opacity-100:0.08;
  --opacity-150:0.12;
  --opacity-200:0.16;
  --font-size-10:0.625rem;
  --font-size-12:0.75rem;
  --font-size-14:0.875rem;
  --font-size-16:1rem;
  --font-size-18:1.125rem;
  --font-size-20:1.25rem;
  --font-size-24:1.5rem;
  --font-size-30:1.875rem;
  --font-size-36:2.25rem;
  --font-size-46:2.875rem;
  --font-size-64:4rem;
  --font-size-smallest:var(--font-size-10);
  --font-size-small:var(--font-size-12);
  --font-size-default:var(--font-size-14);
  --font-size-medium:var(--font-size-16);
  --font-size-large-1:var(--font-size-20);
  --font-size-large-2:var(--font-size-24);
  --font-size-giant-1:var(--font-size-30);
  --font-size-giant-2:var(--font-size-36);
  --font-size-giant-3:var(--font-size-46);
  --font-size-giant-4:var(--font-size-64);
  --font-line-height-250:1.4286;
  --font-weight-regular:500;
  --font-weight-bold:700;
  --spacing-25:2px;
  --spacing-50:4px;
  --spacing-75:6px;
  --spacing-100:8px;
  --spacing-125:10px;
  --spacing-150:12px;
  --spacing-200:16px;
  --spacing-250:20px;
  --spacing-300:24px;
  --spacing-400:32px;
  --spacing-450:36px;
  --spacing-600:48px;
  --spacing-700:56px;
  --spacing-800:64px;
  --color-background-primary:var(--color-neutral-100);
  --color-background-secondary:var(--color-neutral-200);
  --color-background-tertiary:var(--color-neutral-300);
  --color-background-faint:rgba(var(--color-neutral-900-rgb), 0.05);
  --color-background-disabled:var(--color-neutral-400);
  --color-background-inverse:var(--color-neutral-700);
  --color-background-attention:var(--color-red-600);
  --color-background-confirmation:var(--color-kiwi-600);
  --color-background-information:var(--color-blue-500);
  --color-background-education:var(--color-blue-100);
  --color-background-accent:var(--color-blue-500);
  --color-background-invalid:var(--color-red-200);
  --color-background-elevated:var(--color-neutral-100);
  --color-background-strong:var(--color-neutral-800);
  --color-background-strong-rgb:var(--color-neutral-800-rgb);
  --color-foreground-primary:var(--color-neutral-800);
  --color-foreground-secondary:var(--color-neutral-600);
  --color-foreground-disabled:var(--color-neutral-400);
  --color-foreground-attention:var(--color-red-600);
  --color-foreground-confirmation:var(--color-kiwi-600);
  --color-foreground-information:var(--color-blue-500);
  --color-foreground-accent:var(--color-blue-500);
  --color-foreground-visited:var(--color-pink-600);
  --color-foreground-on-primary:var(--color-neutral-800);
  --color-foreground-on-secondary:var(--color-neutral-800);
  --color-foreground-on-disabled:var(--color-neutral-300);
  --color-foreground-on-inverse:var(--color-neutral-100);
  --color-foreground-on-accent:var(--color-neutral-100);
  --color-foreground-on-attention:var(--color-neutral-100);
  --color-foreground-on-confirmation:var(--color-neutral-100);
  --color-foreground-on-information:var(--color-neutral-100);
  --color-foreground-on-strong:var(--color-neutral-100);
  --color-foreground-link-visited:var(--color-pink-600);
  --color-foreground-link-legal:var(--color-blue-650);
  --color-foreground-link-primary:var(--color-foreground-primary);
  --color-stroke-default:var(--color-neutral-500);
  --color-stroke-accent:var(--color-blue-500);
  --color-stroke-on-accent:var(--color-neutral-100);
  --color-stroke-attention:var(--color-red-600);
  --color-stroke-on-attention:var(--color-neutral-100);
  --color-stroke-confirmation:var(--color-kiwi-600);
  --color-stroke-on-confirmation:var(--color-neutral-100);
  --color-stroke-information:var(--color-blue-500);
  --color-stroke-disabled:var(--color-neutral-400);
  --color-stroke-on-disabled:var(--color-neutral-100);
  --color-stroke-strong:var(--color-neutral-800);
  --color-stroke-inverse:var(--color-neutral-100);
  --color-stroke-subtle:var(--color-neutral-300);
  --color-state-visited:var(--color-pink-600);
  --color-state-focus-stroke:#005fcc;
  --color-state-primary-hover:#f5f5f5;
  --color-state-primary-active:#ebebeb;
  --color-state-secondary-hover:#ededed;
  --color-state-secondary-hover-rgb:237, 237, 237;
  --color-state-secondary-active:#e3e3e3;
  --color-state-secondary-active-rgb:227, 227, 227;
  --color-state-inverse-hover:#343434;
  --color-state-inverse-active:#323232;
  --color-state-accent-hover:#2854d9;
  --color-state-hover-foreground-on-secondary:#3461e9;
  --color-state-accent-active:#254fd2;
  --color-state-active-foreground-on-secondary:#3461e9;
  --color-state-attention-hover:#d70f38;
  --color-state-attention-active:#d70f38;
  --color-state-hover-foreground-on-secondary-desctructive:#d70f38;
  --color-state-active-foreground-on-secondary-desctructive:#d70f38;
  --color-data-viz-grid:var(--color-neutral-300);
  --color-data-viz-labels:var(--color-neutral-800);
  --color-data-viz-legend:var(--color-neutral-600);
  --color-data-viz-legend-inactive:var(--color-neutral-400);
  --color-data-viz-legend-hover:var(--color-neutral-800);
  --color-data-viz-line-chart-primary:var(--color-blue-500);
  --color-data-viz-line-chart-secondary:var(--color-violet-700);
  --color-data-viz-line-chart-tertiary:var(--color-teal-600);
  --color-data-viz-line-chart-queternary:var(--color-pink-500);
  --color-data-viz-line-chart-quinary:var(--color-pink-600);
  --color-data-viz-trend-positive:var(--color-kiwi-600);
  --color-data-viz-trend-negative:var(--color-red-600);
  --color-data-viz-chart-primary:var(--color-blue-500);
  --color-data-viz-chart-secondary:var(--color-blue-700);
  --color-data-viz-chart-tertiary-background:var(--color-indigo-200);
  --color-data-viz-chart-tertiary-stroke:var(--color-blue-500);
  --color-data-viz-chart-quaternary-background:var(--color-teal-300);
  --color-data-viz-chart-quaternary-stroke:var(--color-teal-600);
  --color-data-viz-chart-quinary-background:var(--color-teal-200);
  --color-data-viz-chart-quinary-stroke:var(--color-teal-600);
  --color-data-viz-tooltip-shadow-primary:#00000026;
  --color-data-viz-tooltip-shadow-secondary:#0000002b;
  --color-scrim-image:rgba(0, 0, 0, 0.04);
  --color-scrim-background:rgba(0, 0, 0, 0.32);
  --color-marketing-lime-foreground-4:var(--color-green-700);
  --color-marketing-lime-background-4:var(--color-avocado-500);
  --color-marketing-green-foreground-3:var(--color-kiwi-700);
  --color-marketing-green-background-3:var(--color-kiwi-400);
  --color-marketing-teal-foreground-3:var(--color-teal-7);
  --color-marketing-teal-background-3:var(--color-teal-400);
  --color-marketing-teal-foreground-5:var(--color-neutral-100);
  --color-marketing-teal-background-5:var(--color-teal-600);
  --color-marketing-yellow-foreground-3:var(--color-marigold-700);
  --color-marketing-yellow-background-3:var(--color-yellow-400);
  --color-marketing-orange-foreground-3:var(--color-coral-700);
  --color-marketing-orange-background-3:var(--color-coral-400);
  --color-marketing-magenta-foreground-4:var(--color-neutral-100);
  --color-marketing-magenta-background-4:var(--color-pink-400);
  --state-layer-focus:rgba(var(--color-neutral-900-rgb), var(--opacity-50));
  --state-layer-hover:rgba(var(--color-neutral-900-rgb), var(--opacity-50));
  --state-layer-pressed:rgba(
      var(--color-neutral-900-rgb),
      var(--opacity-100)
  );
  --state-layer-drag:rgba(var(--color-neutral-900-rgb), var(--opacity-150));
  --color-ai-gradient-full-spectrum:linear-gradient(
      223deg,
      var(--color-ai-solid-yellow-strong) 9.79%,
      var(--color-ai-solid-red-strong) 26.69%,
      var(--color-ai-solid-purple-strong) 41.82%,
      var(--color-ai-solid-blue-strong) 56.17%,
      var(--color-ai-solid-green-strong) 78.48%
  );
  --color-ai-gradient-green-strong:linear-gradient(
      270deg,
      var(--color-ai-solid-green-strong) 0%,
      #44cf63 25%,
      var(--color-ai-solid-blue-strong) 100%
  );
  --color-ai-gradient-blue-strong:linear-gradient(
      270deg,
      var(--color-ai-solid-green-strong) 0%,
      var(--color-ai-solid-blue-strong) 55.62%,
      #5751ea 75.7%,
      var(--color-ai-solid-purple-strong) 100%
  );
  --color-ai-gradient-purple-strong:linear-gradient(
      270deg,
      var(--color-ai-solid-purple-strong) 0%,
      var(--color-ai-solid-red-strong) 100%
  );
  --color-ai-gradient-purple-subtle:linear-gradient(
      270deg,
      var(--color-ai-solid-purple-subtle) 0%,
      var(--color-ai-solid-red-subtle) 100%
  );
  --color-ai-gradient-blue-subtle:linear-gradient(
      270deg,
      var(--color-ai-solid-green-subtle) -36%,
      var(--color-ai-solid-blue-subtle) -46.87%,
      var(--color-ai-solid-purple-subtle) 113%
  );
  --color-ai-gradient-green-subtle:linear-gradient(
      270deg,
      var(--color-ai-solid-green-subtle) 0%,
      var(--color-ai-solid-blue-subtle) 154.5%
  );
  --shadow-subtle:0px 4px 12px 0px rgba(0, 0, 0, 0.07);
  --shadow-strong:0px 5px 17px 0px rgba(0, 0, 0, 0.2), 0px 2px 7px 0px rgba(0, 0, 0, 0.15);
  --color-loading-overlay:var(--color-neutral-100-rgb), 0.7;
  --color-loading-fill:#ededed;
  --color-loading-shimmer:linear-gradient(
      270deg,
      var(--color-loading-fill) 0%,
      var(--color-loading-fill) 34%,
      #f8f8f8 50%,
      var(--color-loading-fill) 66%,
      var(--color-loading-fill) 100%
  );
  --color-loading-fill-on-secondary:#e4e4e4;
  --color-loading-shimmer-on-secondary:linear-gradient(
      270deg,
      var(--color-loading-fill-on-secondary) 0%,
      var(--color-loading-fill-on-secondary) 34%,
      #ededed 50%,
      var(--color-loading-fill-on-secondary) 66%,
      var(--color-loading-fill-on-secondary) 100%
  );
  --color-loading-ai-gradient-purple-subtle:linear-gradient(
      270deg,
      var(--color-ai-solid-red-subtle) 0%,
      var(--color-ai-solid-red-subtle) 34%,
      var(--color-ai-solid-purple-subtle) 50%,
      var(--color-ai-solid-red-subtle) 66%,
      var(--color-ai-solid-red-subtle) 100%
  );
  --color-loading-ai-gradient-blue-subtle:linear-gradient(
      270deg,
      var(--color-ai-solid-blue-subtle) 0%,
      var(--color-ai-solid-blue-subtle) 34%,
      var(--color-ai-solid-purple-subtle) 50%,
      var(--color-ai-solid-blue-subtle) 66%,
      var(--color-ai-solid-blue-subtle) 100%
  );
  --color-loading-ai-gradient-green-subtle:linear-gradient(
      270deg,
      var(--color-ai-solid-green-subtle) 0%,
      var(--color-ai-solid-green-subtle) 34%,
      var(--color-ai-solid-blue-subtle) 50%,
      var(--color-ai-solid-green-subtle) 66%,
      var(--color-ai-solid-green-subtle) 100%
  );
  --color-media-disabled-filter:grayscale(1) opacity(0.25);
  --motion-easing-standard:cubic-bezier(0.3, 0, 0, 1);
  --motion-easing-quick-enter:cubic-bezier(0, 0, 0, 1);
  --motion-easing-quick-exit:cubic-bezier(1, 0, 0, 1);
  --motion-easing-soft-enter:cubic-bezier(0, 0, 0.7, 1);
  --motion-easing-soft-exit:cubic-bezier(0.3, 0, 1, 1);
  --motion-easing-continuous:cubic-bezier(0.3, 0, 0.7, 1);
  --motion-easing-bounce:cubic-bezier(0.3, 0, 0, 1.5);
  --motion-easing-linear:cubic-bezier(0, 0, 1, 1);
  --motion-duration-instant:17ms;
  --motion-duration-short-1:50ms;
  --motion-duration-short-2:83ms;
  --motion-duration-short-3:167ms;
  --motion-duration-medium-1:250ms;
  --motion-duration-medium-2:333ms;
  --motion-duration-medium-3:500ms;
  --motion-duration-long-1:667ms;
  --motion-duration-long-2:883ms;
  --motion-duration-long-3:1000ms;
  --font-line-height-default:var(--font-line-height-250);
}

@media (prefers-color-scheme:dark){
  :root{
    --color-background-primary:var(--color-neutral-900);
    --color-background-secondary:var(--color-neutral-800);
    --color-background-tertiary:var(--color-neutral-700);
    --color-background-faint:rgba(var(--color-neutral-100-rgb), 0.05);
    --color-background-disabled:var(--color-neutral-600);
    --color-background-inverse:var(--color-neutral-300);
    --color-background-attention:var(--color-red-400);
    --color-background-confirmation:var(--color-kiwi-500);
    --color-background-information:var(--color-blue-500);
    --color-background-education:var(--color-indigo-800);
    --color-background-accent:var(--color-blue-400);
    --color-background-invalid:var(--color-red-200);
    --color-background-elevated:var(--color-neutral-800);
    --color-background-strong:var(--color-neutral-200);
    --color-background-strong-rgb:var(--color-neutral-200-rgb);
    --color-foreground-primary:var(--color-neutral-200);
    --color-foreground-secondary:var(--color-neutral-500);
    --color-foreground-disabled:var(--color-neutral-500);
    --color-foreground-attention:var(--color-red-400);
    --color-foreground-confirmation:var(--color-kiwi-500);
    --color-foreground-information:var(--color-blue-400);
    --color-foreground-accent:var(--color-blue-400);
    --color-foreground-visited:var(--color-pink-500);
    --color-foreground-on-primary:var(--color-neutral-200);
    --color-foreground-on-secondary:var(--color-neutral-200);
    --color-foreground-on-disabled:var(--color-neutral-600);
    --color-foreground-on-inverse:var(--color-neutral-800);
    --color-foreground-on-accent:var(--color-neutral-800);
    --color-foreground-on-attention:var(--color-neutral-800);
    --color-foreground-on-confirmation:var(--color-neutral-800);
    --color-foreground-on-information:var(--color-neutral-800);
    --color-foreground-on-strong:var(--color-neutral-800);
    --color-foreground-link-visited:var(--color-pink-400);
    --color-foreground-link-legal:var(--color-blue-400);
    --color-foreground-link-primary:var(--color-foreground-primary);
    --color-stroke-default:var(--color-neutral-600);
    --color-stroke-accent:var(--color-blue-400);
    --color-stroke-on-accent:var(--color-neutral-800);
    --color-stroke-attention:var(--color-red-400);
    --color-stroke-on-attention:var(--color-neutral-800);
    --color-stroke-confirmation:var(--color-kiwi-600);
    --color-stroke-on-confirmation:var(--color-neutral-800);
    --color-stroke-information:var(--color-blue-400);
    --color-stroke-disabled:var(--color-neutral-500);
    --color-stroke-on-disabled:var(--color-neutral-800);
    --color-stroke-strong:var(--color-neutral-100);
    --color-stroke-subtle:var(--color-neutral-600);
    --color-stroke-inverse:var(--color-neutral-800);
    --color-state-visited:var(--color-magenta-3);
    --color-state-primary-hover:#17212c;
    --color-state-primary-active:#1e2a38;
    --color-state-secondary-hover:#3e3e3e;
    --color-state-secondary-hover-rgb:62, 62, 62;
    --color-state-secondary-active:#464646;
    --color-state-secondary-active-rgb:70, 70, 70;
    --color-state-inverse-hover:#f7f7f7;
    --color-state-inverse-active:#f8f8f8;
    --color-state-accent-hover:#6ba2ff;
    --color-state-hover-foreground-on-secondary:#6ba2ff;
    --color-state-accent-active:#71a6ff;
    --color-state-active-foreground-on-secondary:#6ba2ff;
    --color-state-attention-hover:#ff6988;
    --color-state-attention-active:#ff6383;
    --color-state-hover-foreground-on-secondary-desctructive:#ff6988;
    --color-state-active-foreground-on-secondary-desctructive:#ff6383;
    --color-data-viz-grid:var(--color-neutral-400);
    --color-data-viz-labels:var(--color-neutral-500);
    --color-data-viz-legend:var(--color-neutral-300);
    --color-data-viz-legend-inactive:var(--color-neutral-500);
    --color-data-viz-legend-hover:var(--color-neutral-100);
    --color-data-viz-line-chart-primary:var(--color-blue-400);
    --color-data-viz-line-chart-secondary:var(--color-indigo-200);
    --color-data-viz-line-chart-tertiary:var(--color-teal-400);
    --color-data-viz-line-chart-queternary:var(--color-pink-400);
    --color-data-viz-line-chart-quinary:var(--color-pink-300);
    --color-data-viz-trend-positive:var(--color-kiwi-500);
    --color-data-viz-trend-negative:var(--color-red-400);
    --color-data-viz-chart-primary:var(--color-blue-500);
    --color-data-viz-chart-secondary:var(--color-blue-300);
    --color-data-viz-chart-tertiary-background:var(--color-blue-6);
    --color-data-viz-chart-tertiary-stroke:var(--color-blue-400);
    --color-data-viz-chart-quaternary-background:var(--color-teal-600);
    --color-data-viz-chart-quaternary-stroke:var(--color-teal-400);
    --color-data-viz-chart-quinary-background:var(--color-teal-7);
    --color-data-viz-chart-quinary-stroke:var(--color-teal-400);
    --color-data-viz-tooltip-shadow-primary:#ffffff26;
    --color-data-viz-tooltip-shadow-secondary:#ffffff2b;
    --color-scrim-image:rgba(255, 255, 255, 0.12);
    --color-scrim-background:rgba(0, 0, 0, 0.64);
    --state-layer-focus:rgba(
        var(--color-neutral-100-rgb),
        var(--opacity-50)
    );
    --state-layer-hover:rgba(
        var(--color-neutral-100-rgb),
        var(--opacity-50)
    );
    --state-layer-pressed:rgba(
        var(--color-neutral-100-rgb),
        var(--opacity-100)
    );
    --state-layer-drag:rgba(
        var(--color-neutral-100-rgb),
        var(--opacity-150)
    );
    --color-ai-solid-green-subtle:#112611;
    --color-ai-solid-blue-subtle:#112c31;
    --color-ai-solid-purple-subtle:#20172f;
    --color-ai-solid-red-subtle:#321919;
    --color-ai-gradient-full-spectrum:linear-gradient(
        223deg,
        var(--color-ai-solid-yellow-strong) 9.79%,
        var(--color-ai-solid-red-strong) 26.69%,
        var(--color-ai-solid-purple-strong) 41.82%,
        var(--color-ai-solid-blue-strong) 56.17%,
        var(--color-ai-solid-green-strong) 78.48%
    );
    --color-ai-gradient-green-strong:linear-gradient(
        270deg,
        var(--color-ai-solid-green-strong) 0%,
        #44cf63 25%,
        var(--color-ai-solid-blue-strong) 100%
    );
    --color-ai-gradient-blue-strong:linear-gradient(
        270deg,
        var(--color-ai-solid-green-strong) 0%,
        var(--color-ai-solid-blue-strong) 55.62%,
        #5751ea 75.7%,
        var(--color-ai-solid-purple-strong) 100%
    );
    --color-ai-gradient-purple-strong:linear-gradient(
        270deg,
        var(--color-ai-solid-purple-strong) 0%,
        var(--color-ai-solid-red-strong) 100%
    );
    --color-ai-gradient-purple-subtle:linear-gradient(
        270deg,
        var(--color-ai-solid-purple-subtle) 0%,
        var(--color-ai-solid-red-subtle) 100%
    );
    --color-ai-gradient-blue-subtle:linear-gradient(
        270deg,
        var(--color-ai-solid-green-subtle) -36%,
        var(--color-ai-solid-blue-subtle) -46.87%,
        var(--color-ai-solid-purple-subtle) 113%
    );
    --color-ai-gradient-green-subtle:linear-gradient(
        270deg,
        var(--color-ai-solid-green-subtle) 0%,
        var(--color-ai-solid-blue-subtle) 154.5%
    );
    --color-loading-overlay:var(--color-neutral-900-rgb), 0.7;
    --color-loading-fill:#2d2d2d;
    --color-loading-shimmer:linear-gradient(
        270deg,
        var(--color-loading-fill) 0%,
        var(--color-loading-fill) 34%,
        #1b1b1b 50%,
        var(--color-loading-fill) 66%,
        var(--color-loading-fill) 100%
    );
    --color-loading-fill-on-secondary:#353535;
    --color-loading-shimmer-on-secondary:linear-gradient(
        270deg,
        var(--color-loading-fill-on-secondary) 0%,
        var(--color-loading-fill-on-secondary) 34%,
        #232323 50%,
        var(--color-loading-fill-on-secondary) 66%,
        var(--color-loading-fill-on-secondary) 100%
    );
    --color-loading-ai-gradient-purple-subtle:linear-gradient(
        270deg,
        var(--color-ai-solid-red-subtle-dark) 0%,
        var(--color-ai-solid-red-subtle-dark) 34%,
        var(--color-ai-solid-purple-subtle-dark) 50%,
        var(--color-ai-solid-red-subtle-dark) 66%,
        var(--color-ai-solid-red-subtle-dark) 100%
    );
    --color-loading-ai-gradient-blue-subtle:linear-gradient(
        270deg,
        var(--color-ai-solid-blue-subtle-dark) 0%,
        var(--color-ai-solid-blue-subtle-dark) 34%,
        var(--color-ai-solid-purple-subtle-dark) 50%,
        var(--color-ai-solid-blue-subtle-dark) 66%,
        var(--color-ai-solid-blue-subtle-dark) 100%
    );
    --color-loading-ai-gradient-green-subtle:linear-gradient(
        270deg,
        var(--color-ai-solid-green-subtle-dark) 0%,
        var(--color-ai-solid-green-subtle-dark) 34%,
        var(--color-ai-solid-blue-subtle-dark) 50%,
        var(--color-ai-solid-green-subtle-dark) 66%,
        var(--color-ai-solid-green-subtle-dark) 100%
    );
  }
}
@font-face{
  font-display:swap;
  font-family:Market Sans;
  font-style:normal;
  font-weight:400;
  src:url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Regular-WebS.eot);
  src:url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Regular-WebS.eot?#iefix) format("embedded-opentype"), url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Regular-WebS.woff2) format("woff2"), url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Regular-WebS.woff) format("woff"), url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Regular-WebS.ttf) format("truetype"), url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Regular-WebS.svg#MarketSans-Regular-WebS) format("svg");
}
@font-face{
  font-display:swap;
  font-family:Market Sans;
  font-style:normal;
  font-weight:700;
  src:url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Bold-WebS.eot);
  src:url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Bold-WebS.eot?#iefix) format("embedded-opentype"), url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Bold-WebS.woff2) format("woff2"), url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Bold-WebS.woff) format("woff"), url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Bold-WebS.ttf) format("truetype"), url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Bold-WebS.svg#MarketSans-Bold-WebS) format("svg");
}
body{
  background-color:var(--color-background-primary);
  color:var(--color-foreground-primary);
  font-family:Market Sans,Arial,sans-serif;
  font-size:var(--font-size-default);
  line-height:var(--font-line-height-default);
  -webkit-text-size-adjust:100%;
}

fieldset{
  border:0;
  padding:0;
}

legend{
  margin-bottom:var(--spacing-100);
}

a{
  color:var(--link-foreground-color-default, var(--color-foreground-link-primary));
}
a:visited{
  color:var(--link-foreground-color-visited, var(--color-foreground-link-visited));
}
a:hover{
  color:var(--link-foreground-color-hover, var(--color-foreground-secondary));
}
a:not([href]),a[aria-disabled=true]{
  color:var(--link-forground-color-disabled, var(--color-foreground-disabled));
}
.clearfix:after,.clearfix:before{
  content:" ";
  display:table;
  line-height:0;
}
.clearfix:after{
  clear:both;
}
.clipped{
  border:0;
  clip:rect(1px, 1px, 1px, 1px);
  height:1px;
  overflow:hidden;
  padding:0;
  position:absolute;
  white-space:nowrap;
  width:1px;
}
.clipped--stealth:focus{
  clip:auto;
  height:auto;
  overflow:visible;
  white-space:normal;
  width:auto;
}
.image-stretch{
  height:auto;
  width:100%;
}
.image-scale{
  height:auto;
  max-width:100%;
}
.image-center{
  display:table-cell;
  text-align:center;
  vertical-align:middle;
}
.image-center img{
  max-height:100%;
  max-width:100%;
}
.image-treatment{
  align-items:center;
  border-radius:8px;
  display:flex;
  justify-content:center;
  overflow:hidden;
  position:relative;
}
.image-treatment:after{
  background:rgba(0, 0, 0, .05);
  bottom:0;
  content:"";
  display:block;
  left:0;
  pointer-events:none;
  position:absolute;
  right:0;
  top:0;
}
.image-treatment>img{
  display:inline-block;
  max-height:100%;
  max-width:100%;
  object-fit:contain;
}
.image-treatment-large{
  align-items:center;
  border-radius:16px;
  display:flex;
  justify-content:center;
  overflow:hidden;
  position:relative;
}
.image-treatment-large:after{
  background:rgba(0, 0, 0, .05);
  bottom:0;
  content:"";
  display:block;
  left:0;
  pointer-events:none;
  position:absolute;
  right:0;
  top:0;
}
.image-treatment-large>img{
  display:inline-block;
  max-height:100%;
  max-width:100%;
  object-fit:contain;
}

.image-disabled{
  filter:var(--color-media-disabled-filter);
}

.text-truncate{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.scrollbars-permanent{
  -webkit-overflow-scrolling:touch;
  scroll-behavior:smooth;
  scroll-snap-type:proximity;
  scroll-snap-type:x proximity;
}

.scrollbars-permanent::-webkit-scrollbar{
  background-color:var(--color-background-faint);
  border-radius:12px;
}

.scrollbars-permanent::-webkit-scrollbar:vertical{
  width:6px;
}

.scrollbars-permanent::-webkit-scrollbar:horizontal{
  height:6px;
}

.scrollbars-permanent::-webkit-scrollbar-thumb{
  background-color:var(--color-foreground-secondary);
  border-color:transparent;
  border-radius:12px;
  border-right-style:inset;
  box-shadow:none;
}
ul.accordion{
  margin:0;
  padding:0;
  width:100%;
}
ul.accordion ::marker{
  font-size:0;
}

ul.accordion li:not(:last-child){
  border-bottom:1px solid var(--color-stroke-subtle);
}

ul.accordion summary.details__summary{
  border-radius:0;
  display:flex;
  font-size:var(--font-size-medium);
  justify-content:space-between;
  min-height:48px;
  padding:12px 16px;
}

ul.accordion summary.details__summary span.details__icon svg{
  fill:var(--details-secondary-foreground-color, var(--color-foreground-secondary));
}

ul.accordion details .details__content{
  margin:0 16px 6px;
  opacity:0;
  transform:scaleY(0);
  transform-origin:top;
  transition:opacity var(--motion-duration-medium-3) var(--motion-easing-standard), transform var(--motion-duration-medium-3) var(--motion-easing-standard);
}

ul.accordion details[open] .details__content{
  opacity:1;
  transform:scaleY(1);
}
ul.accordion details svg.details__expand,ul.accordion details[open] svg.details__collapse{
  display:inline-block;
}

ul.accordion details svg.details__collapse,ul.accordion details[open] svg.details__expand{
  display:none;
}

ul.accordion--large summary.details__summary{
  font-size:var(--font-size-large-1);
  min-height:52px;
}

@media (prefers-reduced-motion){
  ul.accordion details .details__content,ul.accordion details[open] .details__content{
    transition:none;
  }
}
.alert-dialog[role=alertdialog]{
  background-color:var(--dialog-scrim-color-show);
  bottom:0;
  left:0;
  -webkit-overflow-scrolling:touch;
  align-items:flex-start;
  justify-content:center;
  overflow-y:auto;
  position:fixed;
  right:0;
  top:0;
  will-change:background-color;
  z-index:100000;
}
.alert-dialog[role=alertdialog]:not([hidden]){
  display:flex;
}

.alert-dialog__window{
  background-color:var(--dialog-window-background-color, var(--color-background-primary));
  border-radius:var(--lightbox-border-radius, var(--border-radius-150));
  display:flex;
  flex:1 0 auto;
  flex-direction:column;
  margin:auto auto 16px;
  margin-left:var(--spacing-200);
  margin-right:var(--spacing-200);
  max-height:90%;
  max-width:calc(100% - 32px);
  min-height:55px;
  min-width:208px;
  padding:var(--spacing-200);
  will-change:opacity, transform;
}

.alert-dialog__title{
  font-size:var(--font-size-large-1);
  font-weight:var(--font-weight-bold);
  line-height:28px;
  margin:0;
}

.alert-dialog__footer{
  text-align:right;
}

.alert-dialog__main{
  margin:var(--spacing-200) 0;
  min-height:var(--spacing-200);
}
.alert-dialog__main>:first-child{
  margin-top:0;
}
.alert-dialog__main>:last-child{
  margin-bottom:0;
}

.alert-dialog--hide.alert-dialog--mask-fade,.alert-dialog--show.alert-dialog--mask-fade{
  transition:background-color .16s ease-out;
}
.alert-dialog--hide.alert-dialog--mask-fade-slow,.alert-dialog--show.alert-dialog--mask-fade-slow{
  transition:background-color .32s ease-out;
}
.alert-dialog--hide .alert-dialog__window--fade,.alert-dialog--show .alert-dialog__window--fade{
  transition:opacity .16s ease-out;
}

.alert-dialog--hide.alert-dialog--hide,.alert-dialog--hide.alert-dialog--show-init,.alert-dialog--show-init.alert-dialog--hide,.alert-dialog--show-init.alert-dialog--show-init{
  display:flex;
}
.alert-dialog--hide.alert-dialog--mask-fade,.alert-dialog--hide.alert-dialog--mask-fade-slow,.alert-dialog--show-init.alert-dialog--mask-fade,.alert-dialog--show-init.alert-dialog--mask-fade-slow{
  background-color:var(--dialog-scrim-color-hide);
}
.alert-dialog--hide .alert-dialog__window--fade,.alert-dialog--show-init .alert-dialog__window--fade{
  opacity:0;
}

.alert-dialog--hide-init.alert-dialog--hide-init,.alert-dialog--hide-init.alert-dialog--show,.alert-dialog--show.alert-dialog--hide-init,.alert-dialog--show.alert-dialog--show{
  display:flex;
}
.alert-dialog--hide-init.alert-dialog--mask-fade,.alert-dialog--hide-init.alert-dialog--mask-fade-slow,.alert-dialog--show.alert-dialog--mask-fade,.alert-dialog--show.alert-dialog--mask-fade-slow{
  background-color:var(--dialog-scrim-color-show);
}
.alert-dialog--hide-init .alert-dialog__window--fade,.alert-dialog--show .alert-dialog__window--fade{
  opacity:1;
}

@media (min-width:768px){
  .alert-dialog__window{
    border-radius:var(--lightbox-border-radius, var(--border-radius-100));
    margin:auto;
    max-width:calc(88% - var(--spacing-400));
  }
}
@media (min-width:1024px){
  .alert-dialog__window{
    max-width:var(--dialog-lightbox-max-width);
  }
}
.avatar{
  align-items:center;
  border-radius:50%;
  display:inline-flex;
  font-size:var(--font-size-large-2);
  font-weight:var(--font-weight-bold);
  height:48px;
  justify-content:center;
  line-height:48px;
  overflow:hidden;
  position:relative;
  width:48px;
}
.avatar:after{
  background:rgba(0, 0, 0, .05);
  bottom:0;
  content:"";
  display:block;
  left:0;
  pointer-events:none;
  position:absolute;
  right:0;
  top:0;
}
.avatar>img{
  display:inline-block;
  max-height:100%;
  max-width:100%;
  object-fit:contain;
}

.avatar>svg{
  height:100%;
  width:100%;
}

.avatar>img{
  height:48px;
  object-fit:cover;
  width:48px;
}

.avatar--fit>img{
  object-fit:contain;
}

.avatar--teal{
  background-color:#84b4fb;
  color:#002a69;
}

.avatar--light-teal{
  background-color:#44ccd5;
  color:#07465a;
}

.avatar--green{
  background-color:#4ce160;
  color:#1b561a;
}

.avatar--lime{
  background-color:#c1d737;
  color:#4e4e0c;
}

.avatar--yellow{
  background-color:#ffbd14;
  color:#553b06;
}

.avatar--orange{
  background-color:#ff8806;
  color:#562501;
}

.avatar--magenta{
  background-color:#cc9ef0;
  color:#3e135f;
}

.avatar--pink{
  background-color:#f79cc8;
  color:#4b112d;
}

.avatar--32,.avatar--32>img{
  font-size:var(--font-size-medium);
  height:32px;
  line-height:32px;
  width:32px;
}

.avatar--40,.avatar--40>img{
  font-size:var(--font-size-large-1);
  height:40px;
  line-height:40px;
  width:40px;
}

.avatar--48,.avatar--48>img{
  font-size:var(--font-size-large-2);
  height:48px;
  line-height:48px;
  width:48px;
}

.avatar--56,.avatar--56>img{
  font-size:var(--font-size-giant-1);
  height:56px;
  line-height:56px;
  width:56px;
}

.avatar--64,.avatar--64>img{
  font-size:var(--font-size-giant-2);
  height:64px;
  line-height:64px;
  width:64px;
}

.avatar--96,.avatar--96>img{
  font-size:var(--font-size-giant-3);
  height:96px;
  line-height:96px;
  width:96px;
}

.avatar--128,.avatar--128>img{
  font-size:var(--font-size-giant-4);
  height:128px;
  line-height:128px;
  width:128px;
}
.badge{
  align-items:center;
  background-color:var(--badge-background-color, var(--color-background-attention));
  border:2px solid var(--color-stroke-on-attention);
  border-radius:16px;
  color:var(--badge-foreground-color, var(--color-foreground-on-attention));
  display:inline-flex;
  font-size:10px;
  height:16px;
  justify-content:center;
  min-width:8px;
  padding:2px 6px;
  white-space:nowrap;
}
nav.breadcrumbs{
  color:var(--breadcrumbs-item-foreground-color, var(--color-foreground-secondary));
  font-size:var(--font-size-small);
  height:-moz-fit-content;
  height:fit-content;
  margin:8px 0;
  min-height:16px;
  overflow-x:scroll;
  padding:8px;
  scrollbar-width:none;
  white-space:nowrap;
}

nav.breadcrumbs>ul{
  display:inline-block;
  margin:0;
  min-width:100%;
  padding:0;
  right:0;
}
nav.breadcrumbs>ul>li{
  align-items:center;
  display:inline-flex;
  vertical-align:middle;
}

nav.breadcrumbs>ul>li[hidden]{
  display:none;
}

nav.breadcrumbs>ul>li svg{
  margin-left:3px;
  margin-right:3px;
}

nav.breadcrumbs>ul>li svg.icon--12{
  margin-left:var(--spacing-75);
  margin-right:var(--spacing-75);
}

nav.breadcrumbs>ul>li>a{
  text-decoration:none;
}

nav.breadcrumbs>ul>li>button{
  background:none;
  border:none;
  font-family:inherit;
  font-size:1em;
  margin:0;
  padding:0;
}

nav.breadcrumbs>ul>li>a,nav.breadcrumbs>ul>li>button{
  color:inherit;
  max-width:168px;
  outline-offset:5px;
  overflow:hidden;
  text-overflow:ellipsis;
}
nav.breadcrumbs>ul>li>a:focus,nav.breadcrumbs>ul>li>a:hover,nav.breadcrumbs>ul>li>button:focus,nav.breadcrumbs>ul>li>button:hover{
  text-decoration:underline;
}
nav.breadcrumbs>ul>li>a[aria-current],nav.breadcrumbs>ul>li>button[aria-current]{
  color:var(--breadcrumbs-item-current-foreground-color, var(--color-foreground-primary));
  text-decoration:none;
}

nav.breadcrumbs>ul>li>a:focus:not(:focus-visible),nav.breadcrumbs>ul>li>button:focus:not(:focus-visible){
  outline:none;
}
nav.breadcrumbs::-webkit-scrollbar{
  display:none;
}
nav.breadcrumbs.breadcrumb--overflow{
  overflow-x:unset;
  scrollbar-width:unset;
}

nav.breadcrumbs .fake-menu-button__button,nav.breadcrumbs .menu-button__button{
  background-color:var(--icon-button-background-color, var(--color-background-secondary));
  height:var(--spacing-300);
  min-height:var(--spacing-300);
  min-width:var(--spacing-300);
  outline-offset:1px;
  width:var(--spacing-300);
}

nav.breadcrumbs .fake-menu-button__button svg.icon,nav.breadcrumbs .menu-button__button svg.icon{
  fill:var(--breadcrumbs-overflow-foreground-color, var(--color-foreground-secondary));
}

nav.breadcrumbs .fake-menu-button__menu,nav.breadcrumbs .menu-button__menu{
  font-size:var(--font-size-default);
}

[dir=rtl] nav.breadcrumbs svg.icon--12{
  transform:rotate(180deg);
}

@media (min-width:512px){
  nav.breadcrumbs{
    margin:16px 0;
  }
}
a.fake-btn,button.btn{
  background-color:initial;
  border:1px solid;
  border-radius:var(--btn-border-radius, 20px);
  box-sizing:border-box;
  color:inherit;
  display:inline-block;
  font-family:inherit;
  font-size:var(--font-size-default);
  margin:0;
  min-height:40px;
  min-width:88px;
  padding:9.5px 20px;
  text-align:center;
  text-decoration:none;
  vertical-align:bottom;
}
a.fake-btn--fixed-height,a.fake-btn--truncated,button.btn--fixed-height,button.btn--truncated{
  height:40px;
}
a.fake-btn:focus-visible,button.btn:focus-visible{
  outline-offset:var(--spacing-25);
  outline-style:solid;
  outline-width:var(--spacing-25);
}
a.fake-btn:focus:not(:focus-visible),button.btn:focus:not(:focus-visible){
  outline:none;
}

button.btn[aria-disabled=true],button.btn[disabled]{
  border-color:var(--expand-btn-disabled-border-color, var(--color-stroke-disabled));
  color:var(--expand-btn-disabled-foreground-color, var(--color-foreground-disabled));
}

a.fake-btn:not([href]),a.fake-btn[aria-disabled=true]{
  color:var(--link-foreground-color-disabled, var(--color-foreground-disabled));
}

a.fake-btn--borderless,button.btn--borderless{
  border-color:transparent;
  min-width:auto;
  padding-left:0;
  vertical-align:initial;
}
a.fake-btn--borderless:focus,a.fake-btn--borderless:hover,button.btn--borderless:focus,button.btn--borderless:hover{
  background-color:initial;
  outline:none;
  text-decoration:underline;
}

a.fake-btn--borderless[aria-disabled=true],a.fake-btn--borderless[disabled],button.btn--borderless[aria-disabled=true],button.btn--borderless[disabled]{
  border-color:transparent;
}

a.fake-btn--borderless.btn--destructive,button.btn--borderless.btn--destructive{
  color:var(--btn-secondary-destructive-foreground-color, var(--color-foreground-attention));
}

a.fake-btn--slim,button.btn--slim{
  height:40px;
  min-width:auto;
  padding-left:var(--spacing-100);
  padding-right:var(--spacing-100);
}

a.fake-btn:visited{
  color:inherit;
}

a.fake-btn--fluid,button.btn--fluid{
  width:100%;
}

.btn__cell,.fake-btn__cell{
  align-items:center;
  display:flex;
  justify-content:center;
  width:100%;
}
.btn__cell--fixed-height,.fake-btn__cell--fixed-height{
  display:inline-flex;
}
.btn__cell--fixed-height>svg,.fake-btn__cell--fixed-height>svg{
  align-self:baseline;
  max-width:calc(100% - 32px);
}
.btn__cell--truncated,.fake-btn__cell--truncated{
  display:inline-flex;
}
.btn__cell--truncated>svg,.fake-btn__cell--truncated>svg{
  align-self:baseline;
  max-width:calc(100% - 32px);
}

a.fake-btn--borderless .fake-btn__cell,a.fake-btn--form .fake-btn__cell,button.btn--borderless .btn__cell,button.btn--form .btn__cell{
  justify-content:space-between;
}

a.fake-btn svg.icon,button.btn svg.icon{
  align-self:center;
}
a.fake-btn svg.icon:first-child,button.btn svg.icon:first-child{
  margin-inline-end:8px;
}
a.fake-btn svg.icon:last-child,button.btn svg.icon:last-child{
  margin-inline-start:8px;
}
a.fake-btn svg.icon:only-child,button.btn svg.icon:only-child{
  margin:0;
}

a.fake-btn__cell--fixed-height svg.icon,button.btn__cell--fixed-height svg.icon{
  align-self:center;
  height:1rem;
  overflow:visible;
  width:1rem;
}

a.fake-btn--primary,button.btn--primary{
  background-color:var(--btn-primary-background-color, var(--color-background-accent));
  border-color:var(--btn-primary-border-color, var(--color-stroke-accent));
  color:var(--btn-primary-foreground-color, var(--color-foreground-on-accent));
  font-weight:700;
  transition:all var(--motion-duration-short-3) var(--motion-easing-quick-enter);
}
a.fake-btn--primary:active,button.btn--primary:active{
  transform:scale(.97);
}

a.fake-btn--primary{
  outline-color:var(--color-foreground-primary);
}

a.fake-btn--primary:visited{
  color:var(--btn-primary-foreground-color, var(--color-foreground-on-accent));
}

a.fake-btn--primary[href]:focus,a.fake-btn--primary[href]:hover,button.btn--primary:not([disabled],[aria-disabled=true]):focus,button.btn--primary:not([disabled],[aria-disabled=true]):hover{
  background-blend-mode:multiply;
  filter:brightness(96%);
}
a.fake-btn--primary[href]:active,button.btn--primary:not([disabled],[aria-disabled=true]):active{
  filter:brightness(92%);
}

a.fake-btn--primary.fake-btn--destructive,button.btn--primary.btn--destructive{
  background-color:var(--btn-primary-destructive-background-color, var(--color-background-attention));
  border-color:var(--btn-primary-destructive-border-color, var(--color-stroke-attention));
  color:var(--btn-primary-destructive-foreground-color, var(--color-foreground-on-attention));
  font-weight:700;
}

button.btn--primary.btn--destructive[aria-disabled=true],button.btn--primary.btn--destructive[disabled]{
  background-color:var(--btn-primary-destructive-disabled-background, var(--color-background-disabled));
  border-color:var(--btn-primary-destructive-disabled-border, var(--color-stroke-disabled));
}

a.fake-btn--primary.fake-btn--destructive[href]:focus,a.fake-btn--primary.fake-btn--destructive[href]:hover,button.btn--primary.btn--destructive:not([disabled],[aria-disabled=true]):focus,button.btn--primary.btn--destructive:not([disabled],[aria-disabled=true]):hover{
  background-color:var(--color-state-attention-hover);
}
a.fake-btn--primary.fake-btn--destructive[href]:active,button.btn--primary.btn--destructive:not([disabled],[aria-disabled=true]):active{
  background-color:var(--color-state-attention-active);
}

button.btn .progress-spinner{
  height:24px;
  margin:-4px 0;
  width:24px;
}

button.btn--form .progress-spinner{
  margin-left:auto;
  margin-right:auto;
}

button.btn--primary .progress-spinner{
  --color-spinner-icon-background:var(--color-background-primary);
  --color-spinner-icon-foreground:#8fa3f8;
}

button.btn--primary.btn--destructive .progress-spinner{
  --color-spinner-icon-background:var(--color-foreground-on-accent);
  --color-spinner-icon-foreground:#ec7089;
}

a.fake-btn[aria-expanded=true] svg.icon--12,button.btn[aria-expanded=true] svg.icon--12{
  transform:rotate(180deg);
}

a.fake-btn--large svg.icon,button.btn--large svg.icon{
  max-height:22px;
}

a.fake-btn--small svg.icon,button.btn--small svg.icon{
  max-height:20px;
}

button.btn--primary[aria-disabled=true],button.btn--primary[disabled]{
  background-color:var(--btn-primary-disabled-background-color, var(--color-foreground-disabled));
  border-color:var(--btn-primary-disabled-border-color, var(--color-foreground-disabled));
  color:var(--btn-primary-foreground-color, var(--color-foreground-on-accent));
}
button.btn--primary[aria-disabled=true] svg.icon,button.btn--primary[disabled] svg.icon{
  fill:var(--btn-primary-disabled-foreground-color, var(--color-background-primary));
}

a.fake-btn--primary:not([href]),a.fake-btn--primary[aria-disabled=true]{
  background-color:var(--btn-primary-disabled-background-color, var(--color-foreground-disabled));
  border-color:var(--btn-primary-disabled-border-color, var(--color-foreground-disabled));
  color:var(--btn-primary-foreground-color, var(--color-foreground-on-accent));
}

a.fake-btn--secondary,button.btn--secondary{
  background-color:var(--btn-secondary-background-color, transparent);
  border-color:var(--btn-secondary-border-color, var(--color-stroke-accent));
  color:var(--btn-secondary-foreground-color, var(--color-foreground-accent));
  transition:all var(--motion-duration-short-3) var(--motion-easing-quick-enter);
}
a.fake-btn--secondary:active,button.btn--secondary:active{
  transform:scale(.97);
}

a.fake-btn--secondary:visited{
  color:var(--btn-secondary-foreground-color, var(--color-foreground-accent));
}

a.fake-btn--secondary[href]:active,button.btn--secondary:not([disabled],[aria-disabled=true]):active{
  background-color:var(--color-state-primary-active);
  border-color:var(--color-state-active-foreground-on-secondary);
  color:var(--color-state-active-foreground-on-secondary);
}
a.fake-btn--secondary[href]:focus,a.fake-btn--secondary[href]:hover,button.btn--secondary:not([disabled],[aria-disabled=true]):focus,button.btn--secondary:not([disabled],[aria-disabled=true]):hover{
  background-color:var(--color-state-primary-hover);
  border-color:var(--color-state-hover-foreground-on-secondary);
  color:var(--color-state-hover-foreground-on-secondary);
}

a.fake-btn--secondary.fake-btn--destructive,button.btn--secondary.btn--destructive{
  background-color:var(--btn-secondary-destructive-background-color, transparent);
  border-color:var(--btn-secondary-destructive-border-color, var(--color-stroke-attention));
  color:var(--btn-secondary-destructive-foreground-color, var(--color-foreground-attention));
}

a.fake-btn--secondary.fake-btn--destructive[href]:focus,a.fake-btn--secondary.fake-btn--destructive[href]:hover,button.btn--secondary.btn--destructive:not([disabled],[aria-disabled=true]):focus,button.btn--secondary.btn--destructive:not([disabled],[aria-disabled=true]):hover{
  background-color:var(--color-state-primary-hover);
  border-color:var(--color-state-hover-foreground-on-secondary-desctructive);
  color:var(--color-state-hover-foreground-on-secondary-desctructive);
}
a.fake-btn--secondary.fake-btn--destructive[href]:active,button.btn--secondary.btn--destructive:not([disabled],[aria-disabled=true]):active{
  background-color:var(--color-state-primary-active);
  border-color:var(--color-state-active-foreground-on-secondary-desctructive);
  color:var(--color-state-active-foreground-on-secondary-desctructive);
}

button.btn--secondary.btn--destructive .progress-spinner{
  --color-spinner-icon-background:#f39fb0;
  --color-spinner-icon-foreground:#e0103a;
}

button.btn--secondary[aria-disabled=true],button.btn--secondary[disabled]{
  background-color:var(--btn-secondary-disabled-background-color, var(--color-background-primary));
  border-color:var(--btn-secondary-disabled-border-color, var(--color-stroke-disabled));
  color:var(--btn-secondary-disabled-foreground-color, var(--color-background-disabled));
}
button.btn--secondary[aria-disabled=true] svg.icon,button.btn--secondary[disabled] svg.icon{
  fill:var(--btn-secondary-disabled-foreground-color, var(--color-foreground-disabled));
}

a.fake-btn--secondary:not([href]),a.fake-btn--secondary[aria-disabled=true]{
  border-color:var(--btn-secondary-disabled-border-color, var(--color-background-disabled));
  color:var(--btn-secondary-disabled-foreground-color, var(--color-background-disabled));
}

a.fake-btn--tertiary,button.btn--tertiary{
  border-color:var(--btn-tertiary-border-color, var(--color-stroke-default));
  transition:all var(--motion-duration-short-3) var(--motion-easing-quick-enter);
}
a.fake-btn--tertiary:active,button.btn--tertiary:active{
  transform:scale(.97);
}

a.fake-btn--tertiary[href]:focus,a.fake-btn--tertiary[href]:hover,button.btn--tertiary:not([disabled],[aria-disabled=true]):focus,button.btn--tertiary:not([