/* SoftPas apkpure-style clone skin
   Hand-authored from computed-style tokens captured at apkpure.com.
   Values are design facts (numbers, hex codes); no source code copied.
   Accent swapped to softpas blurple #5865f2.
   Replaces apkpure-skin.css. */

:root {
  --ap-bg: #f2f5f9;
  --ap-module-bg: #ffffff;
  --ap-text: #5e5e5e;
  --ap-title: #4b4b4b;
  --ap-muted: #8a8a8a;
  --ap-border: #e7e7e7;
  --ap-accent: #5865f2;          /* softpas blurple */
  --ap-accent-hover: #4752c4;
  --ap-rank1: #ef4444;
  --ap-rank2: #fb923c;
  --ap-rank3: #facc15;
  --ap-rank-bg: #f3f4f6;
  --ap-rank-text: #6b7280;
  --ap-footer-bg: #ffffff;
  --ap-footer-text: #5e5e5e;
  --ap-header-h: 70px;
  --ap-content-max: 1349px;
  --ap-gap: 8px;
  --ap-radius-card: 12px;
}

/* Base ----------------------------------------------------------- */
html, body {
  background: var(--ap-bg);
  color-scheme: light;
  overflow-x: hidden;
}
body.font-body, body {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: var(--ap-text);
  font-size: 14px;
  line-height: 21px;
  padding-top: var(--ap-header-h);
}

/* Override softpas's surface tokens within our clone scope */
.ap-shell { background: var(--ap-bg); }
.ap-container {
  max-width: var(--ap-content-max);
  margin: 0 auto;
  padding: 0 16px;
}
@media (min-width: 1280px) {
  .ap-container { padding: 0 24px; }
}

/* Header --------------------------------------------------------- */
.ap-header {
  position: fixed;
  top: 0; left: 0; right: 0;
  height: var(--ap-header-h);
  background: #fff;
  border-bottom: 1px solid var(--ap-border);
  z-index: 1000;
  display: flex;
  align-items: center;
  overflow: visible;
}
.ap-header__inner {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  max-width: var(--ap-content-max);
  margin: 0 auto;
  padding: 0 16px;
  height: 100%;
  min-width: 0;
}
.ap-header__inner *,
.ap-search,
.ap-search * {
  box-sizing: border-box;
}
.ap-header__logo {
  font-weight: 800;
  font-size: 26px;
  line-height: 1;
  color: var(--ap-accent);
  text-decoration: none;
  flex-shrink: 0;
  letter-spacing: -0.02em;
  min-width: 0;
  white-space: nowrap;
}
.ap-nav {
  display: flex;
  align-items: center;
  gap: 4px;
  flex-shrink: 0;
}
.ap-nav__link {
  display: inline-flex;
  align-items: center;
  height: 46px;
  padding: 0 14px;
  font-size: 14px;
  font-weight: 500;
  color: var(--ap-title);
  text-decoration: none;
  border-radius: 4px;
}
.ap-nav__link:hover { color: var(--ap-accent); }
.ap-search {
  flex: 1;
  max-width: 685px;
  min-width: 0;
  height: 40px;
  display: flex;
  align-items: center;
  background: #f3f4f6;
  border-radius: 20px;
  padding: 0 4px 0 16px;
}
.ap-search input {
  flex: 1;
  min-width: 0;
  border: 0;
  background: transparent;
  font-size: 14px;
  color: var(--ap-text);
  outline: none;
  height: 100%;
  font-family: inherit;
}
.ap-search input::placeholder { color: var(--ap-muted); }
.ap-search__btn {
  height: 32px;
  width: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--ap-accent);
  color: #fff;
  border: 0;
  border-radius: 50%;
  cursor: pointer;
}
.ap-search__btn:hover { background: var(--ap-accent-hover); }
.ap-header__icons {
  display: flex;
  align-items: center;
  gap: 4px;
  flex-shrink: 0;
}
.ap-header__icon {
  width: 40px; height: 40px;
  display: inline-flex; align-items: center; justify-content: center;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--ap-title);
  cursor: pointer;
  font-family: inherit;
  text-decoration: none;
}
.ap-header__icon:hover { background: #f3f4f6; color: var(--ap-accent); }
.ap-language {
  position: relative;
  display: inline-flex;
  align-items: center;
}
.ap-language__toggle {
  gap: 4px;
  width: auto;
  min-width: 48px;
  padding: 0 10px;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 800;
  line-height: 1;
  text-transform: uppercase;
}
.ap-language__menu {
  display: none;
  position: absolute;
  top: 100%;
  right: 0;
  min-width: 184px;
  padding-top: 8px;
  z-index: 1002;
}
.ap-language__panel {
  max-height: min(360px, calc(100vh - var(--ap-header-h) - 24px));
  overflow: auto;
  padding: 6px;
  border: 1px solid var(--ap-border);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 16px 40px rgba(15, 23, 42, 0.14);
}
.ap-language.is-open .ap-language__menu {
  display: block !important;
}
.ap-language:focus-within .ap-language__menu {
  display: block !important;
}
.ap-language:hover .ap-language__menu {
  display: block !important;
}
.ap-language__link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 36px;
  padding: 0 10px;
  border-radius: 6px;
  color: var(--ap-title);
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
}
.ap-language__link strong {
  color: var(--ap-muted);
  font-size: 11px;
  letter-spacing: 0;
}
.ap-language__link:hover,
.ap-language__link[aria-current="true"] {
  background: #f3f4f6;
  color: var(--ap-accent);
}
.ap-language__link[aria-current="true"] strong {
  color: var(--ap-accent);
}
.ap-search-toggle { display: none; }
.ap-burger--mobile { display: none; }
.ap-menu-toggle--desktop {
  flex-shrink: 0;
  border: 1px solid var(--ap-border);
  background: #fff;
  color: var(--ap-title);
}
.ap-menu-toggle--desktop:hover,
.ap-menu-toggle--desktop[aria-expanded="true"] {
  border-color: color-mix(in srgb, var(--ap-accent) 34%, var(--ap-border));
  background: #f7f8ff;
  color: var(--ap-accent);
}
.ap-mobile-search,
.ap-mobile-menu {
  position: fixed;
  top: var(--ap-header-h);
  left: 0;
  right: 0;
  background: #fff;
  border-bottom: 1px solid var(--ap-border);
  z-index: 999;
}
.ap-mobile-search {
  padding: 12px 16px;
}
.ap-search--mobile {
  width: 100%;
  max-width: none;
}
.ap-mobile-menu {
  max-height: calc(100vh - var(--ap-header-h));
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding: 12px 16px 18px;
}
.ap-mobile-menu__inner {
  width: 100%;
  max-width: var(--ap-content-max);
  margin: 0 auto;
}
.ap-mobile-menu__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 2px 0 10px;
  color: var(--ap-title);
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .05em;
}
.ap-mobile-menu__close {
  width: 36px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 50%;
  background: #f3f4f6;
  color: var(--ap-title);
  cursor: pointer;
}
.ap-mobile-menu__nav,
.ap-mobile-menu__categories {
  display: flex;
  flex-direction: column;
}
.ap-mobile-menu__nav {
  gap: 4px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--ap-border);
}
.ap-mobile-menu__categories {
  gap: 12px;
  padding-top: 12px;
}
.ap-mobile-menu__languages {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  padding: 12px 0;
  border-bottom: 1px solid var(--ap-border);
}
.ap-mobile-menu__languages a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-height: 38px;
  min-width: 0;
  padding: 0 10px;
  border-radius: 6px;
  color: var(--ap-title);
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
}
.ap-mobile-menu__languages span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ap-mobile-menu__languages strong {
  color: var(--ap-muted);
  font-size: 11px;
  letter-spacing: 0;
}
.ap-mobile-menu__languages a[aria-current="true"] {
  background: #f3f4f6;
  color: var(--ap-accent);
}
.ap-mobile-menu__languages a[aria-current="true"] strong {
  color: var(--ap-accent);
}
.ap-mobile-menu__link,
.ap-mobile-menu__category-link,
.ap-mobile-menu__sub-link {
  display: flex;
  align-items: center;
  min-height: 40px;
  color: var(--ap-title);
  text-decoration: none;
  border-radius: 6px;
}
.ap-mobile-menu__link,
.ap-mobile-menu__category-link {
  padding: 0 10px;
  font-size: 14px;
  font-weight: 600;
}
.ap-mobile-menu__subcategories {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 4px 8px;
  padding: 4px 0 0 10px;
}
.ap-mobile-menu__sub-link {
  min-width: 0;
  min-height: 34px;
  padding: 0 8px;
  color: var(--ap-text);
  font-size: 12px;
  line-height: 16px;
}
.ap-mobile-menu__link:hover,
.ap-mobile-menu__category-link:hover,
.ap-mobile-menu__sub-link:hover,
.ap-mobile-menu__languages a:hover,
.ap-mobile-menu__close:hover {
  background: #f3f4f6;
  color: var(--ap-accent);
}
@media (max-width: 1180px) and (min-width: 1024px) {
  .ap-header__inner {
    display: grid;
    grid-template-columns: minmax(86px, 112px) minmax(0, 1fr) 40px auto;
    gap: 10px;
    padding: 0 12px;
  }
  .ap-nav {
    display: none;
  }
  .ap-header__logo {
    justify-self: start;
    max-width: 112px;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .ap-search {
    width: 100%;
    max-width: none;
  }
  .ap-header__icons {
    justify-self: end;
    margin-left: 0;
  }
}
@media (min-width: 1024px) {
  .ap-mobile-search { display: none !important; }
  .ap-mobile-menu {
    padding: 18px 16px 22px;
    box-shadow: 0 18px 40px rgba(15, 23, 42, 0.14);
  }
  .ap-mobile-menu__head {
    padding-bottom: 14px;
  }
  .ap-mobile-menu__nav {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 6px;
    padding-bottom: 14px;
  }
  .ap-mobile-menu__link {
    min-height: 36px;
    padding: 0 12px;
  }
  .ap-mobile-menu__languages {
    grid-template-columns: repeat(auto-fit, minmax(128px, 1fr));
    padding: 14px 0;
  }
  .ap-mobile-menu__categories {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px 24px;
    max-height: calc(100vh - var(--ap-header-h) - 170px);
    overflow-y: auto;
    padding: 18px 4px 2px 0;
  }
  .ap-mobile-menu__category {
    min-width: 0;
  }
  .ap-mobile-menu__category-link {
    min-height: 32px;
    padding: 0;
    font-size: 14px;
    font-weight: 700;
  }
  .ap-mobile-menu__subcategories {
    grid-template-columns: 1fr;
    gap: 2px;
    padding: 6px 0 0;
  }
  .ap-mobile-menu__sub-link {
    min-height: 30px;
    padding: 0;
  }
  .ap-mobile-menu__category-link:hover,
  .ap-mobile-menu__sub-link:hover {
    background: transparent;
  }
}
@media (max-width: 1023px) {
  .ap-header__inner {
    display: grid;
    grid-template-columns: minmax(78px, auto) minmax(0, 1fr) auto 40px;
    gap: 8px;
    padding: 0 12px;
  }
  .ap-burger {
    order: 4;
    justify-self: end;
  }
  .ap-nav,
  .ap-search-toggle,
  .ap-menu-toggle--desktop { display: none; }
  .ap-language--desktop { display: none; }
  .ap-header__logo {
    order: 1;
    justify-self: start;
    font-size: 24px;
    max-width: 110px;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .ap-search--desktop {
    order: 2;
    display: flex;
    width: 100%;
    max-width: none;
    padding-left: 12px;
  }
  .ap-search input {
    font-size: 13px;
  }
  .ap-header__icons {
    order: 3;
    justify-self: end;
    margin-left: 0;
    gap: 0;
  }
  .ap-header__auth-icon,
  .ap-burger--mobile { display: inline-flex; }
}
@media (max-width: 767px) {
  .ap-header__inner {
    grid-template-columns: minmax(74px, auto) minmax(0, 1fr) auto 38px;
    gap: 6px;
    padding: 0 12px;
  }
  .ap-header__logo {
    font-size: 23px;
    max-width: 98px;
  }
  .ap-header__icons {
    margin-left: 0;
    gap: 0;
  }
  .ap-search--desktop {
    height: 38px;
    border-radius: 19px;
    padding: 0 3px 0 12px;
  }
  .ap-search input {
    font-size: 13px;
  }
  .ap-search__btn {
    width: 32px;
    height: 32px;
  }
  .ap-header__icon {
    width: 38px;
    height: 38px;
  }
  .ap-mobile-search {
    padding: 10px 12px;
  }
  .ap-product-languages__body {
    align-items: flex-start;
    flex-direction: column;
    gap: 12px;
    padding: 14px 16px;
  }
  .ap-product-languages__links {
    justify-content: flex-start;
    width: 100%;
  }
  .ap-product-languages__links a {
    min-height: 34px;
  }
}
@media (max-width: 359px) {
  .ap-header__inner {
    grid-template-columns: minmax(60px, auto) minmax(0, 1fr) auto 36px;
    gap: 4px;
    padding: 0 8px;
  }
  .ap-header__logo {
    font-size: 20px;
    max-width: 76px;
  }
  .ap-search--desktop {
    padding-left: 10px;
  }
  .ap-search input {
    font-size: 12px;
  }
  .ap-header__icon {
    width: 36px;
    height: 36px;
  }
}
@media (min-width: 1024px) {
  .ap-mobile-search { display: none !important; }
}

/* Page layout ---------------------------------------------------- */
.ap-page {
  max-width: var(--ap-content-max);
  margin: 0 auto;
  padding: 16px;
}
.ap-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--ap-gap);
  align-items: start;
}
@media (min-width: 1024px) {
  .ap-grid--two {
    grid-template-columns: minmax(0, 1fr) 316px;
    gap: 16px;
    align-items: start;
  }
  .ap-grid--two > .ap-rail {
    display: flex;
    flex-direction: column;
    gap: var(--ap-gap);
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
    position: sticky;
    top: calc(var(--ap-header-h) + 16px);
  }
  .ap-grid--two > .ap-rail > *,
  .ap-grid--two > .ap-rail .ap-mini,
  .ap-grid--two > .ap-rail .ap-aotd,
  .ap-grid--two > .ap-rail .ap-promo,
  .ap-grid--two > .ap-rail .ap-socials {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    align-self: stretch;
  }
}

/* Module --------------------------------------------------------- */
.ap-module {
  background: var(--ap-module-bg);
  border-radius: 0;
  margin: 0;
  overflow: hidden;
}
.ap-module + .ap-module { margin-top: var(--ap-gap); }
.ap-module__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 16px 8px;
}
.ap-module__title {
  color: var(--ap-title);
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
  margin: 0;
}
.ap-module__more {
  color: var(--ap-text);
  font-size: 14px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.ap-module__more:hover { color: var(--ap-accent); }
.ap-module__more svg { width: 14px; height: 14px; }
.ap-module__body { padding: 8px 16px 16px; }
.ap-product-languages__body {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 16px;
}
.ap-product-languages__text {
  min-width: 0;
}
.ap-product-languages__title {
  margin: 0;
  color: var(--ap-title);
  font-size: 14px;
  font-weight: 800;
  line-height: 20px;
}
.ap-product-languages__copy {
  margin: 2px 0 0;
  color: var(--ap-muted);
  font-size: 13px;
  line-height: 20px;
}
.ap-product-languages__links {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}
.ap-product-languages__links a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 32px;
  padding: 0 10px;
  border: 1px solid var(--ap-border);
  border-radius: 999px;
  background: #fff;
  color: var(--ap-title);
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
}
.ap-product-languages__links a:hover,
.ap-product-languages__links a[aria-current="true"] {
  border-color: var(--ap-accent);
  color: var(--ap-accent);
}
.ap-product-languages__links strong {
  color: var(--ap-muted);
  font-size: 10px;
  letter-spacing: 0;
}
.ap-product-languages__links a[aria-current="true"] strong {
  color: var(--ap-accent);
}

/* App list (icon-row style) ------------------------------------- */
.ap-app-list {
  list-style: none;
  margin: 0; padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px 12px;
}
@media (min-width: 600px) { .ap-app-list { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (min-width: 900px) { .ap-app-list { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
@media (min-width: 1200px) { .ap-app-list { grid-template-columns: repeat(8, minmax(0, 1fr)); } }
.ap-app-list li { min-width: 0; }
.ap-app-list a {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-decoration: none;
  color: var(--ap-text);
}
.ap-app-icon {
  width: 56px;
  height: 56px;
  border-radius: var(--ap-radius-card);
  object-fit: cover;
  background: #f3f4f6;
  display: block;
}
.ap-app-name {
  margin-top: 8px;
  font-size: 12px;
  line-height: 16px;
  color: var(--ap-title);
  text-align: center;
  width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ap-app-meta {
  margin-top: 2px;
  font-size: 11px;
  color: var(--ap-muted);
}

/* Popular 24h (rank bookmark) ----------------------------------- */
.ap-popular-list {
  list-style: none;
  margin: 0; padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px 12px;
}
@media (min-width: 600px) { .ap-popular-list { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (min-width: 900px) { .ap-popular-list { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
@media (min-width: 1200px) { .ap-popular-list { grid-template-columns: repeat(8, minmax(0, 1fr)); } }
.ap-popular-list a { position: relative; display: flex; flex-direction: column; align-items: center; text-decoration: none; }
.ap-rank-wrap { position: relative; }
.ap-rank-badge {
  position: absolute;
  top: -2px;
  left: -2px;
  min-width: 18px;
  height: 22px;
  padding: 0 4px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 700;
  color: #fff;
  background: var(--ap-rank-text);
  border-radius: 3px 3px 3px 0;
  z-index: 1;
}
/* Bookmark "pin" notch */
.ap-rank-badge::after {
  content: "";
  position: absolute;
  bottom: -4px;
  left: 0;
  border: 2px solid transparent;
  border-top-color: inherit;
  border-right-color: inherit;
}
.ap-rank-badge--1 { background: var(--ap-rank1); }
.ap-rank-badge--2 { background: var(--ap-rank2); }
.ap-rank-badge--3 { background: var(--ap-rank3); color: #1f2937; }

/* App-list (large row card) ------------------------------------- */
.ap-card-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
}
@media (min-width: 768px)  { .ap-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1280px) { .ap-card-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.ap-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px;
  border-radius: 6px;
  text-decoration: none;
  color: var(--ap-text);
  transition: background-color 120ms;
}
.ap-card:hover { background: #f7f9fc; }
.ap-card__icon {
  width: 64px; height: 64px;
  border-radius: var(--ap-radius-card);
  object-fit: cover;
  flex-shrink: 0;
  background: #f3f4f6;
}
.ap-card__body { min-width: 0; flex: 1; }
.ap-card__name {
  font-size: 14px;
  font-weight: 500;
  color: var(--ap-title);
  margin: 0 0 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ap-card__desc {
  font-size: 12px;
  color: var(--ap-muted);
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.ap-card__meta {
  margin-top: 4px;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: var(--ap-muted);
}
.ap-card__rating { color: #f59e0b; }
.ap-card__cta {
  flex-shrink: 0;
  background: var(--ap-accent);
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  padding: 6px 14px;
  border-radius: 999px;
  text-decoration: none;
}
.ap-card__cta:hover { background: var(--ap-accent-hover); }

.ap-main { min-width: 0; }

/* Hero ----------------------------------------------------------- */
.ap-hero,
.ap-hero-full,
.ap-hero__main {
  position: relative;
  height: 360px;
  background: #1f2937;
  overflow: hidden;
  margin-bottom: var(--ap-gap);
}
.ap-hero__slide { position: absolute; inset: 0; }
.ap-hero__slide .ap-hero__bg {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover;
  filter: blur(28px) saturate(1.1);
  transform: scale(1.1);
  opacity: .55;
}
.ap-hero__slide .ap-hero__art {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: contain;
}
.ap-hero__slide img[loading]:not(.ap-hero__bg):not(.ap-hero__art) { display: none; }
.ap-hero__overlay {
  position: absolute;
  inset: auto 0 0 0;
  padding: 20px 24px;
  background: linear-gradient(to top, rgba(0,0,0,0.7), rgba(0,0,0,0.05));
  color: #fff;
  display: flex;
  align-items: center;
  gap: 12px;
}
.ap-hero__logo {
  width: 48px; height: 48px; border-radius: 10px; background: #fff;
  object-fit: cover;
}
.ap-hero__name { font-size: 18px; font-weight: 600; margin: 0; color: #fff; }
.ap-hero__pub { font-size: 12px; opacity: .8; margin: 0; }
.ap-hero__cta {
  margin-left: auto;
  background: var(--ap-accent);
  color: #fff;
  border-radius: 999px;
  padding: 8px 18px;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
}
.ap-hero__arrow {
  position: absolute;
  top: 50%;
  width: 36px; height: 36px;
  display: inline-flex; align-items: center; justify-content: center;
  background: rgba(0,0,0,0.35);
  color: #fff;
  border: 0;
  border-radius: 50%;
  transform: translateY(-50%);
  cursor: pointer;
}
.ap-hero__arrow:hover { background: rgba(0,0,0,0.55); }
.ap-hero__arrow--prev { left: 12px; }
.ap-hero__arrow--next { right: 12px; }

.ap-hero__side {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.ap-discover {
  background: #fff;
  padding: 16px;
}
.ap-discover h3 { color: var(--ap-title); font-size: 16px; font-weight: 500; margin: 0 0 12px; }
.ap-discover__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}
.ap-discover__grid a {
  display: flex; flex-direction: column; align-items: center;
  text-decoration: none; color: var(--ap-title);
}
.ap-discover__grid img {
  width: 48px; height: 48px; border-radius: 10px;
  object-fit: cover; background: #f3f4f6;
}
.ap-discover__grid p {
  margin: 6px 0 0; font-size: 11px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  width: 100%; text-align: center;
}
.ap-promo {
  background: linear-gradient(135deg, #5865f2 0%, #4752c4 100%);
  color: #fff;
  padding: 16px;
  border-radius: 8px;
}
.ap-promo p { margin: 0; }
.ap-promo__kicker { font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; opacity: .85; }
.ap-promo__title { font-size: 14px; font-weight: 600; margin-top: 4px; }
.ap-promo__btn {
  display: inline-flex; align-items: center; gap: 6px;
  margin-top: 10px; padding: 6px 14px;
  background: #fff; color: var(--ap-accent);
  font-size: 12px; font-weight: 700;
  border-radius: 6px; text-decoration: none;
}
.ap-socials { display: flex; gap: 8px; padding: 12px 16px; background: #fff; }
.ap-socials a {
  width: 32px; height: 32px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 50%;
  background: #f3f4f6;
  color: var(--ap-text);
  text-decoration: none;
  font-size: 14px;
}
.ap-socials a:hover { background: var(--ap-accent); color: #fff; }

/* Category page two-col ---------------------------------------- */
.ap-cat {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}
@media (min-width: 1024px) {
  .ap-cat { grid-template-columns: minmax(0, 1fr) 280px; }
}
.ap-cat__title {
  color: var(--ap-title);
  font-size: 24px;
  font-weight: 600;
  margin: 0 0 8px;
}
.ap-cat__desc { color: var(--ap-text); margin: 0 0 16px; }
.ap-cat__rail {
  background: #fff;
  padding: 16px;
}
.ap-cat__rail h3 {
  color: var(--ap-title);
  font-size: 14px;
  font-weight: 600;
  margin: 0 0 12px;
  text-transform: uppercase;
  letter-spacing: .05em;
}
.ap-cat__rail ul { list-style: none; margin: 0; padding: 0; }
.ap-cat__rail li + li { margin-top: 8px; }
.ap-cat__rail a {
  color: var(--ap-text);
  text-decoration: none;
  font-size: 14px;
}
.ap-cat__rail a:hover { color: var(--ap-accent); }

/* Pagination ---------------------------------------------------- */
.ap-pager {
  display: flex; justify-content: center; gap: 4px;
  margin: 24px 0;
}
.ap-pager a, .ap-pager span {
  min-width: 36px;
  height: 36px;
  padding: 0 10px;
  display: inline-flex; align-items: center; justify-content: center;
  background: #fff;
  color: var(--ap-text);
  text-decoration: none;
  font-size: 13px;
  border-radius: 4px;
}
.ap-pager a:hover { color: var(--ap-accent); }
.ap-pager .active span { background: var(--ap-accent); color: #fff; }

/* Footer -------------------------------------------------------- */
.ap-footer {
  background: var(--ap-footer-bg);
  color: var(--ap-footer-text);
  padding: 40px 0 24px;
  margin-top: 24px;
  border-top: 1px solid var(--ap-border);
}
.ap-footer__cols {
  display: grid;
  grid-template-columns: 1fr;
  gap: 32px;
  max-width: var(--ap-content-max);
  margin: 0 auto;
  padding: 0 16px;
}
@media (min-width: 768px) {
  .ap-footer__cols { grid-template-columns: 2fr 1fr 1fr 1.5fr; }
}
.ap-footer__brand { color: var(--ap-accent); font-size: 24px; font-weight: 800; margin: 0 0 12px; }
.ap-footer__about { font-size: 13px; line-height: 20px; margin: 0 0 16px; color: var(--ap-muted); }
.ap-footer h4 {
  color: var(--ap-title);
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .1em;
  margin: 0 0 14px;
}
.ap-footer ul { list-style: none; margin: 0; padding: 0; }
.ap-footer li + li { margin-top: 10px; }
.ap-footer ul a { color: var(--ap-footer-text); font-size: 13px; text-decoration: none; }
.ap-footer ul a:hover { color: var(--ap-accent); }
.ap-footer__social { display: flex; gap: 10px; }
.ap-footer__social a {
  width: 32px; height: 32px;
  display: inline-flex; align-items: center; justify-content: center;
  background: #f3f4f6;
  color: var(--ap-title);
  border-radius: 50%;
  text-decoration: none;
}
.ap-footer__social a:hover { background: var(--ap-accent); color: #fff; }
.ap-footer__bottom {
  border-top: 1px solid var(--ap-border);
  margin-top: 28px;
  padding: 16px 16px 0;
  max-width: var(--ap-content-max);
  margin-left: auto; margin-right: auto;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  font-size: 12px;
  color: var(--ap-muted);
}
.ap-footer__legal { display: flex; flex-wrap: wrap; gap: 16px; }
.ap-footer__legal a { color: var(--ap-muted); text-decoration: none; }
.ap-footer__legal a:hover { color: var(--ap-accent); }

/* Right-rail mini modules ------------------------------------- */
.ap-mini {
  background: #fff;
  padding: 12px;
  width: 100%;
  box-sizing: border-box;
  align-self: start;
  min-height: 0;
}
.ap-mini + .ap-mini { margin-top: 8px; }
.ap-mini__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
}
.ap-mini__title {
  color: var(--ap-title);
  font-size: 14px;
  font-weight: 600;
  margin: 0;
}
.ap-mini__more {
  color: var(--ap-muted);
  font-size: 12px;
  text-decoration: none;
}
.ap-mini__more:hover { color: var(--ap-accent); }
.ap-mini__list { list-style: none; margin: 0; padding: 0; }
.ap-mini__list li + li { margin-top: 10px; }
.ap-mini__list a {
  display: flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
  color: var(--ap-text);
  min-width: 0;
}
.ap-mini__rank {
  flex-shrink: 0;
  width: 18px;
  text-align: center;
  font-size: 13px;
  font-weight: 700;
  color: var(--ap-muted);
}
.ap-mini__rank--1 { color: var(--ap-rank1); }
.ap-mini__rank--2 { color: var(--ap-rank2); }
.ap-mini__rank--3 { color: var(--ap-rank3); }
.ap-mini__icon {
  width: 36px; height: 36px;
  border-radius: 8px;
  object-fit: cover;
  background: #f3f4f6;
  flex-shrink: 0;
}
.ap-mini__name {
  font-size: 13px;
  color: var(--ap-title);
  min-width: 0;
  flex: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ap-mini__cta {
  flex-shrink: 0;
  font-size: 11px;
  font-weight: 600;
  color: var(--ap-accent);
  border: 1px solid var(--ap-accent);
  padding: 3px 10px;
  border-radius: 999px;
}

/* Refined parity tweaks ---------------------------------------- */
.ap-module__head { padding: 14px 16px 10px; }
.ap-module__body { padding: 0 16px 16px; }
.ap-module__title { letter-spacing: -0.01em; }
.ap-module__more svg { width: 12px; height: 12px; margin-left: 2px; }
.ap-card { transition: background-color 120ms, transform 120ms; }
.ap-card:hover { background: #f7f9fc; transform: none; }
.ap-card:hover .ap-card__name { color: var(--ap-accent); }
.ap-app-list a:hover .ap-app-name { color: var(--ap-accent); }
.ap-popular-list a:hover .ap-app-name { color: var(--ap-accent); }

/* Make hero side a bit denser to look like apkpure's right rail */
.ap-hero__side .ap-discover { padding: 12px; }
.ap-hero__side .ap-discover h3 { font-size: 14px; margin-bottom: 10px; }
.ap-hero__side .ap-discover__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.ap-hero__side .ap-discover__grid img { width: 44px; height: 44px; }
.ap-hero__side .ap-discover__grid p { font-size: 10px; }

/* Hide softpas's old chrome inside the ap-shell scope ----------- */
.ap-shell + .glass-nav, body.ap-active .glass-nav { display: none; }

/* Right rail: search + trending + AOTD --------------------------- */
.ap-rail-search__form { display:flex; gap:6px; }
.ap-rail-search__form input {
  flex:1; min-width:0; height:38px; padding:0 12px;
  border:1px solid var(--ap-border); border-radius:6px; font-size:13px;
  background:#fff; color:var(--ap-text); outline:none;
}
.ap-rail-search__form input:focus { border-color: var(--ap-accent); }
.ap-rail-search__form button {
  width:38px; height:38px; border:0; border-radius:6px;
  background: var(--ap-accent); color:#fff; cursor:pointer;
  display:inline-flex; align-items:center; justify-content:center;
  flex-shrink:0;
}
.ap-rail-search__form button svg { width:16px; height:16px; display:block; }
.ap-trending { display:flex; flex-wrap:wrap; gap:6px; margin-top:8px; }
.ap-chip {
  display:inline-block; padding:4px 10px; font-size:12px; color:var(--ap-text);
  background:#f3f4f6; border-radius:999px; text-decoration:none;
}
.ap-chip:hover { background:#e5e7eb; color: var(--ap-accent); }

.ap-aotd__card {
  display:flex; align-items:center; gap:10px; padding:8px 0 0;
  text-decoration:none; color:var(--ap-text);
  height: auto;
  min-height: 64px;
}
.ap-aotd__icon { width:56px; height:56px; border-radius:12px; flex-shrink:0; object-fit:cover; background:#f3f4f6; }
.ap-aotd__body { min-width:0; flex:1; }
.ap-aotd__name { margin:0; font-size:13px; font-weight:600; color:var(--ap-title); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ap-aotd__tag  { margin:2px 0 0; font-size:11px; color:var(--ap-muted); display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; overflow:hidden; }
.ap-aotd__rating { margin:2px 0 0; font-size:11px; color:#f59e0b; }
.ap-aotd__cta {
  flex-shrink:0; font-size:11px; font-weight:600; color:var(--ap-accent);
  border:1px solid var(--ap-accent); padding:4px 12px; border-radius:999px;
}

.ap-recommended__list {
  display: grid;
  gap: 14px;
  padding-top: 10px;
}
.ap-recommended__item {
  min-width: 0;
}
.ap-recommended__media {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  color: var(--ap-text);
  text-decoration: none;
}
.ap-recommended__icon {
  width: 48px;
  height: 48px;
  border-radius: 10px;
  flex-shrink: 0;
  object-fit: cover;
  background: #f3f4f6;
}
.ap-recommended__body {
  display: block;
  min-width: 0;
  flex: 1;
}
.ap-recommended__name,
.ap-recommended__cat {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ap-recommended__name {
  color: var(--ap-title);
  font-size: 13px;
  font-weight: 700;
  line-height: 18px;
}
.ap-recommended__cat {
  margin-top: 2px;
  color: var(--ap-muted);
  font-size: 11px;
  line-height: 15px;
}
.ap-recommended__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 36px;
  margin-top: 8px;
  padding: 8px 12px;
  border-radius: 999px;
  background: var(--ap-accent);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  line-height: 16px;
  text-align: center;
  text-decoration: none;
}
.ap-recommended__button:hover { background: var(--ap-accent-hover); }

.ap-app-aotd-mobile { display: none; }
.ap-app-aotd-desktop { display: block; }
@media (max-width: 1023px) {
  .ap-app-aotd-mobile { display: block; }
  .ap-app-aotd-desktop { display: none; }
  .ap-aotd,
  .ap-app-aotd-mobile .ap-aotd {
    width: 100%;
    height: auto;
    min-height: 0;
    max-height: max-content;
    margin: 0;
    align-self: start;
  }
}

/* Download page -------------------------------------------------- */
.ap-download-overlay {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  background: #fff;
  transition: opacity .5s ease;
}
.ap-download-overlay__card {
  width: min(100%, 400px);
  text-align: center;
}
.ap-download-overlay__icon {
  display: block;
  width: 80px;
  height: 80px;
  margin: 0 auto 24px;
  border-radius: 16px;
  object-fit: cover;
}
.ap-download-overlay h2 {
  margin: 0 0 8px;
  font-size: 20px;
  line-height: 26px;
  font-weight: 700;
  color: #111827;
}
.ap-download-overlay p {
  margin: 0 0 24px;
  font-size: 14px;
  color: #6b7280;
}
.ap-download-overlay__track {
  width: 100%;
  height: 6px;
  margin-bottom: 16px;
  overflow: hidden;
  background: #e5e7eb;
  border-radius: 999px;
}
.ap-download-overlay__bar {
  width: 0;
  height: 100%;
  background: linear-gradient(90deg, #3d4ad8, #5865f2);
  border-radius: inherit;
  transition: width .1s linear;
}
.ap-download-overlay__status {
  font-size: 12px;
  color: #9ca3af;
}
.ap-download-overlay__checks {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px 16px;
  margin-top: 20px;
  color: #16a34a;
  font-size: 11px;
  font-weight: 600;
}
.ap-download-overlay__checks span::before {
  content: "✓";
  margin-right: 4px;
}
.ap-download-header__inner {
  display: grid;
  grid-template-columns: 112px minmax(0, 1fr);
  gap: 16px;
  padding: 16px;
}
.ap-download-header__icon {
  width: 112px;
  height: 112px;
  border-radius: 22px;
  object-fit: cover;
  background: #f3f4f6;
}
.ap-download-header__body { min-width: 0; }
.ap-download-header__eyebrow {
  margin: 0 0 4px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--ap-muted);
}
.ap-download-header__title {
  margin: 0;
  color: var(--ap-title);
  font-size: 22px;
  line-height: 28px;
  font-weight: 700;
}
.ap-download-header__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 10px;
  margin-top: 6px;
  font-size: 12px;
  color: var(--ap-muted);
}
.ap-download-header__meta a {
  color: var(--ap-accent);
  text-decoration: none;
  font-weight: 600;
}
.ap-download-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  margin-top: 16px;
  padding: 10px 22px;
  border: 0;
  border-radius: 999px;
  background: var(--ap-accent);
  color: #fff;
  font-family: inherit;
  font-size: 14px;
  font-weight: 700;
  line-height: 18px;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
}
.ap-download-button:hover { background: var(--ap-accent-hover); }
.ap-broken-link {
  display: flex;
  align-items: center;
  gap: 6px;
  width: max-content;
  margin-top: 9px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--ap-muted);
  font-family: inherit;
  font-size: 12px;
  font-weight: 700;
  line-height: 18px;
  text-decoration: underline;
  cursor: pointer;
}
.ap-broken-link:hover { color: var(--ap-accent); }
.ap-download-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
  padding: 0 16px 16px;
}
.ap-download-stat {
  min-width: 0;
  padding: 10px 8px;
  text-align: center;
  background: #f7f9fc;
}
.ap-download-stat + .ap-download-stat { border-left: 1px solid var(--ap-border); }
.ap-download-stat dt {
  margin: 0;
  font-size: 11px;
  color: var(--ap-muted);
}
.ap-download-stat dd {
  margin: 3px 0 0;
  color: var(--ap-title);
  font-size: 13px;
  font-weight: 700;
  line-height: 17px;
  overflow-wrap: anywhere;
}
.ap-download-safety {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  background: #ecfdf5;
  border-radius: 10px;
}
.ap-safety-icon,
.ap-download-safety__icon {
  width: 48px;
  height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 48px;
  border-radius: 50%;
  background: #10b981;
  color: #fff;
  box-sizing: border-box;
  line-height: 1;
}
.ap-safety-icon i,
.ap-safety-icon .fa,
.ap-download-safety__icon i,
.ap-download-safety__icon .fa {
  display: block;
  color: #fff !important;
  font-size: 24px !important;
  line-height: 1 !important;
}
.ap-download-safety p {
  margin: 0;
  color: var(--ap-title);
  font-size: 13px;
  font-weight: 700;
}
.ap-download-safety > div > span {
  display: block;
  margin-top: 2px;
  color: var(--ap-text);
  font-size: 12px;
  line-height: 18px;
}
.ap-download-modal {
  position: fixed;
  inset: 0;
  z-index: 1050;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  background: rgba(15, 17, 35, .65);
  backdrop-filter: blur(6px);
}
.ap-download-modal__panel {
  position: relative;
  width: min(100%, 420px);
  max-height: calc(100vh - 32px);
  overflow-y: auto;
  padding: 20px;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 24px 70px rgba(15, 23, 42, .28);
}
.ap-download-modal__close {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 36px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 50%;
  background: #f3f4f6;
  color: var(--ap-title);
  cursor: pointer;
}
.ap-download-modal__head {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
  padding-right: 36px;
}
.ap-download-modal__head img {
  width: 56px;
  height: 56px;
  border-radius: 12px;
  object-fit: cover;
  background: #f3f4f6;
  flex-shrink: 0;
}
.ap-download-modal__head p {
  margin: 0;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--ap-muted);
}
.ap-download-modal__head h2 {
  margin: 2px 0 0;
  color: var(--ap-title);
  font-size: 16px;
  line-height: 21px;
  font-weight: 700;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ap-download-modal__actions {
  display: grid;
  gap: 10px;
  margin-top: 18px;
}
.ap-download-option {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
  padding: 12px;
  border: 1px solid var(--ap-border);
  border-radius: 10px;
  color: var(--ap-text);
  text-decoration: none;
}
.ap-download-option:hover { border-color: var(--ap-accent); background: #f7f8ff; }
.ap-download-option__icon {
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  border-radius: 10px;
  background: #ecfdf5;
  color: #059669;
}
.ap-download-option strong {
  display: block;
  color: var(--ap-title);
  font-size: 13px;
}
.ap-download-option small {
  display: block;
  margin-top: 2px;
  color: var(--ap-muted);
  font-size: 12px;
}
.ap-download-option--primary {
  border-color: var(--ap-accent);
  background: var(--ap-accent);
  color: #fff;
}
.ap-download-option--primary:hover { background: var(--ap-accent-hover); }
.ap-download-option--primary .ap-download-option__icon {
  background: rgba(255,255,255,.16);
  color: #fff;
}
.ap-download-option--primary strong,
.ap-download-option--primary small { color: #fff; }
.ap-download-modal__foot {
  margin: 16px 0 0;
  color: var(--ap-muted);
  font-size: 12px;
  text-align: center;
}
@media (max-width: 767px) {
  .ap-download-overlay { padding: 16px; }
  .ap-download-overlay__icon { width: 64px; height: 64px; margin-bottom: 18px; }
  .ap-download-overlay h2 { font-size: 18px; line-height: 24px; }
  .ap-download-overlay p { margin-bottom: 18px; font-size: 13px; }
  .ap-download-header__inner {
    grid-template-columns: 72px minmax(0, 1fr);
    gap: 12px;
    padding: 12px;
  }
  .ap-download-header__icon {
    width: 72px;
    height: 72px;
    border-radius: 16px;
  }
  .ap-download-header__title {
    font-size: 18px;
    line-height: 23px;
  }
  .ap-download-header__meta {
    gap: 4px 8px;
    font-size: 11px;
  }
  .ap-download-button {
    width: 100%;
    min-height: 42px;
    margin-top: 12px;
    padding: 9px 14px;
    font-size: 13px;
  }
  .ap-download-stats {
    padding: 0 12px 12px;
  }
  .ap-download-stat {
    padding: 8px 5px;
  }
  .ap-download-stat dt {
    font-size: 10px;
  }
  .ap-download-stat dd {
    font-size: 12px;
    line-height: 16px;
  }
  .ap-download-safety {
    align-items: flex-start;
    margin: 0 12px 12px;
    padding: 12px;
  }
  .ap-download-modal__panel {
    padding: 16px;
    border-radius: 10px;
  }
  .ap-download-modal__head h2 {
    white-space: normal;
  }
}

[x-cloak] { display:none !important; }

/* Category section group (visually separated + highlighted) ----- */
.ap-categories {
  margin-top: 20px;
  padding-top: 16px;
  border-top: 2px dashed var(--ap-border);
}
.ap-categories__lead {
  margin: 0 0 12px;
  padding: 0 4px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--ap-muted);
}
.ap-module--category {
  margin-top: 12px;
  border-left: 3px solid var(--ap-accent);
  background: linear-gradient(180deg, #f7f8ff 0%, #ffffff 60%);
}
.ap-module--category + .ap-module--category { margin-top: 14px; }
.ap-module--category .ap-module__title { display: flex; align-items: center; gap: 10px; }
.ap-cat-chip {
  display: inline-flex;
  align-items: center;
  height: 22px;
  padding: 0 10px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--ap-accent);
  background: rgba(88, 101, 242, 0.10);
  border-radius: 999px;
}

/* =====================================================================
   Mobile parity (APKPure-style) — keep below all min-width breakpoints
   so the max-width rules win in the 600–767px overlap range.
   ===================================================================== */

/* Containment — bleed margins (.ap-hero, .ap-popular-list, .ap-app-list)
   must never blow out the grid column. minmax(0, 1fr) forces the single-column
   mobile grid to clamp at its share of available space regardless of children. */
@media (max-width: 1023px) {
  html, body { overflow-x: hidden; }
  .ap-grid,
  .ap-grid--two { grid-template-columns: minmax(0, 1fr); }
}

/* Ads should respect the same content column constraints as the modules around them. */
ins.adsbygoogle,
.adsbygoogle,
.ap-ad,
.ad-container,
.ad-slot,
.ad-banner,
iframe[id^="google_ads_iframe"],
iframe[src*="googlesyndication.com"],
iframe[src*="doubleclick.net"],
div[id^="google_ads_iframe"],
div[id^="aswift_"] {
  box-sizing: border-box;
  display: block;
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
}
ins.adsbygoogle,
.adsbygoogle {
  width: 100%;
}
@media (max-width: 767px) {
  ins.adsbygoogle,
  .adsbygoogle,
  .ap-ad,
  .ad-container,
  .ad-slot,
  .ad-banner,
  iframe[id^="google_ads_iframe"],
  iframe[src*="googlesyndication.com"],
  iframe[src*="doubleclick.net"],
  div[id^="google_ads_iframe"],
  div[id^="aswift_"] {
    max-width: 100% !important;
    width: 100% !important;
  }
}

/* Part A — horizontal scroll icon rows on mobile */
@media (max-width: 767px) {
  .ap-app-list,
  .ap-popular-list {
    display: flex;
    grid-template-columns: none;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    gap: 14px;
    padding: 4px 16px 12px;
    margin: 0;
    scrollbar-width: none;
  }
  .ap-app-list::-webkit-scrollbar,
  .ap-popular-list::-webkit-scrollbar { display: none; }

  .ap-app-list > li,
  .ap-popular-list > li {
    flex: 0 0 22%;
    min-width: 76px;
    scroll-snap-align: start;
  }
  .ap-app-icon { width: 52px; height: 52px; }
  .ap-app-name { font-size: 11px; line-height: 14px; }
  .ap-rank-badge { width: 18px; height: 18px; font-size: 10px; }
}

/* Part B — compact 4-per-row icon grid on mobile (APKPure mobile pattern) */
@media (max-width: 767px) {
  .ap-card-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px 8px;
    padding: 8px 12px;
  }
  .ap-card {
    flex-direction: column;
    align-items: center;
    padding: 4px;
    gap: 6px;
  }
  .ap-card:hover { background: transparent; }
  .ap-card__icon { width: 56px; height: 56px; margin: 0; }
  .ap-card__body { flex: none; width: 100%; text-align: center; min-width: 0; }
  .ap-card__name {
    font-size: 11px;
    line-height: 14px;
    margin: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .ap-card__desc,
  .ap-card__meta,
  .ap-card__cta { display: none; }
}

/* Part C — reshape the right rail on mobile/tablet.
   Flatten both .ap-main and .ap-rail with display:contents so the hero, AOTD,
   content sections, and rail modules all become siblings in the grid. Then use
   `order` to slot AOTD right after the hero, with main's content following. */
@media (max-width: 1023px) {
  .ap-rail { display: contents; }
  .ap-main { display: contents; }
  .ap-rail-search { display: none; }

  .ap-hero,
  .ap-hero-full,
  .ap-hero__main,
  .ap-app-header,
  .ap-download-header { order: -100; }
  .ap-aotd          { order: -50; margin: 0; }
  /* .ap-module / promo .ap-mini default to order: 0 (slots between AOTD and rail blocks) */
  .ap-mini--discover { order: 5; margin: 0; }
  .ap-mini--top-apps { order: 10; margin: 0; }
  .ap-mini--top-games{ order: 15; margin: 0; }

  /* Grid gap handles spacing; drop the module sibling margin to avoid doubling */
  .ap-module + .ap-module { margin-top: 0; }
}

@media (max-width: 767px) {
  .ap-aotd,
  .ap-mini--discover,
  .ap-mini--top-apps,
  .ap-mini--top-games,
  .ap-recommended {
    padding: 12px 16px 16px;
  }
  .ap-discover__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
  .ap-discover__grid img { width: 48px; height: 48px; }
  .ap-mini__list li { padding: 6px 0; }
  .ap-mini__icon  { width: 40px; height: 40px; }
}

/* Part D — hero card on mobile */
@media (max-width: 767px) {
  .ap-hero,
  .ap-hero-full,
  .ap-hero__main { height: 200px; border-radius: 0; margin: 0 -16px var(--ap-gap); }
  .ap-hero__overlay { padding: 10px 14px; gap: 10px; }
  .ap-hero__logo { width: 44px; height: 44px; }
  .ap-hero__name { font-size: 14px; }
  .ap-hero__pub  { font-size: 11px; }
  .ap-hero__cta  { padding: 6px 12px; font-size: 12px; }
  .ap-hero__arrow { display: none; }
}

/* Part F — tighter section heads on mobile */
@media (max-width: 767px) {
  .ap-module__head  { padding: 12px 16px 4px; }
  .ap-module__title { font-size: 14px; }
  .ap-module__more  { font-size: 12px; }
  .ap-module__body  { padding: 4px 0 8px; }
}

/* ===================================================================
 * Preview page — app details, header card, screenshots, FAQ, reviews
 * =================================================================== */

/* Breadcrumb -------------------------------------------------------- */
.ap-breadcrumb { padding: 10px 4px 6px; font-size: 12px; color: var(--ap-muted); }
.ap-breadcrumb ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.ap-breadcrumb a { color: var(--ap-text); text-decoration: none; }
.ap-breadcrumb a:hover { color: var(--ap-accent); }
.ap-breadcrumb__current { color: var(--ap-title); font-weight: 600; }

/* App header card --------------------------------------------------- */
.ap-app-header__inner { display: flex; align-items: center; gap: 16px; padding: 16px; flex-wrap: wrap; }
.ap-app-header__icon  { width: 88px; height: 88px; border-radius: 18px; object-fit: cover; background: #f3f4f6; flex-shrink: 0; }
.ap-app-header__body  { flex: 1 1 200px; min-width: 0; }
.ap-app-header__name  { margin: 0; font-size: 20px; line-height: 26px; font-weight: 700; color: var(--ap-title); }
.ap-app-header__pub   { margin: 2px 0 0; font-size: 13px; color: var(--ap-muted); }
.ap-app-header__meta  { margin-top: 6px; display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--ap-text); flex-wrap: wrap; }
.ap-app-header__rating{ color: #f59e0b; font-weight: 600; }
.ap-app-header__sep   { color: var(--ap-muted); }
.ap-app-header__cta-wrap { display: flex; gap: 8px; flex-shrink: 0; flex-wrap: wrap; }
.ap-app-header__cta   { background: var(--ap-accent); color: #fff; border-radius: 999px; padding: 10px 22px; font-weight: 600; font-size: 14px; text-decoration: none; display: inline-flex; align-items: center; justify-content: center; }
.ap-app-header__cta:hover { background: var(--ap-accent-hover); }
.ap-app-header__cta--alt  { background: #fff; color: var(--ap-accent); border: 1px solid var(--ap-accent); }
.ap-app-header__cta--alt:hover { background: var(--ap-accent); color: #fff; }

/* Details chip grid ------------------------------------------------- */
.ap-details__grid  { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; padding: 12px 16px 16px; margin: 0; }
.ap-details__cell  { padding: 10px 12px; background: #f7f9fc; border-radius: 8px; min-width: 0; }
.ap-details__label { margin: 0; font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: var(--ap-muted); }
.ap-details__value { margin: 4px 0 0; font-size: 13px; font-weight: 600; color: var(--ap-title); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* Screenshots row --------------------------------------------------- */
.ap-shots__list  { list-style: none; margin: 0; padding: 12px 16px 16px; display: flex; gap: 10px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.ap-shots__list::-webkit-scrollbar { display: none; }
.ap-shots__item  { flex: 0 0 auto; scroll-snap-align: start; }
.ap-shots__item img { display: block; height: 200px; width: auto; border-radius: 10px; background: #f3f4f6; }

/* Description prose ------------------------------------------------- */
.ap-prose { padding: 12px 16px 20px; font-size: 14px; line-height: 22px; color: var(--ap-text); }
.ap-prose h2, .ap-prose h3 { color: var(--ap-title); margin: 16px 0 8px; font-weight: 700; }
.ap-prose h2 { font-size: 16px; }
.ap-prose h3 { font-size: 14px; }
.ap-prose p  { margin: 0 0 10px; }
.ap-prose ul, .ap-prose ol { margin: 0 0 10px 22px; }
.ap-prose a  { color: var(--ap-accent); text-decoration: none; }
.ap-prose a:hover { text-decoration: underline; }
.ap-empty { padding: 24px 16px; color: var(--ap-muted); text-align: center; font-size: 13px; }

/* FAQ --------------------------------------------------------------- */
.ap-faq { padding: 4px 16px 16px; }
.ap-faq__item { background: #f7f9fc; border-radius: 10px; margin: 0 0 8px; overflow: hidden; }
.ap-faq__summary { display: flex; justify-content: space-between; align-items: center; padding: 14px 16px; cursor: pointer; list-style: none; font-size: 14px; font-weight: 600; color: var(--ap-title); }
.ap-faq__summary::-webkit-details-marker { display: none; }
.ap-faq__chevron { transition: transform .15s ease; color: var(--ap-muted); flex-shrink: 0; }
.ap-faq__item[open] .ap-faq__chevron { transform: rotate(180deg); }
.ap-faq__body { padding: 0 16px 14px; font-size: 13px; line-height: 20px; color: var(--ap-text); }
.ap-faq__body ol, .ap-faq__body ul { margin: 0 0 0 22px; }
.ap-faq__body li { margin-bottom: 6px; }

/* Reviews list ------------------------------------------------------ */
.ap-reviews { list-style: none; margin: 0; padding: 4px 16px 16px; }
.ap-reviews__item { background: #f7f9fc; border-radius: 10px; padding: 14px 16px; margin-bottom: 10px; }
.ap-reviews__head { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; }
.ap-reviews__stars { display: flex; gap: 2px; }
.ap-reviews__star  { color: #d1d5db; font-size: 14px; }
.ap-reviews__star.is-on { color: #f59e0b; }
.ap-reviews__time  { font-size: 11px; color: var(--ap-muted); }
.ap-reviews__body  { margin: 8px 0; font-size: 13px; line-height: 20px; color: var(--ap-text); border: 0; padding: 0; }
.ap-reviews__foot  { display: flex; align-items: center; gap: 8px; }
.ap-reviews__avatar { width: 24px; height: 24px; border-radius: 50%; background: #e5e7eb; }
.ap-reviews__name  { font-size: 12px; font-weight: 600; color: var(--ap-title); }

/* Mobile (max-width: 767px) ----------------------------------------- */
@media (max-width: 767px) {
  .ap-breadcrumb { padding: 8px 4px 4px; font-size: 11px; }

  .ap-app-header__inner { padding: 12px; gap: 12px; }
  .ap-app-header__icon  { width: 64px; height: 64px; border-radius: 14px; }
  .ap-app-header__name  { font-size: 16px; line-height: 20px; }
  .ap-app-header__cta-wrap { width: 100%; }
  .ap-app-header__cta   { flex: 1; text-align: center; padding: 10px 14px; }

  .ap-details__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding: 8px 12px 12px; }
  .ap-details__cell { padding: 8px 10px; }

  .ap-shots__list { padding: 8px 16px 12px; gap: 8px; }
  .ap-shots__item img { height: 160px; }

  .ap-prose { padding: 8px 16px 16px; font-size: 13px; line-height: 20px; }
  .ap-faq   { padding: 0 12px 12px; }
  .ap-faq__summary { padding: 12px 14px; font-size: 13px; }
  .ap-faq__body    { padding: 0 14px 12px; }
  .ap-reviews      { padding: 0 12px 12px; }
}

/* Tablet (768–1023px) — 3-col details grid */
@media (min-width: 768px) and (max-width: 1023px) {
  .ap-details__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}