/* ============================================================
   Image Prompt AI — 60 LIGHT SITE DESIGNS (2026 modern)
   Unique graph / 3D / mesh backgrounds + full UI restyle.
   Loads last so each pack overrides Cosmic Glass chrome.
   ============================================================ */

/* ---------- Shared modern chrome (all 60) ---------- */
html body.ipa-sitedesign {
  background-color: #ffffff !important;
  background-attachment: fixed !important;
  color: var(--sd-ink, #1E293B) !important;
}
html body.ipa-sitedesign #ipaCosmicCanvas,
html body.ipa-sitedesign canvas#ipaCosmicCanvas {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* Cosmic nebula layers are restyled per-site in site-bg-advance.css. */

html body.ipa-sitedesign .advanced-header,
html body.ipa-sitedesign .mobile-header-modern,
html body.ipa-sitedesign .mobile-header {
  backdrop-filter: blur(18px) saturate(160%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(160%) !important;
  box-shadow: 0 10px 32px rgba(15, 23, 42, 0.06) !important;
}

html body.ipa-sitedesign .ah-nav a,
html body.ipa-sitedesign .mobile-bottom-nav a {
  border-radius: var(--sd-br, 12px) !important;
  gap: 8px !important;
}
html body.ipa-sitedesign .ah-nav a i,
html body.ipa-sitedesign .mobile-bottom-nav a i,
html body.ipa-sitedesign .footer-social a i,
html body.ipa-sitedesign .ipa-layout-toggle button i,
html body.ipa-sitedesign .ah-icon-btn i,
html body.ipa-sitedesign .header-icon-btn i,
html body.ipa-sitedesign .ah-search-pill i,
html body.ipa-sitedesign .popup-icon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 1.7em !important;
  height: 1.7em !important;
  border-radius: var(--sd-br, 10px) !important;
  background: color-mix(in srgb, var(--sd-p) 12%, #fff) !important;
  color: var(--sd-p) !important;
  box-shadow: 0 4px 10px color-mix(in srgb, var(--sd-p) 12%, transparent);
}
html body.ipa-sitedesign .ah-nav a.active i,
html body.ipa-sitedesign .mobile-bottom-nav a.active i,
html body.ipa-sitedesign .ipa-layout-toggle button.active i {
  background: var(--sd-grad, var(--sd-p)) !important;
  color: #fff !important;
  box-shadow: 0 6px 14px color-mix(in srgb, var(--sd-p) 28%, transparent);
}

html body.ipa-sitedesign .prompt-card,
html body.ipa-sitedesign .blog-card,
html body.ipa-sitedesign .image-card,
html body.ipa-sitedesign .info-card {
  transform: translateZ(0);
  transition: transform 0.28s cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow 0.28s, border-color 0.28s !important;
  overflow: hidden;
}
html body.ipa-sitedesign .prompt-card:hover,
html body.ipa-sitedesign .blog-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 22px 44px color-mix(in srgb, var(--sd-p) 18%, transparent) !important;
}
html body.ipa-sitedesign .card-image-wrapper {
  border-radius: calc(var(--sd-r, 16px) * 0.7) calc(var(--sd-r, 16px) * 0.7) 0 0 !important;
}

html body.ipa-sitedesign .ipa-layout-toggle {
  background: color-mix(in srgb, var(--sd-card) 90%, transparent) !important;
  padding: 5px !important;
  border-radius: calc(var(--sd-br, 10px) + 6px) !important;
  border: 1px solid color-mix(in srgb, var(--sd-p) 14%, transparent) !important;
  box-shadow: var(--sd-sh, 0 8px 20px rgba(15,23,42,.06)) !important;
}

html body.ipa-sitedesign .ah-icon-btn,
html body.ipa-sitedesign .header-icon-btn {
  width: 42px !important;
  height: 42px !important;
  border-radius: var(--sd-br, 12px) !important;
}

html body.ipa-sitedesign .popup-icon {
  width: 40px !important;
  height: 40px !important;
  font-size: 15px !important;
}

html body.ipa-sitedesign .ipa-views-chip,
html body.ipa-sitedesign .ipa-time-chip,
html body.ipa-sitedesign .card-image-wrapper .model-tag,
html body.ipa-sitedesign .image-wrapper .model-badge-overlay,
html body.ipa-sitedesign .image-wrapper .ipa-zoom-chip,
html body.ipa-sitedesign .image-wrapper .image-overlay-like {
  background: rgba(15, 23, 42, 0.28) !important;
  color: #fff !important;
  border: 1px solid rgba(255, 255, 255, 0.32) !important;
  backdrop-filter: blur(12px) saturate(160%) !important;
  -webkit-backdrop-filter: blur(12px) saturate(160%) !important;
  box-shadow: none !important;
}

/* Force category NAME on image tag (not icon-only) */
@media (min-width: 768px) {
  html body .card-image-wrapper .card-badges {
    display: block !important;
    position: absolute !important;
    top: 10px !important;
    left: 10px !important;
    width: auto !important;
    height: auto !important;
    max-width: calc(100% - 24px) !important;
    overflow: visible !important;
    z-index: 8 !important;
  }
  html body .card-image-wrapper a.model-tag {
    display: inline-flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 6px !important;
    width: max-content !important;
    max-width: 220px !important;
    height: auto !important;
    min-width: unset !important;
    padding: 6px 12px !important;
    position: static !important;
    overflow: visible !important;
  }
  html body .card-image-wrapper a.model-tag span,
  html body .image-wrapper a.model-badge-overlay span {
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: auto !important;
    min-width: 2ch !important;
    max-width: 180px !important;
    height: auto !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    color: #fff !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
}

/* ============================================================
   SITES 1–20 — mesh / graph / isometric 3D
   ============================================================ */

/* 01 Aurora Mesh 3D */
html body.ipa-sitedesign-site01 {
  background-color: #F7F4FF !important;
  background-image:
    radial-gradient(ellipse 70% 48% at 8% -8%, rgba(124,92,255,.22), transparent 52%),
    radial-gradient(ellipse 55% 40% at 96% 4%, rgba(255,122,182,.18), transparent 48%),
    radial-gradient(ellipse 40% 30% at 70% 90%, rgba(196,181,253,.16), transparent 50%),
    linear-gradient(30deg, rgba(124,92,255,.07) 12%, transparent 12.5%, transparent 87%, rgba(124,92,255,.07) 87.5%),
    linear-gradient(150deg, rgba(255,122,182,.07) 12%, transparent 12.5%, transparent 87%, rgba(255,122,182,.07) 87.5%) !important;
  background-size: auto, auto, auto, 56px 96px, 56px 96px !important;
}
html body.ipa-sitedesign-site01 .advanced-header { border-bottom: 0 !important; box-shadow: 0 12px 36px rgba(124,92,255,.10) !important; }
html body.ipa-sitedesign-site01 .prompt-card { outline: 1px solid rgba(255,122,182,.22) !important; outline-offset: -6px !important; }
html body.ipa-sitedesign-site01 .card-title { letter-spacing: -0.03em; }
html body.ipa-sitedesign-site01 .ah-nav a i,
html body.ipa-sitedesign-site01 .popup-icon { border-radius: 999px !important; }

/* 02 Crystal Graph */
html body.ipa-sitedesign-site02 {
  background-color: #F0F9FF !important;
  background-image:
    linear-gradient(rgba(2,132,199,.10) 1px, transparent 1px),
    linear-gradient(90deg, rgba(2,132,199,.10) 1px, transparent 1px),
    linear-gradient(rgba(2,132,199,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(2,132,199,.05) 1px, transparent 1px) !important;
  background-size: 80px 80px, 80px 80px, 16px 16px, 16px 16px !important;
}
html body.ipa-sitedesign-site02 .advanced-header,
html body.ipa-sitedesign-site02 .mobile-header-modern { border-bottom: 3px solid var(--sd-p) !important; border-radius: 0 !important; }
html body.ipa-sitedesign-site02 .prompt-card { border-radius: 8px !important; }
html body.ipa-sitedesign-site02 .ah-nav a i,
html body.ipa-sitedesign-site02 .popup-icon,
html body.ipa-sitedesign-site02 .ipa-layout-toggle button i { border-radius: 4px !important; }

/* 03 Iso Prism — 3D cubes */
html body.ipa-sitedesign-site03 {
  background-color: #ECFDF5 !important;
  background-image:
    linear-gradient(30deg, rgba(5,150,105,.11) 12%, transparent 12.5%, transparent 87%, rgba(5,150,105,.11) 87.5%),
    linear-gradient(150deg, rgba(5,150,105,.11) 12%, transparent 12.5%, transparent 87%, rgba(5,150,105,.11) 87.5%),
    linear-gradient(30deg, rgba(52,211,153,.08) 12%, transparent 12.5%, transparent 87%, rgba(52,211,153,.08) 87.5%),
    linear-gradient(150deg, rgba(52,211,153,.08) 12%, transparent 12.5%, transparent 87%, rgba(52,211,153,.08) 87.5%),
    linear-gradient(60deg, rgba(5,150,105,.05) 25%, transparent 25.5%, transparent 75%, rgba(5,150,105,.05) 75%) !important;
  background-size: 48px 84px !important;
  background-position: 0 0, 0 0, 24px 42px, 24px 42px, 0 0 !important;
}
html body.ipa-sitedesign-site03 .prompt-card,
html body.ipa-sitedesign-site03 .blog-card { box-shadow: 8px 12px 0 rgba(16,185,129,.16) !important; transform: perspective(900px) rotateX(1.4deg); }
html body.ipa-sitedesign-site03 .prompt-card:hover { transform: perspective(900px) rotateX(0) translateY(-8px); }
html body.ipa-sitedesign-site03 .action-btn-full { box-shadow: 4px 4px 0 #047857 !important; }
html body.ipa-sitedesign-site03 .ah-nav a i { clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%); border-radius: 0 !important; }

/* 04 Coral Helix — orbits */
html body.ipa-sitedesign-site04 {
  background-color: #FFF1F2 !important;
  background-image:
    repeating-radial-gradient(circle at 12% 8%, transparent 0 18px, rgba(244,63,94,.08) 18px 19px),
    repeating-radial-gradient(circle at 92% 88%, transparent 0 22px, rgba(251,113,133,.07) 22px 23px),
    radial-gradient(circle at 80% 12%, rgba(254,205,211,.45), transparent 36%) !important;
}
html body.ipa-sitedesign-site04 .action-btn-full { letter-spacing: .06em; text-transform: uppercase; font-size: 12px !important; }
html body.ipa-sitedesign-site04 .ah-nav a i,
html body.ipa-sitedesign-site04 .popup-icon { border-radius: 999px !important; }
html body.ipa-sitedesign-site04 .prompt-card { border-top: 4px solid var(--sd-p) !important; }

/* 05 Cloud Lattice */
html body.ipa-sitedesign-site05 {
  background-color: #F5F3FF !important;
  background-image:
    radial-gradient(ellipse 80% 50% at 10% 0%, rgba(139,92,246,.18), transparent 50%),
    linear-gradient(45deg, rgba(139,92,246,.07) 25%, transparent 25%),
    linear-gradient(-45deg, rgba(167,139,250,.07) 25%, transparent 25%) !important;
  background-size: auto, 28px 28px, 28px 28px !important;
}
html body.ipa-sitedesign-site05 .prompt-card,
html body.ipa-sitedesign-site05 .image-card,
html body.ipa-sitedesign-site05 .info-card {
  backdrop-filter: blur(16px);
  background: rgba(252,251,255,.86) !important;
}
html body.ipa-sitedesign-site05 .ah-nav a i,
html body.ipa-sitedesign-site05 .popup-icon { border-radius: 14px !important; }

/* 06 Paper Cube 3D */
html body.ipa-sitedesign-site06 {
  background-color: #FFFBEB !important;
  background-image:
    linear-gradient(30deg, rgba(217,119,6,.12) 12%, transparent 12.5%, transparent 87%, rgba(217,119,6,.12) 87.5%),
    linear-gradient(150deg, rgba(245,158,11,.10) 12%, transparent 12.5%, transparent 87%, rgba(245,158,11,.10) 87.5%),
    linear-gradient(30deg, rgba(217,119,6,.07) 12%, transparent 12.5%, transparent 87%, rgba(217,119,6,.07) 87.5%),
    linear-gradient(150deg, rgba(245,158,11,.07) 12%, transparent 12.5%, transparent 87%, rgba(245,158,11,.07) 87.5%) !important;
  background-size: 40px 70px !important;
  background-position: 0 0, 0 0, 20px 35px, 20px 35px !important;
}
html body.ipa-sitedesign-site06 .card-title { border-bottom: 2px solid rgba(217,119,6,.18); padding-bottom: 6px; }
html body.ipa-sitedesign-site06 .prompt-card { box-shadow: 6px 6px 0 rgba(217,119,6,.16) !important; }
html body.ipa-sitedesign-site06 .ah-nav a i,
html body.ipa-sitedesign-site06 .ipa-layout-toggle button i { border-radius: 3px !important; }

/* 07 Orbit Map */
html body.ipa-sitedesign-site07 {
  background-color: #EFF6FF !important;
  background-image:
    repeating-radial-gradient(circle at 50% -10%, transparent 0 28px, rgba(37,99,235,.08) 28px 29px),
    linear-gradient(90deg, rgba(37,99,235,.05) 1px, transparent 1px),
    linear-gradient(rgba(37,99,235,.05) 1px, transparent 1px) !important;
  background-size: auto, 32px 32px, 32px 32px !important;
}
html body.ipa-sitedesign-site07 .prompt-card { box-shadow: none !important; border: 1px solid rgba(37,99,235,.18) !important; }
html body.ipa-sitedesign-site07 .advanced-header { border-bottom: 1px solid rgba(37,99,235,.2) !important; }
html body.ipa-sitedesign-site07 .ah-nav a i { border-radius: 999px !important; box-shadow: 0 0 0 3px color-mix(in srgb, var(--sd-p) 12%, transparent); }

/* 08 Rose Graph */
html body.ipa-sitedesign-site08 {
  background-color: #FFF1F2 !important;
  background-image:
    linear-gradient(rgba(225,29,72,.10) 1px, transparent 1px),
    linear-gradient(90deg, rgba(225,29,72,.10) 1px, transparent 1px),
    radial-gradient(ellipse at top, rgba(251,113,133,.14), transparent 52%) !important;
  background-size: 24px 24px, 24px 24px, auto !important;
}
html body.ipa-sitedesign-site08 .ipa-layout-toggle { background: #fff !important; padding: 4px; border-radius: 16px; }
html body.ipa-sitedesign-site08 .prompt-card { border-radius: 18px !important; }
html body.ipa-sitedesign-site08 .ah-nav a i,
html body.ipa-sitedesign-site08 .popup-icon { border-radius: 10px !important; }

/* 09 Sand Iso */
html body.ipa-sitedesign-site09 {
  background-color: #FBF7EE !important;
  background-image:
    linear-gradient(30deg, rgba(180,83,9,.10) 12%, transparent 12.5%, transparent 87%, rgba(180,83,9,.10) 87.5%),
    linear-gradient(150deg, rgba(217,119,6,.10) 12%, transparent 12.5%, transparent 87%, rgba(217,119,6,.10) 87.5%),
    linear-gradient(60deg, rgba(252,211,77,.08) 25%, transparent 25.5%, transparent 75%, rgba(252,211,77,.08) 75%) !important;
  background-size: 52px 90px !important;
}
html body.ipa-sitedesign-site09 .prompt-card { border-left: 5px solid var(--sd-p) !important; box-shadow: 10px 10px 0 rgba(196,163,90,.16) !important; }
html body.ipa-sitedesign-site09 .ah-nav a i { border-radius: 2px !important; }

/* 10 Berry Wave */
html body.ipa-sitedesign-site10 {
  background-color: #FDF2F8 !important;
  background-image:
    repeating-linear-gradient(180deg, transparent, transparent 10px, rgba(219,39,119,.07) 10px, rgba(219,39,119,.07) 12px),
    radial-gradient(circle at 18% 8%, rgba(244,114,182,.20), transparent 34%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='40' viewBox='0 0 140 40'%3E%3Cpath fill='none' stroke='%23DB2777' stroke-opacity='.14' stroke-width='1.4' d='M0 20c18-16 28 16 46 0s28 16 46 0 28 16 48 0'/%3E%3C/svg%3E") !important;
  background-size: auto, auto, 140px 40px !important;
}
html body.ipa-sitedesign-site10 .prompt-card { box-shadow: 0 22px 50px rgba(219,39,119,.12) !important; border-radius: 24px !important; }
html body.ipa-sitedesign-site10 .action-btn-full { box-shadow: 0 10px 24px rgba(219,39,119,.28) !important; }
html body.ipa-sitedesign-site10 .ah-nav a i,
html body.ipa-sitedesign-site10 .popup-icon { border-radius: 999px !important; }

/* 11 Gold Hex 3D */
html body.ipa-sitedesign-site11 {
  background-color: #FEFCE8 !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='98' viewBox='0 0 56 98'%3E%3Cpath fill='none' stroke='%23CA8A04' stroke-opacity='.18' stroke-width='1.1' d='M28 2l24 14v28L28 58 4 44V16zM28 58v38M4 44l24 14 24-14'/%3E%3C/svg%3E") !important;
  background-size: 56px 98px !important;
}
html body.ipa-sitedesign-site11 .prompt-card,
html body.ipa-sitedesign-site11 .blog-card { box-shadow: 6px 6px 0 rgba(202,138,4,.18) !important; }
html body.ipa-sitedesign-site11 .action-btn-full { box-shadow: 3px 3px 0 rgba(66,32,6,.2) !important; letter-spacing: .08em; text-transform: uppercase; }
html body.ipa-sitedesign-site11 .ah-nav a i { clip-path: polygon(25% 6%, 75% 6%, 100% 50%, 75% 94%, 25% 94%, 0 50%); border-radius: 0 !important; }

/* 12 Neural Teal */
html body.ipa-sitedesign-site12 {
  background-color: #F0FDFA !important;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cg fill='%230D9488' fill-opacity='.16'%3E%3Ccircle cx='18' cy='22' r='2.2'/%3E%3Ccircle cx='92' cy='18' r='2'/%3E%3Ccircle cx='118' cy='78' r='2.4'/%3E%3Ccircle cx='46' cy='104' r='2'/%3E%3Ccircle cx='70' cy='52' r='1.6'/%3E%3C/g%3E%3Cg fill='none' stroke='%230D9488' stroke-opacity='.12'%3E%3Cpath d='M18 22L92 18L70 52L118 78L46 104L70 52L18 22'/%3E%3C/g%3E%3C/svg%3E"),
    linear-gradient(rgba(13,148,136,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(13,148,136,.05) 1px, transparent 1px) !important;
  background-size: 140px 140px, 28px 28px, 28px 28px !important;
}
html body.ipa-sitedesign-site12 .prompt-card { box-shadow: inset 0 0 0 4px #fff, 0 0 0 1px rgba(13,148,136,.28) !important; }
html body.ipa-sitedesign-site12 .ah-nav a i,
html body.ipa-sitedesign-site12 .popup-icon { border-radius: 999px !important; }

/* 13 Honey Glass */
html body.ipa-sitedesign-site13 {
  background-color: #FFFBEB !important;
  background-image:
    radial-gradient(ellipse 60% 40% at 0% 0%, rgba(245,158,11,.18), transparent 50%),
    radial-gradient(ellipse 50% 36% at 100% 100%, rgba(180,83,9,.10), transparent 48%),
    linear-gradient(135deg, rgba(253,230,138,.18) 25%, transparent 25%),
    linear-gradient(225deg, rgba(253,230,138,.12) 25%, transparent 25%) !important;
  background-size: auto, auto, 36px 36px, 36px 36px !important;
}
html body.ipa-sitedesign-site13 .advanced-header,
html body.ipa-sitedesign-site13 .mobile-header-modern {
  background: linear-gradient(90deg, rgba(255,254,248,.92), rgba(247,239,212,.88)) !important;
  border-bottom: 1px solid rgba(180,83,9,.28) !important;
}
html body.ipa-sitedesign-site13 .card-title { letter-spacing: .04em; }
html body.ipa-sitedesign-site13 .prompt-card { backdrop-filter: blur(12px); }

/* 14 Lilac Sketch */
html body.ipa-sitedesign-site14 {
  background-color: #FAF5FF !important;
  background-image:
    repeating-linear-gradient(-32deg, transparent, transparent 8px, rgba(124,58,237,.06) 8px, rgba(124,58,237,.06) 9px),
    repeating-linear-gradient(32deg, transparent, transparent 8px, rgba(167,139,250,.05) 8px, rgba(167,139,250,.05) 9px) !important;
}
html body.ipa-sitedesign-site14 .prompt-card { border-radius: 0 !important; border: 1px solid #ddd6fe !important; box-shadow: none !important; }
html body.ipa-sitedesign-site14 .ah-nav a i,
html body.ipa-sitedesign-site14 .ipa-layout-toggle button i,
html body.ipa-sitedesign-site14 .popup-icon { border-radius: 0 !important; }

/* 15 Cherry Iso */
html body.ipa-sitedesign-site15 {
  background-color: #FFF1F2 !important;
  background-image:
    linear-gradient(30deg, rgba(190,18,60,.12) 12%, transparent 12.5%, transparent 87%, rgba(190,18,60,.12) 87.5%),
    linear-gradient(150deg, rgba(251,113,133,.10) 12%, transparent 12.5%, transparent 87%, rgba(251,113,133,.10) 87.5%),
    linear-gradient(30deg, rgba(190,18,60,.07) 12%, transparent 12.5%, transparent 87%, rgba(190,18,60,.07) 87.5%),
    linear-gradient(150deg, rgba(251,113,133,.07) 12%, transparent 12.5%, transparent 87%, rgba(251,113,133,.07) 87.5%) !important;
  background-size: 44px 76px !important;
  background-position: 0 0, 0 0, 22px 38px, 22px 38px !important;
}
html body.ipa-sitedesign-site15 .card-title { font-weight: 800 !important; }
html body.ipa-sitedesign-site15 .action-btn-full { box-shadow: 0 6px 0 #9F1239 !important; transform: translateY(-1px); }
html body.ipa-sitedesign-site15 .advanced-header { border-bottom: 4px solid var(--sd-p) !important; }
html body.ipa-sitedesign-site15 .ah-nav a i { border-radius: 6px !important; }

/* 16 Sea Graph */
html body.ipa-sitedesign-site16 {
  background-color: #ECFEFF !important;
  background-image:
    linear-gradient(rgba(8,145,178,.10) 1px, transparent 1px),
    linear-gradient(90deg, rgba(8,145,178,.10) 1px, transparent 1px),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='48' viewBox='0 0 160 48'%3E%3Cpath fill='none' stroke='%230891B2' stroke-opacity='.16' d='M0 28c20-18 30 18 50 0s30 18 50 0 30 18 60 0'/%3E%3C/svg%3E") !important;
  background-size: 22px 22px, 22px 22px, 160px 48px !important;
}
html body.ipa-sitedesign-site16 .prompt-card { border-radius: 26px !important; }
html body.ipa-sitedesign-site16 .ah-nav a i,
html body.ipa-sitedesign-site16 .popup-icon { border-radius: 999px !important; }

/* 17 Orchid Mesh */
html body.ipa-sitedesign-site17 {
  background-color: #FDF4FF !important;
  background-image:
    radial-gradient(ellipse 70% 45% at 0% 0%, rgba(162,28,175,.14), transparent 50%),
    radial-gradient(ellipse 50% 40% at 100% 10%, rgba(232,121,249,.14), transparent 46%),
    linear-gradient(115deg, rgba(245,208,254,.20) 0 12%, transparent 12%) !important;
}
html body.ipa-sitedesign-site17 .card-title,
html body.ipa-sitedesign-site17 .title { letter-spacing: .14em; text-transform: uppercase; font-size: .9em !important; }
html body.ipa-sitedesign-site17 .prompt-card { border-radius: 0 !important; box-shadow: 0 1px 0 rgba(0,0,0,.06) !important; }
html body.ipa-sitedesign-site17 .ah-nav a i,
html body.ipa-sitedesign-site17 .ipa-layout-toggle button i { border-radius: 0 !important; }

/* 18 Apricot Craft */
html body.ipa-sitedesign-site18 {
  background-color: #FFF7ED !important;
  background-image:
    radial-gradient(rgba(234,88,12,.12) 1.1px, transparent 1.2px),
    repeating-linear-gradient(90deg, transparent, transparent 18px, rgba(234,88,12,.05) 18px, rgba(234,88,12,.05) 19px) !important;
  background-size: 14px 14px, auto !important;
}
html body.ipa-sitedesign-site18 .prompt-card { border: 1.5px dashed rgba(234,88,12,.32) !important; }
html body.ipa-sitedesign-site18 .ah-nav a i { border-radius: 10px !important; border: 1px dashed color-mix(in srgb, var(--sd-p) 35%, transparent); }

/* 19 Sage Botanic */
html body.ipa-sitedesign-site19 {
  background-color: #F7FEE7 !important;
  background-image:
    radial-gradient(ellipse at 0% 0%, rgba(77,124,15,.12), transparent 42%),
    repeating-radial-gradient(circle at 90% 10%, transparent 0 16px, rgba(132,204,22,.08) 16px 17px),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='72' height='72'%3E%3Cpath fill='none' stroke='%234D7C0F' stroke-opacity='.12' d='M36 8c8 10 8 18 0 28-8-10-8-18 0-28zM36 36c8 10 8 18 0 28-8-10-8-18 0-28z'/%3E%3C/svg%3E") !important;
  background-size: auto, auto, 72px 72px !important;
}
html body.ipa-sitedesign-site19 .related-title { font-style: italic; }
html body.ipa-sitedesign-site19 .prompt-card { border-radius: 16px !important; }
html body.ipa-sitedesign-site19 .ah-nav a i { border-radius: 12px 4px 12px 4px !important; }

/* 20 Candy Cloud */
html body.ipa-sitedesign-site20 {
  background-color: #F5F3FF !important;
  background-image:
    radial-gradient(circle at 14% 10%, rgba(244,114,182,.20), transparent 32%),
    radial-gradient(circle at 88% 6%, rgba(99,102,241,.18), transparent 36%),
    radial-gradient(circle at 50% 100%, rgba(196,181,253,.18), transparent 40%) !important;
}
html body.ipa-sitedesign-site20 .ipa-layout-toggle button,
html body.ipa-sitedesign-site20 .model-tag,
html body.ipa-sitedesign-site20 .tag-pill,
html body.ipa-sitedesign-site20 .ah-nav a i,
html body.ipa-sitedesign-site20 .popup-icon { border-radius: 999px !important; }
html body.ipa-sitedesign-site20 .prompt-card { border-radius: 32px !important; }

/* ============================================================
   SITES 21–40 — poster / weave / arcade / blueprint / 3D
   ============================================================ */

/* 21 Swiss Graph */
html body.ipa-sitedesign-site21 {
  background-color: #F4F4F0 !important;
  background-image:
    linear-gradient(#111 1px, transparent 1px),
    linear-gradient(90deg, #111 1px, transparent 1px) !important;
  background-size: 48px 48px !important;
  background-position: -1px -1px !important;
}
html body.ipa-sitedesign-site21 .advanced-header,
html body.ipa-sitedesign-site21 .mobile-header-modern { border-bottom: 8px solid #DC2626 !important; border-radius: 0 !important; }
html body.ipa-sitedesign-site21 .card-title,
html body.ipa-sitedesign-site21 .title { text-transform: uppercase; letter-spacing: .05em; }
html body.ipa-sitedesign-site21 .ipa-layout-toggle button,
html body.ipa-sitedesign-site21 .ah-nav a i,
html body.ipa-sitedesign-site21 .popup-icon { border-radius: 0 !important; border: 1px solid #111 !important; }
html body.ipa-sitedesign-site21 .ipa-layout-toggle button.active { background: #DC2626 !important; }

/* 22 Matcha Weave */
html body.ipa-sitedesign-site22 {
  background-color: #F7FEE7 !important;
  background-image:
    repeating-linear-gradient(-18deg, transparent, transparent 11px, rgba(63,98,18,.07) 11px, rgba(63,98,18,.07) 12px),
    repeating-linear-gradient(18deg, transparent, transparent 11px, rgba(101,163,13,.05) 11px, rgba(101,163,13,.05) 12px) !important;
}
html body.ipa-sitedesign-site22 .prompt-card { border-top: 3px solid var(--sd-p) !important; }
html body.ipa-sitedesign-site22 .ah-nav a i { border-radius: 2px !important; }

/* 23 Arcade Iso */
html body.ipa-sitedesign-site23 {
  background-color: #EEF2FF !important;
  background-image:
    linear-gradient(30deg, rgba(79,70,229,.14) 12%, transparent 12.5%, transparent 87%, rgba(79,70,229,.14) 87.5%),
    linear-gradient(150deg, rgba(34,211,238,.12) 12%, transparent 12.5%, transparent 87%, rgba(34,211,238,.12) 87.5%),
    linear-gradient(30deg, rgba(79,70,229,.08) 12%, transparent 12.5%, transparent 87%, rgba(79,70,229,.08) 87.5%),
    linear-gradient(150deg, rgba(244,114,182,.08) 12%, transparent 12.5%, transparent 87%, rgba(244,114,182,.08) 87.5%) !important;
  background-size: 36px 62px !important;
  background-position: 0 0, 0 0, 18px 31px, 18px 31px !important;
}
html body.ipa-sitedesign-site23 .prompt-card { box-shadow: 5px 5px 0 #4F46E5 !important; }
html body.ipa-sitedesign-site23 .ipa-layout-toggle button { border-radius: 4px !important; box-shadow: 2px 2px 0 #22D3EE; }
html body.ipa-sitedesign-site23 .action-btn-full { text-transform: uppercase; letter-spacing: .08em; }
html body.ipa-sitedesign-site23 .ah-nav a i { border-radius: 4px !important; box-shadow: 2px 2px 0 #22D3EE; }

/* 24 Sakura Field */
html body.ipa-sitedesign-site24 {
  background-color: #FFF7F9 !important;
  background-image:
    radial-gradient(circle at 12% 8%, rgba(251,113,133,.18), transparent 30%),
    radial-gradient(circle at 88% 12%, rgba(249,168,212,.16), transparent 28%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48'%3E%3Ccircle cx='10' cy='12' r='3' fill='%23FB7185' fill-opacity='.12'/%3E%3Ccircle cx='34' cy='30' r='2.4' fill='%23F9A8D4' fill-opacity='.16'/%3E%3C/svg%3E") !important;
  background-size: auto, auto, 48px 48px !important;
}
html body.ipa-sitedesign-site24 .ipa-layout-toggle button,
html body.ipa-sitedesign-site24 .ah-nav a i,
html body.ipa-sitedesign-site24 .popup-icon { border-radius: 999px !important; }
html body.ipa-sitedesign-site24 .prompt-card { border-radius: 24px !important; }

/* 25 Cobalt Blueprint */
html body.ipa-sitedesign-site25 {
  background-color: #EFF6FF !important;
  background-image:
    linear-gradient(rgba(29,78,216,.12) 1px, transparent 1px),
    linear-gradient(90deg, rgba(29,78,216,.12) 1px, transparent 1px),
    linear-gradient(rgba(29,78,216,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(29,78,216,.05) 1px, transparent 1px) !important;
  background-size: 64px 64px, 64px 64px, 8px 8px, 8px 8px !important;
}
html body.ipa-sitedesign-site25 .card-title { text-transform: uppercase; letter-spacing: .1em; font-size: .95em !important; }
html body.ipa-sitedesign-site25 .advanced-header { border-bottom: 3px solid #1D4ED8 !important; }
html body.ipa-sitedesign-site25 .prompt-card { border: 1px dashed #3B82F6 !important; border-radius: 4px !important; }
html body.ipa-sitedesign-site25 .ah-nav a i,
html body.ipa-sitedesign-site25 .ipa-layout-toggle button i { border-radius: 2px !important; }

/* 26 Polaroid Grid */
html body.ipa-sitedesign-site26 {
  background-color: #EEF2F6 !important;
  background-image:
    linear-gradient(#cbd5e1 1px, transparent 1px),
    linear-gradient(90deg, #cbd5e1 1px, transparent 1px) !important;
  background-size: 18px 18px !important;
}
html body.ipa-sitedesign-site26 .prompt-card { padding: 10px 10px 22px !important; background: #fff !important; border-radius: 2px !important; transform: rotate(-0.4deg); }
html body.ipa-sitedesign-site26 .prompt-card:nth-child(even) { transform: rotate(0.5deg); }
html body.ipa-sitedesign-site26 .prompt-card:hover { transform: rotate(0) translateY(-6px); }
html body.ipa-sitedesign-site26 .card-image-wrapper { border-radius: 0 !important; }
html body.ipa-sitedesign-site26 .ah-nav a i { border-radius: 2px !important; }

/* 27 Festival Chev */
html body.ipa-sitedesign-site27 {
  background-color: #FFFBEB !important;
  background-image: repeating-linear-gradient(135deg, #FFFBEB 0 12px, #FEF3C7 12px 24px, #DCFCE7 24px 36px) !important;
}
html body.ipa-sitedesign-site27 .ipa-layout-toggle button:nth-child(1).active { background: #F97316 !important; }
html body.ipa-sitedesign-site27 .ipa-layout-toggle button:nth-child(2).active { background: #22C55E !important; }
html body.ipa-sitedesign-site27 .ipa-layout-toggle button:nth-child(3).active { background: #FACC15 !important; color: #1C1206 !important; }
html body.ipa-sitedesign-site27 .prompt-card { border-top: 5px solid var(--sd-p) !important; }
html body.ipa-sitedesign-site27 .ah-nav a i,
html body.ipa-sitedesign-site27 .popup-icon { border-radius: 999px !important; }

/* 28 Marble 3D */
html body.ipa-sitedesign-site28 {
  background-color: #FAFAF9 !important;
  background-image:
    radial-gradient(ellipse at 20% 10%, rgba(168,162,158,.18), transparent 36%),
    radial-gradient(ellipse at 80% 80%, rgba(120,113,108,.10), transparent 40%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cpath fill='none' stroke='%2378716C' stroke-opacity='.10' d='M0 90c40-50 70 50 110 0s70 50 70 0'/%3E%3Cpath fill='none' stroke='%23A8A29E' stroke-opacity='.10' d='M0 40c50 40 80-40 180 10'/%3E%3C/svg%3E") !important;
}
html body.ipa-sitedesign-site28 .advanced-header { border-bottom: 1px solid #A8A29E !important; }
html body.ipa-sitedesign-site28 .card-title { letter-spacing: .08em; }
html body.ipa-sitedesign-site28 .prompt-card { border-radius: 0 !important; }
html body.ipa-sitedesign-site28 .ah-nav a i { border-radius: 0 !important; }

/* 29 Tech Blueprint */
html body.ipa-sitedesign-site29 {
  background-color: #EFF6FF !important;
  background-image:
    linear-gradient(rgba(29,78,216,.10) 1px, transparent 1px),
    linear-gradient(90deg, rgba(29,78,216,.10) 1px, transparent 1px) !important;
  background-size: 28px 28px !important;
}
html body.ipa-sitedesign-site29 .prompt-card { border: 1.5px dashed #1D4ED8 !important; border-radius: 0 !important; }
html body.ipa-sitedesign-site29 .ipa-layout-toggle button,
html body.ipa-sitedesign-site29 .ah-nav a i,
html body.ipa-sitedesign-site29 .card-title { font-family: "Roboto Mono", monospace !important; }
html body.ipa-sitedesign-site29 .ipa-layout-toggle button,
html body.ipa-sitedesign-site29 .ah-nav a i { border-radius: 0 !important; }

/* 30 Velvet Lattice */
html body.ipa-sitedesign-site30 {
  background-color: #FFF1F2 !important;
  background-image:
    linear-gradient(45deg, rgba(159,18,57,.07) 25%, transparent 25%),
    linear-gradient(-45deg, rgba(225,29,72,.07) 25%, transparent 25%),
    linear-gradient(45deg, transparent 75%, rgba(159,18,57,.07) 75%),
    linear-gradient(-45deg, transparent 75%, rgba(225,29,72,.07) 75%) !important;
  background-size: 32px 32px !important;
  background-position: 0 0, 0 16px, 16px -16px, -16px 0 !important;
}
html body.ipa-sitedesign-site30 .action-btn-full { letter-spacing: .1em; }
html body.ipa-sitedesign-site30 .prompt-card { border: 1px solid rgba(159,18,57,.16) !important; }
html body.ipa-sitedesign-site30 .ah-nav a i { border-radius: 10px !important; }

/* 31 Lime Honeycomb */
html body.ipa-sitedesign-site31 {
  background-color: #F7FEE7 !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='49' viewBox='0 0 28 49'%3E%3Cg fill='none' stroke='%2316A34A' stroke-opacity='.16' stroke-width='1'%3E%3Cpath d='M14 1l12 7v14L14 29 2 22V8zM14 29v18'/%3E%3C/g%3E%3C/svg%3E") !important;
  background-size: 28px 49px !important;
}
html body.ipa-sitedesign-site31 .ipa-layout-toggle button,
html body.ipa-sitedesign-site31 .ah-nav a i,
html body.ipa-sitedesign-site31 .popup-icon { border-radius: 999px !important; }
html body.ipa-sitedesign-site31 .prompt-card { border-radius: 22px !important; }

/* 32 Air Graph */
html body.ipa-sitedesign-site32 {
  background-color: #F8FAFC !important;
  background-image:
    linear-gradient(rgba(71,85,105,.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(71,85,105,.08) 1px, transparent 1px) !important;
  background-size: 20px 20px !important;
}
html body.ipa-sitedesign-site32 .ipa-layout-toggle button { border-radius: 12px !important; background: #fff !important; }
html body.ipa-sitedesign-site32 .ipa-layout-toggle button.active { background: #0F172A !important; color: #fff !important; }
html body.ipa-sitedesign-site32 .ah-nav a i { border-radius: 12px !important; }

/* 33 Balloon 3D */
html body.ipa-sitedesign-site33 {
  background-color: #F5F3FF !important;
  background-image:
    radial-gradient(circle at 12% 18%, rgba(236,72,153,.18) 0 18px, transparent 19px),
    radial-gradient(circle at 78% 12%, rgba(139,92,246,.16) 0 24px, transparent 25px),
    radial-gradient(circle at 40% 80%, rgba(52,211,153,.14) 0 16px, transparent 17px),
    radial-gradient(circle at 90% 70%, rgba(236,72,153,.10) 0 12px, transparent 13px) !important;
}
html body.ipa-sitedesign-site33 .ipa-layout-toggle button,
html body.ipa-sitedesign-site33 .ah-nav a i,
html body.ipa-sitedesign-site33 .popup-icon { border-radius: 999px !important; }
html body.ipa-sitedesign-site33 .prompt-card { border-radius: 28px !important; transform: perspective(800px) rotateX(2deg); }
html body.ipa-sitedesign-site33 .prompt-card:hover { transform: perspective(800px) rotateX(0) translateY(-8px); }

/* 34 Ink Graph */
html body.ipa-sitedesign-site34 {
  background-color: #FAFAF9 !important;
  background-image:
    linear-gradient(rgba(17,24,39,.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(17,24,39,.05) 1px, transparent 1px) !important;
  background-size: 28px 28px, 56px 56px !important;
}
html body.ipa-sitedesign-site34 .card-title { border-bottom: 1px solid #e5e7eb; padding-bottom: 8px; }
html body.ipa-sitedesign-site34 .ipa-layout-toggle button { border-radius: 0 !important; border-bottom: 2px solid transparent; }
html body.ipa-sitedesign-site34 .ipa-layout-toggle button.active { background: transparent !important; color: #111 !important; border-bottom-color: #111 !important; border-radius: 0 !important; }
html body.ipa-sitedesign-site34 .ah-nav a i { border-radius: 0 !important; }

/* 35 Wheat Hatch */
html body.ipa-sitedesign-site35 {
  background-color: #FFFBEB !important;
  background-image: repeating-linear-gradient(-28deg, transparent, transparent 9px, rgba(180,83,9,.07) 9px, rgba(180,83,9,.07) 10px) !important;
}
html body.ipa-sitedesign-site35 .prompt-card { border: 1px solid rgba(180,83,9,.18) !important; }
html body.ipa-sitedesign-site35 .related-title { font-style: italic; }
html body.ipa-sitedesign-site35 .ah-nav a i { border-radius: 8px !important; }

/* 36 Nordic Ice */
html body.ipa-sitedesign-site36 {
  background-color: #F8FBFD !important;
  background-image:
    linear-gradient(rgba(2,132,199,.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(2,132,199,.08) 1px, transparent 1px),
    radial-gradient(circle at 50% 0%, rgba(125,211,252,.18), transparent 42%) !important;
  background-size: 40px 40px, 40px 40px, auto !important;
}
html body.ipa-sitedesign-site36 .prompt-card { box-shadow: none !important; border: 1px solid #e2e8f0 !important; border-radius: 0 !important; }
html body.ipa-sitedesign-site36 .advanced-header { background: #fff !important; border-bottom: 1px solid #e2e8f0 !important; }
html body.ipa-sitedesign-site36 .ipa-layout-toggle button,
html body.ipa-sitedesign-site36 .ah-nav a i { border-radius: 0 !important; }

/* 37 Clay Press */
html body.ipa-sitedesign-site37 {
  background-color: #F5EDE6 !important;
  background-image:
    radial-gradient(rgba(194,65,12,.10) 0.9px, transparent 1px),
    radial-gradient(rgba(255,255,255,.6) 0.8px, transparent 1px) !important;
  background-size: 12px 12px, 18px 18px !important;
  background-position: 0 0, 6px 8px !important;
}
html body.ipa-sitedesign-site37 .prompt-card { border: none !important; }
html body.ipa-sitedesign-site37 .ipa-layout-toggle button,
html body.ipa-sitedesign-site37 .ah-nav a i { border-radius: 16px !important; box-shadow: 4px 4px 8px rgba(180,120,90,.16), -3px -3px 8px rgba(255,255,255,.9); }

/* 38 Sunset Mesh */
html body.ipa-sitedesign-site38 {
  background-color: #FFF7ED !important;
  background-image:
    radial-gradient(ellipse 70% 50% at 0% 0%, rgba(249,115,22,.20), transparent 50%),
    radial-gradient(ellipse 50% 40% at 100% 0%, rgba(251,113,133,.16), transparent 46%),
    radial-gradient(ellipse 40% 30% at 50% 100%, rgba(253,230,138,.22), transparent 48%) !important;
}
html body.ipa-sitedesign-site38 .ipa-layout-toggle { background: #fff; padding: 4px; border-radius: 999px; }
html body.ipa-sitedesign-site38 .ipa-layout-toggle button,
html body.ipa-sitedesign-site38 .ah-nav a i,
html body.ipa-sitedesign-site38 .popup-icon { border-radius: 999px !important; }
html body.ipa-sitedesign-site38 .prompt-card { border-radius: 14px !important; }

/* 39 Studio Dots */
html body.ipa-sitedesign-site39 {
  background-color: #F0FDFA !important;
  background-image: radial-gradient(rgba(15,118,110,.10) 1px, transparent 1.1px) !important;
  background-size: 16px 16px !important;
}
html body.ipa-sitedesign-site39 .prompt-card { border: 1px solid #d6d3d1 !important; }
html body.ipa-sitedesign-site39 .ipa-layout-toggle button,
html body.ipa-sitedesign-site39 .ah-nav a i { border-radius: 4px !important; }

/* 40 Prism Glow */
html body.ipa-sitedesign-site40 {
  background-color: #F0FDF4 !important;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='72' height='72'%3E%3Cpath fill='none' stroke='%2310B981' stroke-opacity='.16' d='M36 6l28 16v28L36 66 8 50V22z'/%3E%3Cpath fill='none' stroke='%23F472B6' stroke-opacity='.12' d='M36 6v60M8 22l28 16 28-16'/%3E%3C/svg%3E"),
    radial-gradient(circle at 80% 10%, rgba(34,211,238,.14), transparent 34%) !important;
  background-size: 72px 72px, auto !important;
}
html body.ipa-sitedesign-site40 .prompt-card { box-shadow: 0 0 0 2px rgba(16,185,129,.32), 0 12px 28px rgba(16,185,129,.10) !important; }
html body.ipa-sitedesign-site40 .ipa-layout-toggle button.active { box-shadow: 0 0 0 2px #10B981; }
html body.ipa-sitedesign-site40 .action-btn-full { box-shadow: 0 0 16px rgba(244,114,182,.32) !important; }
html body.ipa-sitedesign-site40 .ah-nav a i,
html body.ipa-sitedesign-site40 .popup-icon { border-radius: 999px !important; }

/* ============================================================
   SITES 41–60 — graph paper / 3D / map / music / craft
   ============================================================ */

/* 41 Notebook 3D */
html body.ipa-sitedesign-site41 {
  background-color: #F8FAFC !important;
  background-image:
    repeating-linear-gradient(#dbeafe, #dbeafe 1px, transparent 1px, transparent 28px),
    linear-gradient(90deg, #fecaca 0 2px, transparent 2px) !important;
  background-size: 100% 28px, 100% 100% !important;
  background-position: 0 12px, 36px 0 !important;
}
html body.ipa-sitedesign-site41 .prompt-card { transform: perspective(900px) rotateX(1deg); box-shadow: 0 12px 0 #dbeafe, 0 18px 28px rgba(30,64,175,.08) !important; }
html body.ipa-sitedesign-site41 .ipa-layout-toggle button,
html body.ipa-sitedesign-site41 .ah-nav a i { border-radius: 0 !important; }

/* 42 Garden Graph */
html body.ipa-sitedesign-site42 {
  background-color: #F0FDF4 !important;
  background-image:
    linear-gradient(rgba(21,128,61,.10) 1px, transparent 1px),
    linear-gradient(90deg, rgba(21,128,61,.10) 1px, transparent 1px),
    linear-gradient(rgba(21,128,61,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(21,128,61,.04) 1px, transparent 1px) !important;
  background-size: 80px 80px, 80px 80px, 16px 16px, 16px 16px !important;
}
html body.ipa-sitedesign-site42 .prompt-card { border-left: 4px solid var(--sd-p) !important; }
html body.ipa-sitedesign-site42 .ah-nav a i { border-radius: 8px !important; }

/* 43 Hatch Studio */
html body.ipa-sitedesign-site43 {
  background-color: #FAF5FF !important;
  background-image: repeating-linear-gradient(-45deg, transparent, transparent 7px, rgba(109,40,217,.07) 7px, rgba(109,40,217,.07) 8px) !important;
}
html body.ipa-sitedesign-site43 .prompt-card { border-radius: 0 !important; box-shadow: none !important; border: 1px solid #ddd6fe !important; }
html body.ipa-sitedesign-site43 .ah-nav a i,
html body.ipa-sitedesign-site43 .ipa-layout-toggle button i { border-radius: 0 !important; }

/* 44 Polka Cube */
html body.ipa-sitedesign-site44 {
  background-color: #FFF7ED !important;
  background-image:
    radial-gradient(#EA580C 1.2px, transparent 1.3px),
    linear-gradient(30deg, rgba(234,88,12,.06) 12%, transparent 12.5%, transparent 87%, rgba(234,88,12,.06) 87.5%) !important;
  background-size: 18px 18px, 48px 84px !important;
}
html body.ipa-sitedesign-site44 .ipa-layout-toggle button,
html body.ipa-sitedesign-site44 .ah-nav a i,
html body.ipa-sitedesign-site44 .popup-icon { border-radius: 999px !important; }
html body.ipa-sitedesign-site44 .prompt-card { border-radius: 20px !important; }

/* 45 Cross Grid */
html body.ipa-sitedesign-site45 {
  background-color: #F8FAFC !important;
  background-image:
    linear-gradient(#e2e8f0 1px, transparent 1px),
    linear-gradient(90deg, #e2e8f0 1px, transparent 1px),
    linear-gradient(#cbd5e1 1px, transparent 1px),
    linear-gradient(90deg, #cbd5e1 1px, transparent 1px) !important;
  background-size: 14px 14px, 14px 14px, 70px 70px, 70px 70px !important;
}
html body.ipa-sitedesign-site45 .ipa-layout-toggle button,
html body.ipa-sitedesign-site45 .ah-nav a i { border-radius: 0 !important; }
html body.ipa-sitedesign-site45 .prompt-card { border-radius: 6px !important; }

/* 46 Iso Dots 3D */
html body.ipa-sitedesign-site46 {
  background-color: #ECFEFF !important;
  background-image:
    radial-gradient(circle at 0 0, rgba(8,145,178,.22) 2px, transparent 2.4px),
    radial-gradient(circle at 50% 50%, rgba(34,211,238,.16) 1.6px, transparent 2px),
    linear-gradient(30deg, rgba(8,145,178,.06) 12%, transparent 12.5%, transparent 87%, rgba(8,145,178,.06) 87.5%) !important;
  background-size: 22px 22px, 22px 22px, 44px 76px !important;
  background-position: 0 0, 11px 11px, 0 0 !important;
}
html body.ipa-sitedesign-site46 .prompt-card { transform: perspective(800px) rotateX(1.2deg); }
html body.ipa-sitedesign-site46 .ah-nav a i { border-radius: 12px !important; }

/* 47 Wave Paper */
html body.ipa-sitedesign-site47 {
  background-color: #EEF2FF !important;
  background-image:
    repeating-linear-gradient(180deg, transparent, transparent 12px, rgba(79,70,229,.07) 12px, rgba(79,70,229,.07) 16px),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='40' viewBox='0 0 160 40'%3E%3Cpath fill='none' stroke='%234F46E5' stroke-opacity='.14' d='M0 22c20-16 30 16 50 0s30 16 50 0 30 16 60 0'/%3E%3C/svg%3E") !important;
  background-size: auto, 160px 40px !important;
}
html body.ipa-sitedesign-site47 .prompt-card { border-radius: 16px !important; }
html body.ipa-sitedesign-site47 .ah-nav a i { border-radius: 10px !important; }

/* 48 Chevron Field */
html body.ipa-sitedesign-site48 {
  background-color: #FEF2F2 !important;
  background-image: repeating-linear-gradient(135deg, #FEF2F2, #FEF2F2 10px, #FFE4E6 10px, #FFE4E6 20px) !important;
}
html body.ipa-sitedesign-site48 .ipa-layout-toggle button,
html body.ipa-sitedesign-site48 .ah-nav a i,
html body.ipa-sitedesign-site48 .popup-icon { border-radius: 999px !important; }
html body.ipa-sitedesign-site48 .prompt-card { border-top: 4px solid var(--sd-p) !important; }

/* 49 Plus Sheet */
html body.ipa-sitedesign-site49 {
  background-color: #F0FDFA !important;
  background-image:
    linear-gradient(#99F6E4 1px, transparent 1px),
    linear-gradient(90deg, #99F6E4 1px, transparent 1px),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24'%3E%3Cpath stroke='%230D9488' stroke-opacity='.18' d='M12 6v12M6 12h12'/%3E%3C/svg%3E") !important;
  background-size: 24px 24px, 24px 24px, 24px 24px !important;
}
html body.ipa-sitedesign-site49 .ah-nav a i { border-radius: 6px !important; }
html body.ipa-sitedesign-site49 .prompt-card { border-radius: 8px !important; }

/* 50 Brick Cream */
html body.ipa-sitedesign-site50 {
  background-color: #FFF7ED !important;
  background-image:
    linear-gradient(#FED7AA 1px, transparent 1px),
    linear-gradient(90deg, transparent 50%, rgba(154,52,18,.08) 50%) !important;
  background-size: 28px 16px, 48px 16px !important;
}
html body.ipa-sitedesign-site50 .prompt-card,
html body.ipa-sitedesign-site50 .blog-card { box-shadow: 5px 5px 0 rgba(154,52,18,.14) !important; border-radius: 2px !important; }
html body.ipa-sitedesign-site50 .ah-nav a i,
html body.ipa-sitedesign-site50 .ipa-layout-toggle button i { border-radius: 2px !important; }

/* 51 Honeycomb 3D */
html body.ipa-sitedesign-site51 {
  background-color: #FEFCE8 !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='56' viewBox='0 0 32 56'%3E%3Cpath fill='none' stroke='%23CA8A04' stroke-opacity='.20' stroke-width='1.1' d='M16 2l14 8v16L16 34 2 26V10zM16 34v20M2 26l14 8 14-8'/%3E%3C/svg%3E") !important;
  background-size: 32px 56px !important;
}
html body.ipa-sitedesign-site51 .prompt-card { transform: perspective(900px) rotateX(1.5deg); }
html body.ipa-sitedesign-site51 .prompt-card:hover { transform: perspective(900px) rotateX(0) translateY(-8px); }
html body.ipa-sitedesign-site51 .ah-nav a i { clip-path: polygon(25% 6%, 75% 6%, 100% 50%, 75% 94%, 25% 94%, 0 50%); border-radius: 0 !important; }

/* 52 Star Chart */
html body.ipa-sitedesign-site52 {
  background-color: #EEF2FF !important;
  background-image:
    radial-gradient(#4338CA 1.1px, transparent 1.3px),
    radial-gradient(#818CF8 1px, transparent 1.2px),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cg fill='none' stroke='%234338CA' stroke-opacity='.10'%3E%3Cpath d='M20 30L90 24L130 88L48 120z'/%3E%3C/g%3E%3C/svg%3E") !important;
  background-size: 22px 22px, 36px 36px, 160px 160px !important;
  background-position: 0 0, 12px 8px, 0 0 !important;
}
html body.ipa-sitedesign-site52 .ipa-layout-toggle button,
html body.ipa-sitedesign-site52 .ah-nav a i,
html body.ipa-sitedesign-site52 .popup-icon { border-radius: 999px !important; }

/* 53 Ripple Desk */
html body.ipa-sitedesign-site53 {
  background-color: #F0F9FF !important;
  background-image:
    repeating-radial-gradient(circle at 18% 8%, transparent 0 14px, rgba(2,132,199,.07) 14px 15px),
    repeating-radial-gradient(circle at 88% 92%, transparent 0 18px, rgba(56,189,248,.07) 18px 19px) !important;
}
html body.ipa-sitedesign-site53 .prompt-card { border-radius: 14px !important; }
html body.ipa-sitedesign-site53 .ah-nav a i { border-radius: 999px !important; box-shadow: 0 0 0 4px rgba(2,132,199,.08); }

/* 54 Rule Column */
html body.ipa-sitedesign-site54 {
  background-color: #FAFAF9 !important;
  background-image: repeating-linear-gradient(90deg, transparent, transparent 72px, rgba(68,64,60,.10) 72px, rgba(68,64,60,.10) 73px) !important;
}
html body.ipa-sitedesign-site54 .ipa-layout-toggle button,
html body.ipa-sitedesign-site54 .ah-nav a i { border-radius: 0 !important; }
html body.ipa-sitedesign-site54 .prompt-card { border-radius: 0 !important; box-shadow: none !important; border-bottom: 1px solid #e7e5e4 !important; }

/* 55 Confetti Page */
html body.ipa-sitedesign-site55 {
  background-color: #FFF7FB !important;
  background-image:
    radial-gradient(#DB2777 1.3px, transparent 1.5px),
    radial-gradient(#F59E0B 1.3px, transparent 1.5px),
    radial-gradient(#34D399 1.3px, transparent 1.5px) !important;
  background-size: 28px 28px, 36px 36px, 22px 22px !important;
  background-position: 0 0, 12px 8px, 20px 16px !important;
}
html body.ipa-sitedesign-site55 .ipa-layout-toggle button,
html body.ipa-sitedesign-site55 .ah-nav a i,
html body.ipa-sitedesign-site55 .popup-icon { border-radius: 999px !important; }
html body.ipa-sitedesign-site55 .prompt-card { border-radius: 22px !important; }

/* 56 Topo Map */
html body.ipa-sitedesign-site56 {
  background-color: #F7FEE7 !important;
  background-image:
    repeating-radial-gradient(circle at 42% 38%, transparent 0 16px, rgba(22,101,52,.09) 16px 17px),
    repeating-radial-gradient(circle at 70% 72%, transparent 0 22px, rgba(77,124,15,.07) 22px 23px) !important;
}
html body.ipa-sitedesign-site56 .prompt-card { border: 1px solid rgba(22,101,52,.16) !important; }
html body.ipa-sitedesign-site56 .ah-nav a i { border-radius: 8px !important; }

/* 57 Cyan Blueprint */
html body.ipa-sitedesign-site57 {
  background-color: #ECFEFF !important;
  background-image:
    linear-gradient(rgba(8,145,178,.14) 1px, transparent 1px),
    linear-gradient(90deg, rgba(8,145,178,.14) 1px, transparent 1px),
    linear-gradient(rgba(8,145,178,.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(8,145,178,.06) 1px, transparent 1px) !important;
  background-size: 48px 48px, 48px 48px, 8px 8px, 8px 8px !important;
}
html body.ipa-sitedesign-site57 .prompt-card { border: 1.5px dashed #155E75 !important; border-radius: 0 !important; }
html body.ipa-sitedesign-site57 .ipa-layout-toggle button,
html body.ipa-sitedesign-site57 .ah-nav a i { border-radius: 0 !important; }

/* 58 Kraft Speckle */
html body.ipa-sitedesign-site58 {
  background-color: #FEF3C7 !important;
  background-image:
    radial-gradient(rgba(146,64,14,.18) 0.9px, transparent 1.1px),
    radial-gradient(rgba(180,83,9,.10) 0.7px, transparent .9px) !important;
  background-size: 10px 10px, 16px 16px !important;
  background-position: 0 0, 5px 7px !important;
}
html body.ipa-sitedesign-site58 .prompt-card { background: #FFFBEB !important; }
html body.ipa-sitedesign-site58 .ah-nav a i { border-radius: 6px !important; }

/* 59 Argyle Light */
html body.ipa-sitedesign-site59 {
  background-color: #FFF1F2 !important;
  background-image:
    repeating-linear-gradient(45deg, transparent, transparent 12px, rgba(159,18,57,.07) 12px, rgba(159,18,57,.07) 24px),
    repeating-linear-gradient(-45deg, transparent, transparent 12px, rgba(190,24,93,.06) 12px, rgba(190,24,93,.06) 24px) !important;
}
html body.ipa-sitedesign-site59 .prompt-card { border: 1px solid rgba(159,18,57,.14) !important; }
html body.ipa-sitedesign-site59 .ah-nav a i { border-radius: 4px !important; transform: rotate(45deg); }
html body.ipa-sitedesign-site59 .ah-nav a i::before { transform: rotate(-45deg); display: inline-block; }

/* 60 Staff Graph 3D */
html body.ipa-sitedesign-site60 {
  background-color: #F9FAFB !important;
  background-image:
    repeating-linear-gradient(#C7D2FE, #C7D2FE 1px, transparent 1px, transparent 8px),
    linear-gradient(30deg, rgba(79,70,229,.07) 12%, transparent 12.5%, transparent 87%, rgba(79,70,229,.07) 87.5%),
    linear-gradient(150deg, rgba(17,24,39,.05) 12%, transparent 12.5%, transparent 87%, rgba(17,24,39,.05) 87.5%) !important;
  background-size: 100% 40px, 52px 90px, 52px 90px !important;
}
html body.ipa-sitedesign-site60 .prompt-card { transform: perspective(900px) rotateX(1.2deg); border-top: 3px solid var(--sd-p) !important; }
html body.ipa-sitedesign-site60 .prompt-card:hover { transform: perspective(900px) rotateX(0) translateY(-8px); }
html body.ipa-sitedesign-site60 .ah-nav a i,
html body.ipa-sitedesign-site60 .popup-icon { border-radius: 10px !important; }
html body.ipa-sitedesign-site60 .card-title { letter-spacing: -.03em; }

/* ---------- 5-button row + per-category card chrome (wins last) ---------- */
html body.ipa-sitedesign.ipa-act-row-inline .card-footer {
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
  padding: 8px 10px 10px !important;
}
html body.ipa-sitedesign.ipa-act-row-inline .action-row-top {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
  gap: 4px !important;
  width: 100% !important;
}
html body.ipa-sitedesign.ipa-act-row-inline .action-row-top > * {
  flex: 1 1 0 !important;
  min-width: 0 !important;
  width: auto !important;
}
html body.ipa-sitedesign.ipa-act-row-inline .action-row-top .ipa-act-copy {
  flex: 1 1 0 !important;
  width: auto !important;
}
html body.ipa-sitedesign.ipa-chrome-small .card-overlay-btn {
  width: var(--ipa-ovl-h, 22px) !important;
  height: var(--ipa-ovl-h, 22px) !important;
  min-width: var(--ipa-ovl-h, 22px) !important;
  font-size: var(--ipa-ovl-fs, 9px) !important;
}
html body.ipa-sitedesign.ipa-chrome-small .card-image-wrapper .model-tag,
html body.ipa-sitedesign.ipa-chrome-small .card-badges .model-tag {
  font-size: var(--ipa-tag-fs, 8px) !important;
  padding: 3px 7px !important;
}

/* Cards + Copy follow the 60 site themes. Category color is TAG-only. */
html body.ipa-sitedesign .prompt-card .card-body,
html body.ipa-sitedesign .prompt-card .card-footer {
  background: transparent !important;
}
html body.ipa-sitedesign .ipa-act-copy,
html body.ipa-sitedesign .action-btn-full,
html body.ipa-sitedesign .card-overlay-btn.ipa-act-copy {
  background: var(--sd-grad) !important;
  color: #fff !important;
  border: none !important;
  border-radius: var(--sd-br, 10px) !important;
  box-shadow: var(--sd-sh) !important;
}
html body.ipa-sitedesign .ipa-act-copy i,
html body.ipa-sitedesign .ipa-act-copy .action-label,
html body.ipa-sitedesign .ipa-act-copy span {
  color: #fff !important;
}
html body.ipa-sitedesign .action-btn-sm:not(.ipa-act-copy) {
  color: var(--sd-p) !important;
  border-color: color-mix(in srgb, var(--sd-p) 28%, transparent) !important;
  background: var(--sd-card, #fff) !important;
}
html body.ipa-sitedesign .action-btn-sm:not(.ipa-act-copy) i,
html body.ipa-sitedesign .action-btn-sm:not(.ipa-act-copy) .action-label {
  color: var(--sd-p) !important;
}
html body.ipa-sitedesign .prompt-card.ipa-cat-card .model-tag--meta,
html body.ipa-sitedesign .prompt-card.ipa-cat-card .card-meta .model-tag {
  color: var(--cat-c, var(--sd-p)) !important;
  background: color-mix(in srgb, var(--cat-c, var(--sd-p)) 12%, #fff) !important;
  border-color: color-mix(in srgb, var(--cat-c, var(--sd-p)) 28%, transparent) !important;
}
html body.ipa-sitedesign .prompt-card.ipa-cat-card .card-image-wrapper .model-tag,
html body.ipa-sitedesign .prompt-card.ipa-cat-card .card-badges .model-tag {
  background: color-mix(in srgb, var(--cat-c, var(--sd-p)) 68%, transparent) !important;
  border-color: color-mix(in srgb, var(--cat-c, var(--sd-p)) 75%, #fff) !important;
  color: #fff !important;
}

/* ============================================================
   NOVA HERO PANEL — themed for all 60 light site designs
   ============================================================ */
html body.ipa-sitedesign .hero,
html body.ipa-sitedesign .ipa-hero,
html body.ipa-sitedesign .nova-hero,
html body.ipa-sitedesign .cosmic-hero {
  background: transparent !important;
  box-shadow: none !important;
  border: none !important;
}
html body.ipa-sitedesign .nova-hero-panel {
  position: relative !important;
  overflow: hidden !important;
  max-width: 920px !important;
  margin: 0 auto !important;
  padding: 36px 28px 32px !important;
  background:
    linear-gradient(155deg,
      color-mix(in srgb, var(--sd-p) 12%, #fff) 0%,
      color-mix(in srgb, var(--sd-s) 8%, #fff) 46%,
      var(--sd-card, #fff) 100%) !important;
  border: 1px solid color-mix(in srgb, var(--sd-p) 18%, transparent) !important;
  border-radius: calc(var(--sd-r, 22px) + 12px) !important;
  box-shadow: var(--sd-sh, 0 18px 40px rgba(15,23,42,.08)), inset 0 1px 0 rgba(255,255,255,.95) !important;
  backdrop-filter: blur(18px) saturate(160%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(160%) !important;
}
html body.ipa-sitedesign .nova-hero-panel::before {
  content: "" !important;
  position: absolute !important;
  inset: -30% !important;
  pointer-events: none !important;
  z-index: 0 !important;
  background:
    radial-gradient(circle at 16% 10%, color-mix(in srgb, var(--sd-p) 24%, transparent), transparent 42%),
    radial-gradient(circle at 90% 82%, color-mix(in srgb, var(--sd-s) 20%, transparent), transparent 46%) !important;
  opacity: .9 !important;
  animation: none !important;
  filter: none !important;
  transform: none !important;
}
html body.ipa-sitedesign .nova-hero-panel > * { position: relative; z-index: 1; }
html body.ipa-sitedesign .hero-title {
  color: var(--sd-head) !important;
  font-family: var(--sd-font-head) !important;
  background: none !important;
  -webkit-text-fill-color: unset !important;
}
html body.ipa-sitedesign .neu-accent-text,
html body.ipa-sitedesign .hero-title .neu-accent-text {
  background: var(--sd-grad) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;
}
html body.ipa-sitedesign .hero-subtitle { color: var(--sd-mute) !important; }
html body.ipa-sitedesign .premium-pill {
  background: color-mix(in srgb, var(--sd-card) 88%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--sd-p) 20%, transparent) !important;
  box-shadow: var(--sd-sh) !important;
  border-radius: 999px !important;
  color: var(--sd-ink) !important;
}
html body.ipa-sitedesign .pp-icon {
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  min-height: 34px !important;
  aspect-ratio: 1 / 1 !important;
  background: var(--sd-grad) !important;
  color: #fff !important;
  border-radius: 50% !important;
  box-shadow: 0 8px 18px color-mix(in srgb, var(--sd-p) 28%, transparent) !important;
  flex: 0 0 34px !important;
  overflow: hidden !important;
}
html body.ipa-sitedesign .pp-icon i { color: #fff !important; -webkit-text-fill-color: #fff !important; }
html body.ipa-sitedesign .pp-count {
  background: var(--sd-grad) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}
html body.ipa-sitedesign .btn-hero-primary {
  background: var(--sd-grad) !important;
  color: #fff !important;
  border: none !important;
  border-radius: var(--sd-br, 999px) !important;
  box-shadow: var(--sd-sh) !important;
}
html body.ipa-sitedesign .btn-hero-secondary {
  background: var(--sd-card, #fff) !important;
  color: var(--sd-p) !important;
  border: 1px solid color-mix(in srgb, var(--sd-p) 28%, transparent) !important;
  border-radius: var(--sd-br, 999px) !important;
  box-shadow: none !important;
}
html body.ipa-sitedesign .search-wrapper form,
html body.ipa-sitedesign #searchForm {
  background: var(--sd-card, #fff) !important;
  border: 1px solid color-mix(in srgb, var(--sd-p) 30%, transparent) !important;
  border-radius: 999px !important;
  box-shadow: 0 10px 28px color-mix(in srgb, var(--sd-p) 14%, transparent) !important;
  animation: none !important;
}
html body.ipa-sitedesign .search-btn {
  background: var(--sd-grad) !important;
  color: #fff !important;
  border-radius: 50% !important;
  box-shadow: 0 8px 16px color-mix(in srgb, var(--sd-p) 30%, transparent) !important;
}
html body.ipa-sitedesign .search-btn i { color: #fff !important; }
html body.ipa-sitedesign .neu-utility-nav a {
  background: var(--sd-card, #fff) !important;
  border: 1px solid color-mix(in srgb, var(--sd-p) 16%, transparent) !important;
  color: var(--sd-mute) !important;
  border-radius: 999px !important;
}
html body.ipa-sitedesign .neu-utility-nav a:hover {
  border-color: var(--sd-p) !important;
  color: var(--sd-p) !important;
  box-shadow: 0 6px 16px color-mix(in srgb, var(--sd-p) 12%, transparent) !important;
}

/* Unique hero shapes / patterns per site */
html body.ipa-sitedesign-site01 .nova-hero-panel { border-radius: 36px !important; }
html body.ipa-sitedesign-site01 .nova-hero-panel::before {
  background:
    radial-gradient(circle at 12% 8%, color-mix(in srgb, var(--sd-p) 28%, transparent), transparent 40%),
    linear-gradient(30deg, color-mix(in srgb, var(--sd-s) 10%, transparent) 12%, transparent 12.5%) !important;
}
html body.ipa-sitedesign-site02 .nova-hero-panel {
  border-radius: 10px !important;
  background-image:
    linear-gradient(color-mix(in srgb, var(--sd-p) 8%, transparent) 1px, transparent 1px),
    linear-gradient(90deg, color-mix(in srgb, var(--sd-p) 8%, transparent) 1px, transparent 1px),
    linear-gradient(160deg, color-mix(in srgb, var(--sd-p) 10%, #fff), var(--sd-card)) !important;
  background-size: 22px 22px, 22px 22px, auto !important;
}
html body.ipa-sitedesign-site03 .nova-hero-panel {
  border-radius: 16px !important;
  box-shadow: 10px 14px 0 color-mix(in srgb, var(--sd-p) 16%, transparent) !important;
  transform: perspective(900px) rotateX(1.2deg);
}
html body.ipa-sitedesign-site04 .nova-hero-panel { border-radius: 999px 28px 999px 28px !important; }
html body.ipa-sitedesign-site05 .nova-hero-panel { border-radius: 40px !important; backdrop-filter: blur(22px) !important; }
html body.ipa-sitedesign-site06 .nova-hero-panel {
  border-radius: 8px !important;
  box-shadow: 8px 8px 0 color-mix(in srgb, var(--sd-p) 18%, transparent) !important;
}
html body.ipa-sitedesign-site07 .nova-hero-panel::before {
  background: repeating-radial-gradient(circle at 50% -10%, transparent 0 22px, color-mix(in srgb, var(--sd-p) 10%, transparent) 22px 23px) !important;
}
html body.ipa-sitedesign-site08 .nova-hero-panel { border-radius: 22px !important; outline: 1px solid color-mix(in srgb, var(--sd-p) 16%, transparent); outline-offset: -8px; }
html body.ipa-sitedesign-site09 .nova-hero-panel { border-left: 6px solid var(--sd-p) !important; border-radius: 12px !important; }
html body.ipa-sitedesign-site10 .nova-hero-panel { border-radius: 32px !important; box-shadow: 0 24px 50px color-mix(in srgb, var(--sd-p) 16%, transparent) !important; }
html body.ipa-sitedesign-site11 .nova-hero-panel::before {
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='70' viewBox='0 0 40 70'%3E%3Cpath fill='none' stroke='%23CA8A04' stroke-opacity='.14' d='M20 2l16 10v20L20 42 4 32V12z'/%3E%3C/svg%3E") !important;
  background-size: 40px 70px !important;
  opacity: .7 !important;
}
html body.ipa-sitedesign-site12 .nova-hero-panel { box-shadow: inset 0 0 0 4px #fff, 0 0 0 1px color-mix(in srgb, var(--sd-p) 28%, transparent) !important; }
html body.ipa-sitedesign-site13 .nova-hero-panel { background: linear-gradient(90deg, #fffef8, color-mix(in srgb, var(--sd-a) 35%, #fff)) !important; }
html body.ipa-sitedesign-site14 .nova-hero-panel { border-radius: 0 !important; border: 1px solid color-mix(in srgb, var(--sd-p) 22%, transparent) !important; }
html body.ipa-sitedesign-site14 .hero-title { letter-spacing: .04em; }
html body.ipa-sitedesign-site15 .nova-hero-panel { border-bottom: 6px solid var(--sd-p) !important; border-radius: 18px !important; }
html body.ipa-sitedesign-site16 .nova-hero-panel { border-radius: 28px !important; }
html body.ipa-sitedesign-site17 .nova-hero-panel { border-radius: 0 !important; }
html body.ipa-sitedesign-site17 .hero-title { letter-spacing: .12em; text-transform: uppercase; font-size: clamp(1.4rem, 3.4vw, 2.4rem) !important; }
html body.ipa-sitedesign-site18 .nova-hero-panel { border: 1.5px dashed color-mix(in srgb, var(--sd-p) 35%, transparent) !important; }
html body.ipa-sitedesign-site19 .nova-hero-panel { border-radius: 20px !important; }
html body.ipa-sitedesign-site20 .nova-hero-panel { border-radius: 40px !important; }
html body.ipa-sitedesign-site21 .nova-hero-panel { border-radius: 0 !important; border-top: 8px solid var(--sd-p) !important; }
html body.ipa-sitedesign-site21 .hero-title { text-transform: uppercase; letter-spacing: .04em; }
html body.ipa-sitedesign-site22 .nova-hero-panel::before {
  background: repeating-linear-gradient(-18deg, transparent, transparent 11px, color-mix(in srgb, var(--sd-p) 8%, transparent) 11px, color-mix(in srgb, var(--sd-p) 8%, transparent) 12px) !important;
}
html body.ipa-sitedesign-site23 .nova-hero-panel { border-radius: 8px !important; box-shadow: 6px 6px 0 var(--sd-p) !important; }
html body.ipa-sitedesign-site24 .nova-hero-panel { border-radius: 28px !important; }
html body.ipa-sitedesign-site25 .nova-hero-panel { border-radius: 6px !important; border: 1px dashed var(--sd-p) !important; }
html body.ipa-sitedesign-site25 .hero-title { text-transform: uppercase; letter-spacing: .08em; }
html body.ipa-sitedesign-site26 .nova-hero-panel { border-radius: 2px !important; padding: 28px 22px 40px !important; transform: rotate(-0.3deg); }
html body.ipa-sitedesign-site27 .nova-hero-panel { border-top: 6px solid var(--sd-p) !important; }
html body.ipa-sitedesign-site28 .nova-hero-panel { border-radius: 0 !important; border-bottom: 1px solid var(--sd-s) !important; }
html body.ipa-sitedesign-site29 .nova-hero-panel { border-radius: 0 !important; border: 1.5px dashed var(--sd-p) !important; }
html body.ipa-sitedesign-site29 .hero-title { font-family: "Roboto Mono", monospace !important; }
html body.ipa-sitedesign-site30 .nova-hero-panel { border-radius: 22px !important; }
html body.ipa-sitedesign-site31 .nova-hero-panel { border-radius: 26px !important; }
html body.ipa-sitedesign-site32 .nova-hero-panel { border-radius: 18px !important; }
html body.ipa-sitedesign-site33 .nova-hero-panel { border-radius: 32px !important; transform: perspective(800px) rotateX(1.6deg); }
html body.ipa-sitedesign-site34 .nova-hero-panel { border-radius: 4px !important; }
html body.ipa-sitedesign-site35 .nova-hero-panel { border-radius: 12px !important; }
html body.ipa-sitedesign-site36 .nova-hero-panel { border-radius: 0 !important; background: #fff !important; border: 1px solid #e2e8f0 !important; }
html body.ipa-sitedesign-site37 .nova-hero-panel {
  border-radius: 22px !important;
  box-shadow: 8px 8px 16px color-mix(in srgb, var(--sd-p) 14%, transparent), -6px -6px 14px #fff !important;
}
html body.ipa-sitedesign-site38 .nova-hero-panel { border-radius: 18px !important; }
html body.ipa-sitedesign-site39 .nova-hero-panel { border-radius: 10px !important; }
html body.ipa-sitedesign-site40 .nova-hero-panel { box-shadow: 0 0 0 2px color-mix(in srgb, var(--sd-p) 35%, transparent), var(--sd-sh) !important; border-radius: 28px !important; }
html body.ipa-sitedesign-site41 .nova-hero-panel {
  border-radius: 6px !important;
  background-image: repeating-linear-gradient(transparent, transparent 27px, color-mix(in srgb, var(--sd-p) 12%, transparent) 28px), linear-gradient(160deg, color-mix(in srgb, var(--sd-p) 8%, #fff), #fff) !important;
}
html body.ipa-sitedesign-site42 .nova-hero-panel {
  border-radius: 12px !important;
  background-image: linear-gradient(color-mix(in srgb, var(--sd-p) 9%, transparent) 1px, transparent 1px), linear-gradient(90deg, color-mix(in srgb, var(--sd-p) 9%, transparent) 1px, transparent 1px), linear-gradient(160deg, color-mix(in srgb, var(--sd-p) 8%, #fff), #fff) !important;
  background-size: 20px 20px, 20px 20px, auto !important;
}
html body.ipa-sitedesign-site43 .nova-hero-panel { border-radius: 0 !important; }
html body.ipa-sitedesign-site44 .nova-hero-panel { border-radius: 24px !important; }
html body.ipa-sitedesign-site45 .nova-hero-panel { border-radius: 8px !important; }
html body.ipa-sitedesign-site46 .nova-hero-panel { border-radius: 14px !important; transform: perspective(800px) rotateX(1deg); }
html body.ipa-sitedesign-site47 .nova-hero-panel { border-radius: 18px !important; }
html body.ipa-sitedesign-site48 .nova-hero-panel { border-radius: 12px !important; border-top: 5px solid var(--sd-p) !important; }
html body.ipa-sitedesign-site49 .nova-hero-panel { border-radius: 10px !important; }
html body.ipa-sitedesign-site50 .nova-hero-panel { border-radius: 4px !important; box-shadow: 5px 5px 0 color-mix(in srgb, var(--sd-p) 16%, transparent) !important; }
html body.ipa-sitedesign-site51 .nova-hero-panel { border-radius: 16px !important; transform: perspective(900px) rotateX(1.4deg); }
html body.ipa-sitedesign-site52 .nova-hero-panel { border-radius: 22px !important; }
html body.ipa-sitedesign-site53 .nova-hero-panel { border-radius: 16px !important; }
html body.ipa-sitedesign-site53 .nova-hero-panel::before {
  background: repeating-radial-gradient(circle at 20% 10%, transparent 0 16px, color-mix(in srgb, var(--sd-p) 10%, transparent) 16px 17px) !important;
}
html body.ipa-sitedesign-site54 .nova-hero-panel { border-radius: 0 !important; }
html body.ipa-sitedesign-site55 .nova-hero-panel { border-radius: 26px !important; }
html body.ipa-sitedesign-site56 .nova-hero-panel { border-radius: 12px !important; }
html body.ipa-sitedesign-site57 .nova-hero-panel { border-radius: 0 !important; border: 1.5px dashed var(--sd-p) !important; }
html body.ipa-sitedesign-site58 .nova-hero-panel { border-radius: 10px !important; }
html body.ipa-sitedesign-site59 .nova-hero-panel { border-radius: 8px !important; }
html body.ipa-sitedesign-site60 .nova-hero-panel {
  border-radius: 18px !important;
  border-top: 3px solid var(--sd-p) !important;
  transform: perspective(900px) rotateX(1deg);
}

@media (max-width: 767px) {
  html body.ipa-sitedesign .nova-hero-panel {
    padding: 24px 16px 22px !important;
    margin: 0 8px !important;
    border-radius: calc(var(--sd-r, 18px) + 6px) !important;
  }
  html body.ipa-sitedesign-site04 .nova-hero-panel,
  html body.ipa-sitedesign-site26 .nova-hero-panel,
  html body.ipa-sitedesign-site03 .nova-hero-panel,
  html body.ipa-sitedesign-site33 .nova-hero-panel,
  html body.ipa-sitedesign-site46 .nova-hero-panel,
  html body.ipa-sitedesign-site51 .nova-hero-panel,
  html body.ipa-sitedesign-site60 .nova-hero-panel { transform: none !important; }
}
