/* Gaya khusus Jawa Kembang Setaman. Semua gerak sekali lalu berhenti. Keadaan diam (tanpa animasi) = posisi akhir,
   jadi saat "kurangi gerakan" (bersama.css mematikan semua animasi) semua langsung tampil di tempatnya. */
/* Pembatas bawaan (truntum dan janur SVG) disembunyikan; pembatas janur watercolor dibuat TPL.isi.pembatas */
body[data-gaya="setaman"] .ib-sep svg.only-jawa,body[data-gaya="setaman"] svg.sep-janur{display:none}

/* Sampul (tetap SVG garis): kain truntum + bokor */
.cover > .cover-seni{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.cover-bokor{width:150px;height:104px;margin-bottom:6px}

/* ---------- Adegan watercolor ---------- */
.adegan .wc{display:block;max-width:none;user-select:none;-webkit-user-drag:none}
.st-kain{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.adegan svg.st-truntum{position:absolute;inset:0;opacity:.22}
.st-cahaya{position:absolute;inset:0}
.st-wadah{position:absolute;left:50%;bottom:104px;transform:translateX(-50%)}
.st-penutup .st-wadah{position:relative;left:auto;bottom:auto;transform:none}
.st-bokor{position:absolute;bottom:0;height:auto;z-index:1}
.st-isi{position:absolute;inset:0;z-index:2}
.st-tabur{position:absolute;inset:0;z-index:3}
.st-l{position:absolute;height:auto;transform-origin:50% 100%;transform:var(--tf,rotate(0deg))}
.st-bunga .st-th{position:absolute;left:0;bottom:0;width:100%;height:auto;transform-origin:50% 85%}
.st-bunga .st-kuncup,.st-bunga .st-setengah{opacity:0}
.st-pop,.st-turun,.st-jatuh{transform-origin:50% 50%}

/* Gerak adegan pembuka (.adegan.main) dan penutup (.rv.on) */
.adegan.main .st-kain{animation:fadeIn .6s ease both}
.adegan.main .st-bokor,.rv.on .st-penutup .st-bokor{animation:stBokor .8s cubic-bezier(.3,.7,.3,1) .3s both}
.adegan.main .st-naik,.rv.on .st-penutup .st-naik{animation:stNaik .9s cubic-bezier(.25,.7,.3,1) var(--t,0s) both}
.adegan.main .st-th.st-kuncup,.rv.on .st-penutup .st-th.st-kuncup{animation:stKuncup 2.2s ease-in-out calc(var(--t,0s) + .5s) both}
.adegan.main .st-th.st-setengah,.rv.on .st-penutup .st-th.st-setengah{animation:stSetengah 2.2s ease-in-out calc(var(--t,0s) + .5s) both}
.adegan.main .st-th.st-mekar,.rv.on .st-penutup .st-th.st-mekar{animation:stMekar 2.2s ease-in-out calc(var(--t,0s) + .5s) both}
.adegan.main .st-pop{animation:stPop .6s cubic-bezier(.3,1.4,.5,1) var(--t,0s) both}
.adegan.main .st-turun{animation:stTurun 1s ease var(--t,0s) both}
.rv.on .st-penutup .st-jatuh{animation:stJatuh 1.3s cubic-bezier(.3,.6,.4,1) var(--t,0s) both}
@keyframes stBokor{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes stNaik{0%{opacity:0;transform:var(--tf,rotate(0deg)) translateY(70%)}30%{opacity:1}100%{opacity:1;transform:var(--tf,rotate(0deg))}}
/* Mekar: kuncup -> setengah -> mekar, silang-pudar (tahap baru menimpa tahap lama) sambil membesar halus */
@keyframes stKuncup{0%,52%{opacity:1;transform:scale(1)}64%,100%{opacity:0;transform:scale(1.04)}}
@keyframes stSetengah{0%,28%{opacity:0;transform:scale(.92)}52%{opacity:1;transform:scale(1)}88%{opacity:1;transform:scale(1.02)}100%{opacity:0;transform:scale(1.02)}}
@keyframes stMekar{0%,64%{opacity:0;transform:scale(.94)}88%{opacity:1;transform:scale(1.03)}100%{opacity:1;transform:scale(1)}}
@keyframes stPop{0%{opacity:0;transform:var(--tf) scale(.2)}70%{opacity:1;transform:var(--tf) scale(1.12)}100%{opacity:1;transform:var(--tf) scale(1)}}
@keyframes stTurun{from{opacity:0;transform:var(--tf) translateY(-34px) rotate(-40deg)}to{opacity:1;transform:var(--tf) translateY(0) rotate(0deg)}}
@keyframes stJatuh{0%{opacity:0;transform:var(--tf) translateY(-90px) rotate(-60deg)}20%{opacity:1}100%{opacity:1;transform:var(--tf) translateY(0) rotate(0deg)}}

/* Kelopak watercolor tersebar dari bokor (lapisan #kelopak, sekali) */
.kelopak.sebar{left:50%;animation-name:sebar}
.kelopak.sebar img{display:block;height:auto}
@keyframes sebar{0%{opacity:0;transform:translate(0,0) scale(.3) rotate(0deg)}15%{opacity:1}100%{opacity:0;transform:translate(var(--dx),var(--dy)) scale(1) rotate(var(--r))}}

/* Hiasan susulan: rangkaian sudut di dua sudut bawah, ronce melati menjuntai di kiri-kanan nama */
.st-susulan{position:absolute;inset:0;pointer-events:none}
.st-sudut{position:absolute;bottom:0;width:130px}
.st-sudut img{width:100%;height:auto}
.st-sudut.kiri{left:0;transform-origin:0 100%}
.st-sudut.kiri img{transform:scaleY(-1)}
.st-sudut.kanan{right:0;transform-origin:100% 100%}
.st-sudut.kanan img{transform:scale(-1,-1)}
.st-ronce{position:absolute;top:-6px;height:250px;transform:translateX(-50%)}
.st-ronce img{height:100%;width:auto}
.st-ronce.kiri{left:38px}
.st-ronce.kanan{left:calc(100% - 38px)}
.st-susulan.gerak .st-sudut{animation:stSudut 1s ease both}
.st-susulan.gerak .st-ronce{animation:stRonce 1.4s cubic-bezier(.25,.7,.3,1) both}
.st-susulan.gerak .st-ronce.kanan{animation-delay:.15s}
@keyframes stSudut{from{opacity:0;transform:scale(.82)}to{opacity:1;transform:none}}
@keyframes stRonce{from{opacity:0;transform:translate(-50%,-100%)}25%{opacity:1}to{opacity:1;transform:translateX(-50%)}}

/* Gantal watercolor bertemu di atas "&" */
body[data-gaya="setaman"] .gantal-wrap{height:40px;margin-top:4px}
body[data-gaya="setaman"] .gantal{top:0;width:46px;height:auto}
body[data-gaya="setaman"] .gantal:not([src]){visibility:hidden}
body[data-gaya="setaman"] .gantal.kiri{margin-left:-45px}
body[data-gaya="setaman"] .gantal.kanan{margin-left:-1px}
body[data-gaya="setaman"] .panggung.main .gantal.kiri{animation:gantalKiri 1.6s cubic-bezier(.25,.7,.3,1) 2.6s both}
body[data-gaya="setaman"] .panggung.main .gantal.kanan{animation:gantalKanan 1.6s cubic-bezier(.25,.7,.3,1) 2.6s both}

/* Kantil watercolor di blok mempelai (menggantikan kantil SVG) */
.st-kt{position:relative;width:84px;height:64px}
.st-kt-i{position:absolute;bottom:0;width:34px;height:auto;transform-origin:50% 100%;transform:var(--tf)}
.st-kt-i.kiri{left:10px}
.st-kt-i.kanan{right:10px}
body[data-gaya="setaman"] .rv.on .st-kt-i{animation:stKt 1.1s ease .4s both}
body[data-gaya="setaman"] .rv.on .st-kt-i.kanan{animation-delay:.55s}
@keyframes stKt{from{opacity:0;transform:var(--tf) rotate(24deg) translateY(10px)}to{opacity:1;transform:var(--tf) rotate(0deg) translateY(0)}}

/* Penutup lama (ORN.bokor) tidak dipakai lagi: bokor penutup kini lewat TPL.isi.penutup */
body[data-gaya="setaman"] .ornamen[data-ornamen="bokor"]{display:none}
.st-penutup{margin-bottom:4px}

/* ============ ISI UNDANGAN (kait TPL.isi, keputusan CEO 2026-11-05: A + C + D + E + F) ============
   Keadaan diam = keadaan akhir, jadi saat kurangi gerakan semua tampil statis di tempatnya.
   Ukuran memakai %, clamp, dan min() agar rapi di lebar 290 sampai 412 px. */
:is(.st-kj,.st-sep,.st-tutup,.kait-latar) .wc{display:block;max-width:none;height:auto;user-select:none;-webkit-user-drag:none}

/* D. Latar berlapis di DALAM kartu (kartu Jawa bisa gelap): sapuan warna varian + motif kain samar di tepi.
   Sapuan diatur HOOK stSapuan (--st-sa, --st-sb) per varian. Paling pekat: Sogan Krem #F6E5DD-an, teks aksen #7D5F22 tetap >= 4.7:1;
   Hitam Emas dan Merah Emas teks muda tetap >= 6:1. Kartu dalam (sesi, rekening, ucapan) berlatar padat, tidak terpengaruh. */
body[data-gaya="setaman"]{--st-sa:rgba(179,38,58,.09);--st-sb:rgba(110,139,74,.12)}
body[data-gaya="setaman"] .kait-latar{top:0;bottom:0;border-radius:15px;background:
  radial-gradient(ellipse 85% 30% at var(--ax,12%) var(--ay,12%),var(--st-sa),transparent 72%),
  radial-gradient(ellipse 85% 30% at var(--bx,88%) var(--by,88%),var(--st-sb),transparent 72%)}
body[data-gaya="setaman"] [data-bagian="buka"] > .kait-latar{--ax:50%;--ay:10%;--bx:50%;--by:92%}
body[data-gaya="setaman"] [data-bagian="mempelai"] > .kait-latar{--ax:14%;--ay:16%;--bx:86%;--by:84%}
body[data-gaya="setaman"] [data-bagian="acara"] > .kait-latar{--ax:86%;--ay:8%;--bx:14%;--by:94%}
body[data-gaya="setaman"] [data-bagian="hitung"] > .kait-latar{--ax:20%;--ay:30%;--bx:80%;--by:72%}
body[data-gaya="setaman"] [data-bagian="galeri"] > .kait-latar{--ax:14%;--ay:10%;--bx:86%;--by:90%}
body[data-gaya="setaman"] [data-bagian="video"] > .kait-latar{--ax:84%;--ay:22%;--bx:16%;--by:80%}
body[data-gaya="setaman"] [data-bagian="kisah"] > .kait-latar{--ax:16%;--ay:10%;--bx:84%;--by:90%}
body[data-gaya="setaman"] [data-bagian="amplop"] > .kait-latar{--ax:86%;--ay:10%;--bx:14%;--by:92%}
body[data-gaya="setaman"] [data-bagian="rsvp"] > .kait-latar{--ax:50%;--ay:6%;--bx:50%;--by:96%}
body[data-gaya="setaman"] [data-bagian="ucapan"] > .kait-latar{--ax:14%;--ay:8%;--bx:86%;--by:94%}
body[data-gaya="setaman"] [data-bagian="tutup"] > .kait-latar{--ax:50%;--ay:22%;--bx:50%;--by:90%}
body[data-gaya="setaman"] [data-bagian="kontak"] > .kait-latar{--ax:20%;--ay:20%;--bx:80%;--by:80%}
/* Motif truntum/kawung: hanya di tepi kartu (tengah bening lewat mask), warna aksen varian */
.st-lt-motif{position:absolute;inset:0;width:100%;height:100%;opacity:.14;
  -webkit-mask-image:radial-gradient(ellipse 70% 62% at 50% 50%,transparent 55%,#000 100%);mask-image:radial-gradient(ellipse 70% 62% at 50% 50%,transparent 55%,#000 100%)}
.st-lt-isi{fill:var(--t-accent)}
/* Kelopak dan melati tabur diam di sudut kartu */
.kait-latar .st-lt-kp{position:absolute;width:clamp(12px,4.5%,17px);opacity:.6;transform:rotate(var(--r,0deg))}
.kait-latar .st-lt-kp.tb{opacity:.75}

/* A. Kuntum pengapit judul: kantil condong ke luar, mawar mekar dekat teks, melati tabur di kaki; kanan dicerminkan */
body[data-gaya="setaman"] .kait-judul{width:clamp(28px,13%,42px)}
.st-kj{position:relative;display:block;width:100%;aspect-ratio:1/1}
.st-kj .wc,.st-kj .st-bunga{position:absolute}
.st-kj-kantil{left:0;bottom:24%;width:44%;transform-origin:50% 100%;--tf:scaleX(-1) rotate(24deg);transform:var(--tf)}
.st-kj-mw{right:0;bottom:2%;width:66%;aspect-ratio:4/5}
.st-kj-tabur{left:24%;bottom:0;width:30%;--tf:rotate(30deg);transform:var(--tf)}
.kait-judul.kanan .st-kj{transform:scaleX(-1)}
body[data-gaya="setaman"] .rv.on .st-kj-kantil{animation:stKt 1s ease .2s both}
body[data-gaya="setaman"] .rv.on .kanan .st-kj-kantil{animation-delay:.35s}
body[data-gaya="setaman"] .rv.on .st-kj-mw{animation:stKjPop .7s cubic-bezier(.3,1.3,.5,1) .3s both}
body[data-gaya="setaman"] .rv.on .kanan .st-kj-mw{animation-delay:.45s}
body[data-gaya="setaman"] .rv.on .st-kj-tabur{animation:stPop .6s cubic-bezier(.3,1.4,.5,1) 1s both}
body[data-gaya="setaman"] .rv.on .st-kj .st-th.st-kuncup{animation:stKuncup 2.2s ease-in-out calc(var(--t,0s) + .5s) both}
body[data-gaya="setaman"] .rv.on .st-kj .st-th.st-setengah{animation:stSetengah 2.2s ease-in-out calc(var(--t,0s) + .5s) both}
body[data-gaya="setaman"] .rv.on .st-kj .st-th.st-mekar{animation:stMekar 2.2s ease-in-out calc(var(--t,0s) + .5s) both}
@keyframes stKjPop{from{opacity:0;transform:scale(.4)}to{opacity:1;transform:none}}

/* E. Pembatas janur: janur membentang dari tengah, kuntum muncul di tengahnya, melati tabur di kedua ujung */
.st-sep{position:relative;width:min(200px,68%);margin:0 auto}
.st-sep-janur{width:100%;transform-origin:center}
.st-sep .st-sep-tg{position:absolute;left:50%;top:50%;width:15%;transform:translate(-50%,-50%)}
.st-sep .st-sep-tg .wc{width:100%}
.st-sep .st-sep-tg.kantil{display:flex;justify-content:center;align-items:flex-end;width:18%}
.st-sep .st-sep-tg.kantil .wc{width:50%;transform-origin:50% 100%}
.st-sep .st-sep-tg.kantil .kiri{transform:scaleX(-1) rotate(12deg)}
.st-sep .st-sep-tg.kantil .kanan{transform:rotate(12deg)}
.st-sep .st-sep-tb{position:absolute;top:50%;width:8%;margin-top:-4%}
.st-sep .st-sep-tb.kiri{left:-10%;transform:rotate(-20deg)}
.st-sep .st-sep-tb.kanan{right:-10%;transform:rotate(40deg)}
body[data-gaya="setaman"] .ib-sep:not(.on) .st-sep{opacity:0}
body[data-gaya="setaman"] .ib-sep.on .st-sep-janur{animation:bentang 1.2s cubic-bezier(.3,.7,.3,1) both}
body[data-gaya="setaman"] .ib-sep.on .st-sep-tg{animation:stSepTg .8s cubic-bezier(.3,1.3,.5,1) .6s both}
body[data-gaya="setaman"] .ib-sep.on .st-sep-tb{animation:fadeIn .7s ease 1s both}
@keyframes stSepTg{from{opacity:0;transform:translate(-50%,-50%) scale(.3) rotate(-30deg)}to{opacity:1;transform:translate(-50%,-50%)}}

/* F. Penutup megah: ronce melati menjuntai dari tepi atas kartu, rangkaian sudut di bawah, bokor penuh kembang di tengah */
body[data-gaya="setaman"] .st-tutup{position:relative;display:flex;justify-content:center;margin:0 -16px 4px;padding-top:6px}
.st-tutup .st-wadah{z-index:1}
.st-tt-ronce{position:absolute;top:-32px;height:190px;z-index:0;transform-origin:50% 0;pointer-events:none}
.st-tutup .st-tt-ronce .wc{height:100%;width:auto}
.st-tt-ronce.kiri{left:4%}
.st-tt-ronce.kanan{right:4%}
.st-tutup .st-tt-ronce.kanan .wc{transform:scaleX(-1)}
.st-tt-sudut{position:absolute;bottom:0;width:clamp(68px,27%,112px);z-index:0;pointer-events:none}
.st-tutup .st-tt-sudut .wc{width:100%}
.st-tt-sudut.kiri{left:0;transform-origin:0 100%}
.st-tt-sudut.kanan{right:0;transform-origin:100% 100%}
.st-tutup .st-tt-sudut.kiri .wc{transform:scaleY(-1)}
.st-tutup .st-tt-sudut.kanan .wc{transform:scale(-1,-1)}
.st-tt-matur{margin-bottom:12px}
body[data-gaya="setaman"] .rv.on .st-tt-ronce{animation:stTtRonce 1.4s cubic-bezier(.25,.7,.3,1) .2s both}
body[data-gaya="setaman"] .rv.on .st-tt-ronce.kanan{animation-delay:.35s}
body[data-gaya="setaman"] .rv.on .st-tt-sudut{animation:stSudut 1s ease .5s both}
@keyframes stTtRonce{from{opacity:0;transform:scaleY(.15)}35%{opacity:1}to{opacity:1;transform:none}}