/* Component styles only. No global selectors or external dependencies. */
.skin-footer {
  --skin-bg: #05090d;
  --skin-opacity: .88;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: var(--skin-bg);
  color: #f5f8fa;
}
.skin-footer__scene {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
  contain: strict;
  opacity: var(--skin-opacity);
}
.skin-footer__image {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: 50% 46%;
  transform-origin: 0 0;
}
.skin-footer__image[data-ready] { will-change: transform; }
.skin-footer__veil {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  /* Minimum 64% darkness: white text stays readable over any source pixel. */
  background:
    linear-gradient(90deg, rgba(5,9,13,.70), rgba(5,9,13,.18) 65%, transparent),
    linear-gradient(180deg, rgba(5,9,13,.48), transparent 30%, rgba(5,9,13,.40)),
    rgba(5,9,13,.64);
}
.skin-footer__content { position: relative; z-index: 2; }
.skin-footer__motion {
  position: absolute;
  z-index: 3;
  right: 24px;
  bottom: 20px;
  min-height: 44px;
  border: 1px solid #6d7a82;
  border-radius: 999px;
  padding: 8px 14px;
  color: #f5f8fa;
  background: #0a121ce6;
  font: 12px/1.3 system-ui, sans-serif;
  cursor: pointer;
}
.skin-footer__motion:focus-visible { outline: 2px solid #b5f5cc; outline-offset: 4px; }
.skin-footer__motion:disabled { cursor: default; }
@media (prefers-reduced-motion: reduce) {
  .skin-footer__image[data-ready] { will-change: auto; }
}
