html[data-theme="light"] { color-scheme: light; }
html:not([data-theme="light"]) { color-scheme: dark; }

html[data-theme-id] body.site,
body.site {
  --accent: #635bff;
  --accent-hover: #5147e8;
  --secondary: #00b8d9;
  --background: #f6f7fb;
  --bg: #f6f7fb;
  --surface: #ffffff;
  --surface-2: #f3f5fa;
  --paper: #ffffff;
  --ink: #171a2b;
  --text-primary: #171a2b;
  --text-secondary: #6b7280;
  --text-muted: #6b7280;
  --muted: #6b7280;
  --border: #e6e8f0;
  --line: #e6e8f0;
  --field: #f3f5fa;
  --chip: #f3f5fa;
  --surface-hover: #eef0f6;
  --footer-bg: #ffffff;
  --footer-ink: #171a2b;
  --footer-link: #6b7280;
  --footer-muted: #6b7280;
  --footer-line: #e6e8f0;
  --toast-bg: #ffffff;
  --toast-ink: #171a2b;
  --header: 68px;
  --favorite: #ff4d6d;
  background: #f6f7fb;
  color: #171a2b;
  font-family: Inter, "Source Sans 3", system-ui, sans-serif;
}
html[dir="rtl"] body.site { font-family: Cairo, Inter, system-ui, sans-serif; }

html:not([data-theme="light"]) body.site,
html[data-theme-id]:not([data-theme="light"]) body.site {
  --accent: #7c5cff;
  --accent-hover: #8b70ff;
  --secondary: #00c2e8;
  --background: #080b16;
  --bg: #080b16;
  --surface: #111525;
  --surface-2: #171c30;
  --paper: #111525;
  --ink: #ffffff;
  --text-primary: #ffffff;
  --text-secondary: #9ca3af;
  --text-muted: #9ca3af;
  --muted: #9ca3af;
  --border: #252b42;
  --line: #252b42;
  --field: #171c30;
  --chip: #171c30;
  --surface-hover: #1d2438;
  --footer-bg: #0b0f1c;
  --footer-ink: #ffffff;
  --footer-link: #9ca3af;
  --footer-muted: #9ca3af;
  --footer-line: #252b42;
  --toast-bg: #171c30;
  --toast-ink: #ffffff;
  background: #080b16;
  color: #ffffff;
}

body.site :focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
body.site .wrap { width: min(1240px, 100%); padding-inline: 24px; }

html[data-theme-id] body.site .site-header,
body.site .site-header { background: transparent; border: 0; box-shadow: none; }
html[data-theme-id] body.site .header-bar,
body.site .header-bar {
  background: #ffffff;
  border-bottom: 1px solid #e6e8f0;
}
html:not([data-theme="light"]) body.site .header-bar {
  background: #0b0f1c;
  border-bottom-color: #252b42;
}
body.site .header-bar > .wrap { width: min(1480px, 100%); }
body.site .header-inner {
  min-height: 68px;
  height: 68px;
  display: grid;
  grid-template-columns: auto minmax(200px, 300px) minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  position: relative;
}
body.site .logo {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #171a2b;
  text-decoration: none;
  z-index: 1;
}
html:not([data-theme="light"]) body.site .logo { color: #ffffff; }
body.site .logo-wave {
  width: 28px;
  height: 28px;
  color: #635bff;
  display: inline-flex;
}
html:not([data-theme="light"]) body.site .logo-wave { color: #7c5cff; }
body.site .logo-wave svg { width: 28px; height: 28px; display: block; }
body.site .logo-name { font-size: 20px; font-weight: 800; letter-spacing: -0.03em; white-space: nowrap; }
body.site .logo .logo-base { color: #171a2b; }
html:not([data-theme="light"]) body.site .logo .logo-base { color: #ffffff; }
body.site .logo .logo-accent { color: #635bff; }
html:not([data-theme="light"]) body.site .logo .logo-accent { color: #7c5cff; }

body.site .header-search {
  position: static;
  transform: none;
  width: 100%;
  max-width: none;
  flex: none;
  margin: 0;
  z-index: 1;
}
body.site .desktop-nav { justify-self: end; min-width: 0; flex-wrap: nowrap; }
body.site .desktop-nav a,
body.site .desktop-nav .nav-btn { font-size: 13px; padding: 6px 6px; }
html[data-theme-id] body.site .header-search input,
body.site .header-search input {
  height: 42px;
  min-height: 42px;
  background: #f3f5fa;
  color: #171a2b;
  border: 1px solid transparent;
  border-radius: 14px;
  box-shadow: none;
  font-size: 14px;
}
html:not([data-theme="light"]) body.site .header-search input {
  background: #171c30;
  color: #ffffff;
  border-color: #252b42;
}
body.site .header-search input::placeholder,
body.site .header-search .search-icon { color: #6b7280; }
html:not([data-theme="light"]) body.site .header-search input::placeholder,
html:not([data-theme="light"]) body.site .header-search .search-icon { color: #9ca3af; }

body.site .desktop-nav,
body.site .header-end { z-index: 2; }
body.site .desktop-nav {
  margin-inline-start: auto;
  gap: 2px;
}
body.site .desktop-nav a,
body.site .desktop-nav .nav-btn,
body.site .profile-menu summary,
body.site .header-end .nav-btn,
body.site .header-end .theme-toggle {
  color: #171a2b;
  background: transparent;
  font-size: 14px;
  font-weight: 600;
  padding: 6px 8px;
  text-decoration: none;
}
html:not([data-theme="light"]) body.site .desktop-nav a,
html:not([data-theme="light"]) body.site .desktop-nav .nav-btn,
html:not([data-theme="light"]) body.site .profile-menu summary,
html:not([data-theme="light"]) body.site .header-end .nav-btn,
html:not([data-theme="light"]) body.site .header-end .theme-toggle { color: #ffffff; }
body.site .desktop-nav a:hover,
body.site .desktop-nav .nav-btn:hover,
body.site .desktop-nav a.is-on {
  color: #635bff;
  background: transparent;
  text-decoration: none;
}
html:not([data-theme="light"]) body.site .desktop-nav a:hover,
html:not([data-theme="light"]) body.site .desktop-nav .nav-btn:hover,
html:not([data-theme="light"]) body.site .desktop-nav a.is-on { color: #8b70ff; }
body.site .header-end { gap: 6px; }
body.site .header-country select,
body.site .header-end .nav-btn {
  height: 36px;
  border-radius: 999px;
  border: 1px solid #e6e8f0;
  background: #ffffff;
  color: #171a2b;
  padding-inline: 10px;
}
html:not([data-theme="light"]) body.site .header-country select,
html:not([data-theme="light"]) body.site .header-end .nav-btn {
  background: #111525;
  color: #ffffff;
  border-color: #252b42;
}
body.site .dropdown-panel,
body.site .profile-pop {
  background: #ffffff;
  color: #171a2b;
  border: 1px solid #e6e8f0;
  border-radius: 14px;
}
html:not([data-theme="light"]) body.site .dropdown-panel,
html:not([data-theme="light"]) body.site .profile-pop {
  background: #111525;
  color: #ffffff;
  border-color: #252b42;
}
body.site .dropdown-panel a,
body.site .profile-pop a,
body.site .profile-pop button { color: inherit; }

html[data-theme-id] body.site .site-header .cat-pills,
body.site .site-header .cat-pills {
  background: transparent;
  display: flex;
  flex-wrap: nowrap;
  gap: 8px;
  overflow-x: auto;
  min-height: 0;
  padding-top: 14px;
  padding-bottom: 6px;
  margin: 0 auto 8px;
}
html[data-theme-id] body.site .cat-pill,
body.site .cat-pill,
body.site .site-header .cat-pill {
  background: #ffffff;
  color: #171a2b;
  border: 1px solid #e6e8f0;
  border-radius: 14px;
  min-height: 36px;
  padding: 0 12px;
  font-size: 13px;
  font-weight: 650;
  white-space: nowrap;
  flex: 0 0 auto;
}
body.site .cat-pill i { color: #6b7280; }
html:not([data-theme="light"]) body.site .cat-pill {
  background: #111525;
  color: #ffffff;
  border-color: #252b42;
}
html:not([data-theme="light"]) body.site .cat-pill i { color: #9ca3af; }
html[data-theme-id] body.site .cat-pill.is-on,
body.site .site-header .cat-pill.is-on,
body.site .site-header .cat-pill.is-on i,
body.site .cat-pill.is-on,
body.site .cat-pill.is-on i {
  background: #635bff;
  color: #ffffff;
  border-color: transparent;
}
html:not([data-theme="light"]) body.site .site-header .cat-pill.is-on,
html:not([data-theme="light"]) body.site .site-header .cat-pill.is-on i,
html:not([data-theme="light"]) body.site .cat-pill.is-on,
html:not([data-theme="light"]) body.site .cat-pill.is-on i {
  background: #7c5cff;
  color: #ffffff;
}

body.site .ad-frame,
body.site .ad-frame-main { max-width: 1240px; }
body.site .section { padding-top: 8px; }

html[data-theme-id] body.site .feature-card,
html:not([data-theme="light"]) body.site .feature-card,
body.site .feature-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) 160px;
  align-items: center;
  gap: 28px;
  padding: 22px 26px;
  background: #ffffff;
  color: #171a2b;
  border: 1px solid #e6e8f0;
  border-radius: 20px;
  box-shadow: 0 8px 24px rgba(23, 26, 43, 0.05);
}
html:not([data-theme="light"]) body.site .feature-card {
  background: #111525;
  color: #ffffff;
  border-color: #252b42;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.28);
}
body.site .feature-play { order: 0; }
body.site .feature-play .sound-item.is-hero .sound-face,
body.site .feature-card .sound-face { width: 118px; height: 118px; }
body.site .feature-card h2 { margin: 0; font-size: 28px; line-height: 1.15; color: inherit; }
body.site .feature-card h2::before { content: none; }
body.site .feature-sound { color: inherit; font-weight: 800; text-decoration: none; }
body.site .feature-sub,
body.site .feature-blurb,
body.site .feature-stats { color: #6b7280; }
html:not([data-theme="light"]) body.site .feature-sub,
html:not([data-theme="light"]) body.site .feature-blurb,
html:not([data-theme="light"]) body.site .feature-stats { color: #9ca3af; }
body.site .hot-pill {
  background: #efeefe;
  color: #635bff;
  border-radius: 999px;
  font-size: 11px;
  letter-spacing: 0.04em;
}
html:not([data-theme="light"]) body.site .hot-pill {
  background: rgba(124, 92, 255, 0.16);
  color: #c4b5fd;
}
body.site .feature-art {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 7px;
  height: 92px;
}
body.site .feature-art span {
  width: 8px;
  border-radius: 99px;
  background: linear-gradient(180deg, #635bff, #00b8d9);
  display: block;
}
body.site .feature-art span:nth-child(1) { height: 28px; }
body.site .feature-art span:nth-child(2) { height: 52px; }
body.site .feature-art span:nth-child(3) { height: 78px; }
body.site .feature-art span:nth-child(4) { height: 46px; }
body.site .feature-art span:nth-child(5) { height: 88px; }
body.site .feature-art span:nth-child(6) { height: 40px; }
body.site .feature-art span:nth-child(7) { height: 64px; }
html:not([data-theme="light"]) body.site .feature-art span {
  background: linear-gradient(180deg, #7c5cff, #00c2e8);
  box-shadow: 0 0 12px rgba(124, 92, 255, 0.35);
}

body.site .section-head { align-items: flex-end; margin: 28px 0 14px; }
body.site .section-head h2,
body.site .ad-frame h2,
body.site .random-card h2 {
  color: #171a2b;
  font-size: 22px;
  font-weight: 800;
  margin: 0;
}
html:not([data-theme="light"]) body.site .section-head h2,
html:not([data-theme="light"]) body.site .ad-frame h2,
html:not([data-theme="light"]) body.site .random-card h2 { color: #ffffff; }
body.site .section-head h2::before,
body.site .section h2::before,
body.site .ad-frame h2::before,
body.site .random-card h2::before {
  background: #635bff;
  width: 4px;
  border-radius: 4px;
}
html:not([data-theme="light"]) body.site .section-head h2::before,
html:not([data-theme="light"]) body.site .random-card h2::before { background: #7c5cff; }
body.site .section-sub,
body.site .random-card p { margin: 4px 0 0; color: #6b7280; font-size: 14px; }
html:not([data-theme="light"]) body.site .section-sub,
html:not([data-theme="light"]) body.site .random-card p { color: #9ca3af; }
body.site .view-all,
html[data-theme-id] body.site .view-all {
  background: #ffffff;
  color: #171a2b;
  border: 1px solid #e6e8f0;
  border-radius: 999px;
  box-shadow: none;
  font-weight: 700;
  padding: 8px 14px;
}
html:not([data-theme="light"]) body.site .view-all {
  background: transparent;
  color: #ffffff;
  border-color: #252b42;
}
body.site .view-all:hover { background: #f3f5fa; color: #171a2b; }
html:not([data-theme="light"]) body.site .view-all:hover { background: #171c30; color: #ffffff; }

html[data-theme-id] body.site .sound-item:not(.is-hero),
html[data-theme-id] body.site .sound-item:not(.is-hero):hover,
body.site .sound-item:not(.is-hero),
body.site .sound-item:not(.is-hero):hover {
  background: transparent;
  border: 0;
  box-shadow: none;
  border-radius: 0;
  padding: 0 2px 4px;
  transform: none;
  backdrop-filter: none;
}
body.site .sound-title {
  color: #6b7280;
  font-size: 13px;
  font-weight: 650;
  text-align: center;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
html:not([data-theme="light"]) body.site .sound-title { color: #d1d5db; }
html[data-theme-id] body.site .sound-glyph,
body.site .sound-glyph { display: none; }
html[data-theme-id] body.site .sound-button,
body.site .sound-button {
  background: transparent;
  border: 0;
  box-shadow: none;
  filter: none;
}
body.site .sound-item:not(.is-hero) .sound-face { width: min(96px, 100%); }
body.site .sound-item:not(.is-hero) .sound-button img { object-fit: contain; }
body.site .sound-item:not(.is-hero) .sound-button:hover {
  transform: translateY(-3px) scale(1.07);
  filter: brightness(1.08) drop-shadow(0 8px 20px rgba(99, 91, 255, 0.25));
}
body.site .sound-item:not(.is-hero) .favorite-button,
body.site .sound-item:not(.is-hero) .copy-button,
body.site .sound-item:not(.is-hero) .share-button {
  width: 30px;
  height: 30px;
  border: 0;
  color: #fff;
}
body.site .sound-item:not(.is-hero) .favorite-button { background: #ff4d6d; }
body.site .sound-item:not(.is-hero) .copy-button { background: #00b8d9; }
body.site .sound-item:not(.is-hero) .share-button { background: #3b9bf3; }
body.site .sound-item:not(.is-hero) .favorite-button:hover,
body.site .sound-item:not(.is-hero) .copy-button:hover,
body.site .sound-item:not(.is-hero) .share-button:hover { filter: brightness(1.08); }

@media (min-width: 1100px) {
  body.site .sound-grid,
  body.site .home-layout .sound-grid,
  body.site .home-layout[data-home] .sound-grid {
    display: grid;
    column-count: auto;
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
}
@media (min-width: 1600px) {
  body.site .sound-grid,
  body.site .home-layout[data-home] .sound-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
}
@media (min-width: 768px) and (max-width: 1099px) {
  body.site .sound-grid,
  body.site .home-layout[data-home] .sound-grid {
    display: grid;
    column-count: auto;
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

html[data-theme-id] body.site .random-card,
body.site .random-card {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-top: 28px;
  padding: 18px 20px;
  background: #ffffff;
  color: #171a2b;
  border: 1px solid #e6e8f0;
  border-radius: 18px;
  box-shadow: 0 8px 20px rgba(23, 26, 43, 0.04);
}
html:not([data-theme="light"]) body.site .random-card {
  background: #111525;
  color: #ffffff;
  border-color: #252b42;
}
body.site .random-card > div { flex: 1; min-width: 0; }
body.site .random-icon {
  width: 44px;
  height: 44px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  background: #efeefe;
  color: #635bff;
  flex: none;
}
html:not([data-theme="light"]) body.site .random-icon {
  background: rgba(124, 92, 255, 0.16);
  color: #c4b5fd;
}
body.site .btn,
body.site .feature-card .btn,
body.site .random-card .btn {
  background: #635bff;
  color: #ffffff;
  border: 0;
  border-radius: 12px;
  box-shadow: none;
  font-weight: 700;
}
body.site .btn:hover,
body.site .feature-card .btn:hover,
body.site .random-card .btn:hover { background: #5147e8; }
html:not([data-theme="light"]) body.site .btn,
html:not([data-theme="light"]) body.site .feature-card .btn,
html:not([data-theme="light"]) body.site .random-card .btn {
  background: #7c5cff;
  box-shadow: 0 8px 18px rgba(124, 92, 255, 0.28);
}
html:not([data-theme="light"]) body.site .btn:hover { background: #8b70ff; }
body.site .btn.secondary,
body.site .sound-detail-actions .btn.secondary {
  background: transparent;
  color: #171a2b;
  border: 1px solid #e6e8f0;
  box-shadow: none;
}
html:not([data-theme="light"]) body.site .btn.secondary,
html:not([data-theme="light"]) body.site .sound-detail-actions .btn.secondary {
  background: transparent;
  color: #ffffff;
  border-color: #252b42;
  box-shadow: none;
}

html[data-theme-id] body.site .site-footer,
body.site .site-footer {
  background: #ffffff;
  color: #171a2b;
  border-top: 1px solid #e6e8f0;
}
html:not([data-theme="light"]) body.site .site-footer {
  background: #0b0f1c;
  color: #ffffff;
  border-top-color: #252b42;
}
body.site .site-footer h3 { color: inherit; }
body.site .site-footer a,
body.site .site-footer p,
body.site .legal-bar { color: #6b7280; }
html:not([data-theme="light"]) body.site .site-footer a,
html:not([data-theme="light"]) body.site .site-footer p,
html:not([data-theme="light"]) body.site .legal-bar { color: #9ca3af; }
body.site .footer-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }

body.site .panel,
body.site .auth-card,
body.site .cat-card,
body.site .empty-state,
body.site .creator-card,
body.site .page-card,
html:not([data-theme="light"]) body.site .coming-card,
body.site .coming-card {
  background: #ffffff;
  color: #171a2b;
  border: 1px solid #e6e8f0;
}
html:not([data-theme="light"]) body.site .panel,
html:not([data-theme="light"]) body.site .auth-card,
html:not([data-theme="light"]) body.site .cat-card,
html:not([data-theme="light"]) body.site .empty-state,
html:not([data-theme="light"]) body.site .creator-card,
html:not([data-theme="light"]) body.site .page-card,
html:not([data-theme="light"]) body.site .coming-card {
  background: #111525;
  color: #ffffff;
  border-color: #252b42;
}
body.site .field input,
body.site .field textarea,
body.site .field select,
body.site .auth-card input,
body.site .auth-card select,
body.site .auth-card textarea {
  background: #ffffff;
  color: #171a2b;
  border: 1px solid #e6e8f0;
  border-radius: 12px;
}
html:not([data-theme="light"]) body.site .field input,
html:not([data-theme="light"]) body.site .field textarea,
html:not([data-theme="light"]) body.site .field select,
html:not([data-theme="light"]) body.site .auth-card input,
html:not([data-theme="light"]) body.site .auth-card select,
html:not([data-theme="light"]) body.site .auth-card textarea {
  background: #171c30;
  color: #ffffff;
  border-color: #252b42;
}
body.site .player {
  background: #ffffff;
  color: #171a2b;
  border-color: #e6e8f0;
}
html:not([data-theme="light"]) body.site .player {
  background: #111525;
  color: #ffffff;
  border-color: #252b42;
}
body.site .page-head h1,
body.site h1 { color: inherit; }

@media (max-width: 1180px) {
  body.site .header-inner { grid-template-columns: auto minmax(180px, 260px) minmax(0, 1fr) auto; }
  body.site .desktop-nav a,
  body.site .desktop-nav .nav-btn { padding-inline: 5px; font-size: 13px; }
  body.site .feature-card,
  html:not([data-theme="light"]) body.site .feature-card { grid-template-columns: auto minmax(0, 1fr); }
  body.site .feature-art { display: none; }
}
@media (max-width: 767px) {
  body.site { padding-bottom: calc(78px + env(safe-area-inset-bottom)); }
  body.site .wrap { padding-inline: 16px; }
  body.site .header-inner {
    display: flex;
    height: auto;
    min-height: 60px;
    flex-wrap: wrap;
    padding-top: 8px;
    padding-bottom: 0;
  }
  body.site .logo-name { font-size: 16px; }
  body.site .desktop-nav,
  body.site .header-end,
  body.site .store-links { display: none; }
  body.site .mobile-tools { display: flex; margin-inline-start: auto; }
  body.site .header-search {
    order: 3;
    flex: 1 1 100%;
    width: 100%;
    max-width: none;
    margin: 0 0 10px;
  }
  body.site .header-search input,
  html[data-theme-id] body.site .header-search input { height: 44px; min-height: 44px; border-radius: 14px; }
  body.site .cat-pill { min-height: 34px; }
  body.site .feature-card,
  html:not([data-theme="light"]) body.site .feature-card,
  html[dir="rtl"] body.site .feature-card {
    grid-template-columns: 1fr;
    justify-items: center;
    text-align: center;
    padding: 18px;
    border-radius: 18px;
    gap: 12px;
  }
  body.site .feature-copy { justify-items: center; }
  body.site .feature-actions { justify-content: center; }
  body.site .feature-stats { justify-content: center; }
  body.site .feature-card h2 { font-size: 22px; }
  body.site .feature-play .sound-item.is-hero .sound-face { width: 108px; height: 108px; }
  body.site .sound-grid,
  body.site .home-layout .sound-grid,
  body.site .home-layout[data-home] .sound-grid {
    display: grid;
    column-count: auto;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px 10px;
  }
  body.site .sound-item:not(.is-hero) .sound-face { width: min(86px, 90%); }
  body.site .sound-title { font-size: 12px; }
  body.site .sound-item:not(.is-hero) .favorite-button,
  body.site .sound-item:not(.is-hero) .copy-button,
  body.site .sound-item:not(.is-hero) .share-button { width: 28px; height: 28px; }
  body.site .random-card { flex-wrap: wrap; }
  body.site .random-card .btn { width: 100%; }
  body.site .footer-grid { grid-template-columns: 1fr 1fr; gap: 18px; }
  body.site .mobile-drawer,
  body.site .mobile-drawer.is-open {
    background: #ffffff;
    color: #171a2b;
    border-inline-start: 1px solid #e6e8f0;
  }
  html:not([data-theme="light"]) body.site .mobile-drawer,
  html:not([data-theme="light"]) body.site .mobile-drawer.is-open {
    background: #111525;
    color: #ffffff;
    border-color: #252b42;
  }
  body.site .mobile-drawer a,
  body.site .mobile-drawer button,
  body.site .mobile-drawer select { color: inherit; }
  body.site .mobile-nav {
    background: #ffffff;
    border-top: 1px solid #e6e8f0;
    height: calc(68px + env(safe-area-inset-bottom));
    padding-bottom: env(safe-area-inset-bottom);
  }
  html:not([data-theme="light"]) body.site .mobile-nav {
    background: #111525;
    border-top-color: #252b42;
  }
  body.site .mobile-nav a { color: #6b7280; }
  body.site .mobile-nav a.is-on { color: #635bff; }
  html:not([data-theme="light"]) body.site .mobile-nav a { color: #9ca3af; }
  html:not([data-theme="light"]) body.site .mobile-nav a.is-on { color: #7c5cff; }
  body.site .player { bottom: calc(76px + env(safe-area-inset-bottom)); }
  body.site .sound-detail { padding-bottom: 12px; }
  body.site .sound-detail h1 { font-size: 26px; }
}
@media (max-width: 860px) {
  body.site .mobile-tools [data-open-search] { display: grid; }
  body.site .mobile-tools > a.icon-link { display: none; }
  body.site .mobile-drawer {
    position: fixed;
    z-index: 60;
    top: 0;
    bottom: 0;
    inset-inline-end: 0;
    width: min(320px, 88vw);
    overflow: auto;
    border-top: 0;
    box-shadow: -16px 0 40px rgba(8, 11, 22, 0.18);
  }
}
html[dir="rtl"] body.site .view-all .fa-arrow-right { transform: scaleX(-1); }
@media (max-width: 479px) {
  body.site .footer-grid { grid-template-columns: 1fr; }
}