@media(min-width:1024px){#page-board>.grid:first-child{align-items:stretch}.hero-copy{display:flex;flex-direction:column}.hero-copy>.grid{margin-top:auto;padding-top:24px}}
#gallery-cards-grid>button>div:first-child,#catalog-grid .catalog-art{border-bottom:1px solid #e2b47833!important;display:flex;align-items:center;justify-content:center;background:#19161e!important}
#gallery-cards-grid>button>div:first-child>img,#catalog-grid .catalog-art>img{height:100%;width:100%;object-fit:contain!important;object-position:center!important}
.media-lock{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background:#211b25cc;color:#d9acbe;font:600 11px/1.4 Inter,system-ui;pointer-events:none}
.media-lock-icon{width:44px;height:44px;flex:none;border:1px solid #b786a266;border-radius:50%;display:grid;place-items:center;background:#38273455}.media-lock svg{width:19px;height:19px}
.sample-thumb.is-blurred:after{display:none!important}.sample-thumb.is-blurred img,.catalog-blurred img,#gallery-cards-grid img.blur-2xl{filter:blur(18px)!important;transform:scale(1.08)!important}
.catalog-art>.catalog-status{position:absolute;right:10px;top:10px;z-index:4;background:#141119ed;padding:5px 9px}
.catalog-art>.media-adult-badge,.catalog-art>.catalog-demo-badge{top:10px!important;height:25px!important;padding:4px 7px!important;font:500 10px/15px Inter,system-ui!important;box-sizing:border-box!important;border-radius:4px!important}
.catalog-art>.media-adult-badge{left:10px!important}.catalog-art>.catalog-demo-badge{left:10px!important}.catalog-art:has(>.media-adult-badge)>.catalog-demo-badge{left:53px!important}
#catalog-pagination{justify-content:center;flex-wrap:wrap;gap:7px}#catalog-pagination small{flex-basis:100%;text-align:center;padding-top:8px}#catalog-pagination button{min-width:36px;min-height:36px}#catalog-pagination [aria-current=page]{background:#e2b478;color:#151019;opacity:1}
#page-pricing select{appearance:none;padding-right:34px!important;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='m2 4 4 4 4-4' fill='none' stroke='%23e2b478' stroke-width='1.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 13px center}
#page-pricing .quote-toggle-mark,#page-pricing .quote-stepper button{display:inline-grid!important;place-items:center!important;line-height:1!important;padding:0!important}
.reservation-info .readable-rules{font-size:14px;line-height:1.65;color:#d3c8bc;display:grid;gap:10px;margin-top:16px;max-width:65ch}.readable-rules strong{color:#f2ece4}.reservation-info p:empty{display:none}
#contacts-intake{cursor:pointer}#contacts-intake:focus-visible{outline:2px solid #e2b478}
#page-pricing .addon-pill:after,#page-pricing .quote-existing-label:after,#page-pricing .quote-package:after{align-self:center;display:grid!important;place-items:center!important;font:16px/1 Arial,sans-serif!important;padding:0!important;box-sizing:border-box}

#page-board .hero-copy>.grid{margin-top:auto}

/* Shared palette and compact rectangular badges. */
:root{
  --status-green:#48c87b;
  --status-green-border:rgba(72, 200, 123, 0.45);
  --status-green-bg:rgba(72, 200, 123, 0.08);
  --status-gold:#e2b478;
  --status-pink:#d9acbe;
  --theme-bg:#0B0A0E;
  --theme-card:#121118;
  --theme-card-hover:#16151E;
  --theme-art-mat:#18151f;
  --theme-border:rgba(226, 180, 120, 0.12);
}

body {
  background-color: var(--theme-bg) !important;
}

header.sticky {
  background-color: rgba(11, 10, 14, 0.92) !important;
}

.card {
  background: var(--theme-card) !important;
  border: 1px solid var(--theme-border) !important;
  transition: transform 0.22s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.22s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.22s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.card-interactive:hover,
.catalog-card:hover {
  border-color: rgba(226, 180, 120, 0.45) !important;
  transform: translateY(-3px) !important;
  box-shadow: 0 10px 24px -4px rgba(0, 0, 0, 0.6), 0 0 16px -2px rgba(226, 180, 120, 0.12) !important;
}

.card-interactive:active,
.catalog-card:active {
  transform: scale(0.98) !important;
}

.catalog-card {
  background: var(--theme-card) !important;
  border: 1px solid var(--theme-border) !important;
  transition: transform 0.22s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.22s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.22s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

/* Card image frames: crisp 1px border so dark artworks never blend into the card or page */
#gallery-cards-grid > button > div:first-child,
.catalog-art,
.sample-thumb {
  background: var(--theme-art-mat) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  box-shadow: inset 0 0 16px rgba(0, 0, 0, 0.45) !important;
}

/* Soft ambient vignette on catalog art so bright white sketch canvases don't blind or clash */
.catalog-art {
  position: relative;
  overflow: hidden;
}
.catalog-art::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(circle at center, rgba(13, 11, 20, 0) 58%, rgba(13, 11, 20, 0.38) 100%);
  box-shadow: inset 0 0 14px 2px rgba(13, 11, 20, 0.45);
  transition: opacity 0.3s ease;
  z-index: 1;
}
.catalog-card:hover .catalog-art::after {
  opacity: 0.15;
}

/* Light/white sketch YCHs gently toned until hover */
.catalog-card[data-type="ych"] .catalog-art img,
.catalog-card.type-ych .catalog-art img {
  filter: brightness(0.94) contrast(1.02);
  transition: filter 0.3s ease;
}
.catalog-card[data-type="ych"]:hover .catalog-art img,
.catalog-card.type-ych:hover .catalog-art img {
  filter: brightness(1) contrast(1);
}

/* --- PERFORMANCE & FLUID TOUCH OPTIMIZATIONS --- */
button, a, select, input, [role="button"], [role="switch"] {
  touch-action: manipulation;
}

.mobile-bottom-nav,
.mobile-quote-bar,
header.sticky {
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

/* content-visibility only for catalog — gallery cards have cascade animation that needs rendering */
#catalog-grid > div {
  content-visibility: auto;
  contain-intrinsic-size: 0 350px;
}

/* Stop shimmer once image loads */
#gallery-cards-grid > button > div:first-child.shimmer-done,
#catalog-grid .catalog-art.shimmer-done,
.sample-thumb.shimmer-done {
  animation: none !important;
  background: #19161e !important;
  background-image: none !important;
}

/* Skeleton shimmer animation for media and artwork placeholders */
@keyframes cardShimmer {
  0% { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}

#gallery-cards-grid > button > div:first-child,
#catalog-grid .catalog-art,
.sample-thumb {
  background: linear-gradient(90deg, #16121b 0%, #241c2c 50%, #16121b 100%) !important;
  background-size: 200% 100% !important;
  animation: cardShimmer 2.6s infinite ease-in-out;
}

/* --- INTERACTIVE DESIGN ANIMATIONS & MICRO-INTERACTIONS --- */

/* 1. Page reveal transition */
@keyframes pageReveal {
  from {
    opacity: 0;
    transform: translateY(12px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.page-section:not(.hidden) {
  animation: pageReveal 0.35s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

/* 2. Staggered card cascade entrance for gallery & catalog */
@keyframes cardCascade {
  from {
    opacity: 0;
    transform: translateY(16px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

#gallery-cards-grid > button,
#catalog-grid > div {
  animation: cardCascade 0.4s cubic-bezier(0.16, 1, 0.3, 1) backwards;
}

#gallery-cards-grid > button:nth-child(1), #catalog-grid > div:nth-child(1) { animation-delay: 0.02s; }
#gallery-cards-grid > button:nth-child(2), #catalog-grid > div:nth-child(2) { animation-delay: 0.05s; }
#gallery-cards-grid > button:nth-child(3), #catalog-grid > div:nth-child(3) { animation-delay: 0.08s; }
#gallery-cards-grid > button:nth-child(4), #catalog-grid > div:nth-child(4) { animation-delay: 0.11s; }
#gallery-cards-grid > button:nth-child(5), #catalog-grid > div:nth-child(5) { animation-delay: 0.14s; }
#gallery-cards-grid > button:nth-child(6), #catalog-grid > div:nth-child(6) { animation-delay: 0.17s; }
#gallery-cards-grid > button:nth-child(7), #catalog-grid > div:nth-child(7) { animation-delay: 0.20s; }
#gallery-cards-grid > button:nth-child(8), #catalog-grid > div:nth-child(8) { animation-delay: 0.23s; }
#gallery-cards-grid > button:nth-child(9), #catalog-grid > div:nth-child(9) { animation-delay: 0.26s; }
#gallery-cards-grid > button:nth-child(10), #catalog-grid > div:nth-child(10) { animation-delay: 0.29s; }
#gallery-cards-grid > button:nth-child(11), #catalog-grid > div:nth-child(11) { animation-delay: 0.32s; }
#gallery-cards-grid > button:nth-child(12), #catalog-grid > div:nth-child(12) { animation-delay: 0.35s; }

/* 3. Interactive card hover elevation & golden aura */
.card-interactive {
  transition: transform 0.25s cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow 0.25s ease, border-color 0.25s ease !important;
}

@media (hover: hover) and (pointer: fine) {
  .card-interactive:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 28px -6px rgba(0, 0, 0, 0.75), 0 0 16px -2px rgba(226, 180, 120, 0.2) !important;
    border-color: rgba(226, 180, 120, 0.45) !important;
  }
}

/* 4. Primary CTA button shimmer shine */
@keyframes ctaShimmer {
  0% { transform: translateX(-150%) skewX(-20deg); }
  25%, 100% { transform: translateX(250%) skewX(-20deg); }
}

#calc-copy-btn {
  position: relative;
  overflow: hidden;
  transition: transform 0.2s cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow 0.25s ease, background-color 0.2s ease !important;
}

#calc-copy-btn::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 60%;
  height: 100%;
  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(255, 255, 255, 0.28) 50%,
    transparent 100%
  );
  transform: translateX(-150%) skewX(-20deg);
  animation: ctaShimmer 5s infinite ease-in-out;
  pointer-events: none;
}

#calc-copy-btn:hover {
  box-shadow: 0 4px 22px rgba(226, 180, 120, 0.45) !important;
  transform: translateY(-1px);
}

#calc-copy-btn:active {
  transform: scale(0.97) !important;
}

/* 5. Stepper buttons elastic pop */
.quote-stepper button {
  transition: transform 0.15s cubic-bezier(0.34, 1.56, 0.64, 1), background-color 0.15s ease !important;
}
.quote-stepper button:active {
  transform: scale(0.88) !important;
}

/* 6. Package Selection Glow */
@keyframes selectPulse {
  0% { box-shadow: 0 0 0 0 rgba(226, 180, 120, 0.5); }
  50% { box-shadow: 0 0 18px 2px rgba(226, 180, 120, 0.35); }
  100% { box-shadow: 0 0 10px 1px rgba(226, 180, 120, 0.2); }
}

.quote-selected {
  animation: selectPulse 0.45s ease-out forwards;
}

/* 7. Status badge live radar pulse */
@keyframes radarPulse {
  0% { box-shadow: 0 0 0 0 rgba(97, 223, 149, 0.7); }
  70% { box-shadow: 0 0 0 7px rgba(97, 223, 149, 0); }
  100% { box-shadow: 0 0 0 0 rgba(97, 223, 149, 0); }
}

header a[title*="availability"],
header a[title*="Availability"],
header a[title*="queue"] {
  background: rgba(226, 180, 120, 0.05) !important;
  border: 1px solid rgba(226, 180, 120, 0.28) !important;
  box-shadow: none !important;
  padding: 4px 10px !important;
  border-radius: 4px !important;
  transition: all 0.2s ease !important;
}
header a[title*="availability"]:hover,
header a[title*="Availability"]:hover,
header a[title*="queue"]:hover {
  background: rgba(226, 180, 120, 0.12) !important;
  border-color: rgba(226, 180, 120, 0.5) !important;
  transform: none !important;
}

#header-status-badge {
  color: #48c87b !important;
  font-weight: 500 !important;
  letter-spacing: 0.05em !important;
  text-shadow: none !important;
}

header a[title*="queue"] .rounded-full.bg-accent,
header a[title*="availability"] .rounded-full.bg-accent,
header a[title*="Availability"] .rounded-full.bg-accent {
  background-color: #48c87b !important;
  box-shadow: 0 0 6px #48c87b !important;
}

/* Intermediate states for queue counter */
#header-queue-counter[data-state="loading"],
#header-queue-counter:empty {
  opacity: 0.75;
  letter-spacing: 0.06em;
  animation: queuePulse 1.8s infinite ease-in-out;
}
@keyframes queuePulse {
  0%, 100% { opacity: 0.5; }
  50% { opacity: 0.95; }
}

#header-queue-counter[data-state="error"] {
  color: #ffd166 !important;
  font-weight: 600;
}

/* Enhanced Pricing Tabs Active State */
.ptab-btn {
  border-radius: 8px !important;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
  font-weight: 600 !important;
  letter-spacing: 0.06em !important;
}
.ptab-btn[aria-selected="true"] {
  background: linear-gradient(135deg, #e2b478 0%, #ffd9a0 100%) !important;
  color: #0d0b14 !important;
  font-weight: 700 !important;
  border-color: #ffd9a0 !important;
  box-shadow: 0 4px 20px -2px rgba(226, 180, 120, 0.45), 0 0 12px rgba(226, 180, 120, 0.3) !important;
  transform: translateY(-1px);
}
.ptab-btn[aria-selected="false"]:hover {
  background: rgba(226, 180, 120, 0.1) !important;
  border-color: rgba(226, 180, 120, 0.38) !important;
  color: #f2ece4 !important;
}

/* Sleek, fluid mobile contact cards */
@media (max-width: 640px) {
  #primary-contacts-grid {
    grid-template-columns: 1fr !important;
    gap: 8px !important;
  }
  #primary-contacts-grid > .card {
    padding: 12px 14px !important;
    min-height: auto !important;
    border-radius: 10px !important;
    background: rgba(22, 19, 33, 0.85) !important;
    border: 1px solid rgba(255, 255, 255, 0.07) !important;
    gap: 8px !important;
  }
  #primary-contacts-grid .contact-brand-title {
    font-size: 16px !important;
    line-height: 1.3 !important;
  }
  #primary-contacts-grid .contact-site-icon,
  #primary-contacts-grid .contact-site-icon svg {
    width: 22px !important;
    height: 22px !important;
  }
  #platforms-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }
  #platforms-grid > .card {
    padding: 11px 12px !important;
    min-height: auto !important;
    border-radius: 10px !important;
    background: rgba(22, 19, 33, 0.7) !important;
    border: 1px solid rgba(255, 255, 255, 0.06) !important;
    gap: 6px !important;
  }
  #platforms-grid .contact-brand-title {
    font-size: 13.5px !important;
  }
  #platforms-grid .card-type {
    font-size: 10px !important;
    margin-top: 2px !important;
  }
}

/* 8. Toast notification */
#toast {
  pointer-events: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  transform: translateY(16px) scale(0.96) !important;
  transition: opacity 0.25s cubic-bezier(0.16, 1, 0.3, 1), transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.25s !important;
}

#toast.toast-show {
  opacity: 1 !important;
  visibility: visible !important;
  transform: translateY(0) scale(1) !important;
  pointer-events: auto !important;
}

#toast:not(.toast-show) {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* 9. Bottom Navigation Tap Indicator */
.bnav-item {
  transition: transform 0.15s ease, color 0.15s ease !important;
}
.bnav-item:active {
  transform: scale(0.92) !important;
}
.bnav-item.bnav-active svg {
  transform: scale(1.1);
  transition: transform 0.2s cubic-bezier(0.34, 1.56, 0.64, 1);
}

/* 10. Hero atmospheric breathing aura */
.hero-ambient-glow {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 96%;
  height: 96%;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background: radial-gradient(circle, rgba(245, 185, 120, 0.26) 0%, rgba(226, 140, 100, 0.16) 30%, rgba(168, 85, 247, 0.08) 60%, transparent 75%);
  filter: blur(48px);
  pointer-events: none;
  z-index: 0;
  animation: heroAuraBreathe 9s infinite alternate ease-in-out;
}
@keyframes heroAuraBreathe {
  0% { transform: translate(-52%, -48%) scale(0.92); opacity: 0.65; }
  50% { transform: translate(-48%, -52%) scale(1.08); opacity: 0.95; }
  100% { transform: translate(-50%, -50%) scale(1); opacity: 0.75; }
}

/* 11. Live price number spring pop */
@keyframes pricePop {
  0% { transform: scale(1); }
  40% { transform: scale(1.14); color: #ffd166; text-shadow: 0 0 16px rgba(226, 180, 120, 0.45); }
  100% { transform: scale(1); }
}
.price-pop {
  display: inline-block;
  animation: pricePop 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

/* 12. Comparison curtain glowing energy divider */
#art-process .divider {
  width: 2px !important;
  background: #e2b478 !important;
  box-shadow: 0 0 10px rgba(226, 180, 120, 0.8), 0 0 20px rgba(226, 180, 120, 0.35) !important;
}
#art-process .divider span {
  background: #e2b478 !important;
  color: #0b0a0e !important;
  box-shadow: 0 0 12px rgba(226, 180, 120, 0.85) !important;
  transition: transform 0.25s cubic-bezier(0.34, 1.56, 0.64, 1) !important;
}
#art-process .curtain:hover .divider span,
#art-process .curtain:active .divider span {
  transform: translate(-50%, -50%) scale(1.22) !important;
}

/* 13. Dialog & Lightbox cinematic entrance with backdrop blur */
dialog[open]:not(#catalog-dialog) {
  animation: dialogZoomIn 0.3s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
@keyframes dialogZoomIn {
  from { opacity: 0; transform: scale(0.94) translateY(10px); }
  to { opacity: 1; transform: scale(1) translateY(0); }
}
dialog:not(#catalog-dialog)::backdrop {
  background: rgba(13, 11, 20, 0.88) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
  animation: backdropFade 0.25s ease forwards;
}
#catalog-dialog::backdrop {
  background: rgba(13, 11, 20, 0.72) !important;
  animation: backdropFade 0.25s ease forwards;
}
@keyframes backdropFade {
  from { opacity: 0; }
  to { opacity: 1; }
}

/* 14. Luxury slim custom scrollbar */
::-webkit-scrollbar {
  width: 7px;
  height: 7px;
}
::-webkit-scrollbar-track {
  background: #0d0b14 !important;
}
::-webkit-scrollbar-thumb {
  background: #231c31 !important;
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: #e2b478 !important;
}

/* 15. Queue Active Item Animated Pulse */
.queue-status {
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.queue-status:hover {
  transform: scale(1.04);
}

/* 16. FAQ accordion chevron rotation and hover */
#faq-items-list details summary span.mono {
  display: inline-block;
  transition: transform 0.25s cubic-bezier(0.34, 1.56, 0.64, 1);
}
#faq-items-list details[open] summary span.mono {
  transform: rotate(45deg);
}
.catalog-art>.catalog-status,.catalog-art>.media-adult-badge,.catalog-art>.catalog-demo-badge,.media-adult-badge,.adult-tag{border-radius:4px!important;min-height:25px!important;box-sizing:border-box;display:inline-flex;align-items:center;padding:4px 7px!important;font:500 10px/15px Inter,system-ui!important}
#commission-intake,#contacts-intake{color:var(--status-green)!important;border-color:var(--status-green-border)!important;background:var(--status-green-bg)!important}
.catalog-status.available,.catalog-status.status-open{color:var(--status-green);border-color:var(--status-green-border)}
#artwork-work-strip{display:flex;gap:10px;overflow-x:auto;overflow-y:hidden;padding:14px 18px;max-width:100%;scrollbar-width:thin;scrollbar-color:#705a72 #131017;align-items:stretch}
#artwork-work-strip:empty{display:none}
#artwork-work-strip button{flex:0 0 132px;width:132px;max-width:132px;min-width:0;display:flex;flex-direction:column;align-items:stretch;gap:0;padding:0;overflow:hidden;border:1px solid #e2b47833;border-radius:7px;background:#19141d;text-align:left;color:#ded4ca}
#artwork-work-strip .strip-media{display:block;position:relative;width:100%;height:112px;flex:none;overflow:hidden;background:#211b25}
#artwork-work-strip img{display:block;height:100%;width:100%;object-fit:contain;border-radius:0;background:transparent}
#artwork-work-strip .strip-title{display:block;width:100%;min-height:48px;padding:9px 10px;box-sizing:border-box;font:500 12px/1.45 Inter,system-ui;white-space:normal;overflow-wrap:anywhere}
#artwork-work-strip button[aria-pressed=true]{border-color:#e2b478;background:#e2b47812;color:#e2b478}
#artwork-work-strip button:focus-visible{outline:2px solid #e2b478;outline-offset:2px}
#artwork-work-strip .strip-adult img{filter:blur(18px);transform:scale(1.12)}
#artwork-work-strip .strip-lock{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;background:#211b25bb;color:#d9acbe}
#artwork-work-strip .strip-lock-icon{display:grid;place-items:center;width:30px;height:30px;flex:none;border:1px solid #b786a266;border-radius:50%;background:#38273455}
#artwork-work-strip .strip-lock-icon svg{width:15px;height:15px}#artwork-work-strip .strip-lock small{font:600 9px/1.4 Inter,system-ui}
#artwork-work-strip .strip-age{position:absolute;top:6px;left:6px;border:1px solid #b786a266;border-radius:4px;padding:2px 5px;background:#211b25dd;color:#d9acbe;font:600 9px/1.4 Inter,system-ui}
#artwork-dialog #art-process .layout>section:first-child{display:none!important}#artwork-dialog #art-process .layout{display:block}
.tos-summary-copy{font-size:14px;line-height:1.75;color:#ded4ca;padding-top:5px}
#tos-contents{display:flex;flex-wrap:wrap;gap:8px 22px;margin:0 0 20px;padding:0 0 18px;border-bottom:1px solid #e2b47822}#tos-contents a{padding:3px 0;color:#bfb2a4;font-size:13px;line-height:1.6;text-decoration:underline;text-decoration-color:#e2b47844;text-underline-offset:5px}#tos-contents a:hover{color:#e2b478}
#tos-detailed-sections{max-width:none;grid-template-columns:minmax(0,1fr);gap:20px;align-items:stretch}.tos-detail{scroll-margin-top:90px}.tos-detail ul{font-size:14px!important;line-height:1.8!important;color:#ded4ca!important}.tos-detail li{padding:10px 0;border-bottom:1px solid #e2b47818}.tos-detail li:last-child{border:0}.tos-detail h3{font-size:24px;line-height:1.35}
@media(min-width:900px){#tos-detailed-sections{grid-template-columns:repeat(2,minmax(0,1fr))}}
#reservation-terms{display:none!important}
.catalog-art > .catalog-status {
  position: absolute !important;
  right: 10px !important;
  top: 10px !important;
  z-index: 4 !important;
  border-radius: 4px !important;
  height: 25px !important;
  min-height: 25px !important;
  padding: 3px 8px !important;
  box-sizing: border-box !important;
  font: 600 11px/1.4 Inter, sans-serif !important;
  letter-spacing: 0.03em !important;
  backdrop-filter: blur(8px) !important;
  display: inline-flex !important;
  align-items: center !important;
}
.catalog-status.open,
.catalog-status.status-open,
.catalog-status.available {
  color: #48c87b !important;
  background: #141119ed !important;
  border: 1px solid rgba(72, 200, 123, 0.65) !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5) !important;
}
.catalog-status.reserved,
.catalog-status.status-reserved {
  color: #E2B478 !important;
  background: #141119ed !important;
  border: 1px solid rgba(226, 180, 120, 0.65) !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5) !important;
}
.catalog-status.sold,
.catalog-status.status-sold {
  color: #9a8fa0 !important;
  background: rgba(20, 17, 25, 0.88) !important;
  border: 1px solid rgba(154, 143, 160, 0.4) !important;
  box-shadow: none !important;
}
.queue-status:not(.reserved) {
  color: var(--status-green) !important;
  border-color: var(--status-green-border) !important;
  background: var(--status-green-bg) !important;
}
.queue-status.reserved {
  color: var(--status-gold) !important;
  border-color: #e2b47855 !important;
  background: #e2b4780a !important;
}

/* Dim closed / sold lots by default so available lots stand out immediately */
.catalog-card.status-sold,
.catalog-card:has(.catalog-status.sold) {
  opacity: 0.62;
  filter: grayscale(0.55);
  transition: opacity 0.25s ease, filter 0.25s ease;
}
.catalog-card.status-sold:hover,
.catalog-card:has(.catalog-status.sold):hover {
  opacity: 1;
  filter: none;
}

/* Balanced ToS cards and continuous rows. */
#tos-cards-grid{gap:16px;align-items:stretch}#tos-cards-grid>.card{padding:22px 24px;background:linear-gradient(145deg,#1c1720,#141017 65%);border-color:#e2b47830;display:flex;flex-direction:column;gap:0}
#tos-cards-grid>.card>.mono{font-size:11px;letter-spacing:.12em;border-bottom:1px solid #e2b47822;padding-bottom:10px;margin-bottom:13px;color:#e2b478}
#tos-cards-grid h3{font-size:22px;line-height:1.3;margin:0 0 10px}.tos-summary-copy{padding:0;margin:0!important;font-size:13px;line-height:1.75;color:#c9bfb4}.tos-summary-copy strong{display:block;color:#f2ece4;font-size:14px;line-height:1.5;font-weight:600;margin-bottom:7px}.tos-summary-copy span{display:block}
.tos-detail{height:100%;box-sizing:border-box}.tos-detail>ul{margin-top:16px}.tos-detail>ul>li:first-child{padding-top:3px}
@media(min-width:900px){#tos-detailed-sections>.tos-detail:last-child:nth-child(odd){grid-column:1/-1}}
@media(max-width:600px){#tos-cards-grid>.card{padding:20px}.tos-summary-copy{font-size:14px}}

.tos-consent{width:fit-content;max-width:100%;flex:none;align-self:flex-start}.tos-consent input{flex:none}#tos-summary-title{flex:1;min-width:0}
#artwork-dialog #art-process .viewer{height:min(40dvh,460px);width:auto;max-width:100%;margin-inline:auto}
#artwork-dialog #art-process .controls{padding-top:12px}
#artwork-dialog #art-process .layout{margin-top:14px}
#artwork-dialog #art-process .content-preferences{margin-bottom:10px}

.skip-content{position:fixed;top:8px;left:16px;z-index:10000;padding:10px 16px;border-radius:5px;background:#e2b478;color:#100c15;transform:translateY(-180%)}.skip-content:focus{transform:translateY(0)}
/* Redesigned Desktop Gallery & Catalog Header, Search Bar, Filter Bar (ToS 6-Card Style) & 18+ Controls */
.gallery-header-shell,
.catalog-header-shell {
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding-bottom: 24px;
}

.gallery-header-top,
.catalog-header.catalog-header-top {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  flex-wrap: wrap;
  border-bottom: 0 !important;
  padding-bottom: 0 !important;
}

.gallery-title-group,
.catalog-title-group {
  flex: 1 1 380px;
  min-width: 260px;
}

.catalog-header.catalog-header-top h1 {
  margin: 4px 0 6px !important;
}

.gallery-search-wrap,
.catalog-search-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
  width: clamp(300px, 32vw, 370px);
  max-width: 100%;
  flex: 0 1 370px;
}

.gallery-search-icon {
  position: absolute;
  left: 14px;
  width: 16px;
  height: 16px;
  color: #b79c78;
  pointer-events: none;
  transition: color 0.16s ease;
}

#gallery-search,
#catalog-search {
  width: 100% !important;
  max-width: 100% !important;
  height: 42px !important;
  padding: 0 14px 0 40px !important;
  border-radius: 10px !important;
  border: 1px solid #e2b47830 !important;
  background: linear-gradient(145deg, #1c1720, #141017 65%) !important;
  color: #f2ece4 !important;
  font: 400 13px/1.4 var(--ui-font, Inter, system-ui, sans-serif) !important;
  letter-spacing: 0.01em !important;
  box-shadow: none !important;
  transition: border-color 0.16s ease, box-shadow 0.16s ease, background-color 0.16s ease;
}

#gallery-search::placeholder,
#catalog-search::placeholder {
  color: #968c82;
}

#gallery-search:hover,
#catalog-search:hover {
  border-color: rgba(226, 180, 120, 0.45) !important;
}

#gallery-search:focus,
#catalog-search:focus {
  outline: none !important;
  border-color: #e2b478 !important;
  box-shadow: 0 0 0 2px rgba(226, 180, 120, 0.16) !important;
}

.gallery-search-wrap:focus-within .gallery-search-icon,
.catalog-search-wrap:focus-within .gallery-search-icon {
  color: #e2b478;
}

/* Filter & sort strip styled in the exact ToS 6-card surface (#tos-cards-grid > .card) */
.gallery-toolbar,
#page-catalog .catalog-toolbar {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
  flex-wrap: wrap !important;
  padding: 12px 16px !important;
  border-radius: 12px !important;
  background: linear-gradient(145deg, #1c1720, #141017 65%) !important;
  border: 1px solid #e2b47830 !important;
  box-shadow: none !important;
}

.catalog-filter-groups {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px 12px;
  flex: 1 1 auto;
}

.catalog-filter-divider {
  width: 1px;
  height: 22px;
  background: #e2b47822;
  flex-shrink: 0;
}

#gallery-category-filters,
#catalog-type-filters,
#catalog-state-filters {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  flex: none !important;
}

#gallery-category-filters > button,
#catalog-type-filters > button,
#catalog-state-filters > button {
  height: 36px !important;
  min-height: 36px !important;
  padding: 0 14px !important;
  border-radius: 8px !important;
  border: 1px solid #e2b47826 !important;
  background: rgba(18, 15, 23, 0.55) !important;
  color: #c9bfb4 !important;
  font: 500 12.5px/1 var(--ui-font, Inter, system-ui, sans-serif) !important;
  letter-spacing: 0.01em !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  white-space: nowrap !important;
  cursor: pointer;
  transition: background-color 0.16s ease, color 0.16s ease, border-color 0.16s ease !important;
}

#gallery-category-filters > button:hover:not([aria-pressed="true"]),
#catalog-type-filters > button:hover:not([aria-pressed="true"]),
#catalog-state-filters > button:hover:not([aria-pressed="true"]) {
  color: #f2ece4 !important;
  background: rgba(226, 180, 120, 0.1) !important;
  border-color: #e2b47866 !important;
}

#gallery-category-filters > button[aria-pressed="true"],
#catalog-type-filters > button[aria-pressed="true"],
#catalog-state-filters > button[aria-pressed="true"] {
  background: #e2b478 !important;
  color: #100c15 !important;
  border-color: #e2b478 !important;
  font-weight: 600 !important;
}

.gallery-adult-controls,
.catalog-adult-controls {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-left: auto;
  padding-left: 14px;
  border-left: 1px solid #e2b47822;
}

#page-gallery #gallery-adult-only,
#page-catalog #catalog-adult-only {
  height: 36px !important;
  min-height: 36px !important;
  padding: 0 13px !important;
  border-radius: 8px !important;
  border: 1px solid rgba(212, 138, 148, 0.36) !important;
  background: rgba(212, 138, 148, 0.06) !important;
  color: #e6a2ac !important;
  font: 500 12px/1 var(--ui-font, Inter, system-ui, sans-serif) !important;
  letter-spacing: 0.01em !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer;
  margin: 0 !important;
  transition: background-color 0.16s ease, border-color 0.16s ease, color 0.16s ease !important;
}

#page-gallery #gallery-adult-only:hover:not([aria-pressed="true"]),
#page-catalog #catalog-adult-only:hover:not([aria-pressed="true"]) {
  border-color: rgba(222, 113, 128, 0.65) !important;
  background: rgba(212, 138, 148, 0.14) !important;
  color: #ffd6de !important;
}

#page-gallery #gallery-adult-only[aria-pressed="true"],
#page-catalog #catalog-adult-only[aria-pressed="true"] {
  background: rgba(195, 76, 92, 0.24) !important;
  border-color: #de7180 !important;
  color: #ffe8ed !important;
  font-weight: 600 !important;
}

#page-gallery .site-adult-toggle,
#catalog-adult-toggle.site-adult-toggle {
  height: 36px !important;
  min-height: 36px !important;
  padding: 0 13px !important;
  border-radius: 8px !important;
  border: 1px solid rgba(212, 138, 148, 0.36) !important;
  background: rgba(212, 138, 148, 0.06) !important;
  color: #e6a2ac !important;
  font: 500 12px/1 var(--ui-font, Inter, system-ui, sans-serif) !important;
  letter-spacing: 0.01em !important;
  gap: 9px !important;
  display: inline-flex !important;
  align-items: center !important;
  transition: background-color 0.16s ease, border-color 0.16s ease, color 0.16s ease !important;
}

#page-gallery .site-adult-toggle:hover,
#catalog-adult-toggle.site-adult-toggle:hover {
  border-color: rgba(222, 113, 128, 0.65) !important;
  background: rgba(212, 138, 148, 0.14) !important;
}

#page-gallery .site-adult-toggle[data-enabled="true"],
#catalog-adult-toggle.site-adult-toggle[aria-checked="true"] {
  border-color: #de7180 !important;
  background: rgba(195, 76, 92, 0.22) !important;
  color: #ffe4ea !important;
}

#catalog-notice {
  background: linear-gradient(145deg, #1c1720, #141017 65%) !important;
  border: 1px solid #e2b47830 !important;
  border-radius: 12px !important;
}

.quote-input-invalid{border-color:#d48a94!important;box-shadow:0 0 0 2px #d48a9433!important}#calc-discord-error,#calc-email-error{color:#d48a94;font-size:11px;line-height:1.45;margin-top:4px}

/* Refined Art Platforms & Galleries cards (prevent title truncation and badge overlap) */
#platforms-grid > .card {
  padding: 16px 18px !important;
  border-radius: 12px !important;
  background: linear-gradient(160deg, #17131d 0%, #110e16 100%) !important;
  border: 1px solid rgba(226, 180, 120, 0.22) !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  min-height: 98px !important;
}

#platforms-grid > .card.platform-card-soon {
  opacity: 0.82 !important;
  background: #110e15 !important;
  border: 1px dashed rgba(226, 180, 120, 0.25) !important;
}

#platforms-grid .platform-card-head,
#platforms-grid > .card > div:first-of-type {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  width: 100% !important;
  min-width: 0 !important;
}

#platforms-grid .contact-brand-title {
  font-size: 16px !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  gap: 10px !important;
  min-width: 0 !important;
  flex: 1 1 auto !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#platforms-grid .contact-site-icon {
  flex: 0 0 28px !important;
  width: 28px !important;
  height: 28px !important;
  border-radius: 7px !important;
  background: rgba(226, 180, 120, 0.08) !important;
  border: 1px solid rgba(226, 180, 120, 0.16) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

#platforms-grid .contact-site-icon svg,
#platforms-grid .contact-site-icon img {
  width: 16px !important;
  height: 16px !important;
}

#platforms-grid .platform-soon-badge {
  flex-shrink: 0 !important;
  white-space: nowrap !important;
  font-size: 9.5px !important;
  font-weight: 600 !important;
  letter-spacing: 0.05em !important;
  line-height: 1 !important;
  padding: 4px 7px !important;
  border-radius: 5px !important;
  background: rgba(226, 180, 120, 0.1) !important;
  border: 1px solid rgba(226, 180, 120, 0.28) !important;
  color: #d3c8bc !important;
}

#platforms-grid .platform-card-note,
#platforms-grid > .card > div:last-of-type {
  font-size: 12.5px !important;
  line-height: 1.5 !important;
  color: #b7ae9f !important;
}

/* Compact Globe Language Switcher Popover (Desktop & Mobile) */
.lang-switcher {
  position: relative;
  display: inline-flex;
  align-items: center;
}

.lang-trigger-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  height: 34px;
  min-height: 34px;
  padding: 0 11px;
  border-radius: 8px;
  border: 1px solid #e2b47838;
  background: linear-gradient(145deg, #1c1720, #141017 65%);
  color: #f2ece4;
  font: 600 11.5px/1 var(--ui-font, Inter, system-ui, sans-serif);
  letter-spacing: 0.05em;
  cursor: pointer;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
  transition: border-color 0.16s ease, background 0.16s ease, color 0.16s ease, box-shadow 0.16s ease;
}

.lang-trigger-btn:hover {
  border-color: #e2b47888;
  color: #e2b478;
}

.lang-switcher.is-open .lang-trigger-btn {
  border-color: #e2b478;
  color: #e2b478;
  box-shadow: 0 0 0 2px rgba(226, 180, 120, 0.16);
}

.lang-globe-icon {
  width: 14px;
  height: 14px;
  color: #e2b478;
  flex-shrink: 0;
}

.lang-active-code {
  line-height: 1;
}

.lang-chevron-icon {
  width: 11px;
  height: 11px;
  color: #b7ae9f;
  flex-shrink: 0;
  transition: transform 0.18s ease, color 0.18s ease;
}

.lang-switcher.is-open .lang-chevron-icon {
  transform: rotate(180deg);
  color: #e2b478;
}

.lang-menu {
  display: none;
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  min-width: 158px;
  padding: 6px;
  border-radius: 12px;
  background: linear-gradient(145deg, #1c1720, #130f18 70%);
  border: 1px solid rgba(226, 180, 120, 0.42);
  box-shadow: 0 14px 36px rgba(0, 0, 0, 0.85);
  z-index: 160;
  flex-direction: column;
  gap: 4px;
}

.lang-switcher.is-open .lang-menu {
  display: flex;
  animation: langMenuFadeIn 0.15s cubic-bezier(0.22, 1, 0.36, 1);
}

@keyframes langMenuFadeIn {
  from { opacity: 0; transform: translateY(-5px) scale(0.98); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

.lang-menu .lang-btn {
  width: 100% !important;
  min-height: 36px !important;
  padding: 7px 10px !important;
  border-radius: 8px !important;
  border: 1px solid transparent !important;
  background: transparent !important;
  color: #c9bfb4 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  font: 500 12.5px/1.2 var(--ui-font, Inter, system-ui, sans-serif) !important;
  text-align: left !important;
  cursor: pointer !important;
  transition: background-color 0.14s ease, border-color 0.14s ease, color 0.14s ease !important;
}

.lang-menu .lang-btn:hover {
  background: rgba(226, 180, 120, 0.1) !important;
  color: #f2ece4 !important;
}

.lang-menu .lang-btn[aria-checked="true"] {
  background: rgba(226, 180, 120, 0.15) !important;
  border-color: rgba(226, 180, 120, 0.45) !important;
  color: #f2ece4 !important;
  font-weight: 600 !important;
}

.lang-btn-code {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.06em;
  padding: 3px 6px;
  border-radius: 5px;
  background: rgba(226, 180, 120, 0.12);
  color: #e2b478;
  line-height: 1;
}

.lang-menu .lang-btn[aria-checked="true"] .lang-btn-code {
  background: #e2b478;
  color: #0b0a0e;
}

.lang-btn-name {
  flex: 1;
  text-align: right;
}

.tier-calc-jump {
  display: none;
}

/* Reduced bottom gap before Studio Footer across all pages */
body > main {
  padding-top: 32px !important;
  padding-bottom: 20px !important;
}

.site-footer {
  margin-top: 24px !important;
  padding: 26px 24px 24px !important;
  background: linear-gradient(180deg, rgba(18, 14, 23, 0.72) 0%, #0b0a0e 100%) !important;
  border-top: 1px solid rgba(226, 180, 120, 0.22) !important;
  text-align: left !important;
}

.site-footer-inner {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.site-footer-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  flex-wrap: wrap;
}

.site-footer-brand {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.site-footer-logo {
  font-size: 26px !important;
  line-height: 1.1 !important;
  color: #f2ece4 !important;
  text-decoration: none !important;
  width: fit-content;
}

.site-footer-tagline {
  margin: 0 !important;
  font-size: 12px !important;
  line-height: 1.5 !important;
  color: #9d9286 !important;
}

.site-footer-contacts {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

.site-footer-contact-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 38px;
  padding: 7px 14px;
  border-radius: 8px;
  border: 1px solid #e2b47830;
  background: linear-gradient(145deg, #1c1720, #141017 65%);
  color: #e2b478;
  font-size: 12px;
  font-weight: 500;
  text-decoration: none;
  white-space: nowrap;
  transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease;
}

.site-footer-contact-pill:hover {
  border-color: #e2b478;
  background: rgba(226, 180, 120, 0.14);
  color: #f2ece4;
}

.site-footer-bottom {
  padding-top: 16px;
  border-top: 1px solid rgba(226, 180, 120, 0.12);
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #8e8880;
  font-size: 11px;
  letter-spacing: 0.06em;
}

@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}*,*::before,*::after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}

/* ==========================================================================
   MOBILE RESPONSIVENESS & TOUCH OPTIMIZATION (IOS & ANDROID)
   ========================================================================== */
:root {
  --sat: env(safe-area-inset-top, 0px);
  --sab: env(safe-area-inset-bottom, 0px);
  --sal: env(safe-area-inset-left, 0px);
  --sar: env(safe-area-inset-right, 0px);
}

.mobile-nav-toggle { display: none !important; }
.mobile-bottom-nav { display: none !important; }
.mobile-quote-bar { display: none !important; }
.mobile-more-backdrop { display: none !important; }
.mobile-more-sheet { display: none !important; }

@media (max-width: 860px) {
  .mobile-more-backdrop { display: block !important; }
  .mobile-more-sheet { display: block !important; }
  html, body {
    overflow-x: hidden;
    max-width: 100vw;
  }

  body > main {
    padding-left: max(14px, var(--sal)) !important;
    padding-right: max(14px, var(--sar)) !important;
    padding-top: 12px !important;
    padding-bottom: 12px !important;
  }

  body[data-page="pricing"] > main {
    padding-bottom: 14px !important;
  }

  /* Keep toast notification above bottom dock and floating quote bar */
  #toast {
    bottom: calc(68px + var(--sab)) !important;
    left: 16px !important;
    right: 16px !important;
    z-index: 1050 !important;
    text-align: center !important;
  }

  body[data-page="pricing"] #toast {
    bottom: calc(124px + var(--sab)) !important;
  }

  input:not([type=checkbox]):not([type=radio]):not([type=range]),
  select,
  textarea {
    font-size: 16px !important;
  }

  /* --- STICKY HEADER (CLEAN 1-ROW: LOGO · STATUS · COMPACT LANG PILL) --- */
  header.sticky {
    height: auto !important;
    min-height: 52px !important;
    padding: max(6px, var(--sat)) max(12px, var(--sar)) 6px max(12px, var(--sal)) !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 8px !important;
    background: rgba(11, 10, 14, 0.96) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    transition: background-color 0.2s ease, box-shadow 0.2s ease;
  }

  header.sticky > a:first-child {
    order: 1 !important;
    min-width: 44px !important;
    min-height: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
    font-size: 21px !important;
    line-height: 1.15 !important;
    flex-shrink: 0 !important;
  }

  header.sticky #header-tagline {
    display: none !important;
  }

  header.sticky > div:last-of-type {
    order: 2 !important;
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    margin-left: auto !important;
    min-width: 0 !important;
  }

  /* Mobile top bar: clean, elegant header with Logo on left, Lang switcher on right, no crowded/overflowing buttons */
  header.sticky a.intake-link,
  header.sticky a:has(#header-queue-counter) {
    display: none !important;
  }

  .lang-trigger-btn {
    min-width: 44px !important;
    min-height: 40px !important;
    height: 40px !important;
    padding: 0 11px !important;
    border-radius: 8px !important;
    font-size: 11.5px !important;
  }

  .lang-menu {
    min-width: 168px !important;
    right: 0 !important;
    padding: 7px !important;
  }

  .lang-btn {
    min-width: 44px !important;
    min-height: 44px !important;
    padding: 8px 12px !important;
    font-size: 12.5px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
  }

  /* Clean Mobile Header: No Hamburger (Logo & Lang Switcher only) */
  .mobile-nav-toggle {
    display: none !important;
  }

  #nav-links .nav-link {
    min-width: 44px !important;
    min-height: 46px !important;
  }

  header.sticky #nav-links {
    display: none !important;
  }

  /* --- MOBILE 'MORE' BOTTOM SHEET (Queue · Terms of Service · FAQ) --- */
  .mobile-more-backdrop {
    position: fixed !important;
    inset: 0 !important;
    background: rgba(8, 7, 10, 0.78) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transition: opacity 0.28s cubic-bezier(0.16, 1, 0.3, 1) !important;
    z-index: 1030 !important;
  }
  .mobile-more-backdrop.is-open {
    opacity: 1 !important;
    pointer-events: auto !important;
  }

  .mobile-more-sheet {
    position: fixed !important;
    bottom: calc(64px + var(--sab)) !important;
    left: 12px !important;
    right: 12px !important;
    max-width: 420px !important;
    margin: 0 auto !important;
    background: #131019 !important;
    border: 1px solid rgba(226, 180, 120, 0.35) !important;
    border-radius: 16px !important;
    box-shadow: 0 16px 48px -4px rgba(0, 0, 0, 0.9), 0 0 24px -2px rgba(226, 180, 120, 0.15) !important;
    padding: 14px 16px 16px !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transform: translateY(16px) scale(0.96) !important;
    transition: transform 0.28s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.24s cubic-bezier(0.16, 1, 0.3, 1) !important;
    z-index: 1035 !important;
  }
  .mobile-more-sheet.is-open {
    opacity: 1 !important;
    pointer-events: auto !important;
    transform: translateY(0) scale(1) !important;
  }

  .mobile-more-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding-bottom: 10px !important;
    margin-bottom: 10px !important;
    border-bottom: 1px solid rgba(226, 180, 120, 0.15) !important;
  }
  .mobile-more-close {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 28px !important;
    height: 28px !important;
    border-radius: 50% !important;
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(226, 180, 120, 0.2) !important;
    color: #ded4ca !important;
    font-size: 14px !important;
    cursor: pointer !important;
    transition: transform 0.15s ease, background-color 0.15s ease !important;
  }
  .mobile-more-close:active {
    transform: scale(0.9) !important;
    background: rgba(226, 180, 120, 0.2) !important;
  }

  .mobile-more-links {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
  }

  .mobile-more-link {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 12px 14px !important;
    min-height: 48px !important;
    border-radius: 10px !important;
    background: rgba(255, 255, 255, 0.02) !important;
    border: 1px solid rgba(226, 180, 120, 0.12) !important;
    text-decoration: none !important;
    color: #ded4ca !important;
    transition: background 0.18s ease, border-color 0.18s ease, transform 0.18s ease !important;
  }
  .mobile-more-link:hover,
  .mobile-more-link:active {
    background: rgba(226, 180, 120, 0.1) !important;
    border-color: rgba(226, 180, 120, 0.4) !important;
    transform: translateX(2px) !important;
  }
  .mobile-more-link.active {
    border-color: #E2B478 !important;
    background: rgba(226, 180, 120, 0.14) !important;
    box-shadow: inset 3px 0 0 #E2B478 !important;
  }
  .mobile-more-link.active .serif {
    color: #E2B478 !important;
  }

  /* --- MOBILE BOTTOM DOCK (APP-LIKE NAVIGATION) --- */
  .mobile-bottom-nav {
    display: flex !important;
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 1040 !important;
    height: calc(56px + var(--sab)) !important;
    padding-bottom: var(--sab) !important;
    background: rgba(13, 11, 16, 0.98) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
    border-top: 1px solid rgba(226, 180, 120, 0.28) !important;
    align-items: center !important;
    justify-content: space-around !important;
    box-shadow: 0 -4px 30px rgba(0, 0, 0, 0.85) !important;
    transform: translateZ(0);
  }

  .bnav-item {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 3px !important;
    flex: 1 !important;
    height: 100% !important;
    min-width: 44px !important;
    min-height: 48px !important;
    color: #9d9286 !important;
    text-decoration: none !important;
    background: transparent !important;
    border: 0 !important;
    cursor: pointer !important;
    padding: 0 !important;
    -webkit-tap-highlight-color: transparent !important;
    transition: color 0.15s ease, transform 0.12s ease !important;
  }

  .bnav-item:active {
    transform: scale(0.92) !important;
  }

  .bnav-icon {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 22px !important;
    height: 22px !important;
    color: inherit !important;
  }

  .bnav-label {
    font-family: var(--ui-font) !important;
    font-size: 10px !important;
    font-weight: 500 !important;
    line-height: 1 !important;
    letter-spacing: 0.02em !important;
  }

  .bnav-item.bnav-active,
  .bnav-item.bnav-menu-open,
  body[data-page="board"] #bnav-board,
  body[data-page="pricing"] #bnav-pricing,
  body[data-page="catalog"] #bnav-catalog,
  body[data-page="gallery"] #bnav-gallery,
  body[data-page="queue"] #bnav-more,
  body[data-page="tos"] #bnav-more,
  body[data-page="faq"] #bnav-more {
    color: #e2b478 !important;
  }

  .bnav-item.bnav-active::before,
  body[data-page="board"] #bnav-board::before,
  body[data-page="pricing"] #bnav-pricing::before,
  body[data-page="catalog"] #bnav-catalog::before,
  body[data-page="gallery"] #bnav-gallery::before,
  body[data-page="queue"] #bnav-more::before,
  body[data-page="tos"] #bnav-more::before,
  body[data-page="faq"] #bnav-more::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: 28% !important;
    right: 28% !important;
    height: 2px !important;
    border-radius: 0 0 2px 2px !important;
    background: #e2b478 !important;
  }

  .bnav-item.bnav-active .bnav-label,
  .bnav-item.bnav-menu-open .bnav-label,
  body[data-page="board"] #bnav-board .bnav-label,
  body[data-page="pricing"] #bnav-pricing .bnav-label,
  body[data-page="catalog"] #bnav-catalog .bnav-label,
  body[data-page="gallery"] #bnav-gallery .bnav-label,
  body[data-page="queue"] #bnav-more .bnav-label,
  body[data-page="tos"] #bnav-more .bnav-label,
  body[data-page="faq"] #bnav-more .bnav-label {
    font-weight: 700 !important;
    color: #e2b478 !important;
  }

  /* --- RETHOUGHT HOMEPAGE (BOARD) FOR MOBILE: COMPACT HERO + QUICK CONTACTS & CHIP PLATFORMS --- */
  #page-board {
    margin-top: 0 !important;
    gap: 18px !important;
  }

  #page-board.space-y-16 > :not([hidden]) ~ :not([hidden]) {
    margin-top: 18px !important;
  }

  #page-board > .grid:first-child {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
  }

  /* Compact Featured Artwork Banner at the top */
  #page-board > .grid:first-child > div:last-child {
    order: -1 !important;
    margin-bottom: 0 !important;
  }

  #page-board > .grid:first-child > div:last-child .card {
    border-radius: 12px !important;
    border: 1px solid rgba(226, 180, 120, 0.32) !important;
    box-shadow: 0 6px 22px rgba(0, 0, 0, 0.55) !important;
    overflow: hidden !important;
  }

  #page-board > .grid:first-child > div:last-child .aspect-\[4\/5\] {
    aspect-ratio: 16 / 10 !important;
    min-height: 200px !important;
    max-height: clamp(210px, 34vh, 280px) !important;
  }

  #page-board > .grid:first-child > div:last-child img {
    object-position: center 18% !important;
    object-fit: cover !important;
  }

  #hero-featured-title {
    font-size: 15px !important;
    line-height: 1.2 !important;
    margin-top: 2px !important;
  }

  .hero-copy {
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
  }

  .hero-copy.space-y-6 > :not([hidden]) ~ :not([hidden]) {
    margin-top: 6px !important;
  }

  #hero-eyebrow {
    font-size: 10px !important;
    letter-spacing: 0.08em !important;
    color: #e2b478 !important;
  }

  #hero-title {
    font-size: 20px !important;
    line-height: 1.22 !important;
    letter-spacing: -0.02em !important;
    margin: 0 !important;
  }

  #hero-desc {
    font-size: 12.5px !important;
    line-height: 1.48 !important;
    color: #b7ae9f !important;
    white-space: normal !important;
    margin: 0 !important;
  }

  /* Hide verbose second welcome paragraph on mobile so greeting stays compact */
  #hero-desc-2 {
    display: none !important;
  }

  /* Two Primary Entry Paths: Side-by-side 2-Column Quick-Action Buttons on Mobile */
  .hero-copy .grid.sm\:grid-cols-2 {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
    padding-top: 4px !important;
  }

  .hero-copy .grid.sm\:grid-cols-2 .card {
    padding: 11px 12px !important;
    border-radius: 10px !important;
    min-width: 44px !important;
    min-height: 52px !important;
    background: linear-gradient(145deg, #1c1720, #141017 65%) !important;
    border: 1px solid rgba(226, 180, 120, 0.3) !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    gap: 0 !important;
  }

  .hero-copy .grid.sm\:grid-cols-2 .card > div:first-child {
    margin-bottom: 0 !important;
    align-items: center !important;
  }

  #path-a-title, #path-b-title {
    font-size: 13.5px !important;
    font-weight: 600 !important;
    min-height: 0 !important;
    line-height: 1.25 !important;
    margin: 0 !important;
  }

  #path-a-sub, #path-b-sub {
    display: none !important;
  }

  /* Contacts & Platforms Section on Mobile: Compact & Thumb-Friendly */
  #page-board > div.border-t {
    padding-top: 14px !important;
  }

  #page-board > div.border-t.space-y-6 > :not([hidden]) ~ :not([hidden]) {
    margin-top: 12px !important;
  }

  #contacts-title,
  #feat-title {
    font-size: 21px !important;
    line-height: 1.22 !important;
    margin-top: 2px !important;
  }

  #contacts-intake {
    margin: 6px 0 0 !important;
    padding: 5px 10px !important;
    font-size: 11.5px !important;
    line-height: 1.35 !important;
    display: inline-flex !important;
    width: fit-content !important;
  }

  #primary-contacts-label,
  #platforms-label {
    font-size: 10px !important;
    margin-bottom: 7px !important;
  }

  /* Primary Direct Contacts: 3 Square Icon-Only Tiles (Discord · Email · Telegram) */
  #primary-contacts-grid,
  body #primary-contacts-grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 12px !important;
    width: 100% !important;
    max-width: 320px !important;
    margin: 12px auto !important;
    padding: 0 !important;
  }

  #primary-contacts-grid > .card,
  #primary-contacts-grid > .contact-with-icon,
  body #primary-contacts-grid > a,
  body #primary-contacts-grid > button {
    aspect-ratio: 1 / 1 !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    padding: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 14px !important;
    background: #121118 !important;
    border: 1px solid rgba(226, 180, 120, 0.3) !important;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.45) !important;
    transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease !important;
    position: relative !important;
    overflow: hidden !important;
  }

  #primary-contacts-grid > .card:active,
  #primary-contacts-grid > .contact-with-icon:active {
    transform: scale(0.93) !important;
    border-color: #E2B478 !important;
    box-shadow: 0 0 16px rgba(226, 180, 120, 0.35) !important;
  }

  /* Hide all verbose text labels and descriptors inside the 3 mobile tiles */
  #primary-contacts-grid > .card > div:first-child,
  #primary-contacts-grid > .contact-with-icon > div:first-child,
  #primary-contacts-grid .mono,
  #primary-contacts-grid .serif:not(.contact-brand-title) {
    display: none !important;
  }

  #primary-contacts-grid > .card > div:last-child,
  #primary-contacts-grid > .contact-with-icon > div:last-child {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  #primary-contacts-grid .contact-brand-title {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    font-size: 0 !important; /* Hide text label without hiding child icon */
    line-height: 0 !important;
    gap: 0 !important;
  }

  #primary-contacts-grid .contact-site-icon {
    position: static !important;
    inset: auto !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: auto !important;
    padding: 0 !important;
    width: 44px !important;
    height: 44px !important;
    background: transparent !important;
    border: none !important;
  }

  #primary-contacts-grid .contact-site-icon svg,
  #primary-contacts-grid .contact-site-icon img {
    width: 32px !important;
    height: 32px !important;
    display: block !important;
    margin: auto !important;
  }

  /* Art Platforms & Galleries: Compact 2-Column Link-Chip Grid on Mobile */
  #platforms-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 7px !important;
  }

  #platforms-grid > .card,
  #platforms-grid > * {
    min-width: 44px !important;
    min-height: 46px !important;
    padding: 9px 11px !important;
    border-radius: 10px !important;
    background: linear-gradient(145deg, #1c1720, #141017 65%) !important;
    border: 1px solid rgba(226, 180, 120, 0.26) !important;
    justify-content: center !important;
    gap: 0 !important;
  }

  /* Hide verbose platform descriptions on mobile so all 8 platforms fit in a compact 4x2 grid */
  #platforms-grid .platform-card-note,
  #platforms-grid > .card > div:last-of-type:not(.platform-card-head) {
    display: none !important;
  }

  #platforms-grid .platform-card-head,
  #platforms-grid > .card > div:first-of-type {
    gap: 6px !important;
  }

  #platforms-grid .contact-brand-title {
    font-size: 13px !important;
    font-weight: 600 !important;
    gap: 7px !important;
  }

  #platforms-grid .contact-site-icon {
    flex: 0 0 24px !important;
    width: 24px !important;
    height: 24px !important;
    border-radius: 6px !important;
  }

  #platforms-grid .contact-site-icon svg,
  #platforms-grid .contact-site-icon img {
    width: 14px !important;
    height: 14px !important;
  }

  #platforms-grid .platform-soon-badge {
    font-size: 8px !important;
    padding: 3px 5px !important;
    letter-spacing: 0.03em !important;
  }

  #feat-view-all {
    min-width: 44px !important;
    min-height: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
  }

  #board-highlights-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }

  #board-highlights-grid .card {
    min-width: 44px !important;
    min-height: 44px !important;
    border-radius: 10px !important;
    overflow: hidden !important;
  }

  #board-highlights-grid .highlight-caption {
    padding: 10px 12px !important;
    min-height: 82px !important;
  }

  /* Redesigned Compact Footer on Mobile (Minimal gap before footer) */
  .site-footer {
    margin-top: 14px !important;
    padding: 20px 14px calc(72px + var(--sab)) !important;
  }

  body[data-page="pricing"] .site-footer {
    padding-bottom: calc(124px + var(--sab)) !important;
  }

  .site-footer-inner {
    gap: 14px !important;
  }

  .site-footer-top {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
    align-items: stretch !important;
  }

  .site-footer-brand {
    align-items: flex-start !important;
    text-align: left !important;
  }

  .site-footer-contacts {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
    gap: 6px !important;
    width: 100% !important;
  }

  .site-footer-contact-pill {
    flex: 1 1 auto !important;
    min-width: 44px !important;
    min-height: 44px !important;
    padding: 8px 11px !important;
    font-size: 12px !important;
    justify-content: center !important;
  }

  .site-footer-bottom {
    padding-top: 12px !important;
    text-align: left !important;
    font-size: 10px !important;
    line-height: 1.45 !important;
  }

  footer a {
    min-width: 44px !important;
    min-height: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 6px 10px !important;
  }

  /* --- PRICING & CALCULATOR (COMPACT TIER CARDS + IN-CALCULATOR TIER PILLS) --- */
  #page-pricing {
    margin-top: 0 !important;
    gap: 14px !important;
  }

  #page-pricing.space-y-10 > :not([hidden]) ~ :not([hidden]) {
    margin-top: 14px !important;
  }

  #page-pricing > div:first-child {
    gap: 12px !important;
    padding-bottom: 14px !important;
  }

  #pricing-title {
    font-size: 24px !important;
    line-height: 1.2 !important;
  }

  #pricing-sub {
    font-size: 12.5px !important;
    line-height: 1.48 !important;
  }

  #page-pricing [role="tablist"] {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 6px !important;
    padding: 5px !important;
    background: linear-gradient(145deg, #1c1720, #141017 65%) !important;
    border: 1px solid rgba(226, 180, 120, 0.3) !important;
    border-radius: 10px !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  #page-pricing .ptab-btn {
    min-width: 44px !important;
    min-height: 46px !important;
    padding: 8px 6px !important;
    font-size: 11.5px !important;
    font-weight: 500 !important;
    line-height: 1.25 !important;
    border-radius: 7px !important;
    border: 0 !important;
    color: #b7ae9f !important;
    background: transparent !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    cursor: pointer !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    overflow-wrap: anywhere !important;
    -webkit-tap-highlight-color: transparent !important;
    transition: all 0.15s ease !important;
  }

  #page-pricing .ptab-btn[aria-selected="true"] {
    background: #e2b478 !important;
    color: #0b0a0e !important;
    font-weight: 700 !important;
    box-shadow: 0 3px 12px rgba(226, 180, 120, 0.35) !important;
  }

  #fanart-version-link,
  .version-example-link {
    min-width: 44px !important;
    min-height: 44px !important;
    padding: 6px 12px !important;
    display: inline-flex !important;
    align-items: center !important;
    margin: 0 !important;
  }

  #page-pricing .pricing-workspace {
    display: flex !important;
    flex-direction: column !important;
    gap: 18px !important;
    grid-template-columns: 1fr !important;
  }

  #page-pricing .pricing-subview.space-y-12 > :not([hidden]) ~ :not([hidden]),
  #page-pricing .pricing-subview.space-y-6 > :not([hidden]) ~ :not([hidden]) {
    margin-top: 14px !important;
  }

  #stage-sec-title,
  #adopt-title,
  #ych-title {
    font-size: 20px !important;
    line-height: 1.25 !important;
  }

  #pricing-view-adopt > .card:first-child,
  #pricing-view-ych > .card:first-child {
    padding: 14px !important;
    border-radius: 12px !important;
    background: linear-gradient(145deg, #1c1720, #141017 65%) !important;
    border: 1px solid rgba(226, 180, 120, 0.26) !important;
  }

  /* Compact Interactive Stage & Tier Cards on Mobile */
  #custom-stages-grid, #ych-slots-grid, #adopt-tiers-grid {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
  }

  #custom-stages-grid .card,
  #ych-slots-grid .card,
  #adopt-tiers-grid .card,
  [data-quote-value] {
    min-width: 44px !important;
    min-height: 44px !important;
    border-radius: 12px !important;
    padding: 12px 14px !important;
    border: 1px solid rgba(226, 180, 120, 0.28) !important;
    background: linear-gradient(145deg, #1c1720, #141017 65%) !important;
    transition: all 0.16s ease !important;
    cursor: pointer !important;
    gap: 6px !important;
    -webkit-tap-highlight-color: transparent !important;
  }

  #custom-stages-grid .card h3,
  #ych-slots-grid .card h3,
  #adopt-tiers-grid .card h3 {
    font-size: 17px !important;
    line-height: 1.25 !important;
    margin: 0 !important;
  }

  #custom-stages-grid .card .text-3xl,
  #adopt-tiers-grid .card .text-3xl {
    font-size: 21px !important;
    line-height: 1.15 !important;
  }

  #custom-stages-grid .card p,
  #ych-slots-grid .card p,
  #adopt-tiers-grid .card p {
    font-size: 12.5px !important;
    line-height: 1.45 !important;
  }

  #adopt-tiers-grid .card {
    padding: 0 !important;
  }

  #adopt-tiers-grid .card .h-48 {
    height: 112px !important;
  }

  #adopt-tiers-grid .card .p-5 {
    padding: 12px 14px !important;
  }

  #adopt-tiers-grid ul {
    font-size: 12px !important;
    line-height: 1.45 !important;
    padding-top: 6px !important;
  }

  #custom-stages-grid .card:active,
  #ych-slots-grid .card:active,
  #adopt-tiers-grid .card:active {
    transform: scale(0.985) !important;
  }

  #custom-stages-grid .card.quote-selected,
  #ych-slots-grid .card.quote-selected,
  #adopt-tiers-grid .card.quote-selected,
  #page-pricing .quote-selected {
    border-color: #e2b478 !important;
    background: linear-gradient(145deg, rgba(226, 180, 120, 0.16), #17131e 75%) !important;
    box-shadow: 0 4px 18px rgba(226, 180, 120, 0.2), inset 3px 0 #e2b478 !important;
  }

  /* Quick-jump pill inside the currently selected tier card on mobile */
  #page-pricing .quote-selected .tier-calc-jump {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-height: 36px !important;
    margin-top: 6px !important;
    padding: 6px 12px !important;
    border-radius: 8px !important;
    background: rgba(226, 180, 120, 0.16) !important;
    border: 1px solid rgba(226, 180, 120, 0.55) !important;
    color: #e2b478 !important;
    font: 600 11.5px/1.2 var(--ui-font, Inter, sans-serif) !important;
    letter-spacing: 0.02em !important;
  }

  /* Quote Panel on Mobile: Compact App-like Configuration Card */
  #page-pricing .quote-panel {
    position: static !important;
    max-height: none !important;
    overflow: visible !important;
    padding: 14px !important;
    border-radius: 14px !important;
    background: linear-gradient(145deg, #1c1720, #141017 65%) !important;
    border: 1px solid rgba(226, 180, 120, 0.36) !important;
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.7) !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 11px !important;
  }

  #page-pricing .quote-panel > div:first-child {
    padding-bottom: 10px !important;
    align-items: center !important;
  }

  #page-pricing #calc-title {
    font-size: 20px !important;
  }

  #page-pricing #calc-reset-btn,
  #calc-reset-btn {
    min-width: 44px !important;
    min-height: 44px !important;
    padding: 6px 12px !important;
    border-radius: 8px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  /* Compact Horizontal Estimate Summary Bar inside Calculator on Mobile */
  #page-pricing .quote-total > div:first-child {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    padding: 10px 12px !important;
    border-radius: 10px !important;
    background: rgba(11, 10, 14, 0.65) !important;
    border: 1px solid rgba(226, 180, 120, 0.25) !important;
  }

  #page-pricing #calc-total-value {
    font-size: 28px !important;
    line-height: 1.1 !important;
    color: #e2b478 !important;
    align-self: center !important;
  }

  /* Direct 1-Tap Tier Selector Pills inside Calculator on Mobile (replaces clumsy OS select) */
  #page-pricing .quote-packages,
  #page-pricing .quote-custom-base .quote-packages {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 6px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
  }

  #page-pricing #calc-stage-sel,
  #page-pricing .quote-custom-base #calc-stage-sel,
  #page-pricing #calc-dynamic-body > div:not(.quote-single-base) #calc-stage-sel {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
  }

  #calc-stage-sel,
  #quote-included-variant,
  #calc-contact,
  #calc-refs,
  #calc-deadline,
  #calc-discord,
  #calc-email {
    min-width: 44px !important;
    min-height: 44px !important;
  }

  #quote-character-count {
    min-height: 44px !important;
  }

  .compact-option-group > summary,
  .quote-breakdown > summary,
  .quote-brief > summary,
  #calc-preview-label {
    min-width: 44px !important;
    min-height: 44px !important;
    display: flex !important;
    align-items: center !important;
  }

  .quote-version-chips button,
  [data-variant-chip] {
    min-width: 44px !important;
    min-height: 44px !important;
    padding: 8px 12px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  /* Quantity rows & steppers: prevent 90px grid clipping from readability.css */
  #page-pricing .compact-options .quote-quantity-row,
  #page-pricing .quote-quantity-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 8px 0 !important;
    min-height: 48px !important;
  }

  #page-pricing .compact-options .quote-quantity-row > div:first-child,
  #page-pricing .quote-quantity-row > div:first-child {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: center !important;
    gap: 2px !important;
    min-width: 0 !important;
  }

  #page-pricing .compact-options .quote-quantity-row small,
  #page-pricing .quote-quantity-row small {
    text-align: left !important;
    max-width: none !important;
    font-size: 11px !important;
  }

  #page-pricing .compact-options .quote-stepper,
  #page-pricing .quote-stepper,
  .quote-stepper {
    width: auto !important;
    display: inline-flex !important;
    grid-template-columns: none !important;
    align-items: center !important;
    background: #0b0a0e !important;
    border: 1px solid rgba(226, 180, 120, 0.35) !important;
    border-radius: 10px !important;
    overflow: hidden !important;
    flex-shrink: 0 !important;
  }

  #page-pricing .compact-options .quote-stepper button,
  #page-pricing .quote-stepper button,
  .quote-stepper button {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    font-size: 20px !important;
    line-height: 1 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #1c1624 !important;
    color: #e2b478 !important;
    border: 0 !important;
    cursor: pointer !important;
    -webkit-tap-highlight-color: transparent !important;
    transition: background 0.12s ease !important;
  }

  #page-pricing .compact-options .quote-stepper button:active,
  #page-pricing .quote-stepper button:active,
  .quote-stepper button:active {
    background: #e2b478 !important;
    color: #0b0a0e !important;
  }

  #page-pricing .compact-options .quote-stepper input,
  #page-pricing .quote-stepper input,
  .quote-stepper input {
    width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    text-align: center !important;
    background: transparent !important;
    border: 0 !important;
    color: #f2ece4 !important;
    padding: 0 !important;
  }

  /* Full-row touch toggles & tier pills in calculator */
  #page-pricing .addon-pill,
  #page-pricing .quote-existing-label,
  #page-pricing .quote-package {
    min-width: 44px !important;
    min-height: 44px !important;
    padding: 9px 12px !important;
    border-radius: 9px !important;
    border: 1px solid rgba(226, 180, 120, 0.25) !important;
    background: #0e0c13 !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    -webkit-tap-highlight-color: transparent !important;
    transition: all 0.15s ease !important;
  }

  #page-pricing .addon-pill:active,
  #page-pricing .quote-existing-label:active {
    background: rgba(226, 180, 120, 0.08) !important;
  }

  /* Big Primary CTA Button: Copy DM Request */
  #page-pricing #calc-copy-btn {
    min-width: 44px !important;
    min-height: 48px !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    letter-spacing: 0.03em !important;
    border-radius: 10px !important;
    box-shadow: 0 4px 18px rgba(226, 180, 120, 0.35) !important;
    transition: transform 0.12s ease, background 0.15s ease !important;
  }

  #page-pricing #calc-copy-btn:active {
    transform: scale(0.98) !important;
  }

  /* Contact actions inside calculator (Open Discord / Email me) */
  #quote-contact-actions > div {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
  }

  #quote-contact-actions a,
  #quote-contact-actions button {
    min-width: 44px !important;
    min-height: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 9px !important;
    font-size: 12px !important;
  }

  /* Pricing samples grid on mobile */
  #page-pricing .pricing-samples-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
    padding: 12px !important;
  }

  #page-pricing .pricing-sample {
    min-width: 44px !important;
    min-height: 44px !important;
  }

  /* Docked Mobile Quote Bar: connects seamlessly above bottom nav */
  body[data-page="pricing"] .mobile-quote-bar {
    display: flex !important;
    position: fixed !important;
    bottom: calc(56px + var(--sab)) !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 99 !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    padding: 8px 14px !important;
    background: rgba(18, 14, 23, 0.98) !important;
    backdrop-filter: blur(16px) !important;
    -webkit-backdrop-filter: blur(16px) !important;
    border-top: 1px solid rgba(226, 180, 120, 0.35) !important;
    border-bottom: 0 !important;
    border-left: 0 !important;
    border-right: 0 !important;
    border-radius: 0 !important;
    box-shadow: 0 -4px 18px rgba(0, 0, 0, 0.7) !important;
    transform: translateZ(0);
    transition: opacity 0.25s ease, transform 0.25s ease !important;
  }

  body[data-page="pricing"] .mobile-quote-bar.quote-bar-hidden {
    opacity: 0 !important;
    pointer-events: none !important;
    transform: translateY(20px) !important;
  }

  .mobile-quote-info {
    display: flex !important;
    align-items: baseline !important;
    gap: 8px !important;
    min-width: 0 !important;
  }

  .mobile-quote-label {
    font-size: 11px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    color: #b7ae9f !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .mobile-quote-amount {
    font-size: 20px !important;
    font-weight: 700 !important;
    color: #e2b478 !important;
    flex-shrink: 0 !important;
  }

  .mobile-quote-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    padding: 10px 14px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    border-radius: 8px !important;
    background: #e2b478 !important;
    color: #0b0a0e !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    border: 0 !important;
    white-space: nowrap !important;
    transition: transform 0.15s ease !important;
  }

  .mobile-quote-btn:active {
    transform: scale(0.96) !important;
  }

  /* --- CATALOG ON MOBILE: COMPACT HEADER + STRUCTURED GRID FILTERS (NO SCROLLING STRIPS) --- */
  #page-catalog.space-y-8 > :not([hidden]) ~ :not([hidden]) {
    margin-top: 12px !important;
  }

  .catalog-header-shell {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 10px !important;
    padding-bottom: 12px !important;
  }

  .catalog-header,
  .catalog-header.catalog-header-top {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: start !important;
    padding-bottom: 0 !important;
    gap: 8px 10px !important;
  }

  .catalog-title-group {
    grid-column: 1 / 2 !important;
    min-width: 0 !important;
    width: 100% !important;
  }

  .catalog-header h1 {
    font-size: 22px !important;
    line-height: 1.2 !important;
    margin: 2px 0 4px !important;
  }

  .catalog-header p {
    font-size: 12.5px !important;
    line-height: 1.45 !important;
  }

  .catalog-header > a {
    grid-column: 2 / 3 !important;
    align-self: start !important;
    min-width: 44px !important;
    min-height: 40px !important;
    display: inline-flex !important;
    align-items: center !important;
    padding: 6px 10px !important;
    border-radius: 8px !important;
    font-size: 11px !important;
    white-space: nowrap !important;
  }

  .catalog-search-wrap {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    flex: none !important;
    display: flex !important;
    align-items: center !important;
  }

  #catalog-search {
    width: 100% !important;
    min-width: 44px !important;
    min-height: 44px !important;
    height: 44px !important;
    padding: 0 14px 0 40px !important;
    border-radius: 10px !important;
  }

  #page-catalog .catalog-toolbar {
    position: sticky !important;
    top: 52px !important;
    z-index: 45 !important;
    background: rgba(13, 11, 17, 0.96) !important;
    backdrop-filter: blur(14px) !important;
    -webkit-backdrop-filter: blur(14px) !important;
    border: 1px solid rgba(226, 180, 120, 0.25) !important;
    border-radius: 12px !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 6px !important;
    padding: 8px 10px !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.75) !important;
  }

  .catalog-filter-groups {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 6px !important;
    width: 100% !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
    padding-bottom: 2px !important;
  }
  .catalog-filter-groups::-webkit-scrollbar {
    display: none !important;
  }

  .catalog-filter-divider {
    display: none !important;
  }

  #catalog-type-filters {
    display: flex !important;
    flex-shrink: 0 !important;
    gap: 6px !important;
    overflow: visible !important;
    padding-bottom: 0 !important;
    width: auto !important;
  }

  #catalog-state-filters {
    display: flex !important;
    flex-shrink: 0 !important;
    gap: 6px !important;
    overflow: visible !important;
    padding-bottom: 0 !important;
    width: auto !important;
  }

  .catalog-adult-controls {
    width: 100% !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
    padding-top: 6px !important;
    border-left: 0 !important;
    border-top: 1px solid rgba(226, 180, 120, 0.15) !important;
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    overflow-x: auto !important;
    scrollbar-width: none !important;
  }
  .catalog-adult-controls::-webkit-scrollbar {
    display: none !important;
  }

  #catalog-type-filters button,
  #catalog-state-filters button,
  #page-catalog #catalog-adult-only,
  #catalog-adult-toggle,
  #catalog-adult-toggle.site-adult-toggle {
    width: auto !important;
    flex-shrink: 0 !important;
    min-width: 44px !important;
    min-height: 44px !important;
    height: 44px !important;
    padding: 0 12px !important;
    border-radius: 8px !important;
    font-size: 11.5px !important;
    white-space: nowrap !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  #catalog-notice {
    padding: 10px 12px !important;
    font-size: 12px !important;
    line-height: 1.45 !important;
  }

  .catalog-grid {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }

  .catalog-card {
    border-radius: 14px !important;
    background: #131018 !important;
  }

  .catalog-card button,
  .catalog-card a {
    min-width: 44px !important;
    min-height: 44px !important;
  }

  #catalog-grid .catalog-art,
  .catalog-art {
    aspect-ratio: 3 / 4 !important;
  }

  .catalog-card-body {
    min-height: 0 !important;
    padding: 14px !important;
  }

  .catalog-card h2 {
    font-size: 19px !important;
    margin: 8px 0 4px !important;
  }

  /* --- CATALOG PAGINATION (CLEAN, TOUCH-FRIENDLY, NON-WRAPPING) --- */
  #catalog-pagination {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
    padding: 16px 0 !important;
    margin-top: 12px !important;
    border-top: 1px solid rgba(226, 180, 120, 0.2) !important;
  }

  #catalog-pagination span {
    order: 0 !important;
    width: auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 4px !important;
    color: #8e8880 !important;
    font-size: 14px !important;
    user-select: none !important;
  }

  #catalog-pagination button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 44px !important;
    min-height: 44px !important;
    height: 44px !important;
    padding: 0 10px !important;
    border-radius: 8px !important;
    border: 1px solid rgba(226, 180, 120, 0.28) !important;
    background: #141119 !important;
    color: #f2ece4 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    cursor: pointer !important;
    -webkit-tap-highlight-color: transparent !important;
    transition: all 0.15s ease !important;
  }

  #catalog-pagination button:hover:not(:disabled) {
    border-color: #e2b478 !important;
    color: #e2b478 !important;
    background: rgba(226, 180, 120, 0.12) !important;
  }

  #catalog-pagination button[aria-current="page"] {
    background: #e2b478 !important;
    border-color: #e2b478 !important;
    color: #0b0a0e !important;
    font-weight: 700 !important;
    box-shadow: 0 2px 10px rgba(226, 180, 120, 0.35) !important;
    opacity: 1 !important;
  }

  #catalog-pagination button:disabled:not([aria-current="page"]) {
    opacity: 0.28 !important;
    cursor: not-allowed !important;
    border-color: rgba(255, 255, 255, 0.08) !important;
  }

  #catalog-pagination small {
    flex-basis: 100% !important;
    order: 10 !important;
    text-align: center !important;
    padding-top: 8px !important;
    font-size: 11px !important;
    color: #8e8880 !important;
    font-family: var(--mono-font, monospace) !important;
    letter-spacing: 0.04em !important;
  }

  /* Catalog detail bottom sheet modal on mobile */
  #catalog-dialog[open] {
    display: block !important;
    width: 100vw !important;
    max-width: 100vw !important;
    max-height: 92dvh !important;
    border-radius: 18px 18px 0 0 !important;
    margin: auto auto 0 auto !important;
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    border-left: 0 !important;
    border-right: 0 !important;
    border-bottom: 0 !important;
  }

  .catalog-close {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    top: 12px !important;
    right: 12px !important;
    font-size: 24px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    z-index: 20 !important;
  }

  #catalog-dialog-image .catalog-art {
    height: min(38dvh, 280px) !important;
    min-height: 220px !important;
    aspect-ratio: auto !important;
  }

  .catalog-dialog-content {
    padding: 22px 18px max(28px, var(--sab)) !important;
  }

  .catalog-dialog-content h2 {
    font-size: 24px !important;
    margin: 10px 0 !important;
  }

  .catalog-dialog-actions button,
  .catalog-dialog-actions a {
    min-width: 44px !important;
    min-height: 44px !important;
    font-size: 13px !important;
    padding: 12px 14px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  /* --- GALLERY ON MOBILE: COMPACT HEADER + 3x2 CATEGORY GRID + 2-COL 18+ CONTROLS --- */
  #page-gallery.space-y-8 > :not([hidden]) ~ :not([hidden]) {
    margin-top: 14px !important;
  }

  #page-gallery > div:first-child,
  .gallery-header-shell {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 10px !important;
    padding-bottom: 12px !important;
  }

  .gallery-header-top {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 8px !important;
  }

  .gallery-title-group {
    flex: none !important;
    min-width: 0 !important;
    width: 100% !important;
  }

  #page-gallery h1 {
    font-size: 24px !important;
    line-height: 1.2 !important;
    margin: 2px 0 4px !important;
  }

  #gal-sub {
    font-size: 12.5px !important;
    line-height: 1.45 !important;
    margin: 0 !important;
  }

  .gallery-search-wrap {
    width: 100% !important;
    flex: none !important;
    display: flex !important;
    align-items: center !important;
  }

  #gallery-search {
    width: 100% !important;
    min-width: 44px !important;
    min-height: 44px !important;
    height: 44px !important;
    padding: 0 14px 0 40px !important;
    border-radius: 10px !important;
  }

  .gallery-toolbar {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 8px !important;
    padding: 10px !important;
    border-radius: 12px !important;
  }

  #gallery-category-filters {
    display: flex !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
    gap: 6px !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    padding-bottom: 2px !important;
  }
  #gallery-category-filters::-webkit-scrollbar {
    display: none !important;
  }

  .gal-filter-btn,
  #gallery-category-filters > button,
  #page-gallery #gallery-adult-only,
  .adult-only-filter {
    width: auto !important;
    flex-shrink: 0 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    min-width: 44px !important;
    min-height: 44px !important;
    height: 44px !important;
    padding: 0 12px !important;
    border-radius: 8px !important;
    font-size: 11.5px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .gallery-adult-controls {
    width: 100% !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
    padding-top: 8px !important;
    border-left: 0 !important;
    border-top: 1px solid rgba(226, 180, 120, 0.16) !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    align-items: center !important;
    gap: 6px !important;
  }

  label:has(#nsfw-switch),
  #page-gallery .site-adult-toggle {
    width: 100% !important;
    min-width: 44px !important;
    min-height: 44px !important;
    height: 44px !important;
    padding: 0 8px !important;
    border-radius: 8px !important;
    font-size: 11.5px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  #nsfw-modal button,
  #mod-btn-no,
  #mod-btn-yes,
  #lb-close,
  #lb-pricing-link {
    min-width: 44px !important;
    min-height: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  #gal-ext-platforms > * {
    min-width: 44px !important;
    min-height: 44px !important;
  }

  #gallery-cards-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }

  #gallery-cards-grid > button {
    min-width: 44px !important;
    min-height: 44px !important;
    border-radius: 10px !important;
    overflow: hidden !important;
  }

  #gallery-cards-grid > button > div:first-child {
    aspect-ratio: 3 / 4 !important;
  }

  #gallery-cards-grid > button .gallery-card-caption {
    padding: 10px 10px 12px !important;
    min-height: 98px !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    gap: 6px !important;
  }

  #gallery-cards-grid > button .gallery-card-caption h3 {
    font-size: 14px !important;
    line-height: 1.3 !important;
    margin: 0 0 3px !important;
  }

  #gallery-cards-grid > button p {
    font-size: 11px !important;
    line-height: 1.35 !important;
  }

  /* --- ARTWORK VIEWER & PROCESS VIEWER ON MOBILE --- */
  #artwork-dialog[open] {
    display: flex !important;
    flex-direction: column !important;
    width: 100vw !important;
    height: 100dvh !important;
    max-width: 100vw !important;
    max-height: 100dvh !important;
    border-radius: 0 !important;
    border: 0 !important;
    inset: 0 !important;
    position: fixed !important;
    margin: 0 !important;
  }

  .artwork-modal-header {
    padding: max(10px, var(--sat)) 14px 10px !important;
    min-height: 54px !important;
    flex-shrink: 0 !important;
  }

  .artwork-modal-header h2 {
    font-size: 17px !important;
    line-height: 1.25 !important;
  }

  .artwork-modal-buttons button {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    font-size: 20px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  #artwork-dialog-prices {
    min-width: 44px !important;
    min-height: 44px !important;
    padding: 8px 14px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  #artwork-dialog-body {
    flex: 1 1 auto !important;
    overflow-y: auto !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    min-height: 0 !important;
  }

  #artwork-dialog-image {
    max-height: 54dvh !important;
    width: 100% !important;
    object-fit: contain !important;
    margin: auto !important;
  }

  /* Ensure #art-process .viewer never collapses horizontally on mobile */
  #artwork-dialog #art-process {
    padding: 12px 14px !important;
    width: 100% !important;
    margin: auto 0 !important;
  }

  #artwork-dialog #art-process .viewer {
    width: min(100%, calc(44dvh * 0.75)) !important;
    max-width: 420px !important;
    height: auto !important;
    max-height: 44dvh !important;
    aspect-ratio: 3 / 4 !important;
    margin-inline: auto !important;
  }

  #page-pricing #art-process .viewer {
    width: 100% !important;
    max-width: 420px !important;
    height: auto !important;
    max-height: 52dvh !important;
    aspect-ratio: 3 / 4 !important;
    margin-inline: auto !important;
  }

  #art-process .phases {
    grid-template-columns: repeat(auto-fit, minmax(92px, 1fr)) !important;
    gap: 6px !important;
  }

  #art-process .phases .phase,
  #art-process .controls button {
    min-width: 44px !important;
    min-height: 44px !important;
    padding: 8px 10px !important;
    font-size: 11.5px !important;
    border: 1px solid rgba(226, 180, 120, 0.2) !important;
  }

  .artwork-modal-footer {
    padding: 10px 14px max(14px, var(--sab)) !important;
    flex-shrink: 0 !important;
  }

  #artwork-work-strip {
    padding: 10px 14px !important;
    gap: 8px !important;
    flex-shrink: 0 !important;
  }

  #artwork-work-strip button {
    flex: 0 0 106px !important;
    width: 106px !important;
    max-width: 106px !important;
    min-width: 44px !important;
    min-height: 44px !important;
  }

  #artwork-work-strip .strip-media {
    height: 82px !important;
  }

  #artwork-work-strip .strip-title {
    min-height: 44px !important;
    padding: 6px 8px !important;
    font-size: 11px !important;
    line-height: 1.3 !important;
  }

  /* --- QUEUE (CARD LAYOUT ACROSS ALL MOBILE VIEWPORTS <=860PX) --- */
  .queue-overview {
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
  }

  .queue-overview > div {
    padding: 14px 16px !important;
  }

  .queue-overview strong {
    font-size: 26px !important;
  }

  .queue-sync {
    grid-column: 1 / -1 !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 10px !important;
  }

  .queue-sync button {
    width: 100% !important;
    min-width: 44px !important;
    min-height: 44px !important;
    font-size: 12px !important;
    justify-content: center !important;
  }

  .queue-tabs {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
    width: 100% !important;
  }

  .queue-tabs button {
    min-width: 44px !important;
    min-height: 44px !important;
    text-align: center !important;
  }

  #page-queue .overflow-x-auto {
    border: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    background: transparent !important;
  }

  #page-queue table {
    display: block !important;
    min-width: 0 !important;
    width: 100% !important;
  }

  #page-queue thead {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip-path: inset(50%) !important;
  }

  #queue-table-body {
    display: grid !important;
    gap: 12px !important;
  }

  #queue-table-body tr {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 14px 16px !important;
    border: 1px solid rgba(226, 180, 120, 0.25) !important;
    border-radius: 12px !important;
    background: #141017 !important;
    padding: 16px !important;
  }

  #queue-table-body td {
    display: block !important;
    padding: 0 !important;
    font-size: 13px !important;
    min-width: 0 !important;
    white-space: normal !important;
  }

  #queue-table-body td:nth-child(2),
  #queue-table-body td:nth-child(5),
  #queue-table-body .queue-message {
    grid-column: 1 / -1 !important;
  }

  #queue-table-body td::before {
    content: attr(data-label);
    display: block;
    font-family: var(--ui-font);
    font-size: 11px;
    letter-spacing: 0.02em;
    color: #b7ae9f;
    margin-bottom: 4px;
  }

  #queue-table-body td.queue-message::before {
    display: none !important;
  }

  .reservation-info > a {
    width: 100% !important;
    min-width: 44px !important;
    min-height: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
  }

  /* --- TERMS OF SERVICE & FAQ --- */
  .tos-consent {
    width: 100% !important;
    min-width: 44px !important;
    min-height: 48px !important;
    padding: 12px 14px !important;
  }

  #tos-cards-grid {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }

  #tos-cards-grid > .card {
    padding: 18px 16px !important;
  }

  #tos-contents {
    gap: 8px !important;
  }

  #tos-contents a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 44px !important;
    min-height: 44px !important;
    padding: 8px 14px !important;
    border: 1px solid rgba(226, 180, 120, 0.25) !important;
    border-radius: 22px !important;
    background: #141018 !important;
    font-size: 12px !important;
    text-decoration: none !important;
    color: #d3c8bc !important;
  }

  .tos-detail {
    padding: 18px 16px !important;
  }

  .tos-detail h3 {
    font-size: 20px !important;
  }

  #page-faq > div:first-child {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  #faq-cat-buttons {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 6px !important;
    overflow: visible !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    padding-bottom: 0 !important;
  }

  #faq-cat-buttons button {
    width: 100% !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    min-width: 44px !important;
    min-height: 44px !important;
    height: 44px !important;
    padding: 0 8px !important;
    border-radius: 8px !important;
    font-size: 11.5px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  #page-faq details summary {
    min-width: 44px !important;
    min-height: 48px !important;
    padding: 14px 16px !important;
    font-size: 15px !important;
  }

  /* --- EMAIL DIALOG --- */
  #email-contact-dialog {
    width: min(400px, calc(100vw - 28px)) !important;
    padding: 22px 18px max(20px, var(--sab)) !important;
  }

  #email-contact-close {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  #email-contact-dialog > div {
    grid-template-columns: 1fr !important;
  }

  #email-contact-dialog > div button,
  #email-contact-dialog > div a {
    min-width: 44px !important;
    min-height: 44px !important;
    font-size: 13px !important;
  }
}

@media (max-width: 380px) {
  header.sticky > a:first-child span:first-child {
    font-size: 20px !important;
  }
  header.sticky > div:last-of-type {
    gap: 4px !important;
  }
  header.sticky a.intake-link,
  header.sticky a:has(#header-queue-counter) {
    display: none !important;
  }
  #primary-contacts-grid {
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 8px !important;
  }
  #page-pricing .ptab-btn {
    min-width: 44px !important;
    min-height: 46px !important;
    font-size: 10.5px !important;
    padding: 7px 4px !important;
  }
}

/* =====================================================================
   UNIFIED LUXURY ANIMATION & MICRO-INTERACTION SYSTEM
====================================================================== */

/* 1. Details & Accordions (FAQ, ToS, Pricing Brief) */
details summary {
  cursor: pointer;
  transition: color 0.2s cubic-bezier(0.16, 1, 0.3, 1);
  user-select: none;
}
details summary:hover {
  color: #E2B478 !important;
}
details[open] summary {
  color: #E2B478;
}
@keyframes accordionSlideDown {
  from {
    opacity: 0;
    transform: translateY(-8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
details[open] > *:not(summary) {
  animation: accordionSlideDown 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}

/* 2. Dialogs & Overlays */
dialog[open] {
  animation: modalScaleIn 0.28s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
@keyframes modalScaleIn {
  from {
    opacity: 0;
    transform: scale(0.96) translateY(10px);
  }
  to {
    opacity: 1;
    transform: scale(1) translateY(0);
  }
}
dialog::backdrop {
  animation: backdropFade 0.25s ease !important;
}
@keyframes backdropFade {
  from { opacity: 0; }
  to { opacity: 1; }
}

/* 3. Smooth Page/Tab Switch Transition */
@keyframes pageFadeIn {
  from {
    opacity: 0;
    transform: translateY(6px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.page-section:not(.hidden) {
  animation: pageFadeIn 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}

/* 4. Touch & Click Tactile Micro-Interactions */
.catalog-filters button,
.gallery-filter,
.queue-tabs button,
.lang-trigger-btn,
.quote-cta,
.ptab-btn {
  transition: transform 0.18s cubic-bezier(0.16, 1, 0.3, 1), background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease !important;
}
.catalog-filters button:active,
.gallery-filter:active,
.queue-tabs button:active,
.lang-trigger-btn:active,
.quote-cta:active {
  transform: scale(0.95) !important;
}

/* 5. Reduced Motion */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* =====================================================================
   CALCULATOR CLEANUP & BUG FIXES
====================================================================== */
/* Fix double borders on addon-pill */
#page-pricing .addon-pill > div {
  border: none !important;
  background: transparent !important;
  padding: 0 !important;
  width: 100% !important;
}
#page-pricing .addon-pill,
#page-pricing .quote-package {
  border: 1px solid rgba(226, 180, 120, 0.22) !important;
  background: #121118 !important;
  border-radius: 10px !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
#page-pricing .addon-pill:hover,
#page-pricing .quote-package:hover {
  border-color: rgba(226, 180, 120, 0.45) !important;
  background: #16151E !important;
  transform: translateY(-1px);
}
#page-pricing .addon-pill:has(input:checked),
#page-pricing .quote-package:has(input:checked) {
  border-color: #E2B478 !important;
  background: rgba(226, 180, 120, 0.1) !important;
}
/* Ensure package options are properly displayed on both desktop and mobile */
#page-pricing .quote-packages {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 8px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}
#page-pricing #calc-stage-sel {
  display: none !important;
}

/* =====================================================================
   FAQ ANIMATIONS & POLISH
====================================================================== */
#faq-cat-buttons button {
  border-radius: 8px !important;
  transition: transform 0.2s cubic-bezier(0.16, 1, 0.3, 1), background 0.2s ease, border-color 0.2s ease, color 0.2s ease !important;
}
#faq-cat-buttons button:hover {
  border-color: #E2B478 !important;
  transform: translateY(-2px);
}
#faq-cat-buttons button:active {
  transform: scale(0.95);
}

#faq-items-list > details.card {
  border-radius: 12px !important;
  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.25s ease, box-shadow 0.25s ease !important;
  overflow: hidden;
}
#faq-items-list > details.card:hover {
  transform: translateY(-3px) !important;
  border-color: rgba(226, 180, 120, 0.45) !important;
  box-shadow: 0 8px 24px -4px rgba(0, 0, 0, 0.6), 0 0 16px -2px rgba(226, 180, 120, 0.12) !important;
}
#faq-items-list > details[open] {
  border-color: rgba(226, 180, 120, 0.5) !important;
  background: #14121a !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5) !important;
}
#faq-items-list details summary span.text-accent,
#faq-items-list details summary span.mono {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  height: auto !important;
  padding: 0 4px !important;
  border-radius: 0 !important;
  background: transparent !important;
  border: none !important;
  font-family: var(--font-mono, 'JetBrains Mono', monospace) !important;
  font-size: 24px !important;
  font-weight: 300 !important;
  line-height: 1 !important;
  color: #E2B478 !important;
  transition: transform 0.28s cubic-bezier(0.16, 1, 0.3, 1), color 0.2s ease, text-shadow 0.2s ease !important;
}
#faq-items-list details summary:hover span.text-accent,
#faq-items-list details summary:hover span.mono {
  color: #F5C98E !important;
  text-shadow: 0 0 10px rgba(226, 180, 120, 0.5) !important;
}
#faq-items-list details[open] summary span.text-accent,
#faq-items-list details[open] summary span.mono {
  transform: rotate(45deg) !important;
  background: transparent !important;
  color: #E2B478 !important;
  border: none !important;
}
#faq-items-list details summary {
  user-select: none;
  transition: color 0.2s ease;
}
#faq-items-list details summary:hover {
  color: #FFFFFF !important;
}
#faq-items-list > details[open] summary {
  color: #FFFFFF !important;
}
#faq-items-list details[open] > p {
  animation: faqExpand 0.28s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
@keyframes faqExpand {
  from {
    opacity: 0;
    transform: translateY(-8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* =====================================================================
   TOS ANIMATIONS & POLISH
====================================================================== */
#tos-cards-grid > .card {
  border-radius: 12px !important;
  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.25s ease, box-shadow 0.25s ease !important;
  position: relative;
  overflow: hidden;
}
#tos-cards-grid > .card:hover {
  transform: translateY(-4px) !important;
  border-color: rgba(226, 180, 120, 0.5) !important;
  box-shadow: 0 10px 28px -4px rgba(0, 0, 0, 0.7), 0 0 16px -2px rgba(226, 180, 120, 0.15) !important;
}
#tos-cards-grid > .card .mono {
  display: inline-block;
  transition: transform 0.2s ease, text-shadow 0.2s ease;
}
#tos-cards-grid > .card:hover .mono {
  transform: scale(1.08);
  text-shadow: 0 0 8px rgba(226, 180, 120, 0.6);
}

.tos-consent {
  border-radius: 10px !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
.tos-consent:hover {
  border-color: #E2B478 !important;
  background: rgba(226, 180, 120, 0.08) !important;
}
.tos-consent:active {
  transform: scale(0.98);
}

#tos-will-list li, #tos-wont-list li {
  transition: transform 0.18s ease, color 0.18s ease;
}
#tos-will-list li:hover {
  transform: translateX(4px);
  color: #e6dfd5;
}
#tos-wont-list li:hover {
  transform: translateX(4px);
  color: #fca5a5;
}

#tos-detailed-sections .tos-detail {
  border-radius: 12px !important;
  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.25s ease, box-shadow 0.25s ease !important;
}
#tos-detailed-sections .tos-detail:hover {
  transform: translateY(-2px) !important;
  border-color: rgba(226, 180, 120, 0.4) !important;
  box-shadow: 0 6px 20px -2px rgba(0, 0, 0, 0.6), 0 0 12px -2px rgba(226, 180, 120, 0.1) !important;
}
#tos-contents a {
  position: relative;
  transition: color 0.2s ease !important;
}
#tos-contents a::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 0;
  height: 1px;
  background: #E2B478;
  transition: width 0.25s ease;
}
#tos-contents a:hover::after {
  width: 100%;
}

#tos-cards-grid > .card::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(226, 180, 120, 0.5), transparent);
  opacity: 0;
  transition: opacity 0.3s ease;
  pointer-events: none;
}
#tos-cards-grid > .card:hover::after {
  opacity: 1;
}

/* =====================================================================
   ADDITIONAL SITE-WIDE MICRO-ANIMATIONS & INTERACTION REFINEMENTS
====================================================================== */
/* Pricing tier card selection pulse */
.quote-selected {
  border-color: #E2B478 !important;
  background: rgba(226, 180, 120, 0.08) !important;
  box-shadow: 0 8px 30px -4px rgba(0, 0, 0, 0.7), 0 0 20px -2px rgba(226, 180, 120, 0.22) !important;
  animation: tierCardSelect 0.28s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
@keyframes tierCardSelect {
  0% { transform: scale(0.98); }
  50% { transform: scale(1.02); }
  100% { transform: scale(1); }
}

/* Addon pills smooth interactive spring */
.addon-pill {
  transition: transform 0.18s cubic-bezier(0.16, 1, 0.3, 1), background-color 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease !important;
}
.addon-pill:hover {
  transform: translateY(-1px) !important;
  border-color: rgba(226, 180, 120, 0.45) !important;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.4) !important;
}
.addon-pill:active {
  transform: scale(0.97) !important;
}

/* Hero Quick Navigation cards arrow nudge */
#page-board .hero-copy a.card svg,
#page-board .hero-copy .card a svg {
  transition: transform 0.22s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
#page-board .hero-copy a.card:hover svg,
#page-board .hero-copy .card a:hover svg {
  transform: translateX(4px) !important;
}

/* Dialog modals smooth scale-in */
dialog#artwork-dialog[open],
dialog#catalog-dialog[open] {
  animation: dialogScaleIn 0.25s cubic-bezier(0.16, 1, 0.3, 1) forwards !important;
}
@keyframes dialogScaleIn {
  from {
    opacity: 0;
    transform: scale(0.96) translateY(8px);
  }
  to {
    opacity: 1;
    transform: scale(1) translateY(0);
  }
}

/* =====================================================================
   PROMINENT NEXT STEP AFTER COPYING BRIEF
====================================================================== */
#quote-contact-actions {
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

#quote-contact-actions.request-copied-active {
  background: linear-gradient(145deg, #1f1927, #130f1a) !important;
  border: 1px solid rgba(226, 180, 120, 0.6) !important;
  box-shadow: 0 14px 40px -4px rgba(0, 0, 0, 0.85), 0 0 24px -2px rgba(226, 180, 120, 0.22) !important;
  border-radius: 14px !important;
  padding: 18px 20px !important;
  margin-top: 14px !important;
  animation: nextStepBloom 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

@keyframes nextStepBloom {
  0% { transform: scale(0.96); opacity: 0.8; }
  50% { transform: scale(1.02); }
  100% { transform: scale(1); opacity: 1; }
}

#quote-contact-actions.request-copied-active::before {
  content: '✓ STEP 2: SEND YOUR REQUEST TO NEK’TAHR';
  display: block;
  font-family: var(--font-mono, monospace);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.08em;
  color: #48c87b;
  margin-bottom: 12px;
}
:lang(ru) #quote-contact-actions.request-copied-active::before {
  content: '✓ ШАГ 2: ОТПРАВЬТЕ ЗАЯВКУ ХУДОЖНИКУ';
}
:lang(es) #quote-contact-actions.request-copied-active::before {
  content: '✓ PASO 2: ENVÍA TU SOLICITUD AL ARTISTA';
}

#quote-contact-actions.request-copied-active #quote-discord {
  background: #5865F2 !important;
  color: #ffffff !important;
  border-color: #5865F2 !important;
  font-weight: 600 !important;
  box-shadow: 0 4px 18px rgba(88, 101, 242, 0.45) !important;
  transform: scale(1.02);
  transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}
#quote-contact-actions.request-copied-active #quote-discord:hover {
  transform: scale(1.05);
  box-shadow: 0 6px 24px rgba(88, 101, 242, 0.65) !important;
}

#quote-contact-actions.request-copied-active #quote-email {
  border-color: rgba(226, 180, 120, 0.45) !important;
  background: rgba(226, 180, 120, 0.12) !important;
}

/* =====================================================================
   ELEGANT QUEUE LOADING SKELETON & FALLBACK STATES
====================================================================== */
.skeleton-shimmer {
  background: linear-gradient(90deg, rgba(226, 180, 120, 0.05) 25%, rgba(226, 180, 120, 0.18) 50%, rgba(226, 180, 120, 0.05) 75%) !important;
  background-size: 200% 100% !important;
  animation: queueSkeletonShimmer 1.8s infinite linear !important;
}
@keyframes queueSkeletonShimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

.queue-skeleton-row td {
  padding: 18px 14px !important;
  vertical-align: middle !important;
}

.queue-error-box {
  padding: 35px 20px !important;
  text-align: center !important;
}

.queue-error-link {
  display: inline-flex !important;
  align-items: center !important;
  padding: 8px 16px !important;
  border-radius: 8px !important;
  border: 1px solid rgba(226, 180, 120, 0.4) !important;
  background: rgba(226, 180, 120, 0.1) !important;
  color: #E2B478 !important;
  font-family: var(--font-mono, monospace) !important;
  font-size: 11px !important;
  text-decoration: none !important;
  transition: all 0.2s ease !important;
}
.queue-error-link:hover {
  background: rgba(226, 180, 120, 0.2) !important;
  border-color: #E2B478 !important;
  transform: translateY(-1px) !important;
}

/* Header queue badge elegance */
header.sticky a:has(#header-queue-counter) {
  border-radius: 6px !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
#header-queue-counter[data-state="loading"],
#header-queue-counter:empty {
  letter-spacing: 0.05em;
  color: #E2B478 !important;
  opacity: 0.9 !important;
}
#header-queue-counter[data-state="error"] {
  color: #ffd166 !important;
}
header.sticky a:has(#header-queue-counter[data-state="error"]) {
  border-color: rgba(255, 209, 102, 0.35) !important;
  background: rgba(255, 209, 102, 0.08) !important;
}

/* =====================================================================
   GALLERY LOAD MORE BUTTON
====================================================================== */
#gallery-load-more-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 46px !important;
  padding: 12px 24px !important;
  font-size: 12px !important;
  letter-spacing: 0.08em !important;
  border: 1px solid rgba(226, 180, 120, 0.45) !important;
  background: rgba(226, 180, 120, 0.08) !important;
  color: #E2B478 !important;
  border-radius: 10px !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.4) !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
#gallery-load-more-btn:hover {
  background: rgba(226, 180, 120, 0.16) !important;
  border-color: #E2B478 !important;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.5), 0 0 16px rgba(226, 180, 120, 0.15) !important;
  transform: translateY(-2px) !important;
}
#gallery-load-more-btn:active {
  transform: scale(0.97) !important;
}