:root {
  --theme-accent: #8ed7fb;
  --theme-deep: #243238;
  --theme-paper: #f4f6f7;
  --theme-card: #ffffff;
  --theme-graphite: #4d5757;
  --theme-border: #c9cbbe;
  --theme-tissue: #e7e8e1;
  --theme-nav-dark: rgba(10, 18, 19, .56);
  --theme-nav-light: rgba(247, 248, 246, .78);
  --keyboard-sky: #c8d8df;
  --keyboard-copy: #17242a;
  --keyboard-copy-muted: rgba(23, 36, 42, .72);
  --keyboard-safe-zone: rgba(225, 234, 238, .82);
  --keyboard-bottom-zone: rgba(218, 229, 233, .76);
  --site-page: #eef3f5;
  --site-section: #eef3f5;
  --site-section-alt: #e8f0f3;
  --site-surface: #f9fbfc;
  --site-surface-strong: #ffffff;
  --site-surface-soft: rgba(255, 255, 255, .58);
  --site-control: #e3ebee;
  --site-text: #17242a;
  --site-text-secondary: #4d5e65;
  --site-text-muted: #596970;
  --site-border: rgba(23, 36, 42, .15);
  --site-border-strong: rgba(23, 36, 42, .28);
  --site-footer: #e5edef;
  --site-overlay: rgba(17, 29, 35, .38);
  --site-shadow: rgba(29, 45, 52, .11);
  --site-accent-ink: #176f92;
  --site-blue: #176f92;
  --site-violet: #6654a8;
  --site-green: #167a5a;
  --site-amber: #80601d;
  --site-nav-panel: rgba(239, 244, 246, .74);
  --apple-theme-enter: cubic-bezier(.16, 1, .3, 1);
}

html[data-wallpaper-phase="night"] {
  --theme-accent: #93c9ff;
  --theme-deep: #0b131c;
  --theme-paper: #f2f5f6;
  --theme-card: #f9fbfc;
  --theme-graphite: #46535b;
  --theme-border: #c7d0d4;
  --theme-tissue: #e3e9ec;
  --theme-nav-dark: rgba(7, 13, 21, .62);
  --theme-nav-light: rgba(242, 245, 246, .82);
  --keyboard-sky: #080d14;
  --keyboard-copy: #f6f8fa;
  --keyboard-copy-muted: rgba(238, 243, 247, .76);
  --keyboard-safe-zone: rgba(3, 7, 13, .66);
  --keyboard-bottom-zone: rgba(3, 7, 13, .78);
  --site-page: #080d14;
  --site-section: #0b121a;
  --site-section-alt: #0d161f;
  --site-surface: #101a23;
  --site-surface-strong: #14212c;
  --site-surface-soft: rgba(22, 34, 44, .72);
  --site-control: #0d1720;
  --site-text: #f1f5f7;
  --site-text-secondary: #b4c0c7;
  --site-text-muted: #7f909a;
  --site-border: rgba(199, 222, 234, .13);
  --site-border-strong: rgba(199, 222, 234, .26);
  --site-footer: #070c12;
  --site-overlay: rgba(0, 0, 0, .72);
  --site-shadow: rgba(0, 0, 0, .3);
  --site-accent-ink: #93c9ff;
  --site-blue: #6fc4ff;
  --site-violet: #b9aeff;
  --site-green: #5ee8b8;
  --site-amber: #e8c575;
  --site-nav-panel: rgba(7, 13, 21, .74);
}

html[data-wallpaper-phase="dawn"] {
  --theme-accent: #9eddf5;
  --theme-deep: #1b292c;
  --theme-paper: #f7f7f3;
  --theme-card: #fdfefb;
  --theme-graphite: #4b5756;
  --theme-border: #cbd0c6;
  --theme-tissue: #e8eae3;
  --theme-nav-dark: rgba(18, 29, 30, .54);
  --keyboard-sky: #c4d5da;
  --keyboard-copy: #172429;
  --keyboard-copy-muted: rgba(23, 36, 41, .72);
  --keyboard-safe-zone: rgba(224, 233, 235, .8);
  --keyboard-bottom-zone: rgba(216, 227, 229, .74);
  --site-page: #f0f4f3;
  --site-section: #f0f4f3;
  --site-section-alt: #eaf1ef;
  --site-surface: #fafcfa;
  --site-surface-strong: #ffffff;
  --site-surface-soft: rgba(255, 255, 255, .6);
  --site-control: #e5ecea;
  --site-text: #182628;
  --site-text-secondary: #50605f;
  --site-text-muted: #5b6b69;
  --site-border: rgba(24, 38, 40, .15);
  --site-border-strong: rgba(24, 38, 40, .28);
  --site-footer: #e7eeec;
  --site-overlay: rgba(18, 31, 32, .38);
  --site-shadow: rgba(27, 44, 44, .1);
  --site-accent-ink: #1c718d;
  --site-blue: #1b718e;
  --site-violet: #6656a0;
  --site-green: #19785d;
  --site-amber: #80631f;
  --site-nav-panel: rgba(242, 246, 245, .76);
}

html[data-wallpaper-phase="dusk"] {
  --theme-accent: #96d7f5;
  --theme-deep: #1a252b;
  --theme-paper: #f6f6f3;
  --theme-card: #fdfdfb;
  --theme-graphite: #525757;
  --theme-border: #cecac4;
  --theme-tissue: #ebe7e2;
  --theme-nav-dark: rgba(22, 27, 31, .58);
  --keyboard-sky: #1a2029;
  --keyboard-copy: #f6f8fa;
  --keyboard-copy-muted: rgba(238, 243, 247, .76);
  --keyboard-safe-zone: rgba(8, 10, 16, .62);
  --keyboard-bottom-zone: rgba(7, 9, 15, .76);
  --site-page: #111820;
  --site-section: #141c24;
  --site-section-alt: #17212a;
  --site-surface: #19232d;
  --site-surface-strong: #1d2934;
  --site-surface-soft: rgba(29, 41, 52, .72);
  --site-control: #111b24;
  --site-text: #f4f6f7;
  --site-text-secondary: #bcc4c8;
  --site-text-muted: #89969d;
  --site-border: rgba(218, 225, 230, .14);
  --site-border-strong: rgba(218, 225, 230, .27);
  --site-footer: #0d131a;
  --site-overlay: rgba(0, 0, 0, .68);
  --site-shadow: rgba(0, 0, 0, .28);
  --site-accent-ink: #96d7f5;
  --site-blue: #78c9ec;
  --site-violet: #c4b9ff;
  --site-green: #65e0b5;
  --site-amber: #e5c984;
  --site-nav-panel: rgba(16, 23, 31, .76);
}

:root {
  --bio-lime: var(--theme-accent);
  --metal-lime: var(--theme-accent);
  --abyss: var(--theme-deep);
  --bone: var(--site-section);
  --paper: var(--site-surface);
  --graphite: var(--site-text-secondary);
  --lichen: var(--site-border);
  --tissue: var(--site-control);
  --void: var(--site-footer);
}

html,
body,
body > div,
section[data-screen-label="Trust and Safety"],
section[data-screen-label="Future Vision"],
footer[data-screen-label="Footer"] {
  transition: background-color 1.15s var(--apple-theme-enter), color .8s ease;
}

body,
body > div { background: var(--abyss) !important; }
body > div { --ac: var(--theme-accent) !important; }

.v5-keyboard-stage,
.v5-keyboard-fallback,
#keyboard-desktop-canvas,
.v5-keyboard-wash {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.v5-keyboard-stage {
  z-index: 0;
  overflow: hidden;
  background: var(--keyboard-sky);
  transition: background-color 1.15s var(--apple-theme-enter);
}

.v5-keyboard-stage::after {
  content: "";
  position: absolute;
  z-index: 2;
  inset: 0;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(18, 35, 43, .1) 1px, transparent 1px),
    linear-gradient(90deg, rgba(18, 35, 43, .08) 1px, transparent 1px);
  background-size: 4px 4px;
  mix-blend-mode: soft-light;
  opacity: .11;
}

html[data-wallpaper-phase="night"] .v5-keyboard-stage::after,
html[data-wallpaper-phase="dusk"] .v5-keyboard-stage::after {
  background-image:
    linear-gradient(rgba(164, 210, 230, .11) 1px, transparent 1px),
    linear-gradient(90deg, rgba(164, 210, 230, .09) 1px, transparent 1px);
  opacity: .13;
}

.v5-keyboard-fallback {
  z-index: 0;
  background-color: var(--keyboard-sky);
  transition: background-color 1.15s var(--apple-theme-enter);
}

.v5-keyboard-fallback::before,
.v5-keyboard-fallback::after {
  content: "";
  position: absolute;
  inset: 0;
  background-position: center;
  background-size: cover;
  transition: opacity 1.15s var(--apple-theme-enter);
}

.v5-keyboard-fallback::before { background-image: url('keyboard-desktop-poster-light.jpg'); opacity: 1; }
.v5-keyboard-fallback::after { background-image: url('keyboard-desktop-poster-dark.jpg'); opacity: 0; }
html[data-wallpaper-phase="night"] .v5-keyboard-fallback::before,
html[data-wallpaper-phase="dusk"] .v5-keyboard-fallback::before { opacity: 0; }
html[data-wallpaper-phase="night"] .v5-keyboard-fallback::after,
html[data-wallpaper-phase="dusk"] .v5-keyboard-fallback::after { opacity: 1; }

#keyboard-desktop-canvas {
  z-index: 1;
  display: block;
  image-rendering: auto;
  opacity: 0;
  transition: opacity 1s var(--apple-theme-enter);
}

#keyboard-desktop-canvas[data-ready="true"] { opacity: 1; }

.v5-keyboard-wash {
  z-index: 3;
  pointer-events: none;
}

.v5-keyboard-wash::before,
.v5-keyboard-wash::after {
  content: "";
  position: absolute;
  inset: 0;
  transition: opacity 1.15s var(--apple-theme-enter);
}

.v5-keyboard-wash::before {
  background:
    radial-gradient(ellipse 50% 46% at 29% 43%, rgba(225, 234, 238, .6), transparent 76%),
    linear-gradient(180deg, transparent 48%, rgba(218, 229, 233, .24));
  opacity: 1;
}

.v5-keyboard-wash::after {
  background:
    radial-gradient(ellipse 50% 46% at 29% 43%, rgba(3, 7, 13, .45), transparent 76%),
    linear-gradient(180deg, transparent 48%, rgba(3, 7, 13, .38));
  opacity: 0;
}

html[data-wallpaper-phase="night"] .v5-keyboard-wash::before,
html[data-wallpaper-phase="dusk"] .v5-keyboard-wash::before { opacity: 0; }
html[data-wallpaper-phase="night"] .v5-keyboard-wash::after,
html[data-wallpaper-phase="dusk"] .v5-keyboard-wash::after { opacity: 1; }

.v5-hero-copy {
  align-items: flex-start;
  justify-content: center;
  text-align: left;
  padding: 104px clamp(28px, 6.5vw, 104px) clamp(206px, 25vh, 242px) !important;
}

.v5-hero .v5-hero-copy .v5-title {
  width: min(680px, 54vw) !important;
  color: var(--keyboard-copy) !important;
  text-align: left;
}

.v5-hero-copy h1 .v5-title-line {
  color: var(--keyboard-copy) !important;
  -webkit-text-fill-color: var(--keyboard-copy) !important;
}

.v5-eyebrow {
  top: 106px;
  left: clamp(28px, 6.5vw, 104px);
  color: var(--keyboard-copy-muted) !important;
}

.v5-hero-note {
  left: clamp(118px, 10vw, 162px) !important;
  color: var(--keyboard-copy-muted) !important;
}

html[data-wallpaper-phase="day"] .v5-hero .v5-hero-note,
html[data-wallpaper-phase="dawn"] .v5-hero .v5-hero-note { color: rgba(23, 36, 42, .76) !important; }
html[data-wallpaper-phase="night"] .v5-hero .v5-hero-note,
html[data-wallpaper-phase="dusk"] .v5-hero .v5-hero-note { color: rgba(238, 243, 247, .8) !important; }
html[data-wallpaper-phase="day"] .v5-hero .v4-section-marker,
html[data-wallpaper-phase="dawn"] .v5-hero .v4-section-marker { color: rgba(23, 36, 42, .46); }

.v5-scroll-cue { color: var(--keyboard-copy); }

html[data-wallpaper-phase="day"] .v5-actions a:first-child,
html[data-wallpaper-phase="dawn"] .v5-actions a:first-child {
  border-color: rgba(23, 36, 42, .42) !important;
  background: rgba(239, 244, 246, .38) !important;
  color: #17242a !important;
}

.v5-nav.has-scrolled { background: var(--theme-nav-dark) !important; }
.v5-nav.is-light.has-scrolled { background: var(--theme-nav-light) !important; }

html[data-wallpaper-phase="day"] .v5-nav:not(.is-light) > div > div:first-child > div:nth-child(2),
html[data-wallpaper-phase="dawn"] .v5-nav:not(.is-light) > div > div:first-child > div:nth-child(2),
html[data-wallpaper-phase="day"] .v5-nav:not(.is-light) nav a,
html[data-wallpaper-phase="dawn"] .v5-nav:not(.is-light) nav a {
  color: #17242a !important;
}

html[data-wallpaper-phase="day"] .v5-nav:not(.is-light) > div > div:last-child > a,
html[data-wallpaper-phase="dawn"] .v5-nav:not(.is-light) > div > div:last-child > a {
  border-color: rgba(23, 36, 42, .36) !important;
  background: rgba(239, 244, 246, .36) !important;
  color: #17242a !important;
}

.dynamic-theme-control {
  position: relative;
  flex: 0 0 auto;
  font-family: 'IBM Plex Mono', monospace;
}

.dynamic-theme-trigger {
  min-width: 104px;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 11px;
  border: 1px solid rgba(255, 255, 255, .32);
  border-radius: 10px;
  background: rgba(5, 10, 12, .2);
  color: #fff;
  -webkit-backdrop-filter: blur(16px) saturate(135%);
  backdrop-filter: blur(16px) saturate(135%);
  font-size: 10px;
  line-height: 1;
  text-transform: uppercase;
  transition: transform 100ms ease-out, background-color .2s ease, border-color .2s ease;
}

.dynamic-theme-trigger:hover {
  border-color: rgba(255, 255, 255, .62);
  background: rgba(255, 255, 255, .09);
}

.dynamic-theme-trigger:active { transform: scale(.97); }
.dynamic-theme-trigger svg { width: 16px; height: 16px; flex: 0 0 16px; }
.dynamic-theme-trigger .theme-icon { display: none; }
.dynamic-theme-trigger[data-mode="auto"] .theme-icon-auto,
.dynamic-theme-trigger[data-mode="day"] .theme-icon-day,
.dynamic-theme-trigger[data-mode="night"] .theme-icon-night { display: block; }
.dynamic-theme-chevron { width: 12px !important; height: 12px !important; opacity: .68; transition: transform .22s var(--apple-theme-enter); }
.dynamic-theme-control[data-open="true"] .dynamic-theme-chevron { transform: rotate(180deg); }

.dynamic-theme-menu {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  width: 166px;
  padding: 6px;
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 12px;
  background: rgba(12, 20, 22, .84);
  -webkit-backdrop-filter: blur(26px) saturate(145%);
  backdrop-filter: blur(26px) saturate(145%);
  box-shadow: 0 18px 50px rgba(0, 0, 0, .28), inset 0 1px 0 rgba(255, 255, 255, .08);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(-5px) scale(.97);
  transform-origin: 86% top;
  transition: opacity .18s ease, transform .24s var(--apple-theme-enter), visibility 0s linear .24s;
}

.dynamic-theme-control[data-open="true"] .dynamic-theme-menu {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0) scale(1);
  transition-delay: 0s;
}

.dynamic-theme-option {
  width: 100%;
  min-height: 44px;
  display: grid;
  grid-template-columns: 18px 1fr 14px;
  align-items: center;
  gap: 9px;
  padding: 0 9px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: rgba(255, 255, 255, .72);
  text-align: left;
  font-size: 10px;
  text-transform: uppercase;
  transition: transform 100ms ease-out, background-color .16s ease, color .16s ease;
}

.dynamic-theme-option:hover,
.dynamic-theme-option:focus-visible { background: rgba(255, 255, 255, .09); color: #fff; }
.dynamic-theme-option > svg { width: 16px; height: 16px; }
.dynamic-theme-check { opacity: 0; color: var(--theme-accent); transform: scale(.8); transition: opacity .14s ease, transform .18s var(--apple-enter); }
.dynamic-theme-option:active { transform: scale(.98); }
.dynamic-theme-option[aria-checked="true"] { color: #fff; }
.dynamic-theme-option[aria-checked="true"] .dynamic-theme-check { opacity: 1; transform: scale(1); }

.v5-nav.is-light .dynamic-theme-trigger {
  border-color: rgba(34, 47, 48, .24);
  background: rgba(255, 255, 255, .48);
  color: var(--abyss);
}

.v5-nav.is-light .dynamic-theme-trigger:hover { background: rgba(34, 47, 48, .08); }
.v5-nav.is-light .dynamic-theme-menu {
  border-color: rgba(34, 47, 48, .14);
  background: rgba(249, 250, 248, .9);
  box-shadow: 0 18px 50px rgba(30, 39, 39, .14), inset 0 1px 0 rgba(255, 255, 255, .8);
}
.v5-nav.is-light .dynamic-theme-option { color: rgba(34, 47, 48, .68); }
.v5-nav.is-light .dynamic-theme-option:hover,
.v5-nav.is-light .dynamic-theme-option:focus-visible { background: rgba(34, 47, 48, .08); color: var(--abyss); }
.v5-nav.is-light .dynamic-theme-option[aria-checked="true"] { color: var(--abyss); }

html[data-wallpaper-phase="day"] .v5-nav:not(.is-light) .dynamic-theme-trigger,
html[data-wallpaper-phase="dawn"] .v5-nav:not(.is-light) .dynamic-theme-trigger {
  border-color: rgba(23, 36, 42, .26);
  background: rgba(239, 244, 246, .42);
  color: #17242a;
}

html[data-wallpaper-phase="day"] .v5-nav:not(.is-light) .dynamic-theme-trigger:hover,
html[data-wallpaper-phase="dawn"] .v5-nav:not(.is-light) .dynamic-theme-trigger:hover {
  background: rgba(239, 244, 246, .68);
}

html[data-wallpaper-phase="day"] .v5-nav:not(.is-light) .dynamic-theme-menu,
html[data-wallpaper-phase="dawn"] .v5-nav:not(.is-light) .dynamic-theme-menu {
  border-color: rgba(23, 36, 42, .14);
  background: rgba(239, 244, 246, .9);
  box-shadow: 0 18px 50px rgba(23, 36, 42, .16), inset 0 1px 0 rgba(255, 255, 255, .78);
}

html[data-wallpaper-phase="day"] .v5-nav:not(.is-light) .dynamic-theme-option,
html[data-wallpaper-phase="dawn"] .v5-nav:not(.is-light) .dynamic-theme-option { color: rgba(23, 36, 42, .68); }

html[data-wallpaper-phase="day"] .v5-nav:not(.is-light) .dynamic-theme-option:hover,
html[data-wallpaper-phase="day"] .v5-nav:not(.is-light) .dynamic-theme-option:focus-visible,
html[data-wallpaper-phase="dawn"] .v5-nav:not(.is-light) .dynamic-theme-option:hover,
html[data-wallpaper-phase="dawn"] .v5-nav:not(.is-light) .dynamic-theme-option:focus-visible {
  background: rgba(23, 36, 42, .08);
  color: #17242a;
}

html[data-wallpaper-phase="day"] .v5-nav:not(.is-light) .dynamic-theme-option[aria-checked="true"],
html[data-wallpaper-phase="dawn"] .v5-nav:not(.is-light) .dynamic-theme-option[aria-checked="true"] { color: #17242a; }

.v5-hero-copy h1 .v5-title-line {
  animation:
    v5-title-opacity .44s .1s ease-out forwards,
    v5-title-motion .72s .1s var(--apple-enter) forwards !important;
}

.v5-title-mask:nth-child(2) .v5-title-line { animation-delay: .18s !important; }
.v5-hero-note { animation: v5-fade-up .56s .34s var(--apple-enter) forwards; }
.v5-actions { animation: v5-fade-up .56s .42s var(--apple-enter) forwards; }
.v5-scroll-cue { animation: v5-fade-in .5s .54s var(--apple-enter) forwards; }

@media (max-width: 1100px) {
  .v5-hero .v5-hero-copy .v5-title { width: min(560px, 68vw) !important; }
  .dynamic-theme-trigger { min-width: 44px; width: 44px; padding: 0; }
  .dynamic-theme-trigger-label,
  .dynamic-theme-chevron { display: none; }
}

@media (max-width: 760px) {
  header.v5-nav[data-screen-label="Nav"] > div > div:last-child { display: flex !important; gap: 8px !important; }
  .v5-nav > div > div:last-child > a { display: none !important; }
  .dynamic-theme-menu { position: fixed; top: 62px; right: 12px; }
  .v5-hero-copy {
    align-items: flex-start;
    justify-content: flex-start;
    padding: clamp(174px, 20.5svh, 190px) 18px 126px !important;
  }
  .v5-hero .v5-hero-copy .v5-title {
    width: min(88vw, 500px) !important;
    text-align: left;
  }
  .v5-eyebrow { top: clamp(140px, 16.5svh, 154px); left: 18px; }
  .v5-hero-note { left: 18px !important; right: 18px; }
  .v5-keyboard-fallback::before {
    background-image: url('keyboard-mobile-poster-light.jpg');
    background-position: center;
  }
  .v5-keyboard-fallback::after {
    background-image: url('keyboard-mobile-poster-dark.jpg');
    background-position: center;
  }
  .v5-keyboard-wash::before {
    background:
      radial-gradient(ellipse 78% 34% at 42% 31%, rgba(224, 233, 235, .68), transparent 78%),
      linear-gradient(180deg, transparent 40%, rgba(216, 227, 229, .3));
  }
  .v5-keyboard-wash::after {
    background:
      radial-gradient(ellipse 78% 34% at 42% 31%, rgba(3, 7, 13, .58), transparent 78%),
      linear-gradient(180deg, transparent 40%, rgba(3, 7, 13, .48));
  }
}

html[data-wallpaper-capture="true"],
html[data-wallpaper-capture="true"] body { overflow: hidden; }
html[data-wallpaper-capture="true"] .skip-link,
html[data-wallpaper-capture="true"] .v4-site > :not(.v5-hero),
html[data-wallpaper-capture="true"] .v5-hero-copy,
html[data-wallpaper-capture="true"] .v5-scroll-cue,
html[data-wallpaper-capture="true"] .v4-section-marker,
html[data-wallpaper-capture="true"] .v5-keyboard-wash { display: none !important; }
html[data-wallpaper-capture="true"] .v5-keyboard-stage::after { display: none; }
html[data-wallpaper-capture="true"] .v5-hero {
  width: 100vw;
  height: 100vh;
  min-height: 0;
}

@media (max-width: 760px) and (max-height: 720px) {
  .v5-hero { height: 100svh; min-height: 600px; }
  .v5-hero-copy { padding-top: 128px !important; padding-bottom: 112px !important; }
  .v5-eyebrow { top: 104px; }
  .v5-hero-note { bottom: 78px !important; }
  .v5-actions { bottom: 14px; }
}

@media (prefers-reduced-motion: reduce) {
  html,
  body,
  body > div,
  .v5-keyboard-fallback,
  section[data-screen-label="Trust and Safety"],
  section[data-screen-label="Future Vision"],
  footer[data-screen-label="Footer"] { transition: none !important; }
  .v5-keyboard-fallback::before,
  .v5-keyboard-fallback::after,
  .v5-keyboard-wash::before,
  .v5-keyboard-wash::after { transition: none !important; }
  .dynamic-theme-menu { transition: opacity .15s ease !important; transform: none !important; }
}

@media (prefers-reduced-transparency: reduce) {
  .dynamic-theme-trigger { background: rgba(8, 15, 17, .94); -webkit-backdrop-filter: none; backdrop-filter: none; }
  .dynamic-theme-menu { background: #111c1e; -webkit-backdrop-filter: none; backdrop-filter: none; }
  .v5-nav.is-light .dynamic-theme-trigger,
  .v5-nav.is-light .dynamic-theme-menu { background: #f7f8f6; }
  html[data-wallpaper-phase="day"] .v5-nav:not(.is-light) .dynamic-theme-trigger,
  html[data-wallpaper-phase="dawn"] .v5-nav:not(.is-light) .dynamic-theme-trigger,
  html[data-wallpaper-phase="day"] .v5-nav:not(.is-light) .dynamic-theme-menu,
  html[data-wallpaper-phase="dawn"] .v5-nav:not(.is-light) .dynamic-theme-menu {
    background: #eef3f5 !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }
  html[data-wallpaper-phase="day"] .v5-actions a:first-child,
  html[data-wallpaper-phase="dawn"] .v5-actions a:first-child { background: #eef3f5 !important; }
}

@media (prefers-contrast: more) {
  .dynamic-theme-trigger,
  .dynamic-theme-menu { border-color: currentColor !important; }
  .v5-keyboard-wash::before {
    background:
      radial-gradient(ellipse 54% 48% at 29% 43%, rgba(232, 239, 242, .92), transparent 78%),
      linear-gradient(180deg, transparent 44%, rgba(218, 228, 232, .9));
  }
  .v5-keyboard-wash::after {
    background:
      radial-gradient(ellipse 54% 48% at 29% 43%, rgba(0, 0, 0, .78), transparent 78%),
      linear-gradient(180deg, transparent 44%, rgba(0, 0, 0, .9));
  }
}

/* Purposeful depth and feedback for the content surfaces. */
html[data-wallpaper-phase] .v4-site > section:not(.v5-hero) :is(h2, h3) {
  letter-spacing: 0 !important;
  font-optical-sizing: auto;
}

html[data-wallpaper-phase] .v5-nav {
  border-bottom-color: transparent !important;
  box-shadow: none !important;
}

html[data-wallpaper-phase] .v5-nav.has-scrolled,
html[data-wallpaper-phase] .v5-nav.is-light.has-scrolled {
  -webkit-backdrop-filter: blur(28px) saturate(155%) !important;
  backdrop-filter: blur(28px) saturate(155%) !important;
}

html[data-wallpaper-phase] .v5-nav::after,
html[data-wallpaper-phase] .v5-nav.is-light.has-scrolled::after {
  bottom: -26px;
  height: 26px;
  opacity: 0;
  background: linear-gradient(180deg, var(--site-shadow), transparent 82%) !important;
}

html[data-wallpaper-phase] .v5-nav.has-scrolled::after,
html[data-wallpaper-phase] .v5-nav.is-light.has-scrolled::after {
  opacity: .68;
}

html[data-wallpaper-phase] .v5-nav nav a {
  position: relative;
  border-radius: 8px;
}

html[data-wallpaper-phase] .v5-nav nav a[aria-current="location"],
html[data-wallpaper-phase] .mobile-nav-link[aria-current="location"] {
  background: var(--site-surface-soft) !important;
  color: var(--site-text) !important;
}

html[data-wallpaper-phase] .v5-nav nav a[aria-current="location"]::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 5px;
  width: 12px;
  height: 1px;
  background: var(--site-accent-ink);
  transform: translateX(-50%);
}

html[data-wallpaper-phase] #categories [style*="grid-template-columns"] > a,
html[data-wallpaper-phase] #sources .sources-grid > a,
html[data-wallpaper-phase] #directory article {
  position: relative;
  transition:
    transform .32s var(--apple-theme-enter),
    box-shadow .32s var(--apple-theme-enter),
    background-color .8s ease,
    color .8s ease,
    border-color .24s ease !important;
}

html[data-wallpaper-phase] #categories [style*="grid-template-columns"] > a {
  overflow: hidden;
}

html[data-wallpaper-phase] #categories [style*="grid-template-columns"] > a::before {
  content: "";
  position: absolute;
  top: 0;
  left: 16px;
  right: 16px;
  height: 2px;
  background: var(--site-accent-ink);
  opacity: 0;
  transform: scaleX(.28);
  transform-origin: left;
  transition: opacity .2s ease, transform .32s var(--apple-theme-enter);
}

html[data-wallpaper-phase] #sources .sources-grid > a {
  padding-right: 50px !important;
}

html[data-wallpaper-phase] #sources .sources-grid > a::after {
  content: "\2197";
  position: absolute;
  top: 17px;
  right: 18px;
  color: var(--site-text-muted);
  font: 500 16px/1 'IBM Plex Mono', monospace;
  opacity: .58;
  transform: translate3d(0, 0, 0);
  transition: color .2s ease, opacity .2s ease, transform .3s var(--apple-theme-enter);
}

html[data-wallpaper-phase] #directory article button[data-bot-detail] svg {
  transition: transform .3s var(--apple-theme-enter);
}

html[data-wallpaper-phase] :is(
  .directory-control-field input,
  .directory-control-field select,
  .submit-bot-form input,
  .submit-bot-form select,
  .submit-bot-form textarea
) {
  transition: border-color .2s ease, box-shadow .2s ease, background-color .8s ease, color .8s ease !important;
}

html[data-wallpaper-phase] #trust {
  position: relative;
  padding-top: clamp(124px, 10vw, 148px) !important;
  padding-bottom: clamp(72px, 7vw, 96px) !important;
}

html[data-wallpaper-phase] #trust::before {
  position: absolute;
  top: clamp(124px, 10vw, 148px);
  left: 56%;
  width: 39%;
  margin: 0;
  font-size: clamp(32px, 3.5vw, 48px);
  line-height: 1.02;
  letter-spacing: 0;
}

html[data-wallpaper-phase] #trust > div > div:first-child {
  width: 48% !important;
  max-width: 620px !important;
  margin: 0 0 52px !important;
  text-align: left !important;
}

html[data-wallpaper-phase] #trust > div > div:first-child h2 {
  margin-top: 12px !important;
  font-size: clamp(40px, 4.1vw, 52px) !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
}

@media (hover: hover) and (pointer: fine) {
  html[data-wallpaper-phase] #categories [style*="grid-template-columns"] > a:hover,
  html[data-wallpaper-phase] #sources .sources-grid > a:hover,
  html[data-wallpaper-phase] #directory article:hover {
    transform: translate3d(0, -2px, 0);
    box-shadow: 0 14px 36px var(--site-shadow) !important;
  }

  html[data-wallpaper-phase] #categories [style*="grid-template-columns"] > a:hover::before {
    opacity: .7;
    transform: scaleX(1);
  }

  html[data-wallpaper-phase] #sources .sources-grid > a:hover::after {
    color: var(--site-accent-ink);
    opacity: 1;
    transform: translate3d(2px, -2px, 0);
  }

  html[data-wallpaper-phase] #directory article:hover button[data-bot-detail] svg {
    transform: translateX(3px);
  }

  html[data-wallpaper-phase] :is(
    .directory-control-field input,
    .directory-control-field select,
    .submit-bot-form input,
    .submit-bot-form select,
    .submit-bot-form textarea
  ):hover {
    border-color: var(--site-border-strong) !important;
  }

  html[data-wallpaper-phase] #categories [style*="grid-template-columns"] > a:active,
  html[data-wallpaper-phase] #sources .sources-grid > a:active,
  html[data-wallpaper-phase] #directory article:active {
    transform: translate3d(0, 0, 0) scale(.99);
  }
}

@media (max-width: 900px) {
  html[data-wallpaper-phase] #trust {
    padding-top: 80px !important;
    padding-bottom: 72px !important;
  }

  html[data-wallpaper-phase] #trust::before {
    position: static;
    display: block;
    width: 100%;
    margin: 0 0 40px;
    font-size: clamp(30px, 7vw, 38px);
  }

  html[data-wallpaper-phase] #trust > div > div:first-child {
    width: 100% !important;
    max-width: 720px !important;
    margin-bottom: 42px !important;
  }

  html[data-wallpaper-phase] #trust > div > div:first-child h2 {
    font-size: clamp(34px, 8vw, 44px) !important;
    line-height: 1.04 !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html[data-wallpaper-phase] #categories [style*="grid-template-columns"] > a,
  html[data-wallpaper-phase] #sources .sources-grid > a,
  html[data-wallpaper-phase] #directory article,
  html[data-wallpaper-phase] #categories [style*="grid-template-columns"] > a::before,
  html[data-wallpaper-phase] #sources .sources-grid > a::after,
  html[data-wallpaper-phase] #directory article button[data-bot-detail] svg {
    transition: none !important;
  }

  html[data-wallpaper-phase] #categories [style*="grid-template-columns"] > a:hover,
  html[data-wallpaper-phase] #sources .sources-grid > a:hover,
  html[data-wallpaper-phase] #directory article:hover,
  html[data-wallpaper-phase] #categories [style*="grid-template-columns"] > a:active,
  html[data-wallpaper-phase] #sources .sources-grid > a:active,
  html[data-wallpaper-phase] #directory article:active {
    transform: none !important;
  }
}

/* The wallpaper phase is the single source of truth for every page surface. */
html[data-wallpaper-phase] body,
html[data-wallpaper-phase] body > div,
html[data-wallpaper-phase] .v4-site {
  background: var(--site-page) !important;
  color: var(--site-text) !important;
}

html[data-wallpaper-phase] .v4-site > section:not(.v5-hero),
html[data-wallpaper-phase] footer[data-screen-label="Footer"] {
  background: var(--site-section) !important;
  color: var(--site-text) !important;
  transition: background-color 1.15s var(--apple-theme-enter), color .8s ease, border-color .8s ease;
}

html[data-wallpaper-phase] footer[data-screen-label="Footer"] {
  background: var(--site-footer) !important;
  border-color: var(--site-border) !important;
}

html[data-wallpaper-phase] :is(#directory, #categories, #platforms, #sources, #developers) {
  --abyss: var(--site-text);
  --graphite: var(--site-text-secondary);
}

html[data-wallpaper-phase] .v4-site > section:not(.v5-hero) :is(h2, h3),
html[data-wallpaper-phase] .v4-site > section:not(.v5-hero) [style*="color: #FFFFFF"],
html[data-wallpaper-phase] .v4-site > section:not(.v5-hero) [style*="color: #E6ECF5"],
html[data-wallpaper-phase] .v4-site > section:not(.v5-hero) [style*="color: #DCE5F0"],
html[data-wallpaper-phase] .v4-site > section:not(.v5-hero) [style*="color: #C5D0DF"],
html[data-wallpaper-phase] .bot-modal-card [style*="color: #FFFFFF"],
html[data-wallpaper-phase] .bot-modal-card [style*="color: #E6ECF5"],
html[data-wallpaper-phase] .bot-modal-card [style*="color: #DCE5F0"],
html[data-wallpaper-phase] .bot-modal-card [style*="color: #C5D0DF"],
html[data-wallpaper-phase] footer[data-screen-label="Footer"] [style*="color: #FFFFFF"] {
  color: var(--site-text) !important;
}

html[data-wallpaper-phase] .v4-site > section:not(.v5-hero) [style*="color: #97A6BC"],
html[data-wallpaper-phase] .v4-site > section:not(.v5-hero) [style*="color: #AEBCCF"],
html[data-wallpaper-phase] .v4-site > section:not(.v5-hero) [style*="color: #B7C3D4"],
html[data-wallpaper-phase] .bot-modal-card [style*="color: #97A6BC"],
html[data-wallpaper-phase] .bot-modal-card [style*="color: #AEBCCF"],
html[data-wallpaper-phase] .bot-modal-card [style*="color: #B7C3D4"],
html[data-wallpaper-phase] footer[data-screen-label="Footer"] [style*="color: #97A6BC"] {
  color: var(--site-text-secondary) !important;
}

html[data-wallpaper-phase] .v4-site > section:not(.v5-hero) [style*="color: #7C8BA1"],
html[data-wallpaper-phase] .v4-site > section:not(.v5-hero) [style*="color: #66768B"],
html[data-wallpaper-phase] .v4-site > section:not(.v5-hero) [style*="color: #56667B"],
html[data-wallpaper-phase] .v4-site > section:not(.v5-hero) [style*="color: #4E5D72"],
html[data-wallpaper-phase] .v4-site > section:not(.v5-hero) [style*="color: #5B6A80"],
html[data-wallpaper-phase] .bot-modal-card [style*="color: #7C8BA1"],
html[data-wallpaper-phase] .bot-modal-card [style*="color: #66768B"],
html[data-wallpaper-phase] .bot-modal-card [style*="color: #56667B"],
html[data-wallpaper-phase] footer[data-screen-label="Footer"] [style*="color: #66768B"],
html[data-wallpaper-phase] footer[data-screen-label="Footer"] [style*="color: #56667B"],
html[data-wallpaper-phase] footer[data-screen-label="Footer"] [style*="color: #4E5D72"],
html[data-wallpaper-phase] .directory-control-field,
html[data-wallpaper-phase] .submit-bot-form label,
html[data-wallpaper-phase] .footer-legal,
html[data-wallpaper-phase] .footer-disclaimer {
  color: var(--site-text-muted) !important;
}

html[data-wallpaper-phase] .v4-site > section:not(.v5-hero) [style*="color: var(--ac"],
html[data-wallpaper-phase] .bot-modal-card [style*="color: var(--ac"] {
  color: var(--site-accent-ink) !important;
}

html[data-wallpaper-phase] .v4-site > section:not(.v5-hero) [style*="color: #6FC4FF"],
html[data-wallpaper-phase] .bot-modal-card [style*="color: #6FC4FF"] { color: var(--site-blue) !important; }
html[data-wallpaper-phase] .v4-site > section:not(.v5-hero) [style*="color: #B9AEFF"],
html[data-wallpaper-phase] .v4-site > section:not(.v5-hero) [style*="color: #A99BFF"],
html[data-wallpaper-phase] .v4-site > section:not(.v5-hero) [style*="color: #D6CFFF"],
html[data-wallpaper-phase] .bot-modal-card [style*="color: #B9AEFF"] { color: var(--site-violet) !important; }
html[data-wallpaper-phase] .v4-site > section:not(.v5-hero) [style*="color: #3EF2B4"],
html[data-wallpaper-phase] .bot-modal-card [style*="color: #3EF2B4"] { color: var(--site-green) !important; }
html[data-wallpaper-phase] .v4-site > section:not(.v5-hero) [style*="color: #E8C575"],
html[data-wallpaper-phase] .bot-modal-card [style*="color: #E8C575"] { color: var(--site-amber) !important; }

html[data-wallpaper-phase] :is(#directory, #categories, #platforms, #sources, #developers) [style*="color: #FFFFFF"],
html[data-wallpaper-phase] :is(#directory, #categories, #platforms, #sources, #developers) [style*="color: #E6ECF5"],
html[data-wallpaper-phase] :is(#directory, #categories, #platforms, #sources, #developers) [style*="color: #DCE5F0"],
html[data-wallpaper-phase] :is(#directory, #categories, #platforms, #sources, #developers) [style*="color: #C5D0DF"] {
  color: var(--site-text) !important;
}

html[data-wallpaper-phase] :is(#directory, #categories, #platforms, #sources, #developers) [style*="color: #97A6BC"],
html[data-wallpaper-phase] :is(#directory, #categories, #platforms, #sources, #developers) [style*="color: #AEBCCF"],
html[data-wallpaper-phase] :is(#directory, #categories, #platforms, #sources, #developers) [style*="color: #B7C3D4"] {
  color: var(--site-text-secondary) !important;
}

html[data-wallpaper-phase] :is(#directory, #categories, #platforms, #sources, #developers) [style*="color: #7C8BA1"],
html[data-wallpaper-phase] :is(#directory, #categories, #platforms, #sources, #developers) [style*="color: #66768B"],
html[data-wallpaper-phase] :is(#directory, #categories, #platforms, #sources, #developers) [style*="color: #56667B"],
html[data-wallpaper-phase] :is(#directory, #categories, #platforms, #sources, #developers) [style*="color: #4E5D72"],
html[data-wallpaper-phase] :is(#directory, #categories, #platforms, #sources, #developers) [style*="color: #5B6A80"] {
  color: var(--site-text-muted) !important;
}

html[data-wallpaper-phase] :is(#directory, #categories, #platforms, #sources, #developers) [style*="color: var(--ac"] {
  color: var(--site-accent-ink) !important;
}

html[data-wallpaper-phase] .directory-controls,
html[data-wallpaper-phase] #directory article,
html[data-wallpaper-phase] #categories [style*="grid-template-columns"] > a,
html[data-wallpaper-phase] #platforms > div > div:last-child,
html[data-wallpaper-phase] #sources [style*="grid-template-columns"] > a,
html[data-wallpaper-phase] #developers > div > div,
html[data-wallpaper-phase] #trust > div > div:nth-child(2) > div,
html[data-wallpaper-phase] section[data-screen-label="Future Vision"] [style*="border-radius: 999px"],
html[data-wallpaper-phase] #bot-directory-grid > div {
  border-color: var(--site-border) !important;
  background: var(--site-surface) !important;
  color: var(--site-text) !important;
  transition: background-color .8s ease, color .8s ease, border-color .8s ease, transform .2s ease;
}

html[data-wallpaper-phase] .bot-modal-card {
  border-color: var(--site-border) !important;
  background: var(--site-surface) !important;
  color: var(--site-text) !important;
  transition:
    opacity .28s var(--apple-exit),
    transform .28s var(--apple-exit),
    background-color .8s ease,
    color .8s ease,
    border-color .8s ease;
}
html[data-wallpaper-phase] .bot-modal.is-open .bot-modal-card {
  transition:
    opacity .28s var(--apple-enter),
    transform .28s var(--apple-enter),
    background-color .8s ease,
    color .8s ease,
    border-color .8s ease;
}

html[data-wallpaper-phase] #directory article {
  box-shadow: 0 10px 28px var(--site-shadow) !important;
}

html[data-wallpaper-phase] #categories [style*="grid-template-columns"] > a:hover,
html[data-wallpaper-phase] #sources [style*="grid-template-columns"] > a:hover,
html[data-wallpaper-phase] #directory article:hover {
  border-color: var(--site-border-strong) !important;
  background: var(--site-surface-strong) !important;
}

html[data-wallpaper-phase] #platforms > div > div:last-child > div,
html[data-wallpaper-phase] #directory article [style*="border-top"],
html[data-wallpaper-phase] .v4-site > section:not(.v5-hero) [style*="border: 1px solid rgba(255,255,255"],
html[data-wallpaper-phase] .v4-site > section:not(.v5-hero) [style*="border-bottom: 1px solid rgba(255,255,255"],
html[data-wallpaper-phase] footer[data-screen-label="Footer"],
html[data-wallpaper-phase] .footer-legal,
html[data-wallpaper-phase] .bot-modal-card [style*="border: 1px solid rgba(255,255,255"] {
  border-color: var(--site-border) !important;
}

html[data-wallpaper-phase] #platforms > div > div:last-child > div:first-child {
  background: var(--site-surface-soft) !important;
}

html[data-wallpaper-phase] #platforms [style*="height: 7px"][style*="background: rgba(255,255,255"] {
  background: var(--site-control) !important;
}

html[data-wallpaper-phase] #platforms [style*="background: rgba(255,255,255,0.22)"],
html[data-wallpaper-phase] #platforms [style*="background: rgba(255,255,255,0.18)"] {
  background: var(--site-border-strong) !important;
}

html[data-wallpaper-phase] .directory-control-field input,
html[data-wallpaper-phase] .directory-control-field select,
html[data-wallpaper-phase] .submit-bot-form input,
html[data-wallpaper-phase] .submit-bot-form select,
html[data-wallpaper-phase] .submit-bot-form textarea,
html[data-wallpaper-phase] .directory-reset-button {
  border-color: var(--site-border) !important;
  background: var(--site-control) !important;
  color: var(--site-text) !important;
  transition: background-color .8s ease, color .8s ease, border-color .8s ease, box-shadow .2s ease;
}

html[data-wallpaper-phase] :is(.directory-control-field input, .submit-bot-form input, .submit-bot-form textarea)::placeholder {
  color: var(--site-text-muted) !important;
  opacity: .82;
}

html[data-wallpaper-phase] :is(.directory-control-field input, .directory-control-field select, .submit-bot-form input, .submit-bot-form select, .submit-bot-form textarea):focus {
  border-color: var(--site-accent-ink) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--site-accent-ink) 18%, transparent) !important;
}

html[data-wallpaper-phase] select option {
  background: var(--site-surface-strong);
  color: var(--site-text);
}

html[data-wallpaper-phase] #directory article > div:nth-child(2) > div:first-child {
  background: var(--site-control) !important;
  color: var(--site-text) !important;
  border-color: var(--site-border) !important;
}

html[data-wallpaper-phase] .bot-modal-backdrop {
  background: var(--site-overlay) !important;
}

html[data-wallpaper-phase] .bot-modal .bot-modal-card {
  border-color: var(--site-border-strong) !important;
  background: var(--site-surface-strong) !important;
  color: var(--site-text) !important;
  box-shadow: 0 28px 90px var(--site-shadow), inset 0 1px 0 var(--site-border) !important;
}

html[data-wallpaper-phase] .bot-modal-card [style*="border-radius: 13px"],
html[data-wallpaper-phase] .bot-modal-card [style*="border-radius: 14px"],
html[data-wallpaper-phase] .bot-modal-card [data-close-bot-detail] {
  border-color: var(--site-border) !important;
  background: var(--site-surface-soft) !important;
  color: var(--site-text) !important;
}

html[data-wallpaper-phase] #developers a[style*="linear-gradient"],
html[data-wallpaper-phase] section[data-screen-label="Future Vision"] a:first-child {
  background: var(--site-text) !important;
  color: var(--site-section) !important;
}

html[data-wallpaper-phase] section[data-screen-label="Future Vision"] a:last-child {
  border-color: var(--site-border-strong) !important;
  background: var(--site-surface-soft) !important;
  color: var(--site-text) !important;
}

html[data-wallpaper-phase] section[data-screen-label="Future Vision"] h2 span {
  color: var(--site-accent-ink) !important;
  -webkit-text-fill-color: var(--site-accent-ink) !important;
}

html[data-wallpaper-phase] footer[data-screen-label="Footer"] a {
  color: var(--site-text-secondary) !important;
}

html[data-wallpaper-phase] .v4-site > section:not(.v5-hero) a:not([style*="linear-gradient"]):hover,
html[data-wallpaper-phase] footer[data-screen-label="Footer"] a:hover {
  color: var(--site-text) !important;
}

html[data-wallpaper-phase] .v5-nav,
html[data-wallpaper-phase] .v5-nav.has-scrolled,
html[data-wallpaper-phase] .v5-nav.is-light.has-scrolled {
  background: transparent !important;
  color: var(--site-text) !important;
}

html[data-wallpaper-phase] .v5-nav.has-scrolled,
html[data-wallpaper-phase] .v5-nav.is-light.has-scrolled {
  background: var(--site-nav-panel) !important;
  -webkit-backdrop-filter: blur(28px) saturate(155%) !important;
  backdrop-filter: blur(28px) saturate(155%) !important;
}

html[data-wallpaper-phase] .v5-nav::after,
html[data-wallpaper-phase] .v5-nav.is-light.has-scrolled::after {
  background: linear-gradient(180deg, var(--site-shadow), transparent) !important;
}

html[data-wallpaper-phase] .v5-nav > div > div:first-child > div:nth-child(2),
html[data-wallpaper-phase] .v5-nav.is-light > div > div:first-child > div:nth-child(2),
html[data-wallpaper-phase] .v5-nav nav a,
html[data-wallpaper-phase] .v5-nav.is-light nav a {
  color: var(--site-text) !important;
}

html[data-wallpaper-phase] .v5-nav nav a:hover,
html[data-wallpaper-phase] .v5-nav.is-light nav a:hover {
  background: var(--site-surface-soft) !important;
  color: var(--site-text) !important;
}

html[data-wallpaper-phase] .v5-nav > div > div:last-child > a,
html[data-wallpaper-phase] .v5-nav.is-light > div > div:last-child > a {
  border-color: var(--site-border-strong) !important;
  background: var(--site-surface-soft) !important;
  color: var(--site-text) !important;
}

html[data-wallpaper-phase] .v5-nav .dynamic-theme-trigger,
html[data-wallpaper-phase] .v5-nav.is-light .dynamic-theme-trigger {
  border-color: var(--site-border-strong) !important;
  background: var(--site-surface-soft) !important;
  color: var(--site-text) !important;
}

html[data-wallpaper-phase] .v5-nav .dynamic-theme-menu,
html[data-wallpaper-phase] .v5-nav.is-light .dynamic-theme-menu {
  border-color: var(--site-border) !important;
  background: var(--site-nav-panel) !important;
  box-shadow: 0 18px 50px var(--site-shadow), inset 0 1px 0 var(--site-border) !important;
}

html[data-wallpaper-phase] .v5-nav .dynamic-theme-option,
html[data-wallpaper-phase] .v5-nav.is-light .dynamic-theme-option {
  color: var(--site-text-secondary) !important;
}

html[data-wallpaper-phase] .v5-nav .dynamic-theme-option:hover,
html[data-wallpaper-phase] .v5-nav .dynamic-theme-option:focus-visible,
html[data-wallpaper-phase] .v5-nav .dynamic-theme-option[aria-checked="true"],
html[data-wallpaper-phase] .v5-nav.is-light .dynamic-theme-option:hover,
html[data-wallpaper-phase] .v5-nav.is-light .dynamic-theme-option:focus-visible,
html[data-wallpaper-phase] .v5-nav.is-light .dynamic-theme-option[aria-checked="true"] {
  background: var(--site-surface-soft) !important;
  color: var(--site-text) !important;
}

html[data-wallpaper-phase] :is(#vision, #trust) {
  background: var(--site-section-alt) !important;
}

html[data-wallpaper-phase] #trust::before {
  display: block;
  color: var(--site-text-secondary) !important;
}

html[data-wallpaper-phase] .section-kicker {
  color: var(--site-accent-ink) !important;
}

html[data-wallpaper-phase] .users-developers-grid {
  gap: 0 !important;
  border-top: 1px solid var(--site-border);
  border-bottom: 1px solid var(--site-border);
}

html[data-wallpaper-phase] #developers .audience-panel {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html[data-wallpaper-phase] #developers .audience-panel + .audience-panel {
  border-left: 1px solid var(--site-border) !important;
}

html[data-wallpaper-phase] #developers .audience-panel > div[style*="position: absolute"] {
  display: none;
}

html[data-wallpaper-phase] :is(
  .directory-controls,
  #directory article,
  #platforms > div > div:last-child,
  #sources [style*="grid-template-columns"] > a,
  #trust > div > div:nth-child(2) > div
) {
  border-radius: 8px !important;
}

html[data-wallpaper-phase] #directory article {
  box-shadow: 0 8px 22px var(--site-shadow) !important;
}

@media (max-width: 1100px) {
  html[data-wallpaper-phase] #developers .audience-panel + .audience-panel {
    border-top: 1px solid var(--site-border) !important;
    border-left: 0 !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html[data-wallpaper-phase] .v4-site > section:not(.v5-hero),
  html[data-wallpaper-phase] footer[data-screen-label="Footer"],
  html[data-wallpaper-phase] .directory-controls,
  html[data-wallpaper-phase] #directory article,
  html[data-wallpaper-phase] #categories [style*="grid-template-columns"] > a,
  html[data-wallpaper-phase] #platforms > div > div:last-child,
  html[data-wallpaper-phase] #sources [style*="grid-template-columns"] > a,
  html[data-wallpaper-phase] #developers > div > div,
  html[data-wallpaper-phase] #trust > div > div:nth-child(2) > div,
  html[data-wallpaper-phase] .bot-modal-card,
  html[data-wallpaper-phase] :is(input, select, textarea, button) {
    transition: none !important;
  }
}

@media (prefers-reduced-transparency: reduce) {
  html[data-wallpaper-phase] .v5-nav.has-scrolled,
  html[data-wallpaper-phase] .v5-nav.is-light.has-scrolled,
  html[data-wallpaper-phase] .v5-nav .dynamic-theme-menu,
  html[data-wallpaper-phase] .v5-nav.is-light .dynamic-theme-menu {
    background: var(--site-surface-strong) !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }
}

@media (prefers-contrast: more) {
  html[data-wallpaper-phase] .directory-controls,
  html[data-wallpaper-phase] #directory article,
  html[data-wallpaper-phase] #categories [style*="grid-template-columns"] > a,
  html[data-wallpaper-phase] #platforms > div > div:last-child,
  html[data-wallpaper-phase] #sources [style*="grid-template-columns"] > a,
  html[data-wallpaper-phase] #developers > div > div,
  html[data-wallpaper-phase] #trust > div > div:nth-child(2) > div,
  html[data-wallpaper-phase] .bot-modal-card {
    border-color: var(--site-border-strong) !important;
  }
}
