/* Disket Mono Bold, Mariano Diez. */
@font-face {
  font-family: "Disket Mono";
  src: url("assets/fonts/DisketMono-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* Cantos cortados: --cut controla o tamanho do corte (a "orelha" do fennec) */
.cut-tl { clip-path: polygon(var(--cut,40px) 0, 100% 0, 100% 100%, 0 100%, 0 var(--cut,40px)); }
.cut-banner { --cut: 80px;
  clip-path: polygon(var(--cut) 0, 100% 0, 100% calc(100% - var(--cut)), calc(100% - var(--cut)) 100%, 0 100%, 0 var(--cut)); }
@media (max-width: 640px) { .cut-banner { --cut: 40px; } .cut-tl { --cut: 28px; } }

html { scroll-behavior: smooth; scroll-padding-top: 16px; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { -webkit-tap-highlight-color: transparent; overflow-wrap: break-word; }
a, button, input { touch-action: manipulation; }
img { height: auto; }
a { transition: color .15s; }
a:hover { color: #b84300; }
:focus-visible { outline: 3px solid #1e1e1e; outline-offset: 3px; }

/* Entrada ao rolar: só esconde se o JS rodou; transform e opacity apenas */
.js .rv { opacity: 0; transform: translateY(24px);
  transition: opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1); transition-delay: var(--d, 0ms); }
.js .rv.in { opacity: 1; transform: none; }

/* Troca de matéria: a nova entra suavemente */
.swap { animation: swap .45s cubic-bezier(.2,.7,.2,1); }
@keyframes swap { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .js .rv { opacity: 1; transform: none; transition: none; }
  .swap { animation: none; }
  * { transition-duration: .01ms !important; }
}

/* Carrossel de capas: as bordas somem num degradê */
.poster-rail { -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); }