/* Local tweaks on top of vendor CSS */

/* Space between primary content and the site footer */
html {
  --site-content-footer-gap: 24px;
  --site-thumb-aspect: 16 / 9;
  --site-thumb-aspect-pct: 56.25%;
  --site-thumb-radius: 6px;
  --site-thumb-radius-lg: 10px;
  --site-thumb-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
  --site-thumb-shadow-hover: 0 6px 20px rgba(0, 0, 0, 0.14);
  /*
   * Page shell width. Homepage uses 4 equal category columns (gap 6px), so
   * +2px per column ⇒ +8px total vs vendor 1150 / compact 1020.
   */
  --container-width: 1158px;
  --container-width-compact: 1028px;
}

@media (min-width: 992px) {
  html {
    --site-content-footer-gap: 48px;
  }
}

/* Header half-mascot: keep vendor slot; nudge lower than stock 40px after WebP swap. */
.header-logo-mascot-half picture {
  display: block;
  width: 100%;
  height: 100%;
}

.header-logo-mascot-half-img {
  background: transparent !important;
  background-color: transparent !important;
  transform: translateY(72px);
  /* Let HTML width/height attrs lock aspect while width:100% scales the slot. */
  height: auto;
  /* Avoid any delayed fade-in from vendor image rules. */
  opacity: 1 !important;
  visibility: visible !important;
  content-visibility: visible;
}

body.categorypage .main,
body.singlepage .main,
body.aboutpage .main {
  padding-bottom: var(--site-content-footer-gap);
}

/* Bottom promo block — classic vendor stack (title + banner + CTA), not a full-bleed tint box */
.bottom-block {
  clear: both;
  position: relative;
  width: 100%;
  margin: 30px 0 0;
  text-align: left;
  background: transparent;
}

.bottom-block--promo {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.bottom-block-panel {
  position: relative;
  overflow: hidden;
  border-radius: 16px;
  background: var(--site-bottom-block-surface, #ff9701);
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.1),
    0 1px 0 rgba(255, 255, 255, 0.18) inset;
}

.detect-block .btn-action {
  position: relative;
  overflow: visible;
}

.detect-block .btn-action:after {
  content: "" !important;
  display: block !important;
  position: absolute;
  top: -8px;
  right: -22px;
  z-index: 1;
  width: 50px !important;
  height: 50px !important;
  background-color: transparent !important;
  background-image: var(--site-asset-icon-thumbsup) !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 50px 50px !important;
}

.icon_show_featured {
  display: inline-block;
  position: relative;
  top: 0;
  left: 2px;
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

/* Featured flame lives next to the entry name inside the site link */
.homepage .category-item-site-link .icon_show_featured {
  position: relative;
  top: 0;
  left: 0;
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  margin: 0 0 0 3px;
}

.bottom-block .title {
  position: relative;
  z-index: 1;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 14px 16px !important;
  border: none !important;
  border-radius: 0 !important;
  background: transparent !important;
  line-height: 1.15;
}

.bottom-block .title a {
  display: flex !important;
  align-items: center;
  gap: 12px;
  color: var(--site-bottom-block-title-text, #fff) !important;
  font-size: clamp(16px, 2vw, 21px) !important;
  font-weight: 650 !important;
  letter-spacing: 0.01em;
  text-align: left !important;
  text-decoration: none;
  line-height: 1.25 !important;
}

.bottom-block .title a::before {
  display: none !important;
  content: none !important;
  background: none !important;
}

.bottom-block-title-label {
  min-width: 0;
  flex: 1 1 auto;
}

.bottom-block-title-icon {
  position: static !important;
  top: auto !important;
  left: auto !important;
  flex: 0 0 36px;
  width: 36px !important;
  height: 36px !important;
  margin: 0;
  padding: 5px;
  border-radius: 11px;
  background: rgba(255, 255, 255, 0.2);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.18) inset;
  transform: none !important;
  object-fit: contain;
  object-position: center;
  pointer-events: none;
  user-select: none;
  display: block;
  box-sizing: border-box;
}

/* Section divider emblem — real <img> for crisp rendering (replaces vendor ::before background). */
.divider::before {
  display: none !important;
  content: none !important;
  background: none !important;
}

.divider-icon {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 1;
  width: 40px;
  height: 40px;
  transform: translate(-50%, -50%);
  object-fit: contain;
  object-position: center;
  pointer-events: none;
  user-select: none;
  display: block;
}

@media (max-width: 991px) {
  .divider {
    margin-top: 30px !important;
    margin-bottom: 30px !important;
  }
}

.bottom-block .img-holder {
  display: block !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding-top: 52% !important;
  border: none !important;
  border-radius: 0 !important;
  overflow: hidden;
  position: relative;
  font-size: 0;
  line-height: 0;
  background: rgba(0, 0, 0, 0.08);
}

.bottom-block .img-holder img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1.001);
  transition: transform 0.45s ease;
}

.bottom-block-img-shade {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0.08) 0%,
    transparent 28%,
    transparent 72%,
    rgba(0, 0, 0, 0.18) 100%
  );
}

.bottom-block .link-holder {
  max-width: 100% !important;
  margin: 0 !important;
}

.bottom-block .link-holder .link,
.bottom-block .link {
  --animation-rgb-value: var(--site-bottom-block-cta-pulse-rgb, 46, 175, 97);
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 14px 18px !important;
  border-radius: 999px !important;
  font-size: clamp(15px, 2.1vw, 20px) !important;
  font-weight: 650 !important;
  letter-spacing: 0.01em;
  line-height: 1.25 !important;
  text-align: center;
  text-decoration: none;
  color: var(--site-bottom-block-cta-text, #fff) !important;
  background: var(--site-bottom-block-cta-bg, #2eaf61) !important;
  border: none !important;
  box-shadow:
    0 6px 18px rgba(0, 0, 0, 0.14),
    0 0 0 1px rgba(255, 255, 255, 0.12) inset !important;
  box-sizing: border-box;
  transition:
    transform 0.18s ease,
    filter 0.18s ease,
    box-shadow 0.18s ease !important;
  animation: none !important;
}

.bottom-block-cta-text {
  min-width: 0;
  flex: 0 1 auto;
}

.bottom-block .link .move-arrow {
  flex: 0 0 auto;
  color: inherit !important;
  opacity: 0.9;
  font-weight: 700;
  line-height: 1;
  transition: transform 0.18s ease, opacity 0.18s ease;
}

.bottom-block .link .move-arrow.left {
  transform: translateX(0);
}

.bottom-block .link .move-arrow.right {
  transform: translateX(0);
}

/* Mascot overlay removed — keep hidden if cached markup / vendor CSS still expects it */
.bottom-block > .image {
  display: none !important;
}

@media (max-width: 1400px) {
  .bottom-block .title,
  .bottom-block .img-holder,
  .bottom-block .link-holder,
  .bottom-block-panel {
    max-width: 100%;
  }
}

@media (min-width: 992px) {
  .bottom-block .img-holder:hover img {
    transform: scale(1.035);
  }

  .bottom-block .link-holder .link:hover,
  .bottom-block .link:hover {
    animation: none !important;
    transform: translateY(-1px);
    filter: brightness(1.05);
    box-shadow:
      0 9px 22px rgba(0, 0, 0, 0.18),
      0 0 0 1px rgba(255, 255, 255, 0.16) inset !important;
  }

  .bottom-block .link:hover .move-arrow.left {
    transform: translateX(3px);
    opacity: 1;
  }

  .bottom-block .link:hover .move-arrow.right {
    transform: translateX(-3px);
    opacity: 1;
  }

  .bottom-block .title a:hover .bottom-block-title-icon {
    background: rgba(255, 255, 255, 0.28);
  }
}

@media (max-width: 991px) {
  .bottom-block {
    margin-top: 20px;
  }

  .bottom-block--promo {
    gap: 12px;
  }

  .bottom-block-panel {
    border-radius: 14px;
  }

  .bottom-block .title,
  .bottom-block .img-holder,
  .bottom-block .link-holder {
    max-width: 100%;
  }

  .bottom-block .title {
    padding: 12px 14px !important;
  }

  .bottom-block-title-icon {
    flex-basis: 32px;
    width: 32px !important;
    height: 32px !important;
    padding: 4px;
    border-radius: 9px;
  }

  .bottom-block .img-holder {
    padding-top: 56% !important;
  }

  .bottom-block .link-holder .link,
  .bottom-block .link {
    padding: 12px 14px !important;
    font-size: clamp(14px, 3.8vw, 17px) !important;
    gap: 8px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .bottom-block .img-holder img,
  .bottom-block .link,
  .bottom-block .link .move-arrow {
    transition: none !important;
  }

  .bottom-block .img-holder:hover img {
    transform: none;
  }
}

/* PHP renders full lists — do not keep homepage/category UI hidden waiting on vendor JS */
.categories-grid,
.categories-grid.loaded,
body.homepage .categories-grid {
  opacity: 1 !important;
  visibility: visible !important;
}

/* Category boxes get a server-estimated grid-row span (see generate_category_grid_css()).
   JS (initCategoryGrid) refines it post-load, but if the estimate is ever off — or a
   refresh briefly renders before that JS runs — grid items with a fixed grid-auto-rows
   track size do NOT grow their row to fit oversized content; the box just visually
   overflows into whatever sits below it, looking like containers "jumping"/overlapping
   on load. Clipping here guarantees a box never exceeds its assigned spot, so refreshing
   never shows overlap — worst case a tall list is clipped for an instant until JS turns
   on internal scrolling for it. */
@media (min-width: 992px) {
  body.homepage:not(.admin-layout-mode) .category-container {
    overflow: hidden;
  }
}

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

/* Fixed scroll-progress — cubic shell; progress stroke follows the rounded square. */
.scrollspy-btn--cube {
  --scrollspy-cube-radius: 12px;
  /* pathLength="100" — Chrome honors this for dash math; Firefox often does not. */
  --circ: 100;
  --offset: calc(var(--circ) * (1 - var(--percent, 0)));
}

.scrollspy-btn--cube .scrollspy-btn-circles {
  transform: none;
  overflow: visible;
}

.scrollspy-btn--cube .scrollspy-btn-circle,
.scrollspy-btn--cube .scrollspy-btn-progress-bar {
  fill: none !important;
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
  /* non-scaling-stroke breaks dash progress with pathLength in Firefox */
  vector-effect: none;
}

.scrollspy-btn--cube .scrollspy-btn-circle {
  stroke: var(--site-scrollspy-ring, #b85a1b);
  opacity: 0.95;
}

.scrollspy-btn--cube .scrollspy-btn-progress-bar {
  stroke: var(--site-scrollspy-icon, #fdfdfd);
  /*
   * Use literal numbers (not var(--circ)) for dasharray — Firefox drops
   * unitless custom-property stroke-dasharray as invalid → solid 100% ring.
   * JS (initScrollspyProgressRing) overwrites these with getTotalLength() so
   * progress stays correct when pathLength is ignored.
   */
  stroke-dasharray: 100;
  stroke-dashoffset: calc(100 * (1 - var(--percent, 0)));
  transition:
    stroke-dashoffset 0.2s,
    opacity 0.2s,
    visibility 0.2s;
}

.scrollspy-btn-fixed {
  --scrollspy-cube-radius: 12px;
  position: fixed !important;
  z-index: 135;
  pointer-events: auto;
  width: 48px;
  height: 48px;
  box-sizing: border-box;
  align-items: center;
  justify-content: center;
  border-radius: var(--scrollspy-cube-radius);
  background: var(--site-scrollspy-fill, #ff9701);
  border: 2px solid color-mix(in srgb, var(--site-scrollspy-ring, #b85a1b) 70%, #fff);
  box-shadow:
    0 2px 8px rgba(0, 0, 0, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.22);
  overflow: visible;
  transition:
    transform 0.2s ease,
    opacity 0.5s,
    visibility 0.5s,
    box-shadow 0.2s ease,
    border-radius 0.2s ease;
}

.scrollspy-btn-fixed .scrollspy-btn-circles {
  width: 40px;
  height: 40px;
  flex-shrink: 0;
}

.scrollspy-btn-fixed .scrollspy-btn-arrow {
  width: 12px;
  height: 18px;
}

.scrollspy-btn-fixed:after {
  border-radius: var(--scrollspy-cube-radius);
}

.scrollspy-btn-fixed:hover {
  box-shadow:
    0 4px 14px color-mix(in srgb, var(--site-scrollspy-fill, #ff9701) 35%, transparent),
    inset 0 1px 0 rgba(255, 255, 255, 0.28);
}

.scrollspy-btn-fixed:active {
  transform: translate(50%, -50%) scale(0.96);
}

body.site-search-open .scrollspy-btn-fixed {
  z-index: 90;
}

.header-logo-main {
  width: 100%;
  max-width: 440px;
  display: block;
  position: relative;
}

.header-logo-main-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: left center;
}

.header-mob-logo {
  align-items: center;
}

.header-mob-logo-img {
  display: block;
  width: auto;
  height: 100%;
  max-height: 54px;
  max-width: min(72vw, 320px);
  object-fit: contain;
  object-position: left center;
}

@media (max-width: 991px) {
  :root {
    --mob-safe-bottom: env(safe-area-inset-bottom, 0px);
    --mob-fixed-bottom: calc(12px + var(--mob-safe-bottom));
    --mob-widget-size: 52px;
    --mob-bottom-toolbar-height: 70px;
    --mob-bottom-clearance: calc(var(--mob-widget-size) + var(--mob-fixed-bottom) + 20px);
    --mob-search-close-filter: none;
  }

  body.dark {
    --mob-search-close-filter: brightness(0) invert(1);
  }

  html,
  body {
    overflow-x: clip;
    max-width: 100%;
  }

  html {
    scroll-padding-top: calc(var(--header-mob-height, 70px) + 12px);
  }

  body.fixed {
    position: fixed !important;
    width: 100%;
    overflow: hidden !important;
    touch-action: none;
    left: 0;
    right: 0;
    /* `top` is set inline by lockPageScroll() to preserve scroll Y */
  }

  .header-mob {
    gap: 8px;
    padding: 0 12px;
    /* Above homepage footer island (z-index 15); below search/menu chrome (100+). */
    z-index: 40;
  }

  .burger {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    position: relative;
    border: 0;
    border-radius: 0;
    background: transparent;
    -webkit-tap-highlight-color: transparent;
    z-index: 2;
  }

  .search-opener {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--site-header-icon-color, #fff);
    -webkit-tap-highlight-color: transparent;
    padding: 0;
  }

  .burger:active {
    opacity: 0.75;
  }

  .search-opener:active {
    opacity: 0.75;
  }

  .burger-bar,
  .burger-bar:before,
  .burger-bar:after {
    width: 22px;
    height: 3px;
    left: 50%;
    margin-left: -11px;
    border-radius: 4px;
    background-color: var(--site-header-icon-color, #fff) !important;
    transition: transform 0.2s ease, opacity 0.2s ease;
    position: absolute;
    top: 50%;
  }

  .burger-bar {
    margin-top: -1.5px;
  }

  .burger-bar:before,
  .burger-bar:after {
    content: "";
    display: block;
    margin-top: -1.5px;
  }

  .burger-bar:before {
    transform: translateY(-9px);
  }

  .burger-bar:after {
    transform: translateY(9px);
  }

  .burger-active .burger-bar,
  .burger-active .burger-bar:before,
  .burger-active .burger-bar:after {
    width: 22px !important;
  }

  .burger-active .burger-bar {
    background-color: transparent !important;
    transform: none;
  }

  .burger-active .burger-bar:before {
    opacity: 1;
    transform: translateY(0) rotate(45deg);
  }

  .burger-active .burger-bar:after {
    transform: translateY(0) rotate(-45deg);
  }

  .search-opener-icon {
    width: 24px;
    height: 24px;
    display: block;
    color: var(--site-search-icon-accent, var(--site-header-icon-color, #fff));
    fill: currentColor;
    pointer-events: none;
  }

  .header-mob-logo {
    flex: 1;
    min-width: 0;
    justify-content: center;
    overflow: hidden;
  }

  .header-mob-logo-img {
    max-height: 40px;
    max-width: min(52vw, 220px);
  }

  /* Keep mobile search form accessible without showing the desktop logo row */
  .header-desk.container {
    display: contents !important;
  }

  .header-desk .header-col-lead {
    display: contents !important;
  }

  .header-desk .header-logo-main,
  .header-desk .header-col-main,
  .header-desk > .header-col:last-child {
    display: none !important;
  }

  .container {
    width: 100%;
    max-width: 100%;
    padding-left: 12px;
    padding-right: 12px;
  }

  .homepage .main {
    padding-left: 0;
    padding-right: 0;
  }

  .categories-grid.loaded,
  .homepage .categories-grid {
    opacity: 1 !important;
    display: flex !important;
    flex-direction: column;
    gap: 14px;
    padding: 12px 12px 16px;
    width: 100%;
    max-width: 100%;
  }

  .homepage .category-container {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    align-self: stretch !important;
    grid-column: auto !important;
    grid-row: auto !important;
    display: flex !important;
    flex-direction: column !important;
    grid-template-rows: none !important;
    grid-template-columns: none !important;
    padding-bottom: 0 !important;
    border: 3px solid rgba(var(--category-button-rgb, var(--category-rgb, 238, 238, 238)), 0.5) !important;
    border-radius: 10px;
    overflow: hidden;
    background: var(--site-surface-card, #fdfdfd);
    box-shadow: none;
  }

  .homepage .category-container:before,
  .homepage .category-container:after {
    display: none !important;
    content: none !important;
  }

  .homepage .category-container .category-header {
    flex-shrink: 0;
    padding: 10px 8px 12px;
    background: transparent;
    text-align: center;
    position: relative;
    color: var(--site-text-body, #4e4e4e);
    text-transform: none;
  }

  .homepage .category-container .category-header:before {
    display: none !important;
    content: none !important;
  }

  .homepage .category-container .category-header:after {
    display: block !important;
    content: "" !important;
    z-index: 2;
    background-color: rgb(var(--category-title-line-rgb, var(--category-rgb, 118, 118, 118)));
    border-radius: 2px;
    width: 100%;
    height: 3px;
    position: absolute;
    bottom: 0;
    left: 0;
    transform: none;
  }

  .homepage .category-container .category-header h2 {
    height: auto !important;
    min-height: 0;
    margin: 0;
    padding: 0 10px 14px;
    font-size: 20px;
    line-height: 1.2;
    font-weight: 600;
    text-transform: uppercase;
    justify-content: center;
    flex-wrap: wrap;
    gap: 8px;
  }

  .homepage .category-container .category-header h2 a {
    color: var(--site-text-body, #4e4e4e) !important;
    white-space: normal;
    text-overflow: unset;
    overflow: visible;
    line-height: 1.2;
    max-width: 100%;
    font-size: 20px;
    font-weight: 600;
  }

  .homepage .category-container .category-header .category-header-desc-disclosure {
    margin: 8px 0 0;
    padding: 0 10px;
    text-align: left;
    border: 1px solid rgba(var(--category-button-rgb, var(--category-rgb, 197, 197, 197)), 0.35);
    border-radius: 10px;
    background: rgba(var(--category-rgb, 240, 240, 240), 0.08);
    overflow: hidden;
  }

  .homepage .category-container .category-header .category-header-desc-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 44px;
    padding: 10px 12px;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.4;
    color: var(--site-text-muted, #5c6370) !important;
    cursor: pointer;
    list-style: none;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
    text-transform: none;
  }

  .homepage .category-container .category-header .category-header-desc-toggle::-webkit-details-marker {
    display: none;
  }

  .homepage .category-container .category-header .category-header-desc-toggle-label {
    flex: 1 1 auto;
    min-width: 0;
    text-align: left;
    color: inherit !important;
  }

  .homepage .category-container .category-header .category-header-desc-toggle-icon {
    flex-shrink: 0;
    width: 10px;
    height: 10px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg);
    margin-top: -3px;
    transition: transform 0.2s ease, margin-top 0.2s ease;
    opacity: 0.65;
  }

  .homepage .category-container .category-header .category-header-desc-disclosure[open] .category-header-desc-toggle-icon {
    transform: rotate(-135deg);
    margin-top: 3px;
  }

  .homepage .category-container .category-header .category-header-desc-disclosure[open] .category-header-desc-toggle {
    border-bottom: 1px solid rgba(var(--category-button-rgb, var(--category-rgb, 197, 197, 197)), 0.22);
  }

  .homepage .category-container .category-header .desc,
  .homepage .category-container .category-header .category-header-desc-body {
    display: none;
    margin: 0;
    padding: 10px 12px 12px;
    color: var(--site-text-muted, #4e4e4e) !important;
    font-size: 13px;
    line-height: 1.5;
    font-weight: 400;
    text-transform: none;
    text-align: left;
    opacity: 1;
  }

  .homepage .category-container .category-header .category-header-desc-disclosure[open] .desc,
  .homepage .category-container .category-header .category-header-desc-disclosure[open] .category-header-desc-body {
    display: block !important;
  }

  .homepage .category-container .category-header .category-icon-emoji-only .category-emoji {
    font-size: 1.85rem;
    line-height: 1;
  }

  .homepage .category-container .category-wrapper {
    flex: 1 1 auto;
    height: auto !important;
    min-height: 0;
    max-height: 320px;
    margin: 0 !important;
    padding: 4px 0 0 !important;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }

  .homepage .category-container .category-wrapper:before,
  .homepage .category-container .category-wrapper:after {
    display: none !important;
    content: none !important;
  }

  .homepage .category-container .category-text-block {
    text-align: center;
    padding: 0 12px 6px;
    font-size: 13px;
    line-height: 1.5;
    color: var(--site-text-muted, #4e4e4e) !important;
    opacity: 1;
  }

  .homepage .category-container ul {
    display: flex !important;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: stretch;
    gap: 0;
    width: 100%;
    padding: 0;
  }

  .homepage .category-container .category-item {
    display: flex !important;
    flex-direction: row;
    align-items: center;
    width: 100% !important;
    max-width: 100%;
    min-height: 44px;
    height: auto;
    padding: 4px 6px 4px 4px !important;
    border-bottom: none;
    box-sizing: border-box;
    font-size: 15px;
    gap: 8px;
  }

  .homepage .category-container .category-item .desc {
    display: none !important;
  }

  .homepage .category-container .category-item .review {
    display: inline-flex !important;
    position: static !important;
    top: auto !important;
    right: auto !important;
    z-index: 2;
    order: 40;
    flex-shrink: 0;
    box-sizing: border-box;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px;
    min-height: 44px;
    margin: 0 !important;
    padding: 0;
    transform: none !important;
    background-size: 18px 18px !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    -webkit-mask-size: 18px 18px !important;
    mask-size: 18px 18px !important;
    -webkit-mask-position: center !important;
    mask-position: center !important;
    -webkit-mask-repeat: no-repeat !important;
    mask-repeat: no-repeat !important;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
  }

  .homepage .category-container .category-item .site-save-btn--category-item {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    position: static !important;
    top: auto !important;
    right: auto !important;
    order: 30;
    flex-shrink: 0;
    box-sizing: border-box;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px;
    min-height: 44px;
    margin: 0 !important;
    padding: 0;
    transform: none !important;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
  }

  .homepage .category-container .category-item .site-save-btn--category-item:hover {
    transform: scale(1.05) !important;
  }

  .homepage .category-container .category-item .site-save-btn--category-item .site-save-btn-icon {
    width: 20px;
    height: 20px;
  }

  .homepage .category-container .category-item::before {
    width: 18px;
    margin: 0 4px 0 0;
    font-size: 12px;
    line-height: 18px;
    color: #4b4c4f;
    font-weight: 300;
    flex-shrink: 0;
    text-align: right;
  }

  .homepage .category-container .category-item.visited::before {
    counter-increment: number;
    content: counter(number) ".";
    border: none;
    width: 18px;
    height: auto;
    margin: 0 4px 0 0;
    transform: none;
    color: #4b4c4f;
    font-weight: 300;
  }

  .homepage .category-container .category-item .icon_show_newicon,
  .homepage .category-container .category-item .is-fake-icon,
  .homepage .category-container .category-item .ai-friendly-icon,
  .homepage .category-container .category-item .is-18-friendly-icon,
  .homepage .category-container .category-item .icon_vr_friendly {
    order: 20;
    flex-shrink: 0;
    align-self: center;
    display: inline-block !important;
    position: relative !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    margin: 0 !important;
    transform: none !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;
    vertical-align: middle;
  }

  /* Featured flame: inline after the name (not behind it) */
  .homepage .category-container .category-item .category-item-site-link .icon_show_featured {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;
    width: 20px !important;
    height: 20px !important;
    margin: 0 0 0 4px !important;
    z-index: 1;
    opacity: 1;
    pointer-events: none;
    flex-shrink: 0;
    align-self: center;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
  }

  .homepage .category-container .category-item .icon_show_newicon {
    width: 30px !important;
    height: 16px !important;
  }

  .homepage .category-container .category-item .is-fake-icon {
    width: 30px !important;
    height: 16px !important;
  }

  .homepage .category-container .category-item .ai-friendly-icon {
    width: 22px !important;
    height: 16px !important;
  }

  .homepage .category-container .category-item .is-18-friendly-icon {
    width: 20px !important;
    height: 18px !important;
  }

  .homepage .category-container .category-item .icon_vr_friendly {
    width: 20px !important;
    height: 12px !important;
  }

  .homepage .category-container .category-bottom {
    display: flex !important;
    position: static !important;
    left: auto !important;
    bottom: auto !important;
    width: calc(100% - 20px) !important;
    height: 44px !important;
    min-height: 44px;
    margin: 10px !important;
    border-radius: 5px !important;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0;
    text-transform: capitalize;
    padding: 4px 10px !important;
    gap: 6px;
    box-sizing: border-box;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    color: #fff !important;
    text-decoration: none;
    background: rgb(var(--category-button-rgb, var(--category-rgb, 255, 151, 1))) !important;
    border-top: none;
    animation: none !important;
  }

  .homepage .category-container .category-bottom:hover {
    animation: none !important;
    filter: brightness(1.04);
  }

  .homepage .category-container .category-bottom .svg-icon {
    width: 18px;
    height: 10px;
    margin: 0 0 0 5px !important;
    flex-shrink: 0;
    fill: currentColor;
    color: inherit !important;
  }

  .homepage .category-container.visited .category-bottom .svg-icon {
    display: inline-block !important;
  }

  .homepage .category-container.visited .category-bottom::after {
    content: none !important;
    display: none !important;
  }

  .homepage .category-container .category-item .category-item-site-link {
    display: flex !important;
    align-items: center;
    gap: 6px;
    min-width: 0;
    flex: 1 1 auto;
    max-width: none !important;
    order: 10;
    overflow: hidden;
    position: relative;
  }

  .homepage .category-container .category-item .category-item-name {
    position: relative;
    z-index: 1;
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 15px;
  }

  .homepage .category-container .category-item-favicon {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
  }

  /* Wider phones / small tablets: two compact columns once names have room */
  @media (min-width: 600px) {
    .homepage .category-container ul {
      flex-direction: row;
      flex-wrap: wrap;
    }

    .homepage .category-container .category-item {
      width: 50% !important;
      padding: 5px 6px 5px 4px !important;
    }

    .homepage .category-container .category-wrapper {
      max-height: 280px;
    }

    .homepage .category-container .category-item .category-item-name {
      font-size: 14px;
    }
  }

  body.homepage.dark .category-container {
    border-color: rgba(var(--category-button-rgb, var(--category-rgb, 200, 200, 200)), 0.35) !important;
  }

  body.homepage.dark .category-container .category-header .category-header-desc-disclosure {
    border-color: rgba(var(--category-button-rgb, var(--category-rgb, 200, 200, 200)), 0.35);
    background: rgba(255, 255, 255, 0.04);
  }

  .top-bar {
    display: block;
    font-size: 12px;
    line-height: 1.45;
    background: var(--site-top-bar-bg, #fdfdfd);
    color: var(--site-top-bar-text, #666);
    border-bottom: 1px solid var(--site-top-bar-border, #e5e5e5);
  }

  .top-bar .top-bar-container {
    padding: 8px 16px;
    justify-content: center;
  }

  .top-bar .top-bar-text {
    white-space: normal;
    text-align: center;
    overflow: visible;
    text-overflow: unset;
  }

  .top-bar .hometitle {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }

  .top-bar .lang-menu {
    display: none !important;
  }

  .search-form {
    display: none;
  }

  body.search-open {
    overflow: hidden;
  }

  body.search-open::before {
    display: none;
  }

  body.search-open .search-opener {
    visibility: hidden;
    pointer-events: none;
  }

  .search-form.search-form--open {
    display: none !important;
  }

  @keyframes mob-search-fade {
    from {
      opacity: 0;
    }

    to {
      opacity: 1;
    }
  }

  .search-form.search-form--open .search-input,
  .search-form.search-form--open .search-close {
    display: none !important;
  }

  .search-view {
    display: none;
  }

  .search-view.search-view--open {
    display: flex !important;
    flex-direction: column;
    position: fixed !important;
    z-index: 150 !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 0 calc(12px + env(safe-area-inset-bottom, 0px)) !important;
    overflow: hidden;
    background: var(--mob-search-panel-bg) !important;
    box-sizing: border-box;
    border: 0;
    border-radius: 0;
    animation: mob-search-fade 0.2s ease;
  }

  .search-view.search-view--open .search-panel {
    height: 100%;
    min-height: 0;
  }

  .search-view.search-view--open .search-panel-main {
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
  }

  .search-view .search-panel-top {
    padding-top: calc(6px + env(safe-area-inset-top, 0px));
  }

  .search-view .search-panel-field {
    margin: 0 12px 14px;
    padding: 0 14px;
  }

  .search-view .search-header {
    padding: 0;
    border-bottom: 0;
    background: var(--mob-search-panel-bg);
  }

  .search-view .search-results-section {
    border-bottom: 1px solid var(--mob-search-panel-border);
  }

  .search-view .search-results-section-title {
    padding: 12px 14px 6px;
    color: var(--mob-search-muted);
    background: var(--mob-search-section-bg);
  }

  .search-view .search-results-section--categories .search-category-rail {
    padding-bottom: 12px;
  }

  .search-category-rail .search-category-hit {
    background: var(--mob-search-tag-bg);
    border-color: var(--mob-search-tag-border);
    color: var(--mob-search-chip-color);
  }

  .search-category-rail .search-category-hit:hover,
  .search-category-rail .search-category-hit.search-result-hit--active {
    background: var(--mob-search-section-bg);
  }

  .search-category-hit-icon {
    background: transparent;
  }

  .search-category-hit-initial {
    background: color-mix(in srgb, var(--site-search-result-accent, #ff9701) 12%, var(--mob-search-tag-bg, #fff));
  }

  .search-view .search-body {
    background: var(--mob-search-panel-bg);
    position: relative;
  }

  .search-view .search-results-section--entries .search-body-content {
    display: block;
    padding: 0;
  }

  .search-view .search-body-content:empty::after {
    content: "Type at least 2 characters to search categories and entries.";
    display: block;
    padding: 24px 16px;
    font-size: 14px;
    line-height: 1.45;
    color: var(--mob-search-muted);
    text-align: center;
  }

  body.search-form--has-query:not(.search-view--has-categories):not(.search-view--has-sites) .search-view .search-body-content:empty::after {
    content: "No matching categories or entries.";
  }

  .search-view .search-body:has(#search-empty:not([hidden])) .search-body-content:empty::after {
    content: none;
    display: none;
    padding: 0;
  }

  body.search-view--has-categories:not(.search-view--has-sites) .search-view .search-body-content:empty::after {
    content: none;
    display: none;
    padding: 0;
  }

  body.search-view--has-categories:not(.search-view--has-sites) .search-view .search-results-section--entries .search-body-content:empty::after {
    content: none;
    display: none;
    padding: 0;
  }

  .search-view .search-site-suggestion {
    padding: 12px 14px;
    border-bottom-color: var(--mob-search-panel-border);
    color: var(--mob-search-chip-color);
  }

  .search-view .search-site-suggestion-name {
    color: var(--mob-search-chip-color);
  }

  .search-view .url_link_container,
  .search-view .search-site-hit {
    display: inline-block;
    vertical-align: top;
    width: 50%;
    padding: 0 6px;
    margin-bottom: 12px;
    font-size: 14px;
    box-sizing: border-box;
  }

  .search-view .url_link_container .category-results {
    text-align: center;
    font-size: 12px;
    margin-bottom: 6px;
    color: var(--mob-search-muted);
  }

  .search-view .url_link_container .category-results a {
    color: var(--mob-search-chip-color);
    font-weight: 500;
  }

  .search-view .search-tags {
    padding: 16px 12px;
    border-top: 1px solid var(--mob-search-panel-border);
    background: var(--mob-search-section-bg);
  }

  .search-view .search-tags-title {
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 10px;
    padding: 0;
    color: var(--mob-search-muted);
  }

  .search-view .search-tags-list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 7px;
    padding: 0;
    column-count: initial;
    font-size: 13px;
  }

  .search-view .search-tag {
    display: inline-flex;
    align-items: center;
    width: auto;
    max-width: 100%;
    padding: 5px 13px;
    border-radius: 999px;
    background: var(--mob-search-tag-bg);
    border: 1px solid var(--mob-search-tag-border);
    font-size: 13px;
    font-weight: 500;
    line-height: 1.2;
    color: var(--mob-search-tag-color);
  }

  .search-view .search-pagination {
    display: none;
  }

  body.mob-menu-open {
    overflow: hidden;
  }

  body.mob-menu-open.fixed {
    overscroll-behavior: none;
  }

  body.mob-menu-open .search-opener {
    visibility: visible;
    pointer-events: auto;
  }

  .mob-menu {
    z-index: 101;
    display: none;
    position: fixed;
    top: var(--header-mob-height, 70px);
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: calc(100dvh - var(--header-mob-height, 70px));
    padding: 10px 16px calc(10px + var(--mob-safe-bottom, 0px));
    background: var(--mob-menu-bg) !important;
    border-top: 1px solid var(--mob-menu-border);
    box-sizing: border-box;
    overflow: hidden;
    animation: mob-search-fade 0.2s ease;
    -webkit-overflow-scrolling: touch;
  }

  .mob-menu.mob-menu-open {
    display: flex !important;
    flex-direction: column;
  }

  .mob-menu-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
    flex-shrink: 0;
    padding: 8px 0 12px;
    border-bottom: 2px solid var(--mob-menu-header-border);
    position: relative;
    z-index: 5;
    overflow: visible;
  }

  .mob-menu .socials {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 0;
    padding: 0;
  }

  .mob-menu .socials-item {
    margin: 0;
    flex-shrink: 0;
  }

  .mob-menu .socials-link {
    box-sizing: border-box;
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    min-height: 42px !important;
    max-width: 42px !important;
    max-height: 42px !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-radius: 50%;
    font-size: 8px;
    color: var(--mob-menu-social-color);
    background-color: var(--mob-menu-social-bg) !important;
    background-position: center center;
    border: none;
    flex-shrink: 0;
  }

  .mob-menu .socials-link.theme-link {
    background-color: var(--site-theme-toggle-inactive-light, #2a2b31) !important;
    background-image: var(--site-asset-theme-moon) !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-size: 20px 20px !important;
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.14);
    transition:
      background-color 0.24s ease,
      background-image 0.24s ease,
      border-color 0.24s ease,
      box-shadow 0.24s ease,
      transform 0.18s ease;
  }

  .mob-menu .socials-link.theme-link:active {
    transform: scale(0.94);
  }

  body.dark .mob-menu .socials-link.theme-link {
    background-color: var(--site-theme-toggle-inactive-dark, #3a3c45) !important;
    background-image: var(--site-asset-theme-sun) !important;
    border-color: rgba(255, 255, 255, 0.12);
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.32);
  }

  body.dark .mob-menu .socials-link.theme-link.checked {
    background-color: var(--site-theme-toggle-active, #ff9701) !important;
    background-image: var(--site-asset-theme-sun) !important;
    border-color: rgba(255, 255, 255, 0.28);
    box-shadow: 0 2px 10px rgba(255, 151, 1, 0.42);
  }

  .mob-menu .socials-link.socials-link-custom {
    --social-icon-scale: 1;
  }

  .mob-menu .socials-link .socials-link-icon {
    width: 24px !important;
    height: 24px !important;
    max-width: 24px !important;
    max-height: 24px !important;
  }

  .mob-menu.mob-menu-lang-open .mob-menu-header {
    z-index: 25;
    overflow: visible;
  }

  .mob-menu.mob-menu-lang-open {
    overflow: visible;
  }

  .mob-menu.mob-menu-lang-open .category-menu {
    pointer-events: none;
    position: relative;
    z-index: 1;
  }

  .mob-menu .lang-menu {
    flex: 0 0 auto;
    align-self: flex-start;
    display: flex;
    align-items: center;
    height: auto !important;
    position: relative;
    z-index: 30;
    overflow: visible;
  }

  .mob-menu .lang-menu-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    width: auto;
    min-width: 48px;
    min-height: 48px;
    padding: 0 4px;
    cursor: pointer;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
    position: relative;
    z-index: 2;
  }

  .mob-menu .lang-menu-btn .lang-flag-img,
  .mob-menu .lang-menu-btn .lang-flag-img--btn {
    width: 28px;
    height: 21px;
  }

  .mob-menu .lang-menu-btn:after {
    flex-shrink: 0;
    margin-left: 5px;
    width: 16px !important;
    height: 10px !important;
    background-size: 16px 10px !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
  }

  .mob-menu .lang-menu.lang-menu-open .lang-menu-btn:after {
    transform: rotate(180deg);
  }

  .mob-menu .lang-menu.lang-menu-open .lang-menu-drop {
    display: block !important;
    visibility: visible;
    opacity: 1;
  }

  .mob-menu .lang-menu-drop {
    position: absolute !important;
    top: 100% !important;
    margin-top: 10px !important;
    right: 0 !important;
    left: auto !important;
    width: min(168px, calc(100vw - 32px)) !important;
    transform: none !important;
    z-index: 40;
    pointer-events: auto;
    box-sizing: border-box;
  }

  .mob-menu .lang-menu-list {
    max-height: min(320px, calc(100dvh - var(--header-mob-height, 70px) - 120px));
  }

  .mob-menu .lang-menu-item {
    width: auto;
  }

  .mob-menu .lang-menu-link {
    min-height: 40px;
    padding: 8px 10px;
  }

  .mob-menu .lang-menu-link-label {
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
  }

  .mob-menu .category-menu {
    flex: 1 1 auto;
    min-height: 0;
    height: auto !important;
    position: relative;
    margin: 0 -16px;
  }

  .mob-menu .category-menu-inner,
  .mob-menu .toc-scroll-container .category-menu-inner {
    height: 100%;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    padding: 0;
  }

  .mob-menu .toc-subtitle-container {
    position: sticky;
    top: 0;
    z-index: 2;
    padding: 10px 16px;
    text-align: center;
    background: var(--mob-menu-bg);
    border-bottom: 1px solid var(--mob-menu-header-border);
  }

  .mob-menu .toc-subtitle {
    margin: 0;
    font-size: 13px;
    font-weight: 600;
    color: var(--mob-menu-title-color);
    text-transform: uppercase;
    letter-spacing: 0.8px;
  }

  .mob-menu .toc-container {
    padding: 4px 0 calc(12px + var(--mob-safe-bottom, 0px));
  }

  .mob-menu .toc-list,
  .mob-menu .category-list {
    display: block;
    list-style: none;
    position: relative;
    margin: 0;
    padding: 0;
  }

  .mob-menu .category-list:after {
    display: none;
  }

  .mob-menu .toc-list > li,
  .mob-menu .category-list-item {
    flex: none;
    max-width: none;
    min-width: 0;
    margin: 0;
    border-bottom: 1px solid var(--mob-menu-item-border);
    position: relative;
  }

  .mob-menu .toc-list > li:last-child,
  .mob-menu .category-list-item:last-child {
    border-bottom: none;
  }

  .mob-menu .toc-list a,
  .mob-menu .category-list-link {
    display: flex;
    align-items: center;
    gap: 0;
    min-height: 64px;
    padding: 10px 36px 10px 14px;
    color: var(--mob-menu-title-color);
    text-decoration: none;
    position: relative;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
    transition: background 0.2s ease;
  }

  .mob-menu .toc-list a:hover,
  .mob-menu .toc-list a:active,
  .mob-menu .category-list-link:hover,
  .mob-menu .category-list-link:active {
    background: color-mix(in srgb, var(--mob-menu-title-color) 5%, transparent);
  }

  .mob-menu .category-list-link:before,
  .mob-menu .category-list-link:after {
    content: none !important;
    display: none !important;
    animation: none !important;
  }

  .mob-menu .toc-bullet {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    margin-right: 10px;
    flex-shrink: 0;
    background: rgb(var(--category-button-rgb, var(--category-rgb, 255, 151, 1)));
  }

  .mob-menu .toc-cat-icon {
    width: 42px;
    height: 42px;
    margin-right: 12px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    overflow: hidden;
    background: color-mix(in srgb, var(--mob-menu-social-bg) 80%, transparent);
  }

  .mob-menu .toc-cat-icon .category-icon-image,
  .mob-menu .toc-cat-icon .category-icon-emoji-only {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
  }

  .mob-menu .toc-cat-icon .category-icon-img {
    width: 32px;
    height: 32px;
    object-fit: contain;
    display: block;
  }

  .mob-menu .toc-cat-icon .category-emoji {
    font-size: 1.45rem;
    line-height: 1;
  }

  .mob-menu .toc-info {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 2px;
  }

  .mob-menu .toc-text {
    min-width: 0;
  }

  .mob-menu .toc-name,
  .mob-menu .category-list-title {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px 0;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.25;
    color: var(--mob-menu-title-color);
    white-space: normal;
    overflow: visible;
    text-overflow: unset;
  }

  .mob-menu .toc-count {
    display: inline-block;
    margin-left: 8px;
    padding: 2px 8px;
    border-radius: 10px;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.3;
    color: var(--mob-menu-muted);
    background: var(--mob-menu-social-bg);
    vertical-align: middle;
  }

  .mob-menu .toc-sites {
    display: flex;
    align-items: center;
    gap: 3px;
    margin-top: 4px;
    flex-wrap: nowrap;
    overflow: hidden;
  }

  .mob-menu .toc-sites .site-icon {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: 1.5px solid var(--mob-menu-bg);
    background: var(--mob-menu-social-bg);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    flex-shrink: 0;
    box-sizing: border-box;
  }

  .mob-menu .toc-sites .icon-site-favicon-img {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    object-fit: cover;
    display: block;
  }

  .mob-menu .toc-sites .site-more {
    flex-shrink: 0;
    height: 20px;
    margin-left: 3px;
    padding: 2px 6px;
    border-radius: 10px;
    font-size: 10px;
    font-weight: 700;
    line-height: 16px;
    color: var(--mob-menu-muted);
    background: var(--mob-menu-social-bg);
  }

  .mob-menu .toc-arrow {
    position: absolute;
    right: 14px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--mob-menu-muted);
    font-size: 20px;
    line-height: 1;
    pointer-events: none;
  }

  .footer .footer-links {
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px 12px;
    padding: 0 12px;
  }

  .footer .footer-links li {
    margin: 0;
  }

  .footer .copy-text {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    padding: 0 16px 20px;
    line-height: 1.5;
    text-align: center;
  }

  .footer .footer-powered-by {
    font-size: 0.92em;
    opacity: 0.94;
  }

  .footer .footer-powered-by a {
    text-decoration: underline;
    text-underline-offset: 2px;
  }

  .homepage .copyright-message .inner-footer {
    padding: 20px 14px 28px;
    margin-top: 0;
  }

  .homepage .copyright-message .inner-footer .copyright-message-headline,
  .homepage .copyright-message .inner-footer h2,
  .homepage .copyright-message .inner-footer h3,
  .homepage .copyright-message .inner-footer h4 {
    font-size: 20px;
    line-height: 1.3;
  }

  .homepage {
    --footer-banner-gap: 28px;
    /*
     * Inline styles set desktop half-height (~171px). On mobile the banner is
     * full-bleed, so real half-height is ~22vw — use that or the island leaves
     * a huge empty band in the copyright block.
     */
    --footer-banner-overlap: calc(
      100vw * var(--footer-banner-height, 342) / var(--footer-banner-width, 800) / 2
    );
  }

  .homepage .homepage-footer-banner-bridge,
  .homepage .copyright-message-wrap {
    --footer-banner-overlap: calc(
      100vw * var(--footer-banner-height, 342) / var(--footer-banner-width, 800) / 2
    ) !important;
  }

  .homepage .main {
    padding-bottom: var(--footer-banner-gap);
  }

  .homepage .categories-grid {
    padding-bottom: 16px;
  }

  .homepage .homepage-footer-banner-bridge {
    margin-bottom: calc(-1 * var(--footer-banner-overlap));
  }

  .homepage .copyright-message .inner-footer {
    padding: calc(var(--footer-banner-overlap) + 16px) 14px 20px;
    margin-top: 0;
  }

  .homepage .footer-separator-line {
    width: 100%;
    max-width: 100%;
    --footer-banner-desktop-scale: 1;
  }

  .homepage .footer-separator-line .footer-separator-img {
    width: 100%;
    max-width: 100%;
    height: auto;
    object-fit: contain;
    object-position: center center;
  }

  /* Same chrome tighten as category — vendor still reserves 80px for a decorative head. */
  body.homepage .footer-bottom {
    margin-top: 0 !important;
    padding-top: 28px !important;
  }

  body.homepage .footer-bottom:before {
    display: none;
  }

  body.homepage .footer .socials {
    margin-bottom: 16px;
  }

  body.homepage .footer-bottom .footer-links {
    margin-bottom: 12px;
    padding: 0 16px;
    column-gap: 12px;
  }

  body.homepage .footer-bottom .footer-links li {
    margin: 0 0 6px;
  }

  body.homepage .footer-bottom .footer-links a:after {
    display: none;
  }

  body.homepage .footer .copy-text {
    height: auto !important;
    padding: 14px 16px calc(16px + var(--mob-bottom-clearance));
    gap: 4px;
  }

  /* Landing page uses the same bottom dock as category/entry — hide the floating button. */
  body.homepage .scrollspy-btn-fixed,
  body.categorypage .scrollspy-btn-fixed,
  body.singlepage .scrollspy-btn-fixed {
    display: none !important;
  }

  body.homepage .bottom-toolbar .scrollspy-btn,
  body.categorypage .bottom-toolbar .scrollspy-btn,
  body.singlepage .bottom-toolbar .scrollspy-btn {
    --circ: 100;
    --offset: calc(var(--circ) - (var(--circ) * var(--percent, 0)));
    width: 100%;
    height: 100%;
    margin: 0;
    align-items: center;
    justify-content: center;
  }

  body.homepage .bottom-toolbar .scrollspy-btn-circles,
  body.categorypage .bottom-toolbar .scrollspy-btn-circles,
  body.singlepage .bottom-toolbar .scrollspy-btn-circles {
    width: 36px;
    height: 36px;
    flex-shrink: 0;
    transform: none;
  }

  body.homepage .bottom-toolbar .scrollspy-btn-arrow,
  body.categorypage .bottom-toolbar .scrollspy-btn-arrow,
  body.singlepage .bottom-toolbar .scrollspy-btn-arrow {
    width: 11px;
    height: 18px;
  }

  body.homepage .bottom-toolbar-side,
  body.categorypage .bottom-toolbar-side,
  body.singlepage .bottom-toolbar-side {
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
  }

  .chat-widget {
    width: var(--mob-widget-size) !important;
    height: var(--mob-widget-size) !important;
    min-height: var(--mob-widget-size) !important;
    bottom: var(--mob-fixed-bottom) !important;
    left: 12px !important;
    right: auto !important;
    border-radius: 50% !important;
    background: var(--site-chat-widget-bg, #ff9701) !important;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.18);
    overflow: hidden;
  }

  .chat-widget-footer {
    display: none !important;
  }

  .chat-widget-mascot,
  .chat-widget:hover .chat-widget-mascot {
    width: 38px !important;
    height: 38px !important;
    top: 50% !important;
    left: 54% !important;
    bottom: auto !important;
    transform: translate(-50%, -50%) !important;
  }

  .chat-widget:not(.chat-widget--custom-mascot) .chat-widget-mascot,
  .chat-widget:not(.chat-widget--custom-mascot):hover .chat-widget-mascot {
    background-image: var(--site-asset-mascot);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
  }

  .chat-widget--custom-mascot .chat-widget-mascot,
  .chat-widget--custom-mascot:hover .chat-widget-mascot {
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
  }

  /*
   * Saved Websites mobile tab — vertical orange sidebar on every page
   * (vendor layout: rotated strip + mascot + badge). Not the old dark
   * horizontal bottom chip.
   */
  .drawer-opener-mobile {
    display: flex !important;
    position: fixed !important;
    right: 0 !important;
    left: auto !important;
    bottom: calc(var(--mob-widget-size, 52px) + var(--mob-fixed-bottom, 12px) + 28px) !important;
    width: auto !important;
    min-width: 146px !important;
    max-width: 200px !important;
    height: 50px !important;
    padding: 0 !important;
    background: transparent !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    transform: rotate(-90deg) translate(100%, 100%) !important;
    transform-origin: 100% 100% !important;
    align-items: flex-end !important;
    z-index: 100;
    font-size: 12px;
    box-sizing: border-box;
  }

  .drawer-opener-mobile.drawer-opener-show {
    transform: rotate(-90deg) translate(100%) !important;
  }

  .drawer-opener-mobile .drawer-opener-inner {
    height: 28px !important;
    padding: 0 10px 0 30px !important;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    box-sizing: border-box;
    border-radius: 10px 10px 0 0;
    background: var(--_bg-gradient, linear-gradient(180deg, var(--site-drawer-opener-gradient-start, #ff9701) 0, var(--site-drawer-opener-gradient-end, #c37c0c) 100%)) !important;
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.25);
  }

  .drawer-opener-mobile .drawer-opener-icon {
    width: 58px !important;
    height: 58px !important;
    position: absolute !important;
    left: 0 !important;
    bottom: 0 !important;
    top: auto !important;
    transform: rotate(80deg) translate(20px, 12px) !important;
    background-image: var(--site-asset-mascot) !important;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
  }

  .drawer-opener-mobile.drawer-opener-show .drawer-opener-icon {
    transform: rotate(80deg) translateY(12px) !important;
  }

  .drawer-opener-mobile .drawer-opener-text {
    font-size: 12px !important;
    font-weight: 700;
    color: var(--site-drawer-opener-text, #fff) !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .drawer-opener-mobile .drawer-opener-vane {
    display: none;
  }

  .drawer-opener-mobile .badge {
    position: absolute;
    bottom: 6px !important;
    left: -8px !important;
    top: auto !important;
    transform: rotate(90deg) !important;
    z-index: 2;
  }

  .drawer.drawer-open .drawer-opener-mobile {
    visibility: hidden;
    pointer-events: none;
  }

  .drawer-opener-desktop:not(.drawer-opener-open) {
    display: none !important;
  }

  body.homepage,
  body.categorypage,
  body.singlepage {
    --mob-bottom-toolbar-height: 64px;
    --mob-bottom-clearance: calc(var(--mob-bottom-toolbar-height) + var(--mob-safe-bottom) + 16px);
  }

  body.homepage .chat-widget,
  body.categorypage .chat-widget,
  body.singlepage .chat-widget {
    bottom: calc(var(--mob-bottom-toolbar-height) + var(--mob-safe-bottom) + 8px) !important;
  }

  /*
   * Bottom toolbar: slide with `bottom`, not `transform`.
   * Transform + backdrop-filter makes the dock look pixelated until the
   * animation ends (GPU layer rasterized soft). Keep transform: none when shown.
   */
  body.homepage .bottom-toolbar,
  body.categorypage .bottom-toolbar,
  body.singlepage .bottom-toolbar {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: fixed;
    left: 0;
    right: 0;
    bottom: calc(-1 * (var(--mob-bottom-toolbar-height) + 16px));
    padding: 6px 12px !important;
    box-sizing: border-box;
    z-index: 60;
    font-size: 12px;
    transform: none !important;
    transition: bottom 0.22s ease;
    -webkit-font-smoothing: antialiased;
  }

  body.homepage .bottom-toolbar.bottom-toolbar-show,
  body.categorypage .bottom-toolbar.bottom-toolbar-show,
  body.singlepage .bottom-toolbar.bottom-toolbar-show {
    bottom: var(--mob-safe-bottom, 0px);
    transform: none !important;
  }

  body.homepage .bottom-toolbar-main,
  body.homepage .bottom-toolbar-side,
  body.categorypage .bottom-toolbar-main,
  body.categorypage .bottom-toolbar-side,
  body.singlepage .bottom-toolbar-main,
  body.singlepage .bottom-toolbar-side {
    /* Solid frosted look without live backdrop-filter (that also softens glyphs). */
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    background: rgba(245, 246, 248, 0.96);
    border: 1px solid rgba(255, 255, 255, 0.9);
    border-radius: 14px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12);
  }

  body.dark.homepage .bottom-toolbar-main,
  body.dark.homepage .bottom-toolbar-side,
  body.dark.categorypage .bottom-toolbar-main,
  body.dark.categorypage .bottom-toolbar-side,
  body.dark.singlepage .bottom-toolbar-main,
  body.dark.singlepage .bottom-toolbar-side {
    background: rgba(32, 34, 40, 0.96);
    border-color: #5d5e62;
  }

  body.homepage .bottom-toolbar-main,
  body.categorypage .bottom-toolbar-main,
  body.singlepage .bottom-toolbar-main {
    flex: 1 1 auto;
    min-width: 0;
    max-width: calc(100% - 60px);
    height: 52px;
    padding: 4px;
    gap: 0;
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    justify-content: flex-start;
    align-items: center;
    display: flex;
  }

  body.homepage .bottom-toolbar-side,
  body.categorypage .bottom-toolbar-side,
  body.singlepage .bottom-toolbar-side {
    flex: 0 0 52px;
    width: 52px;
    height: 52px;
    padding: 4px;
    border-radius: 14px;
  }

  body.homepage .bottom-toolbar-side .scrollspy-btn,
  body.categorypage .bottom-toolbar-side .scrollspy-btn,
  body.singlepage .bottom-toolbar-side .scrollspy-btn {
    width: 100%;
    height: 100%;
    border-radius: 10px;
    background: var(--site-scrollspy-fill, #ff9701);
    border: 1.5px solid color-mix(in srgb, var(--site-scrollspy-ring, #b85a1b) 65%, #fff);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.22);
    overflow: visible;
    align-items: center;
    justify-content: center;
  }

  body.homepage .bottom-toolbar-side .scrollspy-btn:after,
  body.categorypage .bottom-toolbar-side .scrollspy-btn:after,
  body.singlepage .bottom-toolbar-side .scrollspy-btn:after {
    border-radius: 10px;
  }

  body.homepage .bottom-toolbar-logo-slot,
  body.categorypage .bottom-toolbar-logo-slot,
  body.singlepage .bottom-toolbar-logo-slot {
    flex: 0 0 44px;
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  body.homepage .bottom-toolbar-logo,
  body.categorypage .bottom-toolbar-logo,
  body.singlepage .bottom-toolbar-logo {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    object-fit: cover;
    display: block;
    image-rendering: -webkit-optimize-contrast;
    image-rendering: auto;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
  }

  body.categorypage .bottom-toolbar-logo-slot .icon-ring-frame,
  body.singlepage .bottom-toolbar-logo-slot .icon-ring-frame {
    width: 40px;
    height: 40px;
    flex-shrink: 0;
  }

  body.categorypage .bottom-toolbar-logo-slot .icon-ring-frame-slot,
  body.singlepage .bottom-toolbar-logo-slot .icon-ring-frame-slot {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
  }

  body.categorypage .bottom-toolbar-logo-slot .category-icon-emoji-only,
  body.singlepage .bottom-toolbar-logo-slot .category-icon-emoji-only {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
  }

  body.categorypage .bottom-toolbar-logo-slot .category-emoji,
  body.singlepage .bottom-toolbar-logo-slot .category-emoji {
    font-size: 22px;
    line-height: 1;
  }

  body.categorypage .bottom-toolbar-logo-slot .category-icon-img,
  body.singlepage .bottom-toolbar-logo-slot .category-icon-img {
    width: 22px;
    height: 22px;
    object-fit: contain;
  }

  body.homepage .bottom-toolbar-content-slot,
  body.categorypage .bottom-toolbar-content-slot,
  body.singlepage .bottom-toolbar-content-slot {
    flex: 1 1 auto;
    min-width: 0;
    height: 100%;
    padding: 4px 12px 4px 10px;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto auto;
    align-content: center;
    align-items: center;
    column-gap: 0;
    row-gap: 1px;
    overflow: hidden;
  }

  body.homepage .bottom-toolbar-category .bottom-toolbar-content-slot,
  body.categorypage .bottom-toolbar-category .bottom-toolbar-content-slot,
  body.singlepage .bottom-toolbar-review .bottom-toolbar-content-slot {
    background-color: #fff;
    border-radius: 10px;
  }

  body.dark.homepage .bottom-toolbar-category .bottom-toolbar-content-slot,
  body.dark.categorypage .bottom-toolbar-category .bottom-toolbar-content-slot,
  body.dark.singlepage .bottom-toolbar-review .bottom-toolbar-content-slot {
    background-color: #000;
  }

  body.homepage .bottom-toolbar-content-slot .bottom-toolbar-counter,
  body.homepage .bottom-toolbar-content-slot .bottom-toolbar-title,
  body.categorypage .bottom-toolbar-content-slot .bottom-toolbar-counter,
  body.categorypage .bottom-toolbar-content-slot .bottom-toolbar-title,
  body.singlepage .bottom-toolbar-content-slot .bottom-toolbar-counter,
  body.singlepage .bottom-toolbar-content-slot .bottom-toolbar-title {
    grid-column: 1;
    min-width: 0;
    max-width: 100%;
    line-height: 1.2;
    color: #111;
  }

  body.dark.homepage .bottom-toolbar-content-slot .bottom-toolbar-counter,
  body.dark.homepage .bottom-toolbar-content-slot .bottom-toolbar-title,
  body.dark.categorypage .bottom-toolbar-content-slot .bottom-toolbar-counter,
  body.dark.categorypage .bottom-toolbar-content-slot .bottom-toolbar-title,
  body.dark.singlepage .bottom-toolbar-content-slot .bottom-toolbar-counter,
  body.dark.singlepage .bottom-toolbar-content-slot .bottom-toolbar-title {
    color: #fff;
  }

  body.homepage .bottom-toolbar-counter,
  body.categorypage .bottom-toolbar-counter,
  body.singlepage .bottom-toolbar-counter {
    font-weight: 700;
    font-size: 12px;
    white-space: nowrap;
  }

  body.homepage .bottom-toolbar-title,
  body.categorypage .bottom-toolbar-title,
  body.singlepage .bottom-toolbar-title {
    font-size: 12px;
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  body.homepage .drawer-opener-mobile,
  body.categorypage .drawer-opener-mobile,
  body.singlepage .drawer-opener-mobile {
    /* Sit above the fixed bottom toolbar dock */
    bottom: calc(var(--mob-bottom-toolbar-height) + var(--mob-safe-bottom) + 20px) !important;
  }

  .drawer-content {
    width: 100% !important;
    max-height: none !important;
    height: calc(100dvh - var(--header-mob-height, 70px)) !important;
  }

  /* Honor admin “show on mobile”; only hide when explicitly opted out */
  .extension-widget.popup-hide-mobile {
    display: none !important;
  }

  .site-drawer-body {
    padding: 0;
    font-size: 15px;
    line-height: 1.5;
  }

  .site-popup-modal .micromodal__container {
    width: calc(100% - 24px) !important;
    max-width: none !important;
    margin: 12px auto !important;
  }

  body.admin-layout-mode .admin-layout-bar {
    flex-direction: column;
    align-items: stretch;
    margin: 0 10px 10px;
    padding: 8px 10px;
    font-size: 13px;
    line-height: 1.45;
  }

  body.admin-layout-mode .admin-layout-actions {
    width: 100%;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 8px;
  }

  body.admin-layout-mode .admin-layout-actions-end {
    margin-left: 0;
    width: 100%;
    justify-content: space-between;
  }

  body.admin-layout-mode .admin-layout-status {
    flex: 1 1 100%;
    text-align: left;
  }

  body.admin-layout-mode .admin-drag-handle,
  body.admin-layout-mode .admin-layout-tools {
    display: none !important;
  }

  body.admin-layout-mode .homepage .categories-grid {
    display: flex !important;
    grid-template-columns: none !important;
    padding: 0 10px 16px;
  }

  body.admin-layout-mode .homepage .category-container {
    grid-row-start: auto !important;
    grid-row-end: auto !important;
  }
}

@media (max-width: 480px) {
  .homepage .category-container .category-header h2,
  .homepage .category-container .category-header h2 a {
    font-size: 19px;
  }

  .homepage .category-container .category-item {
    font-size: 14px;
    min-height: 44px;
    padding: 2px 4px 2px 2px !important;
  }

  .homepage .category-container .category-item .category-item-name {
    font-size: 14px;
  }

  .homepage .category-container .category-item .review,
  .homepage .category-container .category-item .site-save-btn--category-item {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px;
    min-height: 44px;
  }

  .homepage .category-container .category-bottom {
    font-size: 14px;
  }

  .header-mob-logo-img {
    max-height: 36px;
    max-width: min(48vw, 200px);
  }
}

@media (min-width: 992px) {
  .homepage .categories-grid {
    display: grid;
    grid-auto-flow: row;
    grid-auto-rows: 1px;
    gap: 4px 6px;
    opacity: 1;
  }

  body.admin-layout-mode .homepage .categories-grid {
    grid-auto-flow: row !important;
    grid-auto-rows: 1px !important;
    gap: 4px 6px !important;
  }

  body.admin-layout-mode .homepage .category-container {
    align-self: start !important;
  }

  .homepage .category-container {
    align-self: start;
    overflow: hidden;
  }

  /* Do NOT set max-height: none here — per-block server CSS caps the list so
     boxes cannot grow past their grid slot before/without JS. */
  .homepage .category-container .category-wrapper {
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }

  .homepage .category-container .category-wrapper[data-scroll-constrained] {
    flex: 0 0 auto;
  }
}

.category-container {
  border-color: rgba(var(--category-button-rgb, var(--category-rgb, 238, 238, 238)), var(--category-border-opacity, 0.5)) !important;
}

/*
 * Firefox scrollbars: vendor sets `scrollbar-color: #96979f` (one value — invalid).
 * WebKit-only ::-webkit-scrollbar rules never apply in Firefox, so boxes show the
 * thick system scrollbar. Give Firefox a proper thin thumb + transparent track.
 */
.custom-scrollbar {
  scrollbar-width: thin;
  scrollbar-color: #a0a1a8 transparent;
}

.homepage .category-container .category-wrapper.custom-scrollbar,
.homepage .category-container .category-wrapper {
  scrollbar-width: thin;
  scrollbar-color: rgba(var(--category-button-rgb, var(--category-rgb, 150, 150, 150)), 0.55) transparent;
}

.homepage .category-container .category-wrapper.custom-scrollbar::-webkit-scrollbar,
.custom-scrollbar::-webkit-scrollbar {
  width: 5px;
  height: 5px;
}

.homepage .category-container .category-wrapper.custom-scrollbar::-webkit-scrollbar-track,
.custom-scrollbar::-webkit-scrollbar-track {
  background: transparent;
}

.homepage .category-container .category-wrapper.custom-scrollbar::-webkit-scrollbar-thumb,
.custom-scrollbar::-webkit-scrollbar-thumb {
  background-color: rgba(var(--category-button-rgb, var(--category-rgb, 150, 151, 159)), 0.55);
  border-radius: 999px;
}

.homepage .category-container .category-wrapper.custom-scrollbar::-webkit-scrollbar-thumb:hover,
.custom-scrollbar::-webkit-scrollbar-thumb:hover {
  background-color: rgba(var(--category-button-rgb, var(--category-rgb, 118, 118, 118)), 0.75);
}

.homepage .category-scroll-anchor {
  display: block;
  width: 0;
  height: 0;
  overflow: hidden;
  scroll-margin-top: calc(var(--header-mob-height, 70px) + 12px);
}

@media (min-width: 992px) {
  .homepage .category-scroll-anchor {
    scroll-margin-top: 16px;
  }
}

body.categorypage .link-container.container,
body.singlepage .link-container.container {
  /* Match homepage boxes: accent/button color, not the often-default base rgb. */
  border-color: rgba(var(--category-button-rgb, var(--category-rgb, 197, 197, 197)), 0.55) !important;
}

/* Category/entry title underline — vendor hardcodes gray on desktop only. */
body.categorypage .link-header:after,
body.singlepage .link-header:after {
  background-color: rgb(var(--category-title-line-rgb, var(--category-rgb, 255, 151, 1))) !important;
}

.category-container .category-header:after {
  background-color: rgb(var(--category-title-line-rgb, var(--category-rgb, 118, 118, 118))) !important;
}

.category-container .category-bottom {
  --animation-rgb-value: var(--category-button-rgb, var(--category-rgb));
  background-color: rgb(var(--category-button-rgb, var(--category-rgb, 255, 151, 1))) !important;
  color: #fff !important;
  border-radius: 5px !important;
}

.category-icon-wrap {
  display: inline-flex;
  align-items: center;
  gap: 0.35em;
  vertical-align: middle;
}

.category-icon-emoji-only {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  vertical-align: middle;
}

.category-emoji {
  font-size: 0.92em;
  line-height: 1;
  flex-shrink: 0;
}

.category-icon-image {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  vertical-align: middle;
  flex-shrink: 0;
}

.category-icon-img {
  display: block;
  width: 1.8rem;
  height: 1.8rem;
  object-fit: contain;
  /* Hide the alt text glyph while loading — see .entry-favicon-img. */
  color: transparent;
  font-size: 0;
  overflow: hidden;
}

/* Category box headers — emoji or uploaded icon */
.category-container .category-header .category-icon-emoji-only .category-emoji {
  font-size: 1.8rem;
  line-height: 1;
  width: auto;
  height: auto;
}

@media (min-width: 992px) {
  .category-container .category-header .category-icon-emoji-only .category-emoji {
    font-size: 2rem;
  }

  .category-container .category-header .category-icon-image .category-icon-img {
    width: 2rem;
    height: 2rem;
  }
}

body.admin-layout-mode .category-container .category-header .category-icon-emoji-only .category-emoji {
  font-size: 1.8rem;
}

@media (max-width: 991px) {
  .homepage .category-container .category-header .category-icon-emoji-only .category-emoji {
    font-size: 1.85rem;
  }
}

.search-category-hit .category-emoji {
  font-size: 1rem;
  line-height: 1;
}

.search-category-rail {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: 8px;
  padding: 0 14px 12px;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scroll-snap-type: x proximity;
  scrollbar-width: thin;
}

.search-category-rail::-webkit-scrollbar {
  height: 4px;
}

.search-category-rail::-webkit-scrollbar-thumb {
  background: rgba(78, 78, 78, 0.2);
  border-radius: 999px;
}

.search-category-rail .search-category-hit {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: 7px;
  flex: 0 0 auto;
  width: auto;
  max-width: min(240px, 72vw);
  min-height: 0;
  padding: 5px 12px 5px 6px;
  border: 1px solid var(--mob-search-tag-border, #e0e0e0);
  border-radius: 999px;
  background: var(--mob-search-tag-bg, #fff);
  box-shadow: none;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.25;
  color: var(--mob-search-chip-color, #4e4e4e);
  text-align: left;
  text-decoration: none;
  box-sizing: border-box;
  white-space: nowrap;
  scroll-snap-align: start;
  transition: border-color 0.15s ease, background-color 0.15s ease;
}

.search-category-rail .search-category-hit::before {
  display: none !important;
}

.search-category-hit-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 0;
  background: transparent;
  flex-shrink: 0;
}

.search-category-hit-img {
  width: 18px;
  height: 18px;
  object-fit: contain;
  display: block;
  border-radius: 3px;
}

.search-category-hit-initial {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: color-mix(in srgb, var(--site-search-result-accent, #ff9701) 12%, #fff);
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  color: var(--site-search-result-accent, #ff9701);
}

.search-category-hit-label {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}

.search-category-rail .search-category-hit:hover {
  border-color: color-mix(in srgb, var(--site-search-result-accent, #ff9701) 35%, var(--mob-search-tag-border, #e0e0e0));
  background: var(--mob-search-section-bg, #fafafa);
  transform: none;
  box-shadow: none;
}

.search-category-rail .search-category-hit.search-result-hit--active {
  border-color: var(--site-search-result-accent, #ff9701);
  background: color-mix(in srgb, var(--site-search-result-accent, #ff9701) 8%, var(--mob-search-tag-bg, #fff));
  box-shadow: none;
  outline: none;
}

.search-category-rail .search-category-hit .search-hit-mark {
  background: transparent;
  color: var(--site-search-result-accent, #ff9701);
  font-weight: 700;
  border-radius: 0;
  padding: 0;
}

.category-top-card-header-icon .category-icon-emoji-only {
  position: relative;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.category-top-card-header-icon .category-emoji {
  font-size: 1.5rem;
  line-height: 1;
  display: inline-block;
  transform-origin: center;
  will-change: transform;
  animation: category-top-icon-bob 3.2s ease-in-out infinite;
}

/* Category top-card icon: ripple aura + orbit sparks (replaces leaf fan-out). */
.category-top-cards .category-top-card-header-icon {
  overflow: visible;
  background:
    radial-gradient(circle at 30% 28%, rgba(255, 255, 255, 0.95), rgba(225, 255, 255, 0.92) 55%, rgba(225, 255, 255, 0.85));
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.35) inset,
    0 2px 8px rgba(var(--category-rgb, 118, 118, 118), 0.22);
  transition: box-shadow 0.25s ease, transform 0.25s ease;
}

.category-top-cards .category-top-card-header-icon::after {
  content: "";
  position: absolute;
  inset: -2px;
  z-index: 0;
  border-radius: inherit;
  pointer-events: none;
  background: radial-gradient(
    circle at center,
    rgba(var(--category-rgb, 118, 118, 118), 0.28),
    transparent 68%
  );
  opacity: 0;
  transform: scale(0.85);
  transition: opacity 0.3s ease, transform 0.35s ease;
}

.category-top-cards .category-top-card-header-icon-leaf {
  opacity: 0;
  pointer-events: none;
  z-index: 0;
  top: 50%;
  left: 50%;
  right: auto;
  bottom: auto;
  width: 100%;
  height: 100%;
  margin: 0;
  border-radius: inherit;
  background-color: transparent;
  border: 2px solid rgba(255, 255, 255, 0.55);
  box-shadow: 0 0 0 1px rgba(var(--category-rgb, 118, 118, 118), 0.18);
  transform: translate(-50%, -50%) scale(0.72);
  transition: none;
}

/* Permanent soft plate under the emoji */
.category-top-cards .category-top-card-header-icon-leaf:nth-of-type(5) {
  opacity: 0.55;
  border: none;
  box-shadow: none;
  background: linear-gradient(
    160deg,
    rgba(255, 255, 255, 0.55),
    rgba(var(--category-rgb, 118, 118, 118), 0.12)
  );
  transform: translate(-50%, -50%) scale(0.92);
}

/* Tiny orbit sparks (leaves 1–4 rest state) */
.category-top-cards .category-top-card-header-icon-leaf:nth-of-type(1),
.category-top-cards .category-top-card-header-icon-leaf:nth-of-type(2),
.category-top-cards .category-top-card-header-icon-leaf:nth-of-type(3),
.category-top-cards .category-top-card-header-icon-leaf:nth-of-type(4) {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  border: none;
  box-shadow: 0 0 6px rgba(255, 255, 255, 0.65);
  background-color: #fff;
  opacity: 0;
}

.category-top-cards .category-top-card-header-icon-leaf:nth-of-type(1) {
  background-color: #fff;
  transform: translate(-50%, -50%) rotate(0deg) translateY(-20px) scale(0.5);
}

.category-top-cards .category-top-card-header-icon-leaf:nth-of-type(2) {
  background-color: rgb(var(--category-rgb, 118, 118, 118));
  transform: translate(-50%, -50%) rotate(90deg) translateY(-20px) scale(0.5);
}

.category-top-cards .category-top-card-header-icon-leaf:nth-of-type(3) {
  background-color: #fff;
  transform: translate(-50%, -50%) rotate(180deg) translateY(-20px) scale(0.5);
}

.category-top-cards .category-top-card-header-icon-leaf:nth-of-type(4) {
  background-color: rgb(var(--category-rgb, 118, 118, 118));
  transform: translate(-50%, -50%) rotate(270deg) translateY(-20px) scale(0.5);
}

@media (min-width: 992px) {
  .category-top-cards .category-top-card-link:hover .category-top-card-header-icon {
    transform: scale(1.04);
    box-shadow:
      0 0 0 1px rgba(255, 255, 255, 0.45) inset,
      0 4px 14px rgba(var(--category-rgb, 118, 118, 118), 0.35);
  }

  .category-top-cards .category-top-card-link:hover .category-top-card-header-icon::after {
    opacity: 1;
    transform: scale(1.35);
  }

  .category-top-cards .category-top-card-link:hover .category-top-card-header-icon .category-emoji {
    animation: category-top-icon-pop 0.55s ease;
  }

  /* Ripple ring — leaf 5 */
  .category-top-cards .category-top-card-link:hover .category-top-card-header-icon-leaf:nth-of-type(5) {
    opacity: 0;
    border: 2px solid rgba(255, 255, 255, 0.7);
    background: transparent;
    animation: category-top-icon-ripple 1.25s ease-out infinite;
  }

  /* Orbiting sparks — override vendor leaf fan-out */
  .category-top-cards .category-top-card-link:hover .category-top-card-header-icon-leaf {
    opacity: 1;
  }

  .category-top-cards .category-top-card-link:hover .category-top-card-header-icon-leaf:nth-of-type(1),
  .category-top-cards .category-top-card-link:hover .category-top-card-header-icon-leaf:first-of-type {
    transform: none;
    animation: category-top-icon-orbit 2.2s linear infinite;
  }

  .category-top-cards .category-top-card-link:hover .category-top-card-header-icon-leaf:nth-of-type(2) {
    transform: none;
    animation: category-top-icon-orbit 2.2s linear infinite;
    animation-delay: -0.55s;
  }

  .category-top-cards .category-top-card-link:hover .category-top-card-header-icon-leaf:nth-of-type(3) {
    transform: none;
    animation: category-top-icon-orbit 2.2s linear infinite;
    animation-delay: -1.1s;
  }

  .category-top-cards .category-top-card-link:hover .category-top-card-header-icon-leaf:nth-of-type(4) {
    transform: none;
    animation: category-top-icon-orbit 2.2s linear infinite;
    animation-delay: -1.65s;
  }
}

@keyframes category-top-icon-bob {
  0%,
  100% {
    transform: translateY(0) rotate(0deg);
  }
  50% {
    transform: translateY(-2px) rotate(-4deg);
  }
}

@keyframes category-top-icon-pop {
  0% {
    transform: scale(1);
  }
  40% {
    transform: scale(1.18) rotate(-6deg);
  }
  70% {
    transform: scale(0.96) rotate(3deg);
  }
  100% {
    transform: scale(1) rotate(0deg);
  }
}

@keyframes category-top-icon-ripple {
  0% {
    opacity: 0.55;
    transform: translate(-50%, -50%) scale(0.9);
  }
  100% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(1.85);
  }
}

@keyframes category-top-icon-orbit {
  0% {
    opacity: 0.95;
    transform: translate(-50%, -50%) rotate(0deg) translateY(-21px) scale(1);
  }
  100% {
    opacity: 0.95;
    transform: translate(-50%, -50%) rotate(360deg) translateY(-21px) scale(1);
  }
}

@media (prefers-reduced-motion: reduce) {
  .category-top-card-header-icon .category-emoji,
  .category-top-cards .category-top-card-link:hover .category-top-card-header-icon .category-emoji,
  .category-top-cards .category-top-card-link:hover .category-top-card-header-icon-leaf:nth-of-type(1),
  .category-top-cards .category-top-card-link:hover .category-top-card-header-icon-leaf:nth-of-type(2),
  .category-top-cards .category-top-card-link:hover .category-top-card-header-icon-leaf:nth-of-type(3),
  .category-top-cards .category-top-card-link:hover .category-top-card-header-icon-leaf:nth-of-type(4),
  .category-top-cards .category-top-card-link:hover .category-top-card-header-icon-leaf:nth-of-type(5) {
    animation: none !important;
  }

  .category-top-cards .category-top-card-link:hover .category-top-card-header-icon-leaf:nth-of-type(1),
  .category-top-cards .category-top-card-link:hover .category-top-card-header-icon-leaf:nth-of-type(2),
  .category-top-cards .category-top-card-link:hover .category-top-card-header-icon-leaf:nth-of-type(3),
  .category-top-cards .category-top-card-link:hover .category-top-card-header-icon-leaf:nth-of-type(4) {
    opacity: 0.85;
  }

  .category-top-cards .category-top-card-link:hover .category-top-card-header-icon-leaf:nth-of-type(1) {
    transform: translate(-50%, -50%) rotate(0deg) translateY(-18px) scale(1);
  }

  .category-top-cards .category-top-card-link:hover .category-top-card-header-icon-leaf:nth-of-type(2) {
    transform: translate(-50%, -50%) rotate(90deg) translateY(-18px) scale(1);
  }

  .category-top-cards .category-top-card-link:hover .category-top-card-header-icon-leaf:nth-of-type(3) {
    transform: translate(-50%, -50%) rotate(180deg) translateY(-18px) scale(1);
  }

  .category-top-cards .category-top-card-link:hover .category-top-card-header-icon-leaf:nth-of-type(4) {
    transform: translate(-50%, -50%) rotate(270deg) translateY(-18px) scale(1);
  }
}

.row-sites .row-sites-arrow {
  display: inline-block;
  vertical-align: middle;
  width: 10px;
  height: 18px;
  margin: -2px 6px 0 0;
  flex-shrink: 0;
}

.row-sites .list-sites .item-site .item-site-favicon,
.row-sites .list-sites .item-site .entry-favicon-img {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  object-fit: contain;
  display: block;
}

body.dark .row-sites .list-sites .item-site .item-site-favicon,
body.dark .row-sites .list-sites .item-site .entry-favicon-img {
  background: #fff;
}

@media (min-width: 992px) {
  .row-sites .row-sites-arrow {
    width: 12px;
    height: 20px;
    margin: -3px 8px 0 0;
  }

  .row-sites .list-sites .item-site .item-site-favicon,
  .row-sites .list-sites .item-site .entry-favicon-img {
    width: 20px;
    height: 20px;
  }
}

.breadcrumb-holder {
  margin-bottom: 4px;
}

.breadcrumb-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

.site-frontend-edit-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 32px;
  padding: 6px 12px;
  border: 1px solid rgba(255, 151, 1, 0.45);
  border-radius: 8px;
  background: #fff;
  color: #c45f00;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
  text-decoration: none;
  box-shadow: 0 2px 8px rgba(20, 21, 30, 0.08);
  transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}

.site-frontend-edit-btn:hover {
  background: #fff7ec;
  border-color: #ff9701;
  color: #ff9701;
  box-shadow: 0 4px 12px rgba(255, 151, 1, 0.16);
}

.site-frontend-edit-btn:focus-visible {
  outline: 2px solid #ff9701;
  outline-offset: 2px;
}

.site-frontend-edit-actions {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}

.site-frontend-edit-actions--breadcrumb {
  margin-left: 0;
}

.breadcrumb-row-actions {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
  margin-left: auto;
}

.site-frontend-edit-btn--card {
  position: absolute;
  top: 8px;
  left: 8px;
  right: auto;
  /* Above the vendor hover overcover (z-index: 4) and title (5–6); save sits at 10. */
  z-index: 12;
  pointer-events: auto;
  min-height: 28px;
  padding: 4px 10px;
  font-size: 11px;
  box-shadow: 0 2px 10px rgba(15, 23, 42, 0.18);
}

.url_link_image[data-thumb-overlay] .site-frontend-edit-btn--card {
  z-index: 12;
  pointer-events: auto;
}

.categorypage .link-header-line .site-frontend-edit-actions--category-header {
  margin: 10px 0 0;
}

body.singlepage .entry-review-hero-head .site-frontend-edit-actions--entry-hero {
  margin-bottom: 10px;
}

body.dark .site-frontend-edit-btn {
  background: #2c2e38;
  border-color: rgba(255, 151, 1, 0.42);
  color: #ffb347;
}

body.dark .site-frontend-edit-btn:hover {
  background: #383a46;
  border-color: #ff9701;
  color: #ff9701;
}

.breadcrumb-row > .breadcrumb {
  flex: 1 1 auto;
  min-width: 0;
}

.entry-save-action--breadcrumb {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
  margin: 0;
  padding: 4px 0;
  background: none;
  border: none;
  border-radius: 0;
}

.entry-save-action--breadcrumb .entry-save-action-copy {
  display: flex;
  flex-direction: column;
  gap: 1px;
  align-items: flex-start;
  text-align: left;
  min-width: 0;
}

.entry-save-action--breadcrumb .entry-save-action-label {
  font-size: 13px;
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
}

.entry-save-action--breadcrumb .entry-save-action-hint {
  font-size: 11px;
  line-height: 1.2;
  white-space: nowrap;
}

.entry-save-action--breadcrumb .site-save-btn--review-main {
  flex-shrink: 0;
  width: 30px;
  height: 30px;
  border-radius: 8px;
}

.entry-save-action--breadcrumb .site-save-btn--review-main .site-save-btn-icon {
  width: 17px;
  height: 17px;
}

.breadcrumb {
  background: transparent !important;
  min-height: 34px;
  height: auto;
  gap: 2px;
}

.breadcrumb li.link-home a {
  padding: 8px 8px 8px 14px;
}

.breadcrumb li.link-category a {
  padding: 8px 8px 8px 14px;
  max-width: min(42vw, 280px);
}

.breadcrumb li.link-category a span[itemprop="name"] {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.breadcrumb li.link-category .category-emoji {
  font-size: 1.45rem;
  line-height: 1;
  flex-shrink: 0;
}

.breadcrumb li.link-category .category-icon-img {
  width: 24px;
  height: 24px;
}

/* Category page hero icon above the title */
body.categorypage .link-header .category-emoji {
  font-size: 2.75rem;
  line-height: 1;
}

body.categorypage .link-header .category-icon-img {
  width: 44px;
  height: 44px;
}

.breadcrumb li:not(:first-child):before {
  flex-shrink: 0;
  opacity: 0.65;
}

.breadcrumb .breadcrumb-current,
.breadcrumb li:last-child > span.single-title,
.breadcrumb li.breadcrumb-current-wrap > .breadcrumb-current {
  color: #4e4e4e;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.3;
  padding: 8px 4px;
  display: inline-block;
  max-width: min(52vw, 360px);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  vertical-align: middle;
}

.breadcrumb li:last-child a.single-title,
.breadcrumb a.breadcrumb-current-link {
  color: #4e4e4e !important;
  font-weight: 500;
  max-width: min(58vw, 420px);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding: 8px 4px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.breadcrumb a.breadcrumb-current-link span[itemprop="name"] {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}

.breadcrumb .breadcrumb-current-suffix {
  color: #9798a0;
  font-weight: 400;
  flex-shrink: 0;
}

body.dark .breadcrumb li.link-home a {
  color: var(--site-brand-primary, #ff9701) !important;
}

body.dark .breadcrumb li.link-category a,
body.dark .breadcrumb li[itemprop="itemListElement"] a:not(.single-title) {
  color: #d0d0d0 !important;
}

body.dark .breadcrumb .breadcrumb-current,
body.dark .breadcrumb li:last-child > span.single-title,
body.dark .breadcrumb li.breadcrumb-current-wrap > .breadcrumb-current,
body.dark .breadcrumb li:last-child a.single-title,
body.dark .breadcrumb a.breadcrumb-current-link {
  color: #fff !important;
}

body.dark .breadcrumb .breadcrumb-current-suffix {
  color: #bbb;
}

body.dark .breadcrumb li:not(:first-child):before {
  opacity: 0.85;
  filter: brightness(0) invert(0.82);
}

.admin-layout-bar {
  position: sticky;
  top: 0;
  z-index: 120;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 10px;
  margin: 0 auto 12px;
  max-width: var(--container-width, 1158px);
  padding: 7px 10px;
  border-radius: 8px;
  background: #1f2937;
  color: #f9fafb;
  font-size: 13px;
  line-height: 1.3;
  min-height: 0;
}

.admin-layout-bar-lead {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  flex: 1 1 auto;
  position: relative;
}

.admin-layout-bar-title {
  flex-shrink: 0;
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
}

.admin-layout-bar-group {
  position: relative;
  flex-shrink: 0;
}

.admin-layout-bar-group summary {
  cursor: pointer;
  color: #d1d5db;
  font-size: 12px;
  font-weight: 600;
  list-style: none;
  white-space: nowrap;
  user-select: none;
}

.admin-layout-bar-group summary::-webkit-details-marker {
  display: none;
}

.admin-layout-bar-group summary::before {
  content: "\25B8 ";
  display: inline-block;
  transition: transform 0.15s ease;
}

.admin-layout-bar-group[open] summary::before {
  transform: rotate(90deg);
}

.admin-layout-bar-help {
  min-width: 0;
}

.admin-layout-bar-help[open] p {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  z-index: 5;
  margin: 0;
  width: min(52rem, calc(100vw - 24px));
  max-width: min(52rem, calc(100vw - 24px));
  min-width: min(20rem, calc(100vw - 24px));
  padding: 10px 14px;
  border-radius: 8px;
  background: #374151;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28);
  font-size: 12px;
  line-height: 1.5;
  color: #e5e7eb;
  box-sizing: border-box;
}

.admin-layout-bar-previews[open] .admin-layout-bar-preview-panel {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  left: auto;
  z-index: 6;
  display: grid;
  gap: 8px;
  width: min(28rem, calc(100vw - 24px));
  padding: 8px;
  border-radius: 8px;
  background: #374151;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28);
  box-sizing: border-box;
}

.admin-layout-bar-previews[open] .admin-popup-preview-actions {
  position: static;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
  width: auto;
  max-width: none;
  padding: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.admin-layout-bar-preview-foot {
  margin: 0;
  font-size: 11px;
  line-height: 1.45;
  color: #d1d5db;
}

.admin-layout-bar-preview-foot kbd {
  display: inline-block;
  padding: 1px 5px;
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.12);
  font-size: 10px;
  font-family: inherit;
}

body.admin-layout-mode .admin-layout-bar {
  z-index: 130;
  isolation: isolate;
}

.admin-layout-bar a {
  color: #ffba01;
  text-decoration: underline;
  white-space: nowrap;
}

.admin-layout-actions {
  display: flex;
  align-items: center;
  gap: 6px 8px;
  flex: 1 1 auto;
  flex-wrap: wrap;
  justify-content: flex-end;
  min-width: 0;
}

.admin-layout-actions-end {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
  margin-left: auto;
}

.admin-layout-status {
  flex: 1 1 6rem;
  min-width: 0;
  font-size: 12px;
  color: #d1d5db;
  text-align: right;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

body.admin-layout-mode .admin-layout-bar .admin-layout-bar-brush {
  background: rgba(255, 255, 255, 0.12);
}

body.admin-layout-mode .admin-layout-bar .admin-layout-bar-brush:hover {
  background: rgba(255, 255, 255, 0.22);
}

.admin-layout-status.is-dirty {
  color: #fbbf24;
}

.admin-layout-status.is-saving {
  color: #93c5fd;
}

.admin-layout-status.is-saved {
  color: #86efac;
}

.admin-layout-status.is-error {
  color: #fca5a5;
}

.admin-layout-save {
  border: none;
  border-radius: 6px;
  padding: 5px 10px;
  background: #ff9701;
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
  cursor: pointer;
}

.admin-layout-save:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

.admin-layout-save:not(:disabled):hover {
  background: #e88700;
}

body.admin-layout-mode .categories-grid {
  position: relative;
}

body.admin-layout-mode .categories-grid::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 1;
  background-image: repeating-linear-gradient(
    to right,
    rgba(255, 151, 1, 0.08) 0,
    rgba(255, 151, 1, 0.08) calc(25% - 4px),
    transparent calc(25% - 4px),
    transparent 25%
  );
}

body.admin-layout-mode .category-container {
  z-index: 2;
}

body.admin-layout-mode .category-container .category-wrapper {
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

body.admin-layout-mode .category-container .category-wrapper[data-scroll-constrained] {
  flex: 0 0 auto;
}

body.admin-layout-mode .category-container .category-header {
  cursor: grab;
  touch-action: none;
  user-select: none;
}

body.admin-layout-mode .category-container .category-header a {
  pointer-events: none;
}

body.admin-layout-mode .category-container .category-item {
  overflow: visible;
  position: relative;
}

body.admin-layout-mode.admin-entry-sortable-active {
  cursor: grabbing;
}

body.admin-layout-mode.admin-entry-sortable-active .admin-entry-drag-handle {
  cursor: grabbing;
}

body.admin-layout-mode .category-container .category-wrapper > ul > .admin-sortable-placeholder--flex {
  display: flex;
  align-items: center;
  flex: 0 0 100%;
  width: 100% !important;
  max-width: 100%;
  min-height: 24px;
  margin: 0;
  padding: 0;
  list-style: none;
  box-sizing: border-box;
  transition:
    width 0.28s cubic-bezier(0.22, 1, 0.36, 1),
    height 0.28s cubic-bezier(0.22, 1, 0.36, 1),
    opacity 0.2s ease;
}

body.admin-layout-mode .category-container .category-wrapper > ul > .admin-sortable-placeholder--flex.admin-sortable-placeholder--x {
  flex: 0 0 auto;
  width: auto !important;
  max-width: none;
}

body.admin-layout-mode .admin-sortable-floater.category-item {
  display: flex;
  align-items: center;
  box-sizing: border-box;
  padding: 3px 10px 3px 6px;
  background: #fff;
  border: 1px solid rgba(255, 151, 1, 0.35);
  border-radius: 8px;
  list-style: none;
  opacity: 0.96;
  transition: box-shadow 0.15s ease;
}

body.admin-layout-mode.dark .admin-sortable-floater.category-item,
body.homepage.dark.admin-layout-mode .admin-sortable-floater.category-item {
  background: #2a2b31;
  border-color: rgba(255, 151, 1, 0.45);
}

body.admin-layout-mode .category-item.admin-sortable-drop-target {
  background: rgba(255, 151, 1, 0.1);
  box-shadow: inset 0 0 0 1px rgba(255, 151, 1, 0.35);
  border-radius: 6px;
}

body.admin-layout-mode.admin-entry-sortable-active .category-container .category-item:not(.admin-sortable-hidden-source):not(.admin-sortable-floater) {
  transition: background 0.15s ease, box-shadow 0.15s ease;
}

body.admin-layout-mode .admin-entry-drag-handle {
  flex-shrink: 0;
  align-self: center;
  width: 22px;
  height: 22px;
  margin: 0 2px 0 0;
  padding: 0;
  border: 1px solid rgba(255, 151, 1, 0.28);
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.95);
  color: #888;
  font-size: 11px;
  line-height: 1;
  cursor: grab;
  touch-action: none;
  user-select: none;
  z-index: 4;
}

body.admin-layout-mode .admin-entry-drag-handle:hover {
  border-color: rgba(255, 151, 1, 0.55);
  color: #555;
  background: #fff;
}

body.admin-layout-mode .admin-entry-remove-btn {
  position: absolute;
  top: 50%;
  right: 5px;
  z-index: 5;
  width: 20px;
  height: 20px;
  margin: 0;
  padding: 0;
  border: 1px solid rgba(220, 38, 38, 0.35);
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.96);
  color: #dc2626;
  font-size: 15px;
  font-weight: 700;
  line-height: 18px;
  text-align: center;
  cursor: pointer;
  opacity: 0;
  pointer-events: none;
  transform: translateY(-50%) scale(0.92);
  transition: opacity 0.15s ease, transform 0.15s ease, background 0.15s ease, border-color 0.15s ease;
}

body.admin-layout-mode .category-item:hover .admin-entry-remove-btn,
body.admin-layout-mode .category-item:focus-within .admin-entry-remove-btn {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(-50%) scale(1);
}

body.admin-layout-mode .admin-entry-remove-btn:hover {
  background: #fef2f2;
  border-color: #dc2626;
  color: #991b1b;
}

body.admin-layout-mode .admin-entry-remove-btn:disabled {
  opacity: 0.45;
  cursor: wait;
}

body.admin-layout-mode .category-item.is-removing {
  opacity: 0;
  transform: translateX(8px);
  max-height: 0;
  min-height: 0 !important;
  margin: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  overflow: hidden;
  pointer-events: none;
  transition:
    opacity 0.22s ease,
    transform 0.22s ease,
    max-height 0.28s ease,
    margin 0.28s ease,
    padding 0.28s ease;
}

body.admin-layout-mode.admin-entry-sortable-active .admin-entry-remove-btn {
  opacity: 0 !important;
  pointer-events: none !important;
}

@media (min-width: 992px) {
  body.admin-layout-mode .category-container .category-item .review {
    right: 28px;
  }
}

body.admin-layout-mode .category-item.admin-entry-sortable-dragging {
  opacity: 0.72;
  z-index: 6;
}

body.admin-layout-mode.admin-entry-sortable-active .category-item .link-analytics,
body.admin-layout-mode.admin-entry-sortable-active .category-item .review {
  pointer-events: none;
}

body.admin-layout-mode.admin-entry-sortable-active .category-container .category-item:not(.admin-sortable-hidden-source) {
  pointer-events: none;
}

body.admin-layout-mode.admin-entry-sortable-active .category-container .category-item .admin-entry-drag-handle {
  pointer-events: auto;
}

body.admin-layout-mode .popover {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
  opacity: 0 !important;
}

body.admin-layout-mode .admin-sortable-floater .desc,
body.admin-layout-mode .admin-sortable-floater .review,
body.admin-layout-mode .admin-sortable-floater .admin-entry-remove-btn {
  display: none !important;
}

/* Fake badge: vendor CSS hides it until hover; keep it visible like AI/18+/VR */
.category-container .is-fake-icon {
  display: inline-block !important;
  visibility: visible;
  flex-shrink: 0;
  position: relative;
  z-index: 3;
}

body.admin-layout-mode .category-container .icon_show_newicon,
body.admin-layout-mode .category-container .icon_show_featured,
body.admin-layout-mode .category-container .is-fake-icon,
body.admin-layout-mode .category-container .ai-friendly-icon,
body.admin-layout-mode .category-container .is-18-friendly-icon,
body.admin-layout-mode .category-container .icon_vr_friendly {
  display: inline-block !important;
  visibility: visible;
  flex-shrink: 0;
  position: relative;
  z-index: 3;
}

.homepage .category-container ul {
  counter-reset: number;
  animation: none !important;
}

.homepage .category-container .category-bottom,
.homepage .category-container .category-bottom:hover,
.homepage .category-container .review {
  animation: none !important;
}

.homepage .category-container .category-item::before {
  counter-increment: number;
  content: counter(number) ".";
  flex-shrink: 0;
  text-align: right;
  color: #4b4c4f;
  width: 20px;
  margin: 3px 3px 0 0;
  font-size: 11px;
  font-weight: 300;
  line-height: 18px;
  display: inline-block;
}

@media (min-width: 992px) {
  .homepage .category-container .category-item.visited::before,
  body.admin-layout-mode .category-container .category-item.visited::before {
    content: '';
    border: 1px solid #ff9a30;
    border-width: 0 1px 1px 0;
    width: 6px;
    height: 11px;
    margin: 1px 7px 6px 10px;
    transform: rotate(45deg);
  }
}

body.admin-layout-mode .category-container.visited .category-bottom .svg-icon {
  display: none;
}

body.admin-layout-mode .category-container.visited .category-bottom::after {
  content: '';
  border: 1px solid transparent;
  border-color: transparent transparent #fff #fff;
  width: 12px;
  height: 7px;
  margin: 0 0 3px 11px;
  transform: rotate(-45deg);
}

body.admin-layout-mode .category-container.admin-dragging {
  z-index: 15;
  opacity: 0.92;
  cursor: grabbing;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
}

body.admin-drag-active {
  user-select: none;
  cursor: grabbing;
}

body.admin-layout-mode .category-container.admin-drop-target {
  outline: 2px dashed #ff9701;
  outline-offset: 2px;
}

body.admin-layout-mode .admin-layout-tools {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  position: relative;
  flex-shrink: 0;
  margin: 4px 8px 6px;
  z-index: 20;
  pointer-events: auto;
}

body.admin-layout-mode .admin-color-controls {
  display: flex;
  align-items: center;
  gap: 6px;
}

body.admin-layout-mode .admin-color-label {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 3px 6px;
  border-radius: 6px;
  background: rgba(31, 41, 55, 0.88);
  color: #fff;
  font-size: 10px;
  font-weight: 600;
  line-height: 1;
  cursor: default;
}

body.admin-layout-mode .admin-color-label input[type="color"] {
  width: 26px;
  height: 22px;
  padding: 0;
  border: none;
  background: none;
  cursor: pointer;
}

body.admin-layout-mode .admin-col-badge,
body.admin-layout-mode .admin-row-badge {
  pointer-events: none;
  font-size: 11px;
  font-weight: 600;
  line-height: 1;
  padding: 4px 8px;
  border-radius: 999px;
  background: rgba(31, 41, 55, 0.88);
  color: #fff;
  white-space: nowrap;
}

body.admin-layout-mode .admin-resize-controls {
  display: flex;
  flex: 1 1 100%;
  min-width: 0;
  align-items: center;
  gap: 4px;
  touch-action: none;
  cursor: ns-resize;
}

body.admin-layout-mode .admin-resize-minus,
body.admin-layout-mode .admin-resize-plus {
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  border-radius: 6px;
  border: none;
  background: #ff9701;
  color: #fff;
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
  touch-action: manipulation;
  transition: transform 0.12s ease, background 0.12s ease, opacity 0.12s ease;
}

body.admin-layout-mode .admin-resize-minus:hover,
body.admin-layout-mode .admin-resize-plus:hover {
  background: #e88700;
}

body.admin-layout-mode .admin-resize-minus:active,
body.admin-layout-mode .admin-resize-plus:active {
  transform: scale(0.9);
  background: #d97700;
}

body.admin-layout-mode .admin-resize-minus.is-at-limit,
body.admin-layout-mode .admin-resize-plus.is-at-limit {
  opacity: 0.45;
  cursor: not-allowed;
  background: #9ca3af;
}

body.admin-layout-mode .category-container.admin-height-nudged {
  outline: 2px solid rgba(255, 151, 1, 0.9);
  outline-offset: 1px;
}

body.admin-layout-mode .category-container.admin-height-growing {
  box-shadow: 0 0 0 2px rgba(255, 151, 1, 0.25);
}

body.admin-layout-mode .category-container.admin-height-shrinking {
  box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.2);
}

body.admin-layout-mode .category-container.admin-height-at-max,
body.admin-layout-mode .category-container.admin-height-at-min {
  outline: 2px solid rgba(220, 38, 38, 0.75);
  outline-offset: 1px;
}

body.admin-layout-mode .admin-row-badge.is-updating {
  background: rgba(255, 151, 1, 0.95);
  transform: scale(1.08);
  transition: transform 0.15s ease, background 0.15s ease;
}

body.admin-layout-mode .admin-resize-handle {
  flex: 1;
  min-width: 80px;
  height: 28px;
  min-height: 28px;
  border-radius: 6px;
  background: rgba(255, 151, 1, 0.55);
  cursor: ns-resize;
  touch-action: none;
  position: relative;
}

body.admin-layout-mode .category-container.admin-resizing {
  z-index: 16;
}

body.admin-layout-mode .admin-resize-handle::after {
  content: "drag to resize";
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 600;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  pointer-events: none;
}

body.admin-layout-mode .category-container.admin-resizing .admin-resize-handle {
  background: rgba(255, 151, 1, 0.85);
}

body.admin-layout-mode .admin-drop-indicator {
  position: absolute;
  left: 0;
  right: 0;
  height: 4px;
  background: #ff9701;
  border-radius: 4px;
  z-index: 20;
  pointer-events: none;
}

body.admin-resize-active {
  user-select: none;
  cursor: ns-resize;
}

.admin-drag-handle,
.admin-layout-tools,
.admin-drop-indicator {
  display: none;
}

body.admin-layout-mode .admin-drag-handle {
  display: block;
  width: calc(100% - 16px);
  margin: 6px 8px 0;
  padding: 6px 10px;
  border: none;
  border-radius: 6px;
  background: #374151;
  color: #f9fafb;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  cursor: grab;
  touch-action: none;
  user-select: none;
  z-index: 18;
  position: relative;
}

body.admin-layout-mode .category-container.admin-dragging .admin-drag-handle {
  cursor: grabbing;
  background: #ff9701;
  color: #fff;
}

/* ——— Search overlay (panel + browse grid) ——— */
.search-panel {
  display: flex;
  flex-direction: column;
  min-height: 0;
  position: relative;
  background: var(--mob-search-panel-bg, #fff);
  border-radius: inherit;
}

.search-panel-top {
  display: flex;
  justify-content: flex-end;
  align-items: flex-start;
  flex-shrink: 0;
  position: relative;
  z-index: 30;
  padding: 6px 12px 8px;
  background: var(--mob-search-panel-bg, #fff);
}

.search-panel-field {
  display: flex;
  align-items: center;
  gap: 11px;
  margin: 0 12px 14px;
  padding: 0 14px;
  min-height: 50px;
  border: 2px solid color-mix(in srgb, var(--site-brand-primary, #ff9701) 24%, #d1d5db);
  border-radius: 10px;
  background: var(--mob-search-input-bg, #fff);
  box-shadow:
    0 1px 2px rgba(15, 23, 42, 0.05),
    0 6px 18px rgba(15, 23, 42, 0.08);
  position: sticky;
  top: 0;
  z-index: 2;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.search-panel-field:focus-within {
  border-color: var(--site-brand-primary, #ff9701);
  box-shadow:
    0 0 0 4px color-mix(in srgb, var(--site-brand-primary, #ff9701) 16%, transparent),
    0 6px 20px rgba(15, 23, 42, 0.1);
}

.search-panel-field-icon {
  flex-shrink: 0;
  width: 22px;
  height: 22px;
  margin-left: 0;
  color: var(--site-brand-primary, #ff9701);
  opacity: 0.92;
}

.search-panel-input-wrap {
  position: relative;
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
}

.search-panel-input {
  flex: 1;
  min-width: 0;
  width: 100%;
  height: 46px;
  padding: 0 6px 0 10px;
  border: 0;
  background: transparent;
  color: var(--mob-search-input-color, #1f2937);
  font-size: 17px;
  font-weight: 500;
  line-height: 1.3;
  text-align: left;
  direction: ltr;
  outline: none;
  -webkit-appearance: none;
  appearance: none;
  transition: padding-right 0.15s ease;
}

/* Only reserve room for the Clear pill while there is text (matches when the Clear button is shown) */
body.search-form--has-val .search-panel-input {
  padding-right: 64px;
}

.search-panel-input::placeholder {
  color: var(--mob-search-placeholder, #6b7280);
  opacity: 1;
  font-weight: 400;
}

.search-panel-input::-webkit-search-cancel-button,
.search-panel-input::-webkit-search-decoration {
  display: none;
}

.search-panel-clear {
  position: absolute;
  right: 6px;
  top: 50%;
  transform: translateY(-50%);
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  height: 30px;
  padding: 0 10px;
  border: 0;
  border-radius: 6px;
  background: color-mix(in srgb, var(--mob-search-muted, #666) 9%, transparent);
  color: var(--mob-search-muted, #666);
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0.01em;
  cursor: pointer;
  transition: opacity 0.15s ease, background-color 0.15s ease, color 0.15s ease;
}

.search-panel-close {
  position: relative;
  top: auto;
  right: auto;
  bottom: auto;
  left: auto;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  min-width: 34px;
  min-height: 34px;
  margin-top: -2px;
  padding: 0;
  border: 0;
  border-radius: 10px;
  background: #e53935;
  background-image: none;
  color: #fff;
  cursor: pointer;
  z-index: 31;
  box-shadow:
    0 2px 8px rgba(229, 57, 53, 0.38),
    inset 0 1px 0 rgba(255, 255, 255, 0.18);
  transition: background-color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}

.search-panel-close svg {
  width: 16px;
  height: 16px;
  display: block;
}

.search-panel-clear:hover {
  background: color-mix(in srgb, var(--mob-search-muted, #666) 16%, transparent);
  color: var(--mob-search-chip-color, #4e4e4e);
}

.search-panel-close:hover {
  background: #c62828;
  background-image: none;
  color: #fff;
  transform: translateY(-1px);
  box-shadow:
    0 4px 12px rgba(198, 40, 40, 0.42),
    inset 0 1px 0 rgba(255, 255, 255, 0.18);
}

.search-panel-close:active {
  transform: translateY(0);
  box-shadow:
    0 1px 4px rgba(198, 40, 40, 0.35),
    inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

.search-panel-clear:focus-visible,
.search-panel-close:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--site-brand-primary, #ff9701) 70%, #fff);
  outline-offset: 2px;
}

.search-panel-clear--hidden {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.search-panel-main {
  flex: 1;
  min-height: 0;
  position: relative;
}

.search-panel-section-label,
.search-tags-title {
  margin: 0;
  padding: 14px 16px 8px;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--mob-search-muted, #888);
}

.search-tags-title {
  padding: 16px 16px 4px;
}

.search-browse-grid,
.search-category-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  padding: 0 12px 12px;
}

@media (min-width: 560px) {
  .search-browse-grid,
  .search-category-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.search-cat-card {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
  min-width: 0;
  min-height: 0;
  padding: 6px 10px;
  border: 1px solid var(--mob-search-panel-border, #e0e0e0);
  border-radius: 0;
  background: var(--mob-search-tag-bg, #fff);
  color: var(--mob-search-chip-color, #4e4e4e);
  text-decoration: none;
  box-sizing: border-box;
  transition: border-color 0.12s ease, background-color 0.12s ease;
}

.search-cat-card:hover {
  border-color: color-mix(in srgb, var(--mob-search-muted, #666) 28%, var(--mob-search-panel-border, #e0e0e0));
  background: var(--mob-search-section-bg, #f5f6f8);
}

.search-category-hit.search-result-hit--active,
.search-cat-card.search-result-hit--active {
  border-color: var(--site-search-result-accent, #ff9701);
  background: color-mix(in srgb, var(--site-search-result-accent, #ff9701) 7%, var(--mob-search-tag-bg, #fff));
  outline: none;
  box-shadow: none;
}

/* Search result categories: compact row tiles */
.search-category-grid .search-cat-card.search-category-hit {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
  width: auto;
  max-width: none;
  min-height: 0;
  padding: 6px 10px;
  border: 1px solid var(--mob-search-panel-border, #e0e0e0);
  border-radius: 0;
  background: var(--mob-search-tag-bg, #fff);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.25;
  white-space: normal;
  scroll-snap-align: unset;
}

.search-category-grid .search-cat-card.search-category-hit:hover {
  border-color: color-mix(in srgb, var(--mob-search-muted, #666) 28%, var(--mob-search-panel-border, #e0e0e0));
  background: var(--mob-search-section-bg, #f5f6f8);
}

.search-category-grid .search-cat-card.search-category-hit.search-result-hit--active {
  border-color: var(--site-search-result-accent, #ff9701);
  background: color-mix(in srgb, var(--site-search-result-accent, #ff9701) 7%, var(--mob-search-tag-bg, #fff));
}

.search-cat-card-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 20px;
  min-width: 20px;
  height: 20px;
  background: none;
  border-radius: 0;
}

.search-cat-card-icon-img {
  width: 16px;
  height: 16px;
  object-fit: contain;
  display: block;
  /* Hide the alt text glyph while loading — see .entry-favicon-img above. */
  color: transparent;
  font-size: 0;
  overflow: hidden;
}

.search-cat-card-emoji {
  font-size: 1rem;
  line-height: 1;
}

.search-cat-card-body {
  display: flex;
  flex: 1;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 6px 8px;
  min-width: 0;
}

.search-cat-card-name {
  flex: 1 1 auto;
  min-width: 0;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.25;
  color: inherit;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.search-cat-card-meta {
  flex-shrink: 0;
  font-size: 10px;
  line-height: 1.2;
  color: var(--mob-search-muted, #888);
  white-space: nowrap;
}

.search-cat-card .search-hit-mark {
  font-weight: 600;
  color: inherit;
  background: none;
  padding: 0;
  border-radius: 0;
}

.search-browse-grid .search-cat-card::after,
.search-category-grid .search-cat-card::after {
  display: none;
  content: none;
}

/* Browse categories — keep the stacked grid, but give the cards a proper hover effect */
.search-browse-grid .search-cat-card.search-browse-card {
  transition: border-color 0.16s ease, background-color 0.16s ease, color 0.16s ease, transform 0.16s ease, box-shadow 0.16s ease;
}

.search-browse-grid .search-cat-card.search-browse-card .search-cat-card-icon-img {
  transition: transform 0.16s ease;
}

.search-browse-grid .search-cat-card.search-browse-card:hover {
  border-color: color-mix(in srgb, var(--site-search-result-accent, #ff9701) 55%, var(--mob-search-tag-border, #e0e0e0));
  background: color-mix(in srgb, var(--site-search-result-accent, #ff9701) 10%, var(--mob-search-tag-bg, #fff));
  color: color-mix(in srgb, var(--site-search-result-accent, #ff9701) 72%, var(--mob-search-chip-color, #4e4e4e));
  transform: translateY(-1px);
  box-shadow: 0 4px 12px color-mix(in srgb, var(--site-search-result-accent, #ff9701) 18%, transparent);
}

.search-browse-grid .search-cat-card.search-browse-card:hover .search-cat-card-meta {
  color: inherit;
  opacity: 0.95;
}

.search-browse-grid .search-cat-card.search-browse-card:hover .search-cat-card-icon-img {
  transform: scale(1.12);
}

.search-browse-grid .search-cat-card.search-browse-card:active {
  transform: translateY(0);
  box-shadow: none;
}

.search-form--trigger {
  position: relative;
  width: 100%;
}

.search-trigger {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  width: 100%;
  min-height: 44px;
  padding: 0 38px 0 14px;
  border: 1px solid #e0e0e0;
  border-radius: 8px;
  background: #fdfdfd;
  color: #5c6370;
  font-size: 14px;
  line-height: 1.3;
  text-align: left;
  cursor: text;
  box-sizing: border-box;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.search-trigger:hover,
.search-trigger:focus-visible {
  border-color: color-mix(in srgb, var(--site-search-result-accent, #ff9701) 45%, #e0e0e0);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--site-search-result-accent, #ff9701) 12%, transparent);
  outline: none;
}

.search-trigger-text {
  flex: 0 1 auto;
  min-width: 0;
  max-width: calc(100% - 58px);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.search-trigger-shortcut {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  min-height: 20px;
  padding: 2px 6px;
  border: 1px solid #e0e0e0;
  border-radius: 5px;
  background: #f5f6f8;
  color: #5c6370;
  font-family: inherit;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.01em;
  line-height: 1.2;
}

/* Never render an empty bordered box (avoids the pop-in/shift before the label is set) */
.search-trigger-shortcut:empty {
  display: none;
}

.search-tags {
  border-top: 1px solid var(--mob-search-panel-border, #ededed);
  background: var(--mob-search-section-bg, #fafafa);
  padding-bottom: 6px;
}

.search-tags-list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 7px;
  padding: 6px 16px 16px;
  column-count: initial;
  column-gap: normal;
  font-size: 13px;
}

.search-tag {
  display: inline-flex;
  align-items: center;
  width: auto;
  max-width: 100%;
  min-height: 30px;
  padding: 4px 13px;
  border: 1px solid var(--mob-search-tag-border, #e0e0e0);
  border-radius: 999px;
  background: var(--mob-search-tag-bg, #fff);
  color: var(--mob-search-tag-color, #555);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.2;
  white-space: nowrap;
  cursor: pointer;
  transition: border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease, transform 0.15s ease;
}

/* Tag-cloud feel: subtle size variation so the strip reads like a cloud, not a uniform list */
.search-tag:nth-child(4n+1) {
  font-size: 14.5px;
}

.search-tag:nth-child(5n+3) {
  font-size: 12px;
}

.search-tag:hover {
  border-color: color-mix(in srgb, var(--site-search-result-accent, #ff9701) 45%, var(--mob-search-tag-border, #e0e0e0));
  background: color-mix(in srgb, var(--site-search-result-accent, #ff9701) 12%, var(--mob-search-tag-bg, #fff));
  color: color-mix(in srgb, var(--site-search-result-accent, #ff9701) 70%, var(--mob-search-tag-color, #555));
  transform: translateY(-1px);
}

.search-tag:active {
  transform: translateY(0);
}

body.search-panel--browsing .search-tags {
  display: block;
}

body.search-form--has-query .search-tags,
body.search-has-results .search-tags {
  display: none;
}

body.search-view--open .search-view,
body.site-search-open .search-view.search-view--open,
body.search-open .search-view.search-view--open {
  display: block;
}

.search-view.search-view--has-categories #search-categories-section {
  display: block;
}

.search-view.search-view--has-sites .search-results-section--entries {
  display: block;
}

.search-backdrop {
  display: none;
}

.search-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 18px 16px;
  color: #666;
  font-size: 14px;
}

.search-loading[hidden],
.search-empty[hidden],
.search-footer[hidden],
.search-backdrop[hidden] {
  display: none !important;
}

.search-loading-spinner {
  width: 18px;
  height: 18px;
  border: 2px solid color-mix(in srgb, var(--site-search-spinner-accent, #ff9701) 25%, transparent);
  border-top-color: var(--site-search-spinner-accent, #ff9701);
  border-radius: 50%;
  animation: site-search-spin 0.7s linear infinite;
}

@keyframes site-search-spin {
  to {
    transform: rotate(360deg);
  }
}

.search-empty {
  padding: 20px 16px;
  text-align: center;
  color: #666;
  font-size: 14px;
  line-height: 1.5;
}

.search-footer {
  padding: 12px 16px 4px;
  border-top: 1px solid #ededed;
  text-align: center;
}

.search-view-all {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 36px;
  padding: 0 16px;
  border-radius: 999px;
  background: var(--site-brand-primary, #ff9701);
  color: #fff !important;
  font-size: 13px;
  font-weight: 600;
  transition: background 0.15s ease, transform 0.15s ease;
}

.search-view-all:hover {
  background: color-mix(in srgb, var(--site-brand-primary, #ff9701) 85%, #000);
  transform: translateY(-1px);
}

.search-hit-mark {
  background: none;
  color: inherit;
  font-weight: 600;
  border-radius: 0;
  padding: 0;
}

.search-results-section {
  display: block;
}

.search-results-section[hidden] {
  display: none !important;
}

.search-results-section-title {
  margin: 0;
  padding: 10px 14px 6px;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #888;
}

.search-results-section--categories .search-results-section-title {
  padding-bottom: 8px;
}

.search-results-section--categories {
  background: linear-gradient(180deg, rgba(250, 251, 252, 0.95) 0%, transparent 100%);
}

.search-results-section--entries .search-body-content {
  display: block;
  padding: 0;
}

.search-view .search-header:has(#search-categories-section[hidden]) {
  display: none;
  border: 0;
}

.search-result-hit--active.search-site-hit,
.search-site-hit.search-result-hit--active,
.search-site-suggestion.search-result-hit--active {
  outline: none;
}

.search-status {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

body.search-is-loading .search-body-content {
  opacity: 0.45;
  pointer-events: none;
  transition: opacity 0.15s ease;
}

body.search-is-loading.search-has-results .search-body-content {
  opacity: 1;
  pointer-events: auto;
}

body.search-is-loading.search-has-results .search-header-content {
  opacity: 0.72;
  transition: opacity 0.15s ease;
}

body.search-is-loading.search-has-results .search-loading {
  position: absolute;
  top: 10px;
  right: 14px;
  z-index: 2;
  padding: 0;
  background: rgba(255, 255, 255, 0.92);
  border-radius: 999px;
  box-shadow: 0 1px 6px rgba(15, 23, 42, 0.12);
}

body.search-is-loading.search-has-results .search-loading-spinner {
  width: 16px;
  height: 16px;
}

.search-site-suggestion {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 10px 14px;
  border-bottom: 0;
  color: #4e4e4e;
  text-decoration: none;
  box-sizing: border-box;
  background: transparent;
  transition: color 0.12s ease;
  font-size: 14px;
}

.search-site-suggestion-row {
  position: relative;
  border-bottom: 1px solid var(--mob-search-panel-border, #ededed);
  transition: background-color 0.12s ease, box-shadow 0.12s ease;
}

.search-site-suggestion-row:last-child {
  border-bottom: 0;
}

.search-site-suggestion-row:hover,
.search-site-suggestion-row:has(.search-site-suggestion.search-result-hit--active) {
  background: color-mix(in srgb, var(--site-search-result-accent, #ff9701) 11%, var(--mob-search-panel-bg, #fff));
  box-shadow: inset 3px 0 0 var(--site-search-result-accent, #ff9701);
}

.search-site-suggestion:hover,
.search-site-suggestion.search-result-hit--active {
  background: transparent;
  outline: none;
}

.search-site-suggestion-row:hover .search-site-suggestion-name,
.search-site-suggestion-row:has(.search-site-suggestion.search-result-hit--active) .search-site-suggestion-name {
  color: #1f2937;
}

.search-site-suggestion-row:has(.search-site-suggestion.search-result-hit--active) {
  background: color-mix(in srgb, var(--site-search-result-accent, #ff9701) 14%, var(--mob-search-panel-bg, #fff));
}

.search-site-suggestion-favicon {
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  border-radius: 4px;
  object-fit: contain;
  background: none !important;
  /* Hide the alt text glyph while loading — see .entry-favicon-img above. */
  color: transparent;
  font-size: 0;
  overflow: hidden;
}

.search-site-suggestion-favicon--empty {
  display: inline-block;
  background: #eceff4;
}

.search-site-suggestion-body {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.search-site-suggestion-name {
  font-size: 14px;
  line-height: 1.3;
  font-weight: 500;
  color: #4e4e4e;
}

.search-site-suggestion-meta {
  font-size: 12px;
  line-height: 1.25;
  color: #888;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.dark .search-site-suggestion-row:hover,
body.dark .search-site-suggestion-row:has(.search-site-suggestion.search-result-hit--active) {
  background: color-mix(in srgb, var(--site-search-result-accent, #ff9701) 16%, var(--mob-search-panel-bg, #2a2b31));
}

body.dark .search-site-suggestion-row:hover .search-site-suggestion-name,
body.dark .search-site-suggestion-row:has(.search-site-suggestion.search-result-hit--active) .search-site-suggestion-name {
  color: var(--mob-search-chip-color, #f2f2f2);
}

body.dark .search-site-suggestion {
  border-bottom-color: #43444b;
  color: #e8e8ea;
}

body.dark .search-site-suggestion-name {
  color: #f2f2f2;
}

body.dark .search-site-suggestion-meta {
  color: #aaa;
}

body.dark .search-results-section-title {
  color: #aaa;
}

body.dark .search-results-section--categories {
  background: transparent;
}

body.dark .search-trigger {
  border-color: #4e4e4e;
  background: #17191d;
  color: #c5c6cc;
}

body.dark .search-trigger-shortcut {
  border-color: #4e4e4e;
  background: #2a2b31;
  color: #c5c6cc;
}

body.dark .search-panel-field {
  background: var(--mob-search-input-bg, #17191d);
  border-color: color-mix(in srgb, var(--site-brand-primary, #ff9701) 38%, #4e4e4e);
  box-shadow:
    0 1px 2px rgba(0, 0, 0, 0.2),
    0 8px 22px rgba(0, 0, 0, 0.28);
}

body.dark .search-panel-field:focus-within {
  border-color: var(--site-brand-primary, #ff9701);
  box-shadow:
    0 0 0 4px color-mix(in srgb, var(--site-brand-primary, #ff9701) 20%, transparent),
    0 8px 22px rgba(0, 0, 0, 0.32);
}

body.dark .search-panel-input {
  color: var(--mob-search-input-color, #f2f2f2);
}

body.dark .search-panel-input::placeholder {
  color: var(--mob-search-placeholder, #9ca3af);
}

body.dark .search-cat-card {
  border-color: var(--mob-search-panel-border, #43444b);
  background: var(--mob-search-tag-bg, #17191d);
  color: var(--mob-search-chip-color, #fff);
}

body.dark .search-cat-card:hover,
body.dark .search-cat-card.search-result-hit--active,
body.dark .search-category-grid .search-cat-card.search-category-hit:hover,
body.dark .search-category-grid .search-cat-card.search-category-hit.search-result-hit--active {
  background: var(--mob-search-section-bg, #17191d);
}

body.dark .search-category-grid .search-cat-card.search-category-hit.search-result-hit--active,
body.dark .search-cat-card.search-result-hit--active {
  border-color: var(--site-search-result-accent, #ff9701);
}

body.dark .search-category-rail .search-category-hit {
  border-color: var(--mob-search-tag-border, #4e4e4e);
  background: var(--mob-search-tag-bg, #17191d);
  color: var(--mob-search-chip-color, #fff);
}

body.dark .search-category-hit-icon {
  background: transparent;
}

body.dark .search-category-hit-initial {
  background: color-mix(in srgb, var(--site-search-result-accent, #ff9701) 18%, #2a2b31);
  color: var(--site-search-result-accent, #ff9701);
}

body.dark .search-category-rail .search-category-hit:hover {
  border-color: color-mix(in srgb, var(--site-search-result-accent, #ff9701) 40%, #4e4e4e);
  background: var(--mob-search-section-bg, #17191d);
}

body.dark .search-category-rail .search-category-hit.search-result-hit--active {
  border-color: var(--site-search-result-accent, #ff9701);
  background: color-mix(in srgb, var(--site-search-result-accent, #ff9701) 12%, var(--mob-search-tag-bg, #17191d));
  box-shadow: none;
}

body.dark .search-view .search-results-section {
  border-bottom-color: #43444b;
}

body.dark.search-is-loading.search-has-results .search-loading {
  background: rgba(42, 43, 49, 0.95);
}

@media (min-width: 992px) {
  .header {
    overflow: visible;
    position: relative;
    z-index: 200;
  }

  /*
   * Half-mascot overflows below the header (translateY). Keep the header behind
   * page content when search is closed. Content panels sit at z-index 10.
   * Floating chrome (promo / chat / drawer) uses z-index 110 — see below.
   */
  body:not(.site-search-open) .header {
    z-index: 5;
  }

  body:not(.site-search-open) .main {
    position: relative;
    z-index: 10;
  }

  body:not(.site-search-open) .categories-grid,
  body:not(.site-search-open) .main-wrapper,
  body:not(.site-search-open) .link-container.container {
    position: relative;
    z-index: 10;
  }

  body:not(.site-search-open) .header-logo-mascot-half {
    pointer-events: none;
    position: relative;
    z-index: 1;
    min-width: 48px;
    min-height: 48px;
  }

  body:not(.site-search-open) .header-logo-mascot-half-img {
    pointer-events: auto;
    min-width: 48px;
    min-height: 48px;
  }

  /*
   * Lang dropdown must sit above main panels (header is z-index 5 when search is closed).
   * Do NOT lift the whole .header or clip .header-desk — that stuffed the overflowing
   * half-mascot under the top bar. Break the header stacking context and elevate only
   * .top-bar so the dropdown clears both the mascot and category cards.
   */
  body:not(.site-search-open) .header:has(.lang-menu.lang-menu-open),
  body.lang-menu-active:not(.site-search-open) .header {
    z-index: auto;
  }

  body:not(.site-search-open) .header:has(.lang-menu.lang-menu-open) .top-bar,
  body.lang-menu-active:not(.site-search-open) .top-bar {
    position: relative;
    z-index: 120;
  }

  body:not(.site-search-open) .header:has(.lang-menu.lang-menu-open) .header-desk,
  body.lang-menu-active:not(.site-search-open) .header-desk {
    overflow: visible;
  }

  body:not(.site-search-open) .header:has(.lang-menu.lang-menu-open) .lang-menu-drop,
  body.lang-menu-active:not(.site-search-open) .top-bar .lang-menu-drop {
    z-index: 121;
  }

  /*
   * Floating site chrome — always above content panels (10), below search (119+).
   * Without this, opaque about/category cards can intercept clicks on the promo bubble.
   */
  body:not(.site-search-open) .extension-widget,
  body:not(.site-search-open) .extension-widget[data-site-extension-widget],
  body:not(.site-search-open) .chat-widget,
  body:not(.site-search-open) .chat-widget[data-site-chat-widget],
  body:not(.site-search-open) .drawer-opener-mobile,
  body:not(.site-search-open) .drawer-opener-desktop {
    z-index: 110 !important;
    pointer-events: auto !important;
  }

  body:not(.site-search-open) .extension-widget,
  body:not(.site-search-open) .extension-widget[data-site-extension-widget] {
    position: fixed !important;
  }

  body:not(.site-search-open) .chat-widget,
  body:not(.site-search-open) .chat-widget[data-site-chat-widget] {
    position: fixed !important;
  }

  body:not(.site-search-open) .extension-widget .extension-widget-circle-link,
  body:not(.site-search-open) .extension-widget .extension-widget-close,
  body:not(.site-search-open) .extension-widget .extension-widget-quote {
    pointer-events: auto !important;
  }

  .top-bar .top-bar-container {
    overflow: visible;
  }

  .top-bar .lang-menu {
    display: flex !important;
    align-items: center;
    height: auto;
    position: relative;
    flex-shrink: 0;
    margin-left: 12px;
    overflow: visible;
  }

  .top-bar .lang-menu-drop {
    top: 100% !important;
    margin-top: 10px !important;
    right: 0;
    z-index: 10;
    transform: none !important;
  }

  .search-backdrop {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 119;
    background: rgba(15, 23, 42, 0.28);
    backdrop-filter: blur(1px);
    animation: site-search-fade-in 0.18s ease;
  }

  body:not(.site-search-open) .search-backdrop {
    display: none !important;
  }

  body:not(.site-search-open) .search-view.search-view--open {
    display: none !important;
  }

  @keyframes site-search-fade-in {
    from {
      opacity: 0;
    }

    to {
      opacity: 1;
    }
  }

  .search-view.search-view--open {
    z-index: 121;
    position: absolute;
    top: calc(100% - 4px);
    left: 50%;
    right: auto;
    transform: translateX(-50%);
    width: min(720px, calc(100% - 32px));
    max-width: 720px;
    margin-top: 0;
    border-radius: 14px;
    overflow: hidden;
    box-shadow:
      0 24px 48px rgba(15, 23, 42, 0.18),
      0 0 0 1px rgba(186, 186, 186, 0.45);
    animation: site-search-drop-in 0.2s cubic-bezier(0.22, 1, 0.36, 1);
  }

  .search-panel-top {
    padding: 8px 14px 8px;
  }

  .search-panel-field {
    margin: 0 14px 14px;
    padding: 0 14px;
  }

  .search-trigger {
    padding: 0 38px 0 14px;
  }

  .search-trigger-shortcut {
    display: inline-flex;
  }

  body:not(.search-form--has-query) .search-view.search-view--open .search-tags {
    display: block;
  }

  @keyframes site-search-drop-in {
    from {
      opacity: 0;
      transform: translateX(-50%) translateY(-8px);
    }

    to {
      opacity: 1;
      transform: translateX(-50%) translateY(0);
    }
  }

  .search-view .search-panel-main {
    max-height: min(70vh, 640px);
    overflow-y: auto;
    overscroll-behavior: contain;
  }

  .search-view .search-site-results {
    display: block;
    padding: 0;
    max-height: none;
    overflow: visible;
  }

  .search-view .search-results-section-title {
    padding: 10px 14px 8px;
  }

  .search-view .search-category-rail {
    padding-inline: 12px;
  }

  body:not(.search-form--has-query) .search-view.search-view--open .search-tags {
    display: block;
  }

  body.search-form--has-query .search-view .search-tags {
    display: none;
  }

  body.dark .search-backdrop {
    background: rgba(0, 0, 0, 0.45);
  }
}

body.dark .search-view .search-tags-title {
  color: #fff;
  border-color: #4e4e4e;
}

.search-view .url_link_image {
  position: relative;
  overflow: hidden;
  aspect-ratio: var(--site-thumb-aspect);
  height: auto;
  border-radius: 0;
  background: #000 !important;
}

.search-view .url_link_image .site-thumb-placeholder--small {
  width: 100%;
  min-height: 0;
  height: 100%;
  border-radius: 0;
}

.drawer-opener-desktop .drawer-opener-icon,
.drawer-opener-mobile .drawer-opener-icon {
  background-image: var(--site-asset-mascot);
}

.header .quotes-icon-emoji {
  background-image: none !important;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 30px;
  font-size: 1.35rem;
  line-height: 1;
  transform: translateY(4px);
}

.quotes-inner {
  box-shadow: 0 4px 4px color-mix(in srgb, var(--site-quotes-border-end, #ff9701) 18%, transparent);
}

/*
 * Vendor sets html { text-rendering: optimizespeed; -webkit-font-smoothing: antialiased }.
 * At 12–14px Roboto that eats the tittle on lowercase “i” (looks like a Turkish ı).
 */
.quotes-title,
.quotes-text,
.quotes-link {
  overflow: visible;
  line-height: 1.45;
  text-rendering: auto;
  -webkit-font-smoothing: auto;
  -moz-osx-font-smoothing: auto;
}

.quotes-title {
  line-height: 1.4;
  padding-top: 1px;
}

/*
 * Touch targets (PageSpeed / WCAG): the vendor quotes arrow is only 16×14px and
 * sits flush against the header mascot link. Expand the hit area to 44×44 while
 * keeping the visible chevron the same size; keep the mascot <a> itself clickable
 * at ≥48×48 so spacing/size audits pass without changing the layout.
 */
button.quotes-arrow.quotes-drawer-opener {
  box-sizing: border-box;
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
  padding: 0;
  margin: 0;
  border: 0;
  clip-path: none !important;
  background: transparent !important;
  background-image: none !important;
  top: 50%;
  left: 100%;
  /* 44px hit box: 28px over quotes, 16px past the edge (where the chevron sits) */
  transform: translate(-28px, -50%);
  z-index: 3;
  display: block;
  cursor: pointer;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

button.quotes-arrow.quotes-drawer-opener::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 0;
  left: auto;
  width: 16px;
  height: 14px;
  transform: translateY(-50%);
  clip-path: polygon(0 0, 0 100%, 100% 50%);
  background: linear-gradient(
    var(--site-quotes-border-start, #fde049) 0%,
    var(--site-header-saved-accent, var(--site-quotes-border-end, #ff9701)) 100%
  );
  pointer-events: none;
}

button.quotes-arrow.quotes-drawer-opener::before {
  content: "";
  position: absolute;
  top: 50%;
  right: 7px;
  left: auto;
  width: 9px;
  height: 8px;
  transform: translateY(-50%);
  clip-path: polygon(0 0, 0 100%, 100% 50%);
  background-color: var(--site-quotes-bg, var(--_bg-clr, #f9feff));
  pointer-events: none;
  z-index: 1;
}

@media (min-width: 992px) {
  .chat-widget {
    background-color: var(--site-chat-widget-desktop-bg, var(--site-chat-widget-bg, #feb93e)) !important;
    background-image:
      linear-gradient(
        180deg,
        color-mix(in srgb, var(--site-chat-widget-desktop-bg, #feb93e) 96%, #fff) 0%,
        color-mix(in srgb, var(--site-chat-widget-desktop-bg, #feb93e) 88%, #000) 100%
      ) !important;
    border: 1.5px solid color-mix(in srgb, var(--site-chat-widget-desktop-bg, #feb93e) 72%, #fff);
    border-bottom: 0;
  }

  .chat-widget:not(.chat-widget--custom-mascot) {
    overflow: visible;
  }

  .chat-widget:not(.chat-widget--custom-mascot) .chat-widget-mascot {
    background-image: var(--site-asset-mascot);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center bottom;
    left: -8px;
    transition: width 0.18s ease, height 0.18s ease, top 0.18s ease, left 0.18s ease;
  }

  .chat-widget:not(.chat-widget--custom-mascot):hover .chat-widget-mascot {
    background-image: var(--site-asset-mascot);
    width: 104px !important;
    height: 134px !important;
    top: -60px !important;
    left: -18px !important;
  }

  .chat-widget--custom-mascot .chat-widget-mascot {
    left: -8px;
    transition: width 0.18s ease, height 0.18s ease, top 0.18s ease, left 0.18s ease;
  }

  .chat-widget--custom-mascot:hover .chat-widget-mascot {
    width: 104px !important;
    height: 134px !important;
    top: -60px !important;
    left: -18px !important;
  }
}

.drawer-opener-desktop .drawer-opener-content::before,
.drawer-opener-desktop .drawer-opener-content::after,
.drawer-opener-mobile .drawer-opener-content::before,
.drawer-opener-mobile .drawer-opener-content::after {
  content: none;
  display: none;
}

.drawer-opener-text::before {
  content: none;
}

.drawer {
  pointer-events: none;
}

.drawer .drawer-overlay {
  pointer-events: none;
}

.drawer:not(.drawer-open) .drawer-opener {
  pointer-events: auto;
}

.drawer.drawer-open {
  pointer-events: none;
}

.drawer.drawer-open .drawer-overlay {
  display: block !important;
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  z-index: 114;
}

.drawer.drawer-open .drawer-content {
  transform: translateY(0);
  display: flex;
  flex-direction: column;
  pointer-events: auto;
  z-index: 115;
}

.drawer.drawer-open .drawer-opener {
  pointer-events: auto;
}

body.body-drawer-open {
  overflow: hidden;
}

@media (min-width: 992px) {
  body.body-drawer-open {
    overflow: hidden;
  }
}

#drawer-app {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background-color: var(--site-drawer-panel-bg, #fff);
  border-radius: 10px 10px 0 0;
  overflow: hidden;
}

body.dark #drawer-app {
  background-color: var(--site-drawer-panel-bg, #2a2b31);
}

#drawer-app .drawer-panel-inner {
  flex: 1 1 auto;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

#drawer-app .drawer-panel-inner a {
  color: var(--site-drawer-accent, #ff9701);
  text-decoration: underline;
}

#drawer-app .site-drawer-shell a {
  color: inherit;
  text-decoration: none;
}

/* Only one VIP/extension promo — hide vendor/stub duplicates, never the site-managed bubble.
   A hidden vendor stub is often appended first; pinFloatingChrome then moves our widget after it.
   The old ".extension-widget ~ .extension-widget" rule hid ours in that case. */
.extension-widget[data-vendor-extension-stub],
.extension-widget ~ .extension-widget:not([data-site-extension-widget]) {
  display: none !important;
}

/* Dismissed via cookie — class is set in <head> before paint so there is no post-load flash. */
html.extension-widget-dismissed .extension-widget[data-site-extension-widget] {
  display: none !important;
}

/*
 * Vendor only pins top-right from 1440px; 992–1439 stays bottom-left.
 * Keep the site bubble top-right on typical laptop widths too.
 */
@media (min-width: 992px) {
  .extension-widget[data-site-extension-widget] {
    inset: 60px 20px auto auto !important;
    top: 60px !important;
    right: 20px !important;
    bottom: auto !important;
    left: auto !important;
  }
}

.extension-widget-close {
  position: absolute;
  top: -9px !important;
  right: -9px !important;
  z-index: 3;
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 28px !important;
  height: 28px !important;
  padding: 0;
  border: 2.5px solid #fff !important;
  border-radius: 50%;
  background-color: #e8352f !important;
  color: #fff !important;
  box-shadow: 0 3px 10px rgba(20, 21, 30, 0.28);
  cursor: pointer;
  pointer-events: auto;
  transition: background-color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}

.extension-widget-close:before {
  width: 12px !important;
  height: 12px !important;
  background-color: #fff !important;
}

.extension-widget-close:hover {
  background-color: #cf2a24 !important;
  transform: scale(1.08);
  box-shadow: 0 4px 12px rgba(20, 21, 30, 0.34);
}

.extension-widget-close:focus-visible {
  outline: 2px solid #e8352f;
  outline-offset: 2px;
}

.extension-widget-quote {
  min-height: 58px !important;
  max-width: 260px !important;
  padding: 15px 34px 15px 16px !important;
  overflow: visible;
  align-items: center !important;
  justify-content: center !important;
}

.extension-widget-quote-text {
  display: flex;
  flex: 1 1 auto;
  align-items: center;
  justify-content: center;
  min-width: 0;
  width: 100%;
  margin: 0;
  text-align: center;
  line-height: 1.25;
}

.extension-widget-quote-text-string {
  display: inline-block;
  font-size: 16.5px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  letter-spacing: 0.01em;
  text-decoration: none !important;
  text-underline-offset: 0;
}

.extension-widget-quote.is-typing .extension-widget-quote-text-string:after,
.extension-widget-quote.is-typed .extension-widget-quote-text-string:after {
  content: none !important;
  display: none !important;
}

.extension-widget-quote-word {
  display: inline-block;
  opacity: 0;
  filter: blur(5px);
  transform: translateY(7px);
  animation: extension-quote-word-in 0.48s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

@keyframes extension-quote-word-in {
  to {
    opacity: 1;
    filter: blur(0);
    transform: translateY(0);
  }
}

body.dark .extension-widget-close {
  border-color: #fff !important;
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.5);
}

@media (prefers-reduced-motion: reduce) {
  .extension-widget-quote-word {
    opacity: 1;
    filter: none;
    transform: none;
    animation: none;
  }
}

.extension-widget-circle-link {
  display: block;
  color: inherit;
  text-decoration: none;
}

div.extension-widget {
  display: flex;
  position: fixed;
  z-index: 110;
  pointer-events: auto;
}

/* Mobile floating chrome (promo bubble is hidden; chat / drawer stay tappable) */
@media (max-width: 991.98px) {
  body:not(.site-search-open) .chat-widget,
  body:not(.site-search-open) .chat-widget[data-site-chat-widget],
  body:not(.site-search-open) .drawer-opener-mobile {
    z-index: 110 !important;
    pointer-events: auto !important;
  }
}

/* Sub-page placeholders and layout helpers */
.site-thumb-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 140px;
  width: 100%;
  border-radius: 4px;
  color: #fff;
  text-align: center;
  padding: 12px;
}

.site-thumb-placeholder--small {
  min-height: 100px;
}

.site-thumb-placeholder--hero {
  min-height: 260px;
}

.site-thumb-placeholder-name {
  font-size: 15px;
  font-weight: 500;
  line-height: 1.3;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
}

.categorypage .url_link_image > .link img.lazyload[data-src] {
  opacity: 0.55;
  transition: opacity 0.2s;
}

.categorypage .url_link_image > .link img.lazyloaded {
  opacity: 1;
}

.categorypage .link-content {
  flex: 1;
  min-width: 0;
}

.top-menu-holder-open {
  display: block !important;
}

img.lazyload[data-src] {
  min-height: 1px;
}

.singlepage .link-thumbnail .big-thumb-holder .site-thumb-placeholder--hero,
.singlepage .link-thumbnail .example-thumb-img.site-thumb-placeholder {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Homepage footer banner — sits between grid and footer block, half overlaps each */
.homepage {
  --footer-banner-gap: 80px;
  --footer-banner-overlap: 120px;
}

.homepage .main {
  overflow: visible;
  padding-bottom: var(--footer-banner-gap);
}

.homepage .homepage-footer-banner-bridge {
  position: relative;
  /* Above copyright block (10); below fixed mobile header (40). */
  z-index: 15;
  display: flex;
  justify-content: center;
  margin: 0 0 calc(-1 * var(--footer-banner-overlap));
  overflow: visible;
  pointer-events: none;
}

.homepage .categories-grid {
  padding-bottom: 32px;
}

.homepage .copyright-message-wrap {
  position: relative;
  z-index: 10;
  overflow: visible;
}

.homepage .copyright-message {
  position: relative;
  margin-top: 0 !important;
  overflow: hidden;
  isolation: isolate;
}

.homepage .copyright-message.copyright-message--pattern::before {
  content: "";
  position: absolute;
  inset: -100%;
  z-index: 0;
  pointer-events: none;
  transform: rotate(165deg);
  transform-origin: center;
  background-color: transparent;
  opacity: var(--copyright-pattern-opacity, 0.01);
  background-image:
    radial-gradient(circle at 50% 100%, transparent 20%, var(--copyright-pattern-color, #ffffff) 21%, var(--copyright-pattern-color, #ffffff) 34%, transparent 35%, transparent),
    radial-gradient(circle at 50% 0%, transparent 20%, var(--copyright-pattern-color, #ffffff) 21%, var(--copyright-pattern-color, #ffffff) 34%, transparent 35%, transparent);
  background-position: 0 0, -32px 0;
  background-size: 64px 48px;
}

.homepage .copyright-message > * {
  position: relative;
  z-index: 1;
}

body.admin-layout-mode .admin-copyright-wrap {
  position: relative;
  z-index: 120;
  margin-bottom: 40px;
  overflow: visible;
}

body.admin-layout-mode .homepage-footer-banner-bridge {
  z-index: 125;
}

body.admin-layout-mode .admin-copyright-wrap + .footer {
  position: relative;
  margin-top: 4px;
}

body.admin-layout-mode .admin-copyright-wrap + .footer::before {
  content: "";
  display: block;
  height: 3px;
  margin: 0 auto 12px;
  max-width: min(var(--container-width, 1158px), calc(100% - 24px));
  border-radius: 2px;
  background: linear-gradient(90deg, transparent, rgba(255, 151, 1, 0.45) 20%, rgba(255, 151, 1, 0.45) 80%, transparent);
}

body.admin-layout-mode .admin-copyright-wrap .copyright-message {
  outline: 2px dashed rgba(255, 151, 1, 0.55);
  outline-offset: 4px;
  display: flex;
  flex-direction: column;
}

body.admin-layout-mode .admin-copyright-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 12px 16px;
  border-radius: 0;
  background: rgba(15, 23, 39, 0.92);
  border: none;
  border-top: 2px solid rgba(255, 186, 1, 0.55);
  color: #e5e7eb;
  font-size: 13px;
  position: relative;
  z-index: 2;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

body.admin-layout-mode .admin-copyright-bar-label {
  font-weight: 700;
  color: #ffba01;
}

body.admin-layout-mode .admin-copyright-bar-hint {
  color: #9ca3af;
}

body.admin-layout-mode .admin-copyright-edit-btn,
body.admin-layout-mode .admin-copyright-save {
  border: none;
  border-radius: 6px;
  padding: 6px 12px;
  background: #ff9701;
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
}

body.admin-layout-mode .admin-copyright-edit-btn:hover,
body.admin-layout-mode .admin-copyright-save:not(:disabled):hover {
  background: #e88700;
}

body.admin-layout-mode .admin-copyright-save:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

body.admin-layout-mode .admin-copyright-bar-actions {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-left: auto;
}

body.admin-layout-mode .admin-copyright-save-status {
  font-size: 12px;
  color: #9ca3af;
}

body.admin-layout-mode .admin-copyright-save-status.is-dirty {
  color: #fbbf24;
}

body.admin-layout-mode .admin-copyright-save-status.is-saving {
  color: #93c5fd;
}

body.admin-layout-mode .admin-copyright-save-status.is-saved {
  color: #86efac;
}

body.admin-layout-mode .admin-copyright-save-status.is-error {
  color: #fca5a5;
}

body.admin-layout-mode .admin-copyright-admin-link {
  color: #93c5fd;
  font-size: 12px;
  text-decoration: underline;
}

body.admin-layout-mode .admin-copyright-divider-upload {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 8px;
}

body.admin-layout-mode .admin-copyright-divider-btn,
body.admin-layout-mode .admin-copyright-divider-remove {
  border: 1px solid rgba(148, 163, 184, 0.45);
  border-radius: 6px;
  padding: 5px 10px;
  background: rgba(30, 41, 59, 0.95);
  color: #e5e7eb;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
}

body.admin-layout-mode .admin-copyright-divider-btn:hover,
body.admin-layout-mode .admin-copyright-divider-remove:hover {
  border-color: rgba(255, 151, 1, 0.65);
  color: #ffba01;
}

body.admin-layout-mode .admin-copyright-divider-remove[hidden] {
  display: none;
}

body.admin-layout-mode .admin-copyright-divider-status {
  font-size: 12px;
  color: #9ca3af;
}

body.admin-layout-mode .admin-copyright-divider-status.is-saving {
  color: #93c5fd;
}

body.admin-layout-mode .admin-copyright-divider-status.is-saved {
  color: #86efac;
}

body.admin-layout-mode .admin-copyright-divider-status.is-error {
  color: #fca5a5;
}

body.admin-layout-mode .admin-copyright-banner-scale-field {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  padding: 4px 8px;
  border-radius: 6px;
  background: rgba(15, 23, 42, 0.65);
  border: 1px solid rgba(255, 255, 255, 0.08);
}

body.admin-layout-mode .admin-copyright-banner-scale-label {
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
  font-size: 12px;
  color: #e5e7eb;
  white-space: nowrap;
}

body.admin-layout-mode .admin-copyright-banner-scale-hint {
  font-size: 11px;
  color: #9ca3af;
}

body.admin-layout-mode .admin-copyright-banner-scale-field input[type="range"] {
  width: min(120px, 22vw);
  margin: 0;
  accent-color: #ff9701;
}

body.admin-layout-mode .admin-copyright-banner-scale-field output {
  min-width: 3.2em;
  font-size: 12px;
  font-variant-numeric: tabular-nums;
  color: #fcd34d;
  text-align: right;
}

body.admin-layout-mode .admin-footer-edit-panel.admin-copyright-edit-panel {
  z-index: 100002;
}

/*
 * Admin layout stacking contract (body-mounted UI vs edit chrome):
 *   100000  edit backdrops
 *   100001+ edit panels
 *   100040  popup / welcome / buy-script previews
 *   100050  TinyMCE aux (dialogs/menus) + layout bar while a preview is open
 *   100060  drag floaters / drop indicators
 * TinyMCE defaults (~1300) and unsorted panels at 1300 sit under edit chrome and look "broken".
 */
body.admin-layout-mode .tox.tox-tinymce-aux,
body.admin-copyright-editing .tox.tox-tinymce-aux,
body.admin-footer-editing .tox.tox-tinymce-aux,
body.admin-footer-colors-editing .tox.tox-tinymce-aux,
body.admin-social-editing .tox.tox-tinymce-aux,
body.admin-site-background-editing .tox.tox-tinymce-aux,
body.admin-bulk-category-colors-editing .tox.tox-tinymce-aux {
  z-index: 100050 !important;
}

body.admin-layout-mode .tox.tox-tinymce-aux .tox-dialog-wrap,
body.admin-layout-mode .tox.tox-tinymce-aux .tox-dialog,
body.admin-layout-mode .tox.tox-tinymce-aux .tox-menu,
body.admin-layout-mode .tox.tox-tinymce-aux .tox-collection,
body.admin-layout-mode .tox.tox-tinymce-aux .tox-pop,
body.admin-layout-mode .tox.tox-tinymce-aux .tox-notifications-container,
body.admin-copyright-editing .tox.tox-tinymce-aux .tox-dialog-wrap,
body.admin-copyright-editing .tox.tox-tinymce-aux .tox-dialog,
body.admin-copyright-editing .tox.tox-tinymce-aux .tox-menu,
body.admin-footer-editing .tox.tox-tinymce-aux .tox-dialog-wrap {
  z-index: 100051 !important;
}

/* Keep the content editor scrollable without clipping TinyMCE's own chrome. */
body.admin-layout-mode .admin-copyright-edit-panel.admin-footer-edit-panel {
  overflow: visible;
}

body.admin-layout-mode .admin-copyright-edit-lead {
  margin: 0 0 12px;
  font-size: 13px;
  line-height: 1.5;
  color: #d1d5db;
}

body.admin-layout-mode .admin-copyright-gradient-fields {
  border: 0;
  margin: 0 0 14px;
  padding: 0;
}

body.admin-layout-mode .admin-copyright-gradient-fields legend {
  font-size: 13px;
  font-weight: 600;
  color: #e5e7eb;
  margin-bottom: 8px;
}

.admin-copyright-gradient-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 12px;
}

.admin-copyright-pattern-controls {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 12px;
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid rgba(0, 0, 0, 0.08);
}

.admin-copyright-pattern-controls .admin-footer-colors-single {
  grid-column: 1 / -1;
}

.admin-footer-edit-check {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.admin-footer-pattern-hint {
  grid-column: 1 / -1;
  margin: 0;
  font-size: 12px;
  color: #9ca3af;
  line-height: 1.4;
}

.admin-copyright-gradient-grid--settings {
  max-width: 520px;
  margin-bottom: 8px;
}

.admin-copyright-gradient-grid input[type="color"] {
  width: 100%;
  height: 40px;
  padding: 2px;
  border: 1px solid #374151;
  border-radius: 6px;
  background: #0f172a;
  cursor: pointer;
}

.admin-copyright-gradient-grid input[type="number"] {
  width: 100%;
  padding: 8px 10px;
  border-radius: 6px;
  border: 1px solid #374151;
  background: #0f172a;
  color: #fff;
}

.admin-copyright-gradient-preview-label {
  margin: 8px 0 0;
  font-size: 12px;
  color: #9ca3af;
}

body.admin-layout-mode .admin-copyright-edit-panel .admin-footer-edit-panel-body {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-height: 0;
  overflow: auto;
  max-height: min(calc(90vh - 64px), 760px);
}

body.admin-layout-mode .admin-copyright-editor-field {
  width: 100%;
  min-width: 0;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-height: 420px;
}

body.admin-layout-mode .admin-copyright-editor-field label {
  font-size: 13px;
  font-weight: 600;
  color: #e5e7eb;
}

body.admin-layout-mode .admin-copyright-editor-field .form-help {
  margin: 0;
  font-size: 12px;
  line-height: 1.45;
  color: #9ca3af;
}

body.admin-layout-mode .admin-copyright-editor-field .tox-tinymce,
body.admin-layout-mode .admin-copyright-editor-field .tox-editor-container,
body.admin-layout-mode .admin-copyright-editor-field .tox-edit-area {
  width: 100% !important;
  min-height: 320px;
}

body.admin-layout-mode .admin-copyright-editor-field .tox-tinymce {
  border-radius: 8px;
  border-color: #374151 !important;
}

body.admin-layout-mode .admin-copyright-editor-field .tox .tox-toolbar-overlord,
body.admin-layout-mode .admin-copyright-editor-field .tox .tox-toolbar__primary {
  flex-wrap: wrap !important;
}

body.admin-layout-mode .admin-copyright-editor-field .tox .tox-toolbar__overflow,
body.admin-layout-mode .admin-copyright-editor-field .tox .tox-toolbar__group {
  flex-wrap: wrap !important;
}

body.admin-copyright-editing .scrollspy-btn-fixed {
  opacity: 0 !important;
  pointer-events: none !important;
}

body.admin-footer-colors-editing .scrollspy-btn-fixed {
  opacity: 0 !important;
  pointer-events: none !important;
}

body.admin-site-background-editing .scrollspy-btn-fixed {
  opacity: 0 !important;
  pointer-events: none !important;
}

@media (min-width: 992px) {
  body.admin-site-background-editing:before,
  body.admin-site-background-editing.dark:before {
    z-index: 0 !important;
  }

  body.admin-site-background-editing .header,
  body.admin-site-background-editing .main {
    position: relative;
    z-index: 1;
  }

  body.admin-site-background-editing .admin-footer-edit-backdrop {
    background: rgba(15, 23, 42, 0.35);
  }
}

body.admin-layout-mode .admin-top-bar-wrap {
  position: relative;
}

body.admin-layout-mode .admin-top-bar-tools {
  position: absolute;
  top: 6px;
  right: 12px;
  z-index: 5;
}

body.admin-layout-mode .admin-site-background-panel {
  width: min(560px, calc(100vw - 32px));
  max-height: min(92vh, 880px);
  z-index: 100001;
}

body.admin-layout-mode .admin-site-background-panel .admin-footer-edit-panel-body {
  gap: 14px;
}

body.admin-layout-mode .admin-site-background-lead {
  margin: 0;
  font-size: 13px;
  line-height: 1.5;
  color: #d1d5db;
}

body.admin-layout-mode .admin-site-background-theme-toggle {
  display: flex;
  gap: 8px;
}

body.admin-layout-mode .admin-site-background-theme-btn {
  flex: 1;
  border: 1px solid #374151;
  border-radius: 8px;
  padding: 8px 10px;
  background: #0f172a;
  color: #e5e7eb;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
}

body.admin-layout-mode .admin-site-background-theme-btn.is-active {
  border-color: #ff9701;
  background: rgba(255, 151, 1, 0.15);
  color: #ffba01;
}

body.admin-layout-mode .admin-site-background-stack {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

body.admin-layout-mode .admin-site-background-mode {
  margin: 0;
  padding: 14px 16px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 10px;
  background: rgba(15, 23, 42, 0.65);
  min-width: 0;
}

body.admin-layout-mode .admin-site-background-mode legend {
  padding: 0;
  margin: 0 0 12px;
  font-size: 14px;
  font-weight: 700;
  color: #ffba01;
}

body.admin-layout-mode .admin-site-background-mode-inner {
  display: grid;
  grid-template-columns: minmax(120px, 148px) 1fr;
  gap: 12px 16px;
  align-items: start;
}

body.admin-layout-mode .admin-site-background-preview-col {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}

body.admin-layout-mode .admin-site-background-controls {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 0;
}

body.admin-layout-mode .admin-site-background-preview {
  overflow: hidden;
  border-radius: 8px;
  border: 1px solid #374151;
  background: #0f172a;
  margin: 0;
}

body.admin-layout-mode .admin-site-background-preview img {
  display: block;
  width: 100%;
  height: auto;
  max-height: 132px;
  object-fit: contain;
  image-rendering: pixelated;
}

body.admin-layout-mode .admin-site-background-meta {
  margin: 0;
  font-size: 11px;
  line-height: 1.45;
  color: #9ca3af;
}

body.admin-layout-mode .admin-site-background-upload {
  margin: 0;
}

body.admin-layout-mode .admin-site-background-hint {
  margin: 0;
  font-size: 12px;
  line-height: 1.45;
  color: #9ca3af;
}

body.admin-layout-mode .admin-site-background-remove {
  align-self: flex-start;
  border: none;
  border-radius: 6px;
  padding: 6px 10px;
  background: rgba(239, 68, 68, 0.15);
  color: #fca5a5;
  font-size: 11px;
  font-weight: 600;
  cursor: pointer;
}

body.admin-layout-mode .admin-site-background-remove:hover {
  background: rgba(239, 68, 68, 0.25);
}

body.admin-layout-mode .admin-site-background-admin-link {
  display: inline-block;
  margin-top: 4px;
  font-size: 12px;
  color: #ffba01;
}

@media (max-width: 480px) {
  body.admin-layout-mode .admin-site-background-mode-inner {
    grid-template-columns: 1fr;
  }

  body.admin-layout-mode .admin-site-background-preview img {
    max-height: 100px;
  }
}

/* Bulk category colors — left docked overlay in layout editor */
body.admin-layout-mode .admin-bulk-category-colors-panel {
  top: 0;
  left: 0;
  right: auto;
  bottom: 0;
  transform: none;
  width: min(420px, calc(100vw - 20px));
  max-height: 100vh;
  border-radius: 0 14px 14px 0;
  border-left: none;
  z-index: 100001;
}

body.admin-layout-mode .admin-bulk-category-colors-panel .admin-footer-edit-panel-body {
  gap: 14px;
}

body.admin-layout-mode .admin-bulk-colors-warning {
  padding: 12px 14px;
  border-radius: 10px;
  border: 1px solid rgba(239, 68, 68, 0.45);
  background: rgba(127, 29, 29, 0.35);
  color: #fecaca;
  font-size: 12px;
  line-height: 1.5;
}

body.admin-layout-mode .admin-bulk-colors-warning strong {
  display: block;
  margin-bottom: 6px;
  color: #fca5a5;
  font-size: 13px;
}

body.admin-layout-mode .admin-bulk-colors-warning p {
  margin: 0;
}

body.admin-layout-mode .admin-bulk-colors-preview {
  padding: 12px;
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(15, 23, 42, 0.65);
}

body.admin-layout-mode .admin-bulk-colors-preview-label {
  display: block;
  margin-bottom: 8px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #9ca3af;
}

body.admin-layout-mode .admin-bulk-colors-preview-card {
  display: grid;
  gap: 10px;
}

body.admin-layout-mode .admin-bulk-colors-preview-title {
  display: grid;
  gap: 6px;
}

body.admin-layout-mode .admin-bulk-colors-preview-name {
  font-size: 15px;
  font-weight: 700;
  color: #f9fafb;
}

body.admin-layout-mode .admin-bulk-colors-preview-line {
  display: block;
  width: 72px;
  height: 3px;
  border-radius: 999px;
  background: rgb(255, 186, 1);
}

body.admin-layout-mode .admin-bulk-colors-preview-button {
  display: inline-flex;
  align-items: center;
  justify-self: start;
  padding: 7px 12px;
  border-radius: 6px;
  background: rgb(255, 151, 1);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.03em;
}

body.admin-layout-mode .admin-bulk-colors-fields {
  margin: 0;
  padding: 0;
  border: none;
}

body.admin-layout-mode .admin-bulk-colors-fields legend {
  padding: 0;
  margin: 0 0 10px;
  font-size: 13px;
  font-weight: 700;
  color: #ffba01;
}

body.admin-layout-mode .admin-bulk-colors-picker-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

body.admin-layout-mode .admin-bulk-colors-picker-grid input[type="color"] {
  width: 100%;
  height: 40px;
  padding: 2px;
  border: 1px solid #374151;
  border-radius: 8px;
  background: #111827;
  cursor: pointer;
}

/* Tools row: sync checkbox + 🎲 random side-by-side */
body.admin-layout-mode .admin-bulk-colors-picker-tools {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-top: 10px;
}

body.admin-layout-mode .admin-bulk-colors-sync,
body.admin-layout-mode .admin-bulk-colors-confirm-check {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 12px;
  line-height: 1.45;
  color: #d1d5db;
  cursor: pointer;
}

/* Varied strip — colored dots shown when varied mode is active */
body.admin-layout-mode .admin-bulk-colors-varied-strip {
  margin-top: 10px;
  padding: 10px 12px;
  border-radius: 8px;
  background: rgba(255, 151, 1, 0.08);
  border: 1px dashed rgba(255, 151, 1, 0.35);
}

body.admin-layout-mode .admin-bulk-colors-varied-strip-label {
  display: block;
  margin-bottom: 8px;
  font-size: 11px;
  color: #9ca3af;
}

body.admin-layout-mode .admin-bulk-colors-varied-dots {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

body.admin-layout-mode .admin-bulk-colors-varied-dot {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  border: 2px solid rgba(0, 0, 0, 0.25);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
  flex-shrink: 0;
}

body.admin-layout-mode .admin-bulk-colors-varied-more {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #374151;
  color: #9ca3af;
  font-size: 10px;
  font-weight: 700;
}

/* Varied mode toggle (iOS-style switch) */
body.admin-layout-mode .admin-bulk-colors-mode-toggle {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
  cursor: pointer;
  user-select: none;
}

body.admin-layout-mode .admin-bulk-colors-mode-toggle input {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}

body.admin-layout-mode .admin-bulk-colors-mode-track {
  position: relative;
  width: 36px;
  height: 20px;
  flex-shrink: 0;
  border-radius: 10px;
  background: #374151;
  border: 1px solid #4b5563;
  transition: background 0.2s ease, border-color 0.2s ease;
}

body.admin-layout-mode .admin-bulk-colors-mode-track::after {
  content: '';
  position: absolute;
  top: 2px;
  left: 2px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #6b7280;
  transition: transform 0.2s ease, background 0.2s ease;
}

body.admin-layout-mode .admin-bulk-colors-mode-toggle input:checked + .admin-bulk-colors-mode-track {
  background: rgba(255, 151, 1, 0.25);
  border-color: rgba(255, 151, 1, 0.6);
}

body.admin-layout-mode .admin-bulk-colors-mode-toggle input:checked + .admin-bulk-colors-mode-track::after {
  transform: translateX(16px);
  background: #ff9701;
}

body.admin-layout-mode .admin-bulk-colors-mode-label {
  font-size: 12px;
  line-height: 1.4;
  color: #d1d5db;
}

body.admin-layout-mode .admin-bulk-colors-schemes-lead {
  margin: 0 0 10px;
  font-size: 12px;
  line-height: 1.45;
  color: #9ca3af;
}

body.admin-layout-mode .admin-bulk-colors-scheme-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

body.admin-layout-mode .admin-bulk-colors-scheme-card {
  display: grid;
  gap: 6px;
  padding: 10px;
  border: 1px solid #374151;
  border-radius: 10px;
  background: #0f172a;
  color: #e5e7eb;
  text-align: left;
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease, transform 0.15s ease;
}

body.admin-layout-mode .admin-bulk-colors-scheme-card:hover {
  border-color: rgba(255, 151, 1, 0.55);
  transform: translateY(-1px);
}

body.admin-layout-mode .admin-bulk-colors-scheme-card.is-active {
  border-color: #ff9701;
  background: rgba(255, 151, 1, 0.12);
}

body.admin-layout-mode .admin-bulk-colors-scheme-preview {
  display: flex;
  gap: 4px;
}

body.admin-layout-mode .admin-bulk-colors-scheme-swatch {
  flex: 1;
  height: 14px;
  border-radius: 999px;
}

body.admin-layout-mode .admin-bulk-colors-scheme-name {
  font-size: 12px;
  font-weight: 600;
}

body.admin-layout-mode .admin-bulk-colors-random {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
  border: 1px dashed rgba(255, 186, 1, 0.55);
  border-radius: 8px;
  padding: 6px 11px;
  background: rgba(255, 151, 1, 0.08);
  color: #ffba01;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
  transition: background 0.15s ease;
}

body.admin-layout-mode .admin-bulk-colors-random:hover {
  background: rgba(255, 151, 1, 0.18);
}

body.admin-layout-mode .admin-bulk-colors-confirm {
  padding: 14px;
  border-radius: 10px;
  border: 1px solid rgba(239, 68, 68, 0.55);
  background: rgba(69, 10, 10, 0.45);
}

body.admin-layout-mode .admin-bulk-colors-confirm-text {
  margin: 0 0 12px;
  font-size: 13px;
  line-height: 1.5;
  color: #fecaca;
}

body.admin-layout-mode .admin-bulk-colors-confirm-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}

body.admin-layout-mode .admin-bulk-colors-apply {
  border: none;
  border-radius: 8px;
  padding: 9px 14px;
  background: linear-gradient(135deg, #ff9701, #f59e0b);
  color: #111827;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}

body.admin-layout-mode .admin-bulk-colors-apply:hover {
  filter: brightness(1.05);
}

body.admin-layout-mode .admin-bulk-colors-confirm-yes {
  border: none;
  border-radius: 8px;
  padding: 9px 14px;
  background: #dc2626;
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}

body.admin-layout-mode .admin-bulk-colors-confirm-yes:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

body.admin-layout-mode .admin-bulk-colors-confirm-yes:not(:disabled):hover {
  background: #b91c1c;
}

body.admin-layout-mode .admin-bulk-colors-confirm-back {
  border: 1px solid #4b5563;
  border-radius: 8px;
  padding: 9px 14px;
  background: transparent;
  color: #e5e7eb;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
}

body.admin-bulk-category-colors-editing .drawer-opener,
body.admin-bulk-category-colors-editing .extension-widget,
body.admin-bulk-category-colors-editing .chat-widget,
body.admin-bulk-category-colors-editing .scrollspy-btn-fixed {
  opacity: 0 !important;
  pointer-events: none !important;
  visibility: hidden !important;
}

body.admin-layout-mode .admin-footer-colors-brush {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  border: none;
  border-radius: 5px;
  padding: 4px 8px;
  background: rgba(255, 255, 255, 0.14);
  color: #fff;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
  cursor: pointer;
}

body.admin-layout-mode .admin-footer-colors-brush:hover {
  background: rgba(255, 255, 255, 0.24);
}

body.admin-layout-mode .admin-footer-colors-brush-icon {
  flex-shrink: 0;
}

body.admin-layout-mode .admin-footer-colors-toolbar {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 25;
}

body.admin-layout-mode .admin-footer-colors-panel {
  z-index: 100001;
}

body.admin-layout-mode .admin-footer-colors-fields {
  margin: 0 0 16px;
  padding: 0;
  border: none;
}

body.admin-layout-mode .admin-footer-colors-fields legend {
  padding: 0;
  margin: 0 0 10px;
  font-size: 13px;
  font-weight: 700;
  color: #ffba01;
}

body.admin-layout-mode .admin-footer-colors-single {
  max-width: 220px;
}

body.admin-layout-mode .admin-footer-colors-single input[type="color"] {
  width: 100%;
  height: 40px;
  padding: 2px;
  border: 1px solid #374151;
  border-radius: 8px;
  background: #111827;
  cursor: pointer;
}

.admin-footer-colors-status {
  margin: 10px 0 0;
  min-height: 1.2em;
  font-size: 12px;
  color: #9ca3af;
}

.admin-footer-colors-status.is-saving {
  color: #93c5fd;
}

.admin-footer-colors-status.is-saved {
  color: #86efac;
}

.admin-footer-colors-status.is-error {
  color: #fca5a5;
}

body.admin-layout-mode #site-footer-bottom {
  position: relative;
}

/* Footer links section pattern (accent tracks footer bg color). */
#site-footer-bottom.footer-bottom--pattern {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}

#site-footer-bottom.footer-bottom--pattern::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: var(--footer-pattern-opacity, 0.1);
  background-color: var(--footer-pattern-light, #ffffff);
  background-image:
    radial-gradient(circle at center center, var(--footer-pattern-accent, #ff9701), var(--footer-pattern-light, #ffffff)),
    repeating-radial-gradient(
      circle at center center,
      var(--footer-pattern-accent, #ff9701),
      var(--footer-pattern-accent, #ff9701),
      16px,
      transparent 32px,
      transparent 16px
    );
  background-blend-mode: multiply;
}

#site-footer-bottom.footer-bottom--pattern > * {
  position: relative;
  z-index: 1;
}

.homepage .copyright-message .inner-footer h2,
.homepage .copyright-message .inner-footer h3,
.homepage .copyright-message .inner-footer h4 {
  color: var(--site-copyright-heading-text, #fff);
  margin-bottom: 10px;
  font-size: 24px;
  font-weight: 500;
}

.homepage .copyright-message .inner-footer h2 img,
.homepage .copyright-message .inner-footer h3 img,
.homepage .copyright-message .inner-footer h4 img {
  vertical-align: middle;
  height: 45px;
  display: inline-block;
}

.homepage .copyright-message .inner-footer .copyright-message-emoji {
  display: inline-block;
  vertical-align: middle;
  font-size: 1.35em;
  line-height: 1;
  margin-left: 6px;
}

.homepage .copyright-message .inner-footer ul {
  margin: 0 0 22px;
  padding: 0 0 0 1.25em;
  color: var(--site-copyright-body-text, #fff);
  list-style: disc;
}

.homepage .copyright-message .inner-footer ul li {
  margin: 0 0 8px;
  line-height: 1.55;
}

.homepage .copyright-message .inner-footer ul li:last-child {
  margin-bottom: 0;
}

.lang-menu {
  position: relative;
  overflow: visible;
}

.lang-menu-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  width: auto !important;
  min-width: 44px;
  min-height: 44px;
  padding: 0 4px;
  border-radius: 10px;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
  transition: background-color 0.15s ease;
}

/* Vendor used 9x5 on a padded 24x24 Lucide SVG — glyph vanished. */
.lang-menu-btn:after {
  width: 12px !important;
  height: 8px !important;
  background-size: 12px 8px !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}

.lang-menu-btn:hover {
  background: rgba(0, 0, 0, 0.05);
}

.lang-menu-btn:focus-visible {
  outline: 2px solid #ff9701;
  outline-offset: 2px;
}

.lang-menu.lang-menu-open .lang-menu-btn,
.lang-menu.lang-menu-open .lang-menu-btn:hover {
  background: rgba(0, 0, 0, 0.05);
}

@media (min-width: 992px) {
  /* Click-to-open only — vendor hover + gap made the panel vanish mid-move. */
  .lang-menu:hover .lang-menu-drop {
    display: none !important;
  }

  .lang-menu:hover .lang-menu-btn:after {
    transform: none !important;
  }

  .lang-menu.lang-menu-open .lang-menu-drop {
    display: block !important;
  }

  .lang-menu.lang-menu-open .lang-menu-btn:after {
    transform: rotate(180deg) !important;
  }
}

.lang-menu.lang-menu-open::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  height: 14px;
  background: transparent;
  pointer-events: auto;
}

.lang-menu-drop {
  --lang-menu-drop-bg: #fff;
  --lang-menu-drop-border: linear-gradient(
    to bottom,
    var(--site-quotes-border-start, #fde049),
    var(--site-quotes-border-end, #ff9701)
  );
  --lang-menu-caret-border: var(--site-quotes-border-start, #fde049);
  position: absolute;
  width: min(168px, calc(100vw - 24px)) !important;
  margin-top: 10px;
  padding: 6px;
  border: 3px solid transparent !important;
  border-radius: 12px !important;
  background:
    linear-gradient(var(--lang-menu-drop-bg), var(--lang-menu-drop-bg)) padding-box,
    var(--lang-menu-drop-border) border-box !important;
  box-shadow:
    0 16px 36px rgba(15, 23, 42, 0.14),
    0 4px 4px color-mix(in srgb, var(--site-quotes-border-end, #ff9701) 18%, transparent) !important;
  transform: none !important;
  overflow: visible;
  animation: lang-menu-drop-in 0.16s ease !important;
}

/* Speech-bubble caret pointing up at the flag button */
.lang-menu-drop::before {
  display: block !important;
  content: "" !important;
  position: absolute;
  top: -8px;
  right: 16px;
  width: 14px;
  height: 14px;
  box-sizing: border-box;
  background: var(--lang-menu-drop-bg, #fff) !important;
  border: 3px solid var(--lang-menu-caret-border) !important;
  border-right: none !important;
  border-bottom: none !important;
  border-radius: 2px 0 0 0;
  transform: rotate(45deg) !important;
  box-shadow: none !important;
  z-index: 2;
  pointer-events: none;
}

@keyframes lang-menu-drop-in {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.lang-menu-list {
  display: flex !important;
  flex-direction: column;
  gap: 2px;
  padding: 0 !important;
  margin: 0;
  max-height: min(340px, calc(100dvh - 120px));
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

.lang-menu-item {
  display: flex;
  min-width: 0;
  width: 100% !important;
  padding: 0 !important;
}

.lang-menu-item:first-child {
  margin-bottom: 3px;
  padding-bottom: 3px;
  border-bottom: 1px solid rgba(20, 21, 30, 0.08);
}

.lang-menu-link {
  display: inline-flex !important;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-width: 0;
  min-height: 40px;
  padding: 8px 10px;
  border-radius: 8px;
  color: #40424c !important;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.25;
  white-space: nowrap;
  transition: background-color 0.15s ease, color 0.15s ease;
}

.lang-menu-link--current {
  background: color-mix(in srgb, #ff9701 8%, #fff);
  color: #1f2130 !important;
  font-weight: 600;
  cursor: default;
}

.lang-menu-link--current::after {
  content: "";
  flex-shrink: 0;
  width: 7px;
  height: 7px;
  margin-left: auto;
  border-radius: 50%;
  background: #ff9701;
  box-shadow: 0 0 0 2px color-mix(in srgb, #ff9701 22%, #fff);
}

.lang-menu-link:hover,
.lang-menu-link:focus-visible {
  background: color-mix(in srgb, #ff9701 10%, #fff);
  color: #ff9701 !important;
  outline: none;
}

.lang-menu-link:focus-visible {
  box-shadow: inset 0 0 0 2px rgba(255, 151, 1, 0.45);
}

.lang-flag-img {
  display: block;
  width: 20px;
  height: 15px;
  object-fit: cover;
  border-radius: 2px;
  /* No fill behind the SVG — a box-shadow ring read as a gray/black plate. */
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none;
  flex-shrink: 0;
  /* Hide the alt text glyph while loading — see .entry-favicon-img. */
  color: transparent;
  font-size: 0;
  overflow: hidden;
}

/* Soft edge only — keeps light flags (JP, PL) readable without a solid plate. */
.lang-menu-drop .lang-flag-img,
.lang-menu-btn .lang-flag-img {
  filter: drop-shadow(0 0 0.4px rgba(0, 0, 0, 0.35));
}

body.dark .lang-menu-drop .lang-flag-img,
body.dark .lang-menu-btn .lang-flag-img {
  filter: drop-shadow(0 0 0.4px rgba(0, 0, 0, 0.55));
}

.lang-flag-img--btn {
  width: 22px;
  height: 16px;
}

.lang-menu-link-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.lang-menu .icon-flag:before,
.lang-menu-btn:before,
.lang-menu-link:before {
  display: none !important;
  content: none !important;
  background: none !important;
  margin: 0 !important;
  width: 0 !important;
  height: 0 !important;
}

.lang-suggest-action-flag {
  flex-shrink: 0;
  background: transparent !important;
  box-shadow: none;
}

body.dark .lang-menu-btn:hover,
body.dark .lang-menu.lang-menu-open .lang-menu-btn,
body.dark .lang-menu.lang-menu-open .lang-menu-btn:hover {
  background: rgba(255, 255, 255, 0.08);
}

body.dark .lang-menu-drop {
  --lang-menu-drop-bg: #484a54;
  box-shadow:
    0 16px 36px rgba(0, 0, 0, 0.35),
    0 4px 4px color-mix(in srgb, var(--site-quotes-border-end, #ff9701) 22%, transparent) !important;
}

body.dark .lang-menu-link {
  color: #fff !important;
}

body.dark .lang-menu-item:first-child {
  border-bottom-color: rgba(255, 255, 255, 0.1);
}

body.dark .lang-menu-link--current {
  background: color-mix(in srgb, #ff9701 14%, #484a54);
  color: #fff !important;
}

body.dark .lang-menu-link--current::after {
  box-shadow: 0 0 0 2px color-mix(in srgb, #ff9701 28%, #484a54);
}

body.dark .lang-menu-link:hover,
body.dark .lang-menu-link:focus-visible {
  background: color-mix(in srgb, #ff9701 14%, #484a54);
  color: #ff9701 !important;
}

/* Language suggest overlay — anchored beside the lang button (desktop top bar / mobile menu) */
.top-bar .top-bar-container {
  overflow: visible;
  position: relative;
}

.top-bar {
  overflow: visible;
}

.block-suggest-lang[data-site-lang-suggest] {
  --lang-suggest-surface: #fff;
  --lang-suggest-border: rgba(20, 21, 30, 0.08);
  --lang-suggest-shadow: 0 20px 45px -14px rgba(20, 21, 30, 0.28), 0 6px 16px rgba(20, 21, 30, 0.08);
  --lang-suggest-title: #1f2130;
  --lang-suggest-subtitle: #6b6d78;
  --lang-suggest-stay-bg: #f2f3f7;
  --lang-suggest-stay-bg-hover: #e7e9f0;
  --lang-suggest-stay-text: #40424c;
  z-index: 112;
  box-sizing: border-box;
  width: min(320px, calc(100vw - 24px));
  margin: 0 0 0 3px;
  padding: 18px 18px 16px;
  font-size: 14px;
  line-height: 1.4;
  border-radius: 18px;
  border: 1px solid var(--lang-suggest-border);
  background: var(--lang-suggest-surface);
  color: var(--lang-suggest-title);
  box-shadow: var(--lang-suggest-shadow);
  opacity: 0;
  transform: scale3d(0.92, 0.92, 1) translateY(-4px);
  transform-origin: top right;
  transition: transform 0.28s cubic-bezier(0.34, 1.4, 0.64, 1), opacity 0.22s ease;
  display: none;
  position: absolute;
  top: 14px;
  right: 50px;
  pointer-events: auto;
}

.block-suggest-lang[data-site-lang-suggest].shown {
  display: block;
  opacity: 1;
  transform: scale3d(1, 1, 1) translateY(0);
}

.block-suggest-lang[data-site-lang-suggest]:before {
  content: "";
  z-index: 2;
  width: 14px;
  height: 14px;
  background: var(--lang-suggest-surface);
  border-top: 1px solid var(--lang-suggest-border);
  border-right: 1px solid var(--lang-suggest-border);
  border-radius: 3px;
  transform: rotate(45deg);
  position: absolute;
  top: -7px;
  right: 28px;
}

.block-suggest-lang[data-site-lang-suggest]:after {
  content: none;
}

.lang-suggest-close {
  cursor: pointer;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  border: 0;
  background: #f2f3f7;
  position: absolute;
  top: 10px;
  right: 10px;
  transition: background-color 0.15s ease, transform 0.15s ease;
}

.lang-suggest-close:hover {
  background: #e7e9f0;
  transform: rotate(90deg);
}

.lang-suggest-close:after,
.lang-suggest-close:before {
  content: "";
  background: #7b7c88;
  width: 2px;
  height: 11px;
  border-radius: 2px;
  margin: auto;
  position: absolute;
  inset: 0;
}

.lang-suggest-close:before {
  transform: rotate(45deg);
}

.lang-suggest-close:after {
  transform: rotate(135deg);
}

.lang-suggest-body {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding-right: 20px;
  margin-bottom: 16px;
}

.lang-suggest-icon {
  flex-shrink: 0;
  width: 34px;
  height: 34px;
  border-radius: 10px;
  background: color-mix(in srgb, var(--site-brand-primary, #ff9701) 14%, #fff);
  position: relative;
}

.lang-suggest-icon:before {
  content: "";
  position: absolute;
  inset: 8px;
  background: var(--site-brand-primary, #ff9701);
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M2 12h20M12 2a15.3 15.3 0 010 20M12 2a15.3 15.3 0 000 20'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M2 12h20M12 2a15.3 15.3 0 010 20M12 2a15.3 15.3 0 000 20'/%3E%3C/svg%3E");
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
}

.lang-suggest-copy {
  min-width: 0;
}

.lang-suggest-title {
  color: var(--lang-suggest-title);
  margin: 0 0 4px;
  font-weight: 600;
}

.lang-suggest-title a {
  color: var(--site-brand-primary, #ff9701);
  text-decoration: none;
}

.lang-suggest-title a:hover {
  color: color-mix(in srgb, var(--site-brand-primary, #ff9701) 85%, #000);
  text-decoration: underline;
}

.lang-suggest-subtitle {
  color: var(--lang-suggest-subtitle);
  margin: 0;
  font-size: 12.5px;
  line-height: 1.5;
}

.lang-suggest-actions {
  display: grid;
  gap: 8px;
}

.lang-suggest-action {
  color: var(--lang-suggest-stay-text);
  background-color: var(--lang-suggest-stay-bg);
  border: 0;
  border-radius: 12px;
  justify-content: center;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 12px 14px;
  display: inline-flex;
  text-align: center;
  text-decoration: none;
  font-size: 13.5px;
  font-weight: 600;
  cursor: pointer;
  transition: background-color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}

.lang-suggest-action:hover {
  background-color: var(--lang-suggest-stay-bg-hover);
  text-decoration: none;
  transform: translateY(-1px);
}

.lang-suggest-action--go {
  color: #fff;
  background: linear-gradient(135deg, var(--site-brand-primary, #ff9701), color-mix(in srgb, var(--site-brand-primary, #ff9701) 78%, #ff5f6d));
  box-shadow: 0 8px 18px -8px color-mix(in srgb, var(--site-brand-primary, #ff9701) 70%, transparent);
}

.lang-suggest-action--go:hover {
  box-shadow: 0 12px 22px -8px color-mix(in srgb, var(--site-brand-primary, #ff9701) 75%, transparent);
  filter: brightness(1.03);
}

.lang-suggest-action-arrow {
  width: 8px;
  height: 8px;
  border-top: 2px solid currentColor;
  border-right: 2px solid currentColor;
  transform: rotate(45deg);
  margin-left: 2px;
  flex-shrink: 0;
  opacity: 0.85;
}

.lang-suggest-action-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.dark .block-suggest-lang[data-site-lang-suggest] {
  --lang-suggest-surface: var(--site-notice-surface-bg, #2c2e38);
  --lang-suggest-border: color-mix(in srgb, var(--site-notice-surface-bg, #2c2e38) 40%, #000);
  --lang-suggest-title: var(--site-notice-title-text, #fff);
  --lang-suggest-subtitle: var(--site-notice-body-muted, #b3b4bd);
  --lang-suggest-stay-bg: color-mix(in srgb, var(--site-notice-surface-bg, #2c2e38) 70%, #fff 8%);
  --lang-suggest-stay-bg-hover: color-mix(in srgb, var(--site-notice-surface-bg, #2c2e38) 60%, #fff 12%);
  --lang-suggest-stay-text: #fff;
}

body.dark .lang-suggest-close {
  background: color-mix(in srgb, var(--site-notice-surface-bg, #2c2e38) 60%, #fff 10%);
}

body.dark .lang-suggest-close:hover {
  background: color-mix(in srgb, var(--site-notice-surface-bg, #2c2e38) 50%, #fff 16%);
}

body.dark .lang-suggest-close:after,
body.dark .lang-suggest-close:before {
  background: #d5d6de;
}

@media (max-width: 991px) {
  .mob-menu .lang-menu {
    overflow: visible;
  }

  .mob-menu .lang-menu .block-suggest-lang[data-site-lang-suggest] {
    top: 14px;
    right: 50px;
    z-index: 340;
    width: min(320px, calc(100vw - 48px));
  }

  .mob-menu:not(.mob-menu-open) .block-suggest-lang[data-site-lang-suggest] {
    display: none !important;
  }

  body.lang-suggest-open .mob-menu.mob-menu-open {
    z-index: 120;
  }
}

@media (min-width: 992px) {
  .top-bar-container .block-suggest-lang[data-site-lang-suggest] {
    top: 14px;
    right: 50px;
  }

  /*
   * Header sits under main (z-index 5 vs 10) so the half-mascot can tuck behind
   * category cards. Lang-suggest needs the dropdown above content — elevate only
   * .top-bar (same approach as lang-menu) so the mascot is not clipped under the bar.
   */
  body.lang-suggest-open:not(.site-search-open).homepage .header,
  body.lang-suggest-open:not(.site-search-open).categorypage .header,
  body.lang-suggest-open:not(.site-search-open).singlepage .header,
  body.lang-suggest-open:not(.site-search-open).aboutpage .header {
    z-index: auto;
  }

  body.lang-suggest-open:not(.site-search-open) .top-bar {
    position: relative;
    z-index: 130;
  }

  body.lang-suggest-open:not(.site-search-open) .header-desk {
    overflow: visible;
  }

  body.lang-suggest-open .block-suggest-lang[data-site-lang-suggest] {
    z-index: 135;
  }
}

.socials {
  align-items: center;
}

.socials-item {
  flex-shrink: 0;
}

.socials-link {
  box-sizing: border-box;
  width: 40px !important;
  height: 40px !important;
  min-width: 40px;
  min-height: 40px;
  max-width: 40px;
  max-height: 40px;
  padding: 0 2px;
  overflow: hidden;
  position: relative;
  flex-shrink: 0;
  background-repeat: no-repeat;
  background-position: center center;
}

.socials-link.theme-link {
  background-color: var(--site-theme-toggle-inactive-light, #2a2b31);
  background-image: var(--site-asset-theme-moon) !important;
  background-size: 18px 18px;
  background-repeat: no-repeat;
  background-position: center;
  border: none;
}

body.dark .socials-link.theme-link {
  background-image: var(--site-asset-theme-sun) !important;
}

.socials-link.socials-link-custom {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-image: none !important;
  --social-icon-scale: 1;
}

.socials-link.socials-link-custom::before,
.socials-link.theme-link::before,
.header .socials-link::before,
.mob-menu .socials-link::before {
  display: none !important;
  content: none !important;
}

/* Vendor sets .socials-link.lazyload { background-image: none } — keep theme icon visible. */
.header .socials-link.theme-link.lazyload,
.mob-menu .socials-link.theme-link.lazyload {
  background-image: var(--site-asset-theme-moon) !important;
}

body.dark .header .socials-link.theme-link.lazyload,
body.dark .mob-menu .socials-link.theme-link.lazyload {
  background-image: var(--site-asset-theme-sun) !important;
}

.socials-link .socials-link-icon {
  width: calc(20px * var(--social-icon-scale, 1));
  height: calc(20px * var(--social-icon-scale, 1));
  max-width: calc(20px * var(--social-icon-scale, 1));
  max-height: calc(20px * var(--social-icon-scale, 1));
  object-fit: contain;
  display: block;
  flex-shrink: 0;
  background: transparent !important;
  background-color: transparent !important;
}

/* Footer custom icons follow --site-footer-social-icon-color / hover color (usually white → orange). */
.socials-link .socials-link-icon--themed {
  background: currentColor !important;
  background-color: currentColor !important;
  -webkit-mask-image: var(--social-icon-url);
  mask-image: var(--social-icon-url);
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
}

.footer .socials-link.lazyload,
.header .socials-link.lazyload,
.mob-menu .socials-link.lazyload {
  background-image: inherit;
}

.footer .socials-link.theme-link.lazyload,
.header .socials-link.theme-link.lazyload,
.mob-menu .socials-link.theme-link.lazyload {
  background-image: var(--site-asset-theme-moon) !important;
}

body.dark .footer .socials-link.theme-link.lazyload,
body.dark .header .socials-link.theme-link.lazyload,
body.dark .mob-menu .socials-link.theme-link.lazyload {
  background-image: var(--site-asset-theme-sun) !important;
}

body.dark .mob-menu .socials-link.theme-link.checked.lazyload {
  background-color: var(--site-theme-toggle-active, #ff9701) !important;
  background-image: var(--site-asset-theme-sun) !important;
}

/* Bottom dock is mobile-only (homepage does not load category-page.css). */
@media (min-width: 992px) {
  .bottom-toolbar {
    display: none !important;
  }
}

.homepage .footer-separator-line {
  position: relative;
  width: min(calc(100vw - 32px), calc(1280px * var(--footer-banner-desktop-scale, 1)));
  margin: 0;
  padding: 0;
  border: 0;
  line-height: 0;
  background: transparent !important;
  pointer-events: none;
}

.homepage .footer-separator-line picture {
  display: block;
  width: 100%;
  line-height: 0;
}

.homepage .footer-separator-line .footer-separator-img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: contain;
  object-position: center center;
  background: transparent !important;
}

.homepage .copyright-message .animation-wrapper {
  display: none !important;
  padding: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
}

.homepage .copyright-message .footer-intro[hidden] {
  display: none !important;
}

.homepage .copyright-message .inner-footer {
  margin-top: 0 !important;
  padding-top: calc(var(--footer-banner-overlap) + 32px);
}

@media (max-width: 991px) {
  .homepage .copyright-message .inner-footer {
    padding-top: calc(var(--footer-banner-overlap) + 16px) !important;
    padding-bottom: 20px !important;
  }
}

/* Category / review subpages */
@media (min-width: 992px) {
  .categorypage .category-sidebar-list {
    position: sticky;
    top: 12px;
    align-self: flex-start;
  }
}

@media (max-width: 991px) {
  body.categorypage .main,
  body.singlepage .main,
  body.aboutpage .main {
    padding-bottom: 0;
  }

  /*
   * Category/review vendor CSS sets footer.w-margin .copy-text { margin-bottom: 80px }
   * AFTER site-fixes, which paints a body-gray strip under the orange bar. Keep
   * clearance as padding inside the copy bar (covers the fixed bottom toolbar).
   */
  footer.w-margin .copy-text,
  body.categorypage footer.w-margin .copy-text,
  body.singlepage footer.w-margin .copy-text,
  body.aboutpage footer.w-margin .copy-text {
    margin-bottom: 0 !important;
    height: auto !important;
    box-sizing: border-box;
  }

  body.categorypage footer.w-margin .copy-text,
  body.singlepage footer.w-margin .copy-text {
    padding-bottom: calc(16px + var(--mob-bottom-toolbar-height) + var(--mob-safe-bottom)) !important;
  }

  /* Vendor reserves 80px for a decorative head we don't show — tighten mobile chrome. */
  body.categorypage .footer-bottom,
  body.singlepage .footer-bottom,
  body.aboutpage .footer-bottom {
    margin-top: 0 !important;
    padding-top: 28px !important;
  }

  body.categorypage .footer-bottom:before,
  body.singlepage .footer-bottom:before,
  body.aboutpage .footer-bottom:before {
    display: none;
  }

  body.categorypage .footer .socials,
  body.singlepage .footer .socials,
  body.aboutpage .footer .socials {
    margin-bottom: 16px;
  }

  body.categorypage .footer-bottom .footer-links,
  body.singlepage .footer-bottom .footer-links,
  body.aboutpage .footer-bottom .footer-links {
    margin-bottom: 12px;
    padding: 0 16px;
    column-gap: 12px;
  }

  body.categorypage .footer-bottom .footer-links li,
  body.singlepage .footer-bottom .footer-links li,
  body.aboutpage .footer-bottom .footer-links li {
    margin: 0 0 6px;
  }

  body.categorypage .footer-bottom .footer-links a,
  body.singlepage .footer-bottom .footer-links a,
  body.aboutpage .footer-bottom .footer-links a {
    line-height: 1.35;
  }

  body.categorypage .footer-bottom .footer-links a:after,
  body.singlepage .footer-bottom .footer-links a:after,
  body.aboutpage .footer-bottom .footer-links a:after {
    display: none;
  }

  body.categorypage .footer-links-wrap .footer-copy-main,
  body.singlepage .footer-links-wrap .footer-copy-main,
  body.aboutpage .footer-links-wrap .footer-copy-main {
    margin: 0 16px 14px;
    line-height: 1.4;
  }

  body.categorypage .footer .copy-text,
  body.singlepage .footer .copy-text,
  body.aboutpage .footer .copy-text {
    padding-top: 14px;
    padding-left: 16px;
    padding-right: 16px;
    gap: 4px;
  }

  body.categorypage .link-container.container {
    border-top: none;
    border-left: none;
    border-right: none;
    border-radius: 0;
    padding: 0 12px 16px;
    max-width: 100%;
    box-sizing: border-box;
  }

  body.singlepage .link-container.container {
    border-top: none;
    border-left: none;
    border-right: none;
    border-radius: 0;
    padding: 0 12px 16px;
    max-width: 100%;
    box-sizing: border-box;
  }

  body.categorypage .category-sidebar {
    display: none !important;
  }

  body.categorypage .feature-container {
    display: block;
    width: 100%;
    min-width: 0;
  }

  body.categorypage .category-content,
  body.categorypage .link-content {
    width: 100%;
    min-width: 0;
    overflow: visible;
  }

  body.categorypage .url_links_wrapper,
  body.singlepage .url_links_wrapper {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 14px;
    width: 100%;
    margin: 0;
    padding: 0;
    font-size: 0;
    box-sizing: border-box;
  }

  body.categorypage .url_link_container,
  body.singlepage .url_links_wrapper .url_link_container {
    display: block;
    vertical-align: top;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    padding: 0;
    font-size: 15px;
    position: relative;
    box-sizing: border-box;
  }

  body.categorypage .url_link_image,
  body.singlepage .url_links_wrapper .url_link_image {
    border-radius: var(--site-thumb-radius);
    aspect-ratio: var(--site-thumb-aspect);
    height: auto;
    padding-bottom: 0;
    background: #000 !important;
    position: relative;
    overflow: hidden;
  }

  body.categorypage .url_link_image .url_link_title .link {
    font-size: 16px;
  }

  body.categorypage .url_link_image .url-thumb-rank {
    min-width: 1.75em;
    font-size: 14px;
  }

  body.categorypage .url_link_image .url_link_title {
    padding: 0 10px;
    bottom: 10px;
    gap: 8px;
  }

  body.categorypage .url_link_image .url_link_title .link {
    gap: 5px;
    max-width: calc(100% - 2.75em - 8px);
  }

  body.categorypage .url_link_image .url_link_title .url-link-favicon,
  body.categorypage .url_link_image .url_link_title .entry-favicon-img {
    width: 18px !important;
    height: 18px !important;
    max-width: 18px;
    flex: 0 0 18px;
  }

  body.categorypage .url_short_desc {
    color: #777;
    text-align: left;
    margin-top: 8px;
    padding: 0 2px 4px;
    font-size: 14px;
    line-height: 1.55;
    box-sizing: border-box;
    width: 100%;
    overflow-wrap: anywhere;
    word-wrap: break-word;
  }

  body.categorypage .category-top-cards,
  body.singlepage .category-top-cards {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 14px;
    width: 100%;
    margin: 20px 0 0;
    padding: 0;
    box-sizing: border-box;
  }

  body.categorypage .category-top-card,
  body.singlepage .category-top-card {
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }

  body.categorypage .category-top-card-link,
  body.singlepage .category-top-card-link {
    display: flex;
    flex-direction: column;
    min-width: 0;
  }

  body.categorypage .category-top-card-body,
  body.singlepage .category-top-card-body {
    min-width: 0;
  }

  body.categorypage .category-top-cards .cards-list {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
  }

  body.categorypage .divider,
  body.singlepage .divider,
  body.homepage .divider {
    margin: 30px 0;
    width: 100%;
  }

  body.categorypage .bottom-block,
  body.singlepage .bottom-block {
    width: 100%;
    margin: 20px 0 0;
    padding: 0;
    box-sizing: border-box;
  }

  body.singlepage .singlepage-link-content {
    display: flex;
    flex-direction: column;
    gap: 14px;
  }

  body.singlepage .link-details .link-title h1,
  body.singlepage .link-details .link-title h2 {
    font-size: 22px;
    line-height: 1.25;
    white-space: normal;
    overflow: visible;
    flex-wrap: wrap;
  }

  body.singlepage .procons-wrap {
    width: 100%;
  }

  body.singlepage .entry-pros-cons {
    margin-top: 14px;
    padding-top: 14px;
  }

  body.singlepage .entry-rating-bar {
    margin-top: 12px;
    padding-top: 12px;
  }

  body.homepage .bottom-toolbar,
  body.singlepage .bottom-toolbar,
  body.categorypage .bottom-toolbar {
    padding: 6px 12px !important;
    transform: none !important;
  }

  body.homepage .bottom-toolbar.bottom-toolbar-show,
  body.singlepage .bottom-toolbar.bottom-toolbar-show,
  body.categorypage .bottom-toolbar.bottom-toolbar-show {
    bottom: var(--mob-safe-bottom, 0px);
  }

  body.singlepage .link-thumbs-holder .swiper {
    overflow: hidden;
    width: 100%;
  }

  body.singlepage .top-bar-review .category-menu {
    margin-top: 8px;
  }

  body.singlepage .category-top-cards .card-item,
  body.categorypage .category-top-cards .card-item {
    min-width: 0;
    width: 100%;
  }

  body.singlepage .top-bar-review .holder {
    flex-wrap: wrap;
    gap: 8px;
    padding: 8px 12px;
  }

  body.singlepage .top-bar-review .link-analytics.btn-visit {
    max-width: 100%;
    font-size: 13px;
    padding: 8px 12px;
  }

  body.singlepage .top-bar-review .btn-visit-text {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  body.categorypage .category-header h1,
  body.categorypage .category-desc h1 {
    font-size: 26px;
    line-height: 1.25;
    white-space: normal;
  }

  .breadcrumb-holder {
    margin: 0 0 12px;
    padding: 0;
    width: 100%;
    overflow: visible;
  }

  .breadcrumb-row {
    align-items: flex-start;
    gap: 8px;
  }

  .entry-save-action--breadcrumb {
    margin-left: auto;
    padding-top: 2px;
  }

  .entry-save-action--breadcrumb .entry-save-action-hint {
    display: none;
  }

  .breadcrumb {
    flex-wrap: nowrap;
    align-items: center;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    min-height: 40px;
    height: auto !important;
    padding: 2px 0 8px;
    gap: 0;
    background: transparent !important;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scroll-behavior: smooth;
    scrollbar-width: none;
  }

  .breadcrumb::-webkit-scrollbar {
    display: none;
  }

  .breadcrumb li {
    flex-shrink: 0;
    align-items: center;
    font-size: 14px;
    max-width: 100%;
  }

  .breadcrumb li:last-child {
    flex: 1 1 auto;
    min-width: 0;
  }

  .breadcrumb a {
    font-size: 14px;
    font-weight: 500;
  }

  .breadcrumb li.link-home a {
    padding: 6px 8px 6px 4px;
    gap: 0;
  }

  .breadcrumb li.link-home a:before {
    display: none;
  }

  .breadcrumb li.link-home a .breadcrumb-brand-icon {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
  }

  .breadcrumb li.link-home a span[itemprop="name"] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }

  .breadcrumb li.link-category a {
    padding: 6px 8px;
    max-width: min(42vw, 180px);
    min-width: 0;
  }

  .breadcrumb li.link-category a:after {
    display: none !important;
  }

  .breadcrumb li.link-category a span[itemprop="name"] {
    min-width: 0;
  }

  .breadcrumb li.link-category .category-emoji {
    font-size: 1.45rem;
    line-height: 1;
    flex-shrink: 0;
  }

  .breadcrumb li.link-category .category-icon-img {
    width: 24px;
    height: 24px;
  }

  .breadcrumb .breadcrumb-current,
  .breadcrumb li.breadcrumb-current-wrap > .breadcrumb-current {
    font-size: 14px;
    padding: 6px 4px 6px 0;
    max-width: 100%;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .breadcrumb li.breadcrumb-current-wrap {
    min-width: 0;
  }

  .breadcrumb li:last-child a.single-title,
  .breadcrumb a.breadcrumb-current-link {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 14px;
    font-weight: 500;
    padding: 6px 4px 6px 0;
    max-width: 100%;
    min-width: 0;
    overflow: hidden;
    white-space: nowrap;
  }

  .breadcrumb a.breadcrumb-current-link span[itemprop="name"] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
    flex: 1 1 auto;
  }

  .breadcrumb .breadcrumb-current-suffix {
    flex-shrink: 0;
    font-size: 13px;
  }

  .breadcrumb li:not(:first-child):before {
    flex-shrink: 0;
    width: 5px;
    height: 9px;
    margin: 0 4px;
    opacity: 0.7;
  }

  body.categorypage .link-header,
  body.singlepage .link-header {
    margin: 0 0 16px;
    padding: 0 0 14px;
    position: relative;
    text-align: center;
  }

  body.categorypage .link-header:after,
  body.singlepage .link-header:after {
    display: block !important;
    content: "" !important;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background-color: rgb(var(--category-title-line-rgb, var(--category-rgb, 255, 151, 1))) !important;
    border-radius: 2px;
    transform: none;
  }

  body.categorypage .link-header-line {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
  }

  body.categorypage .link-header-title-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    width: 100%;
    gap: 8px;
  }

  body.categorypage .link-header .category-emoji {
    font-size: 2.75rem;
    line-height: 1;
    margin: 0 auto 4px;
  }

  body.categorypage .link-header .category-icon-img {
    width: 44px;
    height: 44px;
    margin: 0 auto 4px;
  }

  body.categorypage .link-header-title {
    font-size: 26px;
    line-height: 1.2;
    font-weight: 600;
    text-transform: uppercase;
    white-space: normal;
    overflow: visible;
    text-overflow: unset;
    max-width: 100%;
    padding: 0 4px;
  }

  body.categorypage .link-header-subtitle {
    width: 100%;
    max-width: 100%;
    text-align: left;
    font-size: 13px;
    line-height: 1.45;
    margin-top: 8px;
  }

  body.categorypage .subscribe-holder {
    display: none;
  }

  body.categorypage .category-content .category-desc-wrapper {
    color: #4e4e4e;
    margin: 0 0 16px;
    width: 100%;
    max-width: 100%;
    padding: 0;
    box-sizing: border-box;
  }

  body.categorypage .category-content .category-desc-wrapper .category-desc {
    max-height: min(60vh, 420px);
    padding: 12px 14px 16px;
  }

  body.categorypage .category-desc-disclosure {
    border: 1px solid rgba(var(--category-button-rgb, var(--category-rgb, 197, 197, 197)), 0.35);
    border-radius: 10px;
    background: rgba(var(--category-rgb, 240, 240, 240), 0.08);
    overflow: hidden;
  }

  body.categorypage .category-desc-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 48px;
    padding: 12px 14px;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.35;
    color: #4e4e4e;
    cursor: pointer;
    list-style: none;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
  }

  body.categorypage .category-desc-toggle::-webkit-details-marker {
    display: none;
  }

  body.categorypage .category-desc-toggle-label {
    flex: 1 1 auto;
    min-width: 0;
    text-align: left;
  }

  body.categorypage .category-desc-toggle-icon {
    flex-shrink: 0;
    width: 10px;
    height: 10px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg);
    margin-top: -3px;
    transition: transform 0.2s ease, margin-top 0.2s ease;
    opacity: 0.65;
  }

  body.categorypage .category-desc-disclosure[open] .category-desc-toggle-icon {
    transform: rotate(-135deg);
    margin-top: 3px;
  }

  body.categorypage .category-desc-disclosure[open] .category-desc-toggle {
    border-bottom: 1px solid rgba(var(--category-button-rgb, var(--category-rgb, 197, 197, 197)), 0.22);
  }

  body.categorypage .category-content .category-desc-wrapper .category-desc {
    font-size: 14px;
    line-height: 1.55;
    color: var(--site-category-desc-text, #4e4e4e) !important;
    max-height: min(60vh, 420px);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding: 12px 14px 16px;
  }

  body.categorypage .category-content .category-desc-wrapper .category-desc p,
  body.categorypage .category-content .category-desc-wrapper .category-desc h3 {
    color: inherit;
  }

  body.categorypage .category-content .category-desc-wrapper .category-desc h3 {
    display: none;
  }

  body.categorypage .category-content .category-desc-wrapper .category-desc .category-desc-intro-only {
    display: block;
    margin: 0;
  }

  body.categorypage.dark .category-desc-disclosure {
    border-color: rgba(var(--category-button-rgb, var(--category-rgb, 120, 120, 120)), 0.45);
    background: rgba(255, 255, 255, 0.04);
  }

  body.singlepage .btn-main {
    width: 100%;
    max-width: 100%;
    margin: 0 0 12px;
    justify-content: center;
    font-size: 14px;
    padding: 10px 14px;
  }

  body.singlepage .row-sites {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px 12px;
    width: 100%;
    margin-bottom: 12px;
    padding: 12px 14px;
    border-radius: 8px;
    background: var(--site-surface-inset, #f3f5fa);
    text-decoration: none !important;
  }

  body.singlepage .row-sites .title {
    flex: 1 1 180px;
    min-width: 0;
    font-size: 14px;
    line-height: 1.35;
    white-space: normal;
    margin: 0;
  }

  body.singlepage .row-sites .list-sites {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    height: auto;
    padding: 0 12px 0 0;
    font-size: 0;
  }

  body.singlepage .link-details .review-rank {
    font-size: 13px;
    margin-bottom: 6px;
  }

  body.singlepage .link-details .link-title h1 {
    font-size: 22px;
    line-height: 1.2;
    flex-wrap: wrap;
    gap: 4px;
  }

  body.singlepage .link-details .link-title h3 {
    font-size: 13px;
    margin-top: 6px;
    word-break: break-all;
  }

  body.singlepage .link-details-review-wrapper,
  body.singlepage .entry-review-text-wrap.link-details-review-wrapper {
    height: auto !important;
    max-height: none !important;
    margin: 12px 0;
    box-shadow: none;
  }

  body.singlepage .link-details-review,
  body.singlepage .entry-review-text-wrap .link-details-review {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    font-size: 14px;
    line-height: 1.55;
  }

  body.singlepage .procons-wrap {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin: 12px 0;
  }

  body.singlepage .procons {
    width: 100%;
    max-height: none;
    overflow: visible;
  }

  body.singlepage .link-rating {
    width: 100%;
    text-align: center;
  }

  body.singlepage .modal-btns {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 12px 0;
  }

  body.singlepage .modal-btns button {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 12px;
    padding: 8px 10px;
  }

  body.singlepage .link-header.related-sites {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    padding-bottom: 14px;
  }

  body.singlepage .link-header.related-sites h2 {
    font-size: 20px;
    line-height: 1.3;
    text-align: center;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 6px;
    white-space: normal;
  }

  body.singlepage .link-header.related-sites h2 .category-emoji {
    font-size: 1.5rem;
    line-height: 1;
  }

  body.singlepage .link-header.related-sites .btn-main {
    margin: 0;
  }

  body.singlepage .link-thumbnail,
  body.singlepage .link-thumbs-holder {
    width: 100%;
    margin-bottom: 12px;
  }

  body.singlepage .top-bar-review {
    left: 0;
    right: 0;
    width: 100%;
    max-width: 100%;
  }

  body.singlepage .singlepage-link-content,
  body.singlepage .singlepage-link-content.entry-review {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
    overflow-x: clip;
  }

  body.singlepage .entry-review-card.link-details,
  body.singlepage .link-details {
    padding: 4px 0 0;
    min-width: 0;
    max-width: 100%;
  }

  body.singlepage .entry-review-hero-panel,
  body.singlepage .entry-review-media {
    padding-inline: 0;
    min-width: 0;
    max-width: 100%;
  }

  body.singlepage .entry-review-body {
    min-width: 0;
    max-width: 100%;
  }

  body.categorypage .url_link_image .site-save-btn--thumb,
  body.singlepage .url_link_image .site-save-btn--thumb {
    top: 8px;
    right: 8px;
  }
}

.categorypage .url_link_image > .link img,
.categorypage .url_link_image > .link .lazyload,
.categorypage .url_link_image > .link .lazyloaded {
  position: absolute;
  top: 0;
  left: 0;
  inset: 0;
  max-width: none;
  width: 100%;
  height: 100% !important;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  object-fit: cover;
  object-position: center top;
  transform: none !important;
}

.search-view .url_link_image img,
.search-view .url_link_image .lazyload {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  max-width: none;
  height: 100% !important;
  object-fit: cover;
  object-position: center top;
  border-radius: 0;
}

.singlepage .link-thumbnail .link-thumb .big-thumb-holder,
.singlepage .entry-review-carousel .link-thumb .big-thumb-holder {
  padding-top: 0 !important;
  aspect-ratio: var(--site-thumb-aspect);
  height: auto !important;
  border-radius: var(--site-thumb-radius-lg);
}

.singlepage .link-thumbnail .link-thumb .big-thumb-holder .example-thumb-img,
.singlepage .link-thumbnail .link-thumb .big-thumb-holder .example-thumb-img.lazyload {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: center top;
}

/* Screenshot overlay CTA — compact pill (review-page.css loads after site-fixes). */
.singlepage .link-thumbnail .link-thumb .big-thumb-holder .btn-site,
.singlepage .btn-site {
  --animation-rgb-value: var(--site-bottom-block-cta-pulse-rgb, 46, 175, 97);
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  right: auto !important;
  z-index: 2;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px;
  width: auto !important;
  max-width: min(280px, calc(100% - 40px));
  min-height: 0 !important;
  padding: 10px 14px 10px 12px !important;
  border: none !important;
  border-radius: 999px !important;
  background: var(--site-bottom-block-cta-bg, #2eaf61) !important;
  color: var(--site-bottom-block-cta-text, #fff) !important;
  box-shadow:
    0 4px 16px rgba(0, 0, 0, 0.28),
    0 0 0 1px rgba(255, 255, 255, 0.12) inset !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  letter-spacing: 0.01em;
  text-decoration: none !important;
  transform: translate(-50%, -50%) !important;
  transition:
    transform 0.18s ease,
    filter 0.18s ease,
    box-shadow 0.18s ease !important;
  animation: none !important;
  box-sizing: border-box;
}

.singlepage .link-thumbnail .link-thumb .big-thumb-holder .btn-site .entry-favicon-img,
.singlepage .btn-site .entry-favicon-img,
.singlepage .btn-site .btn-site-icon {
  position: static !important;
  flex: 0 0 20px;
  width: 20px !important;
  height: 20px !important;
  max-width: 20px !important;
  max-height: 20px !important;
  padding: 2px;
  border-radius: 6px;
  background: #fff;
  box-sizing: border-box;
  object-fit: contain;
}

.singlepage .btn-site .icon-site {
  flex: 0 0 20px;
  width: 20px !important;
  height: 20px;
  margin: 0;
  overflow: hidden;
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.95);
}

.singlepage .btn-site .icon-site:before {
  transform: none;
}

.singlepage .btn-site .text {
  flex: 0 1 auto;
  min-width: 0;
  max-width: 180px;
  margin: 0 !important;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: left !important;
  text-transform: none !important;
  color: inherit !important;
  font-size: inherit !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
}

.singlepage .btn-site .sitename {
  font-weight: 700 !important;
}

.singlepage .btn-site .link-icon {
  flex: 0 0 14px !important;
  width: 14px !important;
  height: 14px !important;
  margin-left: 0 !important;
  background-size: 14px !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  filter: brightness(0) invert(1);
  opacity: 0.95;
}

@media (min-width: 1025px) {
  .singlepage .btn-site:hover {
    animation: none !important;
    transform: translate(-50%, calc(-50% - 1px)) !important;
    filter: brightness(1.06);
    box-shadow:
      0 6px 20px rgba(0, 0, 0, 0.32),
      0 0 0 1px rgba(255, 255, 255, 0.16) inset !important;
  }

  .singlepage .btn-site:hover .link-icon {
    animation: none !important;
  }
}

@media (max-width: 991px) {
  .singlepage .link-thumbnail .link-thumb .big-thumb-holder .btn-site,
  .singlepage .btn-site {
    max-width: min(240px, calc(100% - 28px));
    padding: 9px 12px 9px 10px !important;
    gap: 7px;
    font-size: 13px !important;
  }

  .singlepage .btn-site .link-icon {
    width: 13px !important;
    height: 13px !important;
    background-size: 13px !important;
  }
}

@media (max-width: 480px) {
  .singlepage .btn-site .text,
  .singlepage .btn-site .sitename {
    font-size: 13px !important;
  }
}

.entry-favicon-img {
  display: inline-block;
  flex-shrink: 0;
  object-fit: contain;
  vertical-align: middle;
  /*
   * These slots are 16-20px — while a favicon is loading (or if it fails
   * before the onerror fallback swaps the src), browsers paint the `alt`
   * text at normal font size and it spills out of the tiny box. Hide the
   * glyph rendering only; screen readers still read `alt` normally since
   * this isn't display:none/visibility:hidden.
   */
  color: transparent;
  font-size: 0;
  overflow: hidden;
}

.favicon-bar-addressbar .entry-favicon-img {
  width: 16px;
  height: 16px;
  margin-right: 4px;
}

.btn-site .entry-favicon-img {
  width: 20px;
  height: 20px;
}

.site-anchor-favicon,
.toolbar-favicon {
  width: 16px;
  height: 16px;
}

.homepage .category-item .category-item-site-link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  vertical-align: middle;
  max-width: calc(100% - 42px);
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

/* Entry name colors — tokens switch automatically in dark mode */
body.homepage .category-container .category-wrapper,
body.homepage .category-container .category-item .link-analytics,
body.homepage .category-container .category-item .category-item-site-link,
body.homepage .category-container .category-item .category-item-name {
  color: var(--site-text-listing, #2f2f2f);
}

.url_link_image[data-thumb-overlay] {
  position: relative;
  overflow: hidden;
  aspect-ratio: var(--site-thumb-aspect);
  height: auto;
  width: 100%;
  isolation: isolate;
  contain: layout;
  /* Square corners: these are dark-bottomed screenshots sitting on the white listing
     surface. Any corner radius reveals the white page in the corner pocket (a "white
     triangle") on the dark bottom edge — squaring removes that reveal entirely. */
  border-radius: 0;
  box-shadow: var(--site-thumb-shadow);
  background: #000 !important;
  transition: box-shadow 0.2s ease, transform 0.2s ease;
}

/* Thumbnail hover CTAs — smaller / flatter.
   below-the-fold.css loads AFTER site-fixes, so key props need !important. */
.url_link_overcover {
  background: rgba(15, 17, 21, 0.58) !important;
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
  gap: 8px !important;
  padding: 14px 12px !important;
  box-sizing: border-box;
}

.url_link_overcover .item-link {
  width: min(78%, 190px) !important;
  max-height: none !important;
  min-height: 0 !important;
  height: auto !important;
  padding: 7px 12px !important;
  border: none !important;
  border-radius: 999px !important;
  font-weight: 600 !important;
  letter-spacing: 0.01em;
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.2) !important;
  transition:
    transform 0.18s ease,
    filter 0.18s ease,
    box-shadow 0.18s ease !important;
  animation: none !important;
}

.url_link_overcover .item-link + .item-link {
  margin-top: 0 !important;
}

.url_link_overcover .link1 {
  background: var(--site-brand-primary, #ff9701) !important;
}

.url_link_overcover .link2 {
  background: var(--site-bottom-block-cta-bg, #2eaf61) !important;
  margin: 0 !important;
}

.url_link_overcover .item-link .text {
  min-width: 0 !important;
  margin: 0 6px 0 0 !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
}

.url_link_overcover .item-link .btn-icon {
  width: 13px !important;
  height: 9px !important;
  background-size: 13px !important;
  background-position: center !important;
}

.url_link_overcover .item-link .link-icon {
  width: 14px !important;
  height: 14px !important;
  background-size: 13px !important;
  background-position: center !important;
}

@media (min-width: 992px) {
  .url_link_overcover .item-link:hover,
  .url_link_overcover .item-link + .item-link:hover {
    animation: none !important;
    transform: translateY(-1px) !important;
    filter: brightness(1.06);
    box-shadow: 0 5px 16px rgba(0, 0, 0, 0.26) !important;
  }
}

@media (max-width: 479px) {
  .url_link_overcover {
    gap: 7px !important;
    padding: 12px 10px !important;
  }

  .url_link_overcover .item-link {
    width: min(84%, 176px) !important;
    padding: 6px 11px !important;
  }

  .url_link_overcover .item-link .text {
    font-size: 12px !important;
  }
}

@media (max-width: 400px) {
  .url_link_overcover .link2 {
    margin: 0 !important;
  }
}

.url_link_image[data-thumb-overlay] > .link {
  display: block;
  position: absolute;
  inset: 0;
  z-index: 1;
  overflow: hidden;
  /* Inherit the frame rounding so the composited image layer is clipped per-corner —
     Chromium otherwise leaks the image's square corners past the parent's rounded clip. */
  border-radius: inherit;
}

.url_link_image[data-thumb-overlay] > .link img,
.url_link_image[data-thumb-overlay] > .link .lazyload,
.url_link_image[data-thumb-overlay] > .link .lazyloaded {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  margin: 0;
  padding: 0;
  border: 0;
  object-fit: cover;
  object-position: center top;
  transform: none !important;
  /* Match the (now square) frame so the composited <img> corners align with it. */
  border-radius: 0;
}

.url_link_image[data-thumb-overlay]:after {
  content: "";
  z-index: 2;
  background: linear-gradient(180deg, transparent 42%, rgba(0, 0, 0, 0.55) 68%, rgba(0, 0, 0, 0.94) 100%);
  display: block;
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
}

.url_link_image[data-thumb-overlay] .url_link_title {
  position: absolute;
  bottom: 8px;
  left: 0;
  z-index: 6;
  width: 100%;
  padding: 0 10px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  pointer-events: none;
}

.url_link_image[data-thumb-overlay] .url_link_title .link {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  flex: 0 1 auto;
  max-width: calc(100% - 2.75em - 8px);
  min-width: 0;
  color: var(--site-thumb-overlay-title, #fff) !important;
  -webkit-text-fill-color: var(--site-thumb-overlay-title, #fff);
  font-size: 15px;
  font-weight: 600;
  line-height: 1.2;
  text-align: center;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.95), 0 2px 10px rgba(0, 0, 0, 0.65);
  vertical-align: middle;
  pointer-events: auto;
}

.url_link_image[data-thumb-overlay] .url_link_title .url-link-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  flex: 0 1 auto;
  color: var(--site-thumb-overlay-title, #fff) !important;
  -webkit-text-fill-color: var(--site-thumb-overlay-title, #fff);
}

.url_link_image[data-thumb-overlay] .url-thumb-rank {
  position: static;
  flex: 0 0 auto;
  min-width: 1.75em;
  padding-right: 2px;
  color: var(--site-thumb-overlay-rank, #fff) !important;
  opacity: 0.88;
  font-size: 13px;
  font-weight: 400;
  line-height: 1;
  text-align: right;
  transform: none;
  pointer-events: none;
}

.url_link_image[data-thumb-overlay] .url_link_title .url-link-favicon,
.url_link_image[data-thumb-overlay] .url_link_title .entry-favicon-img {
  position: static !important;
  inset: auto !important;
  width: 16px !important;
  height: 16px !important;
  max-width: 16px;
  flex: 0 0 16px;
  display: block;
  border-radius: 50%;
  object-fit: cover;
  transform: none !important;
  margin: 0 0 1px;
  filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.85));
}

.url_link_image[data-thumb-overlay] .url_link_title .link:before {
  display: none !important;
  content: none !important;
}

body.categorypage .url_short_desc {
  color: var(--site-text-listing-muted, #96979f);
}

body.homepage .category-container .category-item::before {
  color: var(--site-text-rank, #c9c9c9);
}

.homepage .category-item-favicon {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  object-fit: contain;
  vertical-align: middle;
}

.category-sidebar .sidebar-favicon,
.category-sidebar .category-list-link .entry-favicon-img,
.homepage .category-item-favicon,
.homepage .category-item-site-link .entry-favicon-img {
  width: 16px !important;
  height: 16px !important;
  min-width: 16px;
  min-height: 16px;
  flex: 0 0 16px;
  object-fit: contain;
  display: inline-block;
}

.entry-favicon-img--missing {
  opacity: 0.55;
  object-fit: contain;
}

.homepage .category-item-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.singlepage .link-details h3 [data-site-anchor] {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.singlepage .link-details h3 .site-anchor-favicon {
  flex-shrink: 0;
}

/* Entry review — pros/cons cards live under the review text */
.singlepage .entry-pros-cons {
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid rgba(0, 0, 0, 0.08);
}

.singlepage .entry-pros-cons-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.singlepage .entry-pros-cons-col {
  padding: 14px 16px;
  border-radius: 8px;
  background: var(--site-entry-pros-cons-bg, #f7f8fb);
}

.singlepage .entry-pros-cons-col--pros {
  border-left: 3px solid var(--entry-pros-border, var(--site-link-accent, #2eaf61));
}

.singlepage .entry-pros-cons-col--cons {
  border-left: 3px solid var(--entry-cons-border, var(--site-link-negative, #d94c3d));
}

.singlepage .entry-pros-cons-heading {
  margin: 0 0 10px;
  padding: 0;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--site-entry-pros-cons-heading, #4e4e4e) !important;
  position: static !important;
}

.singlepage .entry-pros-cons-col .pros,
.singlepage .entry-pros-cons-col .cons {
  list-style: none;
  margin: 0;
  padding: 0;
}

.singlepage .entry-pros-cons-col .pros li,
.singlepage .entry-pros-cons-col .cons li {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin: 0 0 8px;
  padding: 0;
  font-size: 14px;
  line-height: 1.45;
  color: var(--site-entry-pros-cons-text, #4f4f4f);
  text-transform: none;
}

.singlepage .entry-pros-cons-col .pros li:last-child,
.singlepage .entry-pros-cons-col .cons li:last-child {
  margin-bottom: 0;
}

.singlepage .entry-pros-cons-col .pros li::before,
.singlepage .entry-pros-cons-col .cons li:not(.entry-pros-cons-empty)::before {
  content: "";
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  margin-top: 2px;
  background: var(--site-asset-icon-pros) center / contain no-repeat;
}

.singlepage .entry-pros-cons-col .cons li:not(.entry-pros-cons-empty)::before {
  background-image: var(--site-asset-icon-cons);
}

.singlepage .entry-pros-cons-empty {
  color: var(--site-entry-pros-cons-empty, #888);
  font-style: italic;
}

.singlepage .entry-rating-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid rgba(0, 0, 0, 0.06);
  width: 100%;
}

.singlepage-link-content .procons {
  max-height: none !important;
  overflow: visible !important;
  padding: 0 !important;
}

body.dark.singlepage .entry-pros-cons {
  border-top-color: rgba(255, 255, 255, 0.1);
}

body.dark.singlepage .entry-rating-bar {
  border-top-color: rgba(255, 255, 255, 0.08);
}

@media (max-width: 640px) {
  .singlepage .entry-pros-cons-grid {
    grid-template-columns: 1fr;
  }
}

@media (min-width: 992px) {
  .singlepage-link-content:not(.entry-review) .link-details {
    grid-area: 1 / 2 / 4 / 3 !important;
  }
}

.singlepage-link-content .btn-main {
  align-self: flex-start;
  width: 100%;
  max-width: 300px;
  min-height: 0;
  height: auto;
  box-sizing: border-box;
}

.singlepage-link-content .btn-main .category-emoji {
  font-size: 1.35rem;
  line-height: 1;
  flex-shrink: 0;
}

@media (min-width: 992px) {
  .singlepage-link-content .btn-main {
    display: none !important;
  }
}

.category-top-card .category-top-card-body {
  min-width: 0;
}

.category-top-card .category-top-card-list {
  flex: 1 1 auto;
  min-width: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-rows: none;
  grid-auto-rows: auto;
  grid-auto-flow: row;
  gap: 8px 10px;
  overflow: hidden;
}

.category-top-card .category-top-card-list-item-thumb {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 4px;
  min-width: 0;
  overflow: hidden;
}

.category-top-card .category-top-card-list-item-thumb.category-top-card-list-item-favicon::before {
  display: none !important;
}

.category-top-card .category-top-card-thumb-media {
  flex-shrink: 0;
  width: 100%;
  max-width: 100%;
  aspect-ratio: var(--site-thumb-aspect);
  border-radius: 6px;
  overflow: hidden;
  background: #1a1d24;
  box-shadow: var(--site-thumb-shadow);
}

.category-top-card .entry-thumb-mini {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
}

.category-top-card .entry-thumb-mini--placeholder,
.category-top-card .entry-thumb-mini.site-thumb-placeholder-fallback {
  object-fit: cover;
  object-position: center top;
  background: #1a1d24;
}

.category-top-card .category-top-card-list-item-name {
  min-width: 0;
  max-width: 100%;
  font-size: 12px;
  line-height: 1.25;
  text-align: center;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.category-top-card .category-top-card-amount {
  flex-shrink: 0;
  align-self: center;
}

.icon-site-list-item {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
}

.icon-site-favicon-img {
  width: 16px;
  height: 16px;
  object-fit: contain;
}

.url-link-favicon {
  width: 16px;
  height: 16px;
  vertical-align: -3px;
}

.categorypage .url_link_image {
  position: relative;
  overflow: hidden;
  aspect-ratio: var(--site-thumb-aspect);
  height: auto;
  width: 100%;
  padding-bottom: 0;
  isolation: isolate;
  contain: layout;
  border-radius: 0;
  background: #000 !important;
}

.categorypage .url_link_image:before {
  display: none;
}

.categorypage .url_link_image:after {
  content: "";
  z-index: 2;
  background: linear-gradient(180deg, transparent 42%, rgba(0, 0, 0, 0.55) 68%, rgba(0, 0, 0, 0.94) 100%);
  display: block;
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
}

.categorypage .url_link_image .url-thumb-rank {
  position: static;
  flex: 0 0 auto;
  min-width: 1.75em;
  padding-right: 2px;
  color: rgba(255, 255, 255, 0.88) !important;
  font-size: 13px;
  font-weight: 400;
  line-height: 1;
  text-align: right;
  transform: none;
  pointer-events: none;
}

.categorypage .url_link_image .url_link_title {
  position: absolute;
  bottom: 8px;
  left: 0;
  z-index: 6;
  width: 100%;
  padding: 0 10px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  pointer-events: none;
}

.categorypage .url_link_image .url_link_title .link {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  flex: 0 1 auto;
  max-width: calc(100% - 2.75em - 8px);
  min-width: 0;
  color: #fff !important;
  -webkit-text-fill-color: #fff;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.2;
  text-align: center;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.95), 0 2px 10px rgba(0, 0, 0, 0.65);
  vertical-align: middle;
  pointer-events: auto;
}

.categorypage .url_link_image .url_link_title .url-link-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  flex: 0 1 auto;
  color: #fff !important;
  -webkit-text-fill-color: #fff;
}

.categorypage .url_link_image > .link {
  display: block;
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  padding-top: 0;
  z-index: 1;
  /* Match the frame rounding so the image corners are clipped and don't leak white. */
  border-radius: inherit;
  overflow: hidden;
}

.categorypage .url_link_image > .link .site-thumb-placeholder,
.categorypage .url_link_image > .link .site-thumb-placeholder--small,
.categorypage .url_link_image > .link .example-thumb-img.site-thumb-placeholder-fallback {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  min-height: 0 !important;
  max-height: none;
  margin: 0;
  padding: 0;
  border-radius: 0;
  transform: none;
  overflow: hidden;
  object-fit: cover;
}

.categorypage .url_link_image > .link .site-thumb-placeholder-name {
  display: none;
}

/* Category intro/description – keep full text visible (no shadow/overflow clip) */
body.categorypage .category-content {
  overflow: visible;
}

@media (min-width: 992px) {
  body.categorypage .category-content .category-desc-wrapper {
    max-height: none;
    margin: 0 5px 10px;
    padding: 0;
    border: 0;
    box-shadow: none;
    position: relative;
    overflow: visible;
    box-sizing: border-box;
    width: calc(100% - 10px);
  }

  body.categorypage .category-content .category-desc-wrapper .category-desc {
    box-sizing: border-box;
    max-height: 230px;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding: 2px 12px 22px;
  }
}

body.categorypage .category-content .category-desc-wrapper.v-scroll:before,
body.categorypage .category-content .category-desc-wrapper.v-scroll:after,
body.categorypage .category-content .category-desc-wrapper.bottom-shadow:after {
  display: none !important;
}

body.categorypage .category-content .category-desc-wrapper .category-desc h3 {
  margin: 0 0 6px;
}

body.categorypage .category-content .category-desc-wrapper .category-desc .category-desc-intro-only {
  display: none;
}

body.categorypage .category-content .category-desc-wrapper .category-desc p:last-child {
  margin-bottom: 0;
}

@media (min-width: 992px) {
  .homepage .category-container {
    grid-template-rows: auto 1fr;
  }

  .homepage .category-container .category-header {
    padding-top: 0;
    padding-bottom: 0;
  }

  .homepage .category-container .category-header h2 {
    height: auto;
    min-height: 40px;
    line-height: 1.2;
    padding: 6px 10px 10px;
    flex-wrap: nowrap;
    box-sizing: border-box;
  }

  .homepage .category-container .category-header h2 .category-icon-image,
  .homepage .category-container .category-header h2 .category-icon-emoji-only {
    flex-shrink: 0;
  }

  .homepage .category-container .category-header .category-header-desc-disclosure {
    display: none !important;
  }

  body.categorypage .category-desc-toggle {
    display: none;
  }

  body.categorypage .category-desc-disclosure .category-desc {
    display: block !important;
  }

  body.categorypage .category-content .category-desc-wrapper .category-desc {
    max-height: 230px;
    padding: 2px 12px 22px;
  }
}

@media (min-width: 1400px) {
  body.categorypage .category-content .category-desc-wrapper .category-desc {
    max-height: 250px;
  }
}

body.singlepage .url_links_wrapper .url_link_image {
  aspect-ratio: var(--site-thumb-aspect);
  height: auto;
  padding-bottom: 0;
  border-radius: 0;
  overflow: hidden;
  background: #000 !important;
}

body.singlepage .url_links_wrapper .url_link_image > .link {
  display: block;
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  padding-top: 0;
  z-index: 1;
  border-radius: inherit;
  overflow: hidden;
}

body.singlepage .url_links_wrapper .url_link_image > .link img,
body.singlepage .url_links_wrapper .url_link_image > .link .lazyload,
body.singlepage .url_links_wrapper .url_link_image > .link .lazyloaded {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100% !important;
  object-fit: cover;
  object-position: center top;
  border-radius: 0;
}

.categorypage .url_link_image .url_link_title .link:before {
  display: none !important;
  content: none !important;
}

.categorypage .url_link_image .url_link_title .url-link-favicon,
.categorypage .url_link_image .url_link_title .entry-favicon-img {
  position: static !important;
  inset: auto !important;
  width: 16px !important;
  height: 16px !important;
  max-width: 16px;
  flex: 0 0 16px;
  display: block;
  border-radius: 50%;
  object-fit: cover;
  transform: none !important;
  margin: 0 0 1px;
}

.categorypage .url_short_desc {
  margin-top: 6px;
  padding: 2px 8px 8px;
  font-size: 12px;
  line-height: 1.45;
  box-sizing: border-box;
  width: 100%;
  overflow-wrap: anywhere;
  word-wrap: break-word;
}

body.categorypage .url_link_container {
  overflow: visible;
}

@media (min-width: 992px) {
  body.categorypage .url_links_wrapper,
  body.singlepage .url_links_wrapper {
    display: block;
    width: calc(100% + 10px);
    margin: 0 -5px;
    padding: 0;
    font-size: 0;
  }

  body.categorypage .url_link_container,
  body.singlepage .url_links_wrapper .url_link_container {
    display: inline-block;
    vertical-align: top;
    width: 33.333333%;
    padding: 10px 5px 0;
    font-size: 14px;
    position: relative;
  }

  body.categorypage .url_links_wrapper.thumbs-list-content .url_link_container,
  body.singlepage .url_links_wrapper.thumbs-list-content .url_link_container {
    width: 33.333333%;
    padding: 10px 5px 0;
  }

  body.categorypage .url_link_container:hover .url_link_image > .link img,
  body.categorypage .url_link_container:hover .url_link_image > .link .lazyload,
  body.categorypage .url_link_container:hover .url_link_image > .link .lazyloaded {
    transform: none !important;
  }

  body.categorypage .url_link_container:hover .url_link_image[data-thumb-overlay],
  body.singlepage .url_links_wrapper .url_link_container:hover .url_link_image {
    box-shadow: var(--site-thumb-shadow-hover);
  }
}

@media (max-width: 639px) {
  body.categorypage .link-container.container,
  body.singlepage .link-container.container {
    padding-inline: 10px;
  }

  body.categorypage .url_link_image .url_link_title .link,
  body.singlepage .url_links_wrapper .url_link_image .url_link_title .link {
    font-size: 17px;
  }

  body.categorypage .url_short_desc,
  body.singlepage .url_links_wrapper .url_short_desc {
    font-size: 14px;
  }
}

@media (min-width: 992px) {
  .singlepage .top-bar-review.sticky {
    z-index: 48;
  }
}

.singlepage .link-thumbs-holder.has-sliders:not([data-site-native-carousel]) .swiper-slide {
  width: auto;
}

/* Native review carousel — one full-width slide; let Swiper size the track */
.singlepage .link-thumbs-holder[data-site-native-carousel] {
  width: 100%;
  max-width: 100%;
  margin-left: 0;
  margin-right: 0;
  margin-bottom: 10px;
  overflow: hidden;
  overflow-x: clip;
  isolation: isolate;
  /* Keep vertical page scroll free; only steal horizontal swipes. */
  touch-action: pan-y pinch-zoom;
  overflow-anchor: none;
}

.singlepage .link-thumbs-holder[data-site-native-carousel] .swiper-slide,
.singlepage .link-thumbs-holder[data-site-native-carousel].has-sliders .swiper-slide {
  box-sizing: border-box;
  margin: 0 !important;
  left: auto !important;
  flex-shrink: 0;
}

/*
 * Mobile peek fallback width (matches slidesPerView: 1.4). Keep this WITHOUT
 * !important so JS can lock a precise px width. Never use `width: auto` here —
 * flex slides collapse to ~0 and the screenshot vanishes after first paint.
 */
@media (max-width: 991px) {
  .singlepage .link-thumbs-holder[data-site-native-carousel] .swiper-slide,
  .singlepage .link-thumbs-holder[data-site-native-carousel].has-sliders .swiper-slide {
    flex: 0 0 calc(100% / 1.4);
    width: calc(100% / 1.4);
    max-width: calc(100% / 1.4);
  }
}

@media (min-width: 992px) {
  .singlepage .link-thumbs-holder[data-site-native-carousel] .swiper-slide,
  .singlepage .link-thumbs-holder[data-site-native-carousel].has-sliders .swiper-slide {
    width: 100% !important;
  }
}

.singlepage .entry-review-carousel .link-thumb {
  position: relative;
  border: 3px solid #cecece;
  border-radius: 5px;
  overflow: hidden;
  background: #fff;
}

.singlepage .entry-review-carousel .link-thumb,
.singlepage .entry-review-carousel .big-thumb-holder-wrap {
  width: 100%;
}

.singlepage .entry-review-carousel .link-thumb .big-thumb-holder {
  width: 100%;
  position: relative;
  overflow: hidden;
}

.singlepage .entry-review-carousel .example-thumb-img {
  width: 100%;
}

@media (min-width: 992px) {
  body.singlepage .singlepage-link-content.entry-review {
    display: block;
    width: 100%;
    max-width: min(var(--container-width, 1158px), calc(100vw - 24px));
    margin-left: auto;
    margin-right: auto;
  }

  body.singlepage .singlepage-link-content.entry-review .entry-review-card.link-details {
    grid-area: auto !important;
    width: 100%;
  }

  body.singlepage .entry-review-media {
    padding: 20px 24px;
    border-right: 1px solid rgba(0, 0, 0, 0.06);
  }

  body.singlepage .entry-review-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.12fr) minmax(300px, 0.88fr);
    align-items: stretch;
  }

  body.singlepage .entry-review-hero-panel {
    padding: 22px 20px;
    border-bottom: none;
  }

  body.singlepage .entry-review-meta {
    border-top: 1px solid rgba(0, 0, 0, 0.06);
  }
}

.singlepage .entry-review-carousel .link-thumbs-holder .review-rank-prev,
.singlepage .entry-review-carousel .link-thumbs-holder .review-rank-next {
  z-index: 12;
  pointer-events: auto;
  cursor: pointer;
  display: flex !important;
  top: 42%;
  margin-top: 0;
}

.singlepage .entry-review-carousel .link-thumbs-holder.has-sliders .review-rank-prev {
  left: 0;
  right: auto;
  transform: translate(10px, -50%);
}

.singlepage .entry-review-carousel .link-thumbs-holder.has-sliders .review-rank-next {
  right: 0;
  left: auto;
  transform: translate(-10px, -50%);
}

.singlepage .entry-review-carousel .link-thumbs-holder .swiper-pagination,
.singlepage .entry-review-carousel .link-thumbs-holder .swiper-pagination-fraction {
  --swiper-pagination-top: auto;
  --swiper-pagination-bottom: 0px;
  z-index: 1;
  color: #767676;
  background-color: #f2f3f6;
  border: 3px solid #cecece;
  border-top: 0;
  border-radius: 0 0 6px 6px;
  justify-content: center;
  align-items: center;
  width: auto;
  height: 24px;
  padding: 2px 10px 0;
  font-size: 14px;
  display: flex;
  position: relative;
  transform: translateY(-3px);
  margin-inline: auto;
  pointer-events: none;
}

@media (max-width: 991px) {
  .singlepage .entry-review-carousel .link-thumbs-holder .swiper-pagination,
  .singlepage .entry-review-carousel .link-thumbs-holder .swiper-pagination-fraction {
    width: 100%;
  }
}

@media (min-width: 992px) {
  .singlepage .entry-review-carousel .link-thumbs-holder .swiper-pagination,
  .singlepage .entry-review-carousel .link-thumbs-holder .swiper-pagination-fraction {
    width: 100%;
  }
}

.singlepage .link-thumbs-holder .swiper-pagination-fraction {
  pointer-events: none;
}

.singlepage .top-bar-review .category-menu .scrollbox {
  overflow-x: hidden;
  overflow-y: auto;
}

.singlepage .link-thumbnail .example-thumb-img.site-thumb-placeholder-fallback,
.singlepage .link-thumbnail .example-thumb-img[src*="thumb-placeholder"] {
  object-fit: cover;
  background: #1a1d24;
}

.categorypage .url_link_image .example-thumb-img.site-thumb-placeholder-fallback,
.search-view .url_link_image .example-thumb-img.site-thumb-placeholder-fallback {
  object-fit: cover;
  width: 100%;
  height: 100%;
  background: #1a1d24;
}

.site-drawer-body {
  padding: 0;
  color: var(--site-drawer-body-text, #4e4e4e);
  background: var(--site-drawer-panel-bg, #fff);
}

.site-popup-modal {
  z-index: 120;
}

body.site-popup-open {
  overflow: hidden;
}

/* ==========================================================================
   Disclaimer modal (rebuilt)
   ========================================================================== */

.site-disclaimer-modal {
  position: fixed;
  inset: 0;
  z-index: 125;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 20px;
}

.site-disclaimer-modal[aria-hidden="false"],
.site-disclaimer-modal.is-open {
  display: flex;
}

.site-disclaimer-overlay {
  position: absolute;
  inset: 0;
  background: rgba(17, 19, 24, 0.58);
  backdrop-filter: blur(2px);
  opacity: 0;
  transition: opacity 0.22s ease;
}

.site-disclaimer-modal[aria-hidden="false"] .site-disclaimer-overlay,
.site-disclaimer-modal.is-open .site-disclaimer-overlay {
  opacity: 1;
}

.site-disclaimer-dialog {
  position: relative;
  z-index: 1;
  width: min(480px, 100%);
  max-height: min(92vh, 640px);
  display: flex;
  flex-direction: column;
  transform: translateY(10px) scale(0.98);
  opacity: 0;
  transition: transform 0.24s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.22s ease;
}

.site-disclaimer-modal[aria-hidden="false"] .site-disclaimer-dialog,
.site-disclaimer-modal.is-open .site-disclaimer-dialog {
  transform: translateY(0) scale(1);
  opacity: 1;
}

.site-disclaimer-shell {
  display: flex;
  flex-direction: column;
  min-height: 0;
  max-height: inherit;
  background:
    linear-gradient(180deg, rgba(255, 151, 1, 0.1) 0%, rgba(255, 151, 1, 0) 72px),
    #fff;
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 16px;
  box-shadow: 0 24px 60px rgba(15, 23, 42, 0.28);
  overflow: hidden;
}

.site-disclaimer-shell::before {
  content: '';
  display: block;
  height: 3px;
  background: linear-gradient(90deg, var(--site-brand-primary, #ff9701), #ffb84a 55%, transparent);
}

.site-disclaimer-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 18px 20px 10px;
}

.site-disclaimer-kicker {
  margin: 0 0 4px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #96979f;
}

.site-disclaimer-title {
  margin: 0;
  font-size: 20px;
  font-weight: 600;
  line-height: 1.25;
  color: #1f2430;
}

.site-disclaimer-close {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  border: 0;
  border-radius: 10px;
  background: rgba(15, 23, 42, 0.05);
  color: #4e4e4e;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}

.site-disclaimer-close:hover {
  background: rgba(15, 23, 42, 0.1);
}

.site-disclaimer-body {
  min-height: 0;
  overflow: auto;
  padding: 4px 20px 20px;
  -webkit-overflow-scrolling: touch;
}

.site-disclaimer-copy {
  color: #4e4e4e;
  font-size: 14.5px;
  line-height: 1.65;
}

.site-disclaimer-copy p {
  margin: 0 0 12px;
}

.site-disclaimer-copy p:last-child {
  margin-bottom: 0;
}

.site-disclaimer-actions {
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid rgba(15, 23, 42, 0.06);
}

.site-disclaimer-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 18px;
  border-radius: 10px;
  border: 0;
  font: inherit;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  text-decoration: none;
  transition: background 0.15s ease, transform 0.15s ease;
}

.site-disclaimer-btn--primary {
  color: #fff;
  background: var(--site-brand-primary, #ff9701);
}

.site-disclaimer-btn--primary:hover {
  filter: brightness(0.96);
}

.site-disclaimer-btn--primary:active {
  transform: translateY(1px);
}

.site-disclaimer-links {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 8px 10px;
}

.site-disclaimer-link {
  color: #5b6578;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: color 0.15s ease, border-color 0.15s ease;
}

.site-disclaimer-link:hover,
.site-disclaimer-link:focus-visible {
  color: var(--site-brand-primary, #ff9701);
  border-bottom-color: color-mix(in srgb, var(--site-brand-primary, #ff9701) 55%, transparent);
}

.site-disclaimer-link-sep {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #c9ced8;
}

body.dark .site-disclaimer-shell {
  background:
    linear-gradient(180deg, rgba(255, 151, 1, 0.12) 0%, rgba(255, 151, 1, 0) 72px),
    #1c1f27;
  border-color: rgba(255, 255, 255, 0.08);
}

body.dark .site-disclaimer-title {
  color: #f3f4f6;
}

body.dark .site-disclaimer-kicker,
body.dark .site-disclaimer-copy {
  color: #a7adba;
}

body.dark .site-disclaimer-close {
  background: rgba(255, 255, 255, 0.06);
  color: #d1d5db;
}

body.dark .site-disclaimer-close:hover {
  background: rgba(255, 255, 255, 0.12);
}

body.dark .site-disclaimer-actions {
  border-top-color: rgba(255, 255, 255, 0.08);
}

body.dark .site-disclaimer-link {
  color: #b6bcc8;
}

body.dark .site-disclaimer-link-sep {
  background: #5b6578;
}

@media (prefers-reduced-motion: reduce) {
  .site-disclaimer-overlay,
  .site-disclaimer-dialog {
    transition: none;
  }
}

@media (max-width: 480px) {
  .site-disclaimer-modal {
    padding: 12px;
    align-items: flex-end;
  }

  .site-disclaimer-dialog {
    width: 100%;
  }

  .site-disclaimer-shell {
    border-radius: 16px 16px 12px 12px;
  }
}

/* ==========================================================================
   Report modal (rebuilt)
   ========================================================================== */

.site-report-modal {
  position: fixed;
  inset: 0;
  z-index: 130;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 20px;
}

.site-report-modal[aria-hidden="false"],
.site-report-modal.is-open {
  display: flex;
}

.site-report-overlay {
  position: absolute;
  inset: 0;
  background: rgba(17, 19, 24, 0.58);
  backdrop-filter: blur(2px);
}

.site-report-dialog {
  position: relative;
  z-index: 1;
  width: min(520px, 100%);
  max-height: min(92vh, 760px);
  display: flex;
  flex-direction: column;
}

.site-report-shell {
  display: flex;
  flex-direction: column;
  min-height: 0;
  max-height: inherit;
  background: #fff;
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 16px;
  box-shadow: 0 24px 60px rgba(15, 23, 42, 0.28);
  overflow: hidden;
}

.site-report-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 20px 20px 12px;
  border-bottom: 1px solid rgba(15, 23, 42, 0.06);
}

.site-report-kicker {
  margin: 0 0 4px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #96979f;
}

.site-report-title {
  margin: 0;
  font-size: 20px;
  font-weight: 600;
  line-height: 1.25;
  color: #1f2430;
}

.site-report-entry {
  margin: 6px 0 0;
  font-size: 14px;
  color: var(--site-brand-primary, #ff9701);
  font-weight: 600;
}

.site-report-close {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  border: 0;
  border-radius: 10px;
  background: rgba(15, 23, 42, 0.05);
  color: #4e4e4e;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}

.site-report-close:hover {
  background: rgba(15, 23, 42, 0.1);
}

.site-report-steps {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 20px 4px;
}

.site-report-step-dot {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 700;
  color: #96979f;
  background: #f1f3f7;
}

.site-report-step-dot.is-active,
.site-report-step-dot.is-done {
  color: #fff;
  background: var(--site-brand-primary, #ff9701);
}

.site-report-step-line {
  width: 28px;
  height: 2px;
  background: #e5e7eb;
}

.site-report-panels {
  min-height: 0;
  overflow: auto;
  padding: 12px 20px 20px;
  -webkit-overflow-scrolling: touch;
}

.site-report-panel[hidden] {
  display: none !important;
}

.site-report-panel-heading {
  margin: 0 0 8px;
  font-size: 16px;
  font-weight: 600;
  color: #1f2430;
}

.site-report-panel-lead {
  margin: 0 0 14px;
  font-size: 14px;
  line-height: 1.45;
  color: #667085;
}

.site-report-panel-lead p {
  margin: 0;
}

.site-report-reasons {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.site-report-reason {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  border: 1px solid rgba(15, 23, 42, 0.1);
  border-radius: 12px;
  background: #fafbfc;
  text-align: left;
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease, transform 0.15s ease;
}

.site-report-reason:hover {
  border-color: color-mix(in srgb, var(--site-brand-primary, #ff9701) 55%, #d1d5db);
  background: #fff;
  transform: translateY(-1px);
}

.site-report-reason-icon {
  flex-shrink: 0;
  width: 34px;
  height: 34px;
  border-radius: 10px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 18px 18px;
}

.site-report-reason-icon--red { background-color: #fee2e2; }
.site-report-reason-icon--violet { background-color: #ede9fe; }
.site-report-reason-icon--blue { background-color: #dbeafe; }
.site-report-reason-icon--teal { background-color: #ccfbf1; }
.site-report-reason-icon--amber { background-color: #ffedd5; }
.site-report-reason-icon--green { background-color: #dcfce7; }

.site-report-reason-label {
  flex: 1;
  min-width: 0;
  font-size: 14px;
  font-weight: 600;
  color: #2f2f2f;
}

.site-report-reason-go {
  width: 8px;
  height: 8px;
  border-right: 2px solid #c4c7cf;
  border-bottom: 2px solid #c4c7cf;
  transform: rotate(-45deg);
  flex-shrink: 0;
}

.site-report-back {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 0 0 12px;
  padding: 0;
  border: 0;
  background: transparent;
  color: #667085;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
}

.site-report-back:hover {
  color: var(--site-brand-primary, #ff9701);
}

.site-report-form {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.site-report-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.site-report-label {
  font-size: 13px;
  font-weight: 600;
  color: #374151;
}

.site-report-label em {
  color: #dc2626;
  font-style: normal;
}

.site-report-control {
  width: 100%;
  box-sizing: border-box;
  border: 1px solid #d8dde6;
  border-radius: 10px;
  background: #fff;
  color: #1f2430;
  font: inherit;
  font-size: 14px;
  padding: 11px 12px;
  outline: none;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.site-report-control:focus {
  border-color: var(--site-brand-primary, #ff9701);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--site-brand-primary, #ff9701) 22%, transparent);
}

.site-report-control.is-invalid {
  border-color: #ef4444;
  box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.15);
}

.site-report-textarea,
textarea.site-report-control {
  resize: vertical;
  min-height: 110px;
}

.site-report-meta {
  align-self: flex-end;
  font-size: 12px;
  color: #96979f;
}

.site-report-meta.is-near-limit { color: #b45309; }
.site-report-meta.is-at-limit { color: #dc2626; }

.site-report-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.site-report-error {
  margin: 0;
  padding: 10px 12px;
  border-radius: 10px;
  background: #fef2f2;
  border: 1px solid #fecaca;
  color: #b91c1c;
  font-size: 13px;
}

.site-report-confirm {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 13px;
  color: #4b5563;
  cursor: pointer;
}

.site-report-confirm input {
  margin-top: 2px;
}

.site-report-submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 18px;
  border: 0;
  border-radius: 10px;
  background: var(--site-brand-primary, #ff9701);
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
}

.site-report-submit:hover {
  filter: brightness(1.04);
}

.site-report-submit:disabled,
.site-report-form.is-loading .site-report-submit {
  opacity: 0.65;
  cursor: wait;
}

.site-report-honeypot {
  position: absolute !important;
  left: -9999px !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.site-report-panel--success {
  text-align: center;
  padding: 18px 8px 8px;
}

.site-report-success-mark {
  width: 56px;
  height: 56px;
  margin: 0 auto 14px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 26px;
  font-weight: 700;
  color: #166534;
  background: #dcfce7;
}

.site-report-success-note {
  margin: 0 0 16px;
  font-size: 13px;
  color: #667085;
}

body.dark .site-report-shell {
  background: #2a2b31;
  border-color: rgba(255, 255, 255, 0.08);
}

body.dark .site-report-title,
body.dark .site-report-panel-heading,
body.dark .site-report-reason-label,
body.dark .site-report-label {
  color: #f3f4f6;
}

body.dark .site-report-kicker,
body.dark .site-report-panel-lead,
body.dark .site-report-meta,
body.dark .site-report-back,
body.dark .site-report-confirm,
body.dark .site-report-success-note {
  color: #b8b8b8;
}

body.dark .site-report-top {
  border-bottom-color: rgba(255, 255, 255, 0.08);
}

body.dark .site-report-close {
  background: rgba(255, 255, 255, 0.08);
  color: #f3f4f6;
}

body.dark .site-report-reason {
  background: #34363e;
  border-color: rgba(255, 255, 255, 0.1);
}

body.dark .site-report-control {
  background: #1f2127;
  border-color: rgba(255, 255, 255, 0.12);
  color: #f3f4f6;
}

body.dark .site-report-step-dot {
  background: #3a3c45;
  color: #b8b8b8;
}

body.dark .site-report-step-dot.is-active,
body.dark .site-report-step-dot.is-done {
  background: var(--site-brand-primary, #ff9701);
  color: #fff;
}

@media (max-width: 640px) {
  .site-report-modal {
    padding: 0;
    align-items: flex-end;
  }

  .site-report-dialog {
    width: 100%;
    max-height: 92vh;
  }

  .site-report-shell {
    border-radius: 18px 18px 0 0;
  }

  .site-report-grid {
    grid-template-columns: 1fr;
  }

  .site-report-submit {
    width: 100%;
  }
}

@media (max-width: 991px) {
  .popup-hide-mobile {
    display: none !important;
  }
}

@media (min-width: 992px) {
  .popup-hide-desktop {
    display: none !important;
  }
}

.extension-widget[data-site-extension-widget] .extension-widget-circle,
.extension-widget--has-custom-icon .extension-widget-circle {
  overflow: hidden;
  background: transparent !important;
}

.extension-widget[data-site-extension-widget] .extension-widget-circle-link,
.extension-widget--has-custom-icon .extension-widget-circle-link {
  background-color: transparent !important;
}

/* Site-managed promo bubble uses an <img>; hide vendor mascot painted on ::after */
.extension-widget[data-site-extension-widget] .extension-widget-circle::after,
.extension-widget[data-site-extension-widget] .extension-widget-circle::before {
  display: none !important;
  content: none !important;
  background: none !important;
  background-image: none !important;
}

.extension-widget[data-site-extension-widget] .extension-widget-circle-svg {
  display: none !important;
}

.extension-widget-custom-icon {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 100%;
  display: block;
}

.extension-widget[data-site-extension-widget] .extension-widget-custom-icon,
.extension-widget--has-custom-icon .extension-widget-custom-icon {
  object-fit: contain;
  border-radius: 0;
}

.extension-widget-default-icon {
  object-fit: contain;
  padding: 6px;
}

/* Site-managed chat widget: custom upload uses inline bg; default uses site mascot token */
.chat-widget[data-site-chat-widget]:not(.chat-widget--custom-mascot) .chat-widget-mascot {
  background-image: var(--site-asset-mascot) !important;
}

.chat-widget[data-site-chat-widget] .chat-widget-mascot,
.chat-widget--custom-mascot .chat-widget-mascot {
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
}

@media (min-width: 992px) {
  .chat-widget.chat-widget--text-label {
    height: auto !important;
    min-height: 110px;
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    padding-bottom: 0;
    overflow: visible;
  }

  .chat-widget.chat-widget--text-label .chat-widget-mascot {
    position: absolute;
    top: -36px;
    bottom: auto;
    left: -8px;
  }

  .chat-widget-footer.chat-widget-footer--text {
    position: relative !important;
    top: auto !important;
    bottom: auto !important;
    left: auto !important;
    transform: none !important;
    background: var(--site-chat-widget-footer-bg, #ff9701) !important;
    background-image: none !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    color: var(--site-chat-widget-footer-text, #1a1a1a);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.03em;
    line-height: 1.35;
    text-align: center;
    text-transform: none;
    white-space: pre-line;
    overflow: visible;
    text-overflow: unset;
    width: 90px !important;
    min-width: 90px;
    max-width: 120px;
    height: auto !important;
    min-height: 48px;
    padding: 8px 6px;
    box-sizing: border-box;
    word-break: break-word;
    writing-mode: horizontal-tb;
    flex-shrink: 0;
  }

  .chat-widget-footer.chat-widget-footer--text::before {
    content: none !important;
  }
}

body.dark .chat-widget-footer.chat-widget-footer--text {
  background: var(--site-chat-widget-footer-bg, #2a2b31) !important;
  color: var(--site-chat-widget-footer-text, #ffffff) !important;
}

body.admin-layout-mode .popup-admin-preview-disabled {
  outline: 2px dashed rgba(255, 151, 1, 0.75);
  outline-offset: 3px;
}

body.admin-layout-mode .popup-admin-preview-disabled::after {
  content: "Disabled";
  position: absolute;
  top: 0;
  right: 0;
  z-index: 2;
  padding: 2px 8px;
  border-radius: 0 0 0 8px;
  background: rgba(255, 151, 1, 0.92);
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  pointer-events: none;
}

body.admin-layout-mode .drawer.popup-admin-preview-disabled,
body.admin-layout-mode .extension-widget.popup-admin-preview-disabled,
body.admin-layout-mode .chat-widget.popup-admin-preview-disabled,
body.admin-layout-mode .age-limit-modal.popup-admin-preview-disabled,
body.admin-layout-mode .block-suggest-lang.popup-admin-preview-disabled {
  position: relative;
}

body.admin-layout-mode .admin-popup-preview-actions {
  display: none;
}

body.admin-layout-mode .admin-layout-bar-previews[open] .admin-popup-preview-actions {
  display: flex;
}

body.admin-layout-mode .admin-popup-preview-btn {
  padding: 4px 8px;
  border-radius: 5px;
  border: 1px solid rgba(255, 255, 255, 0.35);
  background: rgba(255, 255, 255, 0.12);
  color: #fff;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
  cursor: pointer;
}

body.admin-layout-mode .admin-popup-preview-btn:hover {
  background: rgba(255, 255, 255, 0.2);
}

/* Footer social icon editing in layout mode */
body.admin-layout-mode .footer-bottom {
  position: relative;
  z-index: 2;
}

body.admin-layout-mode .admin-footer-social-wrap {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  width: 100%;
  margin-bottom: 12px;
}

body.admin-layout-mode .admin-footer-social-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 8px 12px;
  width: 100%;
  max-width: 960px;
  padding: 10px 14px;
  border-radius: 10px;
  background: rgba(17, 24, 39, 0.92);
  border: 1px solid rgba(255, 151, 1, 0.45);
  color: #e5e7eb;
  font-size: 13px;
}

body.admin-layout-mode .admin-footer-social-bar-label {
  font-weight: 700;
  color: #ffba01;
}

body.admin-layout-mode .admin-footer-social-bar-hint {
  color: #9ca3af;
}

body.admin-layout-mode .admin-footer-social-add,
body.admin-layout-mode .admin-footer-social-save {
  border: none;
  border-radius: 6px;
  padding: 6px 12px;
  background: #ff9701;
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
}

body.admin-layout-mode .admin-footer-social-save:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

body.admin-layout-mode .admin-footer-social-save:not(:disabled):hover,
body.admin-layout-mode .admin-footer-social-add:hover {
  background: #e88700;
}

body.admin-layout-mode .admin-footer-social-bar-actions {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-left: auto;
}

body.admin-layout-mode .admin-footer-social-save-status {
  font-size: 12px;
  color: #9ca3af;
}

body.admin-layout-mode .admin-footer-social-save-status.is-dirty {
  color: #fbbf24;
}

body.admin-layout-mode .admin-footer-social-save-status.is-saving {
  color: #93c5fd;
}

body.admin-layout-mode .admin-footer-social-save-status.is-saved {
  color: #86efac;
}

body.admin-layout-mode .admin-footer-social-save-status.is-error {
  color: #fca5a5;
}

body.admin-layout-mode .admin-footer-social-admin-link {
  color: #ffba01;
  font-size: 12px;
  text-decoration: underline;
}

body.admin-layout-mode .admin-footer-social-wrap > .socials {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-start;
  gap: 10px 12px;
  list-style: none;
  padding: 0;
  margin: 0;
  position: relative;
}

body.admin-layout-mode .admin-footer-social-item {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 8px 10px 6px;
  border-radius: 8px;
  outline: 1px dashed rgba(255, 151, 1, 0.35);
  outline-offset: 2px;
  transition: transform 260ms cubic-bezier(0.22, 1, 0.36, 1), outline-color 0.2s ease, box-shadow 0.2s ease;
  z-index: 1;
}

body.admin-layout-mode .admin-footer-social-item:hover,
body.admin-layout-mode .admin-footer-social-item:focus-within {
  z-index: 3;
  outline-color: rgba(255, 151, 1, 0.7);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
}

body.admin-layout-mode .admin-footer-social-item.admin-sortable-drop-target {
  outline-color: rgba(255, 151, 1, 0.85);
  outline-width: 2px;
  box-shadow: 0 0 0 4px rgba(255, 151, 1, 0.15);
}

body.admin-layout-mode .admin-footer-social-item.admin-footer-social-dragging {
  z-index: 5;
}

body.admin-layout-mode .admin-footer-social-tools {
  display: flex;
  align-items: center;
  gap: 4px;
}

body.admin-layout-mode .admin-footer-social-drag-handle,
body.admin-layout-mode .admin-footer-social-edit-btn,
body.admin-layout-mode .admin-footer-social-delete-btn {
  border: none;
  border-radius: 5px;
  padding: 2px 8px;
  background: rgba(17, 24, 39, 0.88);
  color: #fff;
  font-size: 11px;
  font-weight: 600;
  cursor: pointer;
  line-height: 1.5;
}

body.admin-layout-mode .admin-footer-social-drag-handle {
  cursor: grab;
  touch-action: none;
}

body.admin-layout-mode .admin-footer-social-drag-handle:hover {
  background: rgba(255, 151, 1, 0.25);
  color: #ffba01;
}

body.admin-layout-mode .admin-footer-social-delete-btn {
  color: #fca5a5;
}

body.admin-layout-mode .admin-footer-social-item--locked .admin-footer-social-delete-btn {
  display: none;
}

body.admin-layout-mode .admin-footer-social-item .socials-link {
  pointer-events: none;
}

body.admin-layout-mode .admin-social-icon-preview {
  width: 56px;
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  --social-icon-scale: 1;
}

body.admin-layout-mode .admin-social-icon-preview img {
  width: calc(40px * var(--social-icon-scale, 1));
  height: calc(40px * var(--social-icon-scale, 1));
  max-width: calc(56px * var(--social-icon-scale, 1));
  max-height: calc(56px * var(--social-icon-scale, 1));
  object-fit: contain;
}

body.admin-layout-mode .admin-social-icon-scale-field {
  margin-top: 4px;
}

body.admin-layout-mode .admin-social-icon-scale-field input[type="range"] {
  width: 100%;
  margin-top: 6px;
  accent-color: #ff9701;
}

body.admin-social-editing .drawer-opener,
body.admin-social-editing .extension-widget,
body.admin-social-editing .chat-widget,
body.admin-social-editing .scrollspy-btn-fixed {
  opacity: 0 !important;
  pointer-events: none !important;
  visibility: hidden !important;
}

body.admin-layout-mode .admin-social-edit-panel {
  z-index: 100001;
}

body.admin-layout-mode .admin-footer-edit-field select {
  width: 100%;
  padding: 8px 10px;
  border-radius: 6px;
  border: 1px solid #374151;
  background: #0f172a;
  color: #fff;
  font-size: 13px;
}

body.admin-footer-social-drag-active {
  cursor: grabbing;
}

body.admin-footer-social-drag-active .admin-footer-social-drag-handle {
  cursor: grabbing;
}

.admin-sortable-floater.admin-footer-social-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 8px 10px 6px;
  border-radius: 8px;
  outline: 2px solid rgba(255, 151, 1, 0.85);
  background: rgba(17, 24, 39, 0.95);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.35);
}

/* Footer link editing in layout mode */
body.admin-layout-mode .footer {
  position: relative;
  z-index: 125;
}

body.admin-layout-mode .footer-bottom {
  position: relative;
  z-index: 1;
}

body.admin-layout-mode .admin-footer-links-wrap {
  position: relative;
  z-index: 2;
  padding-top: 8px;
  padding-bottom: 16px;
}

/* Hide bottom fixed widgets while editing layout — use admin bar preview buttons instead */
body.admin-layout-mode .drawer-opener,
body.admin-layout-mode .extension-widget:not(.extension-widget-force-visible),
body.admin-layout-mode .chat-widget:not(.chat-widget-force-visible) {
  display: none !important;
}

body.admin-layout-mode .extension-widget.extension-widget-force-visible,
body.admin-layout-mode .chat-widget.chat-widget-force-visible {
  display: flex !important;
  position: fixed !important;
  z-index: 100025 !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

body.admin-layout-mode .chat-widget.chat-widget-force-visible {
  display: block !important;
  right: 30px !important;
  left: auto !important;
  bottom: 50px !important;
}

/* Preview parity: the generic block override above drops the text-label variant's
   flex column layout, pushing the footer to the top of its min-height box and
   leaving an empty coloured square below. Restore the real desktop layout. */
@media (min-width: 992px) {
  body.admin-layout-mode .chat-widget.chat-widget--text-label.chat-widget-force-visible {
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
  }
}

body.admin-layout-mode .extension-widget.extension-widget-force-visible {
  flex-direction: column !important;
  align-items: center !important;
  gap: 10px !important;
  bottom: 50px !important;
  right: 20px !important;
  left: auto !important;
}

@media (max-width: 991px) {
  body.admin-layout-mode .extension-widget.extension-widget-force-visible {
    display: flex !important;
    inset: auto 12px calc(70px + var(--mob-safe-bottom, 0px)) auto !important;
  }

  body.admin-layout-mode .chat-widget.chat-widget-force-visible {
    right: 12px !important;
    bottom: calc(70px + var(--mob-safe-bottom, 0px)) !important;
  }

  body.admin-layout-mode .top-bar .lang-menu {
    display: none !important;
  }

  body.admin-layout-mode.lang-suggest-open .mob-menu.mob-menu-open {
    z-index: 100032 !important;
  }
}

body.admin-layout-mode.admin-preview-modal-open .admin-layout-bar {
  z-index: 100050;
  position: sticky;
}

/* Raise preview overlays above edit chrome — do not force display:block on flex modals. */
body.admin-layout-mode #age-limit-modal.is-open,
body.admin-layout-mode .site-popup-modal.is-open,
body.admin-layout-mode .site-popup-modal[aria-hidden="false"],
body.admin-layout-mode #buy-script-overlay.is-open {
  position: fixed;
  inset: 0;
  z-index: 100040 !important;
}

body.admin-layout-mode #age-limit-modal.is-open {
  display: block !important;
}

body.admin-layout-mode .site-disclaimer-modal.is-open,
body.admin-layout-mode .site-disclaimer-modal[aria-hidden="false"],
body.admin-layout-mode .site-report-modal.is-open,
body.admin-layout-mode .site-report-modal[aria-hidden="false"] {
  display: flex !important;
}

body.admin-layout-mode #buy-script-overlay.is-open {
  display: flex !important;
}

body.admin-layout-mode #age-limit-modal.is-open .micromodal-container {
  position: relative;
  z-index: 2;
  max-height: calc(100dvh - 24px);
  overflow: auto;
}

body.admin-layout-mode .drawer.drawer-open {
  z-index: 100028 !important;
}

body.admin-layout-mode.admin-preview-drawer-open:not(.body-drawer-open) {
  overflow: auto;
}

body.admin-layout-mode.lang-suggest-open .top-bar-container .block-suggest-lang[data-site-lang-suggest] {
  display: block !important;
  opacity: 1 !important;
  transform: none !important;
}

body.admin-layout-mode .drawer.drawer-open .drawer-content {
  z-index: 100029 !important;
}

body.admin-layout-mode .drawer.drawer-open .drawer-opener {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

body.admin-layout-mode .top-bar .lang-menu,
body.admin-layout-mode .top-bar .top-bar-container,
body.admin-layout-mode .mob-menu .lang-menu {
  position: relative;
  z-index: 100031;
  overflow: visible;
}

body.admin-layout-mode .block-suggest-lang.popup-admin-preview,
body.admin-layout-mode .block-suggest-lang[data-site-lang-suggest].popup-admin-preview {
  display: block !important;
  opacity: 1 !important;
  transform: none !important;
  z-index: 100030;
}

body.admin-layout-mode #age-limit-modal.is-open .micromodal-overlay {
  position: fixed;
  inset: 0;
  z-index: 1;
}

body.admin-layout-mode .admin-footer-links-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  margin: 0 auto 12px;
  max-width: 960px;
  padding: 10px 14px;
  border-radius: 10px;
  background: rgba(17, 24, 39, 0.92);
  border: 1px solid rgba(255, 151, 1, 0.45);
  color: #e5e7eb;
  font-size: 13px;
}

body.admin-layout-mode .admin-footer-links-bar-label {
  font-weight: 700;
  color: #ffba01;
}

body.admin-layout-mode .admin-footer-links-bar-hint {
  color: #9ca3af;
}

body.admin-layout-mode .admin-footer-add-link,
body.admin-layout-mode .admin-footer-edit-promo {
  border: none;
  border-radius: 6px;
  padding: 6px 12px;
  background: #ff9701;
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
}

body.admin-layout-mode .admin-footer-edit-promo {
  background: rgba(255, 255, 255, 0.14);
  border: 1px solid rgba(255, 255, 255, 0.25);
}

body.admin-layout-mode .admin-footer-links-bar-actions {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-left: auto;
}

body.admin-layout-mode .admin-footer-save {
  border: none;
  border-radius: 6px;
  padding: 6px 14px;
  background: #ff9701;
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
}

body.admin-layout-mode .admin-footer-save:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

body.admin-layout-mode .admin-footer-save:not(:disabled):hover {
  background: #e88700;
}

body.admin-layout-mode .admin-footer-save-status {
  font-size: 12px;
  color: #9ca3af;
}

body.admin-layout-mode .admin-footer-save-status.is-dirty {
  color: #fbbf24;
}

body.admin-layout-mode .admin-footer-save-status.is-saving {
  color: #93c5fd;
}

body.admin-layout-mode .admin-footer-save-status.is-saved {
  color: #86efac;
}

body.admin-layout-mode .admin-footer-save-status.is-error {
  color: #fca5a5;
}

body.admin-layout-mode .admin-footer-links-admin-link {
  color: #ffba01;
  font-size: 12px;
  text-decoration: underline;
}

body.admin-layout-mode .footer-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-start;
  gap: 10px 14px;
  list-style: none;
  padding: 0 12px;
  margin: 0 0 20px;
  position: relative;
}

body.admin-layout-mode .footer-links > li {
  margin: 0 !important;
  flex: 0 0 auto;
}

body.admin-layout-mode .admin-footer-link-item {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 8px 10px 6px;
  border-radius: 8px;
  outline: 1px dashed rgba(255, 151, 1, 0.35);
  outline-offset: 2px;
  transition: transform 260ms cubic-bezier(0.22, 1, 0.36, 1), outline-color 0.2s ease, box-shadow 0.2s ease;
  z-index: 1;
  min-width: 0;
}

body.admin-layout-mode .admin-footer-link-item:hover,
body.admin-layout-mode .admin-footer-link-item:focus-within {
  z-index: 3;
  outline-color: rgba(255, 151, 1, 0.7);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
}

body.admin-layout-mode .admin-footer-link-item.admin-sortable-drop-target {
  outline-color: rgba(255, 151, 1, 0.85);
  outline-width: 2px;
  box-shadow: 0 0 0 4px rgba(255, 151, 1, 0.15);
}

body.admin-layout-mode .admin-footer-link-item.admin-footer-dragging {
  z-index: 5;
}

body.admin-layout-mode .admin-footer-link-tools {
  display: flex;
  align-items: center;
  gap: 4px;
}

body.admin-layout-mode .admin-footer-drag-handle,
body.admin-layout-mode .admin-footer-edit-btn,
body.admin-layout-mode .admin-footer-delete-btn {
  border: none;
  border-radius: 5px;
  padding: 2px 8px;
  background: rgba(17, 24, 39, 0.88);
  color: #fff;
  font-size: 11px;
  font-weight: 600;
  cursor: pointer;
  line-height: 1.6;
}

body.admin-layout-mode .admin-footer-drag-handle {
  cursor: grab;
  touch-action: none;
  transition: background 0.15s ease, color 0.15s ease, transform 0.15s ease;
}

body.admin-layout-mode .admin-footer-drag-handle:hover {
  background: rgba(255, 151, 1, 0.25);
  color: #ffba01;
  transform: scale(1.05);
}

body.admin-footer-drag-active .admin-footer-drag-handle {
  cursor: grabbing;
}

body.admin-layout-mode .admin-footer-delete-btn {
  color: #fca5a5;
}

body.admin-layout-mode .admin-footer-link-item .link {
  pointer-events: none;
}

body.admin-layout-mode .admin-footer-talent-block {
  position: relative;
}

body.admin-layout-mode .admin-footer-edit-backdrop {
  position: fixed;
  inset: 0;
  z-index: 100000;
  background: rgba(0, 0, 0, 0.55);
  backdrop-filter: blur(2px);
}

body.admin-layout-mode .admin-footer-edit-panel {
  position: fixed;
  top: 50%;
  left: 50%;
  right: auto;
  bottom: auto;
  transform: translate(-50%, -50%);
  z-index: 100001;
  width: min(400px, calc(100vw - 32px));
  max-height: min(85vh, 560px);
  overflow: auto;
  border-radius: 14px;
  background: #111827;
  border: 1px solid rgba(255, 151, 1, 0.55);
  box-shadow:
    0 24px 60px rgba(0, 0, 0, 0.45),
    0 0 0 1px rgba(255, 255, 255, 0.06) inset;
  color: #f3f4f6;
}

body.admin-layout-mode .admin-footer-edit-panel.admin-copyright-edit-panel {
  width: min(720px, calc(100vw - 24px));
  max-width: min(720px, calc(100vw - 24px));
  max-height: min(90vh, 820px);
}

body.admin-footer-editing .drawer-opener,
body.admin-footer-editing .extension-widget,
body.admin-footer-editing .chat-widget,
body.admin-footer-editing .scrollspy-btn-fixed {
  opacity: 0 !important;
  pointer-events: none !important;
  visibility: hidden !important;
}

body.admin-layout-mode .admin-footer-edit-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

body.admin-layout-mode .admin-footer-edit-panel-body {
  display: grid;
  gap: 10px;
  padding: 14px;
}

body.admin-layout-mode .admin-footer-edit-field {
  display: grid;
  gap: 4px;
  font-size: 12px;
}

body.admin-layout-mode .admin-footer-edit-field span em {
  color: #9ca3af;
  font-style: normal;
}

body.admin-layout-mode .admin-footer-edit-field input {
  width: 100%;
  padding: 8px 10px;
  border-radius: 6px;
  border: 1px solid #374151;
  background: #0f172a;
  color: #fff;
  font-size: 13px;
}

body.admin-layout-mode .admin-footer-edit-field-label {
  font-size: 12px;
  color: #e5e7eb;
}

body.admin-layout-mode .admin-footer-edit-field-label em {
  color: #9ca3af;
  font-style: normal;
}

body.admin-layout-mode .admin-footer-edit-image-block {
  display: grid;
  gap: 10px;
}

body.admin-layout-mode .admin-footer-edit-image-block[hidden] {
  display: none;
}

body.admin-layout-mode .admin-footer-edit-image-layout {
  display: grid;
  grid-template-columns: 88px 1fr;
  gap: 12px;
  align-items: start;
}

body.admin-layout-mode .admin-footer-edit-image-preview {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  padding: 6px;
  border-radius: 8px;
  border: 1px dashed rgba(255, 255, 255, 0.2);
  background: rgba(15, 23, 42, 0.8);
}

body.admin-layout-mode .admin-footer-edit-image-preview img {
  display: block;
  max-width: 100%;
  height: auto;
}

body.admin-layout-mode .admin-footer-edit-image-preview-empty {
  font-size: 11px;
  color: #6b7280;
  text-align: center;
}

body.admin-layout-mode .admin-footer-edit-image-side {
  display: grid;
  gap: 8px;
}

body.admin-layout-mode .admin-footer-edit-image-upload {
  position: relative;
}

body.admin-layout-mode .admin-footer-edit-image-file {
  position: absolute;
  inset: 0;
  opacity: 0;
  cursor: pointer;
}

body.admin-layout-mode .admin-footer-edit-image-upload-label {
  display: grid;
  gap: 2px;
  padding: 10px 12px;
  border-radius: 8px;
  border: 1px dashed rgba(255, 151, 1, 0.45);
  background: rgba(255, 151, 1, 0.08);
  font-size: 12px;
  color: #fcd34d;
  cursor: pointer;
}

body.admin-layout-mode .admin-footer-edit-image-upload-label small {
  color: #9ca3af;
  font-size: 11px;
}

body.admin-layout-mode .admin-footer-edit-image-upload.is-dragover .admin-footer-edit-image-upload-label {
  border-color: #ff9701;
  background: rgba(255, 151, 1, 0.18);
}

body.admin-layout-mode .admin-footer-edit-image-clear {
  justify-self: start;
  border: none;
  border-radius: 6px;
  padding: 6px 10px;
  background: rgba(255, 255, 255, 0.1);
  color: #fca5a5;
  font-size: 12px;
  cursor: pointer;
}

body.admin-layout-mode .admin-footer-edit-image-clear[hidden] {
  display: none;
}

body.admin-layout-mode .admin-footer-edit-image-url-advanced summary {
  font-size: 12px;
  color: #9ca3af;
  cursor: pointer;
}

body.admin-layout-mode .admin-footer-edit-option {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
}

body.admin-layout-mode .admin-footer-edit-actions {
  display: flex;
  gap: 8px;
  margin-top: 4px;
}

body.admin-layout-mode .admin-footer-edit-save,
body.admin-layout-mode .admin-footer-edit-cancel,
body.admin-layout-mode .admin-footer-edit-close {
  border: none;
  border-radius: 6px;
  padding: 8px 12px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
}

body.admin-layout-mode .admin-footer-edit-save {
  background: #ff9701;
  color: #fff;
}

body.admin-layout-mode .admin-footer-edit-cancel,
body.admin-layout-mode .admin-footer-edit-close {
  background: rgba(255, 255, 255, 0.1);
  color: #e5e7eb;
}

body.admin-layout-mode .admin-footer-edit-close {
  padding: 4px 10px;
}

/* Shared drag-sort visuals */
.admin-sortable-floater {
  position: fixed;
  left: 0;
  top: 0;
  z-index: 10050;
  pointer-events: none;
  margin: 0;
  transform: translate3d(0, 0, 0) scale(1.04);
  border-radius: 10px;
  box-shadow:
    0 20px 48px rgba(0, 0, 0, 0.32),
    0 0 0 2px rgba(255, 151, 1, 0.75);
  opacity: 0.98;
  will-change: transform;
}

/* Stay above edit backdrops/panels while rearranging in layout mode. */
body.admin-layout-mode .admin-sortable-floater {
  z-index: 100060;
}

body.admin-layout-mode .admin-sortable-indicator {
  z-index: 100061;
}

.admin-sortable-floater-table {
  border-collapse: separate;
  border-spacing: 0;
  background: #fff;
  border-radius: 10px;
  overflow: hidden;
}

.admin-sortable-floater.admin-footer-link-item,
.admin-sortable-floater.footer-link-item {
  background: rgba(17, 24, 39, 0.95);
}

.admin-sortable-hidden-source {
  display: none !important;
}

.admin-sortable-placeholder {
  box-sizing: border-box;
  border: 2px dashed rgba(255, 151, 1, 0.55);
  border-radius: 10px;
  background: rgba(255, 151, 1, 0.08);
  transition: width 0.2s ease, height 0.2s ease;
  list-style: none;
}

.admin-sortable-placeholder--x {
  flex: 0 0 auto;
  min-width: 72px;
  align-self: flex-start;
}

body.admin-layout-mode .footer-links .admin-sortable-placeholder {
  margin: 0;
  vertical-align: top;
}

.admin-sortable-placeholder--y {
  display: block;
}

.admin-sortable-placeholder--table-row {
  display: table-row;
}

.admin-sortable-placeholder--flex {
  display: flex;
  align-items: center;
  box-sizing: border-box;
}

.admin-sortable-placeholder-cell {
  padding: 0 !important;
  border: none !important;
  background: transparent !important;
}

.admin-sortable-indicator {
  position: fixed;
  z-index: 10040;
  pointer-events: none;
  display: none;
  border-radius: 999px;
  background: #ff9701;
  box-shadow: 0 0 0 4px rgba(255, 151, 1, 0.22);
  animation: admin-sortable-indicator-pulse 0.85s ease-in-out infinite alternate;
}

.admin-sortable-indicator--x {
  width: 4px;
}

.admin-sortable-indicator--y {
  height: 4px;
}

@keyframes admin-sortable-indicator-pulse {
  from {
    box-shadow: 0 0 0 3px rgba(255, 151, 1, 0.18);
  }
  to {
    box-shadow: 0 0 0 7px rgba(255, 151, 1, 0.32);
  }
}

body.admin-footer-drag-active,
body.site-links-drag-active {
  cursor: grabbing;
}

body.admin-footer-drag-active .admin-footer-drag-handle,
body.site-links-drag-active .site-links-drag-handle {
  cursor: grabbing;
}

/* Saved sites — star buttons and drawer list */
body.admin-layout-mode .site-save-btn {
  display: none !important;
}

.site-save-btn {
  --site-save-star: var(--site-asset-icon-save-star);
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: opacity 0.15s ease, transform 0.15s ease;
}

.site-save-btn:hover {
  opacity: 1;
}

.site-save-btn-icon {
  width: 18px;
  height: 18px;
  background: var(--site-save-star) center / contain no-repeat;
  display: block;
  filter: grayscale(1) brightness(0.62);
  opacity: 0.72;
  transition: filter 0.15s ease, opacity 0.15s ease;
}

.site-save-btn.is-saved .site-save-btn-icon {
  filter: none;
  opacity: 1;
  background-image: var(--site-asset-icon-save-star-check);
}

body.dark .site-save-btn-icon {
  filter: grayscale(1) brightness(0.85);
  opacity: 0.65;
}

body.dark .site-save-btn.is-saved .site-save-btn-icon {
  filter: none;
  opacity: 1;
  background-image: var(--site-asset-icon-save-star-check);
}

.category-container .category-item .site-save-btn--category-item {
  position: absolute;
  top: 50%;
  right: 38px;
  z-index: 3;
  transform: translateY(-50%);
}

.category-container .category-item .site-save-btn--category-item:hover {
  transform: translateY(-50%) scale(1.08);
}

.homepage .category-container .category-item .site-save-btn--category-item {
  right: 30px;
}

/* Keep mobile hit areas ≥44px even after later absolute/desktop save-btn rules. */
@media (max-width: 991px) {
  .homepage .category-container .category-item .review,
  .homepage .category-container .category-item .site-save-btn.site-save-btn--category-item {
    display: inline-flex !important;
    position: static !important;
    top: auto !important;
    right: auto !important;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    margin: 0 !important;
    transform: none !important;
  }

  .homepage .category-container .category-item .site-save-btn.site-save-btn--category-item:hover {
    transform: scale(1.05) !important;
  }
}

@media (min-width: 992px) {
  .homepage .category-container .category-item .review {
    right: 15px;
  }

  .homepage .category-container .category-item .site-save-btn--category-item {
    right: 38px;
    display: none;
  }

  .homepage .category-container .category-item:hover .site-save-btn--category-item {
    display: inline-flex;
  }
}

.category-sidebar .site-save-btn--sidebar {
  position: absolute;
  top: 50%;
  right: 30px;
  z-index: 2;
  transform: translateY(-50%);
}

.category-sidebar .site-save-btn--sidebar:hover {
  transform: translateY(-50%) scale(1.08);
}

.category-sidebar .review--sidebar {
  position: absolute;
  top: 50%;
  right: 10px;
  z-index: 2;
  transform: translateY(-50%) scale(0.889);
  width: 18px;
  height: 18px;
  background-color: var(--site-review-button-accent, #ff9701);
  background-image: none;
  mask: var(--site-asset-icon-search) center / contain no-repeat;
  -webkit-mask: var(--site-asset-icon-search) center / contain no-repeat;
}

.category-sidebar .category-list-link {
  padding-right: 52px;
}

.singlepage .link-title .title-holder {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}

body.singlepage .url_link_container,
body.categorypage .url_link_container {
  position: relative;
}

.singlepage .entry-save-action {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 10px 0 4px;
  padding: 10px 12px;
  border-radius: 12px;
  background: linear-gradient(135deg, color-mix(in srgb, var(--site-drawer-accent, #ff9701) 10%, transparent) 0%, color-mix(in srgb, var(--site-drawer-accent, #ff9701) 4%, transparent) 100%);
  border: 1px solid color-mix(in srgb, var(--site-drawer-accent, #ff9701) 20%, transparent);
}

.singlepage .entry-save-action-copy {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.singlepage .entry-save-action-label {
  font-size: 14px;
  font-weight: 600;
  color: var(--site-drawer-title-text, #1f2937);
  line-height: 1.25;
}

.singlepage .entry-save-action-hint {
  font-size: 12px;
  line-height: 1.35;
  color: var(--site-drawer-muted-text, #6b7280);
}

.singlepage .site-save-btn--review-main {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: var(--site-drawer-panel-bg, #fff);
  border: 1px solid color-mix(in srgb, var(--site-drawer-accent, #ff9701) 28%, transparent);
  box-shadow: 0 2px 8px color-mix(in srgb, var(--site-drawer-accent, #ff9701) 12%, transparent);
}

.singlepage .site-save-btn--review-main .site-save-btn-icon {
  width: 20px;
  height: 20px;
}

.singlepage .site-save-btn--review-main.is-saved {
  background: color-mix(in srgb, var(--site-drawer-accent, #ff9701) 12%, transparent);
  border-color: color-mix(in srgb, var(--site-drawer-accent, #ff9701) 45%, transparent);
}

.singlepage .top-bar-review .holder {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 16px;
  min-height: 56px;
}

.singlepage .top-bar-review-nav {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  flex: 1 1 auto;
}

.singlepage .top-bar-review .top-menu-holder {
  min-width: 0;
  flex: 1 1 auto;
  overflow: hidden;
}

.singlepage .top-bar-review .top-menu {
  display: flex;
  align-items: stretch;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
  overflow-x: auto;
  scrollbar-width: none;
}

.singlepage .top-bar-review .top-menu::-webkit-scrollbar {
  display: none;
}

.singlepage .top-bar-review .item-menu {
  display: flex;
  flex-shrink: 0;
  vertical-align: top;
}

.singlepage .top-bar-review .item-link {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  max-width: 220px;
  padding: 6px 12px 8px;
  border-bottom: 3px solid transparent;
  text-decoration: none;
  color: #4e4e4e;
  transition: border-color 0.2s ease, color 0.2s ease;
}

.singlepage .top-bar-review .item-menu.active .item-link,
.singlepage .top-bar-review .item-menu:hover .item-link {
  border-bottom-color: var(--site-review-tab-accent, #ff9701);
  color: var(--site-review-tab-accent, #ff9701);
}

.singlepage .top-bar-review .item-ico {
  flex: 0 0 28px;
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  overflow: hidden;
}

.singlepage .top-bar-review .item-ico--logo img,
.singlepage .top-bar-review .item-ico .toolbar-favicon,
.singlepage .top-bar-review .item-ico .entry-favicon-img {
  width: 18px !important;
  height: 18px !important;
  min-width: 18px;
  min-height: 18px;
  object-fit: contain;
  display: block;
}

.singlepage .top-bar-review .item-ico--category .category-icon-emoji-only,
.singlepage .top-bar-review .item-ico--category .category-icon {
  font-size: 16px;
  line-height: 1;
}

.singlepage .top-bar-review .item-copy {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 1px;
}

.singlepage .top-bar-review .item-title {
  font-size: 13px;
  font-weight: 600;
  line-height: 1.25;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.singlepage .top-bar-review .item-text {
  font-size: 11px;
  line-height: 1.25;
  color: #96979f;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.singlepage .top-bar-review-actions {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex: 0 1 auto;
  min-width: 0;
  max-width: min(340px, 42vw);
}

.singlepage .top-bar-review .link-analytics.btn-visit {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  flex: 1 1 auto;
  max-width: 100%;
  padding: 8px 12px;
  border-radius: 999px;
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.08);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
  color: #4e4e4e;
  font-size: 13px;
  font-weight: 500;
  text-decoration: none;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.singlepage .top-bar-review .link-analytics.btn-visit:hover {
  border-color: rgba(255, 151, 1, 0.45);
  box-shadow: 0 4px 12px rgba(255, 151, 1, 0.12);
}

.singlepage .top-bar-review .btn-visit .toolbar-favicon,
.singlepage .top-bar-review .btn-visit .entry-favicon-img {
  width: 16px !important;
  height: 16px !important;
  flex: 0 0 16px;
  object-fit: contain;
}

.singlepage .top-bar-review .btn-visit-text {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.singlepage .top-bar-review .btn-visit .link-icon {
  flex: 0 0 10px;
  width: 10px;
  height: 10px;
  opacity: 0.55;
}

.singlepage .top-bar-review .site-save-btn--toolbar {
  flex-shrink: 0;
  width: 34px;
  height: 34px;
  margin: 0;
  padding: 0;
  border-radius: 10px;
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.08);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
  font-size: 0;
  line-height: 0;
  color: transparent;
  overflow: hidden;
}

.singlepage .top-bar-review .site-save-btn--toolbar .site-save-btn-icon {
  width: 18px;
  height: 18px;
}

.singlepage .top-bar-review .site-save-btn--toolbar.is-saved {
  background: rgba(255, 151, 1, 0.12);
  border-color: rgba(255, 151, 1, 0.45);
}

/* ===== Review toolbar category dropdown ===== */
.singlepage .top-bar-review .category-menu {
  display: none;
  height: auto !important;
  max-height: min(72vh, 640px);
  border-top: 1px solid rgba(0, 0, 0, 0.08);
  background: #f6f7f9;
  box-shadow: 0 18px 40px rgba(15, 23, 42, 0.16);
  border-bottom-left-radius: 16px;
  border-bottom-right-radius: 16px;
  overflow: hidden;
}

.singlepage .top-bar-review.menu-opened .category-menu {
  display: block;
}

.singlepage .top-bar-review .category-menu-inner {
  max-height: min(72vh, 640px);
  height: auto;
  overflow-y: auto;
  overscroll-behavior: contain;
}

.singlepage .top-bar-review .category-menu-header {
  position: sticky;
  top: 0;
  z-index: 1;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 20px 10px;
  background: linear-gradient(#f6f7f9 78%, rgba(246, 247, 249, 0));
}

.singlepage .top-bar-review .category-menu-heading {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #6b7280;
}

.singlepage .top-bar-review .category-menu-all {
  font-size: 12.5px;
  font-weight: 600;
  color: rgb(var(--site-review-tab-accent-rgb, 255, 151, 1));
  text-decoration: none;
}

.singlepage .top-bar-review .category-menu-all:hover {
  text-decoration: underline;
}

.singlepage .top-bar-review .category-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(248px, 1fr));
  gap: 8px;
  padding: 0 16px 18px;
  margin: 0 auto;
  max-width: 1200px;
  list-style: none;
}

.singlepage .top-bar-review .category-list-item {
  min-width: 0;
  border: 0;
  flex: initial;
}

.singlepage .top-bar-review .category-list-link {
  position: relative;
  display: grid;
  grid-template-columns: auto 1fr;
  column-gap: 12px;
  row-gap: 3px;
  align-items: center;
  height: 100%;
  padding: 10px 12px;
  border-radius: 12px;
  background: #fff;
  border: 1px solid rgba(15, 23, 42, 0.08);
  text-decoration: none;
  color: inherit;
  transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}

/* Neutralise vendor pseudo-elements (left dot, divider line, visited checkmark, pulse). */
.singlepage .top-bar-review .category-list-link::before,
.singlepage .top-bar-review .category-list-link::after,
.singlepage .top-bar-review .category-list-item.visited .category-list-link::before {
  content: none !important;
  display: none !important;
  animation: none !important;
}

.singlepage .top-bar-review .category-list-link:hover {
  border-color: rgba(var(--category-title-line-rgb, 255, 151, 1), 0.6);
  background: rgba(var(--category-title-line-rgb, 255, 151, 1), 0.06);
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.08);
  transform: translateY(-1px);
}

.singlepage .top-bar-review .category-list-link > i {
  grid-row: 1 / span 2;
  align-self: center;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 10px;
  font-size: 19px;
  line-height: 1;
  font-style: normal;
  background: rgba(var(--category-title-line-rgb, 255, 151, 1), 0.14);
  color: rgb(var(--category-title-line-rgb, 255, 151, 1));
  overflow: hidden;
}

/* Fallback glyph for categories with no icon/emoji — uses the category initial. */
.singlepage .top-bar-review .category-list-link > i:empty::after {
  content: attr(data-initial);
  font-size: 16px;
  font-weight: 700;
  text-transform: uppercase;
  color: rgb(var(--category-title-line-rgb, 255, 151, 1));
}

.singlepage .top-bar-review .category-icon-image,
.singlepage .top-bar-review .category-icon-emoji-only {
  display: flex;
  align-items: center;
  justify-content: center;
}

.singlepage .top-bar-review .category-icon-img {
  width: 24px;
  height: 24px;
  object-fit: contain;
}

.singlepage .top-bar-review .category-emoji {
  font-size: 19px;
  line-height: 1;
}

.singlepage .top-bar-review .category-list-title {
  grid-column: 2;
  align-self: end;
  font-size: 13.5px;
  font-weight: 600;
  line-height: 1.25;
  color: #1a1d24;
  white-space: normal;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.singlepage .top-bar-review .icon-site-list-row {
  grid-column: 2;
  align-self: start;
  display: flex;
  align-items: center;
  gap: 3px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.singlepage .top-bar-review .icon-site-list-row:empty::after {
  content: "View category";
  font-size: 11px;
  color: #9aa1ab;
}

.singlepage .top-bar-review .icon-site-list-item {
  display: flex;
}

.singlepage .top-bar-review .icon-site-favicon-img {
  width: 16px;
  height: 16px;
  border-radius: 4px;
}

.singlepage .top-bar-review .icon-site-list-amount {
  margin-left: 2px;
  font-size: 11px;
  font-weight: 600;
  color: #6b7280;
}

body.dark.singlepage .top-bar-review {
  background: #1f2128;
}

body.dark.singlepage .top-bar-review .item-link {
  color: #e8e8e8;
}

body.dark.singlepage .top-bar-review .item-text {
  color: #a0a3ad;
}

body.dark.singlepage .top-bar-review .item-ico,
body.dark.singlepage .top-bar-review .link-analytics.btn-visit,
body.dark.singlepage .top-bar-review .site-save-btn--toolbar {
  background: #2a2b31;
  border-color: rgba(255, 255, 255, 0.08);
}

body.dark.singlepage .top-bar-review .category-menu {
  background: #181a1f;
  border-top-color: rgba(255, 255, 255, 0.08);
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.5);
}

body.dark.singlepage .top-bar-review .category-menu-header {
  background: linear-gradient(#181a1f 78%, rgba(24, 26, 31, 0));
}

body.dark.singlepage .top-bar-review .category-menu-heading {
  color: #9ca3af;
}

body.dark.singlepage .top-bar-review .category-list-link {
  background: #24262c;
  border-color: rgba(255, 255, 255, 0.08);
}

body.dark.singlepage .top-bar-review .category-list-link:hover {
  border-color: rgba(var(--category-title-line-rgb, 255, 151, 1), 0.6);
  background: rgba(var(--category-title-line-rgb, 255, 151, 1), 0.14);
}

body.dark.singlepage .top-bar-review .category-list-title {
  color: #f3f4f6;
}

body.dark.singlepage .top-bar-review .icon-site-list-amount {
  color: #9ca3af;
}

body.dark.singlepage .top-bar-review .icon-site-list-row:empty::after {
  color: #6b7280;
}

@media (max-width: 991px) {
  .singlepage .top-bar-review-actions {
    max-width: none;
    width: 100%;
  }

  .singlepage .top-bar-review .holder {
    flex-wrap: wrap;
  }
}

.singlepage .link-thumbnail .link-thumb {
  position: relative;
}

.singlepage .link-thumbnail .site-save-btn--carousel {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 6;
  width: 34px;
  height: 34px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.94);
  border: 1px solid rgba(0, 0, 0, 0.08);
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.12);
}


.singlepage .link-thumbnail .site-save-btn--carousel .site-save-btn-icon {
  width: 18px;
  height: 18px;
}

.singlepage .link-thumbnail .site-save-btn--carousel.is-saved {
  background: color-mix(in srgb, var(--site-drawer-accent, #ff9701) 14%, transparent);
  border-color: color-mix(in srgb, var(--site-drawer-accent, #ff9701) 40%, transparent);
}

body.dark.singlepage .entry-save-action {
  background: linear-gradient(135deg, color-mix(in srgb, var(--site-drawer-accent, #ff9701) 14%, transparent) 0%, color-mix(in srgb, var(--site-drawer-accent, #ff9701) 5%, transparent) 100%);
  border-color: color-mix(in srgb, var(--site-drawer-accent, #ff9701) 24%, transparent);
}

body.dark.singlepage .entry-save-action-label {
  color: #f3f4f6;
}

body.dark.singlepage .entry-save-action-hint {
  color: #9ca3af;
}

body.dark.singlepage .site-save-btn--review-main,
body.dark.singlepage .link-thumbnail .site-save-btn--carousel {
  background: rgba(42, 43, 49, 0.95);
  border-color: rgba(255, 255, 255, 0.12);
}

/* Entry review hero — structured card layout */
.singlepage .entry-review {
  padding: 0;
}

.singlepage .entry-review-card {
  display: flex;
  flex-direction: column;
  gap: 0;
  border-radius: 16px;
  overflow: hidden;
  background: var(--site-review-card-bg, #fff);
  box-shadow: 0 8px 32px rgba(15, 23, 42, 0.08);
  border: 1px solid rgba(0, 0, 0, 0.06);
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
  /* Carousel sync rewrites hero/description height — don't let the browser
     yank scroll position when those blocks change above the viewport. */
  overflow-anchor: none;
}

.singlepage .entry-review-body,
.singlepage .entry-review-text-wrap,
.singlepage .entry-review-hero,
.singlepage .entry-review-meta {
  overflow-anchor: none;
}

.singlepage .entry-review-hero {
  display: flex;
  flex-direction: column;
}

.singlepage .entry-review-hero-panel {
  padding: 12px 16px 14px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

.singlepage .entry-review-hero-head {
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: stretch;
}

.singlepage .entry-review-intro {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: 0;
  width: 100%;
}

.singlepage .entry-save-action--hero {
  display: none;
}

.singlepage .entry-review-media {
  padding: 16px 16px 0;
  background: linear-gradient(180deg, var(--site-review-media-bg, #f8f9fc) 0%, var(--site-review-card-bg, #fff) 100%);
}

.singlepage .entry-review-carousel.link-thumbnail {
  margin: 0;
}

.singlepage .entry-review-carousel .link-thumbs-holder {
  position: relative;
  border-radius: 0;
  overflow: hidden;
  background: transparent;
  margin-left: 0;
  margin-right: 0;
}

.singlepage .entry-review-carousel .link-thumbs-holder::after {
  display: none;
}

.singlepage .entry-review-carousel .swiper-slide:not(.swiper-slide-active) .link-thumb {
  opacity: 1;
}

/* Vendor peek-slide wash — only on mobile neighbor slides, never the active slide */
@media (max-width: 991px) {
  .singlepage .entry-review-carousel .swiper-slide-prev:not(.swiper-slide-active) .link-thumb::before,
  .singlepage .entry-review-carousel .swiper-slide-next:not(.swiper-slide-active) .link-thumb::before {
    display: block !important;
    content: "" !important;
    z-index: 2;
    background-color: #ffffffb3 !important;
    position: absolute;
    inset: 0;
    pointer-events: none;
  }
}

@media (min-width: 992px) {
  .singlepage .entry-review-carousel .swiper-slide .link-thumb::before {
    display: none !important;
    background: transparent !important;
  }
}

body.singlepage:not(.entry-carousel-ready) .entry-review-carousel .link-thumbs-holder {
  visibility: hidden !important;
  opacity: 0 !important;
}

body.singlepage.entry-carousel-ready .entry-review-carousel .link-thumbs-holder {
  visibility: visible !important;
  opacity: 1 !important;
}

.singlepage .entry-review-carousel .link-thumb .site-save-btn--carousel {
  z-index: 8;
}

.singlepage .entry-review-carousel .link-thumb .big-thumb-holder {
  /* Square corners: the screenshot butts flush against the address bar above and is
     rounded by the outer frame's clip — avoids the notch between bar and screenshot. */
  border-radius: 0;
  overflow: hidden;
}

/* Review carousel faux browser bar — replace missing vendor top-bar.png with site mascot */
.singlepage .entry-review-carousel.link-thumbnail .favicon-bar-wrapper,
.singlepage .entry-review-carousel .favicon-bar-wrapper {
  position: relative;
  display: block;
  width: 100%;
  min-height: 44px;
  height: 44px !important;
  overflow: visible !important;
  background: linear-gradient(180deg, var(--site-review-carousel-bar-bg-start, #eceef2) 0%, var(--site-review-carousel-bar-bg-end, #e2e5ea) 100%);
  background-image: none !important;
  border-radius: 0;
  border-bottom: 1px solid color-mix(in srgb, var(--site-review-carousel-bar-url-prefix, #767676) 22%, transparent);
}

.singlepage .entry-review-carousel.link-thumbnail .favicon-bar-wrapper::before,
.singlepage .entry-review-carousel .favicon-bar-wrapper::before {
  content: "";
  position: absolute;
  left: 10px;
  top: 50%;
  transform: translateY(-50%);
  width: 38px;
  height: 10px;
  background:
    radial-gradient(circle 4px at 4px 50%, #ff5f57 99%, transparent 100%),
    radial-gradient(circle 4px at 19px 50%, #febc2e 99%, transparent 100%),
    radial-gradient(circle 4px at 34px 50%, #28c840 99%, transparent 100%);
  pointer-events: none;
  z-index: 1;
}

.singlepage .entry-review-carousel.link-thumbnail .favicon-bar-mascot,
.singlepage .entry-review-carousel .favicon-bar-mascot {
  position: absolute;
  right: 6px;
  bottom: -2px;
  width: auto;
  height: 52px;
  max-width: 58px;
  object-fit: contain;
  object-position: bottom right;
  pointer-events: none;
  z-index: 3;
}

.singlepage .entry-review-carousel.link-thumbnail .favicon-bar-wrapper .favicon-bar-addressbar,
.singlepage .entry-review-carousel .favicon-bar-wrapper .favicon-bar-addressbar {
  display: inline-flex !important;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  gap: 6px;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  right: auto !important;
  transform: translate(-50%, -50%) !important;
  margin: 0 !important;
  padding: 0 8px !important;
  min-height: 0 !important;
  min-width: 0;
  max-width: calc(100% - 108px);
  width: max-content;
  box-sizing: border-box;
  z-index: 2;
  text-align: center;
}

.singlepage .entry-review-carousel.link-thumbnail .favicon-bar-wrapper .favicon-bar-addressbar .entry-favicon-img,
.singlepage .entry-review-carousel.link-thumbnail .favicon-bar-wrapper .favicon-bar-addressbar .favicon-bar-icon,
.singlepage .entry-review-carousel .favicon-bar-wrapper .favicon-bar-addressbar .entry-favicon-img,
.singlepage .entry-review-carousel .favicon-bar-wrapper .favicon-bar-addressbar .favicon-bar-icon {
  flex: 0 0 16px;
  width: 16px;
  height: 16px;
  max-width: 16px;
  margin: 0;
  opacity: 1 !important;
  visibility: visible !important;
  filter: none !important;
}

.singlepage .entry-review-carousel.link-thumbnail .favicon-bar-wrapper .favicon-bar-addressbar .favicon-bar-domain,
.singlepage .entry-review-carousel .favicon-bar-wrapper .favicon-bar-addressbar .favicon-bar-domain {
  display: inline-flex !important;
  align-items: center;
  min-width: 0;
  flex: 0 1 auto;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  position: static !important;
  top: auto !important;
  left: auto !important;
  font-size: 14px !important;
  text-transform: lowercase;
  padding-top: 0 !important;
}

.singlepage .entry-review-carousel.link-thumbnail .favicon-bar-wrapper .favicon-bar-addressbar .favicon-bar-domain .site_url,
.singlepage .entry-review-carousel .favicon-bar-wrapper .favicon-bar-addressbar .favicon-bar-domain .site_url {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Vendor review-page.css forces .favicon-bar-domain to #000 — override via theme tokens. */
.singlepage .entry-review-carousel .favicon-bar-domain,
.singlepage .entry-review-carousel .favicon-bar-domain .site_url {
  color: var(--site-review-carousel-bar-url, #000) !important;
  -webkit-text-fill-color: var(--site-review-carousel-bar-url, #000) !important;
  text-decoration: none;
}

.singlepage .entry-review-carousel .favicon-bar-domain:before {
  color: var(--site-review-carousel-bar-url-prefix, #767676) !important;
  -webkit-text-fill-color: var(--site-review-carousel-bar-url-prefix, #767676) !important;
}

body.dark.singlepage .entry-review-carousel .favicon-bar-domain,
body.dark.singlepage .entry-review-carousel .favicon-bar-domain .site_url {
  color: var(--site-review-carousel-bar-url, #ffffff) !important;
  -webkit-text-fill-color: var(--site-review-carousel-bar-url, #ffffff) !important;
}

body.dark.singlepage .entry-review-carousel .favicon-bar-domain:before {
  color: var(--site-review-carousel-bar-url-prefix, #b8b8b8) !important;
  -webkit-text-fill-color: var(--site-review-carousel-bar-url-prefix, #b8b8b8) !important;
}

body.dark.singlepage .entry-review-carousel .link-thumb {
  border-color: #5a5a62;
  background: #2a2b31;
}

body.dark.singlepage .entry-review-carousel .link-thumbs-holder .swiper-pagination,
body.dark.singlepage .entry-review-carousel .link-thumbs-holder .swiper-pagination-fraction {
  color: #b8b8b8;
  background-color: #3b3c44;
  border-color: #5a5a62;
}

@media (min-width: 992px) {
  .singlepage .entry-review-carousel.link-thumbnail .favicon-bar-wrapper .favicon-bar-addressbar .favicon-bar-domain:before,
  .singlepage .entry-review-carousel .favicon-bar-wrapper .favicon-bar-addressbar .favicon-bar-domain:before {
    content: "https://" !important;
    color: var(--site-review-carousel-bar-url-prefix, #767676) !important;
    -webkit-text-fill-color: var(--site-review-carousel-bar-url-prefix, #767676) !important;
  }
}

@media (max-width: 430px) {
  .singlepage .entry-review-carousel.link-thumbnail .favicon-bar-wrapper .favicon-bar-addressbar,
  .singlepage .entry-review-carousel .favicon-bar-wrapper .favicon-bar-addressbar {
    max-width: calc(100% - 92px);
    padding: 0 6px !important;
  }
}

.singlepage .entry-review-disclaimer {
  margin: 12px 0 0;
  padding: 10px 12px;
  border-radius: 10px;
  background: color-mix(in srgb, var(--site-review-tab-accent, #ff9701) 8%, transparent);
  border: 1px solid color-mix(in srgb, var(--site-review-tab-accent, #ff9701) 15%, transparent);
  font-size: 12px;
  line-height: 1.5;
  color: #666;
}

.singlepage .entry-review-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  padding: 14px 16px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

.singlepage .entry-review-category-pill.btn-main {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 8px 14px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 600;
  box-shadow: none;
  position: static;
  transform: none;
  width: auto;
  max-width: 100%;
}

.singlepage .entry-review-sites-chip.row-sites {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex: 1 1 240px;
  min-width: 0;
  width: auto;
  max-width: 100%;
  margin: 0;
  padding: 10px 12px 10px 14px;
  border-radius: 10px;
  background: linear-gradient(180deg, #f8f9fc 0%, #f3f5f9 100%);
  border: 1px solid rgba(15, 23, 42, 0.08);
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
  text-decoration: none;
  color: inherit;
  transition: border-color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.singlepage .entry-review-sites-chip.row-sites:hover {
  border-color: color-mix(in srgb, var(--site-brand-primary, #ff9701) 38%, rgba(15, 23, 42, 0.08));
  background: linear-gradient(180deg, color-mix(in srgb, var(--site-brand-primary, #ff9701) 5%, #f8f9fc) 0%, #f3f5f9 100%);
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.07);
  transform: translateY(-1px);
}

.singlepage .entry-review-sites-main {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  min-width: 0;
}

.singlepage .entry-review-sites-kicker {
  font-size: 10px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--site-brand-primary, #ff9701);
}

.singlepage .entry-review-sites-title {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px 8px;
  min-width: 0;
  max-width: 100%;
}

.singlepage .entry-review-sites-name {
  font-size: 14px;
  font-weight: 600;
  line-height: 1.25;
  color: #1f2937;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 100%;
}

.singlepage .entry-review-sites-count {
  flex-shrink: 0;
  padding: 2px 7px;
  border-radius: 4px;
  background: rgba(15, 23, 42, 0.06);
  color: #64748b;
  font-size: 10px;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: 0.01em;
}

.singlepage .entry-review-sites-aside {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}

.singlepage .entry-review-sites-icons.list-sites {
  display: inline-flex;
  align-items: center;
  margin: 0;
  padding: 0 2px 0 0;
}

.singlepage .entry-review-sites-icons .item-site {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  margin-left: -7px;
  padding: 2px;
  border-radius: 50%;
  background: #fff;
  border: 2px solid #f3f5f9;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.12);
  overflow: hidden;
}

.singlepage .entry-review-sites-icons .item-site:first-child {
  margin-left: 0;
}

.singlepage .entry-review-sites-icons .item-site .item-site-favicon,
.singlepage .entry-review-sites-icons .item-site .entry-favicon-img {
  width: 18px !important;
  height: 18px !important;
  border-radius: 50%;
  object-fit: cover;
  display: block;
}

.singlepage .entry-review-sites-chevron {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border-radius: 6px;
  background: rgba(15, 23, 42, 0.05);
  color: #64748b;
  flex-shrink: 0;
  transition: background 0.18s ease, color 0.18s ease;
}

.singlepage .entry-review-sites-chip.row-sites:hover .entry-review-sites-chevron {
  background: color-mix(in srgb, var(--site-brand-primary, #ff9701) 14%, transparent);
  color: var(--site-brand-primary, #ff9701);
}

.singlepage .entry-review-sites-label,
.singlepage .entry-review-sites-text {
  display: none;
}

.singlepage .entry-review-sites-label .row-sites-arrow {
  display: none;
}

.singlepage .entry-review-header-top {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 0;
}

.singlepage .entry-review-intro .review-rank,
.singlepage .entry-review-header .review-rank {
  flex-shrink: 0;
  margin: 0;
}

.singlepage .entry-review-intro .title-holder h1,
.singlepage .entry-review-header .title-holder h1 {
  margin: 0;
  font-size: clamp(22px, 4vw, 28px);
  line-height: 1.2;
  font-weight: 700;
  color: #222;
  overflow: visible;
  word-break: break-word;
}

.singlepage .entry-review-intro .link-title-name {
  display: inline;
  white-space: normal;
  overflow: visible;
  text-overflow: unset;
}

.singlepage .entry-review-intro .entry-review-header-top,
.singlepage .entry-review-intro .link-title-line {
  overflow: visible;
  width: 100%;
}

.singlepage .entry-review-intro .title-holder {
  overflow: visible;
  flex: 1 1 auto;
  min-width: 0;
}

.singlepage .entry-review-hero-details {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 100%;
}

.singlepage .entry-review-hero-details .entry-review-rating.entry-rating-bar {
  margin: 0;
  padding: 10px 12px;
  border-radius: 10px;
  background: #f7f8fb;
  border: 1px solid rgba(0, 0, 0, 0.06);
  justify-content: flex-start;
}

.singlepage .entry-review-hero-details .entry-pros-cons {
  margin: 0;
  padding: 0;
  border-top: none;
}

.singlepage .entry-review-hero-details .entry-pros-cons-grid {
  grid-template-columns: 1fr;
  gap: 10px;
}

.singlepage .entry-review-hero-details .entry-pros-cons-col {
  padding: 10px 12px;
}

.singlepage .entry-review-hero-details .entry-pros-cons-heading {
  margin-bottom: 8px;
  font-size: 12px;
}

.singlepage .entry-review-hero-details .entry-pros-cons-col .pros li,
.singlepage .entry-review-hero-details .entry-pros-cons-col .cons li {
  font-size: 13px;
  margin-bottom: 6px;
}

@media (min-width: 992px) {
  .singlepage .entry-review-hero-details .entry-pros-cons-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.singlepage .entry-review-kicker {
  display: block;
  margin-top: 2px;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #96979f;
}

.singlepage .entry-review-visit {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: fit-content;
  max-width: 100%;
  min-width: 0;
  padding: 7px 11px;
  border-radius: 8px;
  background: #f5f6f8;
  border: 1px solid rgba(0, 0, 0, 0.08);
  text-decoration: none;
  color: #333;
  transition: border-color 0.2s ease, background 0.2s ease;
}

.singlepage .entry-review-visit:hover {
  border-color: rgba(255, 151, 1, 0.45);
  background: rgba(255, 151, 1, 0.06);
  transform: none;
  box-shadow: none;
}

.singlepage .entry-review-visit .site-anchor-favicon,
.singlepage .entry-review-visit .entry-favicon-img {
  width: 20px !important;
  height: 20px !important;
  flex-shrink: 0;
  border-radius: 4px;
}

.singlepage .entry-review-visit-copy {
  display: flex;
  flex-direction: column;
  gap: 1px;
  min-width: 0;
}

.singlepage .entry-review-visit-label {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--site-brand-primary);
}

.singlepage .entry-review-visit-domain {
  font-size: 14px;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.singlepage .entry-review-visit .link-icon {
  flex-shrink: 0;
  opacity: 0.55;
}

.singlepage .entry-review-body {
  padding: 16px;
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
  overflow-x: clip;
}

/*
 * Entry description must scroll with the page — not in a nested 160/280px
 * vendor scrollbox. Nested overflow + scrollbox JS was trapping touch/wheel
 * and letting tall copy spill out of the fixed-height wrapper on mobile.
 */
.singlepage .entry-review-text-wrap.link-details-review-wrapper {
  height: auto !important;
  max-height: none !important;
  margin: 0;
  padding: 0;
  border: none;
  box-shadow: none;
  min-width: 0;
  max-width: 100%;
  overflow: visible;
}

.singlepage .entry-review-text-wrap.link-details-review-wrapper::before,
.singlepage .entry-review-text-wrap.link-details-review-wrapper::after {
  display: none !important;
  content: none !important;
}

.singlepage .entry-review-text-wrap .link-details-review {
  padding: 16px;
  border-radius: 12px;
  background: var(--site-review-inset-bg, #fafbfc);
  border: 1px solid rgba(0, 0, 0, 0.05);
  font-size: 15px;
  line-height: 1.65;
  color: #444;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
  overflow-x: clip;
  will-change: auto;
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
  overflow-wrap: anywhere;
  word-wrap: break-word;
  word-break: break-word;
  hyphens: auto;
}

.singlepage .entry-review-text-wrap .link-details-review > *:first-child {
  margin-top: 0;
}

.singlepage .entry-review-text-wrap .link-details-review > *:last-child {
  margin-bottom: 0;
}

.singlepage .entry-review-text-wrap .link-details-review img,
.singlepage .entry-review-text-wrap .link-details-review video,
.singlepage .entry-review-text-wrap .link-details-review iframe,
.singlepage .entry-review-text-wrap .link-details-review svg,
.singlepage .entry-review-text-wrap .link-details-review table {
  max-width: 100% !important;
  height: auto;
}

.singlepage .entry-review-text-wrap .link-details-review pre,
.singlepage .entry-review-text-wrap .link-details-review code {
  max-width: 100%;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.singlepage .entry-review-text-wrap .link-details-review table {
  display: block;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.singlepage .entry-review-footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px 16px;
  border-top: 1px solid rgba(0, 0, 0, 0.06);
  background: var(--site-review-inset-bg, #fafbfc);
  overflow: visible;
}

.singlepage .entry-review-modal-btns.modal-btns {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 2px 0;
  overflow: visible;
}

.singlepage .entry-review-modal-btns .report-btn,
.singlepage .entry-review-modal-btns .disclaimer-btn {
  margin: 0;
  padding: 8px 12px;
  border: 1px solid transparent;
  border-radius: 999px;
  background: transparent;
  cursor: pointer;
  font: inherit;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.2;
  text-decoration: none;
  overflow: visible;
  transition:
    color 0.18s ease,
    background-color 0.18s ease,
    border-color 0.18s ease,
    box-shadow 0.18s ease;
}

.singlepage .entry-review-modal-btns .report-btn {
  color: #6b6b6b;
}

.singlepage .entry-review-modal-btns .disclaimer-btn {
  color: #8c8d96;
}

.singlepage .entry-review-modal-btns .report-btn .inline-icon {
  transition: filter 0.18s ease;
}

@media (hover: hover) and (pointer: fine) {
  .singlepage .entry-review-modal-btns .report-btn:hover,
  .singlepage .entry-review-modal-btns .disclaimer-btn:hover {
    color: var(--site-brand-primary, #ff9701);
    background: color-mix(in srgb, var(--site-brand-primary, #ff9701) 10%, #fff);
    border-color: color-mix(in srgb, var(--site-brand-primary, #ff9701) 28%, transparent);
    box-shadow: 0 1px 6px color-mix(in srgb, var(--site-brand-primary, #ff9701) 16%, transparent);
  }

  .singlepage .entry-review-modal-btns .report-btn:hover .inline-icon {
    filter: invert(62%) sepia(78%) saturate(1486%) hue-rotate(360deg) brightness(102%) contrast(103%);
  }
}

.singlepage .entry-review-modal-btns .report-btn:focus-visible,
.singlepage .entry-review-modal-btns .disclaimer-btn:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--site-brand-primary, #ff9701) 70%, transparent);
  outline-offset: 2px;
}

.singlepage .entry-review-modal-btns .report-btn:active,
.singlepage .entry-review-modal-btns .disclaimer-btn:active {
  box-shadow: none;
}

body.dark.singlepage .entry-review-modal-btns .report-btn,
body.dark.singlepage .entry-review-modal-btns .disclaimer-btn {
  color: #c9c9c9;
}

@media (hover: hover) and (pointer: fine) {
  body.dark.singlepage .entry-review-modal-btns .report-btn:hover,
  body.dark.singlepage .entry-review-modal-btns .disclaimer-btn:hover {
    color: var(--site-brand-primary, #ff9701);
    background: color-mix(in srgb, var(--site-brand-primary, #ff9701) 14%, #2a2b31);
    border-color: color-mix(in srgb, var(--site-brand-primary, #ff9701) 35%, transparent);
    box-shadow: 0 1px 8px rgba(0, 0, 0, 0.28);
  }

  body.dark.singlepage .entry-review-modal-btns .report-btn:hover .inline-icon {
    filter: invert(62%) sepia(78%) saturate(1486%) hue-rotate(360deg) brightness(102%) contrast(103%);
  }
}

.singlepage .entry-review-back.back-block {
  margin: 0;
  padding: 0;
  background: transparent;
  opacity: 1 !important;
  visibility: visible !important;
}

.singlepage .entry-rating-bar .link-rating-image .rating {
  float: left;
  width: 50px;
  height: 50px;
  margin-left: 3px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 50px 50px;
}

.singlepage .entry-rating-bar .link-rating-image .rating.rateon {
  background-image: var(--site-asset-rating-on);
}

.singlepage .entry-rating-bar .link-rating-image .rating.rateoff {
  background-image: var(--site-asset-rating-off);
}

.singlepage .entry-rating-bar .link-rating-image .rating.ratehalf {
  background: linear-gradient(90deg, var(--site-review-tab-accent, #ff9701) 50%, transparent 50%), var(--site-asset-rating-off);
  background-size: 50px 50px, 50px 50px;
  background-repeat: no-repeat;
  background-position: center;
}

body.dark.singlepage .entry-review-card {
  background: var(--site-review-card-bg, #23252b);
  border-color: rgba(255, 255, 255, 0.08);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.35);
}

body.dark.singlepage .entry-review-media {
  background: linear-gradient(180deg, var(--site-review-media-bg, #2a2b31) 0%, var(--site-review-card-bg, #23252b) 100%);
}

@media (min-width: 992px) {
  body.dark.singlepage .entry-review-media {
    border-right-color: rgba(255, 255, 255, 0.08);
  }

  body.dark.singlepage .entry-review-meta {
    border-top-color: rgba(255, 255, 255, 0.08);
  }
}

body.dark.singlepage .entry-review-disclaimer {
  background: color-mix(in srgb, var(--site-review-tab-accent, #ff9701) 10%, transparent);
  border-color: color-mix(in srgb, var(--site-review-tab-accent, #ff9701) 20%, transparent);
  color: #c9c9c9;
}

body.dark.singlepage .entry-review-sites-chip.row-sites {
  background: linear-gradient(180deg, #2f3138 0%, #2a2b31 100%);
  border-color: rgba(255, 255, 255, 0.1);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

body.dark.singlepage .entry-review-sites-chip.row-sites:hover {
  border-color: color-mix(in srgb, var(--site-brand-primary, #ff9701) 45%, rgba(255, 255, 255, 0.1));
  background: linear-gradient(180deg, color-mix(in srgb, var(--site-brand-primary, #ff9701) 8%, #2f3138) 0%, #2a2b31 100%);
}

body.dark.singlepage .entry-review-sites-name {
  color: #f2f2f2;
}

body.dark.singlepage .entry-review-sites-count {
  background: rgba(255, 255, 255, 0.08);
  color: #a8a8b0;
}

body.dark.singlepage .entry-review-sites-icons .item-site {
  background: #1e1f24;
  border-color: #2a2b31;
}

body.dark.singlepage .entry-review-sites-chevron {
  background: rgba(255, 255, 255, 0.06);
  color: #a8a8b0;
}

body.dark.singlepage .entry-review-sites-text strong,
body.dark.singlepage .entry-review-intro .title-holder h1,
body.dark.singlepage .entry-review-header .title-holder h1,
body.dark.singlepage .entry-review-visit {
  color: #f2f2f2;
}

body.dark.singlepage .entry-review-visit {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.1);
}

body.dark.singlepage .entry-review-hero-details .entry-review-rating.entry-rating-bar {
  background: #2a2b31;
  border-color: rgba(255, 255, 255, 0.08);
}

body.dark.singlepage .entry-review-text-wrap .link-details-review {
  background: var(--site-review-inset-bg, #2a2b31);
  border-color: rgba(255, 255, 255, 0.08);
  color: #d8d8d8;
}

body.dark.singlepage .entry-review-hero-panel {
  border-color: rgba(255, 255, 255, 0.08);
}

body.dark.singlepage .entry-save-action--breadcrumb .entry-save-action-label {
  color: #f2f2f2;
}

body.dark.singlepage .entry-save-action--breadcrumb .entry-save-action-hint {
  color: #aaa;
}

body.dark.singlepage .entry-save-action--hero {
  display: none;
}

body.dark.singlepage .entry-review-footer {
  background: color-mix(in srgb, var(--site-review-inset-bg, #1f2128) 88%, #000);
  border-color: rgba(255, 255, 255, 0.08);
}

@media (min-width: 768px) {
  .singlepage .entry-review-media {
    padding: 20px 24px 0;
  }

  .singlepage .entry-review-hero-panel,
  .singlepage .entry-review-meta,
  .singlepage .entry-review-body,
  .singlepage .entry-review-footer {
    padding-left: 24px;
    padding-right: 24px;
  }

  @media (min-width: 992px) {
    .singlepage .entry-review-media {
      padding: 20px 24px;
    }
  }
}

@media (max-width: 767px) {
  .singlepage .entry-review-hero-panel {
    padding-left: 16px;
    padding-right: 16px;
  }

  .singlepage .entry-review-meta {
    flex-direction: column;
    align-items: stretch;
  }

  .singlepage .entry-review-category-pill.btn-main {
    justify-content: center;
  }

  .singlepage .entry-review-sites-chip.row-sites {
    width: 100%;
    flex: 1 1 auto;
  }

  .singlepage .entry-review-sites-name {
    white-space: normal;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }

  .singlepage .entry-review-footer {
    flex-direction: column;
    align-items: stretch;
  }
}

.url_link_image .site-save-btn--thumb,
.url_link_container .site-save-btn--thumb {
  position: absolute;
  top: 8px;
  right: 8px;
  z-index: 10;
  pointer-events: auto;
  width: 24px;
  height: 24px;
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.94);
  border: 1px solid rgba(0, 0, 0, 0.08);
  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1);
}

.url_link_image .site-save-btn--thumb.is-saved,
.url_link_container .site-save-btn--thumb.is-saved {
  background: color-mix(in srgb, var(--site-drawer-accent, #ff9701) 14%, transparent);
  border-color: color-mix(in srgb, var(--site-drawer-accent, #ff9701) 38%, transparent);
}

.url_link_image .site-save-btn--thumb .site-save-btn-icon,
.url_link_container .site-save-btn--thumb .site-save-btn-icon {
  width: 16px;
  height: 16px;
}

.search-site-suggestion-row .search-site-suggestion {
  padding-right: 52px;
}

.search-site-suggestion-row .site-save-btn--search {
  position: absolute;
  top: 50%;
  right: 32px;
  z-index: 2;
  transform: translateY(-50%);
}

.search-site-suggestion-row .site-save-btn--search:hover {
  transform: translateY(-50%) scale(1.08);
}

.search-site-suggestion-row .search-site-suggestion-review {
  position: absolute;
  top: 50%;
  right: 10px;
  z-index: 2;
  width: 18px;
  height: 18px;
  transform: translateY(-50%) scale(0.889);
  background-color: var(--site-review-button-accent, #ff9701);
  background-image: none;
  mask: var(--site-asset-icon-search) center / contain no-repeat;
  -webkit-mask: var(--site-asset-icon-search) center / contain no-repeat;
  flex-shrink: 0;
}

/* Saved websites drawer — shell, list, discover */
.site-drawer-shell {
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding: 20px 20px 24px;
  min-height: 100%;
  box-sizing: border-box;
}

.site-drawer-hero {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  padding: 18px 18px 16px;
  border-radius: 16px;
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--site-drawer-accent, #ff9701) 14%, transparent) 0%, color-mix(in srgb, var(--site-drawer-accent, #ff9701) 4%, transparent) 48%, color-mix(in srgb, var(--site-drawer-panel-bg, #fff) 90%, transparent) 100%);
  border: 1px solid color-mix(in srgb, var(--site-drawer-accent, #ff9701) 18%, transparent);
  box-shadow: 0 10px 28px color-mix(in srgb, var(--site-drawer-accent, #ff9701) 8%, transparent);
}

.site-drawer-hero-main {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  min-width: 0;
  flex: 1 1 auto;
}

.site-drawer-hero-icon {
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  border-radius: 14px;
  background:
    color-mix(in srgb, var(--site-drawer-panel-bg, #fff) 92%, transparent)
    var(--site-asset-icon-save-star) center / 24px no-repeat;
  box-shadow: 0 4px 14px color-mix(in srgb, var(--site-drawer-accent, #ff9701) 18%, transparent);
  border: 1px solid color-mix(in srgb, var(--site-drawer-accent, #ff9701) 22%, transparent);
}

.site-drawer-hero-copy {
  min-width: 0;
}

.site-drawer-hero-eyebrow {
  margin: 0 0 4px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--site-drawer-accent, #ff9701);
}

.site-drawer-hero-title {
  margin: 0 0 6px;
  font-size: 22px;
  line-height: 1.15;
  font-weight: 700;
  color: var(--site-drawer-title-text, #1f2937);
  letter-spacing: -0.02em;
}

.site-drawer-hero-lead {
  margin: 0;
  font-size: 13px;
  line-height: 1.5;
  color: var(--site-drawer-muted-text, #6b7280);
}

.site-drawer-count {
  flex-shrink: 0;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-width: 52px;
  padding: 8px 10px;
  border-radius: 12px;
  background: var(--site-drawer-panel-bg, #fff);
  border: 1px solid color-mix(in srgb, var(--site-drawer-accent, #ff9701) 22%, transparent);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
  text-align: center;
}

.site-drawer-count-value {
  display: block;
  font-size: 22px;
  font-weight: 700;
  line-height: 1;
  color: var(--site-drawer-accent, #ff9701);
}

.site-drawer-count-label {
  display: block;
  margin-top: 3px;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--site-drawer-muted-text, #9ca3af);
}

.saved-sites-panel {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.saved-sites-panel-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.saved-sites-panel-head-main {
  min-width: 0;
}

.saved-sites-panel-title {
  margin: 0;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--site-drawer-title-text, #374151);
}

.saved-sites-panel-subtitle {
  margin: 4px 0 0;
  font-size: 13px;
  line-height: 1.4;
  color: var(--site-drawer-muted-text, #9ca3af);
}

.saved-sites-clear-btn {
  flex-shrink: 0;
  padding: 6px 12px;
  border-radius: 999px;
  border: 1px solid var(--site-drawer-item-border, #e5e7eb);
  background: var(--site-drawer-panel-bg, #fff);
  color: var(--site-drawer-muted-text, #6b7280);
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: border-color 0.15s ease, color 0.15s ease, background-color 0.15s ease;
}

.saved-sites-clear-btn:hover {
  border-color: rgba(234, 68, 68, 0.35);
  color: #dc2626;
  background: #fef2f2;
}

.saved-sites-panel.is-empty .saved-sites-list {
  display: none;
}

.saved-sites-panel:not(.is-empty) .saved-sites-empty {
  display: none;
}

.saved-sites-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
}

@media (min-width: 992px) {
  .saved-sites-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px 12px;
  }

  .saved-sites-item {
    position: relative;
  }

  .saved-sites-item-link {
    padding: 10px 44px 10px 10px;
    gap: 10px;
  }

  .saved-sites-item .site-save-btn--drawer {
    position: absolute;
    top: 50%;
    right: 8px;
    transform: translateY(-50%);
    align-self: auto;
  }

  .saved-sites-item-chevron {
    display: none;
  }

  .saved-sites-item-name {
    font-size: 14px;
  }

  .saved-sites-item-meta {
    font-size: 12px;
  }
}

.saved-sites-item {
  display: flex;
  align-items: stretch;
  gap: 8px;
}

.saved-sites-item-link {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px 12px;
  border-radius: 14px;
  background: var(--site-drawer-item-bg, #f9fafb);
  border: 1px solid var(--site-drawer-item-border, #eef0f3);
  color: inherit;
  text-decoration: none;
  transition: border-color 0.15s ease, background-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}

.saved-sites-item-link:hover {
  color: inherit;
  text-decoration: none;
  background: var(--site-drawer-panel-bg, #fff);
  border-color: color-mix(in srgb, var(--site-drawer-accent, #ff9701) 28%, transparent);
  box-shadow: 0 8px 20px color-mix(in srgb, var(--site-drawer-accent, #ff9701) 10%, transparent);
  transform: translateY(-1px);
}

.saved-sites-item-favicon-wrap {
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  border-radius: 11px;
  background: var(--site-drawer-panel-bg, #fff);
  border: 1px solid var(--site-drawer-item-border, #e5e7eb);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.saved-sites-item-favicon {
  width: 24px;
  height: 24px;
  object-fit: contain;
}

.saved-sites-item-copy {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.saved-sites-item-name {
  font-size: 15px;
  font-weight: 600;
  line-height: 1.25;
  color: var(--site-drawer-title-text, #1f2937);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.saved-sites-item-meta {
  font-size: 12px;
  line-height: 1.3;
  color: var(--site-drawer-muted-text, #9ca3af);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.saved-sites-item-chevron {
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  opacity: 0.45;
  background: var(--site-asset-icon-angle-right) center / 10px 14px no-repeat;
  transition: opacity 0.15s ease, transform 0.15s ease;
}

.saved-sites-item-link:hover .saved-sites-item-chevron {
  opacity: 0.85;
  transform: translateX(2px);
}

.saved-sites-item .site-save-btn--drawer {
  align-self: center;
  width: 36px;
  height: 36px;
  border-radius: 11px;
  background: var(--site-drawer-panel-bg, #fff);
  border: 1px solid var(--site-drawer-item-border, #eef0f3);
  transition: border-color 0.15s ease, background-color 0.15s ease;
}

.saved-sites-item .site-save-btn--drawer:hover {
  border-color: color-mix(in srgb, var(--site-drawer-accent, #ff9701) 35%, transparent);
  background: color-mix(in srgb, var(--site-drawer-accent, #ff9701) 6%, transparent);
}

.saved-sites-item .site-save-btn--drawer .site-save-btn-icon {
  width: 18px;
  height: 18px;
}

.saved-sites-empty {
  padding: 28px 20px;
  border-radius: 16px;
  background: linear-gradient(180deg, var(--site-drawer-item-bg, #f9fafb) 0%, color-mix(in srgb, var(--site-drawer-item-bg, #f3f4f6) 88%, var(--site-drawer-item-border, #d1d5db)) 100%);
  border: 1px dashed var(--site-drawer-item-border, #d1d5db);
  text-align: center;
}

.saved-sites-empty-icon {
  display: block;
  width: 52px;
  height: 52px;
  margin: 0 auto 14px;
  border-radius: 16px;
  background:
    color-mix(in srgb, var(--site-drawer-panel-bg, #fff) 95%, transparent)
    var(--site-asset-icon-save-star) center / 28px no-repeat;
  border: 1px solid var(--site-drawer-item-border, #e5e7eb);
  filter: grayscale(1) brightness(0.72);
  opacity: 0.85;
}

.saved-sites-empty-title {
  margin: 0 0 8px;
  font-size: 16px;
  font-weight: 700;
  color: var(--site-drawer-title-text, #374151);
}

.saved-sites-empty-text {
  margin: 0;
  max-width: 26em;
  margin-inline: auto;
  font-size: 13px;
  line-height: 1.55;
  color: var(--site-drawer-muted-text, #6b7280);
}

.saved-sites-empty-text strong {
  color: var(--site-drawer-accent, #ff9701);
  font-weight: 700;
}

.site-drawer-discover {
  margin-top: auto;
  padding-top: 4px;
}

.site-drawer-discover-card {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 16px;
  border-radius: 16px;
  background: linear-gradient(135deg, var(--site-drawer-discover-bg, #1f2937) 0%, color-mix(in srgb, var(--site-drawer-discover-bg, #111827) 72%, #000) 100%);
  color: #fff;
  text-decoration: none;
  box-shadow: 0 12px 28px color-mix(in srgb, var(--site-drawer-discover-bg, #111827) 18%, transparent);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.site-drawer-discover-card:hover {
  color: #fff;
  text-decoration: none;
  transform: translateY(-2px);
  box-shadow: 0 16px 34px rgba(17, 24, 39, 0.24);
}

.site-drawer-discover-icon {
  flex-shrink: 0;
  width: 42px;
  height: 42px;
  border-radius: 12px;
  background: color-mix(in srgb, var(--site-drawer-accent, #ff9701) 16%, transparent) var(--site-asset-icon-search) center / 18px no-repeat;
  filter: brightness(0) invert(1);
  opacity: 0.92;
}

.site-drawer-discover-copy {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.site-drawer-discover-kicker {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--site-drawer-accent, #ff9701);
}

.site-drawer-discover-title {
  font-size: 15px;
  font-weight: 700;
  line-height: 1.25;
  color: #fff;
}

.site-drawer-discover-text {
  font-size: 12px;
  line-height: 1.45;
  color: rgba(255, 255, 255, 0.72);
}

.site-drawer-discover-arrow {
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.1) var(--site-asset-icon-angle-right) center / 10px 14px no-repeat;
  filter: brightness(0) invert(1);
  transition: background-color 0.15s ease, transform 0.15s ease;
}

.site-drawer-discover-card:hover .site-drawer-discover-arrow {
  background-color: color-mix(in srgb, var(--site-drawer-accent, #ff9701) 35%, transparent);
  transform: translateX(2px);
}

body.dark .site-drawer-body {
  background: var(--site-drawer-panel-bg, #2a2b31);
}

body.dark .site-drawer-hero {
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--site-drawer-accent, #ff9701) 18%, transparent) 0%, color-mix(in srgb, var(--site-drawer-accent, #ff9701) 6%, transparent) 48%, color-mix(in srgb, var(--site-drawer-panel-bg, #2a2b31) 96%, transparent) 100%);
  border-color: color-mix(in srgb, var(--site-drawer-accent, #ff9701) 24%, transparent);
}

body.dark .site-drawer-hero-icon,
body.dark .site-drawer-count {
  background-color: color-mix(in srgb, var(--site-drawer-panel-bg, #2a2b31) 95%, transparent);
  border-color: rgba(255, 255, 255, 0.08);
}

body.dark .site-drawer-hero-title,
body.dark .saved-sites-item-name,
body.dark .saved-sites-empty-title,
body.dark .saved-sites-panel-title {
  color: var(--site-drawer-title-text, #f3f4f6);
}

body.dark .site-drawer-hero-lead,
body.dark .saved-sites-panel-subtitle,
body.dark .saved-sites-item-meta,
body.dark .saved-sites-empty-text {
  color: var(--site-drawer-muted-text, #9ca3af);
}

body.dark .saved-sites-item-link {
  background: color-mix(in srgb, var(--site-drawer-item-bg, #32333a) 40%, transparent);
  border-color: var(--site-drawer-item-border, rgba(255, 255, 255, 0.08));
}

body.dark .saved-sites-item-link:hover {
  background: color-mix(in srgb, var(--site-drawer-panel-bg, #2a2b31) 70%, #fff 7%);
  border-color: color-mix(in srgb, var(--site-drawer-accent, #ff9701) 32%, transparent);
}

body.dark .saved-sites-item-favicon-wrap,
body.dark .saved-sites-item .site-save-btn--drawer,
body.dark .saved-sites-clear-btn {
  background: color-mix(in srgb, var(--site-drawer-panel-bg, #2a2b31) 95%, transparent);
  border-color: var(--site-drawer-item-border, rgba(255, 255, 255, 0.1));
  color: var(--site-drawer-muted-text, #d1d5db);
}

body.dark .saved-sites-empty {
  background: color-mix(in srgb, var(--site-drawer-item-bg, #32333a) 30%, transparent);
  border-color: var(--site-drawer-item-border, rgba(255, 255, 255, 0.12));
}

body.dark .saved-sites-empty-icon {
  background-color: color-mix(in srgb, var(--site-drawer-panel-bg, #2a2b31) 95%, transparent);
  border-color: var(--site-drawer-item-border, rgba(255, 255, 255, 0.1));
}

@media (max-width: 991px) {
  .site-drawer-shell {
    padding: 16px 16px 20px;
    gap: 18px;
  }

  .site-drawer-hero {
    flex-direction: column;
    align-items: stretch;
  }

  .site-drawer-count {
    flex-direction: row;
    align-items: baseline;
    justify-content: center;
    gap: 6px;
    min-width: 0;
    width: 100%;
  }

  .site-drawer-count-label {
    margin-top: 0;
  }
}

/* =========================================================================
   Buy this Script — footer trigger + product overlay
   ========================================================================= */

.footer-buy-script {
  display: inline-flex;
  align-items: center;
  margin-left: 8px;
  padding: 4px 11px;
  border: 0;
  border-radius: 6px;
  font: inherit;
  font-size: 0.82em;
  font-weight: 700;
  line-height: 1.35;
  color: #1a1206;
  cursor: pointer;
  background: var(--site-brand-primary, #ff9701);
  transition: background-color 0.15s ease, filter 0.15s ease;
}

.footer-buy-script:hover,
.footer-buy-script:focus-visible {
  filter: brightness(1.06);
  outline: none;
}

.footer-buy-script:focus-visible {
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--site-brand-primary, #ff9701) 35%, transparent);
}

.footer-buy-script:active {
  filter: brightness(0.96);
}

.buy-script-overlay {
  position: fixed;
  inset: 0;
  z-index: 100000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
}

.buy-script-overlay[hidden] {
  display: none;
}

.buy-script-backdrop {
  position: absolute;
  inset: 0;
  background: color-mix(in srgb, #000 72%, transparent);
  -webkit-backdrop-filter: blur(8px) saturate(112%);
  backdrop-filter: blur(8px) saturate(112%);
  opacity: 0;
  transition: opacity 0.28s ease;
}

.buy-script-overlay.is-open .buy-script-backdrop {
  opacity: 1;
}

.buy-script-dialog {
  position: relative;
  z-index: 1;
  width: min(880px, 100%);
  max-height: calc(100dvh - 40px);
  overflow: hidden;
  border-radius: 16px;
  color: #f2f3f7;
  background: var(--site-modal-surface-bg, #2a2b31);
  border: 1px solid color-mix(in srgb, #fff 10%, transparent);
  box-shadow: 0 28px 72px rgba(0, 0, 0, 0.48);
  transform: translateY(12px);
  opacity: 0;
  transition: transform 0.32s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.28s ease;
}

.buy-script-overlay.is-open .buy-script-dialog {
  transform: none;
  opacity: 1;
}

.buy-script-close {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 3;
  width: 36px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid color-mix(in srgb, #fff 14%, transparent);
  border-radius: 8px;
  background: color-mix(in srgb, #fff 6%, transparent);
  color: #c7cad6;
  cursor: pointer;
  transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.buy-script-close svg {
  width: 16px;
  height: 16px;
}

.buy-script-close:hover,
.buy-script-close:focus-visible {
  background: color-mix(in srgb, #fff 12%, transparent);
  border-color: color-mix(in srgb, #fff 28%, transparent);
  color: #fff;
  outline: none;
}

.buy-script-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(240px, 0.8fr);
  align-items: stretch;
  max-height: calc(100dvh - 40px);
  overflow: hidden;
}

.buy-script-main {
  min-width: 0;
  padding: 32px 28px 28px;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

.buy-script-eyebrow {
  margin: 0 0 12px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--site-brand-primary, #ff9701);
}

.buy-script-title {
  margin: 0 0 14px;
  font-size: clamp(1.45rem, 2.8vw, 1.95rem);
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -0.02em;
  color: #fff;
}

.buy-script-title-mark {
  color: var(--site-brand-primary, #ff9701);
}

.buy-script-desc {
  margin: 0 0 22px;
  font-size: 14.5px;
  line-height: 1.58;
  color: color-mix(in srgb, #fff 72%, transparent);
}

.buy-script-desc p {
  margin: 0 0 10px;
}

.buy-script-desc p:last-child {
  margin-bottom: 0;
}

.buy-script-desc strong {
  color: #fff;
  font-weight: 700;
}

.buy-script-features {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px 14px;
  margin: 0 0 24px;
  padding: 0;
  list-style: none;
}

.buy-script-feature {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  min-width: 0;
}

.buy-script-feature-ico {
  flex: 0 0 auto;
  width: 32px;
  height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  color: var(--site-brand-primary, #ff9701);
  background: color-mix(in srgb, var(--site-brand-primary, #ff9701) 14%, transparent);
}

.buy-script-feature-ico svg {
  width: 16px;
  height: 16px;
}

.buy-script-feature-copy {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.buy-script-feature strong {
  font-size: 13.5px;
  font-weight: 700;
  color: #fff;
}

.buy-script-feature em {
  font-style: normal;
  font-size: 12px;
  line-height: 1.4;
  color: color-mix(in srgb, #fff 58%, transparent);
}

.buy-script-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 16px;
}

.buy-script-cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 11px 20px;
  border-radius: 9px;
  font-size: 15px;
  font-weight: 700;
  text-decoration: none;
  color: #1a1206;
  background: var(--site-brand-primary, #ff9701);
  transition: filter 0.15s ease, transform 0.15s ease;
}

.buy-script-cta:hover,
.buy-script-cta:focus-visible {
  filter: brightness(1.05);
  outline: none;
}

.buy-script-cta:focus-visible {
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--site-brand-primary, #ff9701) 40%, transparent);
}

.buy-script-cta-arrow {
  width: 18px;
  height: 18px;
  transition: transform 0.18s ease;
}

.buy-script-cta:hover .buy-script-cta-arrow {
  transform: translateX(3px);
}

.buy-script-note {
  margin: 0;
  font-size: 12.5px;
  line-height: 1.4;
  color: color-mix(in srgb, #fff 52%, transparent);
}

.buy-script-aside {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 28px 22px;
  background:
    linear-gradient(168deg, color-mix(in srgb, var(--site-brand-primary, #ff9701) 14%, transparent), transparent 55%),
    color-mix(in srgb, var(--site-modal-surface-bg, #2a2b31) 88%, #000);
  border-left: 1px solid color-mix(in srgb, #fff 8%, transparent);
  border-radius: 0 16px 16px 0;
}

.buy-script-window {
  border-radius: 12px;
  overflow: hidden;
  background: #17181f;
  border: 1px solid color-mix(in srgb, #fff 8%, transparent);
}

.buy-script-window-bar {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 10px 12px;
  background: color-mix(in srgb, #fff 4%, transparent);
  border-bottom: 1px solid color-mix(in srgb, #fff 6%, transparent);
}

.buy-script-window-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #3a3d4a;
}

.buy-script-window-dot:nth-child(1) { background: #ff5f57; }
.buy-script-window-dot:nth-child(2) { background: #febc2e; }
.buy-script-window-dot:nth-child(3) { background: #28c840; }

.buy-script-window-name {
  margin-left: auto;
  font-size: 11px;
  letter-spacing: 0.04em;
  color: #6b7185;
}

.buy-script-code {
  margin: 0;
  padding: 14px 14px 16px;
  font-family: "SFMono-Regular", ui-monospace, "Cascadia Code", Consolas, monospace;
  font-size: 12px;
  line-height: 1.65;
  color: #c7cad6;
  overflow-x: auto;
}

.bsc-line {
  display: block;
  white-space: pre;
}

.bsc-c { color: #6b7185; }
.bsc-k { color: #9ecbff; }
.bsc-fn { color: #ffd18a; }
.bsc-s { color: #9ad4a0; }
.bsc-n { color: #ffb766; }
.bsc-ok { color: #8ad4a0; margin-top: 6px; }

.buy-script-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
}

.buy-script-stat {
  padding: 10px 8px;
  border-radius: 10px;
  text-align: center;
  background: color-mix(in srgb, #fff 5%, transparent);
  border: 1px solid color-mix(in srgb, #fff 8%, transparent);
}

.buy-script-stat dt {
  margin: 0 0 2px;
  font-size: 15px;
  font-weight: 700;
  color: #fff;
}

.buy-script-stat dd {
  margin: 0;
  font-size: 11px;
  line-height: 1.3;
  color: color-mix(in srgb, #fff 55%, transparent);
}

.buy-script-trust {
  margin: 0;
  font-size: 12px;
  line-height: 1.4;
  color: color-mix(in srgb, #fff 58%, transparent);
  text-align: center;
}

@media (max-width: 760px) {
  .buy-script-overlay {
    padding: 12px;
    align-items: flex-end;
  }

  .buy-script-dialog {
    max-height: calc(100dvh - 24px);
    border-radius: 16px;
  }

  .buy-script-layout {
    grid-template-columns: 1fr;
    max-height: calc(100dvh - 24px);
    overflow-x: hidden;
    overflow-y: auto;
  }

  .buy-script-main {
    padding: 24px 18px 20px;
    overflow: visible;
  }

  .buy-script-aside {
    border-left: 0;
    border-top: 1px solid color-mix(in srgb, #fff 8%, transparent);
    border-radius: 0 0 16px 16px;
    padding: 18px;
  }

  .buy-script-features {
    grid-template-columns: 1fr;
  }

  .buy-script-title {
    font-size: 1.4rem;
  }

  .buy-script-cta {
    width: 100%;
    justify-content: center;
  }
}

@media (prefers-reduced-motion: reduce) {
  .buy-script-dialog,
  .buy-script-backdrop,
  .buy-script-cta,
  .buy-script-cta-arrow,
  .buy-script-close {
    transition: none;
  }
}

/* Welcome modal — split layout, readable copy, mascot aside */
.age-limit-modal.welcome-modal .micromodal-overlay,
.age-limit-modal.welcome-modal .welcome-modal__overlay {
  -webkit-backdrop-filter: blur(8px) saturate(115%);
  backdrop-filter: blur(8px) saturate(115%);
  background: color-mix(in srgb, var(--site-modal-overlay-scrim, #000) 72%, transparent) !important;
}

.age-limit-modal.welcome-modal .micromodal-container,
.age-limit-modal.welcome-modal .welcome-modal__dialog {
  width: min(100%, 720px);
  max-width: 720px;
  max-height: calc(100dvh - 32px);
  margin: 16px;
  border-radius: 16px;
  overflow: hidden;
  background-color: var(--site-modal-surface-bg, #2a2b31);
}

.age-limit-modal.welcome-modal[aria-hidden="false"] .micromodal-container,
.age-limit-modal.welcome-modal.is-open .micromodal-container {
  animation: welcomeModalIn 0.34s cubic-bezier(0.16, 1, 0.3, 1);
}

@keyframes welcomeModalIn {
  from {
    opacity: 0;
    transform: translateY(14px) scale(0.985);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

.age-limit-modal.welcome-modal .micromodal-content,
.age-limit-modal.welcome-modal .welcome-modal__panel {
  border-radius: 16px;
  overflow: hidden;
  background-color: var(--site-modal-surface-bg, #2a2b31);
  border: 1px solid color-mix(in srgb, var(--site-modal-body-text, #fff) 10%, transparent);
  box-shadow: 0 28px 72px rgba(0, 0, 0, 0.48);
}

.age-limit-modal.welcome-modal .micromodal-body,
.age-limit-modal.welcome-modal .welcome-modal__body {
  padding: 0 !important;
  max-height: calc(100dvh - 32px);
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  border-radius: inherit;
}

.welcome-modal__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(180px, 34%);
  align-items: stretch;
}

.welcome-modal__copy {
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 28px 28px 22px;
}

.welcome-modal__eyebrow {
  margin: 0 0 10px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--site-brand-primary, #ff8c01);
}

.age-limit-modal.welcome-modal .welcome-modal__title,
.age-limit-modal.welcome-modal .micromodal-title {
  margin: 0 0 14px !important;
  text-align: left !important;
  font-size: clamp(1.45rem, 2.6vw, 1.9rem) !important;
  line-height: 1.15 !important;
  font-weight: 700;
}

.welcome-modal__text,
.age-limit-modal.welcome-modal .micromodal-text-content {
  margin-bottom: 22px;
  text-align: left !important;
}

.welcome-modal__text p,
.age-limit-modal.welcome-modal .micromodal-text-content p,
.welcome-modal__lead {
  margin: 0 0 12px !important;
  font-size: 15px !important;
  line-height: 1.55 !important;
  color: color-mix(in srgb, var(--site-modal-body-text, #fff) 86%, transparent) !important;
}

.welcome-modal__text p:last-child,
.age-limit-modal.welcome-modal .micromodal-text-content p:last-child {
  margin-bottom: 0 !important;
}

.welcome-modal__text .color-bold,
.welcome-modal__text strong {
  color: var(--site-modal-body-text, #fff);
  font-weight: 700;
}

.welcome-modal__list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 9px;
}

.welcome-modal__list li {
  position: relative;
  padding-left: 18px;
  font-size: 14px;
  line-height: 1.45;
  color: color-mix(in srgb, var(--site-modal-body-text, #fff) 80%, transparent);
}

.welcome-modal__list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.58em;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--site-brand-primary, #ff8c01);
}

.welcome-modal__actions,
.age-limit-modal.welcome-modal .micromodal-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 0 0 12px !important;
  justify-content: flex-start !important;
}

.welcome-modal__actions .btn,
.age-limit-modal.welcome-modal .micromodal-hero-actions .btn {
  flex: 1 1 148px;
  min-height: 44px;
  padding: 11px 18px;
  border-radius: 9px;
  font-size: 15px;
  font-weight: 600;
}

.age-limit-modal.welcome-modal .welcome-modal__leave,
.age-limit-modal.welcome-modal .micromodal-hero-actions .btn-secondary {
  flex: 0 1 auto;
  background: transparent !important;
  border: 1px solid color-mix(in srgb, var(--site-modal-body-text, #fff) 22%, transparent) !important;
}

.welcome-modal__footnote {
  margin: 0;
  font-size: 12px;
  line-height: 1.45;
  color: color-mix(in srgb, var(--site-modal-body-text, #fff) 52%, transparent);
}

.welcome-modal__visual {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  padding: 18px 14px 0;
  background:
    linear-gradient(168deg, color-mix(in srgb, var(--site-brand-primary, #ff8c01) 16%, transparent), transparent 58%),
    color-mix(in srgb, var(--site-modal-surface-bg, #2a2b31) 90%, #000);
  border-left: 1px solid color-mix(in srgb, var(--site-modal-body-text, #fff) 8%, transparent);
  border-radius: 0 16px 16px 0;
}

.welcome-modal__visual-frame {
  width: 100%;
  max-width: 210px;
}

.age-limit-modal.welcome-modal .age-limit-modal-img,
.age-limit-modal.welcome-modal .welcome-modal__mascot {
  display: block;
  width: 100%;
  height: auto;
  margin: 0 !important;
  object-fit: contain;
  object-position: bottom center;
}

@media (max-width: 680px) {
  .welcome-modal__grid {
    grid-template-columns: 1fr;
  }

  .welcome-modal__visual {
    order: -1;
    max-height: 168px;
    overflow: hidden;
    padding: 14px 14px 0;
    border-left: 0;
    border-bottom: 1px solid color-mix(in srgb, var(--site-modal-body-text, #fff) 8%, transparent);
    border-radius: 16px 16px 0 0;
  }

  .welcome-modal__visual-frame {
    max-width: 132px;
  }

  .welcome-modal__copy {
    padding: 20px 18px 18px;
  }

  .welcome-modal__actions .btn,
  .age-limit-modal.welcome-modal .micromodal-hero-actions .btn {
    flex: 1 1 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .age-limit-modal.welcome-modal[aria-hidden="false"] .micromodal-container,
  .age-limit-modal.welcome-modal.is-open .micromodal-container {
    animation: none;
  }
}

/* Admin popups panel — interactive overlay previews */
.admin-popups-preview-layer.is-modal #age-limit-modal,
.admin-popups-preview-layer.is-modal .buy-script-overlay,
.admin-popups-preview-layer.is-modal #site-disclaimer-modal {
  position: absolute;
  inset: 0;
  z-index: 5;
}

.admin-popups-preview-layer.is-modal #age-limit-modal .micromodal-overlay,
.admin-popups-preview-layer.is-modal .buy-script-overlay .buy-script-backdrop,
.admin-popups-preview-layer.is-modal #site-disclaimer-modal .site-disclaimer-overlay {
  position: absolute;
  inset: 0;
}

.admin-popups-preview-layer.is-modal #age-limit-modal .micromodal-container,
.admin-popups-preview-layer.is-modal .buy-script-overlay .buy-script-dialog,
.admin-popups-preview-layer.is-modal #site-disclaimer-modal .site-disclaimer-dialog {
  position: relative;
  z-index: 2;
}

/* Welcome modal preview — match live site (dark panel, split layout, no vendor hero padding) */
.admin-popups-preview-layer.is-modal #age-limit-modal.welcome-modal .micromodal-content,
.admin-popups-preview-layer.is-modal #age-limit-modal.welcome-modal .welcome-modal__panel {
  background-color: var(--site-modal-surface-bg, #2a2b31) !important;
}

.admin-popups-preview-layer.is-modal #age-limit-modal.welcome-modal,
.admin-popups-preview-layer.is-modal #age-limit-modal.welcome-modal .micromodal-body,
.admin-popups-preview-layer.is-modal #age-limit-modal.welcome-modal .micromodal-title,
.admin-popups-preview-layer.is-modal #age-limit-modal.welcome-modal .micromodal-text-content {
  color: var(--site-modal-body-text, #fff) !important;
}

.admin-popups-preview-layer.is-modal #age-limit-modal.welcome-modal .welcome-modal__actions,
.admin-popups-preview-layer.is-modal #age-limit-modal.welcome-modal .micromodal-hero-actions {
  justify-content: flex-start !important;
  margin-bottom: 12px !important;
}

.admin-popups-preview-layer.is-modal #age-limit-modal.welcome-modal .welcome-modal__actions .btn,
.admin-popups-preview-layer.is-modal #age-limit-modal.welcome-modal .micromodal-hero-actions .btn {
  flex-grow: 0;
}

.admin-popups-preview-canvas.is-device-desktop .admin-popups-preview-layer.is-modal #age-limit-modal.welcome-modal .welcome-modal__grid {
  grid-template-columns: minmax(0, 1fr) minmax(150px, 34%);
}

/* Admin-only per-entry thumbnail controls on the review page */
.entry-admin-thumb {
  margin-top: 10px;
  padding: 12px 14px;
  border: 1px solid rgba(15, 23, 42, 0.14);
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.08);
  font-size: 13px;
  color: #1f2430;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

body.dark .entry-admin-thumb {
  background: #23252c;
  border-color: rgba(255, 255, 255, 0.14);
  color: #e8eaf0;
}

.entry-admin-thumb.is-busy {
  opacity: 0.75;
  pointer-events: none;
}

.entry-admin-thumb-head {
  display: flex;
  align-items: center;
  gap: 8px;
}

.entry-admin-thumb-badge {
  padding: 2px 7px;
  border-radius: 5px;
  background: #ff9701;
  color: #fff;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.entry-admin-thumb-title {
  font-weight: 700;
}

.entry-admin-thumb-source {
  margin-left: auto;
  font-size: 11px;
  font-weight: 600;
  color: #6b7280;
  text-align: right;
}

.entry-admin-thumb-bl {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 28px;
  padding: 2px 7px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.04em;
  color: #fff;
  background: #c0392b;
}

.entry-admin-thumb-bl[hidden] {
  display: none !important;
}

body.dark .entry-admin-thumb-source {
  color: #a7adba;
}

.entry-admin-thumb-btn--warn {
  color: #9a3412;
  border-color: rgba(234, 88, 12, 0.4);
  background: rgba(255, 151, 1, 0.08);
}

.entry-admin-thumb-btn--warn:hover:not(:disabled) {
  background: rgba(255, 151, 1, 0.16);
}

.entry-admin-thumb-toggle {
  display: flex;
  align-items: center;
  gap: 9px;
  cursor: pointer;
  user-select: none;
}

.entry-admin-thumb-toggle input {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}

.entry-admin-thumb-toggle-ui {
  position: relative;
  flex-shrink: 0;
  width: 38px;
  height: 22px;
  border-radius: 999px;
  background: #cfd4dd;
  transition: background 0.18s ease;
}

.entry-admin-thumb-toggle-ui::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 2px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
  transition: transform 0.18s ease;
}

.entry-admin-thumb-toggle input:checked + .entry-admin-thumb-toggle-ui {
  background: #ff9701;
}

.entry-admin-thumb-toggle input:checked + .entry-admin-thumb-toggle-ui::after {
  transform: translateX(16px);
}

.entry-admin-thumb-toggle input:focus-visible + .entry-admin-thumb-toggle-ui {
  outline: 2px solid #ff9701;
  outline-offset: 2px;
}

.entry-admin-thumb-toggle-copy {
  line-height: 1.3;
}

.entry-admin-thumb-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.entry-admin-thumb-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 7px 12px;
  border-radius: 7px;
  border: 1px solid rgba(15, 23, 42, 0.16);
  background: #f4f6fa;
  color: #1f2430;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease;
}

.entry-admin-thumb-btn:hover:not(:disabled) {
  background: #e9edf4;
  border-color: rgba(15, 23, 42, 0.28);
}

body.dark .entry-admin-thumb-btn {
  background: #2c2f38;
  border-color: rgba(255, 255, 255, 0.16);
  color: #e8eaf0;
}

body.dark .entry-admin-thumb-btn:hover:not(:disabled) {
  background: #353843;
}

.entry-admin-thumb-btn--upload {
  background: #ff9701;
  border-color: #ff9701;
  color: #fff;
}

.entry-admin-thumb-btn--upload:hover {
  background: #f08a00;
  border-color: #f08a00;
}

.entry-admin-thumb-btn--danger {
  color: #c0392b;
  border-color: rgba(192, 57, 43, 0.35);
}

.entry-admin-thumb-btn--danger:hover:not(:disabled) {
  background: rgba(192, 57, 43, 0.08);
}

.entry-admin-thumb-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.entry-admin-thumb-status {
  margin: 0;
  min-height: 15px;
  font-size: 11.5px;
  font-weight: 600;
  color: #3f8a3f;
}

.entry-admin-thumb-status.is-error {
  color: #c0392b;
}

/* Info / about pages — round icons from the icon library */
.ind-sidebar-link-home:before {
  background-image: var(--site-info-round-icon) !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
}

.contacts-hero-img {
  width: 96px;
  height: 96px;
  object-fit: contain;
  object-position: center;
  border-radius: 50%;
  background: #fff;
}

@media (max-width: 767px) {
  .contacts-hero-img {
    width: 56px;
    height: 56px;
  }
}

.contacts-list-icon {
  width: 22px;
  height: 22px;
  object-fit: contain;
  flex-shrink: 0;
}

/* ==========================================================================
   About page — brand-first editorial layout
   ========================================================================== */

/* Shared tokens for About + FAQ/legal pages (sidebar uses the About look everywhere). */
.individual-page {
  --about-ink: #1a1c22;
  --about-muted: #5c6370;
  --about-line: rgba(26, 28, 34, 0.1);
  --about-surface: #fff;
  --about-wash: linear-gradient(
    145deg,
    color-mix(in srgb, var(--site-brand-primary, #ff9701) 14%, #fff) 0%,
    #fff 42%,
    color-mix(in srgb, var(--site-brand-primary, #ff9701) 6%, #f7f8fb) 100%
  );
  --about-rail: color-mix(in srgb, var(--site-brand-primary, #ff9701) 18%, transparent);
}

body.dark .individual-page {
  --about-ink: #f3f4f6;
  --about-muted: #a7adba;
  --about-line: rgba(255, 255, 255, 0.1);
  --about-surface: #1c1f27;
  --about-wash: linear-gradient(
    145deg,
    color-mix(in srgb, var(--site-brand-primary, #ff9701) 18%, #16181f) 0%,
    #1c1f27 48%,
    #16181f 100%
  );
  --about-rail: color-mix(in srgb, var(--site-brand-primary, #ff9701) 28%, transparent);
}

.individual-page .about-page-layout,
.individual-page .link-container {
  align-items: flex-start;
}

.individual-page .about-page-content,
.individual-page .ind-content {
  min-width: 0;
}

.individual-page .ind-sidebar {
  background: transparent !important;
  border-right: 1px solid var(--about-line) !important;
}

.individual-page .ind-sidebar-nav {
  background: transparent !important;
}

.individual-page .ind-sidebar-link {
  border-radius: 10px;
  margin: 2px 8px;
  padding-left: 42px;
  color: var(--about-ink) !important;
  background: transparent !important;
}

.individual-page .ind-sidebar-link:before {
  background-color: var(--site-brand-primary, #ff9701) !important;
}

.individual-page .ind-sidebar-link.is-active {
  background: color-mix(in srgb, var(--site-brand-primary, #ff9701) 12%, transparent) !important;
  color: var(--about-ink) !important;
}

.individual-page .ind-sidebar-link.is-active:before {
  background-color: var(--site-brand-primary, #ff9701) !important;
}

/* Hero — first viewport: brand + one line + contact + mascot */
.about-hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(160px, 0.85fr);
  gap: 28px 36px;
  align-items: end;
  margin: 0 0 36px;
  padding: 28px 28px 32px;
  border: 1px solid var(--about-line);
  border-radius: 16px;
  background: var(--about-wash);
  overflow: hidden;
  isolation: isolate;
  animation: aboutHeroIn 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}

@keyframes aboutHeroIn {
  from {
    opacity: 0;
    transform: translateY(12px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

.about-hero::before {
  content: '';
  position: absolute;
  inset: 0 auto 0 0;
  width: 4px;
  background: linear-gradient(
    180deg,
    var(--site-brand-primary, #ff9701),
    color-mix(in srgb, var(--site-brand-primary, #ff9701) 30%, transparent)
  );
}

.about-hero-copy {
  position: relative;
  z-index: 1;
  min-width: 0;
}

.about-hero-status {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 14px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #2f9d4f;
}

.about-hero-status-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #2f9d4f;
  box-shadow: 0 0 0 0 rgba(47, 157, 79, 0.45);
  animation: aboutStatusPulse 2.4s ease-out infinite;
}

@keyframes aboutStatusPulse {
  0% { box-shadow: 0 0 0 0 rgba(47, 157, 79, 0.45); }
  70% { box-shadow: 0 0 0 10px rgba(47, 157, 79, 0); }
  100% { box-shadow: 0 0 0 0 rgba(47, 157, 79, 0); }
}

.about-hero-eyebrow {
  margin: 0 0 6px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--site-brand-primary, #ff9701);
}

.about-hero-brand {
  margin: 0 0 12px;
  font-size: clamp(2rem, 4.2vw, 3.25rem);
  font-weight: 800;
  line-height: 1.05;
  letter-spacing: -0.03em;
  color: var(--about-ink);
}

.about-hero-tag {
  margin: 0 0 22px;
  max-width: 36rem;
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--about-muted);
}

.about-hero-channels {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin: 0 0 16px;
  padding: 0;
  list-style: none;
}

/* Vendor about-page styles add disc bullets to every .ind-content ul li */
.ind-content .about-hero-channels > li,
.about-hero-channels > li {
  margin: 0;
  padding: 0;
  list-style: none;
  position: static;
  line-height: normal;
}

.ind-content .about-hero-channels > li:before,
.about-hero-channels > li:before {
  content: none !important;
  display: none !important;
}

.about-hero-channel {
  display: grid;
  grid-template-columns: 20px auto minmax(0, 1fr);
  align-items: center;
  gap: 10px 12px;
  min-height: 44px;
  padding: 8px 12px;
  border-radius: 10px;
  border: 1px solid var(--about-line);
  background: color-mix(in srgb, var(--about-surface) 82%, transparent);
  color: var(--about-ink);
  text-decoration: none;
  transition: border-color 0.15s ease, background 0.15s ease, transform 0.15s ease;
}

.about-hero-channel:hover,
.about-hero-channel:focus-visible {
  border-color: color-mix(in srgb, var(--site-brand-primary, #ff9701) 55%, transparent);
  background: color-mix(in srgb, var(--site-brand-primary, #ff9701) 8%, var(--about-surface));
  transform: translateY(-1px);
}

.about-hero-channel-icon {
  width: 20px;
  height: 20px;
  object-fit: contain;
}

.about-hero-channel-label {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--about-muted);
}

.about-hero-channel-value {
  min-width: 0;
  font-size: 14px;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--about-ink);
}

.about-hero-note {
  margin: 0;
  font-size: 13px;
  line-height: 1.5;
  color: var(--about-muted);
}

.about-hero-visual {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  min-height: 200px;
  pointer-events: none;
}

.about-hero-visual-glow {
  position: absolute;
  width: min(100%, 260px);
  aspect-ratio: 1;
  border-radius: 50%;
  background: radial-gradient(
    circle,
    color-mix(in srgb, var(--site-brand-primary, #ff9701) 35%, transparent) 0%,
    transparent 70%
  );
  filter: blur(8px);
  animation: aboutGlow 4.5s ease-in-out infinite alternate;
}

@keyframes aboutGlow {
  from { transform: scale(0.92); opacity: 0.7; }
  to { transform: scale(1.08); opacity: 1; }
}

.about-hero-mascot {
  position: relative;
  z-index: 1;
  width: min(100%, 220px);
  height: auto;
  max-height: 240px;
  object-fit: contain;
  object-position: bottom center;
  filter: drop-shadow(0 18px 28px rgba(15, 23, 42, 0.18));
  animation: aboutMascotIn 0.55s cubic-bezier(0.22, 1, 0.36, 1) 0.08s both;
}

@keyframes aboutMascotIn {
  from {
    opacity: 0;
    transform: translateY(18px) scale(0.96);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

/* Body copy */
.about-body {
  display: flex;
  flex-direction: column;
  gap: 28px;
  color: var(--about-muted);
}

.about-section-title {
  margin: 0 0 10px;
  font-size: 1.25rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--about-ink);
}

.about-section-text {
  margin: 0;
  font-size: 1rem;
  line-height: 1.7;
}

.about-section-text a {
  color: var(--site-brand-primary, #ff9701);
  font-weight: 600;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
}

.about-section--lead {
  padding-bottom: 8px;
  border-bottom: 1px solid var(--about-line);
}

.about-pillars {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px 22px;
  margin: 4px 0;
  padding: 22px 0;
  border-top: 1px solid var(--about-line);
  border-bottom: 1px solid var(--about-line);
}

.about-pillar {
  min-width: 0;
  padding-left: 14px;
  border-left: 3px solid var(--about-rail);
}

.about-pillar-index {
  display: block;
  margin-bottom: 6px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.08em;
  color: var(--site-brand-primary, #ff9701);
}

.about-pillar-title {
  margin: 0 0 8px;
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--about-ink);
}

.about-pillar-text {
  margin: 0;
  font-size: 0.95rem;
  line-height: 1.55;
}

.about-section--cta {
  margin-top: 4px;
  padding: 22px 22px 24px;
  border-radius: 14px;
  border: 1px solid var(--about-line);
  background: color-mix(in srgb, var(--site-brand-primary, #ff9701) 7%, var(--about-surface));
}

.about-section-actions {
  margin: 16px 0 0;
}

.about-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 18px;
  border-radius: 10px;
  background: var(--site-brand-primary, #ff9701);
  color: #fff !important;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none !important;
  transition: filter 0.15s ease, transform 0.15s ease;
}

.about-cta:hover,
.about-cta:focus-visible {
  filter: brightness(0.96);
  transform: translateY(-1px);
}

@media (prefers-reduced-motion: reduce) {
  .about-hero,
  .about-hero-mascot,
  .about-hero-visual-glow,
  .about-hero-status-dot,
  .about-hero-channel,
  .about-cta {
    animation: none;
    transition: none;
  }
}

@media (max-width: 991px) {
  .about-hero {
    grid-template-columns: 1fr;
    gap: 18px;
    padding: 22px 18px 20px;
  }

  .about-hero-visual {
    order: -1;
    min-height: 140px;
  }

  .about-hero-mascot {
    width: min(52%, 160px);
    max-height: 160px;
  }

  .about-pillars {
    grid-template-columns: 1fr;
    gap: 16px;
  }
}

@media (max-width: 767px) {
  .about-hero-brand {
    font-size: 2rem;
  }

  .about-hero-channel {
    grid-template-columns: 20px minmax(0, 1fr);
    grid-template-rows: auto auto;
  }

  .about-hero-channel-label {
    grid-column: 2;
  }

  .about-hero-channel-value {
    grid-column: 2;
  }

  .about-hero-channel-icon {
    grid-row: 1 / span 2;
  }
}

/*
 * Page-shell width lock (must stay after deferred vendor home/below/review CSS).
 * .container already uses --container-width; these sections hardcode max-width in vendor.
 */
.copyright-message .inner-footer,
.footer .inner-footer,
.top-bar-review .holder,
.admin-layout-bar {
  max-width: var(--container-width, 1158px);
}

body.admin-layout-mode .admin-copyright-wrap + .footer::before {
  max-width: min(var(--container-width, 1158px), calc(100% - 24px));
}

@media (max-width: 1400px) {
  .copyright-message .inner-footer,
  .footer .inner-footer,
  .top-bar-review .holder {
    max-width: var(--container-width-compact, 1028px);
  }
}

.scrollspy-btn--cube {
  --circ: 100 !important;
}

.scrollspy-btn--cube .scrollspy-btn-circles {
  transform: none !important;
}

.scrollspy-btn--cube .scrollspy-btn-circle,
.scrollspy-btn--cube .scrollspy-btn-progress-bar {
  fill: none !important;
}

/* Mobile category/review footer + toolbar lock (after deferred below-the-fold + page CSS). */
@media (max-width: 991px) {
  footer.w-margin .copy-text {
    margin-bottom: 0 !important;
  }

  body.homepage .footer-bottom,
  body.categorypage .footer-bottom,
  body.singlepage .footer-bottom,
  body.aboutpage .footer-bottom {
    margin-top: 0 !important;
    padding-top: 28px !important;
  }

  body.homepage .footer-bottom:before,
  body.categorypage .footer-bottom:before,
  body.singlepage .footer-bottom:before,
  body.aboutpage .footer-bottom:before {
    display: none !important;
  }

  body.homepage .footer .copy-text {
    height: auto !important;
  }

  body.homepage .bottom-toolbar,
  body.categorypage .bottom-toolbar,
  body.singlepage .bottom-toolbar {
    bottom: calc(-1 * (var(--mob-bottom-toolbar-height) + 16px)) !important;
    transform: none !important;
  }

  body.homepage .bottom-toolbar.bottom-toolbar-show,
  body.categorypage .bottom-toolbar.bottom-toolbar-show,
  body.singlepage .bottom-toolbar.bottom-toolbar-show {
    bottom: var(--mob-safe-bottom, 0px) !important;
    transform: none !important;
  }

  body.homepage .bottom-toolbar-main,
  body.homepage .bottom-toolbar-side,
  body.categorypage .bottom-toolbar-main,
  body.categorypage .bottom-toolbar-side,
  body.singlepage .bottom-toolbar-main,
  body.singlepage .bottom-toolbar-side {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    border-radius: 14px !important;
  }

  body.homepage .bottom-toolbar-category .bottom-toolbar-content-slot,
  body.categorypage .bottom-toolbar-category .bottom-toolbar-content-slot,
  body.singlepage .bottom-toolbar-review .bottom-toolbar-content-slot {
    border-radius: 10px !important;
  }

  body.homepage .bottom-toolbar-main,
  body.categorypage .bottom-toolbar-main,
  body.singlepage .bottom-toolbar-main {
    justify-content: flex-start !important;
  }

  body.homepage .bottom-toolbar-title,
  body.categorypage .bottom-toolbar-title,
  body.singlepage .bottom-toolbar-title {
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
}