.neo-box,
.neo-box-inset,
.neo-btn,
.neo-btn:hover,
.neo-btn:active,
.neo-btn-active,
.prep-bg,
.form-bg,
.hero-bg-tile,
.heart-icon,
.favorite-icon,
.fav-icon,
[class*="heart"],
[class*="favorite"],
.rounded-l-2xl,
.rounded-r-2xl,
.rounded-t-2xl,
.rounded-b-2xl {
  border-radius: 12px !important;
  overflow: hidden;
}

body {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  /* Full-screen, non-scrolling background image */
  background-image: url('assets/Background.webp');
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-color: #0c0a09; /* Fallback color if image fails to load */
}

.cv-auto {
  content-visibility: auto;
  contain-intrinsic-size: 1px 900px;
}

.media-loop {
  backface-visibility: hidden;
  transform: translateZ(0);
  will-change: transform, opacity;
}

/* Neumorphic & Soft UI Glass styles matching the master theme */
.neo-box {
  background: #ffffff;
  color: #1c1917;
  box-shadow: 
    12px 12px 30px rgba(0, 0, 0, 0.4),
    -6px -6px 20px rgba(255, 255, 255, 0.05);
}

.prep-bg,
.form-bg,
.hero-bg-tile {
  background-position: right top !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
  background-attachment: fixed !important;
  opacity: 1 !important;
  height: 100% !important;
  width: 100% !important;
}

@media (max-width: 1024px), (prefers-reduced-motion: reduce) {
  body,
  .prep-bg,
  .form-bg,
  .hero-bg-tile {
    background-attachment: scroll !important;
  }
}

.neo-box-inset {
  background: #e7e5e4;
  box-shadow: 
    inset 3px 3px 6px rgba(0, 0, 0, 0.2),
    inset -3px -3px 6px rgba(255, 255, 255, 0.7);
}

.neo-btn {
  background: #f5f5f4;
  box-shadow: 
    4px 4px 10px rgba(0, 0, 0, 0.15),
    -3px -3px 8px rgba(255, 255, 255, 0.8);
  transition: all 0.2s ease;
}

.neo-btn:hover {
  box-shadow: 
    2px 2px 5px rgba(0, 0, 0, 0.2),
    -1px -1px 4px rgba(255, 255, 255, 0.9);
  transform: translateY(1px);
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.neo-btn:active, .neo-btn-active {
  background: #e7e5e4;
  box-shadow: 
    inset 3px 3px 6px rgba(0, 0, 0, 0.25),
    inset -2px -2px 5px rgba(255, 255, 255, 0.8);
}

.detail-toggle img {
  filter: invert(1);
}

.toggle-icon {
  z-index: 20;
  pointer-events: auto;
}

/* Keep right-side floating tab squared on the page edge. */
.right-edge-square {
  border-radius: 12px 0 0 12px !important;
}

/* Custom Scrollbar */
html {
  scrollbar-width: none;
  -ms-overflow-style: none;
}

html::-webkit-scrollbar {
  display: none;
}

body {
  scrollbar-width: none;
  -ms-overflow-style: none;
}

body::-webkit-scrollbar {
  display: none;
}