:root { color-scheme: light; }

/* Micro-grain ultra léger (Apple-like) */
.soft-grain {
  background-image:
    radial-gradient(circle at 20% 10%, rgba(99,102,241,.10), transparent 45%),
    radial-gradient(circle at 80% 30%, rgba(14,165,233,.10), transparent 50%),
    radial-gradient(circle at 40% 80%, rgba(16,185,129,.08), transparent 55%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='220' height='220' filter='url(%23n)' opacity='.12'/%3E%3C/svg%3E");
  background-size: cover, cover, cover, 320px 320px;
  background-blend-mode: multiply, multiply, multiply, overlay;
}

.glass {
  background: rgba(255,255,255,.70);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: 1px solid rgba(15,23,42,.10);
}

.hairline {
  background: linear-gradient(90deg, rgba(2,6,23,0), rgba(2,6,23,.14), rgba(2,6,23,0));
}

.shadow-apple {
  box-shadow:
    0 0 0 1px rgba(15,23,42,.05),
    0 30px 80px rgba(2,6,23,.08),
    0 10px 30px rgba(2,6,23,.06);
}

.img-sheen::after{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(120deg, rgba(255,255,255,.0), rgba(255,255,255,.30), rgba(255,255,255,.0));
  transform: translateX(-60%);
  opacity:.0;
  transition: transform 900ms ease, opacity 900ms ease;
  pointer-events:none;
}
.img-sheen:hover::after{
  transform: translateX(60%);
  opacity:.75;
}

@media (prefers-reduced-motion: reduce) {
  .img-sheen::after { transition: none; }
}

/* Cinéma */
.cinema, .chapter { will-change: transform; }
.cinema-img, .chapter-img { will-change: transform, filter; transform: translateZ(0); }
.cinema-card, .chapter-card { will-change: transform, opacity, filter; }

/* Matte + vignette + shutter (effet film) */
.cinema-media::after,
.chapter-media::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 50% 40%, rgba(255,255,255,0) 35%, rgba(2,6,23,.10) 78%, rgba(2,6,23,.22) 100%),
    linear-gradient(to bottom, rgba(255,255,255,.08), rgba(255,255,255,0) 30%, rgba(255,255,255,0) 70%, rgba(255,255,255,.10));
  pointer-events:none;
}

.shutter-top{ transform: translateY(-105%); }
.shutter-bot{ transform: translateY(105%); }
.shutter-flash{ opacity: 0; }