/* Shared polished-glass finish. Reflections are decorative and never catch input. */
:root {
  --mirror-edge: rgba(255, 236, 184, .24);
  --mirror-shadow: inset 0 1px 0 rgba(255, 248, 224, .17), inset 0 -1px 0 rgba(0, 0, 0, .28), 0 10px 28px rgba(0, 0, 0, .2);
}

body :is(.site-header, .editorial-header, .showcase-story-topbar, footer) {
  box-shadow: inset 0 1px 0 var(--mirror-edge), inset 0 -1px 0 rgba(255, 231, 178, .1), 0 8px 28px #0003;
}
body :is(.panel, .stats > div, .directory-card, .showcase-category-card,
  .showcase-search, .showcase-profile-contact, .showcase-service-item,
  .reviews-section, .review-entry, .bank, .showcase-empty, .showcase-stories-empty,
  .showcase-profile-cover, .showcase-profile-gallery > a, .showcase-story-card) {
  box-shadow: var(--mirror-shadow);
}
body :is(.panel, .stats > div, .directory-card, .showcase-category-card,
  .showcase-search, .showcase-profile-contact, .showcase-service-item,
  .reviews-section, .review-entry, .bank, .showcase-empty, .showcase-stories-empty) {
  position: relative;
  isolation: isolate;
}
body :is(.panel, .stats > div, .directory-card, .showcase-category-card,
  .showcase-search, .showcase-profile-contact, .showcase-service-item,
  .reviews-section, .review-entry, .bank, .showcase-empty, .showcase-stories-empty)::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 2;
  border-radius: inherit;
  pointer-events: none;
  background: linear-gradient(118deg, transparent 38%, #fff3d008 44%, #ffffff1c 49%, #f7d38c14 52%, transparent 61%) 100% 0 / 260% 100% no-repeat;
  animation: sd-mirror-arrival 14s ease-in-out 1 both;
}
body :is(.panel, .stats > div, .directory-card, .showcase-category-card,
  .showcase-search, .showcase-profile-contact, .showcase-service-item,
  .reviews-section, .review-entry, .bank, .showcase-empty, .showcase-stories-empty):is(:hover, :focus-within)::after {
  animation: sd-mirror-sweep 5s ease-in-out infinite;
}
body .directory-card:nth-child(2n)::after { animation-delay: .65s; }
body .directory-card:nth-child(3n)::after { animation-delay: 1.3s; }

/* Actions retain their existing fuchsia or outlined background. */
body :is(.btn, .editorial-button, .editorial-account, .showcase-welcome-form button,
  .showcase-search > button, .panel button, .age-actions button) {
  position: relative;
  isolation: isolate;
  box-shadow: inset 0 1px 0 #fff4d142, inset 0 -2px 0 #40002135, 0 6px 20px #0002;
}
body :is(.btn, .editorial-button, .editorial-account, .showcase-welcome-form button,
  .showcase-search > button, .panel button, .age-actions button, .support-float)::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background: linear-gradient(110deg, transparent 38%, #fff8e01a 45%, #ffffff55 49%, #ffd78c20 53%, transparent 61%) 100% 0 / 300% 100% no-repeat;
  animation: sd-mirror-sweep 13s ease-in-out infinite;
}
body :is(.btn, button):disabled::after { animation: none; opacity: .15; }
body :is(input, textarea, select) { box-shadow: inset 0 1px 2px #0005, inset 0 1px 0 #fff1d316; }
body :is(input[type=checkbox], input[type=radio]) { box-shadow: none; }
body :is(.showcase-profile-cover, .showcase-profile-gallery > a, .showcase-story-card) {
  border-color: #dac18a65;
}
body .showcase-story-ring {
  box-shadow: inset 0 1px 0 #fff1cbb3, 0 0 0 1px #f5cb7a38, 0 8px 23px #0005;
}
body .showcase-story-ring::after {
  content: '';
  position: absolute;
  inset: 4px;
  border-radius: 50%;
  pointer-events: none;
  background: linear-gradient(125deg, transparent 34%, #fff4df21 49%, transparent 64%) 100% 0 / 260% 100% no-repeat;
  animation: sd-mirror-sweep 17s ease-in-out infinite;
}

/* Keep the entire temple in place; only its light reflection moves. */
.showcase-welcome::after {
  content: '';
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: linear-gradient(114deg, transparent 37%, #fff8df08 44%, #fff6d62b 49%, #ffffff38 50%, #fcd6ea10 55%, transparent 64%) 100% 0 / 260% 100% no-repeat;
  animation: sd-mirror-sweep 18s ease-in-out infinite;
}
.showcase-welcome-inner { position: relative; z-index: 1; }
.showcase-welcome-content { border-radius: 22px; }

@supports (mask-image: url('/static/brand/sexydiosas-logo.webp')) or (-webkit-mask-image: url('/static/brand/sexydiosas-logo.webp')) {
  body .brand-lockup::after {
    content: '';
    position: absolute;
    width: 113.4%;
    aspect-ratio: 1.5;
    left: -6.7%;
    top: 50%;
    transform: translateY(-48%);
    pointer-events: none;
    background: linear-gradient(115deg, transparent 42%, #ffedbf55 47%, #fffdf2 50%, #ffedbf55 53%, transparent 58%) 100% 0 / 300% 100% no-repeat;
    -webkit-mask: url('/static/brand/sexydiosas-logo.webp?v=white-gold-logo-v1') center / 100% 100% no-repeat;
    mask: url('/static/brand/sexydiosas-logo.webp?v=white-gold-logo-v1') center / 100% 100% no-repeat;
    opacity: .65;
    animation: sd-mirror-sweep 15s ease-in-out infinite;
  }
}

/* A native CSS-only pause works on every page, including the welcome dialog. */
.mirror-motion-switch {
  position: fixed;
  left: max(12px, env(safe-area-inset-left));
  bottom: max(12px, env(safe-area-inset-bottom));
  z-index: 120;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 40px;
  margin: 0;
  padding: 8px 11px;
  border: 1px solid #bfa36e75;
  border-radius: 22px;
  background: #121015ed;
  color: #fff;
  font: 500 11px/1.4 Arial, sans-serif;
  cursor: pointer;
  box-shadow: 0 3px 16px #0004;
}
.mirror-motion-switch input { appearance: auto; flex: 0 0 14px; width: 14px; height: 14px; margin: 0; padding: 0; accent-color: #d51b72; }
.mirror-motion-switch:has(input:focus-visible) { outline: 3px solid #f2c979; outline-offset: 3px; }
.mirror-motion-switch:has(input:checked) { border-color: #f2c979; }
body.welcome-open > .mirror-motion-switch { display: none; }
.showcase-welcome .mirror-motion-switch { z-index: 3; }
.hero-motion-toggle { display: none; }
body:has(.mirror-motion-switch input:checked) *,
body:has(.mirror-motion-switch input:checked) *::before,
body:has(.mirror-motion-switch input:checked) *::after { animation-play-state: paused !important; }

@keyframes sd-mirror-sweep {
  0%, 7% { background-position: 100% 0; }
  35%, 100% { background-position: 0 0; }
}
@keyframes sd-mirror-arrival {
  0%, 7% { background-position: 100% 0; }
  55%, 100% { background-position: 0 0; }
}
@media (prefers-reduced-motion: reduce) {
  body *, body *::before, body *::after { animation: none !important; }
  .mirror-motion-switch { display: none !important; }
  .showcase-welcome::after { opacity: .35; background-position: 45% 0; }
}