/* v110 — film promo beranda: layar kaca berbingkai (bilah jendela + kendali), video senyap 16:9, teks film ID/EN.
   Tanpa gaya sebaris (CSP style-src 'self'); kemajuan putar diatur lewat CSSOM oleh assets/video-promo.js. */
.video-promo{overflow:hidden;isolation:isolate}
.video-promo::before{content:"";position:absolute;z-index:-1;left:50%;top:46%;width:min(1100px,120%);aspect-ratio:2/1;transform:translate(-50%,-30%);border-radius:50%;pointer-events:none;
  background:radial-gradient(closest-side,rgba(124,58,237,.26),rgba(14,165,233,.12) 55%,transparent)}
:root[data-theme="light"] .video-promo::before{background:radial-gradient(closest-side,rgba(124,58,237,.12),rgba(14,165,233,.07) 55%,transparent)}
.video-promo .kepala-bagian{margin-bottom:clamp(28px,4vw,44px)}
.layar-film{margin:0 auto;max-width:1040px;min-width:0}
.layar-bingkai{padding:0 clamp(6px,1vw,12px) clamp(6px,1vw,12px);border-radius:clamp(20px,2.4vw,30px)}
.layar-bilah{display:flex;align-items:center;gap:10px;min-height:56px;padding:6px 4px 6px clamp(8px,1.2vw,12px)}
.layar-titik{display:flex;gap:7px;flex:none}
.layar-titik i{width:11px;height:11px;border-radius:50%;background:#FB7185}.layar-titik i:nth-child(2){background:#FBBF24}.layar-titik i:nth-child(3){background:#B6F25E}
.layar-alamat{min-width:0;margin-left:6px;padding:5px 12px;border-radius:9px;font:600 13.5px/1.2 var(--huruf);color:var(--redup);background:rgba(148,163,184,.1);border:1px solid var(--garis);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.layar-kendali{margin-left:auto;display:flex;gap:8px;flex:none}
.film-tombol{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:44px;min-height:44px;padding:0 12px;border-radius:14px;border:1px solid var(--garis-2);
  background:rgba(255,255,255,.04);color:var(--teks);font:700 13.5px/1 var(--huruf);letter-spacing:.04em;cursor:pointer;box-shadow:var(--rim);
  transition:border-color var(--t) var(--ease),background-color var(--t) var(--ease),transform var(--t) var(--ease)}
.film-tombol:hover{border-color:rgba(182,242,94,.55);background:rgba(255,255,255,.07)}
.film-tombol:active{transform:scale(.95)}
:root[data-theme="light"] .film-tombol{background:#fff}
.film-tombol svg{display:block;width:18px;height:18px;fill:currentColor}
.film-tombol .ikon-jeda,.layar-film.diputar .film-tombol .ikon-putar{display:none}
.layar-film.diputar .film-tombol .ikon-jeda{display:block}
.film-tombol[aria-pressed="true"],:root[data-theme="light"] .film-tombol[aria-pressed="true"]{color:#0B1407;background:var(--g-utama);border-color:rgba(255,255,255,.35)}
.film-tombol[aria-pressed="true"]:hover{color:#0B1407;border-color:rgba(255,255,255,.6)}
.layar-isi{position:relative;overflow:hidden;aspect-ratio:16/9;border-radius:clamp(14px,1.6vw,20px);background:#0B0F15;box-shadow:inset 0 0 0 1px rgba(255,255,255,.06)}
.film{display:block;width:100%;height:100%;object-fit:cover;background:#0B0F15}
.js .film{cursor:pointer}
.film::cue{font-family:Causten,ui-sans-serif,system-ui,sans-serif;font-weight:600;color:#F0F6FC;background:rgba(11,15,21,.78);line-height:1.35}
/* tanda putar besar saat berhenti (hiasan; kendali sebenarnya tombol di bilah) */
.film-tanda{position:absolute;left:50%;top:77%;width:clamp(56px,9vw,84px);aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;display:grid;place-items:center;pointer-events:none;
  background:var(--g-utama);box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 14px 36px -10px rgba(163,230,53,.8),0 0 0 8px rgba(182,242,94,.14);transition:opacity .25s var(--ease),transform .25s var(--ease)}
.film-tanda svg{width:38%;height:38%;margin-left:8%;fill:#0B1407}
.layar-film.diputar .film-tanda,.layar-film.memuat .film-tanda{opacity:0;transform:translate(-50%,-50%) scale(.85)}
.film-kemajuan{position:absolute;left:0;right:0;bottom:0;height:3px;background:rgba(148,163,184,.18);pointer-events:none}
.film-kemajuan i{position:absolute;inset:0;transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,var(--lime),var(--sian))}
.layar-film figcaption{margin-top:14px;text-align:center;font-size:14.5px;color:var(--redup)}
/* bagikan: glif per platform tanpa JS (iOS/desktop = kotak + panah, Android = tiga simpul); tanda centang sesudah tautan disalin */
.film-bagi .g-and,.film-bagi .g-ok,.film-bagi.tersalin .g-ios,.film-bagi.tersalin .g-and{display:none}
.film-bagi.tersalin .g-ok{display:block}
.film-bagi svg{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
@media (pointer:coarse){@supports not (-webkit-touch-callout:none){.film-bagi:not(.tersalin) .g-ios{display:none}.film-bagi:not(.tersalin) .g-and{display:block}.film-tombol{border-radius:12px}}}
.sr-film{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media (max-width:480px){.layar-alamat{display:none}.layar-bilah{min-height:52px}}
@media (prefers-reduced-motion:reduce){.film-tanda,.film-tombol{transition:none}}