.trailer-card{position:relative;aspect-ratio:16 / 9;border-radius:28px;overflow:hidden;isolation:isolate;background:#08040b;border:1px solid var(--line);box-shadow:0 40px 120px -40px rgba(var(--glow),0.55),0 0 0 1px rgba(255,255,255,0.03) inset}.trailer-card::before{content:"";position:absolute;inset:-1px;z-index:3;border-radius:inherit;padding:1.5px;background:conic-gradient(from var(--angle),transparent 0 70%,rgba(var(--glow),0.95) 82%,rgba(var(--glow-2),0.9) 90%,transparent 100%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);animation:trailer-frame 7s linear infinite;pointer-events:none}@keyframes trailer-frame{to{--angle: 360deg}}.trailer-card .hud{z-index:4}.trailer-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#08040b}.trailer-cover{position:absolute;inset:0;z-index:2;display:grid;place-items:center;background:radial-gradient(60% 70% at 50% 50%,rgba(13,6,18,0.05),rgba(13,6,18,0.55)),linear-gradient(180deg,transparent 60%,rgba(13,6,18,0.75));transition:opacity 0.45s ease,visibility 0.45s}.trailer-card.is-playing .trailer-cover{opacity:0;visibility:hidden}.trailer-play{position:relative;display:grid;place-items:center;width:clamp(76px,9vw,112px);height:clamp(76px,9vw,112px);border:0;border-radius:50%;color:#fff;cursor:pointer;background:linear-gradient(135deg,var(--pink),var(--violet));box-shadow:0 18px 50px -12px rgba(var(--glow),0.95),inset 0 1px 0 rgba(255,255,255,0.35);transition:transform 0.25s cubic-bezier(0.2,0.9,0.3,1.3),box-shadow 0.25s ease}.trailer-play:hover{transform:scale(1.07);box-shadow:0 22px 60px -10px rgba(var(--glow),1),inset 0 1px 0 rgba(255,255,255,0.4)}.trailer-play:active{transform:scale(0.96)}.trailer-play:focus-visible{outline:3px solid var(--pink-3);outline-offset:6px}.trailer-play svg{width:38%;height:38%;margin-left:8%;fill:currentColor;filter:drop-shadow(0 2px 6px rgba(0,0,0,0.35))}.trailer-ring{position:absolute;inset:-14px;border-radius:50%;border:2px dashed rgba(255,209,236,0.7);animation:trailer-ring 12s linear infinite;pointer-events:none}@keyframes trailer-ring{to{transform:rotate(360deg)}}.trailer-cover-text{position:absolute;left:clamp(18px,3vw,34px);bottom:clamp(14px,2.6vw,28px);margin:0;text-align:left;font-size:clamp(0.95rem,1.5vw,1.15rem);color:var(--muted)}.trailer-cover-text b{display:block;font-size:clamp(1.15rem,2.2vw,1.6rem);font-weight:800;color:var(--text)}.trailer-card.is-ended .trailer-cover{opacity:1;visibility:visible}.trailer-note{position:absolute;inset:auto 0 1.2rem;z-index:5;margin:0;text-align:center;color:var(--pink-3);font-weight:600}.btn-trailer{padding-left:0.55rem}.trailer-thumb{position:relative;flex:none;width:38px;height:38px;border-radius:50%;background:url(../assets/trailer/v1/poster-thumb.webp?v=2) center / cover;box-shadow:0 0 0 2px rgba(var(--glow),0.8),0 0 18px -2px rgba(var(--glow),0.9)}.trailer-thumb::after{content:"";position:absolute;left:50%;top:50%;width:0;height:0;margin:-7px 0 0 -4px;border-style:solid;border-width:7px 0 7px 12px;border-color:transparent transparent transparent #fff;filter:drop-shadow(0 1px 3px rgba(0,0,0,0.6))}.btn-trailer:hover .trailer-thumb{box-shadow:0 0 0 2px var(--pink-3),0 0 24px 0 rgba(var(--glow),1)}@media(max-width:640px){.trailer-card{border-radius:18px}.trailer-cover-text{display:none}}@media(prefers-reduced-motion:reduce){.trailer-card::before,.trailer-ring{animation:none}}