/* Shared finish for header windows: brushed anthracite, warm gold and clear type. */
:root {
  --yn-metal-text: #f5f4ef;
  --yn-metal-muted: #bcc2c7;
  --yn-metal-gold: #dfc38b;
  --yn-metal-line: #b8c1c52d;
  --yn-metal-card: linear-gradient(145deg, #ffffff0b, #ffffff03), #2b3035;
  --yn-metal-hover: linear-gradient(145deg, #ffffff12, #ffffff04), #343a40;
  --yn-metal-surface: repeating-linear-gradient(115deg, #ffffff02 0 1px, transparent 1px 4px), radial-gradient(ellipse at 10% 0, #b9c4cc12, transparent 60%), linear-gradient(135deg, #32383e, #252a30 58%, #1c2126);
  --yn-metal-shadow: 0 28px 80px #10131766, inset 0 1px 0 #ffffff1a;
}

/* The top bar and its controls use the same finish as the navigation windows. */
.preview-bar {
  background: var(--yn-metal-surface);
  border-bottom: 1px solid #b8c1c51a;
  color: #d6dade;
}
.site-header,
.site-header.is-scrolled {
  background: var(--yn-metal-surface);
  border-bottom-color: #dfc38b45;
  color: var(--yn-metal-text);
  box-shadow: inset 0 1px #ffffff0a, 0 6px 20px #10131720;
}
.site-header.is-scrolled { box-shadow: inset 0 1px #ffffff0a, 0 12px 34px #10131740; }
.site-header .desktop-nav > a,
.site-header .desktop-nav > :is(.shop-nav, .knowledge-nav, .company-nav) > a {
  color: var(--yn-metal-text);
}
.site-header .desktop-nav > a:is(:hover, :focus-visible, .is-active),
.site-header .desktop-nav > :is(.shop-nav, .knowledge-nav, .company-nav) > a:is(:hover, :focus-visible, .is-active) {
  color: var(--yn-metal-gold);
}
.site-header .desktop-nav > a::after { background: var(--yn-metal-gold); }
.site-header .desktop-nav > :is(.shop-nav, .knowledge-nav, .company-nav) > button {
  color: var(--yn-metal-text);
}
.site-header .desktop-nav > :is(.shop-nav, .knowledge-nav, .company-nav) > button:is(:hover, :focus-visible, [aria-expanded="true"]) {
  border-color: #dfc38b55;
  background: #dfc38b15;
  color: var(--yn-metal-gold);
}
.site-header .header-tools :is(.tool, .menu-toggle) {
  border-color: #b8c1c53d;
  background: linear-gradient(145deg, #ffffff0b, #ffffff03);
  color: var(--yn-metal-text);
  box-shadow: inset 0 1px #ffffff08;
}
.site-header .header-tools :is(.tool, .menu-toggle):is(:hover, :focus-visible, [aria-expanded="true"]) {
  border-color: #dfc38b80;
  background: #dfc38b16;
  color: var(--yn-metal-gold);
}
.site-header .header-tools .account-tool[data-account-state="member"] {
  border-color: #dfc38b80;
  background: #dfc38b10;
  color: var(--yn-metal-gold);
}
.site-header .header-tools [data-cart-count] { border-color: #252a30; background: var(--yn-metal-gold); color: #20252a; }
.site-header > .brand:focus-visible,
.site-header .desktop-nav > a:focus-visible,
.site-header .desktop-nav > :is(.shop-nav, .knowledge-nav, .company-nav) > :is(a, button):focus-visible,
.site-header .header-tools :is(.tool, .menu-toggle):focus-visible {
  outline: 2px solid var(--yn-metal-gold);
  outline-offset: 4px;
}

:is(.shop-nav-panel, .knowledge-nav-panel--premium, .company-nav-panel, .account-menu, .language-menu) {
  border-color: #a4adb24d;
  background: var(--yn-metal-surface);
  color: var(--yn-metal-text);
  box-shadow: var(--yn-metal-shadow);
  color-scheme: dark;
  scrollbar-color: #8c9295 #252a30;
}
:is(.shop-nav-panel, .knowledge-nav-panel--premium, .company-nav-panel, .account-menu, .language-menu) :is(a, button):focus-visible {
  outline: 2px solid var(--yn-metal-gold);
  outline-offset: 3px;
}

/* The sports image stays photographic; the surrounding cards share the metal finish. */
.knowledge-nav-panel--premium .knowledge-nav-feature { border: 1px solid #b8c1c529; }
.knowledge-nav-panel--premium .knowledge-nav-heading > div > small,
.knowledge-nav-panel--premium .knowledge-category-icon { color: var(--yn-metal-gold); }
.knowledge-nav-panel--premium .knowledge-nav-heading h2,
.knowledge-nav-panel--premium .knowledge-sport-group > h3 { color: var(--yn-metal-text); }
.knowledge-nav-panel--premium .knowledge-nav-heading p,
.knowledge-nav-panel--premium .knowledge-sport-group > h3 small,
.knowledge-nav-panel--premium .knowledge-sport-copy small { color: var(--yn-metal-muted); }
.desktop-nav .knowledge-nav-panel--premium .knowledge-sport-link {
  border-color: var(--yn-metal-line);
  background: var(--yn-metal-card);
  color: var(--yn-metal-text);
  box-shadow: inset 0 1px #ffffff06;
}
.desktop-nav .knowledge-nav-panel--premium .knowledge-sport-link:is(:hover, :focus-visible, [aria-current="page"]) {
  border-color: #dfc38b80;
  background: var(--yn-metal-hover);
  box-shadow: 0 8px 20px #10131726, inset 0 1px #ffffff0c;
}
.knowledge-nav-panel--premium .knowledge-sport-arrow { background: #dfc38b16; color: var(--yn-metal-gold); }
.knowledge-nav-panel--premium .knowledge-sport-link:is(:hover, :focus-visible, [aria-current="page"]) .knowledge-sport-arrow { background: var(--yn-metal-gold); color: #20252a; }
.knowledge-nav-panel--premium .knowledge-nav-close { border-color: var(--yn-metal-line); color: var(--yn-metal-muted); }
.knowledge-nav-panel--premium .knowledge-nav-close:hover { border-color: #dfc38b80; background: #ffffff0c; color: var(--yn-metal-text); }
.knowledge-nav-panel--premium .knowledge-nav-footer { border-color: var(--yn-metal-line); color: var(--yn-metal-muted); }
.desktop-nav .knowledge-nav-panel--premium .knowledge-nav-footer > a { color: var(--yn-metal-gold); }

/* Company window. */
.company-nav-panel { gap: 16px; padding: 18px; border-radius: 25px; }
.company-nav-panel .company-nav-intro {
  position: relative;
  border: 1px solid #dfc38b35;
  background: radial-gradient(ellipse at 100% 0, #dfc38b12, transparent 60%), linear-gradient(140deg, #272d32, #181e23);
  color: var(--yn-metal-text);
}
.company-nav-panel .company-nav-intro > span { border-color: #dfc38b66; color: var(--yn-metal-gold); }
.company-nav-panel .company-nav-intro small { color: var(--yn-metal-gold); }
.company-nav-panel .company-nav-intro strong { font-size: 29px; line-height: 1.13; letter-spacing: -.045em; }
.company-nav-close {
  position: absolute; top: 14px; right: 14px;
  display: grid; place-items: center; width: 34px; height: 34px; padding: 0;
  border: 1px solid var(--yn-metal-line); border-radius: 50%;
  background: #ffffff05; color: var(--yn-metal-muted); cursor: pointer;
}
.company-nav-close svg { width: 16px; height: 16px; }
.company-nav-close:hover { border-color: #dfc38b80; background: #ffffff0c; color: var(--yn-metal-text); }
.desktop-nav .company-nav-panel .company-nav-links a {
  padding: 14px 12px; border-color: var(--yn-metal-line);
  background: var(--yn-metal-card); color: var(--yn-metal-text);
  box-shadow: inset 0 1px #ffffff06;
}
.company-nav-panel .company-nav-links a > b { border-color: #dfc38b40; background: #dfc38b0b; color: var(--yn-metal-gold); }
.company-nav-panel .company-nav-links strong { font-size: 13px; }
.company-nav-panel .company-nav-links small { margin-top: 5px; color: var(--yn-metal-muted); font-size: 10px; line-height: 1.45; }
.company-nav-panel .company-nav-links i { color: var(--yn-metal-gold); }
.desktop-nav .company-nav-panel .company-nav-links a:is(:hover, :focus-visible, [aria-current="page"]) { border-color: #dfc38b80; background: var(--yn-metal-hover); }

/* Language and account windows; changes stop at the window boundary. */
.language-menu a, .language-menu > span { color: var(--yn-metal-text); }
.language-menu a:is(:hover, :focus-visible, [aria-current="page"]) { background: #ffffff0c; }
.language-menu a[aria-current="page"] { box-shadow: inset 0 0 0 1px #dfc38b45; }
.language-menu a span { color: var(--yn-metal-gold); }
.language-menu .language-pending, .language-menu .language-pending small { color: var(--yn-metal-muted); }
.account-menu .account-menu-guest, .account-menu .account-menu-member { background: transparent; }
.account-menu .account-menu-eyebrow { color: var(--yn-metal-gold); }
.account-menu .account-menu-guest > strong { color: var(--yn-metal-text); }
.account-menu .account-menu-guest p { color: var(--yn-metal-muted); }
.account-menu .account-menu-login { border: 1px solid #dfc38b55; background: #dfc38b14; }
.account-menu .account-menu-login:hover { background: #dfc38b23; }
.account-menu .account-menu-member > header { border-bottom: 1px solid var(--yn-metal-line); background: #141a1f55; }
.account-menu .account-menu-member header small { color: var(--yn-metal-muted); }
.account-menu .account-menu-member header strong { color: var(--yn-metal-text); }
.account-menu .account-menu-member nav a { color: var(--yn-metal-text) !important; }
.account-menu .account-menu-member nav a:is(:hover, :focus-visible) { background: #ffffff0b; }
.account-menu .account-menu-member nav a:focus-visible { outline: 2px solid var(--yn-metal-gold); }
.account-menu .account-menu-member nav b { border-color: #dfc38b50; color: var(--yn-metal-gold); }
.account-menu .account-menu-member nav small { color: var(--yn-metal-muted); }
.account-menu .account-menu-member nav i { color: var(--yn-metal-gold); }
.account-menu .account-menu-member > footer { border-color: var(--yn-metal-line); background: #151a1e55; }
/* The owning account stylesheet uses !important for these utility links. */
.account-menu .account-menu-member > footer a { color: var(--yn-metal-gold) !important; }
.account-menu .account-menu-member > footer button { color: #e3ada0 !important; }

@media (max-width: 930px) {
  .mobile-menu.yn-mobile-menu {
    --yn-nav-gold: var(--yn-metal-gold);
    background: var(--yn-metal-surface);
    color: var(--yn-metal-text); color-scheme: dark;
    box-shadow: inset 0 1px #ffffff1a;
    scrollbar-color: #8c9295 #252a30;
  }
  .yn-mobile-menu a { color: var(--yn-metal-text); }
  .yn-mobile-menu .yn-nav-kicker { color: var(--yn-metal-gold); }
  .yn-mobile-menu .yn-nav-kicker > span:last-child { border-color: var(--yn-metal-line); background: #ffffff05; color: var(--yn-metal-muted); }
  .yn-mobile-menu .yn-nav-title { color: var(--yn-metal-text); }
  .yn-mobile-menu .yn-nav-title em { color: var(--yn-metal-gold); }
  .yn-mobile-menu .yn-nav-search { border-color: var(--yn-metal-line); background: #1b2126a6; box-shadow: inset 0 1px #ffffff05; }
  .yn-mobile-menu .yn-nav-search > span { color: var(--yn-metal-muted); }
  .yn-mobile-menu .yn-nav-search input { color: var(--yn-metal-text); }
  .yn-mobile-menu .yn-nav-search input::placeholder { color: var(--yn-metal-muted); }
  .yn-mobile-menu .yn-nav-search button { background: #dfc38b20; color: var(--yn-metal-gold); }
  .yn-mobile-menu .yn-nav-search:focus-within { border-color: var(--yn-metal-gold); box-shadow: 0 0 0 3px #dfc38b18; }
  .yn-mobile-menu .yn-nav-feature { border-color: #dfc38b55; background: radial-gradient(ellipse at 90% 90%, #c2cbd415, transparent 60%), linear-gradient(140deg, #20272d, #151b20); box-shadow: 0 12px 28px #10131724, inset 0 1px #ffffff0a; }
  .yn-mobile-menu .yn-nav-feature-copy > small, .yn-mobile-menu .yn-nav-feature-copy > span { color: var(--yn-metal-gold); }
  .yn-mobile-menu .yn-nav-core { border-color: var(--yn-metal-line); }
  .yn-mobile-menu .yn-nav-core > *, .yn-mobile-menu .yn-nav-core .mobile-shop:first-child { border-color: var(--yn-metal-line); }
  .yn-mobile-menu .yn-nav-number { color: var(--yn-metal-gold); }
  .yn-mobile-menu .yn-nav-label strong { color: var(--yn-metal-text); }
  .yn-mobile-menu .yn-nav-label small { color: var(--yn-metal-muted); }
  .yn-mobile-menu .yn-nav-primary-link:is(:hover, [aria-current="page"]) .yn-nav-label strong { color: var(--yn-metal-gold); }
  .yn-mobile-menu .yn-nav-arrow { border-color: #dfc38b40; background: #dfc38b0d; color: var(--yn-metal-gold); }
  .yn-mobile-menu :is(.mobile-shop-toggle, .mobile-knowledge-toggle, .mobile-company-toggle) { border-color: #dfc38b40; background: #dfc38b0d; }
  .yn-mobile-menu :is(.mobile-shop-toggle, .mobile-knowledge-toggle, .mobile-company-toggle)::before,
  .yn-mobile-menu :is(.mobile-shop-toggle, .mobile-knowledge-toggle, .mobile-company-toggle)::after { background: var(--yn-metal-gold); }
  .yn-mobile-menu .is-open :is(.mobile-shop-toggle, .mobile-knowledge-toggle, .mobile-company-toggle) { border-color: #dfc38b88; background: #dfc38b24; }
  .yn-mobile-menu :is(.mobile-shop-panel, .mobile-knowledge-panel) > section { border-color: var(--yn-metal-line); background: #151b2030; }
  .yn-mobile-menu :is(.mobile-shop-panel h3, .knowledge-mobile-intro > small) { color: var(--yn-metal-gold); }
  .yn-mobile-menu .mobile-shop-category,
  .yn-mobile-menu .mobile-company-links a,
  .yn-mobile-menu .knowledge-sport-links .knowledge-sport-link {
    border-color: var(--yn-metal-line); background: var(--yn-metal-card); color: var(--yn-metal-text);
    box-shadow: inset 0 1px #ffffff06;
  }
  .yn-mobile-menu .mobile-shop-category:is(:hover, :focus-visible, [aria-current="page"]),
  .yn-mobile-menu .mobile-company-links a:is(:hover, :focus-visible, [aria-current="page"]),
  .yn-mobile-menu .knowledge-sport-links .knowledge-sport-link:is(:hover, :focus-visible, [aria-current="page"]) {
    border-color: #dfc38b80; background: var(--yn-metal-hover);
  }
  .yn-mobile-menu .mobile-shop-category :is(strong, em),
  .yn-mobile-menu .mobile-shop-quick strong,
  .yn-mobile-menu .mobile-company-links strong { color: var(--yn-metal-text); }
  .yn-mobile-menu .mobile-shop-category em,
  .yn-mobile-menu .mobile-shop-quick small,
  .yn-mobile-menu .mobile-company-links small,
  .yn-mobile-menu .knowledge-sport-copy small { color: var(--yn-metal-muted); }
  .yn-mobile-menu .mobile-shop-category :is(small, i),
  .yn-mobile-menu .mobile-shop-quick i,
  .yn-mobile-menu .mobile-company-links :is(b, i) { color: var(--yn-metal-gold); }
  .yn-mobile-menu .yn-nav-product-thumb { background: linear-gradient(140deg, #dce2e912, #dce2e905); }
  .yn-mobile-menu .yn-nav-product-thumb img { width: 44px; height: 48px; }
  .yn-mobile-menu .mobile-shop-quick { border: 1px solid transparent; background: #ffffff03; color: var(--yn-metal-text); }
  .yn-mobile-menu .mobile-shop-quick:is(:hover, :focus-visible, [aria-current="page"]) { border-color: #dfc38b55; background: #ffffff09; }
  .yn-mobile-menu .mobile-shop-quick > b { background: #dfc38b18; color: var(--yn-metal-gold); }
  .yn-mobile-menu .knowledge-mobile-intro { border-color: #dfc38b45; background: linear-gradient(140deg, #30373e, #191f24); }
  .yn-mobile-menu .knowledge-mobile-intro > p { color: var(--yn-metal-muted); }
  .yn-mobile-menu .knowledge-mobile-intro > a { color: var(--yn-metal-gold); }
  .yn-mobile-menu .knowledge-nav-mobile-premium > .knowledge-sport-group { border: 0; background: transparent; }
  .yn-mobile-menu .knowledge-sport-group > h3 { color: var(--yn-metal-text); }
  .yn-mobile-menu .knowledge-sport-group > h3 small { color: var(--yn-metal-muted); }
  .yn-mobile-menu .knowledge-category-icon { color: var(--yn-metal-gold); }
  .yn-mobile-menu .knowledge-sport-arrow { background: #dfc38b16; color: var(--yn-metal-gold); }
  .yn-mobile-menu .mobile-knowledge-links a { color: var(--yn-metal-text); }
  .yn-mobile-menu .mobile-knowledge-links a:is(:hover, :focus-visible, [aria-current="page"]) { background: #ffffff0a; }
  .yn-mobile-menu .mobile-knowledge-links span { color: var(--yn-metal-gold); }
  .yn-mobile-menu .yn-nav-utilities a { border-color: var(--yn-metal-line); background: var(--yn-metal-card); }
  .yn-mobile-menu .yn-nav-utilities strong { color: var(--yn-metal-text); }
  .yn-mobile-menu .yn-nav-utilities small { color: var(--yn-metal-muted); }
  .yn-mobile-menu .yn-nav-utility-icon, .yn-mobile-menu .yn-nav-utilities i { color: var(--yn-metal-gold); }
  .yn-mobile-menu .yn-nav-utilities [data-cart-count] { background: var(--yn-metal-gold); color: #20252a; }
  .yn-mobile-menu .yn-nav-footer { border-color: var(--yn-metal-line); }
  .yn-mobile-menu .yn-nav-footer p, .yn-mobile-menu .yn-nav-footer a { color: var(--yn-metal-muted); }
  .yn-mobile-menu .yn-nav-footer p > span { background: var(--yn-metal-gold); color: #20252a; }
  .yn-mobile-menu :is(a, button):focus-visible { outline-color: var(--yn-metal-gold); }
}