/* Install-app control. Hidden when the site is already running as an installed app. */
@media (display-mode: standalone), (display-mode: fullscreen), (display-mode: minimal-ui) {
  .cd-install, [data-cd-install], .cd-install-help, .cd-legal a[href="/app/"], .cd-legal a[href="/hi/app/"] { display: none !important; }
}
html.cd-pwa-standalone .cd-install,
html.cd-pwa-standalone [data-cd-install],
html.cd-pwa-standalone .cd-install-help,
html.cd-pwa-standalone .cd-legal a[href="/app/"],
html.cd-pwa-standalone .cd-legal a[href="/hi/app/"] { display: none !important; }

.cd-install {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 44px;
  padding: 8px 14px;
  margin: 0;
  border: 0;
  border-radius: 999px;
  cursor: pointer;
  font: inherit;
  font-weight: 650;
  letter-spacing: .01em;
  color: #fff;
  background: linear-gradient(135deg, #2563eb, #7c3aed);
  box-shadow: 0 1px 2px rgba(37, 99, 235, .18);
  text-decoration: none;
  white-space: nowrap;
}
.cd-install:hover { filter: brightness(1.05); }
.cd-install:focus-visible { outline: 3px solid #93c5fd; outline-offset: 2px; }

header.site-head .cd-install { margin-left: 4px; }
@media (min-width: 900px) {
  header.site-head .cd-install { min-height: 40px; padding: 6px 12px; font-size: .92em; }
}

.cd-install-help {
  position: fixed; inset: 0; z-index: 10050;
  background: rgba(15, 23, 42, .45);
  display: flex; align-items: center; justify-content: center;
  padding: 16px;
  padding-bottom: max(16px, env(safe-area-inset-bottom, 0px));
}
@media (min-width: 640px) {
  .cd-install-help { align-items: center; }
}
.cd-install-card {
  background: #fff; color: #0f172a;
  width: min(440px, 100%);
  max-height: min(90vh, 640px);
  overflow: auto;
  border-radius: 16px;
  padding: 20px 20px 16px;
  box-shadow: 0 16px 40px rgba(15, 23, 42, .2);
}
.cd-install-card h2 { margin: 0 0 8px; font-size: 1.2rem; }
.cd-install-card ol { margin: 0 0 16px; padding-left: 1.2em; }
.cd-install-card li { margin: 0 0 .5em; }
.cd-install-card .cd-install-close {
  min-height: 44px; width: 100%;
  border: 0; border-radius: 10px;
  background: #eef2ff; color: #312e81;
  font-weight: 650; cursor: pointer;
}
.cd-pwa-hero {
  display: flex; gap: 16px; align-items: flex-start; flex-wrap: wrap;
  margin: 12px 0 20px;
}
.cd-pwa-hero img {
  width: 96px; height: 96px; border-radius: 22px;
  box-shadow: 0 8px 24px rgba(79, 70, 229, .2);
}

@media (max-width: 1359px) {
  header.site-head .nav.open .cd-install {
    width: 100%;
    min-height: 44px;
    margin: 8px 0 4px;
  }
}

.cd-share {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 44px;
  padding: 8px 14px;
  margin: 0;
  border: 1.5px solid #4f46e5;
  border-radius: 999px;
  cursor: pointer;
  font: inherit;
  font-weight: 650;
  letter-spacing: .01em;
  color: #3730a3;
  background: #eef2ff;
  text-decoration: none;
  white-space: nowrap;
}
.cd-share:hover { background: #e0e7ff; }
.cd-share:focus-visible { outline: 3px solid #93c5fd; outline-offset: 2px; }
header.site-head .cd-share { margin-left: 4px; }
@media (min-width: 900px) {
  header.site-head .cd-share { min-height: 40px; padding: 6px 12px; font-size: .92em; }
}
@media (max-width: 1359px) {
  header.site-head .nav.open .cd-share {
    width: 100%;
    min-height: 44px;
    margin: 4px 0 4px;
  }
}
.cd-pwa-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin: 0; }
.cd-share-fallback a, .cd-share-fallback button {
  display: flex; align-items: center; justify-content: center;
  min-height: 44px; width: 100%; margin: 0 0 8px;
  border-radius: 10px; font: inherit; font-weight: 650; cursor: pointer;
  text-decoration: none; box-sizing: border-box;
}
.cd-share-wa { background: #16a34a; color: #fff; border: 0; }
.cd-share-copy { background: #eef2ff; color: #312e81; border: 0; }

/* Two header actions need room so the language menu does not overflow at laptop widths. */
@media (max-width: 1480px) {
  html body .site-head .brand-tag,
  html body #cd-site-head .brand-tag { display: none; }
}

/* Bulk Cropper SPA adds Account / Search in the same header row. */
@media (min-width: 900px) and (max-width: 1480px) {
  html.cd-d2-tool .site-head .nav { gap: 2px; }
  html.cd-d2-tool .site-head .cd-install,
  html.cd-d2-tool .site-head .cd-share { padding: 6px 8px; font-size: .82em; }
  html.cd-d2-tool .header-actions { gap: 4px; margin-left: 4px; }
}
@media (min-width: 900px) {
  html.cd-d2-tool, html.cd-d2-tool body { overflow-x: hidden; }
}

/* Mobile / Desktop view switch: hidden on wide screens, shown on small ones
   and whenever desktop view is already on (so the user can switch back after
   the layout viewport becomes 1240px). */
.cd-view-toggle {
  appearance: none;
  display: none;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 44px;
  padding: 8px 14px;
  margin: 0;
  border: 1.5px solid #0f766e;
  border-radius: 999px;
  cursor: pointer;
  font: inherit;
  font-weight: 650;
  letter-spacing: .01em;
  color: #115e59;
  background: #f0fdfa;
  text-decoration: none;
  white-space: nowrap;
}
.cd-view-toggle:hover { background: #ccfbf1; }
.cd-view-toggle:focus-visible { outline: 3px solid #5eead4; outline-offset: 2px; }
.cd-view-toggle[aria-pressed="true"] { background: #0f766e; color: #fff; border-color: #0f766e; }
@media (max-width: 899px) {
  .cd-view-toggle { display: inline-flex; }
}
@media (max-width: 1359px) {
  header.site-head .nav.open .cd-view-toggle {
    width: 100%;
    min-height: 44px;
    margin: 4px 0;
  }
}
html.cd-view-desktop .cd-view-toggle { display: inline-flex; }
@media (min-width: 900px) {
  header.site-head .cd-view-toggle { min-height: 40px; padding: 6px 12px; font-size: .92em; }
}
header.site-head .cd-view-toggle { margin-left: 4px; }


/* Header never overlaps the language selector. Existing rules force a full
   desktop nav from 961/1100px, which is too tight once Install and Share
   sit in the same row. Keep the hamburger until 1360px. */
html body .site-head .cd-lang,
html body #cd-site-head .cd-lang {
  position: static !important;
  right: auto !important;
  left: auto !important;
  transform: none !important;
  flex: 0 0 auto;
  z-index: 2;
}
@media (max-width: 1359px) {
  html body .site-head,
  html body #cd-site-head { position: sticky; z-index: 1200; }

  html body .site-head .nav-toggle,
  html body #cd-site-head .nav-toggle {
    border: 1px solid var(--hb-line, #cbd5e1);
    border-radius: 10px;
    background: #fff;
  }
  html body .site-head .nav-toggle span,
  html body .site-head .nav-toggle span::before,
  html body .site-head .nav-toggle span::after,
  html body #cd-site-head .nav-toggle span,
  html body #cd-site-head .nav-toggle span::before,
  html body #cd-site-head .nav-toggle span::after {
    display: block;
    width: 18px;
    height: 2px;
    background: var(--ink, #0f172a);
    border-radius: 2px;
    position: relative;
    content: "";
  }
  html body .site-head .nav-toggle span::before,
  html body #cd-site-head .nav-toggle span::before { position: absolute; top: -6px; }
  html body .site-head .nav-toggle span::after,
  html body #cd-site-head .nav-toggle span::after { position: absolute; top: 6px; }

  html body .site-head .brand,
  html body #cd-site-head .brand { order: 0 !important; }
  html body .site-head .cd-lang,
  html body #cd-site-head .cd-lang { order: 2 !important; margin-inline-start: auto !important; }
  html body .site-head #cd-acct,
  html body #cd-site-head #cd-acct,
  html body .site-head .header-actions,
  html body #cd-site-head .header-actions { order: 3 !important; margin-inline-start: 8px; }
  html body .site-head .nav-toggle,
  html body #cd-site-head .nav-toggle { order: 4 !important; margin-inline-start: 6px; }
  html body .site-head .nav,
  html body #cd-site-head .nav { order: 5 !important; }
  html body .site-head .wrap,
  html body #cd-site-head .wrap {
    flex-wrap: nowrap !important;
    position: relative;
  }
  html body .site-head .nav-toggle,
  html body #cd-site-head .nav-toggle {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    min-width: 44px;
    min-height: 44px;
    margin-left: 0;
  }
  html body .site-head .nav,
  html body #cd-site-head .nav {
    display: none !important;
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    top: 100% !important;
    width: auto !important;
    margin: 0 !important;
    padding: 8px 14px 14px !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: 4px !important;
    background: #fff !important;
    border: 0 !important;
    border-bottom: 1px solid var(--hb-line, #e2e8f0) !important;
    box-shadow: 0 12px 24px rgba(15, 23, 42, .12) !important;
    z-index: 1300;
  }
  html body .site-head .nav.open,
  html body #cd-site-head .nav.open {
    display: flex !important;
  }
  html body .site-head .nav.open > a,
  html body #cd-site-head .nav.open > a,
  html body .site-head .nav.open .cd-cat > summary {
    min-height: 44px;
    display: flex !important;
    align-items: center;
    width: 100%;
    box-sizing: border-box;
  }
}
@media (min-width: 1360px) {
  html body .site-head .nav-toggle,
  html body #cd-site-head .nav-toggle { display: none !important; }
  html body .site-head .nav,
  html body #cd-site-head .nav {
    display: flex !important;
    position: static !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    width: auto !important;
    margin: 0 auto !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }
  html body .site-head .cd-lang,
  html body #cd-site-head .cd-lang { margin-inline-start: 8px; }
}

/* Standalone / installed app: keep the header flush under the system bar.
   Safe-area padding lives only on the header (not body), with a 0 fallback
   so we never invent an empty gap. A light theme-color matches this surface. */
@media (display-mode: standalone), (display-mode: fullscreen), (display-mode: minimal-ui) {
  html, body { background: #fff; padding-top: 0; margin-top: 0; }
  html body header.site-head,
  html body #cd-site-head {
    padding-top: env(safe-area-inset-top, 0px);
    background: #fff;
  }
}
html.cd-pwa-standalone, html.cd-pwa-standalone body { background: #fff; padding-top: 0; margin-top: 0; }
html.cd-pwa-standalone header.site-head,
html.cd-pwa-standalone #cd-site-head {
  padding-top: env(safe-area-inset-top, 0px);
  background: #fff;
}

/* Bulk Cropper header also carries Account, Search and a theme toggle, so
   keep the hamburger until 1480px — 1366 is still too tight for an inline nav. */
@media (max-width: 1479px) {

  html.cd-d2-tool body .site-head .nav-toggle,
  html.cd-d2-tool body #cd-site-head .nav-toggle {
    border: 1px solid var(--hb-line, #cbd5e1);
    border-radius: 10px;
    background: #fff;
  }
  html.cd-d2-tool body .site-head .nav-toggle span,
  html.cd-d2-tool body .site-head .nav-toggle span::before,
  html.cd-d2-tool body .site-head .nav-toggle span::after,
  html.cd-d2-tool body #cd-site-head .nav-toggle span,
  html.cd-d2-tool body #cd-site-head .nav-toggle span::before,
  html.cd-d2-tool body #cd-site-head .nav-toggle span::after {
    display: block;
    width: 18px;
    height: 2px;
    background: var(--ink, #0f172a);
    border-radius: 2px;
    position: relative;
    content: "";
  }
  html.cd-d2-tool body .site-head .nav-toggle span::before,
  html.cd-d2-tool body #cd-site-head .nav-toggle span::before { position: absolute; top: -6px; }
  html.cd-d2-tool body .site-head .nav-toggle span::after,
  html.cd-d2-tool body #cd-site-head .nav-toggle span::after { position: absolute; top: 6px; }
  html.cd-d2-tool body .site-head .brand,
  html.cd-d2-tool body #cd-site-head .brand { order: 0 !important; }
  html.cd-d2-tool body .site-head .cd-lang,
  html.cd-d2-tool body #cd-site-head .cd-lang { order: 2 !important; margin-inline-start: auto !important; }
  html.cd-d2-tool body .site-head #cd-acct,
  html.cd-d2-tool body #cd-site-head #cd-acct,
  html.cd-d2-tool body .site-head .header-actions,
  html.cd-d2-tool body #cd-site-head .header-actions { order: 3 !important; margin-inline-start: 8px; }
  html.cd-d2-tool body .site-head .nav-toggle,
  html.cd-d2-tool body #cd-site-head .nav-toggle { order: 4 !important; margin-inline-start: 6px; }
  html.cd-d2-tool body .site-head .nav,
  html.cd-d2-tool body #cd-site-head .nav { order: 5 !important; }
  html.cd-d2-tool body .site-head .nav-toggle,
  html.cd-d2-tool body #cd-site-head .nav-toggle {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    min-width: 44px;
    min-height: 44px;
  }
  html.cd-d2-tool body .site-head .nav,
  html.cd-d2-tool body #cd-site-head .nav {
    display: none !important;
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    top: 100% !important;
    width: auto !important;
    margin: 0 !important;
    padding: 8px 14px 14px !important;
    flex-direction: column !important;
    background: #fff !important;
    border-bottom: 1px solid var(--hb-line, #e2e8f0) !important;
    box-shadow: 0 12px 24px rgba(15, 23, 42, .12) !important;
    z-index: 1300;
  }
  html.cd-d2-tool body .site-head .nav.open,
  html.cd-d2-tool body #cd-site-head .nav.open { display: flex !important; }
}


/* Installed-app home launcher. Hard-gated: never hide the public hero or
   show the launcher unless we are in the installed app (standalone class
   and/or display-mode) on a coarse pointer. The regular website is unchanged. */
.cd-app-launch { display: none !important; padding: 16px 16px 8px; box-sizing: border-box; }
html.cd-pwa-standalone.cd-pwa-app-home .hx-hero,
html.cd-pwa-standalone.cd-pwa-app-home .home-intro,
html.cd-pwa-standalone.cd-pwa-app-home .hx-most,
html.cd-pwa-standalone.cd-pwa-app-home .hx4-most,
html.cd-pwa-standalone.cd-pwa-app-home .hx-us,
html.cd-pwa-standalone.cd-pwa-app-home .hx4-feat,
html.cd-pwa-standalone.cd-pwa-app-home .hx2-feat,
html.cd-pwa-standalone.cd-pwa-app-home .hx2-aud,
html.cd-pwa-standalone.cd-pwa-app-home .hx-cats,
html.cd-pwa-standalone.cd-pwa-app-home .cats,
html.cd-pwa-standalone.cd-pwa-app-home .hcat,
html.cd-pwa-standalone.cd-pwa-app-home .hx2-trust,
html.cd-pwa-standalone.cd-pwa-app-home .why,
html.cd-pwa-standalone.cd-pwa-app-home .faq,
html.cd-pwa-standalone.cd-pwa-app-home #cd-mascot,
html.cd-pwa-standalone.cd-pwa-app-home #cd-croppi { display: none !important; }
html.cd-pwa-standalone.cd-pwa-app-home main > *:not(.cd-app-launch):not(.cd-adst):not(.cd-adst-top) {
  display: none !important;
}
html.cd-pwa-standalone.cd-pwa-app-home .cd-app-launch {
  width: 100%;
  max-width: min(520px, 100%);
}
html.cd-pwa-standalone.cd-pwa-app-home .cd-app-launch { display: block !important; }
@media (display-mode: standalone), (display-mode: fullscreen), (display-mode: minimal-ui) {
  html.cd-pwa-app-home .hx-hero,
  html.cd-pwa-app-home .home-intro,
  html.cd-pwa-app-home .hx-most,
  html.cd-pwa-app-home .hx4-most,
  html.cd-pwa-app-home .hx-us,
  html.cd-pwa-app-home .hx4-feat,
  html.cd-pwa-app-home .hx2-feat,
  html.cd-pwa-app-home .hx2-aud,
  html.cd-pwa-app-home .hx-cats,
  html.cd-pwa-app-home .cats,
  html.cd-pwa-app-home .hcat,
  html.cd-pwa-app-home .hx2-trust,
  html.cd-pwa-app-home .why,
  html.cd-pwa-app-home .faq,
  html.cd-pwa-app-home #cd-mascot,
  html.cd-pwa-app-home #cd-croppi { display: none !important; }
  html.cd-pwa-app-home .cd-app-launch { display: block !important; }
}

/* Professional app-home chrome: only under the gates above. */
html.cd-pwa-standalone.cd-pwa-app-home,
html.cd-pwa-standalone.cd-pwa-app-home body {
  background: #f5f7fb;
}
html.cd-pwa-standalone.cd-pwa-app-home header.site-head,
html.cd-pwa-standalone.cd-pwa-app-home #cd-site-head {
  background: #ffffff;
  box-shadow: 0 1px 0 rgba(15, 23, 42, .06);
  padding-top: env(safe-area-inset-top, 0px);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
html.cd-pwa-standalone.cd-pwa-app-home .cd-hs,
html.cd-pwa-standalone.cd-pwa-app-home .cd-install,
html.cd-pwa-standalone.cd-pwa-app-home .nav .cd-share,
html.cd-pwa-standalone.cd-pwa-app-home .brand-tag,
html.cd-pwa-standalone.cd-pwa-app-home header.site-head > .cd-view-toggle {
  display: none !important;
}
html.cd-pwa-standalone.cd-pwa-app-home .pop,
html.cd-pwa-standalone.cd-pwa-app-home .feat,
html.cd-pwa-standalone.cd-pwa-app-home .why {
  display: none !important;
}
html.cd-pwa-standalone.cd-pwa-app-home *,
html.cd-pwa-standalone.cd-pwa-app-home *::before,
html.cd-pwa-standalone.cd-pwa-app-home *::after {
  animation: none !important;
}
html.cd-pwa-standalone.cd-pwa-app-home .cd-app-launch {
  padding: 16px 16px calc(88px + env(safe-area-inset-bottom, 0px));
  max-width: 520px;
  margin: 0 auto;
}
html.cd-pwa-standalone.cd-pwa-app-home .cd-app-launch .cd-adst,
html.cd-pwa-standalone.cd-pwa-app-home .cd-app-launch .cd-adst-top { display: none !important; }
.cd-app-launch .cd-app-kicker {
  margin: 0 0 8px;
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #64748b;
}
.cd-app-launch h1 {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}
.cd-app-launch-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin: 0 0 8px;
}
.cd-app-card {
  appearance: none;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
  gap: 8px;
  min-height: 112px;
  width: 100%;
  margin: 0;
  padding: 16px;
  border: 0;
  border-radius: 16px;
  background: #ffffff;
  color: #0f172a;
  box-shadow: 0 4px 16px rgba(15, 23, 42, .08);
  font: inherit;
  text-align: left;
  cursor: pointer;
  box-sizing: border-box;
}
.cd-app-card-ic {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background: #eef2ff;
  color: #4f46e5;
}
.cd-app-card-ic svg { display: block; }
.cd-app-card-t {
  display: block;
  font-weight: 750;
  font-size: 1rem;
  line-height: 1.25;
  letter-spacing: -.01em;
}
.cd-app-card-s {
  display: block;
  margin-top: -4px;
  font-size: .78rem;
  font-weight: 500;
  color: #64748b;
}
.cd-app-card-scan { background: linear-gradient(180deg, #4f46e5, #7c3aed); color: #fff; box-shadow: 0 8px 20px rgba(79, 70, 229, .28); }
.cd-app-card-scan .cd-app-card-ic { background: rgba(255,255,255,.18); color: #fff; }
.cd-app-card-scan .cd-app-card-s { color: rgba(255,255,255,.85); }
.cd-app-card:focus-visible { outline: 3px solid #818cf8; outline-offset: 2px; }

.cd-app-quick { margin: 8px 0 10px; }
.cd-app-quick-kicker {
  margin: 4px 0 8px;
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #64748b;
}
.cd-app-quick-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
}
.cd-app-quick-tile {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: 6px;
  min-height: 76px;
  min-width: 0;
  margin: 0;
  padding: 10px 4px 8px;
  border-radius: 14px;
  background: #ffffff;
  color: #0f172a;
  text-decoration: none;
  box-shadow: 0 4px 16px rgba(15, 23, 42, .08);
  box-sizing: border-box;
  text-align: center;
}
.cd-app-quick-ic {
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
  border-radius: 10px;
  background: #eef2ff;
  color: #4f46e5;
}
.cd-app-quick-ic svg { display: block; }
.cd-app-quick-t {
  display: block;
  font-size: .68rem;
  font-weight: 650;
  line-height: 1.2;
  letter-spacing: -.01em;
  color: #0f172a;
}
.cd-app-quick-tile:focus-visible { outline: 3px solid #818cf8; outline-offset: 2px; }
@media (max-width: 359px) {
  .cd-app-quick-grid { grid-template-columns: repeat(3, 1fr); }
}
html.cd-pwa-standalone.cd-pwa-app-home .cd-app-quick .cd-adst,
html.cd-pwa-standalone.cd-pwa-app-home .cd-app-quick .cd-adst-top { display: none !important; }

.cd-app-more-btn {
  appearance: none;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  min-height: 48px;
  margin: 0;
  padding: 12px 16px;
  border: 0;
  border-radius: 16px;
  background: #ffffff;
  color: #312e81;
  font: inherit;
  font-weight: 700;
  box-shadow: 0 4px 16px rgba(15, 23, 42, .08);
  cursor: pointer;
}
.cd-app-more-btn:focus-visible { outline: 3px solid #818cf8; outline-offset: 2px; }
.cd-app-more-btn[aria-expanded="true"] { background: #eef2ff; }
.cd-app-more {
  margin: 8px 0 0;
  padding: 8px;
  border-radius: 16px;
  background: #ffffff;
  box-shadow: 0 4px 16px rgba(15, 23, 42, .08);
}
.cd-app-more[hidden] { display: none !important; }
.cd-app-more-group { margin: 0; padding: 8px; }
.cd-app-more-group + .cd-app-more-group { border-top: 1px solid #eef2f7; }
.cd-app-more-group h3 {
  margin: 0 0 4px;
  padding: 4px 8px 0;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #64748b;
}
.cd-app-more-group a {
  display: flex;
  align-items: center;
  min-height: 44px;
  padding: 8px;
  border-radius: 12px;
  color: #0f172a;
  text-decoration: none;
  font-weight: 600;
  font-size: .95rem;
}
.cd-app-more-group a:focus-visible { outline: 3px solid #818cf8; outline-offset: 2px; }
.cd-app-sheet {
  position: fixed;
  inset: 0;
  z-index: 80;
  background: rgba(15, 23, 42, .45);
  display: flex;
  align-items: flex-end;
  justify-content: center;
  padding: 16px 16px calc(16px + env(safe-area-inset-bottom, 0px));
}
.cd-app-sheet-card {
  background: #fff;
  width: 100%;
  max-width: 440px;
  border-radius: 16px;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  box-shadow: 0 8px 32px rgba(15, 23, 42, .2);
}
.cd-app-sheet-card strong { font-size: 1.05rem; color: #0f172a; padding: 4px 4px 8px; }
.cd-app-sheet-card button {
  appearance: none;
  min-height: 48px;
  border-radius: 16px;
  border: 1px solid #e2e8f0;
  background: #fff;
  color: #0f172a;
  font: inherit;
  font-weight: 650;
  cursor: pointer;
}
.cd-app-sheet-card button.cd-app-sheet-pri {
  border: 0;
  background: linear-gradient(135deg, #4f46e5, #7c3aed);
  color: #fff;
}
.cd-app-sheet-card button:focus-visible { outline: 3px solid #818cf8; outline-offset: 2px; }
.cd-app-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  overflow: hidden;
}


/* Segmented Mobile | Desktop view switch */
.cd-view-seg {
  display: flex;
  align-items: stretch;
  width: 100%;
  margin: 0;
  padding: 3px;
  border-radius: 999px;
  background: #eef2ff;
  box-sizing: border-box;
}
.cd-view-seg-btn {
  appearance: none;
  flex: 1;
  min-height: 44px;
  margin: 0;
  padding: 8px 10px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: #312e81;
  font: inherit;
  font-size: .88rem;
  font-weight: 700;
  letter-spacing: .01em;
  cursor: pointer;
  line-height: 1.1;
}
.cd-view-seg-btn[aria-pressed="true"] {
  background: #fff;
  color: #0f172a;
  box-shadow: 0 1px 4px rgba(15, 23, 42, .12);
}
.cd-view-seg-btn:focus-visible { outline: 3px solid #818cf8; outline-offset: 2px; }
.cd-view-seg-launch { margin: 10px 0 0; box-shadow: 0 4px 16px rgba(15, 23, 42, .08); background: #eef2ff; }

/* Under-header bar: visible in Desktop view so phone users can switch back. */
.cd-view-switch-bar {
  display: none;
  justify-content: center;
  align-items: center;
  padding: 8px 16px;
  background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
  box-sizing: border-box;
}
html.cd-view-desktop .cd-view-switch-bar {
  display: flex;
  position: sticky;
  top: 68px;
  z-index: 1250;
}
.cd-view-switch-bar .cd-view-seg { max-width: 360px; }

/* Hamburger: first item. Hidden in the wide inline nav so it doesn't crowd Home/Blog. */
header.site-head .nav > .cd-view-seg-nav { display: flex; width: 100%; margin: 0 0 8px; }
@media (min-width: 1360px) {
  header.site-head .nav > .cd-view-seg-nav { display: none !important; }
  header.site-head .nav > .cd-share-menu { order: 20; margin-left: auto; }
}

html.cd-pwa-standalone .cd-view-toggle { display: inline-flex; }


/* iOS install helper: visual Share + Add to Home Screen card */
.cd-install-card .cd-ios-lead { margin: 0 0 16px; color: #334155; line-height: 1.45; }
.cd-ios-steps { list-style: none; margin: 0 0 16px; padding: 0; display: grid; gap: 10px; }
.cd-ios-steps li {
  display: flex; align-items: center; gap: 12px;
  margin: 0; padding: 12px;
  background: #f8faff; border: 1px solid #e2e8f0;
  border-radius: 14px; min-height: 56px;
}
.cd-ios-steps li strong { display: block; color: #0f172a; font-weight: 700; }
.cd-ios-steps li span { display: block; color: #475569; font-size: .92em; }
.cd-ios-ico {
  flex: 0 0 44px; width: 44px; height: 44px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 11px; background: #eef2ff; color: #4f46e5;
}
.cd-ios-ico svg { width: 26px; height: 26px; display: block; }
.cd-ios-ico-add { background: #ecfdf5; color: #047857; }

/* Compact Install pill in the header chrome, next to EN / the menu, on
   every width. Not inside the collapsed nav. Hidden only in the installed app. */
html body .site-head .cd-install-bar,
html body #cd-site-head .cd-install-bar {
  display: inline-flex !important;
  order: 3 !important;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  margin-inline-start: 6px;
  min-height: 44px;
  min-width: 44px;
  padding: 8px 10px;
  font-size: .86em;
  white-space: nowrap;
}
@media (min-width: 900px) {
  html body .site-head .cd-install-bar,
  html body #cd-site-head .cd-install-bar {
    min-height: 40px;
    padding: 6px 12px;
    font-size: .92em;
  }
}
/* Desktop nav already shows Share (and used to show Install after Blog).
   The header pill replaces that Install slot so it sits next to EN and
   cannot overlap Blog. Hamburger menus still keep their Install item. */
@media (min-width: 1360px) {
  html body .site-head .nav .cd-install,
  html body #cd-site-head .nav .cd-install { display: none !important; }
}
html.cd-pwa-standalone body .site-head .cd-install-bar,
html.cd-pwa-standalone body #cd-site-head .cd-install-bar,
html.cd-pwa-standalone .cd-install-bar,
html.cd-pwa-standalone .cd-install-banner { display: none !important; }
@media (display-mode: standalone), (display-mode: fullscreen), (display-mode: minimal-ui) {
  .cd-install-bar, .cd-install-banner { display: none !important; }
}

/* Slim homepage install banner, in normal flow under the header. */
.cd-install-banner {
  display: flex;
  align-items: center;
  gap: 8px;
  box-sizing: border-box;
  width: calc(100% - 24px);
  max-width: 1100px;
  margin: 8px auto 0;
  padding: 8px 8px 8px 14px;
  background: #eef2ff;
  color: #1e1b4b;
  border: 1px solid #c7d2fe;
  border-radius: 12px;
  font-size: .92rem;
  line-height: 1.35;
}
.cd-install-banner p { margin: 0; flex: 1 1 auto; min-width: 0; }
.cd-install-banner .cd-install {
  flex: 0 0 auto;
  min-height: 44px;
  padding: 8px 12px;
  font-size: .86em;
}
.cd-install-banner .cd-install-dismiss {
  flex: 0 0 auto;
  appearance: none;
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: #312e81;
  font-size: 1.35rem;
  line-height: 1;
  cursor: pointer;
}
.cd-install-banner .cd-install-dismiss:hover { background: #e0e7ff; }
.cd-install-banner .cd-install-dismiss:focus-visible { outline: 3px solid #818cf8; outline-offset: 2px; }
@media (max-width: 430px) {
  .cd-install-banner { flex-wrap: wrap; padding: 10px 8px 10px 12px; }
  .cd-install-banner p { flex-basis: calc(100% - 52px); }
}

/* Home already hides the header search visually; also drop it from layout
   so the Install pill and menu have room. Below 430px the tab bar still
   offers Search, so the 40px header icon yields space to Install. */
html.cd-hero-search body.home .site-head .cd-hs { display: none !important; }
@media (max-width: 430px) {
  html:not(.cd-pwa-standalone) body .site-head .cd-hs,
  html:not(.cd-pwa-standalone) body #cd-site-head .cd-hs { display: none !important; }
  html body .site-head .cd-install-bar,
  html body #cd-site-head .cd-install-bar {
    padding: 8px 8px;
    font-size: .8em;
    margin-inline-start: 4px;
  }
  html body .site-head .nav-toggle,
  html body #cd-site-head .nav-toggle { margin-inline-start: 4px !important; }
}

/* Keep the website from panning sideways on touch, and never let a
   leftover desktop viewport or a wide chip row widen the layout. */
html, html body {
  overflow-x: clip;
  overscroll-behavior-x: none;
}
html body .hx2-quick,
html body .hx2-quick .cd-quick {
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}
html body .hx2-quick { overflow-x: auto; }
html.cd-pwa-standalone.cd-pwa-app-home .cd-yours,
html.cd-pwa-standalone.cd-pwa-app-home .cd-yours-slot,
html.cd-pwa-standalone.cd-pwa-app-home .cd-dyn-home { display: none !important; }
@media (max-width: 412px) {
  html body .site-head .wrap,
  html body #cd-site-head .wrap { max-width: 100%; min-width: 0; overflow-x: clip; }
  html body .site-head .cd-install-bar,
  html body #cd-site-head .cd-install-bar {
    padding: 6px 7px;
    font-size: .78em;
    margin-inline-start: 2px;
  }
  html body .site-head .nav-toggle,
  html body #cd-site-head .nav-toggle { margin-inline-start: 2px !important; }
}


/* Standalone header Share icon, next to the menu. Hidden in the normal
   browser so it does not crowd the Install pill at 360px. */
.cd-share-bar {
  display: none;
  order: 3;
  flex: 0 0 auto;
  width: 44px;
  min-width: 44px;
  min-height: 44px;
  padding: 0;
  margin-inline-start: 4px;
}
html.cd-pwa-standalone body .site-head .cd-share-bar,
html.cd-pwa-standalone body #cd-site-head .cd-share-bar {
  display: inline-flex !important;
}
.cd-share-bar svg { display: block; }

/* Launcher: Share Crop Desk under the Mobile | Desktop toggle. */
.cd-app-share-row {
  appearance: none;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  min-height: 48px;
  margin: 10px 0 0;
  padding: 12px 16px;
  border: 0;
  border-radius: 16px;
  background: #ffffff;
  color: #312e81;
  font: inherit;
  font-weight: 700;
  box-shadow: 0 4px 16px rgba(15, 23, 42, .08);
  cursor: pointer;
  box-sizing: border-box;
}
.cd-app-share-row svg { flex: 0 0 auto; }
.cd-app-share-row:focus-visible { outline: 3px solid #818cf8; outline-offset: 2px; }

/* Open hamburger: Share sits directly under the view toggle. */
@media (max-width: 1359px) {
  header.site-head .nav.open > .cd-share-menu,
  header.site-head .nav.open > .cd-view-seg-nav + .cd-share {
    display: flex !important;
    width: 100%;
    min-height: 44px;
    margin: 0 0 8px;
  }
}


/* t1545/t1546/t1549: native phone-app shell. Hard-gated to standalone
   Mobile view only — the website and desktop view are unchanged. */
html.cd-pwa-standalone.cd-pwa-app-shell:not(.cd-view-desktop),
html.cd-pwa-standalone.cd-pwa-app-shell:not(.cd-view-desktop) body,
html.cd-pwa-standalone.cd-pwa-app-home:not(.cd-view-desktop),
html.cd-pwa-standalone.cd-pwa-app-home:not(.cd-view-desktop) body,
html.cd-pwa-standalone.cd-pwa-app-tool:not(.cd-view-desktop),
html.cd-pwa-standalone.cd-pwa-app-tool:not(.cd-view-desktop) body {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  background: #f4f6fb;
  color: #0f172a;
}
html.cd-pwa-standalone.cd-pwa-app-home:not(.cd-view-desktop) footer.site-foot,
html.cd-pwa-standalone.cd-pwa-app-home:not(.cd-view-desktop) .site-foot,
html.cd-pwa-standalone.cd-pwa-app-home:not(.cd-view-desktop) .cd-tb,
html.cd-pwa-standalone.cd-pwa-app-home:not(.cd-view-desktop) .cd-tb-sp,
html.cd-pwa-standalone.cd-pwa-app-home:not(.cd-view-desktop) .cd-install-banner,
html.cd-pwa-standalone.cd-pwa-app-home:not(.cd-view-desktop) .cd-view-switch-bar,
html.cd-pwa-standalone.cd-pwa-app-tool:not(.cd-view-desktop) header.site-head,
html.cd-pwa-standalone.cd-pwa-app-tool:not(.cd-view-desktop) #cd-site-head,
html.cd-pwa-standalone.cd-pwa-app-tool:not(.cd-view-desktop) footer.site-foot,
html.cd-pwa-standalone.cd-pwa-app-tool:not(.cd-view-desktop) .site-foot,
html.cd-pwa-standalone.cd-pwa-app-tool:not(.cd-view-desktop) .cd-tb,
html.cd-pwa-standalone.cd-pwa-app-tool:not(.cd-view-desktop) .cd-tb-sp,
html.cd-pwa-standalone.cd-pwa-app-tool:not(.cd-view-desktop) .howto,
html.cd-pwa-standalone.cd-pwa-app-tool:not(.cd-view-desktop) .cd-size-help,
html.cd-pwa-standalone.cd-pwa-app-tool:not(.cd-view-desktop) .faq,
html.cd-pwa-standalone.cd-pwa-app-tool:not(.cd-view-desktop) #faq,
html.cd-pwa-standalone.cd-pwa-app-tool:not(.cd-view-desktop) .cd-fold,
html.cd-pwa-standalone.cd-pwa-app-tool:not(.cd-view-desktop) .why,
html.cd-pwa-standalone.cd-pwa-app-tool:not(.cd-view-desktop) .pop,
html.cd-pwa-standalone.cd-pwa-app-tool:not(.cd-view-desktop) .feat,
html.cd-pwa-standalone.cd-pwa-app-tool:not(.cd-view-desktop) .cd-related,
html.cd-pwa-standalone.cd-pwa-app-tool:not(.cd-view-desktop) .cd-yours,
html.cd-pwa-standalone.cd-pwa-app-tool:not(.cd-view-desktop) #cd-mascot,
html.cd-pwa-standalone.cd-pwa-app-tool:not(.cd-view-desktop) #cd-croppi,
html.cd-pwa-standalone.cd-pwa-app-tool:not(.cd-view-desktop) .cd-adst-r,
html.cd-pwa-standalone.cd-pwa-app-tool:not(.cd-view-desktop) .cd-adst-top,
html.cd-pwa-standalone.cd-pwa-app-home:not(.cd-view-desktop) .cd-adst-r,
html.cd-pwa-standalone.cd-pwa-app-home:not(.cd-view-desktop) .cd-adst-top {
  display: none !important;
}

/* Material-style top app bar on tool pages */
html.cd-pwa-standalone .cd-app-bar { display: none; }
html.cd-pwa-standalone.cd-pwa-app-tool:not(.cd-view-desktop) .cd-app-bar {
  display: flex;
  align-items: center;
  gap: 4px;
  position: sticky;
  top: 0;
  z-index: 80;
  min-height: 56px;
  padding: calc(env(safe-area-inset-top, 0px) + 6px) 8px 6px 4px;
  background: #ffffff;
  box-shadow: 0 1px 0 rgba(15, 23, 42, .08);
  color: #0f172a;
}
html.cd-pwa-standalone.cd-pwa-app-tool:not(.cd-view-desktop) .cd-app-bar-back {
  appearance: none;
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 24px;
  background: transparent;
  color: inherit;
  cursor: pointer;
}
html.cd-pwa-standalone.cd-pwa-app-tool:not(.cd-view-desktop) .cd-app-bar-title {
  flex: 1;
  min-width: 0;
  margin: 0;
  font-size: 1.05rem;
  font-weight: 700;
  letter-spacing: -.01em;
  line-height: 1.25;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
html.cd-pwa-standalone.cd-pwa-app-tool:not(.cd-view-desktop) main h1,
html.cd-pwa-standalone.cd-pwa-app-tool:not(.cd-view-desktop) main .cd-hicon {
  display: none !important;
}
html.cd-pwa-standalone.cd-pwa-app-tool:not(.cd-view-desktop) main {
  padding-top: 8px;
  padding-bottom: calc(72px + env(safe-area-inset-bottom, 0px));
}
html.cd-pwa-standalone.cd-pwa-app-tool:not(.cd-view-desktop) .btn,
html.cd-pwa-standalone.cd-pwa-app-tool:not(.cd-view-desktop) button.btn,
html.cd-pwa-standalone.cd-pwa-app-tool:not(.cd-view-desktop) .actions .btn,
html.cd-pwa-standalone.cd-pwa-app-tool:not(.cd-view-desktop) #go,
html.cd-pwa-standalone.cd-pwa-app-tool:not(.cd-view-desktop) .dz {
  min-height: 48px;
}

/* Home launch: Scan hero + 3-col card grid */
html.cd-pwa-standalone.cd-pwa-app-home:not(.cd-view-desktop) .cd-app-launch {
  display: block !important;
  width: 100%;
  max-width: 520px;
  margin: 0 auto;
  padding: 12px 16px calc(96px + env(safe-area-inset-bottom, 0px));
  box-sizing: border-box;
}
html.cd-pwa-standalone.cd-pwa-app-home:not(.cd-view-desktop) .cd-app-hero {
  appearance: none;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  margin: 4px 0 18px;
  padding: 28px 16px 24px;
  border: 0;
  border-radius: 28px;
  background: linear-gradient(160deg, #4f46e5 0%, #6366f1 42%, #7c3aed 100%);
  color: #fff;
  box-shadow: 0 14px 32px rgba(79, 70, 229, .32);
  cursor: pointer;
  text-align: center;
  font: inherit;
  box-sizing: border-box;
}
html.cd-pwa-standalone.cd-pwa-app-home:not(.cd-view-desktop) .cd-app-hero-fab {
  display: grid;
  place-items: center;
  width: 84px;
  height: 84px;
  border-radius: 42px;
  background: #fff;
  color: #4f46e5;
  box-shadow: 0 8px 20px rgba(15, 23, 42, .18);
}
html.cd-pwa-standalone.cd-pwa-app-home:not(.cd-view-desktop) .cd-app-hero-fab svg {
  width: 36px;
  height: 36px;
  display: block;
}
html.cd-pwa-standalone.cd-pwa-app-home:not(.cd-view-desktop) .cd-app-hero-t {
  font-size: 1.2rem;
  font-weight: 750;
  letter-spacing: -.02em;
  line-height: 1.2;
}
html.cd-pwa-standalone.cd-pwa-app-home:not(.cd-view-desktop) .cd-app-hero-s {
  margin-top: -4px;
  font-size: .85rem;
  font-weight: 500;
  color: rgba(255,255,255,.86);
}
html.cd-pwa-standalone.cd-pwa-app-home:not(.cd-view-desktop) .cd-app-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin: 0 0 18px;
}
@media (max-width: 359px) {
  html.cd-pwa-standalone.cd-pwa-app-home:not(.cd-view-desktop) .cd-app-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
html.cd-pwa-standalone.cd-pwa-app-home:not(.cd-view-desktop) .cd-app-grid-tile {
  appearance: none;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  min-height: 108px;
  min-width: 0;
  margin: 0;
  padding: 14px 8px 12px;
  border: 0;
  border-radius: 20px;
  background: #ffffff;
  color: #0f172a;
  text-decoration: none;
  box-shadow: 0 6px 18px rgba(15, 23, 42, .07);
  font: inherit;
  text-align: center;
  cursor: pointer;
  box-sizing: border-box;
}
html.cd-pwa-standalone.cd-pwa-app-home:not(.cd-view-desktop) .cd-app-grid-ic {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  flex: 0 0 48px;
  border-radius: 16px;
  background: #eef2ff;
  color: #4f46e5;
}
html.cd-pwa-standalone.cd-pwa-app-home:not(.cd-view-desktop) .cd-app-grid-ic svg { width: 22px; height: 22px; display: block; }
html.cd-pwa-standalone.cd-pwa-app-home:not(.cd-view-desktop) .cd-app-grid-t {
  font-size: .78rem;
  font-weight: 650;
  line-height: 1.25;
  letter-spacing: -.01em;
}
html.cd-pwa-standalone.cd-pwa-app-home:not(.cd-view-desktop) .cd-app-visit {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 48px;
  margin: 10px 0 16px;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1.5px solid #c7d2fe;
  background: #fff;
  color: #3730a3;
  text-decoration: none;
  font-weight: 650;
  font-size: .92rem;
  text-align: center;
  box-sizing: border-box;
}
html.cd-pwa-standalone.cd-pwa-app-home:not(.cd-view-desktop) .cd-app-home-ad {
  margin: 8px 0 0;
  min-height: 0;
}
html.cd-pwa-standalone.cd-pwa-app-home:not(.cd-view-desktop) .cd-app-home-ad .cd-adst {
  margin: 0 auto;
}

/* Sticky app tab bar: Home, Tools, Share, Website */
html.cd-pwa-standalone .cd-app-tabs { display: none; }
html.cd-pwa-standalone.cd-pwa-app-shell:not(.cd-view-desktop) .cd-app-tabs {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 85;
  background: rgba(255,255,255,.96);
  -webkit-backdrop-filter: saturate(1.4) blur(12px);
  backdrop-filter: saturate(1.4) blur(12px);
  border-top: 1px solid #e8eef5;
  padding: 4px 4px calc(4px + env(safe-area-inset-bottom, 0px));
  box-shadow: 0 -8px 24px rgba(15, 23, 42, .06);
}
html.cd-pwa-standalone.cd-pwa-app-shell:not(.cd-view-desktop) .cd-app-tab {
  appearance: none;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  min-height: 52px;
  margin: 0;
  padding: 4px 2px;
  border: 0;
  border-radius: 12px;
  background: none;
  color: #64748b;
  text-decoration: none;
  font: 650 11px/1.1 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
html.cd-pwa-standalone.cd-pwa-app-shell:not(.cd-view-desktop) .cd-app-tab[aria-current="page"],
html.cd-pwa-standalone.cd-pwa-app-shell:not(.cd-view-desktop) .cd-app-tab:focus-visible {
  color: #4f46e5;
}
html.cd-pwa-standalone.cd-pwa-app-shell:not(.cd-view-desktop) .cd-app-tab svg { display: block; }
html.cd-pwa-standalone.cd-pwa-app-home:not(.cd-view-desktop) header.site-head #cd-nav .cd-app-visit-menu,
html.cd-pwa-standalone.cd-pwa-app-shell:not(.cd-view-desktop) #cd-nav .cd-app-visit-menu {
  display: block;
  width: 100%;
  margin: 8px 0;
  padding: 12px 14px;
  border-radius: 12px;
  background: #eef2ff;
  color: #3730a3;
  text-decoration: none;
  font-weight: 650;
  font-size: .92rem;
  text-align: center;
  box-sizing: border-box;
}

/* Compact APK download link on the install banner and help card. */
.cd-apk-dl {
  flex: 0 0 auto;
  font-size: .85rem;
  font-weight: 650;
  color: #3730a3;
  text-decoration: none;
  white-space: nowrap;
  padding: 8px 4px;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}
.cd-install-card .cd-apk-dl { display: flex; justify-content: center; margin: 0 0 10px; }
html.cd-pwa-standalone .cd-apk-dl { display: none !important; }


/* Phone Install app is a plain APK <a>, not a PWA prompt. */
a.cd-install {
  text-decoration: none;
  box-sizing: border-box;
}
.cd-ios-home-note {
  appearance: none;
  border: 0;
  background: none;
  color: #3730a3;
  font: inherit;
  font-size: .85rem;
  font-weight: 650;
  min-height: 44px;
  padding: 8px 4px;
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 2px;
}
html.cd-phone-install button.cd-install[data-cd-install] { display: none !important; }